/* Custom stiller ve font tanımı */
        html.gp-tab-hidden * {
            animation-play-state: paused !important;
        }
        .gp-offscreen-paused,
        .gp-offscreen-paused *,
        .gp-perf-offscreen,
        .gp-perf-offscreen * {
            animation-play-state: paused !important;
        }
        .gp-offscreen-paused,
        .gp-offscreen-paused *,
        .gp-perf-offscreen,
        .gp-perf-offscreen * {
            will-change: auto !important;
        }
        #header,
        #gp-piyasa-hub,
        #ai-chat {
            content-visibility: visible;
        }
        .touch-manipulation,
        button,
        a.auth-trigger,
        .gp-see-all-btn {
            touch-action: manipulation;
        }
        .animate-scan {
            will-change: transform;
        }
        @keyframes scan {
            0% { transform: translate3d(0, -200%, 0); }
            100% { transform: translate3d(0, 400%, 0); }
        }

        /* Hub list modals — viewport-safe (body portaled) */
        #gs-skor-modal,
        #gc-checklist-modal,
        #ga-arena-modal,
        #ak-tests-modal,
        #kn-tools-modal,
        #ai-full-modal,
        #gp-pv-market-modal,
        #oy-games-modal-wrapper {
            content-visibility: visible;
            padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
            box-sizing: border-box;
        }
        #gs-skor-modal:not(.is-open),
        #gc-checklist-modal:not(.is-open),
        #ga-arena-modal:not(.is-open),
        #ak-tests-modal:not(.is-open),
        #kn-tools-modal:not(.active),
        #oy-games-modal-wrapper:not(.active),
        #gp-pv-market-modal:not(.gp-app-modal--open) {
            content-visibility: hidden;
        }
        #kn-tools-modal:not(.active),
        #oy-games-modal-wrapper:not(.active) {
            -webkit-backdrop-filter: none !important;
            backdrop-filter: none !important;
            will-change: auto !important;
            pointer-events: none !important;
        }
        #gs-skor-modal .gs-modal-container,
        #gc-checklist-modal .gc-modal-container,
        #ga-arena-modal .ga-modal-container,
        #ak-tests-modal .ak-modal-container,
        #kn-tools-modal .gp-modal-container,
        #oy-games-modal-wrapper .gp-modal-container {
            max-height: min(88dvh, calc(100dvh - 24px));
            min-height: 0;
        }
        #gs-skor-modal .gs-modal-body,
        #gc-checklist-modal .gc-modal-body,
        #ga-arena-modal .ga-modal-body,
        #ak-tests-modal .ak-modal-body,
        #kn-tools-modal .gp-modal-body,
        #oy-games-modal-wrapper .oy-modal-body {
            flex: 1 1 auto;
            min-height: 0;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
        }
        #ai-full-modal #ai-modal-panel {
            height: auto !important;
            max-height: min(88dvh, calc(100dvh - 2rem));
            min-height: 0;
        }
        #ai-full-modal .ai-modal-scroll {
            min-height: 0;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
        }
        @media (max-width: 768px) {
            #gs-skor-modal,
            #gc-checklist-modal,
            #ga-arena-modal,
            #ak-tests-modal,
            #kn-tools-modal,
            #ai-full-modal,
            #gp-pv-market-modal,
            #oy-games-modal-wrapper {
                padding: max(8px, env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-right, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
            }
            #gs-skor-modal .gs-modal-container,
            #gc-checklist-modal .gc-modal-container,
            #ga-arena-modal .ga-modal-container,
            #ak-tests-modal .ak-modal-container,
            #kn-tools-modal .gp-modal-container,
            #oy-games-modal-wrapper .gp-modal-container {
                max-height: min(92dvh, calc(100dvh - 16px));
                border-radius: 20px;
            }
            #gs-skor-modal .gs-modal-grid {
                grid-template-columns: 1fr;
            }
            #kn-tools-modal .gp-tools-grid {
                grid-template-columns: 1fr;
            }
            #ai-full-modal #ai-modal-panel {
                max-height: min(92dvh, calc(100dvh - 1rem));
                border-radius: 1.25rem;
            }
        }

        :root{
            --phi: 1.618;

            /* Layout */
            --gutter: clamp(1rem, 3vw, 2rem);
            --section-pad: clamp(3rem, 5vw, 6.25rem);
            --section-gap: clamp(1.75rem, 3vw, 3rem);

            /* Radii + shadow */
            --r: 1.25rem;
            --r-lg: calc(var(--r) * var(--phi));
            --shadow-soft: 0 12px 40px rgba(17, 24, 39, 0.10);

            /* Type scale (fluid) */
            --fs-base: clamp(0.98rem, 0.25vw + 0.94rem, 1.08rem);
            --fs-lead: clamp(1.05rem, 0.35vw + 0.95rem, 1.25rem);
            --fs-h2: clamp(1.8rem, 1.2vw + 1.35rem, 2.65rem);
            --fs-h3: clamp(1.12rem, 0.6vw + 1.02rem, 1.4rem);
        }

        /* Sayfayı varsayılan olarak tarayıcı %80 zoom hissinde ölçekler */
        :root{ --ui-zoom: 0.8; }
        html { font-size: calc(16px * var(--ui-zoom)); }
        body {
            font-family: 'Inter', sans-serif;
            background-color: #ffffff;
            font-size: var(--fs-base);
            line-height: 1.58;
            text-rendering: geometricPrecision;
        }

        /* Anchor scroll — sabit header için bölüm hizası */
        :root {
            --gp-scroll-offset: 5.75rem;
        }
        html {
            scroll-padding-top: var(--gp-scroll-offset);
        }
        main > section[id] {
            scroll-margin-top: var(--gp-scroll-offset);
        }
        html.gp-anchor-lock main > section[id] {
            content-visibility: visible !important;
            contain-intrinsic-size: auto none !important;
        }

        /* Golden ratio helpers */
        .phi-section { padding-block: var(--section-pad); background-color: #ffffff; }
        .phi-header { margin-bottom: var(--section-gap); }
        .phi-h2 { font-size: var(--fs-h2); line-height: 1.12; letter-spacing: -0.02em; }
        .phi-h3 { font-size: var(--fs-h3); line-height: 1.2; letter-spacing: -0.01em; }
        .phi-lead { font-size: var(--fs-lead); line-height: 1.62; max-width: 42rem; }

        .phi-hero-img { height: clamp(14rem, 22vw, 24rem); width: auto; margin-bottom: clamp(1.1rem, 1.8vw, 1.75rem); }
        .phi-card { border-radius: var(--r-lg); box-shadow: var(--shadow-soft); }
        .phi-iframe { min-height: clamp(520px, 78vh, 760px); }

        /* === Scroll Reveal — scroll-triggered geçişler === */
        :root {
            --gp-reveal-duration: 0.88s;
            --gp-reveal-duration-img: 1.05s;
            --gp-reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
            --gp-reveal-distance: 1.65rem;
            --gp-reveal-stagger: 90ms;
        }
        .gp-reveal {
            opacity: 0;
            transition:
                opacity var(--gp-reveal-duration) var(--gp-reveal-ease),
                transform var(--gp-reveal-duration) var(--gp-reveal-ease),
                filter var(--gp-reveal-duration-img) var(--gp-reveal-ease),
                clip-path var(--gp-reveal-duration-img) var(--gp-reveal-ease);
            transition-delay: var(--gp-reveal-delay, 0ms);
        }
        .gp-reveal--up    { transform: translate3d(0, var(--gp-reveal-distance), 0); }
        .gp-reveal--down  { transform: translate3d(0, calc(var(--gp-reveal-distance) * -1), 0); }
        .gp-reveal--left  { transform: translate3d(calc(var(--gp-reveal-distance) * -1), 0, 0); }
        .gp-reveal--right { transform: translate3d(var(--gp-reveal-distance), 0, 0); }
        .gp-reveal--scale { transform: scale(0.94); }
        .gp-reveal--blur  { transform: scale(1.035); filter: blur(9px); }
        .gp-reveal--mask  { clip-path: inset(5% 4% 7% 4% round 10px); }
        .gp-reveal--img {
            transition-duration: var(--gp-reveal-duration-img), var(--gp-reveal-duration-img), var(--gp-reveal-duration-img), var(--gp-reveal-duration-img);
        }
        .gp-reveal.is-visible {
            opacity: 1;
            transform: none;
            filter: none;
            clip-path: inset(0 0 0 0 round 0);
        }
        .gp-reveal.is-visible.gp-reveal--done { will-change: auto; }
        @media (prefers-reduced-motion: reduce) {
            .gp-reveal {
                opacity: 1 !important;
                transform: none !important;
                filter: none !important;
                clip-path: none !important;
                transition: none !important;
            }
        }
        @media (max-width: 768px) {
            html.gp-reveal-static .gp-reveal,
            .gp-reveal {
                opacity: 1 !important;
                transform: none !important;
                filter: none !important;
                clip-path: none !important;
                transition: none !important;
            }
        }

        /* AI Chat — başlat ekranı & panel */
        .gp-chat-shell {
            position: relative;
            border-radius: 1.25rem;
        }
        .gp-chat-launcher {
            position: relative;
            overflow: hidden;
            min-height: clamp(320px, 52vh, 520px);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: clamp(2rem, 5vw, 3.5rem) clamp(1.25rem, 4vw, 2.5rem);
            border-radius: 1.25rem;
            border: 1px solid rgba(0, 138, 249, 0.14);
            background:
                radial-gradient(ellipse 80% 60% at 50% 0%, rgba(0, 138, 249, 0.09), transparent 70%),
                radial-gradient(ellipse 50% 40% at 100% 100%, rgba(92, 180, 252, 0.08), transparent 60%),
                linear-gradient(165deg, #ffffff 0%, #f8fbff 48%, #f1f7fe 100%);
            box-shadow:
                0 4px 24px -8px rgba(0, 138, 249, 0.12),
                0 20px 48px -24px rgba(15, 23, 42, 0.1);
            transition: opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1), transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .gp-chat-launcher::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(0, 138, 249, 0.04) 1px, transparent 1px),
                linear-gradient(90deg, rgba(0, 138, 249, 0.04) 1px, transparent 1px);
            background-size: 28px 28px;
            mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%);
            pointer-events: none;
        }
        .gp-chat-shell.is-live .gp-chat-launcher {
            opacity: 0;
            transform: scale(0.97);
            pointer-events: none;
            position: absolute;
            inset: 0;
            z-index: 0;
        }
        .gp-chat-launcher__inner {
            position: relative;
            z-index: 1;
            max-width: 28rem;
            text-align: center;
        }
        .gp-chat-launcher__icon {
            width: clamp(4.5rem, 12vw, 5.5rem);
            height: clamp(4.5rem, 12vw, 5.5rem);
            margin: 0 auto 1.35rem;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 1.5rem;
            background: linear-gradient(145deg, rgba(0, 138, 249, 0.14), rgba(0, 138, 249, 0.04));
            border: 1px solid rgba(0, 138, 249, 0.22);
            box-shadow: 0 12px 32px -12px rgba(0, 138, 249, 0.35);
            color: #008af9;
            font-size: clamp(1.75rem, 4vw, 2.25rem);
            animation: gp-chat-icon-pulse 3s ease-in-out infinite;
        }
        @keyframes gp-chat-icon-pulse {
            0%, 100% { box-shadow: 0 12px 32px -12px rgba(0, 138, 249, 0.35); transform: scale(1); }
            50% { box-shadow: 0 16px 40px -8px rgba(0, 138, 249, 0.45); transform: scale(1.03); }
        }
        .gp-chat-launcher__title {
            margin: 0 0 0.5rem;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: clamp(1.35rem, 3vw, 1.65rem);
            font-weight: 400;
            letter-spacing: -0.02em;
            color: #0c1222;
        }
        .gp-chat-launcher__lead {
            margin: 0 0 1.75rem;
            font-size: clamp(0.9rem, 2vw, 1rem);
            line-height: 1.55;
            color: #64748b;
        }
        .gp-chat-launcher__btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.65rem;
            min-height: 3.25rem;
            padding: 0.85rem 2rem;
            border: none;
            border-radius: 999px;
            font-family: inherit;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: 0.01em;
            color: #fff;
            cursor: pointer;
            background: linear-gradient(135deg, #008af9 0%, #0073d1 55%, #0066bd 100%);
            box-shadow:
                0 10px 30px -6px rgba(0, 138, 249, 0.5),
                0 0 0 1px rgba(255, 255, 255, 0.12) inset;
            transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
        }
        .gp-chat-launcher__btn:hover {
            transform: translateY(-2px) scale(1.02);
            box-shadow:
                0 14px 36px -4px rgba(0, 138, 249, 0.55),
                0 0 0 1px rgba(255, 255, 255, 0.15) inset;
            filter: brightness(1.04);
        }
        .gp-chat-launcher__btn:active {
            transform: translateY(0) scale(0.98);
        }
        .gp-chat-launcher__btn:focus-visible {
            outline: 2px solid #008af9;
            outline-offset: 3px;
        }
        .gp-chat-launcher__btn svg {
            width: 1.15rem;
            height: 1.15rem;
            flex-shrink: 0;
        }
        .gp-chat-launcher__btn[aria-busy="true"] {
            pointer-events: none;
            opacity: 0.88;
        }
        .gp-chat-launcher__hint {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 0.5rem 1rem;
            margin-top: 1.25rem;
            font-size: 0.75rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: #94a3b8;
        }
        .gp-chat-launcher__hint span {
            display: inline-flex;
            align-items: center;
            gap: 0.35rem;
        }
        .gp-chat-launcher__hint i {
            font-size: 0.65rem;
            color: #008af9;
        }
        .gp-chat-panel {
            display: none;
            opacity: 0;
            transform: translateY(12px) scale(0.985);
            transition:
                opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.55s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.55s ease;
            border-radius: 1.25rem;
            overflow: hidden;
            border: 1px solid rgba(0, 138, 249, 0.12);
            background: #fff;
            box-shadow: 0 4px 20px -10px rgba(15, 23, 42, 0.12);
        }
        .gp-chat-shell.is-live .gp-chat-panel {
            display: block;
        }
        .gp-chat-panel.is-visible {
            opacity: 1;
            transform: translateY(0) scale(1);
            border-color: rgba(0, 138, 249, 0.22);
            box-shadow:
                0 0 0 4px rgba(0, 138, 249, 0.1),
                0 25px 50px -12px rgba(0, 138, 249, 0.18),
                0 20px 40px -20px rgba(15, 23, 42, 0.12);
        }
        .gp-chat-panel__frame-wrap {
            background: #f8fafc;
        }
        @media (prefers-reduced-motion: reduce) {
            .gp-chat-launcher__icon { animation: none; }
            .gp-chat-launcher,
            .gp-chat-panel { transition-duration: 0.15s; }
        }

        /* AI Chat — yerel sohbet arayüzü (gpx) */
        /* Masaüstünde tüm konteyner genişliğine yayılmasın; ideal okuma genişliğinde ortalansın */
        #gp-chat-shell {
            max-width: min(860px, 100%);
            margin-inline: auto;
        }
        /* Yazı kutusu odaktayken alttaki sabit dock menü zarifçe aşağı kayar;
           böylece chat hiçbir sabit katmanın üzerine binmeden yazım alanı açık kalır.
           (Tıklama kalkanı ile birlikte çalışır; dock'un diğer davranışları değişmez.) */
        .mobile-nav {
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
        }
        body.gpx-chat-typing .mobile-nav {
            transform: translate(-50%, 180%);
            opacity: 0;
            pointer-events: none;
        }
        #gp-chat-panel {
            scroll-margin-block: 5rem 7rem;
        }
        .gpx-chat {
            display: flex;
            flex-direction: column;
            height: clamp(560px, 78vh, 780px);
            background: #fff;
            font-family: "DM Sans", system-ui, sans-serif;
        }
        .gpx-chat__header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            padding: 0.9rem clamp(1rem, 2.5vw, 1.5rem);
            border-bottom: 1px solid rgba(12, 18, 34, 0.07);
            background: #fff;
            flex-shrink: 0;
        }
        .gpx-chat__brand {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            min-width: 0;
        }
        .gpx-chat__avatar {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 2.65rem;
            height: 2.65rem;
            flex-shrink: 0;
            border-radius: 0.9rem;
            color: #fff;
            background: linear-gradient(135deg, #008af9 0%, #0073d1 100%);
            box-shadow: 0 6px 16px -6px rgba(0, 138, 249, 0.55);
        }
        .gpx-chat__avatar svg { width: 1.35rem; height: 1.35rem; }
        .gpx-chat__brand-text { min-width: 0; }
        .gpx-chat__title {
            margin: 0;
            font-size: 0.95rem;
            font-weight: 700;
            color: #0c1222;
            letter-spacing: -0.01em;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .gpx-chat__status {
            margin: 0.1rem 0 0;
            display: flex;
            align-items: center;
            gap: 0.35rem;
            font-size: 0.72rem;
            font-weight: 600;
            color: #64748b;
        }
        .gpx-chat__status-dot {
            width: 0.45rem;
            height: 0.45rem;
            border-radius: 50%;
            background: #22c55e;
            box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
            animation: gpx-status-pulse 2.4s ease-in-out infinite;
        }
        @keyframes gpx-status-pulse {
            0%, 100% { box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18); }
            50% { box-shadow: 0 0 0 5px rgba(34, 197, 94, 0.08); }
        }
        .gpx-chat__reset {
            display: inline-flex;
            align-items: center;
            gap: 0.45rem;
            padding: 0.5rem 0.95rem;
            border: 1px solid rgba(12, 18, 34, 0.1);
            border-radius: 999px;
            background: #fff;
            font-family: inherit;
            font-size: 0.8rem;
            font-weight: 600;
            color: #475569;
            cursor: pointer;
            white-space: nowrap;
            transition: border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
        }
        .gpx-chat__reset:hover {
            border-color: rgba(0, 138, 249, 0.35);
            color: #008af9;
            box-shadow: 0 4px 12px -6px rgba(0, 138, 249, 0.3);
        }
        .gpx-chat__reset:focus-visible { outline: 2px solid #008af9; outline-offset: 2px; }
        .gpx-chat__reset svg { width: 0.85rem; height: 0.85rem; flex-shrink: 0; }
        .gpx-chat__body {
            flex: 1;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            display: flex;
            flex-direction: column;
            gap: 0.85rem;
            padding: clamp(1rem, 2.5vw, 1.5rem);
            background:
                radial-gradient(ellipse 70% 50% at 50% 0%, rgba(0, 138, 249, 0.05), transparent 70%),
                linear-gradient(180deg, #f8fbff 0%, #f4f9ff 100%);
            scrollbar-width: thin;
            scrollbar-color: rgba(0, 138, 249, 0.25) transparent;
        }
        .gpx-chat__welcome {
            margin: auto;
            max-width: 34rem;
            text-align: center;
            padding: 1rem 0.5rem;
        }
        .gpx-chat__welcome-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 3.5rem;
            height: 3.5rem;
            margin: 0 auto 1.1rem;
            border-radius: 50%;
            color: #008af9;
            background: rgba(0, 138, 249, 0.1);
            border: 1px solid rgba(0, 138, 249, 0.18);
        }
        .gpx-chat__welcome-icon svg { width: 1.5rem; height: 1.5rem; }
        .gpx-chat__welcome-title {
            margin: 0 0 0.45rem;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: clamp(1.4rem, 3.2vw, 1.8rem);
            font-weight: 400;
            letter-spacing: -0.02em;
            color: #0c1222;
        }
        .gpx-chat__welcome-lead {
            margin: 0 0 1.5rem;
            font-size: 0.9rem;
            line-height: 1.55;
            color: #64748b;
        }
        .gpx-chat__suggestions {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0.7rem;
        }
        .gpx-chat__suggestion {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 0.6rem;
            padding: 0.9rem;
            border: 1px solid rgba(12, 18, 34, 0.08);
            border-radius: 0.9rem;
            background: #fff;
            font-family: inherit;
            font-size: 0.8rem;
            font-weight: 600;
            line-height: 1.4;
            text-align: left;
            color: #334155;
            cursor: pointer;
            box-shadow: 0 2px 8px -4px rgba(15, 23, 42, 0.08);
            transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
        }
        .gpx-chat__suggestion:hover {
            transform: translateY(-2px);
            border-color: rgba(0, 138, 249, 0.35);
            box-shadow: 0 8px 20px -8px rgba(0, 138, 249, 0.3);
        }
        .gpx-chat__suggestion:focus-visible { outline: 2px solid #008af9; outline-offset: 2px; }
        .gpx-chat__suggestion-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 1.9rem;
            height: 1.9rem;
            border-radius: 0.55rem;
            color: #008af9;
            background: rgba(0, 138, 249, 0.1);
        }
        .gpx-chat__suggestion-icon svg { width: 1rem; height: 1rem; }
        .gpx-chat__msg {
            max-width: min(78%, 34rem);
            padding: 0.75rem 1rem;
            border-radius: 1.1rem;
            font-size: 0.9rem;
            line-height: 1.6;
            overflow-wrap: break-word;
            animation: gpx-msg-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
        }
        @keyframes gpx-msg-in {
            from { opacity: 0; transform: translateY(8px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .gpx-chat__msg--user {
            align-self: flex-end;
            color: #fff;
            background: linear-gradient(135deg, #008af9 0%, #0073d1 100%);
            border-bottom-right-radius: 0.35rem;
            box-shadow: 0 6px 16px -8px rgba(0, 138, 249, 0.5);
        }
        .gpx-chat__msg--bot {
            align-self: flex-start;
            color: #1e293b;
            background: #fff;
            border: 1px solid rgba(12, 18, 34, 0.07);
            border-bottom-left-radius: 0.35rem;
            box-shadow: 0 2px 10px -6px rgba(15, 23, 42, 0.12);
        }
        .gpx-chat__msg--bot strong { color: #0c1222; }
        .gpx-chat__msg--error {
            border-color: rgba(239, 68, 68, 0.25);
            background: #fef2f2;
            color: #991b1b;
        }
        .gpx-chat__typing {
            align-self: flex-start;
            display: flex;
            align-items: center;
            gap: 0.3rem;
            padding: 0.8rem 1rem;
            border-radius: 1.1rem;
            border-bottom-left-radius: 0.35rem;
            background: #fff;
            border: 1px solid rgba(12, 18, 34, 0.07);
            box-shadow: 0 2px 10px -6px rgba(15, 23, 42, 0.12);
        }
        .gpx-chat__typing[hidden] { display: none; }
        .gpx-chat__typing-dot {
            width: 0.42rem;
            height: 0.42rem;
            border-radius: 50%;
            background: #008af9;
            opacity: 0.4;
            animation: gpx-typing-bounce 1.2s ease-in-out infinite;
        }
        .gpx-chat__typing-dot:nth-child(2) { animation-delay: 0.15s; }
        .gpx-chat__typing-dot:nth-child(3) { animation-delay: 0.3s; }
        @keyframes gpx-typing-bounce {
            0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
            30% { transform: translateY(-4px); opacity: 1; }
        }
        .gpx-chat__composer {
            flex-shrink: 0;
            padding: 0.85rem clamp(1rem, 2.5vw, 1.5rem) 0.75rem;
            border-top: 1px solid rgba(12, 18, 34, 0.07);
            background: #fff;
        }
        .gpx-chat__input-row {
            display: flex;
            align-items: center;
            gap: 0.6rem;
        }
        .gpx-chat__input {
            flex: 1;
            min-width: 0;
            min-height: 2.9rem;
            padding: 0.7rem 1.15rem;
            border: 1px solid rgba(12, 18, 34, 0.12);
            border-radius: 999px;
            background: #f8fafc;
            font-family: inherit;
            font-size: 0.9rem;
            color: #0c1222;
            transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
        }
        .gpx-chat__input::placeholder { color: #94a3b8; }
        .gpx-chat__input:focus {
            outline: none;
            background: #fff;
            border-color: rgba(0, 138, 249, 0.45);
            box-shadow: 0 0 0 3px rgba(0, 138, 249, 0.12);
        }
        .gpx-chat__send {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 2.9rem;
            height: 2.9rem;
            flex-shrink: 0;
            border: none;
            border-radius: 50%;
            color: #fff;
            background: linear-gradient(135deg, #008af9 0%, #0073d1 100%);
            box-shadow: 0 8px 18px -8px rgba(0, 138, 249, 0.6);
            cursor: pointer;
            transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
        }
        .gpx-chat__send:hover { transform: translateY(-1px) scale(1.04); }
        .gpx-chat__send:active { transform: scale(0.95); }
        .gpx-chat__send:focus-visible { outline: 2px solid #008af9; outline-offset: 2px; }
        .gpx-chat__send:disabled { opacity: 0.55; cursor: not-allowed; transform: none; }
        .gpx-chat__send svg { width: 1.1rem; height: 1.1rem; margin-left: -1px; }
        .gpx-chat__disclaimer {
            margin: 0.6rem 0 0;
            text-align: center;
            font-size: 0.68rem;
            font-weight: 500;
            color: #94a3b8;
        }
        @media (max-width: 640px) {
            .gpx-chat { height: clamp(500px, 74vh, 680px); }
            .gpx-chat__suggestions { grid-template-columns: 1fr; }
            .gpx-chat__suggestion { flex-direction: row; align-items: center; }
            .gpx-chat__reset span { display: none; }
            .gpx-chat__msg { max-width: 88%; }
        }
        @media (prefers-reduced-motion: reduce) {
            .gpx-chat__status-dot,
            .gpx-chat__typing-dot { animation: none; }
            .gpx-chat__msg { animation-duration: 0.01s; }
        }

        /* Marka Rengi Tanımlamaları */
        .bg-brand { background-color: #008af9; }
        .text-brand { color: #008af9; }
        .border-brand { border-color: #008af9; }
        .hover\:bg-brand-dark:hover { background-color: #0073d1; }
        .hover\:border-brand:hover { border-color: #008af9; }
        .hover\:text-brand:hover { color: #008af9; }
        .bg-brand-light { background-color: rgba(0, 138, 249, 0.1); }
        .focus\:ring-brand:focus { --tw-ring-color: #008af9; }
        
        /* Mobil ve Masaüstü Menü Görünürlük Kontrolü */
        #desktop-menu-container { display: none; }
        #mobile-menu-button { display: inline-flex; }

        /* ── Site Header (modern floating bar) ── */
        #header {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 50;
            padding: 12px clamp(12px, 2.5vw, 28px) 0;
            background: transparent;
            box-shadow: none;
            pointer-events: none;
        }
        #header .site-header__shell,
        #header .site-header__bar,
        #header #mobile-menu {
            pointer-events: auto;
        }
        #header .site-header__bar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            min-height: 64px;
            padding: 8px 10px 8px 22px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.9);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            border: 1px solid rgba(0, 138, 249, 0.12);
            box-shadow:
                0 10px 40px -14px rgba(0, 138, 249, 0.22),
                0 4px 16px -6px rgba(15, 23, 42, 0.08);
        }
        #header .site-header__logo {
            display: inline-flex;
            align-items: center;
            font-size: 1.35rem;
            font-family: "Instrument Serif", Georgia, serif;
            font-weight: 400;
            letter-spacing: 0;
            color: #0c1222;
            white-space: nowrap;
            transition: opacity 0.2s ease;
        }
        #header .site-header__logo:hover { opacity: 0.88; }
        #header .site-header__logo span {
            font-family: "Instrument Serif", Georgia, serif;
            font-style: italic;
            font-weight: 400;
            letter-spacing: 0;
            background: linear-gradient(120deg, #008af9 8%, #5cb4fc 92%);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            -webkit-text-fill-color: transparent;
        }
        #header #desktop-menu-container {
            align-items: center;
            gap: 10px;
        }
        #header .site-header__nav {
            display: flex;
            align-items: center;
            gap: 2px;
            padding: 4px;
            border-radius: 999px;
            background: rgba(241, 245, 249, 0.85);
            border: 1px solid rgba(0, 138, 249, 0.06);
        }
        #header .site-header__link {
            display: inline-flex;
            align-items: center;
            padding: 8px 14px;
            border-radius: 999px;
            font-size: 0.8125rem;
            font-weight: 600;
            color: #64748b;
            border: none;
            background: transparent;
            font-family: inherit;
            transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
        }
        #header .site-header__link:hover {
            color: #008af9;
            background: rgba(255, 255, 255, 0.95);
            box-shadow: 0 2px 8px -2px rgba(0, 138, 249, 0.18);
        }
        #header .site-header__nav-item {
            position: relative;
        }
        /* Tetikleyici ile panel arasındaki boşlukta hover kopmasın */
        #header .site-header__nav-item--dropdown::after {
            content: '';
            position: absolute;
            left: 50%;
            top: 100%;
            transform: translateX(-50%);
            width: max(100%, 22rem);
            height: 18px;
            pointer-events: auto;
        }
        #header .site-header__nav-item--dropdown .site-header__link--trigger {
            gap: 0.35rem;
            cursor: pointer;
        }
        #header .site-header__nav-item--dropdown .site-header__link--trigger svg {
            width: 0.75rem;
            height: 0.75rem;
            opacity: 0.65;
            transition: transform 0.2s ease;
        }
        #header .site-header__nav-item--dropdown:hover .site-header__link--trigger svg,
        #header .site-header__nav-item--dropdown:focus-within .site-header__link--trigger svg {
            transform: rotate(180deg);
        }
        #header .site-header__dropdown::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: -16px;
            height: 16px;
        }
        #header .site-header__dropdown {
            position: absolute;
            top: 100%;
            left: 50%;
            z-index: 60;
            min-width: 15.5rem;
            padding: 0.5rem;
            border-radius: 1rem;
            border: 1px solid rgba(0, 138, 249, 0.12);
            background: rgba(255, 255, 255, 0.98);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            box-shadow: 0 18px 40px -16px rgba(0, 138, 249, 0.28), 0 8px 20px -10px rgba(15, 23, 42, 0.12);
            opacity: 0;
            visibility: hidden;
            transform: translateX(-50%) translateY(6px);
            transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
            pointer-events: none;
        }
        #header .site-header__dropdown--wide {
            min-width: 22rem;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.25rem 0.75rem;
        }
        #header .site-header__nav-item--dropdown:hover .site-header__dropdown,
        #header .site-header__nav-item--dropdown:focus-within .site-header__dropdown,
        #header .site-header__nav-item--dropdown.is-dropdown-open .site-header__dropdown {
            opacity: 1;
            visibility: visible;
            transform: translateX(-50%) translateY(0);
            pointer-events: auto;
        }
        /* Tıklama / navigasyon sonrası hover ile yeniden açılmayı engelle */
        #header.is-menus-closed .site-header__nav-item--dropdown .site-header__dropdown,
        #header.is-menus-closed .site-header__nav-item--dropdown:hover .site-header__dropdown,
        #header.is-menus-closed .site-header__nav-item--dropdown:focus-within .site-header__dropdown,
        #header.is-menus-closed .site-header__nav-item--dropdown.is-dropdown-open .site-header__dropdown {
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
            transform: translateX(-50%) translateY(6px) !important;
        }
        @media (min-width: 1024px) {
            #header .site-header__nav-item--dropdown.is-dropdown-open .site-header__dropdown {
                transition-delay: 0s;
            }
        }
        #mobile-menu:not(.hidden) {
            display: block;
        }
        #header .site-header__dropdown-label {
            grid-column: 1 / -1;
            margin: 0.35rem 0.5rem 0.15rem;
            font-size: 0.625rem;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: #94a3b8;
        }
        #header .site-header__dropdown-label:not(:first-child) {
            margin-top: 0.65rem;
            padding-top: 0.55rem;
            border-top: 1px solid rgba(226, 232, 240, 0.95);
        }
        #header .site-header__dropdown-link {
            display: block;
            padding: 0.55rem 0.75rem;
            border-radius: 0.65rem;
            font-size: 0.8125rem;
            font-weight: 600;
            color: #475569;
            transition: color 0.2s ease, background 0.2s ease;
        }
        #header .site-header__dropdown-link:hover {
            color: #008af9;
            background: rgba(0, 138, 249, 0.07);
        }
        #header .site-header__mobile-label {
            margin: 0.75rem 1rem 0.35rem;
            font-size: 0.625rem;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: #94a3b8;
        }
        #header .site-header__mobile-label:first-child {
            margin-top: 0.25rem;
        }
        #header .site-header__actions {
            display: flex;
            align-items: center;
            gap: 6px;
            padding-left: 4px;
        }
        #header .site-header__login {
            padding: 9px 16px;
            border-radius: 999px;
            font-size: 0.875rem;
            font-weight: 600;
            color: #64748b;
            background: transparent;
            border: none;
            cursor: pointer;
            transition: color 0.2s ease, background 0.2s ease;
        }
        #header .site-header__login:hover {
            color: #008af9;
            background: rgba(0, 138, 249, 0.06);
        }
        #header .site-header__signup {
            padding: 9px 20px;
            border-radius: 999px;
            font-size: 0.875rem;
            font-weight: 700;
            color: #fff;
            background: linear-gradient(135deg, #008af9 0%, #40a9ff 100%);
            border: none;
            cursor: pointer;
            box-shadow: 0 8px 22px -8px rgba(0, 138, 249, 0.55);
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }
        #header .site-header__signup:hover {
            transform: translateY(-1px);
            box-shadow: 0 12px 28px -8px rgba(0, 138, 249, 0.65);
        }
        #header #mobile-menu-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border-radius: 999px;
            border: 1px solid rgba(0, 138, 249, 0.12);
            background: rgba(241, 245, 249, 0.9);
            color: #334155;
            transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
        }
        #header #mobile-menu-button:hover {
            color: #008af9;
            background: #fff;
            border-color: rgba(0, 138, 249, 0.22);
        }
        #header #mobile-menu {
            margin-top: 10px;
            padding: 8px;
            border-radius: 24px;
            background: rgba(255, 255, 255, 0.96);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            border: 1px solid rgba(0, 138, 249, 0.12);
            box-shadow: 0 16px 40px -14px rgba(0, 138, 249, 0.2);
            overflow: hidden;
        }
        #header #mobile-menu .site-header__scroll-outer {
            position: relative;
            max-height: min(48vh, 22rem);
            margin-right: 2px;
            border-radius: 16px;
            background:
                linear-gradient(to right, transparent 0%, transparent calc(100% - 14px), rgba(0, 138, 249, 0.04) calc(100% - 14px), rgba(0, 138, 249, 0.04) 100%);
        }
        #header #mobile-menu .site-header__scroll-outer::before,
        #header #mobile-menu .site-header__scroll-outer::after {
            content: "";
            position: absolute;
            left: 0;
            right: 12px;
            height: 1.125rem;
            pointer-events: none;
            z-index: 2;
        }
        #header #mobile-menu .site-header__scroll-outer::before {
            top: 0;
            background: linear-gradient(to bottom, rgba(255, 255, 255, 0.98) 15%, transparent);
            border-radius: 16px 16px 0 0;
        }
        #header #mobile-menu .site-header__scroll-outer::after {
            bottom: 0;
            background: linear-gradient(to top, rgba(255, 255, 255, 0.98) 15%, transparent);
            border-radius: 0 0 16px 16px;
        }
        #header #mobile-menu .site-header__scroll {
            max-height: min(48vh, 22rem);
            overflow-y: auto;
            overflow-x: hidden;
            padding: 4px 12px 4px 2px;
            scroll-behavior: smooth;
            -webkit-overflow-scrolling: touch;
            overscroll-behavior: contain;
            scrollbar-width: thin;
            scrollbar-color: rgba(0, 138, 249, 0.75) transparent;
        }
        #header #mobile-menu .site-header__scroll::-webkit-scrollbar {
            width: 4px;
        }
        #header #mobile-menu .site-header__scroll::-webkit-scrollbar-track {
            margin: 14px 0;
            background: transparent;
            border-radius: 999px;
        }
        #header #mobile-menu .site-header__scroll::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, rgba(0, 120, 232, 0.95) 0%, rgba(0, 138, 249, 0.9) 45%, rgba(56, 189, 248, 0.85) 100%);
            border-radius: 999px;
            box-shadow: 0 0 10px rgba(0, 138, 249, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.45);
            min-height: 2.75rem;
        }
        #header #mobile-menu .site-header__scroll::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(180deg, #006fd4 0%, #008af9 50%, #38bdf8 100%);
            box-shadow: 0 0 14px rgba(0, 138, 249, 0.45);
        }
        #header #mobile-menu .site-header__scroll::-webkit-scrollbar-thumb:active {
            background: #0078e8;
        }
        #header #mobile-menu a {
            border-radius: 14px;
        }
        #header #mobile-menu .site-header__mobile-actions {
            padding: 8px 12px 12px;
        }
        #header #mobile-menu .site-header__signup {
            width: 100%;
            display: block;
            text-align: center;
            padding: 12px 20px;
        }
        #header #mobile-menu .site-header__login {
            width: 100%;
            display: block;
            text-align: center;
            margin-top: 8px;
            padding: 10px 16px;
        }
        @media (min-width: 1024px) {
            #desktop-menu-container { display: flex; }
            #header #mobile-menu-button { display: none !important; }
            #mobile-menu { display: none !important; }
        }

        /* ── Site Footer (modern floating card) ── */
        #site-footer {
            padding: 0 clamp(12px, 2.5vw, 28px) clamp(20px, 4vw, 36px);
            background: transparent;
        }
        #site-footer .site-footer__card {
            position: relative;
            overflow: hidden;
            contain: paint;
            border-radius: 28px;
            background: linear-gradient(145deg, #005fa3 0%, #008af9 42%, #3db4ff 100%);
            border: 1px solid rgba(255, 255, 255, 0.2);
            box-shadow:
                0 24px 64px -24px rgba(0, 138, 249, 0.55),
                0 8px 24px -8px rgba(0, 60, 120, 0.25);
        }
        #site-footer.gp-footer-near .site-footer__card {
            transform: translateZ(0);
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            will-change: transform;
        }
        #site-footer .site-footer__card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(ellipse 70% 55% at 100% 0%, rgba(255, 255, 255, 0.18), transparent 55%),
                radial-gradient(ellipse 50% 40% at 0% 100%, rgba(255, 255, 255, 0.08), transparent 50%);
            pointer-events: none;
        }
        #site-footer .site-footer__inner {
            position: relative;
            z-index: 1;
            padding: clamp(36px, 5.5vw, 52px) clamp(20px, 4vw, 44px);
        }
        #site-footer .site-footer__grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: clamp(28px, 4vw, 36px);
        }
        @media (min-width: 768px) {
            #site-footer .site-footer__grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        @media (min-width: 1024px) {
            #site-footer .site-footer__grid {
                grid-template-columns: 1.35fr 1fr 1fr 1.2fr;
                gap: 32px;
            }
        }
        #site-footer .site-footer__brand {
            font-size: 1.45rem;
            font-weight: 800;
            letter-spacing: -0.03em;
            color: #fff;
            text-decoration: none;
        }
        #site-footer .site-footer__brand span {
            opacity: 0.85;
            font-weight: 700;
        }
        #site-footer .site-footer__tagline {
            margin: 14px 0 0;
            font-size: 0.875rem;
            line-height: 1.65;
            color: rgba(255, 255, 255, 0.88);
            max-width: 28ch;
        }
        #site-footer .site-footer__social {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 20px;
        }
        #site-footer .site-footer__social-link {
            display: inline-flex;
            align-items: center;
            padding: 8px 14px;
            border-radius: 999px;
            font-size: 0.8125rem;
            font-weight: 600;
            color: #fff;
            text-decoration: none;
            background: rgba(255, 255, 255, 0.12);
            border: 1px solid rgba(255, 255, 255, 0.22);
            backdrop-filter: blur(8px);
            transition: background 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
        }
        #site-footer .site-footer__social-link:hover {
            background: rgba(255, 255, 255, 0.22);
            border-color: rgba(255, 255, 255, 0.4);
            transform: translateY(-1px);
        }
        #site-footer .site-footer__heading {
            margin: 0 0 16px;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: 0.02em;
            color: #fff;
        }
        #site-footer .site-footer__heading::after {
            content: "";
            display: block;
            width: 28px;
            height: 2px;
            margin-top: 8px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.45);
        }
        #site-footer .site-footer__links {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
        #site-footer .site-footer__links-group {
            margin-bottom: 0.85rem;
        }
        #site-footer .site-footer__links-group:last-child {
            margin-bottom: 0;
        }
        #site-footer .site-footer__links-label {
            margin: 0 0 0.4rem;
            font-size: 0.625rem;
            font-weight: 700;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: rgba(255, 255, 255, 0.55);
        }
        #site-footer .site-footer__link {
            display: inline-flex;
            align-items: center;
            padding: 6px 10px;
            margin-left: -10px;
            border-radius: 10px;
            font-size: 0.875rem;
            font-weight: 500;
            color: rgba(255, 255, 255, 0.82);
            text-decoration: none;
            background: none;
            border: none;
            cursor: pointer;
            font-family: inherit;
            text-align: left;
            transition: color 0.2s ease, background 0.2s ease;
        }
        #site-footer .site-footer__link:hover {
            color: #fff;
            background: rgba(255, 255, 255, 0.1);
        }
        #site-footer .site-footer__newsletter-text {
            margin: 0 0 16px;
            font-size: 0.875rem;
            line-height: 1.55;
            color: rgba(255, 255, 255, 0.88);
        }
        #site-footer .site-footer__subscribe-field {
            display: flex;
            align-items: stretch;
            padding: 4px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.14);
            border: 1px solid rgba(255, 255, 255, 0.25);
            backdrop-filter: blur(10px);
        }
        #site-footer .site-footer__subscribe-input {
            flex: 1;
            min-width: 0;
            padding: 10px 16px;
            border: none;
            border-radius: 999px;
            background: transparent;
            color: #fff;
            font-size: 0.875rem;
            outline: none;
        }
        #site-footer .site-footer__subscribe-input::placeholder {
            color: rgba(255, 255, 255, 0.65);
        }
        #site-footer .site-footer__subscribe-input:focus {
            outline: none;
        }
        #site-footer .site-footer__subscribe-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            width: 44px;
            height: 44px;
            border: none;
            border-radius: 999px;
            background: #fff;
            color: #008af9;
            cursor: pointer;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
        }
        #site-footer .site-footer__subscribe-btn:hover {
            transform: scale(1.05);
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
        }
        #site-footer .site-footer__subscribe-btn svg {
            width: 18px;
            height: 18px;
        }
        #site-footer .site-footer__bottom {
            position: relative;
            z-index: 1;
            margin-top: clamp(28px, 4vw, 40px);
            padding: 20px clamp(20px, 4vw, 44px) 0;
            border-top: 1px solid rgba(255, 255, 255, 0.18);
            text-align: center;
        }
        #site-footer .site-footer__bottom p {
            margin: 0;
            font-size: 0.8125rem;
            color: rgba(255, 255, 255, 0.72);
        }

        /* Mobil alt navigasyon için içeriğin altta boşluk bırakmasını sağlar */
        @media (max-width: 767px) {
            body {
                padding-bottom: 7.5rem; /* 120px @16px -> rem; zoom ile birlikte ölçeklenir */
            }
        }
        
        /* ══ Piyasa Verileri Bölümü ══ */
        #gp-piyasa-hub {
            --pv-ink: #0c1222;
            --pv-muted: #6b8299;
            --pv-border: rgba(0, 138, 249, 0.14);
            --pv-brand: #008af9;
            --pv-brand-soft: rgba(0, 138, 249, 0.08);
            --pv-brand-glow: rgba(0, 138, 249, 0.22);
            --pv-land: #64748b;
            --pv-land-light: #94a3b8;
            --pv-land-soft: rgba(100, 116, 139, 0.1);
            --pv-land-muted: #475569;
            --pv-ease: cubic-bezier(0.22, 1, 0.36, 1);
            position: relative;
            overflow: hidden;
            padding-bottom: 0.5rem;
        }
        #gp-piyasa-hub::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, transparent 0%, var(--pv-brand) 22%, #5cb4fc 50%, var(--pv-land-light) 78%, transparent 100%);
            opacity: 0.75;
            pointer-events: none;
        }
        #gp-piyasa-hub .gp-piyasa-ambient,
        #gp-piyasa-hub .gp-piyasa-grid {
            display: none;
        }
        #gp-piyasa-hub .gp-piyasa-header {
            position: relative;
            z-index: 2;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            margin-bottom: clamp(2rem, 3.5vw, 3rem);
        }
        #gp-piyasa-hub .gp-piyasa-header .gp-section-title {
            margin: 0;
            max-width: 100%;
        }
        #gp-piyasa-hub .gp-piyasa-live-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            margin-bottom: 1.125rem;
            padding: 0.45rem 1.1rem;
            border-radius: 999px;
            font-family: "DM Sans", sans-serif;
            font-size: 0.6875rem;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--pv-brand);
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(240, 247, 255, 0.9));
            border: 1px solid var(--pv-border);
            box-shadow: 0 6px 20px rgba(0, 138, 249, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
            cursor: pointer;
            transition: transform 0.28s var(--pv-ease), box-shadow 0.28s var(--pv-ease), border-color 0.28s var(--pv-ease);
        }
        #gp-piyasa-hub .gp-piyasa-live-badge:hover {
            transform: translateY(-1px);
            border-color: rgba(0, 138, 249, 0.35);
            box-shadow: 0 10px 26px rgba(0, 138, 249, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.95);
        }
        #gp-piyasa-hub .gp-piyasa-live-badge:focus-visible {
            outline: none;
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.18), 0 6px 20px rgba(0, 138, 249, 0.08);
        }
        #gp-piyasa-hub .gp-piyasa-live-dot {
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: var(--pv-brand);
        }
        #gp-piyasa-hub .gp-piyasa-actions {
            display: flex;
            justify-content: center;
            margin-top: 1.125rem;
        }
        #gp-piyasa-hub .gp-piyasa-cta {
            position: relative;
            display: inline-flex;
            align-items: center;
            gap: 0.55rem;
            padding: 0.7rem 1.45rem;
            border-radius: 999px;
            font-family: "DM Sans", sans-serif;
            font-size: 0.875rem;
            font-weight: 600;
            color: #fff;
            background: linear-gradient(135deg, var(--pv-brand) 0%, #2d9bff 55%, #40a9ff 100%);
            border: 1px solid rgba(255, 255, 255, 0.22);
            box-shadow: 0 10px 28px rgba(0, 138, 249, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.25);
            overflow: hidden;
            transition: transform 0.28s var(--pv-ease), box-shadow 0.28s var(--pv-ease);
        }
        #gp-piyasa-hub .gp-piyasa-cta::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, 0.22) 50%, transparent 62%);
            transform: translateX(-120%);
            transition: transform 0.65s var(--pv-ease);
        }
        #gp-piyasa-hub .gp-piyasa-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 14px 36px rgba(0, 138, 249, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.3);
        }
        #gp-piyasa-hub .gp-piyasa-cta:hover::before {
            transform: translateX(120%);
        }
        #gp-piyasa-hub .gp-piyasa-cta svg {
            width: 1rem;
            height: 1rem;
            transition: transform 0.28s var(--pv-ease);
        }
        #gp-piyasa-hub .gp-piyasa-cta:hover svg {
            transform: translateX(4px);
        }
        #gp-piyasa-hub .gp-piyasa-stage {
            position: relative;
            z-index: 1;
            padding: clamp(0.75rem, 2vw, 1.25rem) 0;
            border-radius: var(--r-lg);
            background: #f8fafc;
            border: 1px solid rgba(226, 232, 240, 0.95);
            overflow: hidden;
            isolation: isolate;
            contain: layout paint style;
        }
        #gp-piyasa-hub .gp-piyasa-legend {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            gap: 0.625rem;
            margin: 0 0 1.125rem;
            padding: 0 clamp(0.75rem, 2vw, 1.5rem);
        }
        #gp-piyasa-hub .gp-piyasa-legend-item {
            display: inline-flex;
            align-items: center;
            gap: 0.45rem;
            padding: 0.38rem 0.8rem;
            border-radius: 999px;
            font-family: "DM Sans", sans-serif;
            font-size: 0.6875rem;
            font-weight: 700;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            color: var(--pv-muted);
            background: rgba(255, 255, 255, 0.86);
            border: 1px solid rgba(226, 232, 240, 0.95);
        }
        #gp-piyasa-hub .gp-piyasa-legend-dot {
            width: 0.5rem;
            height: 0.5rem;
            border-radius: 999px;
            flex-shrink: 0;
        }
        #gp-piyasa-hub .gp-piyasa-legend-dot--konut {
            background: var(--pv-brand);
            box-shadow: 0 0 0 3px var(--pv-brand-soft);
        }
        #gp-piyasa-hub .gp-piyasa-legend-dot--arsa {
            background: var(--pv-land);
            box-shadow: 0 0 0 3px var(--pv-land-soft);
        }
        #gp-piyasa-hub .gp-piyasa-marquee {
            overflow: hidden;
            position: relative;
            user-select: none;
            -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
            mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
        }
        #gp-piyasa-hub .gp-piyasa-stage.is-loading .gp-piyasa-marquee {
            min-height: 18.8rem;
        }
        #gp-piyasa-hub .gp-piyasa-stage.is-loading #market-unified-track::before {
            content: "";
            display: block;
            width: 22rem;
            height: 14rem;
            margin: 0.5rem auto 0;
            border-radius: 1.25rem;
            background: #eef2f6;
        }
        #gp-piyasa-hub .gp-piyasa-track {
            display: flex;
            gap: 1rem;
            width: max-content;
            padding: 0.5rem 1rem 0.75rem;
        }
        #gp-piyasa-hub .gp-piyasa-stage.is-ready .gp-piyasa-track:not(.is-virtual) {
            animation: gp-piyasa-marquee 100s linear infinite;
            will-change: transform;
            transform: translate3d(0, 0, 0);
        }
        #gp-piyasa-hub .gp-piyasa-track.is-virtual {
            animation: none !important;
            transform: translate3d(0, 0, 0);
        }
        #gp-piyasa-hub .gp-piyasa-track.is-preview .market-card,
        #gp-piyasa-hub .gp-piyasa-track.is-virtual .market-card {
            content-visibility: visible;
            contain: layout paint style;
        }
        #gp-piyasa-hub .gp-piyasa-stage.is-ready:not(.gp-offscreen-paused) .gp-piyasa-track {
            will-change: transform;
        }
        @media (max-width: 768px) {
            #gp-piyasa-hub .gp-piyasa-stage.is-ready .gp-piyasa-track:not(.is-virtual) {
                animation-duration: 140s;
            }
        }
        #gp-piyasa-hub .gp-piyasa-marquee:hover .gp-piyasa-track {
            animation-play-state: paused;
        }
        #gp-piyasa-hub .market-card {
            width: 22rem;
            padding: 1rem 1.1rem 1.1rem;
            background: #ffffff;
            border: 1px solid rgba(226, 232, 240, 0.95);
            border-radius: 1.25rem;
            box-shadow: 0 4px 18px -14px rgba(15, 23, 42, 0.16);
            flex-shrink: 0;
            content-visibility: auto;
            contain-intrinsic-size: 22rem 15.28rem;
        }
        #gp-piyasa-hub .gp-piyasa-stage.is-ready .market-card {
            transition: box-shadow 0.2s ease;
        }
        #gp-piyasa-hub .gp-piyasa-stage.is-ready .market-card:hover {
            box-shadow: 0 10px 28px -16px rgba(0, 138, 249, 0.16);
        }
        #gp-piyasa-hub .market-card__header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
            padding-bottom: 0.75rem;
            border-bottom: 1px solid #f1f5f9;
        }
        #gp-piyasa-hub .market-card__district {
            margin: 0;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: 1.2rem;
            font-weight: 400;
            line-height: 1.1;
            letter-spacing: -0.02em;
            color: var(--pv-ink);
        }
        #gp-piyasa-hub .market-card__tags {
            display: inline-flex;
            gap: 0.3rem;
            flex-shrink: 0;
        }
        #gp-piyasa-hub .market-card__tag {
            padding: 0.28rem 0.55rem;
            border-radius: 999px;
            font-family: "DM Sans", sans-serif;
            font-size: 0.5625rem;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }
        #gp-piyasa-hub .market-card__tag--konut {
            color: var(--pv-brand);
            background: var(--pv-brand-soft);
            border: 1px solid var(--pv-border);
        }
        #gp-piyasa-hub .market-card__tag--arsa {
            color: var(--pv-land-muted);
            background: var(--pv-land-soft);
            border: 1px solid rgba(100, 116, 139, 0.2);
        }
        #gp-piyasa-hub .market-card__hero {
            position: relative;
            z-index: 1;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.55rem;
            margin-top: 0.9rem;
        }
        #gp-piyasa-hub .market-card__kpi {
            padding: 0.7rem 0.65rem;
            border-radius: 0.85rem;
            border: 1px solid transparent;
        }
        #gp-piyasa-hub .market-card__kpi--konut {
            background: linear-gradient(160deg, rgba(0, 138, 249, 0.09), rgba(0, 138, 249, 0.02));
            border-color: rgba(0, 138, 249, 0.12);
        }
        #gp-piyasa-hub .market-card__kpi--arsa {
            background: linear-gradient(160deg, rgba(100, 116, 139, 0.1), rgba(148, 163, 184, 0.04));
            border-color: rgba(100, 116, 139, 0.16);
        }
        #gp-piyasa-hub .market-card__kpi-label {
            display: block;
            font-family: "DM Sans", sans-serif;
            font-size: 0.625rem;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--pv-muted);
            line-height: 1.3;
        }
        #gp-piyasa-hub .market-card__kpi-num {
            font-family: "Space Grotesk", sans-serif;
            font-size: 1rem;
            font-weight: 700;
            font-variant-numeric: tabular-nums;
            letter-spacing: -0.03em;
            line-height: 1;
        }
        #gp-piyasa-hub .market-card__kpi--konut .market-card__kpi-num { color: var(--pv-brand); }
        #gp-piyasa-hub .market-card__kpi--arsa .market-card__kpi-num { color: var(--pv-land-muted); }
        #gp-piyasa-hub .market-card__kpi-unit {
            font-family: "DM Sans", sans-serif;
            font-size: 0.5625rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: #94a3b8;
        }
        #gp-piyasa-hub .market-card__kpi-value {
            display: inline-flex;
            align-items: baseline;
            gap: 0.15rem;
            margin-top: 0.3rem;
        }
        #gp-piyasa-hub .market-card__empty {
            font-family: "DM Sans", sans-serif;
            font-size: 0.6875rem;
            font-weight: 500;
            font-style: italic;
            color: #94a3b8;
        }
        #gp-piyasa-hub .market-card__body {
            position: relative;
            z-index: 1;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.55rem;
            margin-top: 0.65rem;
            padding-top: 0.65rem;
            border-top: 1px solid rgba(241, 245, 249, 0.95);
        }
        #gp-piyasa-hub .market-card__panel {
            padding: 0.55rem 0.5rem 0.45rem;
            border-radius: 0.75rem;
            background: rgba(248, 250, 252, 0.65);
        }
        #gp-piyasa-hub .market-card__panel-head {
            display: flex;
            align-items: center;
            gap: 0.35rem;
            margin-bottom: 0.45rem;
            padding-bottom: 0.4rem;
            border-bottom: 1px solid rgba(226, 232, 240, 0.8);
            font-family: "DM Sans", sans-serif;
            font-size: 0.5625rem;
            font-weight: 700;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            color: var(--pv-muted);
        }
        #gp-piyasa-hub .market-card__panel--konut .market-card__panel-head { color: var(--pv-brand); }
        #gp-piyasa-hub .market-card__panel--arsa .market-card__panel-head { color: var(--pv-land-muted); }
        #gp-piyasa-hub .market-card__panel-metrics {
            display: grid;
            gap: 0.35rem;
        }
        #gp-piyasa-hub .market-card__metric {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.45rem;
        }
        #gp-piyasa-hub .market-card__label {
            font-family: "DM Sans", sans-serif;
            font-size: 0.625rem;
            font-weight: 500;
            line-height: 1.25;
            color: var(--pv-muted);
        }
        #gp-piyasa-hub .market-card__value {
            display: inline-flex;
            align-items: baseline;
            gap: 0.15rem;
            flex: 0 0 auto;
            text-align: right;
        }
        #gp-piyasa-hub .market-card__value-num {
            font-family: "Space Grotesk", sans-serif;
            font-size: 0.6875rem;
            font-weight: 600;
            font-variant-numeric: tabular-nums;
            line-height: 1.1;
            letter-spacing: -0.02em;
        }
        #gp-piyasa-hub .market-card__panel--konut .market-card__value-num { color: var(--pv-brand); }
        #gp-piyasa-hub .market-card__panel--arsa .market-card__value-num { color: var(--pv-land-muted); }
        #gp-piyasa-hub .market-card__value-unit {
            font-family: "DM Sans", sans-serif;
            font-size: 0.5rem;
            font-weight: 700;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            color: #94a3b8;
        }
        #gp-piyasa-hub .gp-piyasa-footnote {
            position: relative;
            z-index: 2;
            margin-top: 1.35rem;
            text-align: center;
            font-family: "DM Sans", sans-serif;
            font-size: 0.75rem;
            font-weight: 500;
            color: #94a3b8;
        }
        /* Piyasa özet modalı — body portallı, üst katman */
        #gp-pv-market-modal {
            position: fixed;
            inset: 0;
            z-index: 120;
            box-sizing: border-box;
        }
        #gp-pv-market-modal.gp-app-modal .gp-app-modal__panel--xl {
            max-width: min(56rem, 96vw);
            max-height: min(92vh, 920px);
        }
        #gp-pv-market-modal #gp-pv-market-backdrop {
            position: absolute;
            inset: 0;
            z-index: 0;
        }
        #gp-pv-market-modal .gp-app-modal__panel {
            z-index: 1;
        }
        .gp-pv-market__tabs {
            display: flex;
            gap: 0.5rem;
            padding: 0 1.25rem 1rem;
            border-bottom: 1px solid rgba(226, 232, 240, 0.9);
            background: rgba(248, 250, 252, 0.65);
        }
        .gp-pv-market__tab {
            flex: 1;
            padding: 0.7rem 1rem;
            border-radius: 999px;
            border: 1px solid transparent;
            background: transparent;
            font-family: "DM Sans", sans-serif;
            font-size: 0.8125rem;
            font-weight: 700;
            letter-spacing: 0.02em;
            color: #64748b;
            cursor: pointer;
            transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
        }
        .gp-pv-market__tab:hover {
            color: #0f172a;
            background: rgba(255, 255, 255, 0.85);
        }
        .gp-pv-market__tab.is-active {
            color: #008af9;
            background: #fff;
            border-color: rgba(0, 138, 249, 0.22);
            box-shadow: 0 4px 14px rgba(0, 138, 249, 0.1);
        }
        .gp-pv-market__tab:focus-visible {
            outline: none;
            box-shadow: 0 0 0 3px rgba(0, 138, 249, 0.18);
        }
        .gp-pv-market__panels {
            padding: 1.25rem clamp(1rem, 3vw, 1.5rem) 0.5rem;
        }
        .gp-pv-market__panel[hidden] {
            display: none !important;
        }
        .gp-pv-market__section-title {
            margin: 0 0 0.85rem;
            font-family: "DM Sans", sans-serif;
            font-size: 0.6875rem;
            font-weight: 800;
            letter-spacing: 0.16em;
            text-transform: uppercase;
            color: #94a3b8;
        }
        .gp-pv-market__kpis {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 0.65rem;
            margin-bottom: 1.35rem;
        }
        @media (min-width: 640px) {
            .gp-pv-market__kpis {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }
        @media (min-width: 900px) {
            .gp-pv-market__kpis {
                grid-template-columns: repeat(5, minmax(0, 1fr));
            }
        }
        .gp-pv-market__kpi {
            padding: 0.85rem 0.9rem;
            border-radius: 1rem;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: 0 2px 10px rgba(15, 23, 42, 0.03);
        }
        .gp-pv-market__kpi-label {
            display: block;
            margin-bottom: 0.4rem;
            font-family: "DM Sans", sans-serif;
            font-size: 0.625rem;
            font-weight: 600;
            line-height: 1.35;
            letter-spacing: 0.03em;
            color: #64748b;
        }
        .gp-pv-market__kpi-value {
            display: block;
            font-family: "Space Grotesk", sans-serif;
            font-size: clamp(0.95rem, 2vw, 1.125rem);
            font-weight: 700;
            font-variant-numeric: tabular-nums;
            letter-spacing: -0.02em;
            color: #0f172a;
        }
        .gp-pv-market__kpi-value--up { color: #059669; }
        .gp-pv-market__kpi-value--down { color: #dc2626; }
        .gp-pv-market__kpi-value--flat { color: #64748b; }
        .gp-pv-market__table-wrap {
            overflow: auto;
            border-radius: 1rem;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: #fff;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
        }
        .gp-pv-market__table {
            width: 100%;
            min-width: 42rem;
            border-collapse: collapse;
            font-family: "DM Sans", sans-serif;
            font-size: 0.75rem;
        }
        .gp-pv-market__table thead th {
            padding: 0.75rem 0.85rem;
            text-align: left;
            font-size: 0.625rem;
            font-weight: 800;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            color: #64748b;
            background: #f8fafc;
            border-bottom: 1px solid #e2e8f0;
            white-space: nowrap;
        }
        .gp-pv-market__table tbody td {
            padding: 0.8rem 0.85rem;
            border-bottom: 1px solid #f1f5f9;
            color: #334155;
            font-variant-numeric: tabular-nums;
            white-space: nowrap;
        }
        .gp-pv-market__table tbody tr:last-child td {
            border-bottom: none;
        }
        .gp-pv-market__table tbody tr:hover td {
            background: rgba(0, 138, 249, 0.03);
        }
        .gp-pv-market__region {
            font-weight: 700;
            color: #0f172a;
        }
        .gp-pv-market__region--tr {
            color: #008af9;
        }
        .gp-pv-val--up { color: #059669; font-weight: 700; }
        .gp-pv-val--down { color: #dc2626; font-weight: 700; }
        .gp-pv-val--flat { color: #64748b; font-weight: 700; }
        .gp-pv-market__note {
            margin: 1rem clamp(1rem, 3vw, 1.5rem) 1.25rem;
            padding-top: 0.85rem;
            border-top: 1px solid rgba(226, 232, 240, 0.9);
            font-family: "DM Sans", sans-serif;
            font-size: 0.6875rem;
            font-weight: 500;
            line-height: 1.5;
            text-align: center;
            color: #94a3b8;
        }
        @media (max-width: 639px) {
            #gp-piyasa-hub .market-card {
                width: 20rem;
                padding: 1rem 1.05rem 1.05rem;
                contain-intrinsic-size: 20rem 15.33rem;
            }
            #gp-piyasa-hub .market-card__district {
                font-size: 1.12rem;
            }
            #gp-piyasa-hub .market-card__kpi-num {
                font-size: 0.9rem;
            }
            #gp-piyasa-hub .gp-piyasa-stage {
                padding-inline: 0;
                border: none;
                background: transparent;
                box-shadow: none;
            }
        }
        @keyframes gp-piyasa-marquee {
            from { transform: translate3d(0, 0, 0); }
            to { transform: translate3d(-50%, 0, 0); }
        }
        @keyframes marquee {
            from { transform: translateX(0); }
            to { transform: translateX(-50%); }
        }
        @keyframes marquee-reverse {
            from { transform: translateX(-50%); }
            to { transform: translateX(0); }
        }
        @media (prefers-reduced-motion: reduce) {
            #gp-piyasa-hub .gp-piyasa-marquee {
                overflow-x: auto;
                -webkit-mask-image: none;
                mask-image: none;
                scrollbar-width: thin;
                scrollbar-color: rgba(0, 138, 249, 0.35) transparent;
            }
            #gp-piyasa-hub .gp-piyasa-stage.is-ready .gp-piyasa-track {
                animation: none;
            }
        }

        /* Kategoriler — görsel çerçevesi (layout sıçramasını önler) */
        .category-card__visual {
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 14rem;
            overflow: hidden;
        }
        .category-card__visual img {
            width: 100%;
            height: 14rem;
            object-fit: contain;
            object-position: center;
        }
        /* Kategoriler Mobil Görünüm (Dikey Hizalama) */
        @media (max-width: 639px) {
            .category-container {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 2rem;
            }
            .category-container > .category-card {
                width: 100%;
                max-width: 350px;
                transition: box-shadow 0.3s ease, border-color 0.3s ease;
            }
            .category-container > .category-card:not(:first-child) {
               margin-left: 0;
            }
            /* Dokunmatikte takılı hover büyümesini engelle */
            .category-container > .category-card,
            .category-container > .category-card:hover,
            .category-container > .category-card.is-tapped {
                transform: none;
            }
        }
        @media (hover: hover) and (pointer: fine) {
            .category-container > .category-card:hover {
                transform: translateY(-0.5rem);
                box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
            }
            .category-card.group:hover .category-card__visual img {
                transform: scale(1.05);
            }
            .category-card.group:hover {
                border-color: #008af9;
            }
        }
        .category-card__visual img {
            transition: transform 0.3s ease;
        }

        /* Form Doğrulama (Validation) Stilleri */
        .form-error-message {
            color: #ef4444;
            font-size: 0.875rem;
            margin-top: 0.25rem;
        }
        .form-input-invalid {
            border-color: #ef4444 !important;
        }
        .form-input-invalid:focus {
            --tw-ring-color: #ef4444 !important;
        }
        
        /* YENİ: Kavisli Mobil Navigasyon Stilleri */
        .mobile-nav {
            position: fixed;
            bottom: 1.25rem;
            left: 50%;
            transform: translateX(-50%);
            width: min(95%, 25rem);
            height: 4.375rem;
            padding: 0 0.35rem;
            background-color: #fff;
            border-radius: 2.1875rem;
            border: 1px solid rgba(0, 138, 249, 0.1);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 138, 249, 0.1);
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            align-items: flex-end;
            z-index: 100;
        }
        .mobile-nav::before {
            content: '';
            position: absolute;
            top: -1.25rem;
            left: 50%;
            transform: translateX(-50%);
            width: 5.625rem;
            height: 2.5rem;
            background-color: transparent;
            border-bottom-left-radius: 2.8125rem;
            border-bottom-right-radius: 2.8125rem;
            box-shadow: 0 1.25rem 0 0 #ffffff;
            pointer-events: none;
        }
        .nav-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-width: 0;
            padding-bottom: 0.45rem;
            color: #64748b;
            text-decoration: none;
            transition: color 0.25s ease;
        }
        button.nav-item {
            border: none;
            background: transparent;
            cursor: pointer;
            font-family: inherit;
        }
        .nav-item:hover,
        .nav-item:focus-visible {
            color: #008af9;
            outline: none;
        }
        .nav-item span {
            font-size: 0.6875rem;
            font-weight: 600;
            margin-top: 0.125rem;
            letter-spacing: -0.01em;
            white-space: nowrap;
        }
        .central-logo-container {
            position: relative;
            top: -1.875rem;
            justify-self: center;
            align-self: start;
            width: 4.25rem;
            height: 4.25rem;
            background: transparent;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 6px 18px rgba(0, 138, 249, 0.45);
            border: 0.25rem solid #fff;
            transition: transform 0.25s ease, box-shadow 0.25s ease;
            z-index: 2;
            overflow: hidden;
        }
        .central-logo-container:hover,
        .central-logo-container:focus-visible {
            transform: scale(1.06);
            box-shadow: 0 8px 22px rgba(0, 138, 249, 0.52);
            outline: none;
        }

        /* Ekosistem — cam & kabartma kartlar */
        #ekosistem {
            background: #ffffff;
        }
        #ekosistem .ep-grid {
            gap: clamp(0.65rem, 1.2vw, 1rem);
        }
        @media (min-width: 1024px) {
            /* Masaüstünde altı kardeş site tek sırada yan yana dizilir
               (lg:grid-cols-6 derlenmiş Tailwind çıktısında bulunmadığı için burada tanımlı) */
            #ekosistem .ep-grid {
                grid-template-columns: repeat(6, minmax(0, 1fr));
            }
            #ekosistem .ep-grid .ep-glass {
                padding: 0.75rem 0.85rem;
            }
            #ekosistem .ep-grid .ep-glass__title {
                font-size: clamp(0.82rem, 0.55vw + 0.72rem, 0.95rem);
            }
            #ekosistem .ep-grid .ep-glass__tagline {
                font-size: 0.72rem;
                line-height: 1.4;
            }
            #ekosistem .ep-grid .ep-glass__domain {
                font-size: 0.68rem;
                margin-top: 0.5rem;
                padding-top: 0.5rem;
            }
        }
        .ep-glass {
            display: flex;
            flex-direction: column;
            padding: 0.9rem 1rem;
            border-radius: var(--r);
            text-decoration: none;
            color: inherit;
            background: linear-gradient(
                145deg,
                rgba(255, 255, 255, 0.92) 0%,
                rgba(255, 255, 255, 0.68) 100%
            );
            backdrop-filter: blur(14px) saturate(1.15);
            -webkit-backdrop-filter: blur(14px) saturate(1.15);
            border: 1px solid rgba(255, 255, 255, 0.9);
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 0.98) inset,
                0 -1px 0 rgba(0, 138, 249, 0.04) inset,
                0 6px 20px rgba(0, 138, 249, 0.07),
                0 2px 6px rgba(17, 24, 39, 0.05);
            transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease, background 0.28s ease;
        }
        a.ep-glass:hover {
            transform: translateY(-3px);
            border-color: rgba(0, 138, 249, 0.28);
            background: linear-gradient(
                145deg,
                rgba(255, 255, 255, 0.98) 0%,
                rgba(240, 248, 255, 0.85) 100%
            );
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 1) inset,
                0 -1px 0 rgba(0, 138, 249, 0.06) inset,
                0 12px 28px rgba(0, 138, 249, 0.12),
                0 4px 10px rgba(17, 24, 39, 0.06);
        }
        .ep-glass--hub {
            padding: 0;
            margin-bottom: clamp(1rem, 2vw, 1.35rem);
            contain: paint;
            border: 1px solid rgba(0, 138, 249, 0.22);
            background: linear-gradient(
                155deg,
                rgba(255, 255, 255, 0.94) 0%,
                rgba(230, 245, 255, 0.78) 100%
            );
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 1) inset,
                0 2px 0 rgba(0, 138, 249, 0.08) inset,
                0 10px 32px rgba(0, 138, 249, 0.1),
                0 2px 8px rgba(17, 24, 39, 0.05);
        }
        .ep-glass--hub .ep-hub-side {
            position: relative;
            overflow: hidden;
            isolation: isolate;
            contain: layout paint style;
            --ep-accent: #008af9;
            --ep-accent-soft: rgba(0, 138, 249, 0.14);
            --ep-accent-glow: rgba(0, 138, 249, 0.28);
            --ep-line: rgba(0, 138, 249, 0.35);
            background:
                radial-gradient(ellipse 90% 70% at 50% 115%, var(--ep-accent-soft) 0%, transparent 62%),
                linear-gradient(165deg, rgba(0, 138, 249, 0.09) 0%, rgba(255, 255, 255, 0.35) 100%);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
        }
        .ep-hub-side--soon {
            --ep-accent: #f59e0b;
            --ep-accent-soft: rgba(245, 158, 11, 0.16);
            --ep-accent-glow: rgba(245, 158, 11, 0.3);
            --ep-line: rgba(245, 158, 11, 0.38);
            background:
                radial-gradient(ellipse 90% 70% at 50% 115%, var(--ep-accent-soft) 0%, transparent 62%),
                linear-gradient(165deg, rgba(245, 158, 11, 0.08) 0%, rgba(255, 255, 255, 0.35) 100%);
        }
        .ep-hub-ambient {
            position: absolute;
            inset: 0;
            pointer-events: none;
            z-index: 0;
            overflow: hidden;
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
        }
        #ekosistem .ep-hub-ambient__mesh,
        #ekosistem .ep-hub-ambient__grid,
        #ekosistem .ep-hub-ambient__ring,
        #ekosistem .ep-hub-ambient__line,
        #ekosistem .ep-hub-ambient__spark,
        #ekosistem .ep-hub-ambient__orb,
        #ekosistem .ep-hub-badge__halo,
        #ekosistem .ep-hub-badge__orbit,
        #ekosistem .ep-hub-badge::before,
        #ekosistem .ep-hub-ambient::after {
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            will-change: transform, opacity;
        }
        .ep-hub-ambient__mesh {
            position: absolute;
            inset: -20%;
            background:
                radial-gradient(circle at 30% 40%, var(--ep-accent-glow) 0%, transparent 42%),
                radial-gradient(circle at 72% 68%, rgba(255, 255, 255, 0.55) 0%, transparent 38%);
            opacity: 0.55;
            animation: epHubMesh 16s ease-in-out infinite;
        }
        .ep-hub-ambient__grid {
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(var(--ep-line) 1px, transparent 1px),
                linear-gradient(90deg, var(--ep-line) 1px, transparent 1px);
            background-size: 22px 22px;
            opacity: 0.07;
            mask-image: radial-gradient(ellipse 75% 65% at 50% 50%, #000 15%, transparent 72%);
            -webkit-mask-image: radial-gradient(ellipse 75% 65% at 50% 50%, #000 15%, transparent 72%);
            animation: epHubGridPulse 8s ease-in-out infinite;
        }
        .ep-hub-ambient__ring {
            position: absolute;
            top: 50%;
            left: 50%;
            border-radius: 50%;
            border: 1px solid var(--ep-line);
            transform: translate(-50%, -50%) scale(0.35);
            opacity: 0;
        }
        .ep-hub-ambient__ring--1 {
            width: 11rem;
            height: 11rem;
            animation: epHubRing 5.5s cubic-bezier(0.22, 1, 0.36, 1) infinite;
        }
        .ep-hub-ambient__ring--2 {
            width: 11rem;
            height: 11rem;
            animation: epHubRing 5.5s cubic-bezier(0.22, 1, 0.36, 1) infinite;
            animation-delay: 2.75s;
        }
        .ep-hub-ambient__line {
            position: absolute;
            pointer-events: none;
            opacity: 0.45;
        }
        .ep-hub-ambient__line--h {
            top: 50%;
            left: 8%;
            width: 84%;
            height: 1px;
            background: linear-gradient(90deg, transparent, var(--ep-line) 18%, var(--ep-accent) 50%, var(--ep-line) 82%, transparent);
            transform: translateY(-50%) scaleX(0.55);
            animation: epHubLineH 6s ease-in-out infinite;
        }
        .ep-hub-ambient__line--v {
            top: 12%;
            left: 50%;
            width: 1px;
            height: 76%;
            background: linear-gradient(180deg, transparent, var(--ep-line) 20%, var(--ep-accent) 50%, var(--ep-line) 80%, transparent);
            transform: translateX(-50%) scaleY(0.45);
            animation: epHubLineV 7s ease-in-out infinite;
            animation-delay: -2s;
        }
        .ep-hub-ambient__line--diag {
            top: 50%;
            left: 50%;
            width: 120%;
            height: 1px;
            background: linear-gradient(90deg, transparent 5%, var(--ep-line) 35%, rgba(255, 255, 255, 0.65) 50%, var(--ep-line) 65%, transparent 95%);
            transform: translate(-50%, -50%) rotate(-32deg) scaleX(0.25);
            animation: epHubLineDiag 9s ease-in-out infinite;
            animation-delay: -1s;
        }
        .ep-hub-ambient__spark {
            position: absolute;
            width: 3rem;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), var(--ep-accent), transparent);
            opacity: 0;
            filter: blur(0.3px);
        }
        .ep-hub-ambient__spark--1 {
            top: 28%;
            left: -30%;
            animation: epHubSpark 7s ease-in-out infinite;
        }
        .ep-hub-ambient__spark--2 {
            top: 68%;
            left: -35%;
            animation: epHubSpark 8.5s ease-in-out infinite;
            animation-delay: -3.5s;
            transform: rotate(12deg);
        }
        .ep-hub-ambient__corner {
            position: absolute;
            width: 1.75rem;
            height: 1.75rem;
            opacity: 0.55;
        }
        .ep-hub-ambient__corner::before,
        .ep-hub-ambient__corner::after {
            content: "";
            position: absolute;
            background: linear-gradient(90deg, var(--ep-accent), transparent);
        }
        .ep-hub-ambient__corner--tl {
            top: 0.85rem;
            left: 0.85rem;
        }
        .ep-hub-ambient__corner--tl::before {
            top: 0;
            left: 0;
            width: 100%;
            height: 1px;
            animation: epHubCornerH 4s ease-in-out infinite;
        }
        .ep-hub-ambient__corner--tl::after {
            top: 0;
            left: 0;
            width: 1px;
            height: 100%;
            background: linear-gradient(180deg, var(--ep-accent), transparent);
            animation: epHubCornerV 4s ease-in-out infinite;
            animation-delay: -0.4s;
        }
        .ep-hub-ambient__corner--br {
            right: 0.85rem;
            bottom: 0.85rem;
        }
        .ep-hub-ambient__corner--br::before {
            right: 0;
            bottom: 0;
            width: 100%;
            height: 1px;
            background: linear-gradient(270deg, var(--ep-accent), transparent);
            animation: epHubCornerH 4.5s ease-in-out infinite;
            animation-delay: -1.2s;
        }
        .ep-hub-ambient__corner--br::after {
            right: 0;
            bottom: 0;
            width: 1px;
            height: 100%;
            background: linear-gradient(0deg, var(--ep-accent), transparent);
            animation: epHubCornerV 4.5s ease-in-out infinite;
            animation-delay: -1.6s;
        }
        .ep-hub-ambient::after {
            content: '';
            position: absolute;
            top: -40%;
            left: -60%;
            width: 55%;
            height: 180%;
            background: linear-gradient(
                105deg,
                transparent 0%,
                rgba(255, 255, 255, 0.55) 48%,
                transparent 100%
            );
            transform: rotate(-10deg);
            opacity: 0;
            animation: epHubShimmer 9s ease-in-out infinite;
        }
        .ep-hub-ambient__orb {
            position: absolute;
            border-radius: 50%;
            pointer-events: none;
            will-change: transform, opacity;
        }
        .ep-hub-side--here .ep-hub-ambient__orb--1 {
            width: 7.5rem;
            height: 7.5rem;
            top: -18%;
            left: -12%;
            background: radial-gradient(circle, rgba(0, 138, 249, 0.38) 0%, transparent 68%);
            filter: blur(14px);
            animation: epHubOrbA 14s ease-in-out infinite;
        }
        .ep-hub-side--here .ep-hub-ambient__orb--2 {
            width: 5.5rem;
            height: 5.5rem;
            bottom: -10%;
            right: -8%;
            background: radial-gradient(circle, rgba(56, 189, 248, 0.32) 0%, transparent 70%);
            filter: blur(12px);
            animation: epHubOrbB 11s ease-in-out infinite;
            animation-delay: -3s;
        }
        .ep-hub-side--here .ep-hub-ambient__orb--3 {
            width: 4rem;
            height: 4rem;
            top: 42%;
            left: 58%;
            background: radial-gradient(circle, rgba(255, 255, 255, 0.75) 0%, transparent 72%);
            filter: blur(10px);
            animation: epHubOrbC 8s ease-in-out infinite;
            animation-delay: -1.5s;
        }
        .ep-hub-side--soon .ep-hub-ambient__orb--1 {
            width: 7rem;
            height: 7rem;
            top: -15%;
            right: -14%;
            background: radial-gradient(circle, rgba(245, 158, 11, 0.36) 0%, transparent 68%);
            filter: blur(14px);
            animation: epHubOrbA 13s ease-in-out infinite reverse;
        }
        .ep-hub-side--soon .ep-hub-ambient__orb--2 {
            width: 5.25rem;
            height: 5.25rem;
            bottom: -12%;
            left: -6%;
            background: radial-gradient(circle, rgba(251, 191, 36, 0.28) 0%, transparent 70%);
            filter: blur(12px);
            animation: epHubOrbB 10s ease-in-out infinite;
            animation-delay: -4s;
        }
        .ep-hub-side--soon .ep-hub-ambient__orb--3 {
            width: 3.75rem;
            height: 3.75rem;
            top: 38%;
            right: 52%;
            background: radial-gradient(circle, rgba(255, 255, 255, 0.7) 0%, transparent 72%);
            filter: blur(9px);
            animation: epHubOrbC 7.5s ease-in-out infinite;
            animation-delay: -2s;
        }
        @keyframes epHubOrbA {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.85; }
            50% { transform: translate(12%, 10%) scale(1.08); opacity: 1; }
        }
        @keyframes epHubOrbB {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.7; }
            50% { transform: translate(-10%, -8%) scale(1.12); opacity: 0.95; }
        }
        @keyframes epHubOrbC {
            0%, 100% { transform: translate(0, 0) scale(0.92); opacity: 0.55; }
            50% { transform: translate(-6%, 8%) scale(1.06); opacity: 0.85; }
        }
        @keyframes epHubShimmer {
            0%, 72% { transform: translateX(-130%) rotate(-10deg); opacity: 0; }
            78% { opacity: 0.28; }
            88% { opacity: 0.12; }
            100% { transform: translateX(220%) rotate(-10deg); opacity: 0; }
        }
        @keyframes epHubMesh {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
            50% { transform: translate(3%, -2%) scale(1.06); opacity: 0.72; }
        }
        @keyframes epHubGridPulse {
            0%, 100% { opacity: 0.05; }
            50% { opacity: 0.11; }
        }
        @keyframes epHubRing {
            0% { transform: translate(-50%, -50%) scale(0.35); opacity: 0.55; }
            70% { opacity: 0.12; }
            100% { transform: translate(-50%, -50%) scale(1.15); opacity: 0; }
        }
        @keyframes epHubLineH {
            0%, 100% { transform: translateY(-50%) scaleX(0.45); opacity: 0.25; }
            50% { transform: translateY(-50%) scaleX(1); opacity: 0.65; }
        }
        @keyframes epHubLineV {
            0%, 100% { transform: translateX(-50%) scaleY(0.35); opacity: 0.2; }
            50% { transform: translateX(-50%) scaleY(1); opacity: 0.55; }
        }
        @keyframes epHubLineDiag {
            0%, 100% { transform: translate(-50%, -50%) rotate(-32deg) scaleX(0.2); opacity: 0.15; }
            45% { transform: translate(-50%, -50%) rotate(-32deg) scaleX(0.85); opacity: 0.5; }
        }
        @keyframes epHubSpark {
            0%, 18% { transform: translateX(0); opacity: 0; }
            28% { opacity: 0.85; }
            55% { transform: translateX(165%); opacity: 0; }
            100% { transform: translateX(165%); opacity: 0; }
        }
        @keyframes epHubCornerH {
            0%, 100% { transform: scaleX(0.55); opacity: 0.35; }
            50% { transform: scaleX(1); opacity: 0.85; }
        }
        @keyframes epHubCornerV {
            0%, 100% { transform: scaleY(0.55); opacity: 0.35; }
            50% { transform: scaleY(1); opacity: 0.85; }
        }
        @keyframes epHubHalo {
            0%, 100% { transform: scale(0.92); opacity: 0.45; }
            50% { transform: scale(1.08); opacity: 0.75; }
        }
        @keyframes epHubOrbit {
            to { transform: rotate(360deg); }
        }
        .ep-hub-badge-shell {
            position: relative;
            z-index: 2;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .ep-hub-badge__halo {
            position: absolute;
            inset: -1.1rem;
            border-radius: 9999px;
            background: radial-gradient(circle, var(--ep-accent-glow) 0%, transparent 68%);
            filter: blur(10px);
            animation: epHubHalo 4.5s ease-in-out infinite;
            pointer-events: none;
        }
        .ep-hub-badge__orbit {
            position: absolute;
            inset: -0.55rem;
            border-radius: 9999px;
            border: 1px dashed var(--ep-line);
            opacity: 0.45;
            animation: epHubOrbit 18s linear infinite;
            pointer-events: none;
        }
        .ep-hub-badge__orbit::before {
            content: "";
            position: absolute;
            top: -2px;
            left: 50%;
            width: 5px;
            height: 5px;
            margin-left: -2.5px;
            border-radius: 50%;
            background: var(--ep-accent);
            box-shadow: 0 0 8px var(--ep-accent-glow);
        }
        .ep-hub-badge {
            position: relative;
            z-index: 1;
            display: inline-flex;
            align-items: center;
            gap: 0.4375rem;
            border-radius: 9999px;
            background: rgba(255, 255, 255, 0.94);
            padding: 0.4375rem 1.0625rem;
            font-size: clamp(0.9rem, 0.35vw + 0.82rem, 1.0625rem);
            font-weight: 600;
            line-height: 1.2;
            letter-spacing: -0.01em;
            box-shadow:
                0 1px 2px rgba(17, 24, 39, 0.06),
                0 0 0 1px rgba(255, 255, 255, 0.85) inset;
            border: 1px solid rgba(255, 255, 255, 0.92);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
            overflow: hidden;
        }
        .ep-hub-badge::before {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: inherit;
            padding: 1px;
            background: linear-gradient(120deg, transparent 20%, var(--ep-accent) 50%, transparent 80%);
            -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
            opacity: 0.55;
            animation: epHubBadgeSheen 5s ease-in-out infinite;
        }
        @keyframes epHubBadgeSheen {
            0%, 100% { opacity: 0.25; transform: translateX(-120%); }
            50% { opacity: 0.75; transform: translateX(120%); }
        }
        .ep-hub-badge--here {
            color: #008af9;
        }
        .ep-hub-badge__dot {
            position: relative;
            display: flex;
            width: 0.5625rem;
            height: 0.5625rem;
            flex-shrink: 0;
        }
        .ep-hub-badge__dot-ping,
        .ep-hub-badge__dot-core {
            border-radius: 9999px;
        }
        .ep-hub-badge__dot-ping {
            position: absolute;
            inset: 0;
            animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
            opacity: 0.55;
        }
        .ep-hub-badge__dot-core {
            position: relative;
            width: 100%;
            height: 100%;
            z-index: 1;
        }
        .ep-hub-badge--here .ep-hub-badge__dot-ping,
        .ep-hub-badge--here .ep-hub-badge__dot-core {
            background-color: #008af9;
        }
        .ep-hub-badge--soon .ep-hub-badge__dot-ping,
        .ep-hub-badge--soon .ep-hub-badge__dot-core {
            background-color: #f59e0b;
        }
        .ep-hub-badge--soon {
            color: #b45309;
        }
        .ep-glass__title {
            font-size: clamp(0.95rem, 0.9vw + 0.82rem, 1.08rem);
            font-weight: 700;
            line-height: 1.25;
            letter-spacing: -0.01em;
            color: #111827;
        }
        .ep-glass--hub .ep-glass__title {
            font-size: clamp(1.05rem, 1vw + 0.9rem, 1.2rem);
        }
        .ep-glass__tagline {
            margin-top: 0.3rem;
            font-size: 0.8125rem;
            line-height: 1.45;
            color: #6b7280;
            flex-grow: 1;
        }
        .ep-glass__domain {
            margin-top: 0.65rem;
            padding-top: 0.6rem;
            border-top: 1px solid rgba(0, 138, 249, 0.08);
            font-size: 0.75rem;
            font-weight: 600;
            color: #6b7280;
        }
        @media (prefers-reduced-motion: reduce) {
            a.ep-glass:hover { transform: none; }
            .ep-hub-ambient__orb,
            .ep-hub-ambient__mesh,
            .ep-hub-ambient__grid,
            .ep-hub-ambient__ring,
            .ep-hub-ambient__line,
            .ep-hub-ambient__spark,
            .ep-hub-ambient__corner::before,
            .ep-hub-ambient__corner::after,
            .ep-hub-badge__halo,
            .ep-hub-badge__orbit,
            .ep-hub-badge::before,
            .ep-hub-ambient::after { animation: none !important; }
            .ep-hub-ambient__ring { opacity: 0.15; transform: translate(-50%, -50%) scale(0.85); }
        }

        /* Ekosistem — Yakında dönen platform kutusu */
        .ep-glass--soon {
            border-color: rgba(245, 158, 11, 0.22);
            margin-top: clamp(1rem, 2vw, 1.35rem);
            margin-bottom: 0;
            background: linear-gradient(
                155deg,
                rgba(255, 255, 255, 0.94) 0%,
                rgba(255, 251, 235, 0.78) 100%
            );
            box-shadow:
                0 1px 0 rgba(255, 255, 255, 1) inset,
                0 2px 0 rgba(245, 158, 11, 0.08) inset,
                0 10px 32px rgba(245, 158, 11, 0.08),
                0 2px 8px rgba(17, 24, 39, 0.05);
        }
        .ep-glass--soon .ep-hub-side--right {
            border-color: rgba(245, 158, 11, 0.1);
        }
        .ep-rotator__viewport {
            overflow: hidden;
            height: 62px;
            contain: layout paint style;
        }
        .ep-rotator__track {
            display: flex;
            flex-direction: column;
            transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
            will-change: transform;
        }
        .ep-rotator__slide {
            flex-shrink: 0;
            height: 62px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .ep-rotator__slide .ep-glass__tagline {
            margin-top: 0.2rem;
            flex-grow: 0;
        }
        .ep-rotator__slide .ep-glass__domain {
            margin-top: 0.35rem;
            padding-top: 0.35rem;
        }
        @media (prefers-reduced-motion: reduce) {
            .ep-rotator__track { transition: none; }
        }

        /* AI Araçlar Hub — araclar.html entegrasyonu */
        #ai-araclar {
            --brand-rgb: 0, 138, 249;
        }
        .ai-hub-container ::-webkit-scrollbar { width: 6px; height: 6px; }
        .ai-hub-container ::-webkit-scrollbar-track { background: rgba(15, 23, 42, 0.06); border-radius: 10px; }
        .ai-hub-container ::-webkit-scrollbar-thumb { background: rgba(0, 138, 249, 0.35); border-radius: 10px; }
        .ai-hub-container ::-webkit-scrollbar-thumb:hover { background: #008af9; }
        .tech-circuit-bg {
            position: relative;
            background: transparent !important;
            overflow: hidden;
        }
        .glow-orb {
            position: absolute;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(var(--brand-rgb), 0.22) 0%, transparent 68%);
            filter: blur(28px);
            z-index: 1;
            animation: epHubOrbA 8s ease-in-out infinite alternate;
            will-change: transform, opacity;
            display: none;
        }
        .orb-1 { width: 300px; height: 300px; top: -10%; left: 10%; }
        .orb-2 { width: 400px; height: 400px; bottom: -20%; right: 5%; animation-delay: -3s; }
        .orb-3 { width: 250px; height: 250px; top: 40%; left: 50%; animation-delay: -5s; background: radial-gradient(circle, rgba(var(--brand-rgb), 0.12) 0%, transparent 70%); }
        .laser-line {
            position: absolute;
            left: 0;
            background: linear-gradient(90deg, transparent, rgba(var(--brand-rgb), 0.35), #ffffff, rgba(var(--brand-rgb), 0.55), transparent);
            height: 2px;
            width: 200px;
            z-index: 2;
            opacity: 0;
            box-shadow: 0 0 12px rgba(var(--brand-rgb), 0.45), 0 0 24px rgba(var(--brand-rgb), 0.25);
            animation: shootLaser 4s linear infinite;
            will-change: transform, opacity;
            display: none;
        }
        .laser-1 { top: 30%; animation-duration: 5s; }
        .laser-2 { top: 60%; animation-duration: 7s; animation-delay: 2s; }
        @keyframes shootLaser {
            0% { transform: translate3d(-200px, 0, 0); opacity: 0; }
            10% { opacity: 1; }
            90% { opacity: 1; }
            100% { transform: translate3d(120vw, 0, 0); opacity: 0; }
        }
        .ai-hub-container .glass-card,
        #ai-full-modal .glass-card {
            background: rgba(255, 255, 255, 0.92);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border: 1px solid rgba(15, 23, 42, 0.08);
            border-top: 1px solid rgba(255, 255, 255, 0.9);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            box-shadow: 0 10px 28px -12px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(var(--brand-rgb), 0.04);
            will-change: transform, box-shadow;
        }
        .ai-hub-container .glass-card:hover,
        #ai-full-modal .glass-card:hover {
            transform: translateY(-10px);
            background: #ffffff;
            border-color: rgba(var(--brand-rgb), 0.35);
            box-shadow: 0 22px 44px -14px rgba(15, 23, 42, 0.14), 0 0 0 1px rgba(var(--brand-rgb), 0.12), 0 0 28px -6px rgba(var(--brand-rgb), 0.25);
        }
        .glass-modal-bg {
            background: rgba(15, 23, 42, 0.45);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
        /* AI Araçlar — tam ekran modal */
        #ai-full-modal {
            background: rgba(15, 23, 42, 0.42);
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
        }
        #ai-full-modal #ai-modal-panel {
            position: relative;
            width: 100%;
            max-width: min(72rem, 96vw);
            max-height: min(88vh, 920px);
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-radius: 1.75rem;
            padding: 1px;
            background: linear-gradient(145deg, rgba(0, 138, 249, 0.22), rgba(226, 232, 240, 0.55) 45%, rgba(0, 138, 249, 0.1));
            box-shadow:
                0 32px 80px -24px rgba(15, 23, 42, 0.28),
                0 0 0 1px rgba(255, 255, 255, 0.12) inset;
            transform: scale(0.96) translateY(12px);
            opacity: 0;
            transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.32s ease;
        }
        #ai-full-modal:not(.opacity-0) #ai-modal-panel {
            transform: scale(1) translateY(0);
            opacity: 1;
        }
        #ai-full-modal .ai-modal-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
            max-height: inherit;
            overflow: hidden;
            border-radius: calc(1.75rem - 1px);
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
        }
        #ai-full-modal .ai-modal-head {
            position: relative;
            flex-shrink: 0;
            padding: clamp(1.35rem, 3vw, 1.75rem) clamp(1.25rem, 3vw, 2rem) 1.15rem;
            border-bottom: 1px solid rgba(226, 232, 240, 0.9);
            background:
                linear-gradient(135deg, rgba(0, 138, 249, 0.07) 0%, rgba(255, 255, 255, 0) 55%),
                linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
        }
        #ai-full-modal .ai-modal-head::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, #008af9 0%, #38bdf8 50%, transparent 100%);
            border-radius: 1.75rem 1.75rem 0 0;
        }
        #ai-full-modal .ai-modal-head__row {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 1rem;
        }
        #ai-full-modal .ai-modal-head__brand {
            display: flex;
            align-items: flex-start;
            gap: 0.9rem;
            min-width: 0;
        }
        #ai-full-modal .ai-modal-head__icon {
            flex-shrink: 0;
            width: 3rem;
            height: 3rem;
            display: grid;
            place-items: center;
            border-radius: 1rem;
            color: #008af9;
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.14), rgba(0, 138, 249, 0.04));
            border: 1px solid rgba(0, 138, 249, 0.2);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
        }
        #ai-full-modal .ai-modal-head__icon i {
            font-size: 1.25rem;
        }
        #ai-full-modal .ai-modal-head__title {
            margin: 0;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: clamp(1.35rem, 2.8vw, 1.75rem);
            font-weight: 400;
            line-height: 1.15;
            letter-spacing: -0.02em;
            color: #0f172a;
        }
        #ai-full-modal .ai-modal-head__sub {
            margin: 0.35rem 0 0;
            font-family: "DM Sans", sans-serif;
            font-size: 0.8125rem;
            line-height: 1.5;
            color: #64748b;
        }
        #ai-full-modal .ai-modal-head__meta {
            display: inline-flex;
            align-items: center;
            gap: 0.35rem;
            margin-top: 0.65rem;
            padding: 0.3rem 0.65rem;
            border-radius: 999px;
            font-family: "DM Sans", sans-serif;
            font-size: 0.625rem;
            font-weight: 800;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: #008af9;
            background: rgba(0, 138, 249, 0.08);
            border: 1px solid rgba(0, 138, 249, 0.16);
        }
        #ai-full-modal .ai-modal-close {
            flex-shrink: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 2.5rem;
            height: 2.5rem;
            border: 1px solid #e2e8f0;
            border-radius: 999px;
            background: #fff;
            color: #64748b;
            cursor: pointer;
            transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
        }
        #ai-full-modal .ai-modal-close:hover,
        #ai-full-modal .ai-modal-close:focus-visible {
            color: #0f172a;
            border-color: rgba(0, 138, 249, 0.35);
            background: rgba(0, 138, 249, 0.06);
            outline: none;
            transform: scale(1.05);
        }
        #ai-full-modal .ai-modal-search-wrap {
            flex-shrink: 0;
            padding: 0.9rem clamp(1.25rem, 3vw, 2rem) 1rem;
            border-bottom: 1px solid rgba(226, 232, 240, 0.85);
            background: rgba(248, 250, 252, 0.75);
        }
        #ai-full-modal .ai-modal-search {
            position: relative;
        }
        #ai-full-modal .ai-modal-search i {
            position: absolute;
            left: 1.1rem;
            top: 50%;
            transform: translateY(-50%);
            color: #008af9;
            font-size: 0.95rem;
            pointer-events: none;
        }
        #ai-full-modal .ai-modal-search input {
            width: 100%;
            padding: 0.9rem 1rem 0.9rem 2.85rem;
            border-radius: 999px;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: #fff;
            font-family: "DM Sans", sans-serif;
            font-size: 0.9375rem;
            color: #0f172a;
            box-shadow: 0 2px 10px rgba(15, 23, 42, 0.03);
            transition: border-color 0.25s ease, box-shadow 0.25s ease;
        }
        #ai-full-modal .ai-modal-search input::placeholder {
            color: #94a3b8;
        }
        #ai-full-modal .ai-modal-search input:focus {
            outline: none;
            border-color: rgba(0, 138, 249, 0.45);
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.12);
        }
        #ai-full-modal .ai-modal-scroll {
            flex: 1 1 auto;
            min-height: 0;
            overflow-y: auto;
            overflow-x: hidden;
            padding: clamp(1rem, 2.5vw, 1.5rem) clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 3vw, 1.75rem);
            scroll-behavior: smooth;
            scrollbar-width: thin;
            scrollbar-color: #008af9 rgba(226, 232, 240, 0.65);
        }
        #ai-full-modal .ai-modal-scroll::-webkit-scrollbar {
            width: 9px;
        }
        #ai-full-modal .ai-modal-scroll::-webkit-scrollbar-track {
            background: rgba(241, 245, 249, 0.85);
            border-radius: 999px;
            margin: 6px 0;
        }
        #ai-full-modal .ai-modal-scroll::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, #38bdf8 0%, #008af9 55%, #0078e8 100%);
            border-radius: 999px;
            border: 2px solid rgba(241, 245, 249, 0.85);
            box-shadow: 0 0 10px rgba(0, 138, 249, 0.25);
        }
        #ai-full-modal .ai-modal-scroll::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(180deg, #008af9 0%, #0078e8 100%);
        }
        #ai-full-modal #ai-tools-grid {
            display: grid;
            grid-template-columns: repeat(1, minmax(0, 1fr));
            gap: 0.85rem;
        }
        @media (min-width: 640px) {
            #ai-full-modal #ai-tools-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 1rem;
            }
        }
        @media (min-width: 1024px) {
            #ai-full-modal #ai-tools-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }
        @media (min-width: 1280px) {
            #ai-full-modal #ai-tools-grid {
                grid-template-columns: repeat(4, minmax(0, 1fr));
            }
        }
        #ai-full-modal .ai-tool-card {
            display: flex;
            flex-direction: column;
            height: 100%;
            padding: 1.1rem 1.15rem 1.15rem;
            border-radius: 1.15rem;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
            text-decoration: none;
            color: inherit;
            box-shadow: 0 4px 16px -10px rgba(15, 23, 42, 0.1);
            transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.32s ease, box-shadow 0.32s ease;
        }
        #ai-full-modal .ai-tool-card:hover {
            transform: translateY(-4px);
            border-color: rgba(0, 138, 249, 0.28);
            box-shadow:
                0 16px 36px -14px rgba(0, 138, 249, 0.18),
                0 0 0 1px rgba(0, 138, 249, 0.08);
        }
        #ai-full-modal .ai-tool-card__top {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 0.75rem;
            margin-bottom: 0.85rem;
        }
        #ai-full-modal .ai-tool-card__icon {
            width: 2.75rem;
            height: 2.75rem;
            display: grid;
            place-items: center;
            border-radius: 0.85rem;
            font-size: 1.05rem;
            color: #008af9;
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.12), rgba(0, 138, 249, 0.04));
            border: 1px solid rgba(0, 138, 249, 0.18);
            transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
        }
        #ai-full-modal .ai-tool-card:hover .ai-tool-card__icon {
            color: #fff;
            background: linear-gradient(135deg, #008af9, #38bdf8);
            transform: scale(1.05);
        }
        #ai-full-modal .ai-tool-card__arrow {
            width: 1.75rem;
            height: 1.75rem;
            display: grid;
            place-items: center;
            border-radius: 999px;
            font-size: 0.65rem;
            color: #008af9;
            background: rgba(0, 138, 249, 0.08);
            opacity: 0;
            transform: translateX(-4px);
            transition: opacity 0.3s ease, transform 0.3s ease;
        }
        #ai-full-modal .ai-tool-card:hover .ai-tool-card__arrow {
            opacity: 1;
            transform: translateX(0);
        }
        #ai-full-modal .ai-tool-card__title {
            margin: 0 0 0.45rem;
            font-family: "DM Sans", sans-serif;
            font-size: 0.9375rem;
            font-weight: 800;
            line-height: 1.35;
            letter-spacing: -0.01em;
            color: #0f172a;
        }
        #ai-full-modal .ai-tool-card__desc {
            margin: 0;
            flex: 1 1 auto;
            font-family: "DM Sans", sans-serif;
            font-size: 0.8125rem;
            line-height: 1.55;
            color: #64748b;
        }
        #ai-full-modal .ai-modal-empty {
            grid-column: 1 / -1;
            padding: 2.5rem 1rem;
            text-align: center;
            border-radius: 1.15rem;
            border: 1px dashed rgba(148, 163, 184, 0.45);
            background: rgba(248, 250, 252, 0.8);
            font-family: "DM Sans", sans-serif;
            font-size: 0.875rem;
            color: #64748b;
        }
        #ai-full-modal .ai-modal-foot {
            flex-shrink: 0;
            padding: 0.75rem clamp(1.25rem, 3vw, 2rem) 1rem;
            border-top: 1px solid rgba(226, 232, 240, 0.9);
            text-align: center;
            font-family: "DM Sans", sans-serif;
            font-size: 0.6875rem;
            font-weight: 500;
            color: #94a3b8;
            background: rgba(255, 255, 255, 0.85);
        }
        @media (prefers-reduced-motion: reduce) {
            #ai-full-modal #ai-modal-panel {
                transition: none;
            }
            #ai-full-modal .ai-tool-card:hover {
                transform: none;
            }
        }
        .glass-modal-content {
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            border: 1px solid rgba(15, 23, 42, 0.08);
            box-shadow: 0 24px 64px -20px rgba(15, 23, 42, 0.2), 0 0 0 1px rgba(var(--brand-rgb), 0.08), 0 0 40px rgba(var(--brand-rgb), 0.12);
            will-change: transform, opacity;
        }
        .ai-hero-presentation {
            position: relative;
            width: 100%;
            max-width: min(980px, 100%);
            margin: 0 auto 3rem auto;
            min-height: 0;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .ai-hero-spotlight,
        .ai-hero-ground {
            display: none;
        }
        .ai-hero-img {
            position: relative;
            z-index: 5;
            width: min(980px, 100%);
            height: auto;
            max-height: none;
            object-fit: contain;
            opacity: 0;
            transform: translate3d(0, 24px, 0);
            animation: heroImgReveal 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
            will-change: transform, opacity;
        }
        @keyframes heroImgReveal {
            0% { opacity: 0; transform: translate3d(0, 30px, 0) scale(0.98); }
            100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
        }
        .marquee-wrapper {
            display: flex;
            width: max-content;
            min-height: 188.78125px;
            animation: scrollMarquee 50s linear infinite;
            will-change: transform;
        }
        .marquee-wrapper:hover { animation-play-state: paused; }
        @keyframes scrollMarquee {
            0% { transform: translate3d(0, 0, 0); }
            100% { transform: translate3d(-50%, 0, 0); }
        }
        .marquee-top-track {
            display: flex;
            align-items: center;
            width: max-content;
            min-height: 13.125px;
            gap: 2.5rem;
            animation: scrollMarqueeRight 42s linear infinite;
            will-change: transform;
        }
        .marquee-top-track:hover { animation-play-state: paused; }
        @keyframes scrollMarqueeRight {
            0% { transform: translate3d(-50%, 0, 0); }
            100% { transform: translate3d(0, 0, 0); }
        }
        .marquee-top-pill {
            flex-shrink: 0;
            white-space: nowrap;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            font-size: 0.65rem;
            font-weight: 600;
            color: rgba(71, 85, 105, 0.95);
        }
        .marquee-top-pill span { color: #008af9; font-weight: 700; }
        .collision-band {
            position: relative;
            height: 2.75rem;
            overflow: hidden;
            border-radius: 9999px;
            background: rgba(248, 250, 252, 0.95);
            border: 1px solid rgba(15, 23, 42, 0.08);
        }
        .collision-band::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, rgba(255, 255, 255, 0.98), transparent 18%, transparent 82%, rgba(255, 255, 255, 0.98));
            pointer-events: none;
            z-index: 4;
        }
        .collision-center {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            white-space: nowrap;
            font-size: 0.75rem;
            font-weight: 800;
            letter-spacing: 0.04em;
            z-index: 3;
            pointer-events: none;
        }
        .collision-part-left,
        .collision-part-right {
            position: absolute;
            left: 50%;
            top: 50%;
            font-size: 0.75rem;
            font-weight: 700;
            white-space: nowrap;
            z-index: 2;
            color: rgba(30, 41, 59, 0.92);
            will-change: transform, opacity;
        }
        .collision-part-left { animation: collideFromLeft 4.236s cubic-bezier(0.45, 0, 0.2, 1) infinite; }
        .collision-part-right { animation: collideFromRight 4.236s cubic-bezier(0.45, 0, 0.2, 1) infinite; }
        .collision-merged {
            opacity: 0;
            color: #008af9;
            animation: mergeGlowPulse 4.236s cubic-bezier(0.45, 0, 0.2, 1) infinite;
            will-change: transform, opacity, filter;
        }
        @keyframes collideFromLeft {
            0% { opacity: 0; transform: translate(-50%, -50%) translateX(calc(-50vw - 100%)); }
            6% { opacity: 1; }
            44% { opacity: 1; transform: translate(-50%, -50%) translateX(-14px); }
            50% { opacity: 1; transform: translate(-50%, -50%) translateX(0); }
            52.8% { opacity: 0; transform: translate(-50%, -50%) translateX(0); }
            100% { opacity: 0; transform: translate(-50%, -50%) translateX(0); }
        }
        @keyframes collideFromRight {
            0% { opacity: 0; transform: translate(-50%, -50%) translateX(calc(50vw + 100%)); }
            6% { opacity: 1; }
            44% { opacity: 1; transform: translate(-50%, -50%) translateX(14px); }
            50% { opacity: 1; transform: translate(-50%, -50%) translateX(0); }
            52.8% { opacity: 0; transform: translate(-50%, -50%) translateX(0); }
            100% { opacity: 0; transform: translate(-50%, -50%) translateX(0); }
        }
        @keyframes mergeGlowPulse {
            0%, 47% { opacity: 0; transform: translate(-50%, -50%) scale(0.9); filter: blur(8px); text-shadow: none; }
            52% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); filter: blur(0); text-shadow: 0 0 14px rgba(0, 138, 249, 0.95), 0 0 32px rgba(0, 138, 249, 0.65); }
            64% { opacity: 1; transform: translate(-50%, -50%) scale(1.03); filter: blur(0); text-shadow: 0 0 20px rgba(0, 138, 249, 0.95), 0 0 44px rgba(0, 138, 249, 0.55); }
            78% { opacity: 0.35; transform: translate(-50%, -50%) scale(1); filter: blur(2px); text-shadow: 0 0 16px rgba(0, 138, 249, 0.4); }
            85.41%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(1); filter: blur(6px); text-shadow: none; }
        }
        .ai-hub-container .icon-box,
        #ai-full-modal .icon-box {
            background: linear-gradient(135deg, rgba(var(--brand-rgb), 0.14), rgba(var(--brand-rgb), 0.04));
            border: 1px solid rgba(var(--brand-rgb), 0.28);
            box-shadow: inset 0 0 12px rgba(var(--brand-rgb), 0.08);
        }
        @media (max-width: 1024px) {
            .ai-hub-container .glass-card,
            #ai-full-modal .glass-card {
                backdrop-filter: blur(8px);
                -webkit-backdrop-filter: blur(8px);
                box-shadow: 0 4px 12px -4px rgba(15, 23, 42, 0.08), 0 0 0 1px rgba(var(--brand-rgb), 0.04);
                transition: transform 0.3s ease, background 0.3s ease;
            }
            .ai-hub-container .glass-card:hover,
            #ai-full-modal .glass-card:hover {
                transform: translate3d(0, -6px, 0);
                box-shadow: 0 12px 24px -8px rgba(15, 23, 42, 0.1), 0 0 0 1px rgba(var(--brand-rgb), 0.1);
            }
            .glass-modal-bg { backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
            .glass-modal-content {
                backdrop-filter: blur(10px);
                box-shadow: 0 12px 32px -10px rgba(15, 23, 42, 0.2), 0 0 0 1px rgba(var(--brand-rgb), 0.08);
            }
        }
        @media (max-width: 1023px) {
            .ai-hero-presentation { min-height: 300px; margin-bottom: 2rem; }
            .ai-hero-img { width: 100%; max-height: 320px; }
        }
        @media (max-width: 768px) {
            .marquee-wrapper { animation-duration: 35s; }
            .ai-hero-presentation { min-height: 220px; }
            .ai-hero-img { max-height: 240px; }
        }
        @media (prefers-reduced-motion: reduce) {
            .ai-hub-container .marquee-wrapper,
            .ai-hub-container .marquee-top-track,
            .ai-hub-container .collision-part-left,
            .ai-hub-container .collision-part-right,
            .ai-hub-container .collision-merged,
            .ai-hub-container .ai-hero-img {
                animation: none !important;
            }
            .ai-hub-container .ai-hero-img {
                opacity: 1;
                transform: none;
            }
            .ai-hub-container .marquee-top-track {
                transform: translateX(0);
                justify-content: center;
                flex-wrap: wrap;
                width: 100%;
                max-width: 100%;
            }
            .ai-hub-container .collision-part-left,
            .ai-hub-container .collision-part-right { opacity: 0; }
            .ai-hub-container .collision-merged {
                opacity: 1;
                filter: none;
                color: #008af9;
                text-shadow: 0 0 14px rgba(var(--brand-rgb), 0.35);
            }
        }

        /* Veri Merkezi — verimerkezi.html entegrasyonu */
        #veri-merkezi {
            background-color: #ffffff;
        }
        #veri-merkezi .veri-merkezi-hero {
            position: relative;
            z-index: 2;
            width: min(980px, 100%);
            margin-left: auto;
            margin-right: auto;
            background-color: #ffffff;
        }
        #veri-merkezi .veri-merkezi-hero img {
            display: block;
            width: min(980px, 100%);
            height: auto;
            margin: 0 auto;
            object-fit: contain;
            background-color: #ffffff;
        }
        #veri-merkezi .vm-section-intro {
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        #veri-merkezi .vm-section-kicker {
            margin-bottom: clamp(1.35rem, 3.2vw, 1.85rem);
        }
        #veri-merkezi .vm-section-title {
            margin-top: 0;
        }
        #veri-merkezi .vm-section-lead {
            margin-top: clamp(1rem, 2.5vw, 1.5rem);
        }
        #parsel-imar .parsel-imar-showcase {
            position: relative;
            z-index: 2;
            width: min(680px, 82%);
            margin-left: auto;
            margin-right: auto;
        }
        #parsel-imar .parsel-imar-showcase img {
            display: block;
            width: 100%;
            height: auto;
            margin: 0 auto;
            object-fit: contain;
            border-radius: 1rem;
            border: 1px solid rgba(226, 232, 240, 0.9);
            box-shadow: 0 16px 40px -14px rgba(15, 23, 42, 0.14);
        }
        #parsel-imar .parsel-imar-actions {
            display: flex;
            justify-content: center;
            margin-top: clamp(1.75rem, 3.5vw, 2.25rem);
        }
        #parsel-imar .parsel-imar-cta {
            display: inline-flex;
            align-items: center;
            gap: 0.75rem;
            padding: 1rem 1.75rem 1rem 2rem;
            border-radius: 9999px;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: -0.01em;
            color: #fff;
            text-decoration: none;
            background: linear-gradient(135deg, #0078e8 0%, #008af9 55%, #38bdf8 100%);
            box-shadow: 0 10px 30px -6px rgba(0, 138, 249, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18);
            transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease, filter 0.3s ease;
        }
        #parsel-imar .parsel-imar-cta:hover,
        #parsel-imar .parsel-imar-cta:focus-visible {
            transform: translateY(-2px) scale(1.02);
            box-shadow: 0 14px 36px -4px rgba(0, 138, 249, 0.52);
            filter: brightness(1.03);
            outline: none;
        }
        #parsel-imar .parsel-imar-cta:active {
            transform: translateY(0) scale(0.99);
        }
        #parsel-imar .parsel-imar-cta__icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 1.75rem;
            height: 1.75rem;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.2);
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
        }
        #parsel-imar .parsel-imar-cta__icon svg {
            width: 0.875rem;
            height: 0.875rem;
        }
        #parsel-imar .parsel-imar-cta:hover .parsel-imar-cta__icon,
        #parsel-imar .parsel-imar-cta:focus-visible .parsel-imar-cta__icon {
            transform: translate(2px, -2px);
        }
        #parsel-imar .parsel-studio-header {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            margin-bottom: clamp(2rem, 4vw, 2.75rem);
        }
        #parsel-imar .parsel-studio-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 0.625rem;
            padding: 0.625rem 1.25rem;
            border-radius: 9999px;
            border: 1px solid rgba(0, 138, 249, 0.18);
            background: rgba(255, 255, 255, 0.82);
            backdrop-filter: blur(12px);
            box-shadow: 0 8px 24px -8px rgba(0, 138, 249, 0.12);
        }
        #parsel-imar .parsel-studio-pulse span:first-child {
            animation: pulseGlow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }
        #parsel-imar .parsel-studio-title {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0.08em;
            margin-top: clamp(1.5rem, 3vw, 2rem);
            margin-inline: auto;
            line-height: 1.1;
            max-width: min(100%, 22rem);
        }
        #parsel-imar .parsel-studio-title__line {
            display: block;
        }
        #parsel-imar .parsel-studio-title br {
            display: none;
        }
        #parsel-imar .parsel-studio-lead {
            margin-top: clamp(1rem, 2.2vw, 1.35rem);
            max-width: min(100%, 40rem);
            margin-inline: auto;
            text-wrap: pretty;
        }
        #parsel-imar .parsel-studio-chips {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            gap: 0.5rem;
            width: 100%;
            max-width: 36rem;
            margin: clamp(1.35rem, 2.8vw, 1.75rem) auto 0;
            padding-inline: 0.25rem;
        }
        #parsel-imar .parsel-studio-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0.5rem 0.9rem;
            border-radius: 9999px;
            font-size: 0.8125rem;
            font-weight: 600;
            letter-spacing: -0.01em;
            line-height: 1.2;
            white-space: nowrap;
            color: #334155;
            background: #f8fafc;
            border: 1px solid rgba(226, 232, 240, 0.95);
            box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
            transition: border-color 0.25s ease, color 0.25s ease, background 0.25s ease;
        }
        #parsel-imar .parsel-studio-chip:hover {
            color: #008af9;
            background: #f0f7ff;
            border-color: rgba(0, 138, 249, 0.22);
        }
        @media (max-width: 639px) {
            #parsel-imar .parsel-studio-title {
                max-width: 100%;
                font-size: clamp(1.65rem, 7.5vw, 2rem);
            }
            #parsel-imar .parsel-studio-chip {
                white-space: normal;
                text-align: center;
                font-size: 0.75rem;
                font-weight: 700;
                line-height: 1.35;
                padding: 0.7rem 0.55rem;
                min-height: 2.85rem;
                border-radius: 0.85rem;
            }
            #parsel-imar .parsel-studio-chips {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 0.55rem;
                max-width: 100%;
                width: 100%;
                padding-inline: 0.15rem;
            }
        }
        #mahalle-rapor .mahalle-rapor-showcase {
            position: relative;
            z-index: 2;
            width: min(680px, 82%);
            margin-left: auto;
            margin-right: auto;
        }
        #mahalle-rapor .mahalle-rapor-showcase img {
            display: block;
            width: 100%;
            height: auto;
            margin: 0 auto;
            object-fit: contain;
            border-radius: 1rem;
            border: 1px solid rgba(226, 232, 240, 0.9);
            box-shadow: 0 16px 40px -14px rgba(15, 23, 42, 0.14);
        }
        #mahalle-rapor .mahalle-rapor-actions {
            display: flex;
            justify-content: center;
            margin-top: clamp(1.75rem, 3.5vw, 2.25rem);
        }
        #mahalle-rapor .mahalle-rapor-cta {
            display: inline-flex;
            align-items: center;
            gap: 0.75rem;
            padding: 1rem 1.75rem 1rem 2rem;
            border-radius: 9999px;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: -0.01em;
            color: #fff;
            text-decoration: none;
            background: linear-gradient(135deg, #0078e8 0%, #008af9 55%, #38bdf8 100%);
            box-shadow: 0 10px 30px -6px rgba(0, 138, 249, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18);
            transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease, filter 0.3s ease;
        }
        #mahalle-rapor .mahalle-rapor-cta:hover,
        #mahalle-rapor .mahalle-rapor-cta:focus-visible {
            transform: translateY(-2px) scale(1.02);
            box-shadow: 0 14px 36px -4px rgba(0, 138, 249, 0.52);
            filter: brightness(1.03);
            outline: none;
        }
        #mahalle-rapor .mahalle-rapor-cta:active {
            transform: translateY(0) scale(0.99);
        }
        #mahalle-rapor .mahalle-rapor-cta__icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 1.75rem;
            height: 1.75rem;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.2);
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
        }
        #mahalle-rapor .mahalle-rapor-cta__icon svg {
            width: 0.875rem;
            height: 0.875rem;
        }
        #mahalle-rapor .mahalle-rapor-cta:hover .mahalle-rapor-cta__icon,
        #mahalle-rapor .mahalle-rapor-cta:focus-visible .mahalle-rapor-cta__icon {
            transform: translate(2px, -2px);
        }
        #mahalle-rapor .mahalle-rapor-header {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            margin-bottom: clamp(2rem, 4vw, 2.75rem);
        }
        #mahalle-rapor .mahalle-rapor-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 0.625rem;
            padding: 0.625rem 1.25rem;
            border-radius: 9999px;
            border: 1px solid rgba(0, 138, 249, 0.18);
            background: rgba(255, 255, 255, 0.82);
            backdrop-filter: blur(12px);
            box-shadow: 0 8px 24px -8px rgba(0, 138, 249, 0.12);
        }
        #mahalle-rapor .mahalle-rapor-pulse span:first-child {
            animation: pulseGlow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }
        #mahalle-rapor .mahalle-rapor-title {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0.08em;
            margin-top: clamp(1.5rem, 3vw, 2rem);
            margin-inline: auto;
            line-height: 1.1;
            max-width: min(100%, 24rem);
        }
        #mahalle-rapor .mahalle-rapor-title__line {
            display: block;
        }
        #mahalle-rapor .mahalle-rapor-lead {
            margin-top: clamp(1rem, 2.2vw, 1.35rem);
            max-width: min(100%, 40rem);
            margin-inline: auto;
            text-wrap: pretty;
        }
        #mahalle-rapor .mahalle-rapor-chips {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            gap: 0.5rem;
            width: 100%;
            max-width: 36rem;
            margin: clamp(1.35rem, 2.8vw, 1.75rem) auto 0;
            padding-inline: 0.25rem;
        }
        #mahalle-rapor .mahalle-rapor-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0.5rem 0.9rem;
            border-radius: 9999px;
            font-size: 0.8125rem;
            font-weight: 600;
            letter-spacing: -0.01em;
            line-height: 1.2;
            white-space: nowrap;
            color: #334155;
            background: #f8fafc;
            border: 1px solid rgba(226, 232, 240, 0.95);
            box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
            transition: border-color 0.25s ease, color 0.25s ease, background 0.25s ease;
        }
        #mahalle-rapor .mahalle-rapor-chip:hover {
            color: #008af9;
            background: #f0f7ff;
            border-color: rgba(0, 138, 249, 0.22);
        }
        @media (max-width: 639px) {
            #mahalle-rapor .mahalle-rapor-title {
                max-width: 100%;
                font-size: clamp(1.65rem, 7.5vw, 2rem);
            }
            #mahalle-rapor .mahalle-rapor-chip {
                white-space: normal;
                text-align: center;
                font-size: 0.75rem;
                font-weight: 700;
                line-height: 1.35;
                padding: 0.7rem 0.55rem;
                min-height: 2.85rem;
                border-radius: 0.85rem;
            }
            #mahalle-rapor .mahalle-rapor-chips {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 0.55rem;
                max-width: 100%;
                width: 100%;
                padding-inline: 0.15rem;
            }
        }
        #deneyim .deneyim-showcase {
            position: relative;
            z-index: 2;
            width: min(680px, 82%);
            margin-left: auto;
            margin-right: auto;
            margin-bottom: clamp(1.75rem, 4vw, 2.5rem);
            background: transparent;
        }
        #deneyim .deneyim-showcase img {
            display: block;
            width: 100%;
            height: auto;
            margin: 0 auto;
            object-fit: contain;
            border: none;
            border-radius: 0;
            box-shadow: none;
            background: transparent;
        }
        /* Haberdar Olun — abonelik formu */
        #haberdar-olun .haberdar-wrap {
            max-width: 42rem;
        }
        #haberdar-olun .haberdar-card {
            margin-top: clamp(1.75rem, 4vw, 2.5rem);
            padding: clamp(1.5rem, 4vw, 2.25rem);
            border-radius: 1.75rem;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: linear-gradient(165deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: 0 20px 50px -20px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(255, 255, 255, 0.8) inset;
        }
        #haberdar-olun .haberdar-form {
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }
        #haberdar-olun .haberdar-fields {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1rem;
        }
        @media (min-width: 640px) {
            #haberdar-olun .haberdar-fields {
                grid-template-columns: 1fr 1fr;
                gap: 1rem 1.25rem;
            }
        }
        #haberdar-olun .haberdar-field {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            text-align: left;
        }
        #haberdar-olun .haberdar-label {
            font-size: 0.8125rem;
            font-weight: 600;
            letter-spacing: -0.01em;
            color: #334155;
        }
        #haberdar-olun .haberdar-label-optional {
            font-weight: 500;
            color: #94a3b8;
        }
        #haberdar-olun .haberdar-input-wrap {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            padding: 0 1rem;
            min-height: 3.25rem;
            border-radius: 1rem;
            border: 1px solid #e2e8f0;
            background: #fff;
            transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
        }
        #haberdar-olun .haberdar-input-wrap:focus-within {
            border-color: rgba(0, 138, 249, 0.55);
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.1);
        }
        #haberdar-olun .haberdar-input-wrap:has(.form-input-invalid) {
            border-color: #ef4444;
            box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1);
        }
        #haberdar-olun .haberdar-input-icon {
            flex-shrink: 0;
            width: 1.125rem;
            height: 1.125rem;
            color: #94a3b8;
            transition: color 0.25s ease;
        }
        #haberdar-olun .haberdar-input-wrap:focus-within .haberdar-input-icon {
            color: #008af9;
        }
        #haberdar-olun .haberdar-input {
            flex: 1;
            min-width: 0;
            padding: 0.875rem 0;
            border: none;
            background: transparent;
            font-size: 0.9375rem;
            font-weight: 500;
            color: #0f172a;
            outline: none;
        }
        #haberdar-olun .haberdar-input::placeholder {
            color: #94a3b8;
            font-weight: 400;
        }
        #haberdar-olun .haberdar-error {
            margin-top: 0;
            text-align: left;
        }
        #haberdar-olun .haberdar-prefs {
            margin: 0;
            padding: 0;
            border: none;
        }
        #haberdar-olun .haberdar-prefs-legend {
            width: 100%;
            margin-bottom: 0.75rem;
            font-size: 0.8125rem;
            font-weight: 600;
            letter-spacing: -0.01em;
            color: #334155;
            text-align: center;
        }
        #haberdar-olun .haberdar-prefs-grid {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 0.75rem;
        }
        #haberdar-olun .haberdar-pref {
            position: relative;
            cursor: pointer;
        }
        #haberdar-olun .haberdar-pref input {
            position: absolute;
            opacity: 0;
            width: 0;
            height: 0;
            pointer-events: none;
        }
        #haberdar-olun .haberdar-pref-box {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.65rem 1.1rem;
            border-radius: 9999px;
            border: 1px solid #e2e8f0;
            background: #fff;
            font-size: 0.875rem;
            font-weight: 600;
            color: #475569;
            transition: border-color 0.25s ease, background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
        }
        #haberdar-olun .haberdar-pref-box svg {
            width: 1rem;
            height: 1rem;
            flex-shrink: 0;
            color: #94a3b8;
            transition: color 0.25s ease;
        }
        #haberdar-olun .haberdar-pref:hover .haberdar-pref-box {
            border-color: rgba(0, 138, 249, 0.35);
            background: rgba(0, 138, 249, 0.04);
        }
        #haberdar-olun .haberdar-pref input:checked + .haberdar-pref-box {
            border-color: rgba(0, 138, 249, 0.5);
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.1) 0%, rgba(56, 189, 248, 0.08) 100%);
            color: #0078e8;
            box-shadow: 0 4px 14px -4px rgba(0, 138, 249, 0.35);
        }
        #haberdar-olun .haberdar-pref input:checked + .haberdar-pref-box svg {
            color: #008af9;
        }
        #haberdar-olun .haberdar-pref input:focus-visible + .haberdar-pref-box {
            outline: 2px solid rgba(0, 138, 249, 0.45);
            outline-offset: 2px;
        }
        #haberdar-olun .haberdar-submit-wrap {
            display: flex;
            justify-content: center;
            padding-top: 0.25rem;
        }
        #haberdar-olun .haberdar-submit {
            display: inline-flex;
            align-items: center;
            gap: 0.75rem;
            padding: 1rem 2rem 1rem 2.25rem;
            border: none;
            border-radius: 9999px;
            font-family: inherit;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: -0.01em;
            color: #fff;
            cursor: pointer;
            background: linear-gradient(135deg, #0078e8 0%, #008af9 55%, #38bdf8 100%);
            box-shadow: 0 10px 30px -6px rgba(0, 138, 249, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18);
            transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease, filter 0.3s ease;
        }
        #haberdar-olun .haberdar-submit:hover,
        #haberdar-olun .haberdar-submit:focus-visible {
            transform: translateY(-2px) scale(1.02);
            box-shadow: 0 14px 36px -4px rgba(0, 138, 249, 0.52);
            filter: brightness(1.03);
            outline: none;
        }
        #haberdar-olun .haberdar-submit:active {
            transform: translateY(0) scale(0.99);
        }
        #haberdar-olun .haberdar-submit-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 1.75rem;
            height: 1.75rem;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.2);
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
        }
        #haberdar-olun .haberdar-submit-icon svg {
            width: 0.875rem;
            height: 0.875rem;
        }
        #haberdar-olun .haberdar-submit:hover .haberdar-submit-icon,
        #haberdar-olun .haberdar-submit:focus-visible .haberdar-submit-icon {
            transform: translateX(2px);
        }
        /* Yasal / İletişim modalları */
        #legal-modal {
            background: rgba(15, 23, 42, 0.45);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
        #legal-modal .legal-modal__panel {
            position: relative;
            width: 100%;
            max-width: 42rem;
            max-height: min(88vh, 820px);
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-radius: 1.75rem;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: 0 24px 64px -20px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(0, 138, 249, 0.06);
            transform: scale(0.96) translateY(10px);
            opacity: 0;
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
        }
        #legal-modal.legal-modal--open .legal-modal__panel {
            transform: scale(1) translateY(0);
            opacity: 1;
        }
        #legal-modal .legal-modal__header {
            position: relative;
            flex-shrink: 0;
            padding: clamp(1.5rem, 4vw, 2rem) clamp(1.5rem, 4vw, 2rem) 1.25rem;
            border-bottom: 1px solid rgba(226, 232, 240, 0.9);
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.06) 0%, rgba(255, 255, 255, 0) 55%);
        }
        #legal-modal .legal-modal__header::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, #008af9 0%, #38bdf8 50%, transparent 100%);
        }
        #legal-modal .legal-modal__close {
            position: absolute;
            top: 1rem;
            right: 1rem;
            z-index: 2;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 2.5rem;
            height: 2.5rem;
            border: 1px solid #e2e8f0;
            border-radius: 9999px;
            background: #fff;
            color: #64748b;
            cursor: pointer;
            transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
        }
        #legal-modal .legal-modal__close:hover,
        #legal-modal .legal-modal__close:focus-visible {
            color: #0f172a;
            border-color: rgba(0, 138, 249, 0.35);
            background: rgba(0, 138, 249, 0.06);
            outline: none;
            transform: scale(1.05);
        }
        #legal-modal .legal-modal__close svg {
            width: 1.125rem;
            height: 1.125rem;
        }
        #legal-modal .legal-modal__header-inner {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            padding-right: 2.5rem;
        }
        #legal-modal .legal-modal__badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            margin-bottom: 1rem;
            padding: 0.4rem 0.85rem;
            border-radius: 9999px;
            border: 1px solid rgba(0, 138, 249, 0.2);
            background: rgba(0, 138, 249, 0.08);
            font-size: 0.6875rem;
            font-weight: 700;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: #0078e8;
        }
        #legal-modal .legal-modal__icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 3.25rem;
            height: 3.25rem;
            margin-bottom: 0.85rem;
            border-radius: 1rem;
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.14) 0%, rgba(56, 189, 248, 0.08) 100%);
            border: 1px solid rgba(0, 138, 249, 0.18);
            color: #008af9;
        }
        #legal-modal .legal-modal__icon svg {
            width: 1.375rem;
            height: 1.375rem;
        }
        #legal-modal .legal-modal__title {
            margin: 0;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: clamp(1.5rem, 4vw, 1.85rem);
            font-weight: 400;
            line-height: 1.15;
            letter-spacing: -0.03em;
            color: #0f172a;
        }
        #legal-modal .legal-modal__subtitle {
            margin: 0.5rem 0 0;
            max-width: 32ch;
            font-size: 0.875rem;
            line-height: 1.55;
            color: #64748b;
        }
        #legal-modal .legal-modal__body {
            flex: 1;
            min-height: 0;
            overflow-y: auto;
            padding: clamp(1.25rem, 3vw, 1.75rem) clamp(1.5rem, 4vw, 2rem);
            scroll-behavior: smooth;
        }
        #legal-modal .legal-modal__body::-webkit-scrollbar {
            width: 6px;
        }
        #legal-modal .legal-modal__body::-webkit-scrollbar-thumb {
            background: rgba(148, 163, 184, 0.45);
            border-radius: 9999px;
        }
        #legal-modal .legal-modal__body h4 {
            margin: 1.5rem 0 0.5rem;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: -0.01em;
            color: #0f172a;
        }
        #legal-modal .legal-modal__body h4:first-child {
            margin-top: 0;
        }
        #legal-modal .legal-modal__body p {
            margin: 0 0 1rem;
            font-size: 0.9375rem;
            line-height: 1.7;
            color: #475569;
        }
        #legal-modal .legal-modal__body p:last-child {
            margin-bottom: 0;
        }
        #legal-modal .legal-block {
            padding: 1rem 1.15rem;
            border-radius: 1rem;
            border: 1px solid #e2e8f0;
            background: #fff;
            margin-bottom: 0.85rem;
        }
        #legal-modal .legal-block:last-child {
            margin-bottom: 0;
        }
        #legal-modal .legal-block h4 {
            margin-top: 0;
            color: #008af9;
        }
        #legal-modal .legal-block p {
            margin-bottom: 0;
        }
        #legal-modal .legal-contact {
            display: flex;
            flex-direction: column;
            gap: 0.85rem;
        }
        #legal-modal .legal-contact a {
            display: block;
            border-radius: 1rem;
            overflow: hidden;
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }
        #legal-modal .legal-contact a:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 28px -10px rgba(0, 138, 249, 0.25);
        }
        #legal-modal .legal-contact img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 1rem;
        }
        #legal-modal .legal-modal__footer {
            flex-shrink: 0;
            display: flex;
            justify-content: center;
            padding: 1rem clamp(1.5rem, 4vw, 2rem) clamp(1.25rem, 3vw, 1.5rem);
            border-top: 1px solid rgba(226, 232, 240, 0.9);
            background: rgba(248, 250, 252, 0.85);
        }
        #legal-modal .legal-modal__footer-btn {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.75rem 1.75rem;
            border: none;
            border-radius: 9999px;
            font-family: inherit;
            font-size: 0.875rem;
            font-weight: 700;
            color: #fff;
            cursor: pointer;
            background: linear-gradient(135deg, #0078e8 0%, #008af9 55%, #38bdf8 100%);
            box-shadow: 0 8px 24px -6px rgba(0, 138, 249, 0.4);
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }
        #legal-modal .legal-modal__footer-btn:hover,
        #legal-modal .legal-modal__footer-btn:focus-visible {
            transform: translateY(-1px);
            box-shadow: 0 12px 28px -4px rgba(0, 138, 249, 0.48);
            outline: none;
        }
        @media (prefers-reduced-motion: reduce) {
            #legal-modal .legal-modal__panel,
            #legal-modal.legal-modal--open .legal-modal__panel {
                transform: none;
                transition: none;
            }
        }
        /* Uygulama modalları — istek, giriş, üyelik, auth */
        .gp-app-modal {
            background: rgba(15, 23, 42, 0.45);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
        .gp-app-modal .gp-app-modal__panel {
            position: relative;
            width: 100%;
            max-width: 28rem;
            max-height: min(90dvh, calc(100dvh - 1.25rem), 780px);
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-radius: 1.75rem;
            border: 1px solid rgba(226, 232, 240, 0.95);
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: 0 24px 64px -20px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(0, 138, 249, 0.06);
            transform: scale(0.96) translateY(10px);
            opacity: 0;
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
        }
        .gp-app-modal .gp-app-modal__panel--lg {
            max-width: 36rem;
        }
        .gp-app-modal .gp-app-modal__panel--xl {
            max-width: min(56rem, 96vw);
        }
        .gp-app-modal.gp-app-modal--open .gp-app-modal__panel {
            transform: scale(1) translateY(0);
            opacity: 1;
        }
        @media (max-width: 639px) {
            .gp-app-modal {
                padding: max(1rem, env(safe-area-inset-top, 0px)) max(1rem, env(safe-area-inset-right, 0px)) max(1rem, env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left, 0px));
            }
            .gp-app-modal .gp-app-modal__panel {
                max-height: min(90dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 2rem), 780px);
            }
            .gp-app-modal .gp-app-modal__panel--lg {
                max-width: min(94vw, 36rem);
            }
        }
        .gp-app-modal .gp-app-modal__close {
            position: absolute;
            top: 1rem;
            right: 1rem;
            z-index: 3;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 2.5rem;
            height: 2.5rem;
            border: 1px solid #e2e8f0;
            border-radius: 9999px;
            background: #fff;
            color: #64748b;
            cursor: pointer;
            transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
        }
        .gp-app-modal .gp-app-modal__close:hover,
        .gp-app-modal .gp-app-modal__close:focus-visible {
            color: #0f172a;
            border-color: rgba(0, 138, 249, 0.35);
            background: rgba(0, 138, 249, 0.06);
            outline: none;
            transform: scale(1.05);
        }
        .gp-app-modal .gp-app-modal__close svg {
            width: 1.125rem;
            height: 1.125rem;
        }
        .gp-app-modal .gp-app-modal__header {
            position: relative;
            flex-shrink: 0;
            padding: clamp(1.5rem, 4vw, 2rem) clamp(3rem, 5vw, 3.5rem) 1rem;
            text-align: center;
            border-bottom: 1px solid rgba(226, 232, 240, 0.9);
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.06) 0%, rgba(255, 255, 255, 0) 55%);
        }
        .gp-app-modal .gp-app-modal__header::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, #008af9 0%, #38bdf8 50%, transparent 100%);
            border-radius: 1.75rem 1.75rem 0 0;
        }
        .gp-app-modal .gp-app-modal__icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 3.25rem;
            height: 3.25rem;
            margin-bottom: 0.85rem;
            border-radius: 1rem;
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.14) 0%, rgba(56, 189, 248, 0.08) 100%);
            border: 1px solid rgba(0, 138, 249, 0.18);
            color: #008af9;
        }
        .gp-app-modal .gp-app-modal__icon svg,
        .gp-app-modal .gp-app-modal__icon i {
            width: 1.375rem;
            height: 1.375rem;
        }
        .gp-app-modal .gp-app-modal__header-inner {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
        }
        .gp-app-modal .gp-app-modal__title {
            margin: 0;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: clamp(1.35rem, 3.5vw, 1.65rem);
            font-weight: 400;
            line-height: 1.15;
            letter-spacing: -0.03em;
            color: #0f172a;
            text-align: center;
            width: 100%;
        }
        .gp-app-modal .gp-app-modal__subtitle {
            margin: 0.5rem 0 0;
            padding: 0 0.5rem;
            font-size: 0.875rem;
            line-height: 1.55;
            color: #64748b;
        }
        .gp-app-modal .gp-app-modal__body {
            flex: 1;
            min-height: 0;
            overflow-y: auto;
            padding: clamp(1.25rem, 3vw, 1.75rem) clamp(1.5rem, 4vw, 2rem);
        }
        .gp-app-modal .gp-app-modal__body::-webkit-scrollbar {
            width: 6px;
        }
        .gp-app-modal .gp-app-modal__body::-webkit-scrollbar-thumb {
            background: rgba(148, 163, 184, 0.45);
            border-radius: 9999px;
        }
        .gp-app-modal .gp-app-modal__footer {
            flex-shrink: 0;
            padding: 0 clamp(1.5rem, 4vw, 2rem) clamp(1.25rem, 3vw, 1.5rem);
        }
        .gp-app-modal .gp-modal-form {
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }
        .gp-app-modal .gp-modal-form-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1rem;
        }
        @media (min-width: 640px) {
            .gp-app-modal .gp-modal-form-grid--2 {
                grid-template-columns: 1fr 1fr;
            }
        }
        .gp-app-modal .gp-modal-field {
            display: flex;
            flex-direction: column;
            gap: 0.45rem;
            text-align: left;
        }
        .gp-app-modal .gp-modal-label {
            font-size: 0.8125rem;
            font-weight: 600;
            letter-spacing: -0.01em;
            color: #334155;
        }
        .gp-app-modal .gp-modal-input-wrap {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            padding: 0 1rem;
            min-height: 3.125rem;
            border-radius: 1rem;
            border: 1px solid #e2e8f0;
            background: #fff;
            transition: border-color 0.25s ease, box-shadow 0.25s ease;
        }
        .gp-app-modal .gp-modal-input-wrap:focus-within {
            border-color: rgba(0, 138, 249, 0.55);
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.1);
        }
        .gp-app-modal .gp-modal-input-wrap:has(.form-input-invalid) {
            border-color: #ef4444;
            box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1);
        }
        .gp-app-modal .gp-modal-input-icon {
            flex-shrink: 0;
            width: 1.0625rem;
            height: 1.0625rem;
            color: #94a3b8;
        }
        .gp-app-modal .gp-modal-input-wrap:focus-within .gp-modal-input-icon {
            color: #008af9;
        }
        .gp-app-modal .gp-modal-input {
            flex: 1;
            min-width: 0;
            padding: 0.8125rem 0;
            border: none;
            background: transparent;
            font-size: 0.9375rem;
            font-weight: 500;
            color: #0f172a;
            outline: none;
        }
        .gp-app-modal .gp-modal-input--boxed,
        .gp-app-modal .gp-modal-textarea {
            display: block;
            width: 100%;
            padding: 0.8125rem 1rem;
            border-radius: 1rem;
            border: 1px solid #e2e8f0;
            background: #fff;
            font-size: 0.9375rem;
            font-weight: 500;
            color: #0f172a;
            outline: none;
            transition: border-color 0.25s ease, box-shadow 0.25s ease;
        }
        .gp-app-modal .gp-modal-textarea {
            min-height: 5.5rem;
            resize: vertical;
            line-height: 1.55;
        }
        .gp-app-modal .gp-modal-input--boxed:focus,
        .gp-app-modal .gp-modal-textarea:focus {
            border-color: rgba(0, 138, 249, 0.55);
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.1);
        }
        .gp-app-modal .gp-modal-input--boxed.form-input-invalid,
        .gp-app-modal .gp-modal-textarea.form-input-invalid {
            border-color: #ef4444;
            box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1);
        }
        .gp-app-modal .gp-modal-input::placeholder,
        .gp-app-modal .gp-modal-input--boxed::placeholder,
        .gp-app-modal .gp-modal-textarea::placeholder {
            color: #94a3b8;
            font-weight: 400;
        }
        .gp-app-modal .gp-modal-error {
            margin-top: 0;
            text-align: left;
        }
        .gp-app-modal .gp-modal-submit {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.9375rem 1.5rem;
            border: none;
            border-radius: 9999px;
            font-family: inherit;
            font-size: 0.9375rem;
            font-weight: 700;
            letter-spacing: -0.01em;
            color: #fff;
            cursor: pointer;
            background: linear-gradient(135deg, #0078e8 0%, #008af9 55%, #38bdf8 100%);
            box-shadow: 0 10px 30px -6px rgba(0, 138, 249, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18);
            transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease, filter 0.3s ease;
        }
        .gp-app-modal .gp-modal-submit:hover,
        .gp-app-modal .gp-modal-submit:focus-visible {
            transform: translateY(-2px);
            box-shadow: 0 14px 36px -4px rgba(0, 138, 249, 0.52);
            filter: brightness(1.03);
            outline: none;
        }
        .gp-app-modal .gp-modal-submit:active {
            transform: translateY(0);
        }
        .gp-app-modal .gp-modal-actions {
            display: flex;
            flex-direction: column;
            gap: 0.75rem;
        }
        @media (min-width: 480px) {
            .gp-app-modal .gp-modal-actions {
                flex-direction: row;
            }
        }
        .gp-app-modal .gp-modal-btn-secondary {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            padding: 0.9375rem 1.5rem;
            border-radius: 9999px;
            border: 1px solid #e2e8f0;
            background: #fff;
            font-family: inherit;
            font-size: 0.9375rem;
            font-weight: 700;
            color: #334155;
            cursor: pointer;
            transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease;
        }
        .gp-app-modal .gp-modal-btn-secondary:hover,
        .gp-app-modal .gp-modal-btn-secondary:focus-visible {
            border-color: rgba(0, 138, 249, 0.35);
            background: rgba(0, 138, 249, 0.04);
            outline: none;
            transform: translateY(-1px);
        }
        .gp-app-modal .gp-modal-success {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            padding: 1rem 0 0.5rem;
        }
        .gp-app-modal .gp-modal-success.hidden,
        .gp-app-modal .gp-modal-form.hidden,
        .gp-app-modal .hidden {
            display: none !important;
        }
        .gp-app-modal .gp-modal-success__icon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 4.5rem;
            height: 4.5rem;
            margin-bottom: 1.25rem;
            border-radius: 9999px;
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.14) 0%, rgba(56, 189, 248, 0.1) 100%);
            border: 1px solid rgba(0, 138, 249, 0.2);
            color: #008af9;
        }
        .gp-app-modal .gp-modal-success__icon svg,
        .gp-app-modal .gp-modal-success__icon i {
            width: 2rem;
            height: 2rem;
        }
        .gp-app-modal .gp-modal-success__title {
            margin: 0 0 0.5rem;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: 1.5rem;
            font-weight: 400;
            color: #0f172a;
        }
        .gp-app-modal .gp-modal-success__text {
            margin: 0;
            font-size: 0.9375rem;
            line-height: 1.6;
            color: #64748b;
        }
        @media (prefers-reduced-motion: reduce) {
            .gp-app-modal .gp-app-modal__panel,
            .gp-app-modal.gp-app-modal--open .gp-app-modal__panel {
                transform: none;
                transition: none;
            }
        }
        #veri-merkezi .clamp-2 {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden;
        }
        #veri-merkezi .noise {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
            background-size: 220px 220px;
            mix-blend-mode: overlay;
            opacity: 0.35;
        }
        #veri-merkezi .focus-ring:focus-visible {
            outline: none;
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.18);
        }
        #veri-merkezi .chip {
            backdrop-filter: blur(16px) saturate(150%);
            -webkit-backdrop-filter: blur(16px) saturate(150%);
        }
        #veri-merkezi .floaty { animation: vmFloaty 9s ease-in-out infinite; }
        #veri-merkezi .floaty-slow { animation: vmFloatySlow 14s ease-in-out infinite; }
        /* Analiz Motoru — tipografi silüeti */
        #veri-merkezi .vm-analyze-shell {
            position: relative;
            border-radius: 26px;
            padding: 1px;
            background: linear-gradient(145deg, rgba(0, 138, 249, 0.18), rgba(226, 232, 240, 0.55) 42%, rgba(0, 138, 249, 0.08));
            box-shadow:
                0 24px 56px -28px rgba(15, 23, 42, 0.14),
                inset 0 1px 0 rgba(255, 255, 255, 0.85);
        }
        #veri-merkezi .vm-analyze-shell__inner {
            border-radius: 25px;
            background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.92) 100%);
            padding: clamp(1rem, 2.5vw, 1.5rem);
            overflow: hidden;
        }
        #veri-merkezi .vm-analyze-stage {
            position: relative;
            min-height: clamp(270px, 40vw, 360px);
            border-radius: 22px;
            overflow: hidden;
            isolation: isolate;
            background:
                radial-gradient(ellipse 70% 55% at 50% 88%, rgba(0, 138, 249, 0.07) 0%, transparent 68%),
                linear-gradient(180deg, rgba(248, 250, 252, 0.35) 0%, rgba(255, 255, 255, 0.92) 48%, rgba(241, 245, 249, 0.88) 100%);
        }
        #veri-merkezi .vm-stage-ambient {
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at 18% 22%, rgba(0, 138, 249, 0.07) 0%, transparent 34%),
                radial-gradient(circle at 82% 28%, rgba(148, 163, 184, 0.08) 0%, transparent 30%),
                radial-gradient(circle at 50% 62%, rgba(0, 138, 249, 0.04) 0%, transparent 42%);
        }
        #veri-merkezi .vm-stage-scan {
            position: absolute;
            left: 0;
            right: 0;
            top: 38%;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(0, 138, 249, 0.22), transparent);
            opacity: 0.55;
            animation: vmStageScan 7s ease-in-out infinite;
            pointer-events: none;
        }
        @keyframes vmStageScan {
            0%, 100% { transform: translateY(-28px); opacity: 0.15; }
            50% { transform: translateY(42px); opacity: 0.55; }
        }
        #veri-merkezi .vm-analyze-stage::before {
            content: '';
            position: absolute;
            inset: 0;
            background-image: radial-gradient(rgba(148, 163, 184, 0.11) 1px, transparent 1px);
            background-size: 22px 22px;
            mask-image: linear-gradient(180deg, transparent 0%, black 16%, black 84%, transparent 100%);
            -webkit-mask-image: linear-gradient(180deg, transparent 0%, black 16%, black 84%, transparent 100%);
            pointer-events: none;
        }
        #veri-merkezi .vm-skyline-wrap {
            position: relative;
            z-index: 2;
            height: 100%;
            min-height: inherit;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
        }
        #veri-merkezi .vm-skyline {
            position: relative;
            z-index: 2;
            display: flex;
            align-items: flex-end;
            justify-content: center;
            gap: clamp(3px, 0.85vw, 10px);
            height: clamp(230px, 34vw, 310px);
            padding: 1.25rem clamp(0.75rem, 2vw, 1.5rem) 0;
        }
        #veri-merkezi .vm-skyline-base {
            position: relative;
            z-index: 1;
            height: clamp(2.5rem, 6vw, 3.25rem);
            margin: 0 clamp(1rem, 4vw, 2rem);
            border-radius: 999px;
            background:
                linear-gradient(180deg, rgba(226, 232, 240, 0.55) 0%, rgba(248, 250, 252, 0.15) 100%);
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, 0.85),
                0 10px 28px -16px rgba(15, 23, 42, 0.12);
        }
        #veri-merkezi .vm-skyline-base::before {
            content: '';
            position: absolute;
            inset: 42% 8% auto;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.45) 20%, rgba(148, 163, 184, 0.45) 80%, transparent);
        }
        #veri-merkezi .vm-skyline-block {
            --vm-h: 50%;
            --vm-i: 0;
            flex: 0 1 auto;
            width: clamp(1.35rem, 2.6vw, 2.1rem);
            max-width: 2.25rem;
            height: var(--vm-h);
            display: flex;
            align-items: flex-end;
            justify-content: center;
            position: relative;
            border-radius: 4px 4px 0 0;
            transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1), filter 700ms ease;
            animation: vmBlockRise 0.75s cubic-bezier(0.22, 1, 0.36, 1) backwards;
            animation-delay: calc(var(--vm-i) * 45ms);
        }
        @keyframes vmBlockRise {
            from { opacity: 0; transform: translateY(14px); }
            to { opacity: 1; transform: translateY(0); }
        }
        #veri-merkezi .vm-skyline-block::before {
            content: '';
            position: absolute;
            inset: 0;
            border-radius: inherit;
            background: linear-gradient(180deg, rgba(226, 232, 240, 0.08) 0%, rgba(241, 245, 249, 0.42) 100%);
            opacity: 0;
            transition: opacity 650ms ease, background 650ms ease, box-shadow 650ms ease;
        }
        #veri-merkezi .vm-skyline-label {
            position: relative;
            z-index: 1;
            writing-mode: vertical-rl;
            text-orientation: mixed;
            transform: rotate(180deg);
            font-size: clamp(0.58rem, 1.05vw, 0.72rem);
            font-weight: 800;
            letter-spacing: 0.06em;
            line-height: 1.15;
            color: #a8b4c4;
            white-space: nowrap;
            user-select: none;
            transition: color 750ms cubic-bezier(0.22, 1, 0.36, 1), text-shadow 750ms ease, opacity 750ms ease;
        }
        #veri-merkezi .vm-skyline-block.is-trace::before {
            opacity: 0.55;
            background: linear-gradient(180deg, rgba(0, 138, 249, 0.06) 0%, rgba(0, 138, 249, 0.02) 100%);
        }
        #veri-merkezi .vm-skyline-block.is-trace .vm-skyline-label {
            color: #7dd3fc;
            opacity: 0.72;
        }
        #veri-merkezi .vm-skyline-block.is-active::before {
            opacity: 1;
            background: linear-gradient(180deg, rgba(0, 138, 249, 0.16) 0%, rgba(0, 138, 249, 0.03) 72%, transparent 100%);
            box-shadow:
                0 0 0 1px rgba(0, 138, 249, 0.12),
                0 -8px 28px rgba(0, 138, 249, 0.14);
        }
        #veri-merkezi .vm-skyline-block.is-active {
            transform: translateY(-5px);
            filter: drop-shadow(0 10px 18px rgba(0, 138, 249, 0.12));
        }
        #veri-merkezi .vm-skyline-block.is-active .vm-skyline-label {
            color: #008af9;
            text-shadow: 0 0 22px rgba(0, 138, 249, 0.32);
        }
        #veri-merkezi .vm-skyline-block::after {
            content: '';
            position: absolute;
            top: 0;
            left: 10%;
            right: 10%;
            height: 2px;
            border-radius: 1px;
            background: rgba(168, 180, 196, 0.5);
            transition: background 650ms ease, box-shadow 650ms ease, height 650ms ease;
        }
        #veri-merkezi .vm-skyline-block.is-active::after {
            height: 3px;
            background: linear-gradient(90deg, #38bdf8, #008af9, #38bdf8);
            box-shadow: 0 0 12px rgba(0, 138, 249, 0.45);
        }
        #veri-merkezi .vm-skyline-block:hover .vm-skyline-label {
            color: #64748b;
        }
        #veri-merkezi .vm-skyline-block.is-active:hover .vm-skyline-label {
            color: #0078e8;
        }
        #veri-merkezi .vm-skyline-block:focus-visible {
            outline: none;
        }
        #veri-merkezi .vm-skyline-block:focus-visible .vm-skyline-label {
            color: #008af9;
        }
        #veri-merkezi .vm-lens-wrap {
            position: absolute;
            left: 50%;
            top: 50%;
            z-index: 30;
            width: clamp(74px, 14vw, 98px);
            height: clamp(74px, 14vw, 98px);
            margin-left: calc(clamp(74px, 14vw, 98px) / -2);
            margin-top: calc(clamp(74px, 14vw, 98px) / -2);
            pointer-events: none;
            transform: translate3d(var(--vm-lens-x, 0px), var(--vm-lens-y, 0px), 0);
            transition: transform 950ms cubic-bezier(0.22, 1, 0.36, 1);
            will-change: transform;
        }
        #veri-merkezi .vm-lens {
            position: relative;
            width: 100%;
            height: 100%;
            animation: vmLensDrift 10s ease-in-out infinite;
        }
        @keyframes vmLensDrift {
            0%, 100% { transform: translate(-8px, -6px); }
            25% { transform: translate(10px, -12px); }
            50% { transform: translate(8px, 9px); }
            75% { transform: translate(-12px, 5px); }
        }
        #veri-merkezi .vm-lens-ring {
            position: absolute;
            inset: -6px;
            border-radius: 50%;
            border: 1px solid rgba(0, 138, 249, 0.18);
            opacity: 0;
            transform: scale(0.92);
            transition: opacity 500ms ease, transform 500ms ease;
        }
        #veri-merkezi .vm-lens-wrap.is-pulse .vm-lens-ring {
            opacity: 1;
            transform: scale(1.08);
            animation: vmLensPulse 900ms ease-out;
        }
        @keyframes vmLensPulse {
            0% { opacity: 0.7; transform: scale(0.92); }
            100% { opacity: 0; transform: scale(1.18); }
        }
        #veri-merkezi .vm-lens-glass {
            position: absolute;
            inset: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.78);
            border: 1.5px solid rgba(148, 163, 184, 0.38);
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, 0.98),
                inset 0 -10px 22px rgba(0, 138, 249, 0.05),
                0 10px 28px rgba(15, 23, 42, 0.07);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
        }
        #veri-merkezi .vm-lens-glass::before {
            content: '';
            position: absolute;
            top: 13%;
            left: 20%;
            width: 30%;
            height: 17%;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.9);
            filter: blur(1px);
        }
        #veri-merkezi .vm-lens-handle {
            position: absolute;
            bottom: 3%;
            right: 0;
            width: 40%;
            height: 9%;
            border-radius: 999px;
            background: linear-gradient(135deg, #dbeafe, #94a3b8);
            transform: rotate(42deg);
            transform-origin: left center;
            box-shadow: 0 2px 8px rgba(15, 23, 42, 0.1);
        }
        #veri-merkezi .vm-lens-text {
            position: absolute;
            inset: 20%;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            font-size: clamp(0.5rem, 0.88vw, 0.625rem);
            font-weight: 800;
            letter-spacing: 0.05em;
            line-height: 1.25;
            color: #64748b;
            transition: color 550ms ease, opacity 400ms ease, transform 550ms ease;
        }
        #veri-merkezi .vm-lens-text.is-brand {
            color: #008af9;
        }
        #veri-merkezi .vm-lens-text.is-switching {
            opacity: 0;
            transform: scale(0.92);
        }
        #veri-merkezi .vm-analyze-meta {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 0.65rem 1rem;
            margin-top: 1rem;
            padding-top: 0.85rem;
            border-top: 1px solid rgba(226, 232, 240, 0.85);
        }
        #veri-merkezi .vm-analyze-index {
            font-size: 0.6875rem;
            font-weight: 800;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: #008af9;
        }
        #veri-merkezi .vm-analyze-name {
            font-size: 0.75rem;
            font-weight: 600;
            letter-spacing: 0.02em;
            color: #475569;
            max-width: 16rem;
            text-align: center;
        }
        #veri-merkezi .vm-analyze-dots {
            display: inline-flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 0.3rem;
            max-width: 100%;
        }
        #veri-merkezi .vm-analyze-dots:empty {
            flex: 0 0 102.109375px;
            height: 5px;
        }
        #veri-merkezi .vm-analyze-dot {
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #dbe3ec;
            transition: background 450ms ease, transform 450ms ease, box-shadow 450ms ease;
        }
        #veri-merkezi .vm-analyze-dot.is-active {
            background: #008af9;
            transform: scale(1.35);
            box-shadow: 0 0 10px rgba(0, 138, 249, 0.42);
        }
        #veri-merkezi .vm-analyze-dot.is-trace {
            background: #7dd3fc;
            transform: scale(1.1);
        }
        @keyframes vmFloaty {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            50% { transform: translateY(-12px) rotate(1deg); }
        }
        @keyframes vmFloatySlow {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            33% { transform: translateY(-8px) rotate(-0.5deg); }
            66% { transform: translateY(-5px) rotate(0.5deg); }
        }
        @keyframes vmGradientShift {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }
        @keyframes vmFadeInUp {
            from { opacity: 0; transform: translateY(30px); }
            to { opacity: 1; transform: translateY(0); }
        }
        @keyframes vmScaleIn {
            from { opacity: 0; transform: scale(0.9); }
            to { opacity: 1; transform: scale(1); }
        }
        #veri-merkezi .animate-fade-in-up {
            animation: vmFadeInUp 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
        }
        #veri-merkezi .animate-scale-in {
            animation: vmScaleIn 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;
        }
        #veri-merkezi .delay-100 { animation-delay: 100ms; }
        #veri-merkezi .delay-300 { animation-delay: 300ms; }
        #veri-merkezi .hero-gradient {
            background: linear-gradient(-45deg, rgba(0, 138, 249, 0.03), rgba(148, 163, 184, 0.05), rgba(0, 138, 249, 0.06), rgba(226, 232, 240, 0.04));
            background-size: 400% 400%;
            animation: vmGradientShift 15s ease infinite;
        }
        #veri-merkezi .card-premium {
            transition: all 500ms cubic-bezier(0.22, 1, 0.36, 1);
            position: relative;
        }
        #veri-merkezi .card-premium:hover {
            transform: translateY(-4px);
            box-shadow: 0 32px 100px rgba(2, 6, 23, 0.12), 0 16px 48px rgba(0, 138, 249, 0.08);
        }
        #veri-merkezi .btn-primary {
            position: relative;
            overflow: hidden;
            transition: all 350ms cubic-bezier(0.22, 1, 0.36, 1);
        }
        #veri-merkezi .btn-primary:hover {
            transform: translateY(-3px);
            box-shadow: 0 16px 40px rgba(0, 138, 249, 0.35), 0 8px 16px rgba(0, 138, 249, 0.2);
        }
        #veri-merkezi .status-pulse { position: relative; }
        #veri-merkezi .status-pulse::after {
            content: '';
            position: absolute;
            inset: 0;
            border-radius: inherit;
            background: currentColor;
            animation: ping 2s cubic-bezier(0, 0, 0.2, 1) infinite;
        }
        #veri-merkezi .grid-pattern {
            background-image: radial-gradient(rgba(148, 163, 184, 0.2) 1px, transparent 1px);
            background-size: 32px 32px;
            mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
            -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
        }
        @keyframes vmShimmer {
            0%, 100% { opacity: 0.5; }
            50% { opacity: 1; }
        }
        @media (max-width: 640px) {
            #veri-merkezi .vm-skyline {
                gap: 2px;
                padding-inline: 0.35rem;
            }
            #veri-merkezi .vm-skyline-block {
                width: clamp(1.1rem, 2.2vw, 1.5rem);
            }
            #veri-merkezi .vm-skyline-label {
                font-size: 0.52rem;
                letter-spacing: 0.04em;
            }
        }
        @media (max-width: 768px) {
            #veri-merkezi .hero-gradient { animation: none; background-position: 0% 50%; }
        }
        @media (prefers-reduced-motion: reduce) {
            #veri-merkezi .floaty,
            #veri-merkezi .floaty-slow,
            #veri-merkezi .hero-gradient,
            #veri-merkezi .vm-lens-wrap,
            #veri-merkezi .vm-lens,
            #veri-merkezi .vm-stage-scan,
            #veri-merkezi .vm-skyline-block,
            #veri-merkezi .animate-fade-in-up,
            #veri-merkezi .animate-scale-in {
                animation: none !important;
            }
            #veri-merkezi .animate-fade-in-up,
            #veri-merkezi .animate-scale-in {
                opacity: 1;
                transform: none;
            }
        }

        .central-logo-container img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 50%;
        }



        /* === POI / Cevre Analizi === */
        /* POI / Cevre Analizi */
        .gp-env-hub {
          --gp-bg: #ffffff;
          --gp-surface: #f4f8fd;
          --gp-card: #eef5fc;
          --gp-elevated: #ffffff;
          --gp-border: rgba(0, 72, 120, 0.12);
          --gp-border-strong: rgba(0, 138, 249, 0.22);
          --gp-text: #0c1928;
          --gp-muted: #4a6078;
          --gp-muted-2: #6b8299;
          --gp-accent: #008af9;
          --gp-accent-2: #33a6ff;
          --gp-accent-deep: #006fd0;
          --gp-accent-soft: rgba(0, 138, 249, 0.14);
          --gp-glow: rgba(0, 138, 249, 0.42);
          --gp-success: #10b981;
          --gp-violet: #4f7dff;
          --gp-radius: 22px;
          --gp-radius-sm: 14px;
          --gp-ease: cubic-bezier(0.22, 1, 0.36, 1);
          --gp-font-sans: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
          --gp-font-display: system-ui, -apple-system, 'Segoe UI', sans-serif;
          position: relative;
          font-family: var(--gp-font-sans);
          color: var(--gp-text);
          background: var(--gp-bg);
          overflow: hidden;
          border-radius: var(--gp-radius);
          border: 1px solid var(--gp-border);
          box-shadow: 0 1px 0 rgba(0, 138, 249, 0.06) inset, 0 16px 40px rgba(0, 46, 94, 0.06);
        }

        .gp-env-hub *,
        .gp-env-hub *::before,
        .gp-env-hub *::after {
          box-sizing: border-box;
        }

        /* Statik arka plan — animasyon yok (sürekli repaint maliyeti sıfır) */
        .gp-env-hub__mesh {
          position: absolute;
          inset: -30% -18%;
          z-index: 0;
          background:
            radial-gradient(ellipse 85% 55% at 18% -5%, rgba(0, 138, 249, 0.14), transparent 58%),
            radial-gradient(ellipse 55% 42% at 88% 12%, rgba(51, 166, 255, 0.08), transparent 52%),
            radial-gradient(ellipse 48% 38% at 42% 105%, rgba(79, 125, 255, 0.06), transparent 48%);
          opacity: 0.95;
          pointer-events: none;
        }

        .gp-env-hub__grid {
          position: absolute;
          inset: 0;
          z-index: 1;
          background-image:
            linear-gradient(rgba(0, 72, 120, 0.05) 1px, transparent 1px),
            linear-gradient(90deg, rgba(0, 72, 120, 0.05) 1px, transparent 1px);
          background-size: 56px 56px;
          mask-image: radial-gradient(ellipse 95% 72% at 50% -5%, black 22%, transparent 78%);
          opacity: 0.4;
          pointer-events: none;
        }

        .gp-env-hub__inner {
          position: relative;
          z-index: 4;
          padding: clamp(28px, 5vw, 56px) clamp(22px, 4vw, 48px);
          display: grid;
          gap: clamp(26px, 3.5vw, 38px);
        }

        /* --- BÖLÜM GÖRSELİ (HERO IMG) STİLLERİ --- */
        .gp-env-hub__hero-img {
          -webkit-user-drag: none;
          user-select: none;
          -webkit-user-select: none;
          display: block;
          width: min(980px, 100%);
          height: auto;
          max-height: none;
          object-fit: contain;
          border-radius: var(--gp-radius-sm);
          margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
          box-shadow: 0 12px 32px -8px rgba(0, 46, 94, 0.12), 0 0 0 1px rgba(0, 138, 249, 0.08);
          position: relative;
          z-index: 5;
          background-color: #ffffff;
        }

        .gp-env-hub__top {
          display: grid;
          grid-template-columns: 1fr;
          gap: clamp(24px, 3vw, 36px);
          align-items: start;
        }

        @media (min-width: 980px) {
          .gp-env-hub__top {
            grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
            align-items: stretch;
          }
          .gp-env-hub__hero-img {
            border-radius: calc(var(--gp-radius) - 6px); /* Masaüstünde dış radius ile daha uyumlu */
          }
        }

        .gp-env-hub__eyebrow {
          display: inline-flex;
          align-items: center;
          gap: 10px;
          font-size: 11px;
          font-weight: 600;
          letter-spacing: 0.16em;
          text-transform: uppercase;
          color: var(--gp-muted);
          margin-bottom: 14px;
        }

        .gp-env-hub__pulse {
          width: 8px;
          height: 8px;
          border-radius: 50%;
          background: var(--gp-accent);
          box-shadow: 0 0 0 2px rgba(0, 138, 249, 0.2);
          flex-shrink: 0;
        }

        .gp-env-hub__title {
          font-family: var(--gp-font-display);
          font-weight: 800;
          font-size: clamp(1.85rem, 4.2vw, 2.75rem);
          line-height: 1.06;
          letter-spacing: -0.035em;
          margin: 0 0 14px;
          max-width: 20ch;
        }

        .gp-env-hub__title span {
          background: linear-gradient(115deg, #062042 0%, #0a4a82 22%, var(--gp-accent) 72%, var(--gp-accent-2) 100%);
          -webkit-background-clip: text;
          background-clip: text;
          color: transparent;
        }

        .gp-env-hub__lead {
          margin: 0;
          font-size: clamp(0.94rem, 1.3vw, 1.06rem);
          line-height: 1.68;
          color: var(--gp-muted);
          max-width: 54ch;
        }

        .gp-env-hub__chips {
          display: flex;
          flex-wrap: wrap;
          gap: 8px;
          margin-top: 22px;
        }

        .gp-env-hub__chip {
          display: inline-flex;
          align-items: center;
          gap: 7px;
          padding: 7px 12px 7px 10px;
          border-radius: 999px;
          font-size: 0.78rem;
          font-weight: 500;
          color: var(--gp-text);
          background: rgba(0, 138, 249, 0.06);
          border: 1px solid rgba(0, 72, 120, 0.1);
          transition: border-color 0.25s var(--gp-ease), background 0.25s var(--gp-ease), transform 0.25s var(--gp-ease);
        }

        .gp-env-hub__chip svg {
          width: 14px;
          height: 14px;
          opacity: 0.85;
          flex-shrink: 0;
        }

        @media (hover: hover) and (pointer: fine) {
          .gp-env-hub__chip:hover {
            border-color: rgba(0, 138, 249, 0.35);
            background: rgba(0, 138, 249, 0.11);
            transform: translateY(-1px);
          }
        }

        .gp-env-hub__actions {
          display: flex;
          flex-wrap: wrap;
          gap: 12px;
          margin-top: 26px;
          align-items: center;
        }

        .gp-env-hub__cta {
          touch-action: manipulation;
          user-select: none;
          -webkit-user-select: none;
          position: relative;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          gap: 10px;
          min-height: 48px;
          padding: 15px 28px;
          border-radius: 999px;
          font-family: var(--gp-font-display);
          font-weight: 600;
          font-size: 0.96rem;
          text-decoration: none;
          color: #fff;
          cursor: pointer;
          appearance: none;
          -webkit-appearance: none;
          background: linear-gradient(135deg, var(--gp-accent-deep) 0%, var(--gp-accent) 48%, var(--gp-accent-2) 100%);
          border: 1px solid rgba(255, 255, 255, 0.35);
          box-shadow:
            0 14px 44px rgba(0, 138, 249, 0.32),
            0 0 0 1px rgba(255, 255, 255, 0.35) inset;
          overflow: hidden;
          transition: transform 0.35s var(--gp-ease), box-shadow 0.35s var(--gp-ease);
        }

        .gp-env-hub__cta::after {
          display: none;
        }

        @media (hover: hover) and (pointer: fine) {
          .gp-env-hub__cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 20px 56px rgba(0, 138, 249, 0.38);
          }
        }

        .gp-env-hub__cta:focus-visible {
          outline: 2px solid var(--gp-accent);
          outline-offset: 3px;
        }

        .gp-env-hub__cta svg {
          width: 18px;
          height: 18px;
          flex-shrink: 0;
        }

        .gp-env-hub__ghost {
          display: inline-flex;
          align-items: center;
          gap: 8px;
          padding: 12px 18px;
          border-radius: 999px;
          font-size: 0.82rem;
          color: var(--gp-muted);
          border: 1px solid rgba(0, 72, 120, 0.12);
          background: rgba(0, 138, 249, 0.04);
        }

        .gp-env-hub__visual {
          position: relative;
          min-height: clamp(300px, 42vw, 400px);
          align-self: stretch;
          display: flex;
          flex: 1;
        }

        .gp-loc-flip {
          flex: 1;
          min-width: 0;
        }

        .gp-loc-flip__inner {
          position: relative;
          width: 100%;
          min-height: clamp(300px, 42vw, 400px);
        }

        /* 3D flip yerine yalnızca opacity — GPU ucuz, sürekli layer hesabı yok */
        @keyframes gp-loc-fade-front {
          0%, 42% { opacity: 1; }
          48%, 92% { opacity: 0; }
          98%, 100% { opacity: 1; }
        }

        @keyframes gp-loc-fade-back {
          0%, 42% { opacity: 0; }
          48%, 92% { opacity: 1; }
          98%, 100% { opacity: 0; }
        }

        .gp-loc-face {
          position: absolute;
          inset: 0;
          width: 100%;
          min-height: clamp(300px, 42vw, 400px);
          border-radius: 26px;
          overflow: hidden;
          display: flex;
          flex-direction: column;
          font-family: var(--gp-font-sans);
          box-shadow:
            0 3px 5px -2px rgba(0, 46, 94, 0.05),
            0 12px 28px -10px rgba(0, 72, 120, 0.1),
            0 0 0 1px rgba(0, 138, 249, 0.09) inset,
            0 1px 0 rgba(255, 255, 255, 0.92) inset;
        }

        .gp-loc-face--front {
          z-index: 2;
          animation: gp-loc-fade-front 10s ease-in-out infinite;
        }

        .gp-loc-face--back {
          z-index: 1;
          animation: gp-loc-fade-back 10s ease-in-out infinite;
        }

        .gp-loc-face--back .gp-loc-card--map {
          flex: 1;
          width: 100%;
          min-height: 100%;
        }

        .gp-loc-face--vizit {
          --viz-brand: #008af9;
          --viz-brand-soft: rgba(0, 138, 249, 0.32);
          background:
            radial-gradient(ellipse 118% 85% at 92% -8%, rgba(0, 138, 249, 0.09), transparent 52%),
            radial-gradient(ellipse 85% 55% at -6% 102%, rgba(0, 138, 249, 0.05), transparent 50%),
            linear-gradient(168deg, #ffffff 0%, #fbfdff 42%, #f5f9ff 100%);
          border: 1px solid rgba(0, 138, 249, 0.11);
        }

        .gp-loc-vizit__bg {
          position: absolute;
          inset: 0;
          pointer-events: none;
        }

        .gp-loc-vizit__grid {
          position: absolute;
          inset: 0;
          background-image:
            linear-gradient(rgba(0, 72, 120, 0.045) 1px, transparent 1px),
            linear-gradient(90deg, rgba(0, 72, 120, 0.045) 1px, transparent 1px);
          background-size: 32px 32px;
          opacity: 0.65;
          mask-image: radial-gradient(ellipse 96% 88% at 48% 44%, black 18%, transparent 78%);
        }

        .gp-loc-vizit__routes {
          position: absolute;
          inset: -8% -6%;
          width: 112%;
          height: 116%;
          pointer-events: none;
          overflow: visible;
          mask-image: radial-gradient(ellipse 94% 90% at 44% 46%, black 22%, transparent 88%);
          -webkit-mask-image: radial-gradient(ellipse 94% 90% at 44% 46%, black 22%, transparent 88%);
        }

        .gp-loc-vizit__route--main {
          fill: none;
          stroke: rgba(0, 138, 249, 0.22);
          stroke-width: 2.25;
          stroke-linecap: round;
          stroke-linejoin: round;
        }

        .gp-loc-vizit__route--glow {
          fill: none;
          stroke: url(#gpVizRouteSheen);
          stroke-width: 3;
          stroke-linecap: round;
          stroke-linejoin: round;
          opacity: 0.55;
        }

        .gp-loc-vizit__route--dash {
          fill: none;
          stroke: rgba(0, 138, 249, 0.14);
          stroke-width: 1.35;
          stroke-dasharray: 5 10;
          stroke-linecap: round;
        }

        .gp-loc-vizit__route--fine {
          fill: none;
          stroke: rgba(0, 138, 249, 0.095);
          stroke-width: 1;
          stroke-linecap: round;
        }

        .gp-loc-vizit__route--flow {
          stroke-dasharray: 6 14;
        }

        .gp-loc-vizit__node {
          fill: rgba(0, 138, 249, 0.42);
          stroke: rgba(255, 255, 255, 0.92);
          stroke-width: 1.75;
        }

        .gp-loc-vizit__node--dim {
          fill: rgba(0, 138, 249, 0.18);
          stroke: rgba(255, 255, 255, 0.65);
          stroke-width: 1;
        }

        .gp-loc-vizit__arc {
          fill: none;
          stroke: rgba(0, 138, 249, 0.08);
          stroke-width: 1;
          stroke-dasharray: 2 8;
        }

        .gp-loc-vizit__hdr {
          position: relative;
          z-index: 2;
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 14px;
          padding: clamp(18px, 3vw, 26px) clamp(20px, 3vw, 28px) 0;
        }

        .gp-loc-vizit__ico {
          width: 44px;
          height: 44px;
          display: grid;
          place-items: center;
          color: var(--viz-brand);
          border-radius: 14px;
          background: linear-gradient(160deg, rgba(0, 138, 249, 0.09), rgba(0, 138, 249, 0.03));
          border: 1px solid rgba(0, 138, 249, 0.12);
          box-shadow:
            0 1px 2px rgba(0, 46, 94, 0.04),
            inset 0 1px 0 rgba(255, 255, 255, 0.9);
        }

        .gp-loc-vizit__ico svg {
          width: 28px;
          height: 28px;
        }

        .gp-loc-vizit__live {
          display: inline-flex;
          align-items: center;
          gap: 9px;
          padding: 8px 15px 8px 12px;
          border-radius: 999px;
          font-size: 0.68rem;
          font-weight: 700;
          letter-spacing: 0.16em;
          text-transform: uppercase;
          color: var(--gp-text);
          background: rgba(255, 255, 255, 0.97);
          border: 1px solid rgba(0, 138, 249, 0.13);
          box-shadow:
            0 1px 3px rgba(0, 46, 94, 0.05),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
        }

        .gp-loc-vizit__live-dot {
          width: 8px;
          height: 8px;
          border-radius: 50%;
          background: var(--viz-brand);
          box-shadow: 0 0 0 2px rgba(0, 138, 249, 0.12);
        }

        .gp-loc-vizit__spacer {
          flex: 1;
          min-height: 48px;
        }

        .gp-loc-vizit__foot {
          position: relative;
          z-index: 2;
          padding: 0 clamp(20px, 3vw, 28px) clamp(22px, 4vw, 30px);
        }

        .gp-loc-vizit__title {
          margin: 0;
          font-family: var(--gp-font-display);
          font-size: clamp(1.45rem, 3vw, 1.85rem);
          font-weight: 700;
          letter-spacing: -0.03em;
          color: var(--gp-text);
          line-height: 1.12;
        }

        .gp-loc-vizit__line {
          margin-top: 14px;
          height: 3px;
          width: min(260px, 92%);
          border-radius: 3px;
          background: linear-gradient(
            90deg,
            var(--viz-brand) 0%,
            rgba(0, 138, 249, 0.45) 36%,
            rgba(0, 138, 249, 0.08) 72%,
            transparent 96%
          );
          box-shadow: 0 1px 8px rgba(0, 138, 249, 0.12);
        }

        .gp-loc-card--map {
          --lc-accent: #008af9;
          --lc-accent-glow: rgba(0, 138, 249, 0.32);
          flex: 1;
          display: flex;
          flex-direction: column;
          position: relative;
          border-radius: 26px;
          overflow: hidden;
          background:
            radial-gradient(ellipse 95% 72% at 48% -4%, rgba(0, 138, 249, 0.07), transparent 52%),
            radial-gradient(ellipse 70% 48% at 104% 88%, rgba(0, 138, 249, 0.05), transparent 52%),
            linear-gradient(172deg, #ffffff 0%, #f9fcff 38%, #f3f8ff 100%);
          border: 1px solid rgba(0, 138, 249, 0.11);
          box-shadow:
            0 2px 4px rgba(0, 46, 94, 0.04),
            inset 0 1px 0 rgba(255, 255, 255, 0.85);
          font-family: var(--gp-font-sans);
        }

        .gp-loc-card__canvas {
          position: absolute;
          inset: 0;
          pointer-events: none;
          border-radius: inherit;
          overflow: hidden;
        }

        .gp-loc-card__stage {
          position: absolute;
          inset: -6%;
          transform-origin: 50% 46%;
        }

        .gp-loc-card__grid {
          position: absolute;
          inset: 0;
          background-image:
            linear-gradient(rgba(0, 138, 249, 0.065) 1px, transparent 1px),
            linear-gradient(90deg, rgba(0, 138, 249, 0.065) 1px, transparent 1px);
          background-size: 28px 28px;
          opacity: 0.7;
          mask-image: radial-gradient(ellipse 88% 80% at 50% 44%, black 20%, transparent 76%);
        }

        .gp-loc-card__blocks {
          position: absolute;
          inset: 0;
        }

        .gp-loc-card__block {
          position: absolute;
          border-radius: 10px;
          background: linear-gradient(
            145deg,
            rgba(0, 138, 249, 0.09) 0%,
            rgba(0, 138, 249, 0.04) 100%
          );
          border: 1px solid rgba(0, 138, 249, 0.1);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
        }

        .gp-loc-card__block--a { width: 22%; height: 14%; left: 12%; top: 22%; transform: rotate(-7deg); }
        .gp-loc-card__block--b { width: 18%; height: 18%; left: 38%; top: 18%; transform: rotate(5deg); border-radius: 12px; }
        .gp-loc-card__block--c { width: 26%; height: 12%; right: 14%; top: 28%; transform: rotate(-4deg); }
        .gp-loc-card__block--d { width: 16%; height: 22%; left: 24%; bottom: 26%; transform: rotate(8deg); }
        .gp-loc-card__block--e { width: 20%; height: 14%; right: 22%; bottom: 22%; transform: rotate(-12deg); }

        .gp-loc-card__veil {
          position: absolute;
          inset: 0;
          background: radial-gradient(
            ellipse 92% 78% at 50% 42%,
            transparent 38%,
            rgba(245, 250, 255, 0.65) 100%
          );
          pointer-events: none;
          z-index: 1;
        }

        .gp-loc-card__hdr {
          position: relative;
          z-index: 3;
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 14px;
          padding: 18px 20px 0;
        }

        .gp-loc-card__map-ico {
          width: 44px;
          height: 44px;
          display: grid;
          place-items: center;
          color: var(--lc-accent);
          border-radius: 14px;
          background: linear-gradient(158deg, rgba(0, 138, 249, 0.1), rgba(0, 138, 249, 0.03));
          border: 1px solid rgba(0, 138, 249, 0.12);
          box-shadow:
            0 1px 2px rgba(0, 46, 94, 0.04),
            inset 0 1px 0 rgba(255, 255, 255, 0.88);
        }

        .gp-loc-card__map-ico svg {
          width: 28px;
          height: 28px;
        }

        .gp-loc-card__live {
          display: inline-flex;
          align-items: center;
          gap: 8px;
          padding: 8px 14px 8px 11px;
          border-radius: 999px;
          font-size: 0.68rem;
          font-weight: 700;
          letter-spacing: 0.14em;
          text-transform: uppercase;
          color: var(--gp-text);
          background: rgba(255, 255, 255, 0.88);
          border: 1px solid rgba(0, 138, 249, 0.13);
          box-shadow:
            0 1px 3px rgba(0, 46, 94, 0.05),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
          background: rgba(255, 255, 255, 0.97);
        }

        .gp-loc-card__live-dot {
          width: 7px;
          height: 7px;
          border-radius: 50%;
          background: var(--lc-accent);
          box-shadow: 0 0 0 2px rgba(0, 138, 249, 0.12);
        }

        .gp-loc-card__pin-wrap {
          position: relative;
          z-index: 3;
          flex: 1;
          display: grid;
          place-items: center;
          min-height: clamp(118px, 22vw, 158px);
          margin: 8px 16px 0;
        }

        .gp-loc-card__pin {
          position: relative;
          z-index: 2;
          width: 52px;
          height: 52px;
          display: grid;
          place-items: center;
        }

        .gp-loc-card__pin svg {
          width: 46px;
          height: auto;
          display: block;
        }

        .gp-loc-card__foot {
          position: relative;
          z-index: 3;
          flex-shrink: 0;
          padding: 0 22px 22px;
          margin-top: auto;
        }

        .gp-loc-card__city {
          margin: 0;
          font-family: var(--gp-font-display);
          font-size: clamp(1.55rem, 3.2vw, 1.95rem);
          font-weight: 700;
          letter-spacing: -0.03em;
          color: var(--gp-text);
          line-height: 1.15;
        }

        .gp-loc-card__coords {
          margin: 8px 0 0;
          font-family: ui-monospace, 'Cascadia Code', 'Consolas', monospace;
          font-size: 0.78rem;
          letter-spacing: 0.02em;
          color: var(--gp-muted);
        }

        .gp-loc-card__line {
          margin-top: 14px;
          height: 3px;
          width: min(240px, 88%);
          border-radius: 3px;
          background: linear-gradient(
            90deg,
            var(--lc-accent) 0%,
            rgba(0, 138, 249, 0.42) 40%,
            rgba(0, 138, 249, 0.08) 74%,
            transparent 96%
          );
          box-shadow: 0 1px 8px rgba(0, 138, 249, 0.1);
        }

        .gp-env-hub__rail {
          margin-top: clamp(6px, 1.5vw, 12px);
          display: flex;
          flex-wrap: wrap;
          gap: 14px 24px;
          align-items: center;
          justify-content: flex-start;
          font-size: 0.76rem;
          color: var(--gp-muted);
          border-top: 1px solid rgba(0, 72, 120, 0.1);
          padding-top: 20px;
        }

        .gp-env-hub__logos {
          display: flex;
          flex-wrap: wrap;
          gap: 10px;
          align-items: center;
        }

        .gp-env-hub__logo-pill {
          padding: 7px 14px;
          border-radius: 999px;
          border: 1px solid rgba(0, 72, 120, 0.12);
          font-size: 0.7rem;
          font-weight: 600;
          letter-spacing: 0.06em;
          text-transform: uppercase;
          color: var(--gp-text);
          background: rgba(0, 138, 249, 0.06);
        }

        /* —— Toast, yükleme ve boş durum (V1) —— */
        .gp-toast-stack {
          position: fixed;
          z-index: 10000;
          left: 50%;
          bottom: max(20px, env(safe-area-inset-bottom, 0px));
          transform: translateX(-50%);
          display: flex;
          flex-direction: column;
          gap: 10px;
          align-items: stretch;
          width: min(420px, calc(100vw - 32px));
          pointer-events: none;
        }

        .gp-toast {
          pointer-events: auto;
          display: grid;
          grid-template-columns: auto 1fr auto;
          gap: 12px;
          align-items: center;
          padding: 14px 16px;
          border-radius: 16px;
          font-size: 0.9rem;
          line-height: 1.45;
          color: var(--gp-text);
          background: rgba(255, 255, 255, 0.97);
          border: 1px solid rgba(0, 72, 120, 0.12);
          box-shadow:
            0 18px 48px rgba(0, 46, 94, 0.14),
            0 0 0 1px rgba(0, 138, 249, 0.06) inset;
          background: #ffffff;
          animation: gp-toast-in 0.22s var(--gp-ease) both;
        }

        @keyframes gp-toast-in {
          from { opacity: 0; transform: translateY(8px); }
          to { opacity: 1; transform: translateY(0); }
        }

        .gp-toast--success { border-left: 4px solid var(--gp-success); }
        .gp-toast--error { border-left: 4px solid #ef4444; }
        .gp-toast--info { border-left: 4px solid var(--gp-accent); }

        .gp-toast__icon {
          width: 22px;
          height: 22px;
          flex-shrink: 0;
        }

        .gp-toast__close {
          min-width: 44px;
          min-height: 44px;
          margin: -10px -8px -10px 0;
          display: grid;
          place-items: center;
          border: none;
          border-radius: 12px;
          background: transparent;
          color: var(--gp-muted);
          cursor: pointer;
          font-size: 1.25rem;
          line-height: 1;
        }

        .gp-toast__close:focus-visible {
          outline: 2px solid var(--gp-accent);
          outline-offset: 2px;
        }

        .gp-env-hub__cta[data-loading="true"] {
          pointer-events: none;
          opacity: 0.88;
        }

        .gp-env-hub__cta:disabled {
          pointer-events: none;
          cursor: not-allowed;
          opacity: 0.88;
        }

        .gp-env-hub__cta .gp-cta__spinner {
          width: 20px;
          height: 20px;
          border: 2px solid rgba(255, 255, 255, 0.35);
          border-top-color: #fff;
          border-radius: 50%;
          animation: gp-cta-spin 0.7s linear infinite;
          display: none;
        }

        .gp-env-hub__cta[data-loading="true"] .gp-cta__spinner {
          display: block;
        }

        .gp-env-hub__cta[data-loading="true"] .gp-cta__arrow {
          display: none;
        }

        .gp-env-hub__cta[data-loading="true"] .gp-cta__label {
          opacity: 0.92;
        }

        @keyframes gp-cta-spin {
          to { transform: rotate(360deg); }
        }

        .gp-empty-panel {
          margin-top: clamp(8px, 2vw, 16px);
          padding: clamp(20px, 4vw, 28px);
          border-radius: var(--gp-radius-sm);
          border: 1px dashed rgba(0, 72, 120, 0.2);
          background: rgba(0, 138, 249, 0.04);
          text-align: center;
        }

        .gp-empty-panel__icon {
          width: 48px;
          height: 48px;
          margin: 0 auto 14px;
          color: var(--gp-accent);
          opacity: 0.85;
        }

        .gp-empty-panel__title {
          margin: 0 0 8px;
          font-family: var(--gp-font-display);
          font-weight: 700;
          font-size: 1.05rem;
          color: var(--gp-text);
        }

        .gp-empty-panel__text {
          margin: 0;
          font-size: 0.92rem;
          line-height: 1.55;
          color: var(--gp-muted);
          max-width: 42ch;
          margin-inline: auto;
        }

        .gp-chip-btn {
          touch-action: manipulation;
          margin-top: 18px;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          min-height: 44px;
          padding: 10px 18px;
          border-radius: 999px;
          font-family: var(--gp-font-sans);
          font-size: 0.88rem;
          font-weight: 600;
          color: var(--gp-accent-deep);
          background: #fff;
          border: 1px solid rgba(0, 138, 249, 0.28);
          cursor: pointer;
          transition: background 0.2s var(--gp-ease), border-color 0.2s var(--gp-ease);
        }

        @media (hover: hover) and (pointer: fine) {
          .gp-chip-btn:hover {
            background: rgba(0, 138, 249, 0.08);
            border-color: rgba(0, 138, 249, 0.45);
          }
        }

        .gp-chip-btn:focus-visible {
          outline: 2px solid var(--gp-accent);
          outline-offset: 3px;
        }

        @media (max-width: 420px) {
          .gp-env-hub__chip {
            min-height: 44px;
            padding: 10px 14px 10px 12px;
            align-items: center;
          }
        }

        @media (min-width: 1024px) {
          .gp-env-hub__hero-img {
            max-height: none;
          }
        }

        @media (max-width: 1024px) {
          .gp-env-hub__hero-img {
            max-height: 320px;
            width: 100%;
          }
        }

        @media (max-width: 768px) {
          .gp-env-hub__mesh {
            inset: -22% -14%;
            opacity: 0.88;
          }
          .gp-env-hub__grid {
            opacity: 0.18;
          }
          .gp-env-hub__hero-img {
            min-height: 160px;
            max-height: 240px;
          }
          .gp-loc-face--front,
          .gp-loc-face--back {
            animation-duration: 12s;
          }
        }

        @media (prefers-reduced-motion: reduce) {
          .gp-loc-face--front,
          .gp-loc-face--back {
            animation: none !important;
          }
          .gp-loc-face--front {
            opacity: 1 !important;
          }
          .gp-loc-face--back {
            opacity: 0 !important;
            visibility: hidden !important;
          }
          .gp-toast {
            animation: none !important;
          }
        }


        /* === Konum Nabzı (Canlı Veriler) === */
        #konum-nabzi {
          background-color: #ffffff;
        }
        #gp-konum-nabzi-hub {
          background: #ffffff;
          padding: clamp(2rem, 4vw, 3rem) clamp(1rem, 2.5vw, 1.25rem);
          border-radius: 32px;
          border: 1px solid rgba(0, 72, 120, 0.08);
          box-shadow: 0 20px 60px rgba(0, 46, 94, 0.03), 0 4px 12px rgba(0, 0, 0, 0.02);
          max-width: 1200px;
          margin: 0 auto;
          overflow: hidden;
          position: relative;
          font-family: 'DM Sans', Inter, system-ui, sans-serif;
          --gp-brand: #008af9;
          --gp-brand-dark: #0060b5;
          --gp-brand-soft: rgba(0, 138, 249, 0.08);
          --gp-brand-glow: rgba(0, 138, 249, 0.25);
          --gp-bg: #ffffff;
          --gp-text: #0c1928;
          --gp-muted: #6b8299;
          --gp-border: rgba(0, 72, 120, 0.08);
          --gp-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
        }

    /* Arka Plan Aurası (Derinlik için) */
    #gp-konum-nabzi-hub::after {
      content: '';
      position: absolute;
      top: 50%; left: 50%;
      width: 600px; height: 600px;
      background: radial-gradient(circle, rgba(0,138,249,0.04) 0%, transparent 70%);
      transform: translate(-50%, -50%);
      pointer-events: none;
      z-index: 0;
    }

    #gp-konum-nabzi-hub::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; height: 4px;
      background: linear-gradient(90deg, transparent, var(--gp-brand), #40a9ff, transparent);
      opacity: 0.8;
    }

    /* =========================================
       BAŞLIK ALANI
       ========================================= */
    #gp-konum-nabzi-hub .gp-ticker-header {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      margin-bottom: 40px;
      position: relative;
      z-index: 1;
    }

    #gp-konum-nabzi-hub .gp-live-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 6px 16px;
      border-radius: 999px;
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--gp-brand);
      background: var(--gp-brand-soft);
      border: 1px solid rgba(0, 138, 249, 0.15);
      margin-bottom: 16px;
      box-shadow: 0 4px 12px rgba(0, 138, 249, 0.05);
    }

    #gp-konum-nabzi-hub .gp-live-dot {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: var(--gp-brand);
      box-shadow: 0 0 0 0 var(--gp-brand-glow);
      animation: kn-pulse-dot 2s infinite;
    }

    @keyframes kn-pulse-dot {
      0% { box-shadow: 0 0 0 0 var(--gp-brand-glow); }
      70% { box-shadow: 0 0 0 8px rgba(0, 138, 249, 0); }
      100% { box-shadow: 0 0 0 0 rgba(0, 138, 249, 0); }
    }

    #gp-konum-nabzi-hub .gp-ticker-title {
      font-family: 'Outfit', sans-serif;
      font-size: clamp(1.8rem, 4vw, 2.8rem);
      color: var(--gp-text);
      margin: 0;
      line-height: 1.1;
      letter-spacing: -0.02em;
    }

    /* Gradiyent Yazı Efekti */
    #gp-konum-nabzi-hub .gp-ticker-title span {
      background: linear-gradient(135deg, var(--gp-brand), #40a9ff);
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      position: relative;
    }

    #gp-konum-nabzi-hub .gp-ticker-lead {
      margin: 16px auto 0;
      max-width: 38rem;
      font-size: clamp(0.9375rem, 2.1vw, 1.0625rem);
      line-height: 1.7;
      color: var(--gp-muted);
      font-weight: 500;
      letter-spacing: -0.01em;
    }

    /* =========================================
       CANLI VERİ AKIŞI BÖLÜM GÖRSELİ
       ========================================= */
    #gp-konum-nabzi-hub .gp-live-visual {
      margin: 22px auto 0;
      display: flex;
      justify-content: center;
    }

    #gp-konum-nabzi-hub .gp-live-visual img {
      display: block;
      width: 100%;
      max-width: 50%;
      height: auto;
      background: #ffffff;
    }

    @media (max-width: 768px) {
      #gp-konum-nabzi-hub .gp-live-visual img {
        max-width: 100%;
      }
    }

    /* =========================================
       KAYAR BANT (MARQUEE) ALANI
       ========================================= */
    #gp-konum-nabzi-hub .gp-marquee-area {
      position: relative;
      z-index: 1;
      min-height: 238px;
      display: flex;
      align-items: center;
    }

    #gp-konum-nabzi-hub .gp-marquee-container {
      display: flex;
      flex-direction: column;
      gap: 34px;
      width: 100%;
      padding: 42px 0;
      mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
      -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
    }

    #gp-konum-nabzi-hub .gp-marquee-track {
      display: flex;
      gap: 20px;
      overflow: hidden;
      user-select: none;
      min-height: 58px;
      align-items: center;
    }

    #gp-konum-nabzi-hub .gp-marquee-content {
      display: flex;
      gap: 20px;
      flex-shrink: 0;
      min-width: 100%;
      justify-content: space-around;
      animation: kn-scroll 40s linear infinite; /* Biraz yavaşlatıldı, daha asil duruyor */
    }

    @media (max-width: 768px) {
      /*
       * Hareketli blur yüzeylerinin boya hasarını kendi bantlarına hapseder.
       * Boyutlar, blur değerleri ve animasyon zamanlaması değişmez.
       */
      #gp-konum-nabzi-hub .gp-marquee-track {
        contain: layout paint style;
      }

      #gp-konum-nabzi-hub .gp-marquee-content {
        will-change: transform;
        backface-visibility: hidden;
      }

      #gp-konum-nabzi-hub .gp-ticker-item {
        contain: layout style;
        backface-visibility: hidden;
      }

      #veri-merkezi .vm-ambient-blur {
        transform: translate3d(0, 0, 0);
        backface-visibility: hidden;
        pointer-events: none;
      }
    }

    #gp-konum-nabzi-hub .gp-marquee-track:hover .gp-marquee-content {
      animation-play-state: paused;
    }

    #gp-konum-nabzi-hub .gp-marquee-track.reverse .gp-marquee-content {
      animation-direction: reverse;
    }

    @keyframes kn-scroll {
      from { transform: translateX(0); }
      to { transform: translateX(calc(-100% - 20px)); }
    }

    /* BANT İÇİ ELEMANLAR */
    #gp-konum-nabzi-hub .gp-ticker-item {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 16px 28px;
      background: rgba(255, 255, 255, 0.6);
      backdrop-filter: blur(4px);
      border: 1px solid var(--gp-border);
      border-radius: 999px;
      text-decoration: none;
      color: var(--gp-text);
      font-weight: 600;
      font-size: 1rem;
      white-space: nowrap;
      transition: var(--gp-transition);
      cursor: pointer;
    }

    #gp-konum-nabzi-hub .gp-ticker-item svg {
      width: 20px;
      height: 20px;
      color: var(--gp-muted);
      transition: var(--gp-transition);
    }

    #gp-konum-nabzi-hub .gp-ticker-item:hover {
      border-color: var(--gp-brand);
      background: #ffffff;
      color: var(--gp-brand);
      transform: translateY(-4px);
      box-shadow: 0 12px 28px rgba(0, 138, 249, 0.12);
    }

    #gp-konum-nabzi-hub .gp-ticker-item:hover svg {
      color: var(--gp-brand);
      transform: scale(1.15) rotate(-5deg); /* Organik ikon hareketi */
    }

    /* =========================================
       MERKEZİ "TÜMÜNÜ GÖR" BUTONU (USTALIK)
       ========================================= */
    #gp-konum-nabzi-hub .gp-see-all-wrapper {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 20;
      width: 214px;
      height: 242px;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
    }

    #gp-konum-nabzi-hub .gp-see-all-btn {
      display: block;
      width: 206px;
      height: 232px;
      border-radius: 999px;
      text-decoration: none;
      position: relative;
      overflow: visible; /* Gölge taşsın diye visible yaptık */
      transition: var(--gp-transition);
      border: none;
      background: transparent;
      cursor: pointer;
      padding: 0;
      isolation: isolate;
      pointer-events: auto;
      filter: drop-shadow(0 22px 34px rgba(0, 46, 94, 0.16));
    }

    #gp-konum-nabzi-hub .gp-see-all-btn:focus-visible {
      outline: 3px solid rgba(0, 138, 249, 0.32);
      outline-offset: 8px;
    }

    #gp-konum-nabzi-hub .gp-see-all-btn::before {
      content: '';
      position: absolute;
      top: 2px;
      left: 50%;
      width: 40px;
      height: 24px;
      border-radius: 22px 22px 7px 7px;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.92), rgba(196, 218, 236, 0.62)),
        linear-gradient(135deg, rgba(214, 165, 76, 0.78), rgba(255,255,255,0.16));
      border: 1px solid rgba(0, 72, 120, 0.1);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), 0 12px 22px rgba(0, 72, 120, 0.1);
      transform: translateX(-50%);
      z-index: -1;
    }

    /* Nefes Alan Dış Gölge */
    #gp-konum-nabzi-hub .gp-see-all-btn::after {
      content: '';
      position: absolute;
      top: 20px;
      left: 50%;
      width: 176px;
      height: 176px;
      border-radius: 50%;
      box-shadow: 0 0 0 0 rgba(0, 138, 249, 0.4);
      animation: kn-btn-pulse 3s infinite cubic-bezier(0.66, 0, 0, 1);
      transform: translateX(-50%);
      z-index: -1;
    }

    @keyframes kn-btn-pulse {
      0% { box-shadow: 0 0 0 0 rgba(0, 138, 249, 0.5); }
      70% { box-shadow: 0 0 0 25px rgba(0, 138, 249, 0); }
      100% { box-shadow: 0 0 0 0 rgba(0, 138, 249, 0); }
    }

    /* Dönen Işık Çemberi */
    #gp-konum-nabzi-hub .gp-btn-ring {
      position: absolute;
      top: 20px;
      left: 50%;
      width: 176px;
      height: 176px;
      border-radius: 50%;
      overflow: hidden;
      mask-image: radial-gradient(white, black);
      -webkit-mask-image: -webkit-radial-gradient(white, black);
      transform: translateX(-50%);
      background: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(203, 224, 240, 0.72));
      box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.86),
        inset 0 -14px 26px rgba(0, 72, 120, 0.12),
        0 16px 36px rgba(0, 46, 94, 0.14);
    }
    
    #gp-konum-nabzi-hub .gp-btn-ring::before {
      content: '';
      position: absolute;
      top: -50%; left: -50%;
      width: 200%; height: 200%;
      background: conic-gradient(from 0deg, transparent 0%, transparent 58%, rgba(214, 165, 76, 0.88) 72%, var(--gp-brand) 100%);
      animation: gp-rotate 3s linear infinite;
    }

    @keyframes gp-rotate { 100% { transform: rotate(360deg); } }

    /* Cam İçerik */
    #gp-konum-nabzi-hub .gp-btn-inner {
      position: absolute;
      top: 28px;
      left: 50%;
      width: 160px;
      height: 160px;
      background:
        radial-gradient(circle at 50% 45%, rgba(255,255,255,0.96) 0 31%, rgba(239, 247, 253, 0.95) 58%, rgba(214, 230, 242, 0.92) 100%);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-radius: 50%;
      display: block;
      z-index: 2;
      color: var(--gp-brand-dark);
      font-family: 'Outfit', sans-serif;
      font-weight: 800;
      font-size: 1rem;
      line-height: 1.1;
      text-align: center;
      transition: var(--gp-transition);
      border: 1px solid rgba(255, 255, 255, 1);
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.98),
        inset 0 -18px 32px rgba(0, 72, 120, 0.08),
        0 1px 0 rgba(255,255,255,0.9);
      transform: translateX(-50%);
    }

    #gp-konum-nabzi-hub .gp-clock-face {
      position: absolute;
      inset: 0;
      border-radius: 50%;
      overflow: hidden;
    }

    #gp-konum-nabzi-hub .gp-clock-face::before {
      content: '';
      position: absolute;
      inset: 13px;
      border-radius: 50%;
      background:
        repeating-conic-gradient(from 0deg, rgba(12, 25, 40, 0.76) 0deg 1.2deg, transparent 1.2deg 6deg),
        repeating-conic-gradient(from 0deg, rgba(0, 138, 249, 0.34) 0deg 2.6deg, transparent 2.6deg 30deg);
      -webkit-mask: radial-gradient(circle, transparent 0 59%, #000 60% 66%, transparent 67%);
      mask: radial-gradient(circle, transparent 0 59%, #000 60% 66%, transparent 67%);
      opacity: 0.9;
    }

    #gp-konum-nabzi-hub .gp-clock-face::after {
      content: '';
      position: absolute;
      inset: 8px;
      border-radius: 50%;
      background:
        linear-gradient(135deg, rgba(255,255,255,0.78) 0%, rgba(255,255,255,0.18) 36%, transparent 37%),
        radial-gradient(circle at 42% 28%, rgba(255,255,255,0.72), transparent 26%);
      pointer-events: none;
      mix-blend-mode: screen;
    }

    #gp-konum-nabzi-hub .gp-clock-numeral {
      position: absolute;
      z-index: 3;
      color: #14283a;
      font-family: 'Outfit', sans-serif;
      font-size: 0.86rem;
      font-weight: 800;
      letter-spacing: 0;
      line-height: 1;
      text-shadow: 0 1px 0 rgba(255,255,255,0.9);
    }

    #gp-konum-nabzi-hub .gp-clock-mark-12 { top: 20px; left: 50%; transform: translateX(-50%); }
    #gp-konum-nabzi-hub .gp-clock-mark-3 { top: 50%; right: 20px; transform: translateY(-50%); }
    #gp-konum-nabzi-hub .gp-clock-mark-6 { bottom: 20px; left: 50%; transform: translateX(-50%); }
    #gp-konum-nabzi-hub .gp-clock-mark-9 { top: 50%; left: 20px; transform: translateY(-50%); }

    #gp-konum-nabzi-hub .gp-clock-hand {
      position: absolute;
      left: 50%;
      bottom: 50%;
      z-index: 5;
      border-radius: 999px;
      transform: rotate(var(--angle, 0deg));
      transform-origin: 50% 100%;
      will-change: transform;
    }

    #gp-konum-nabzi-hub .gp-hour-hand {
      width: 7px;
      height: 43px;
      margin-left: -3.5px;
      background: linear-gradient(180deg, #14283a, #31546d);
      box-shadow: 0 4px 10px rgba(12, 25, 40, 0.2);
    }

    #gp-konum-nabzi-hub .gp-minute-hand {
      width: 5px;
      height: 59px;
      margin-left: -2.5px;
      background: linear-gradient(180deg, #0060b5, #008af9);
      box-shadow: 0 5px 12px rgba(0, 96, 181, 0.24);
    }

    #gp-konum-nabzi-hub .gp-second-hand {
      width: 2px;
      height: 66px;
      margin-left: -1px;
      background: #d6a54c;
      box-shadow: 0 0 12px rgba(214, 165, 76, 0.45);
    }

    #gp-konum-nabzi-hub .gp-second-hand::after {
      content: '';
      position: absolute;
      left: 50%;
      bottom: -20px;
      width: 2px;
      height: 24px;
      border-radius: 999px;
      background: rgba(214, 165, 76, 0.78);
      transform: translateX(-50%);
    }

    #gp-konum-nabzi-hub .gp-clock-pin {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 14px;
      height: 14px;
      border-radius: 50%;
      z-index: 7;
      background:
        radial-gradient(circle at 35% 28%, rgba(255,255,255,0.95), transparent 31%),
        linear-gradient(135deg, #d6a54c, #976b24);
      border: 2px solid #ffffff;
      box-shadow: 0 5px 13px rgba(12, 25, 40, 0.22);
      transform: translate(-50%, -50%);
    }

    #gp-konum-nabzi-hub .gp-clock-plaque {
      position: absolute;
      left: 50%;
      bottom: 10px;
      z-index: 4;
      min-width: 142px;
      min-height: 42px;
      padding: 0 22px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.96), rgba(241, 248, 253, 0.94)),
        radial-gradient(circle at 50% 0%, rgba(0, 138, 249, 0.12), transparent 58%);
      border: 1px solid rgba(0, 138, 249, 0.18);
      box-shadow:
        0 14px 30px rgba(0, 46, 94, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.98);
      transform: translateX(-50%);
      transition: var(--gp-transition);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
    }

    #gp-konum-nabzi-hub .gp-clock-cta {
      font-family: 'DM Sans', sans-serif;
      font-size: 0.74rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      line-height: 1;
      text-transform: uppercase;
      color: var(--gp-brand);
      white-space: nowrap;
    }

    #gp-konum-nabzi-hub .gp-see-all-btn:hover {
      transform: translateY(-4px) scale(1.035);
    }

    #gp-konum-nabzi-hub .gp-see-all-btn:hover .gp-btn-inner {
      background:
        radial-gradient(circle at 50% 45%, #ffffff 0 31%, rgba(245, 250, 254, 0.98) 58%, rgba(221, 236, 247, 0.96) 100%);
      color: var(--gp-brand);
      box-shadow:
        inset 0 0 0 rgba(0, 138, 249, 0),
        0 14px 34px rgba(0, 138, 249, 0.17);
      transform: translateX(-50%) translateY(-2px);
    }

    #gp-konum-nabzi-hub .gp-see-all-btn:hover .gp-clock-plaque {
      transform: translateX(-50%) translateY(-3px);
      border-color: rgba(0, 138, 249, 0.18);
      box-shadow:
        0 18px 34px rgba(0, 138, 249, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.98);
    }

    /* =========================================
       Konum Nabzı — Keşif Araçları Modal
       ========================================= */
    #kn-tools-modal {
      position: fixed;
      inset: 0;
      z-index: 120;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: clamp(0.75rem, 3vw, 1.5rem);
      box-sizing: border-box;
      background: rgba(15, 23, 42, 0.42);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.32s ease, visibility 0.32s ease;
      font-family: "DM Sans", Inter, system-ui, sans-serif;
      --gp-brand: #008af9;
      --gp-brand-soft: rgba(0, 138, 249, 0.08);
      --gp-text: #0f172a;
      --gp-muted: #64748b;
      --gp-border: rgba(226, 232, 240, 0.95);
    }

    #kn-tools-modal.active {
      opacity: 1;
      visibility: visible;
    }

    #kn-tools-modal .gp-modal-container {
      width: 100%;
      max-width: min(56rem, 96vw);
      max-height: min(88dvh, calc(100dvh - 1.5rem));
      padding: 1px;
      border-radius: 1.75rem;
      background: linear-gradient(145deg, rgba(0, 138, 249, 0.2), rgba(226, 232, 240, 0.55) 45%, rgba(0, 138, 249, 0.1));
      box-shadow:
        0 32px 80px -24px rgba(15, 23, 42, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
      transform: scale(0.96) translateY(12px);
      opacity: 0;
      transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.32s ease;
      overflow: hidden;
      min-height: 0;
    }

    #kn-tools-modal.active .gp-modal-container {
      transform: scale(1) translateY(0);
      opacity: 1;
    }

    #kn-tools-modal .kn-modal-inner {
      display: flex;
      flex-direction: column;
      max-height: inherit;
      min-height: 0;
      border-radius: calc(1.75rem - 1px);
      background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
      overflow: hidden;
    }

    #kn-tools-modal .kn-modal-head {
      position: relative;
      flex-shrink: 0;
      padding: clamp(1.35rem, 3vw, 1.75rem) clamp(1.25rem, 3vw, 2rem) 1.15rem;
      border-bottom: 1px solid var(--gp-border);
      background:
        linear-gradient(135deg, rgba(0, 138, 249, 0.07) 0%, rgba(255, 255, 255, 0) 55%),
        linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
    }

    #kn-tools-modal .kn-modal-head::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 3px;
      background: linear-gradient(90deg, #008af9 0%, #38bdf8 50%, transparent 100%);
      border-radius: 1.75rem 1.75rem 0 0;
    }

    #kn-tools-modal .kn-modal-head__row {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 1rem;
    }

    #kn-tools-modal .kn-modal-head__brand {
      display: flex;
      align-items: flex-start;
      gap: 0.9rem;
      min-width: 0;
    }

    #kn-tools-modal .kn-modal-head__icon {
      flex-shrink: 0;
      width: 3rem;
      height: 3rem;
      display: grid;
      place-items: center;
      border-radius: 1rem;
      color: #008af9;
      background: linear-gradient(135deg, rgba(0, 138, 249, 0.14), rgba(0, 138, 249, 0.04));
      border: 1px solid rgba(0, 138, 249, 0.2);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    }

    #kn-tools-modal .kn-modal-head__icon i {
      font-size: 1.2rem;
    }

    #kn-tools-modal .kn-modal-head__title {
      margin: 0;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: clamp(1.35rem, 2.8vw, 1.75rem);
      font-weight: 400;
      line-height: 1.15;
      letter-spacing: -0.02em;
      color: var(--gp-text);
    }

    #kn-tools-modal .kn-modal-head__sub {
      margin: 0.35rem 0 0;
      font-size: 0.8125rem;
      line-height: 1.5;
      color: var(--gp-muted);
    }

    #kn-tools-modal .kn-modal-head__meta {
      display: inline-flex;
      align-items: center;
      margin-top: 0.65rem;
      padding: 0.3rem 0.65rem;
      border-radius: 999px;
      font-size: 0.625rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #008af9;
      background: rgba(0, 138, 249, 0.08);
      border: 1px solid rgba(0, 138, 249, 0.16);
    }

    #kn-tools-modal .kn-modal-close {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2.5rem;
      height: 2.5rem;
      border: 1px solid #e2e8f0;
      border-radius: 999px;
      background: #fff;
      color: #64748b;
      cursor: pointer;
      transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    }

    #kn-tools-modal .kn-modal-close:hover,
    #kn-tools-modal .kn-modal-close:focus-visible {
      color: #0f172a;
      border-color: rgba(0, 138, 249, 0.35);
      background: rgba(0, 138, 249, 0.06);
      outline: none;
      transform: scale(1.05);
    }

    #kn-tools-modal .kn-modal-close svg {
      width: 1.125rem;
      height: 1.125rem;
    }

    #kn-tools-modal .gp-modal-body {
      flex: 1 1 auto;
      min-height: 0;
      padding: clamp(1rem, 2.5vw, 1.5rem) clamp(1.25rem, 3vw, 2rem);
      overflow-y: auto;
      overflow-x: hidden;
      scroll-behavior: smooth;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      background: transparent;
      scrollbar-width: thin;
      scrollbar-color: #008af9 rgba(226, 232, 240, 0.65);
    }

    #kn-tools-modal .gp-modal-body::-webkit-scrollbar {
      width: 9px;
    }

    #kn-tools-modal .gp-modal-body::-webkit-scrollbar-track {
      background: rgba(241, 245, 249, 0.85);
      border-radius: 999px;
      margin: 6px 0;
    }

    #kn-tools-modal .gp-modal-body::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, #38bdf8 0%, #008af9 55%, #0078e8 100%);
      border-radius: 999px;
      border: 2px solid rgba(241, 245, 249, 0.85);
      box-shadow: 0 0 10px rgba(0, 138, 249, 0.25);
    }

    #kn-tools-modal .gp-modal-body::-webkit-scrollbar-thumb:hover {
      background: linear-gradient(180deg, #008af9 0%, #0078e8 100%);
    }

    #kn-tools-modal .kn-modal-foot {
      flex-shrink: 0;
      padding: 0.75rem clamp(1.25rem, 3vw, 2rem) 1rem;
      border-top: 1px solid var(--gp-border);
      text-align: center;
      font-size: 0.6875rem;
      font-weight: 500;
      color: #94a3b8;
      background: rgba(255, 255, 255, 0.88);
    }

    #kn-tools-modal .gp-tools-grid {
      display: grid;
      grid-template-columns: repeat(1, minmax(0, 1fr));
      gap: 0.85rem;
    }

    @media (min-width: 640px) {
      #kn-tools-modal .gp-tools-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
      }
    }

    @media (min-width: 1024px) {
      #kn-tools-modal .gp-tools-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

    #kn-tools-modal .gp-tool-card {
      display: flex;
      align-items: flex-start;
      gap: 0.85rem;
      padding: 1rem 1.05rem;
      background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
      border: 1px solid var(--gp-border);
      border-radius: 1.1rem;
      text-decoration: none;
      color: var(--gp-text);
      position: relative;
      overflow: hidden;
      box-shadow: 0 4px 16px -10px rgba(15, 23, 42, 0.1);
      transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.32s ease, box-shadow 0.32s ease;
      opacity: 0;
      transform: translateY(12px);
    }

    #kn-tools-modal .gp-tool-card::after {
      content: "";
      position: absolute;
      top: 1rem;
      right: 1rem;
      width: 1.5rem;
      height: 1.5rem;
      border-radius: 999px;
      background: rgba(0, 138, 249, 0.08);
      opacity: 0;
      transform: translateX(-4px);
      transition: opacity 0.3s ease, transform 0.3s ease;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008af9' stroke-width='2.5'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 0.65rem no-repeat;
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008af9' stroke-width='2.5'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 0.65rem no-repeat;
    }

    #kn-tools-modal .gp-tool-icon {
      width: 2.75rem;
      height: 2.75rem;
      border-radius: 0.85rem;
      background: linear-gradient(135deg, rgba(0, 138, 249, 0.12), rgba(0, 138, 249, 0.04));
      border: 1px solid rgba(0, 138, 249, 0.16);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gp-brand);
      flex-shrink: 0;
      transition: background 0.32s ease, color 0.32s ease, transform 0.32s ease;
    }

    #kn-tools-modal .gp-tool-icon svg {
      width: 1.15rem;
      height: 1.15rem;
    }

    #kn-tools-modal .gp-tool-info {
      display: flex;
      flex-direction: column;
      gap: 0.2rem;
      min-width: 0;
      padding-right: 1.25rem;
    }

    #kn-tools-modal .gp-tool-title {
      font-weight: 800;
      font-size: 0.9375rem;
      line-height: 1.35;
      letter-spacing: -0.01em;
      color: var(--gp-text);
      transition: color 0.3s ease;
    }

    #kn-tools-modal .gp-tool-desc {
      font-size: 0.8125rem;
      line-height: 1.5;
      color: var(--gp-muted);
    }

    #kn-tools-modal .gp-tool-card:hover {
      transform: translateY(-3px);
      border-color: rgba(0, 138, 249, 0.28);
      box-shadow:
        0 16px 36px -14px rgba(0, 138, 249, 0.16),
        0 0 0 1px rgba(0, 138, 249, 0.06);
    }

    #kn-tools-modal .gp-tool-card:hover::after {
      opacity: 1;
      transform: translateX(0);
    }

    #kn-tools-modal .gp-tool-card:hover .gp-tool-icon {
      color: #fff;
      background: linear-gradient(135deg, #008af9, #38bdf8);
      transform: scale(1.04);
    }

    #kn-tools-modal .gp-tool-card:hover .gp-tool-title {
      color: var(--gp-brand);
    }

    @keyframes knToolReveal {
      to { opacity: 1; transform: translateY(0); }
    }

    #kn-tools-modal.active .gp-tool-card {
      animation: knToolReveal 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    }

    @media (prefers-reduced-motion: reduce) {
      #kn-tools-modal .gp-modal-container,
      #kn-tools-modal.active .gp-modal-container {
        transition: none;
      }
      #kn-tools-modal.active .gp-tool-card {
        animation: none;
        opacity: 1;
        transform: none;
      }
      #kn-tools-modal .gp-tool-card:hover {
        transform: none;
      }
    }

    /* =========================================
       Oyun Kütüphanesi Modal
       ========================================= */
    #oy-games-modal-wrapper {
      position: fixed;
      inset: 0;
      z-index: 120;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: clamp(0.75rem, 3vw, 1.5rem);
      box-sizing: border-box;
      background: rgba(15, 23, 42, 0.42);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.32s ease, visibility 0.32s ease;
      font-family: "DM Sans", Inter, system-ui, sans-serif;
      --oy-brand: #008af9;
      --oy-text: #0f172a;
      --oy-muted: #64748b;
      --oy-border: rgba(226, 232, 240, 0.95);
    }

    #oy-games-modal-wrapper.active {
      opacity: 1;
      visibility: visible;
    }

    #oy-games-modal-wrapper .gp-modal-container {
      width: 100%;
      max-width: min(72rem, 96vw);
      max-height: min(88dvh, calc(100dvh - 1.5rem));
      padding: 1px;
      border-radius: 1.75rem;
      background: linear-gradient(145deg, rgba(0, 138, 249, 0.2), rgba(226, 232, 240, 0.55) 45%, rgba(0, 138, 249, 0.1));
      box-shadow:
        0 32px 80px -24px rgba(15, 23, 42, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
      transform: scale(0.96) translateY(12px);
      opacity: 0;
      transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.32s ease;
      overflow: hidden;
      min-height: 0;
    }

    #oy-games-modal-wrapper.active .gp-modal-container {
      transform: scale(1) translateY(0);
      opacity: 1;
    }

    #oy-games-modal-wrapper .oy-modal-inner {
      display: flex;
      flex-direction: column;
      max-height: inherit;
      min-height: 0;
      border-radius: calc(1.75rem - 1px);
      background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
      overflow: hidden;
    }

    #oy-games-modal-wrapper .oy-modal-head {
      position: relative;
      flex-shrink: 0;
      padding: clamp(1.35rem, 3vw, 1.75rem) clamp(1.25rem, 3vw, 2rem) 1.15rem;
      border-bottom: 1px solid var(--oy-border);
      background:
        linear-gradient(135deg, rgba(0, 138, 249, 0.07) 0%, rgba(255, 255, 255, 0) 55%),
        linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
    }

    #oy-games-modal-wrapper .oy-modal-head::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 3px;
      background: linear-gradient(90deg, #008af9 0%, #38bdf8 50%, transparent 100%);
      border-radius: 1.75rem 1.75rem 0 0;
    }

    #oy-games-modal-wrapper .oy-modal-head__row {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 1rem;
    }

    #oy-games-modal-wrapper .oy-modal-head__brand {
      display: flex;
      align-items: flex-start;
      gap: 0.9rem;
      min-width: 0;
    }

    #oy-games-modal-wrapper .oy-modal-head__icon {
      flex-shrink: 0;
      width: 3rem;
      height: 3rem;
      display: grid;
      place-items: center;
      border-radius: 1rem;
      color: #008af9;
      background: linear-gradient(135deg, rgba(0, 138, 249, 0.14), rgba(0, 138, 249, 0.04));
      border: 1px solid rgba(0, 138, 249, 0.2);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    }

    #oy-games-modal-wrapper .oy-modal-head__icon i {
      font-size: 1.2rem;
    }

    #oy-games-modal-wrapper .oy-modal-head__title {
      margin: 0;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: clamp(1.35rem, 2.8vw, 1.75rem);
      font-weight: 400;
      line-height: 1.15;
      letter-spacing: -0.02em;
      color: var(--oy-text);
    }

    #oy-games-modal-wrapper .oy-modal-head__sub {
      margin: 0.35rem 0 0;
      font-size: 0.8125rem;
      line-height: 1.5;
      color: var(--oy-muted);
    }

    #oy-games-modal-wrapper .oy-modal-head__meta {
      display: inline-flex;
      align-items: center;
      margin-top: 0.65rem;
      padding: 0.3rem 0.65rem;
      border-radius: 999px;
      font-size: 0.625rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #008af9;
      background: rgba(0, 138, 249, 0.08);
      border: 1px solid rgba(0, 138, 249, 0.16);
    }

    #oy-games-modal-wrapper .oy-modal-close {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2.5rem;
      height: 2.5rem;
      border: 1px solid #e2e8f0;
      border-radius: 999px;
      background: #fff;
      color: #64748b;
      cursor: pointer;
      transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-modal-close:hover,
    #oy-games-modal-wrapper .oy-modal-close:focus-visible {
      color: #0f172a;
      border-color: rgba(0, 138, 249, 0.35);
      background: rgba(0, 138, 249, 0.06);
      outline: none;
      transform: scale(1.05);
    }

    #oy-games-modal-wrapper .oy-modal-close svg {
      width: 1.125rem;
      height: 1.125rem;
    }

    #oy-games-modal-wrapper .oy-modal-search {
      position: relative;
      margin-top: 1.1rem;
    }

    #oy-games-modal-wrapper .oy-modal-search i {
      position: absolute;
      left: 1rem;
      top: 50%;
      transform: translateY(-50%);
      color: #94a3b8;
      font-size: 0.875rem;
      pointer-events: none;
      transition: color 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-modal-search:focus-within i {
      color: #008af9;
    }

    #oy-games-modal-wrapper .oy-modal-search input {
      width: 100%;
      padding: 0.75rem 1rem 0.75rem 2.65rem;
      border-radius: 0.85rem;
      border: 1px solid #e2e8f0;
      background: #fff;
      color: var(--oy-text);
      font-size: 0.875rem;
      font-family: inherit;
      transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-modal-search input::placeholder {
      color: #94a3b8;
    }

    #oy-games-modal-wrapper .oy-modal-search input:focus {
      outline: none;
      border-color: rgba(0, 138, 249, 0.45);
      box-shadow: 0 0 0 3px rgba(0, 138, 249, 0.12);
    }

    #oy-games-modal-wrapper .oy-modal-body {
      flex: 1 1 auto;
      min-height: 0;
      padding: clamp(1rem, 2.5vw, 1.5rem) clamp(1.25rem, 3vw, 2rem);
      overflow-y: auto;
      overflow-x: hidden;
      scroll-behavior: smooth;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: #008af9 rgba(226, 232, 240, 0.65);
    }

    #oy-games-modal-wrapper .oy-modal-body::-webkit-scrollbar {
      width: 9px;
    }

    #oy-games-modal-wrapper .oy-modal-body::-webkit-scrollbar-track {
      background: rgba(241, 245, 249, 0.85);
      border-radius: 999px;
      margin: 6px 0;
    }

    #oy-games-modal-wrapper .oy-modal-body::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, #38bdf8 0%, #008af9 55%, #0078e8 100%);
      border-radius: 999px;
      border: 2px solid rgba(241, 245, 249, 0.85);
      box-shadow: 0 0 10px rgba(0, 138, 249, 0.25);
    }

    #oy-games-modal-wrapper .oy-modal-body::-webkit-scrollbar-thumb:hover {
      background: linear-gradient(180deg, #008af9 0%, #0078e8 100%);
    }

    #oy-games-modal-wrapper .oy-modal-foot {
      flex-shrink: 0;
      padding: 0.75rem clamp(1.25rem, 3vw, 2rem) 1rem;
      border-top: 1px solid var(--oy-border);
      text-align: center;
      font-size: 0.6875rem;
      font-weight: 500;
      color: #94a3b8;
      background: rgba(255, 255, 255, 0.88);
    }

    #oy-games-modal-wrapper .oy-lib-grid {
      display: grid;
      grid-template-columns: repeat(1, minmax(0, 1fr));
      gap: 0.85rem;
      max-width: 1600px;
      margin: 0 auto;
    }

    @media (min-width: 640px) {
      #oy-games-modal-wrapper .oy-lib-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
      }
    }

    @media (min-width: 768px) {
      #oy-games-modal-wrapper .oy-lib-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

    @media (min-width: 1024px) {
      #oy-games-modal-wrapper .oy-lib-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.1rem;
      }
    }

    #oy-games-modal-wrapper .oy-lib-card {
      position: relative;
      display: flex;
      flex-direction: column;
      min-height: 11.5rem;
      padding: 1rem 1.05rem;
      background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
      border: 1px solid var(--oy-border);
      border-radius: 1.1rem;
      cursor: pointer;
      overflow: hidden;
      touch-action: manipulation;
      opacity: 0;
      transform: translateY(10px);
      transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
    }

    #oy-games-modal-wrapper .oy-lib-card::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      background: linear-gradient(135deg, rgba(0, 138, 249, 0.06) 0%, transparent 55%);
      opacity: 0;
      transition: opacity 0.25s ease;
      pointer-events: none;
    }

    #oy-games-modal-wrapper .oy-lib-card__glow {
      position: absolute;
      top: -2.5rem;
      right: -2.5rem;
      width: 7rem;
      height: 7rem;
      border-radius: 999px;
      background: rgba(0, 138, 249, 0.1);
      filter: blur(28px);
      pointer-events: none;
      transition: background 0.35s ease;
    }

    #oy-games-modal-wrapper .oy-lib-card__head {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: flex-start;
      gap: 0.75rem;
      padding-bottom: 0.85rem;
      margin-bottom: 0.85rem;
      border-bottom: 1px solid rgba(226, 232, 240, 0.85);
    }

    #oy-games-modal-wrapper .oy-lib-card__icon {
      flex-shrink: 0;
      width: 2.5rem;
      height: 2.5rem;
      display: grid;
      place-items: center;
      border-radius: 0.75rem;
      color: #008af9;
      background: rgba(0, 138, 249, 0.08);
      border: 1px solid rgba(0, 138, 249, 0.16);
      font-size: 1rem;
      transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    }

    #oy-games-modal-wrapper .oy-lib-card__title {
      margin: 0;
      font-size: 0.9375rem;
      font-weight: 700;
      line-height: 1.35;
      color: var(--oy-text);
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      transition: color 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-lib-card__desc {
      position: relative;
      z-index: 1;
      margin: 0;
      flex: 1 1 auto;
      font-size: 0.8125rem;
      line-height: 1.55;
      color: var(--oy-muted);
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    #oy-games-modal-wrapper .oy-lib-card__foot {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0.5rem;
      margin-top: 0.85rem;
      padding-top: 0.65rem;
    }

    #oy-games-modal-wrapper .oy-lib-card__tag {
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: #94a3b8;
    }

    #oy-games-modal-wrapper .oy-lib-card__cta {
      display: inline-flex;
      align-items: center;
      gap: 0.35rem;
      font-size: 0.75rem;
      font-weight: 700;
      color: #64748b;
      transition: color 0.2s ease, transform 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-lib-card__cta i {
      font-size: 0.65rem;
      transition: transform 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-lib-card:hover,
    #oy-games-modal-wrapper .oy-lib-card:focus-visible {
      border-color: rgba(0, 138, 249, 0.35);
      box-shadow: 0 14px 36px -14px rgba(0, 138, 249, 0.22);
      transform: translateY(-4px);
      outline: none;
    }

    #oy-games-modal-wrapper .oy-lib-card:hover::after,
    #oy-games-modal-wrapper .oy-lib-card:focus-visible::after {
      opacity: 1;
    }

    #oy-games-modal-wrapper .oy-lib-card:hover .oy-lib-card__glow {
      background: rgba(0, 138, 249, 0.2);
    }

    #oy-games-modal-wrapper .oy-lib-card:hover .oy-lib-card__icon {
      transform: scale(1.08);
    }

    #oy-games-modal-wrapper .oy-lib-card:hover .oy-lib-card__title,
    #oy-games-modal-wrapper .oy-lib-card:focus-visible .oy-lib-card__title {
      color: #008af9;
    }

    #oy-games-modal-wrapper .oy-lib-card:hover .oy-lib-card__tag,
    #oy-games-modal-wrapper .oy-lib-card:hover .oy-lib-card__cta {
      color: #008af9;
    }

    #oy-games-modal-wrapper .oy-lib-card:hover .oy-lib-card__cta i {
      transform: translateX(3px);
    }

    #oy-games-modal-wrapper .oy-lib-empty {
      grid-column: 1 / -1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 3rem 1.25rem;
      border-radius: 1.25rem;
      border: 1px dashed rgba(0, 138, 249, 0.22);
      background: linear-gradient(180deg, #ffffff 0%, rgba(0, 138, 249, 0.03) 100%);
    }

    #oy-games-modal-wrapper .oy-lib-empty__icon {
      width: 3.25rem;
      height: 3.25rem;
      display: grid;
      place-items: center;
      border-radius: 1rem;
      color: #008af9;
      background: rgba(0, 138, 249, 0.08);
      border: 1px solid rgba(0, 138, 249, 0.16);
      font-size: 1.25rem;
      margin-bottom: 1rem;
    }

    #oy-games-modal-wrapper .oy-lib-empty__title {
      margin: 0;
      font-size: 1.05rem;
      font-weight: 700;
      color: var(--oy-text);
    }

    #oy-games-modal-wrapper .oy-lib-empty__sub {
      margin: 0.5rem 0 0;
      max-width: 22rem;
      font-size: 0.875rem;
      line-height: 1.55;
      color: var(--oy-muted);
    }

    #oy-games-modal-wrapper .oy-lib-empty__btn {
      margin-top: 1.35rem;
      min-height: 2.75rem;
      padding: 0.65rem 1.25rem;
      border-radius: 0.85rem;
      border: 1px solid rgba(0, 138, 249, 0.35);
      background: #008af9;
      color: #fff;
      font-size: 0.8125rem;
      font-weight: 700;
      font-family: inherit;
      cursor: pointer;
      transition: background 0.2s ease, transform 0.2s ease;
    }

    #oy-games-modal-wrapper .oy-lib-empty__btn:hover {
      background: #0078e8;
      transform: translateY(-1px);
    }

    @keyframes oyLibReveal {
      to { opacity: 1; transform: translateY(0); }
    }

    #oy-games-modal-wrapper.active .oy-lib-card {
      animation: oyLibReveal 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    }

    @media (prefers-reduced-motion: reduce) {
      #oy-games-modal-wrapper .gp-modal-container,
      #oy-games-modal-wrapper.active .gp-modal-container {
        transition: none;
      }
      #oy-games-modal-wrapper.active .oy-lib-card {
        animation: none;
        opacity: 1;
        transform: none;
      }
      #oy-games-modal-wrapper .oy-lib-card:hover {
        transform: none;
      }
    }

    @media (max-width: 768px) {
      #oy-games-modal-wrapper .oy-modal-head {
        padding: 1.25rem 1.15rem 1rem;
      }
      #oy-games-modal-wrapper .oy-lib-card__cta span {
        display: none;
      }
    }

    /* MOBİL DÜZENLEMELER */
    @media (max-width: 768px) {
      #gp-konum-nabzi-hub .gp-ticker-section { padding: 30px 10px; border-radius: 20px; }
      #gp-konum-nabzi-hub .gp-ticker-title { font-size: 1.5rem; }
      #gp-konum-nabzi-hub .gp-marquee-area { min-height: 214px; }
      #gp-konum-nabzi-hub .gp-marquee-container { gap: 26px; padding: 32px 0; }
      #gp-konum-nabzi-hub .gp-see-all-wrapper { width: 166px; height: 194px; }
      #gp-konum-nabzi-hub .gp-see-all-btn { width: 158px; height: 190px; }
      #gp-konum-nabzi-hub .gp-see-all-btn::before { top: 4px; width: 32px; height: 20px; }
      #gp-konum-nabzi-hub .gp-see-all-btn::after,
      #gp-konum-nabzi-hub .gp-btn-ring { top: 18px; width: 132px; height: 132px; }
      #gp-konum-nabzi-hub .gp-btn-inner { top: 23px; width: 122px; height: 122px; font-size: 0.85rem; }
      #gp-konum-nabzi-hub .gp-clock-face::before { inset: 10px; }
      #gp-konum-nabzi-hub .gp-clock-numeral { font-size: 0.68rem; }
      #gp-konum-nabzi-hub .gp-clock-mark-12 { top: 14px; }
      #gp-konum-nabzi-hub .gp-clock-mark-3 { right: 14px; }
      #gp-konum-nabzi-hub .gp-clock-mark-6 { bottom: 14px; }
      #gp-konum-nabzi-hub .gp-clock-mark-9 { left: 14px; }
      #gp-konum-nabzi-hub .gp-hour-hand { width: 5px; height: 32px; margin-left: -2.5px; }
      #gp-konum-nabzi-hub .gp-minute-hand { width: 4px; height: 44px; margin-left: -2px; }
      #gp-konum-nabzi-hub .gp-second-hand { height: 50px; }
      #gp-konum-nabzi-hub .gp-clock-pin { width: 11px; height: 11px; }
      #gp-konum-nabzi-hub .gp-clock-plaque { bottom: 10px; min-width: 120px; min-height: 38px; padding: 0 18px; }
      #gp-konum-nabzi-hub .gp-clock-cta { font-size: 0.64rem; }
      #kn-tools-modal .kn-modal-head { padding: 1.25rem 1.15rem 1rem; }
      #kn-tools-modal .gp-modal-body { padding: 1rem 1.15rem 1.25rem; }
      #kn-tools-modal .gp-tools-grid { grid-template-columns: 1fr; }
    }
        /* === Dosya Merkezi === */
        /* Dosya Merkezi Hub */
        :root {
          --hmc-bg: #ffffff;
          --hmc-bg2: #ffffff;
          --hmc-card: rgba(255, 255, 255, 0.97);
          --hmc-border: rgba(0, 138, 249, 0.14);
          --hmc-text: #0f172a;
          --hmc-muted: #64748b;
          --hmc-accent: #008af9;
          --hmc-accent2: #008af9;
          --hmc-accent-soft: rgba(0, 138, 249, 0.1);
          --hmc-glow: rgba(0, 138, 249, 0.22);
          --hmc-success: #00a884;
          --hmc-radius: 20px;
          --hmc-font: 'DM Sans', system-ui, sans-serif;
          --hmc-display: 'Space Grotesk', system-ui, sans-serif;
        }

        .hmc-section * { box-sizing: border-box; }

        .hmc-section {
          font-family: var(--hmc-font);
          color: var(--hmc-text);
          position: relative;
          isolation: isolate;
          overflow: hidden;
          padding: clamp(3rem, 8vw, 6rem) clamp(1.25rem, 4vw, 3rem);
          background: var(--hmc-bg);
        }

        .hmc-section::before {
          content: '';
          position: absolute;
          inset: 0;
          z-index: 0;
          background: #ffffff;
          pointer-events: none;
        }

        .hmc-section::after {
          content: '';
          position: absolute;
          inset: 0;
          z-index: 0;
          opacity: 0.55;
          background-image:
            linear-gradient(rgba(15, 23, 42, 0.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(15, 23, 42, 0.04) 1px, transparent 1px);
          background-size: 72px 72px;
          mask-image: radial-gradient(ellipse 85% 65% at 50% 35%, black 12%, transparent 78%);
          pointer-events: none;
        }

        .hmc-noise {
          position: absolute;
          inset: 0;
          z-index: 0;
          opacity: 0.018;
          pointer-events: none;
          background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        }

        .hmc-orbs {
          position: absolute;
          inset: 0;
          z-index: 0;
          pointer-events: none;
          overflow: hidden;
        }

        .hmc-orb {
          position: absolute;
          border-radius: 50%;
          filter: blur(72px);
          opacity: 0.45;
          animation: hmcOrbFloat 18s ease-in-out infinite;
        }

        .hmc-orb--a {
          width: min(420px, 60vw);
          height: min(420px, 60vw);
          background: linear-gradient(135deg, rgba(0, 138, 249, 0.22), transparent);
          top: -8%;
          right: -5%;
        }

        .hmc-orb--b {
          width: min(320px, 50vw);
          height: min(320px, 50vw);
          background: linear-gradient(200deg, rgba(0, 138, 249, 0.12), transparent);
          bottom: 5%;
          left: -8%;
          animation-delay: -6s;
        }

        @keyframes hmcOrbFloat {
          0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
          50% { transform: translate3d(-24px, 18px, 0) scale(1.06); }
        }

        .hmc-inner {
          position: relative;
          z-index: 1;
          max-width: 1200px;
          margin: 0 auto;
        }

        .hmc-kicker {
          display: inline-flex;
          align-items: center;
          gap: 0.5rem;
          font-size: clamp(0.78rem, 1.1vw, 0.88rem);
          font-weight: 600;
          letter-spacing: 0.05em;
          text-transform: none;
          color: var(--hmc-accent);
          margin-bottom: 1rem;
        }

        .hmc-kicker span {
          display: inline-block;
          width: 28px;
          height: 2px;
          background: linear-gradient(90deg, var(--hmc-accent), rgba(0, 138, 249, 0.15));
          border-radius: 2px;
          animation: hmcPulseLine 2.4s ease-in-out infinite;
        }

        @keyframes hmcPulseLine {
          0%, 100% { opacity: 0.5; transform: scaleX(0.85); }
          50% { opacity: 1; transform: scaleX(1); }
        }

        .hmc-head {
          display: grid;
          gap: 1.25rem;
          margin-bottom: clamp(2rem, 5vw, 3.5rem);
        }

        .hmc-section-visual {
          display: block;
          width: min(980px, 100%);
          height: auto;
          margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
          background: transparent;
          border: 0;
          border-radius: 0;
          box-shadow: none;
        }

        @media (max-width: 560px) {
          .hmc-section-visual {
            border-radius: 0;
          }
        }

        @media (min-width: 900px) {
          .hmc-head {
            grid-template-columns: 1fr auto;
            align-items: end;
            gap: 2rem;
          }
        }

        .hmc-title {
          font-family: var(--hmc-display);
          font-weight: 700;
          font-size: clamp(2rem, 4.5vw, 3.25rem);
          line-height: 1.08;
          letter-spacing: -0.02em;
          margin: 0;
        }

        .hmc-title em {
          font-style: normal;
          background: linear-gradient(120deg, var(--hmc-text) 0%, var(--hmc-text) 35%, var(--hmc-accent) 100%);
          -webkit-background-clip: text;
          background-clip: text;
          color: transparent;
        }

        .hmc-title em.hmc-title-tagline {
          display: block;
          margin-top: 0.4rem;
          font-size: clamp(1.05rem, 2.4vw, 1.45rem);
          font-weight: 600;
          line-height: 1.2;
        }

        .hmc-lead {
          margin: 0.75rem 0 0;
          max-width: 36rem;
          color: var(--hmc-muted);
          font-size: 1.05rem;
          line-height: 1.65;
        }

        .hmc-cta-wrap {
          display: flex;
          flex-wrap: wrap;
          gap: 0.75rem;
          justify-content: flex-start;
        }

        .hmc-btn {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          gap: 0.5rem;
          padding: 0.9rem 1.35rem;
          border-radius: 14px;
          font-weight: 600;
          font-size: 0.95rem;
          text-decoration: none;
          border: none;
          cursor: pointer;
          transition: transform 0.2s ease, box-shadow 0.25s ease, background 0.2s ease;
        }

        .hmc-btn:focus-visible {
          outline: 2px solid var(--hmc-accent);
          outline-offset: 3px;
        }

        .hmc-btn--primary {
          background: linear-gradient(135deg, var(--hmc-accent) 0%, #0078d4 100%);
          color: #fff;
          box-shadow: 0 4px 24px var(--hmc-glow);
        }

        .hmc-btn--primary:hover {
          transform: translateY(-2px);
          box-shadow: 0 8px 32px var(--hmc-glow);
        }

        .hmc-btn--ghost {
          background: #fff;
          color: var(--hmc-accent);
          border: 1px solid rgba(0, 138, 249, 0.45);
        }

        .hmc-btn--ghost:hover {
          border-color: var(--hmc-accent);
          background: var(--hmc-accent-soft);
          color: #0060c0;
        }

        .hmc-btn svg {
          width: 18px;
          height: 18px;
          flex-shrink: 0;
        }

        /* ========================================================
           ANİMASYONLU DOSYA TASARIMI (MARKA RENKLERİ VE MOBİL UYUM)
           ======================================================== */

        .hmc-folder-container {
          position: relative;
          width: 100%;
          padding: 1.5rem 0;
          z-index: 1;
        }

        .hmc-lanes-bg {
          position: absolute;
          top: 50%;
          left: 0;
          right: 0;
          transform: translateY(-50%);
          z-index: 1;
        }

        .hmc-animated-folder-wrapper {
          display: flex;
          justify-content: center;
          align-items: center;
          padding: 0;
          perspective: 1200px;
          position: relative;
          z-index: 2;
          transition: transform 0.3s ease;
        }

        .hmc-folder {
          position: relative;
          width: 240px;
          height: 150px;
          transform-style: preserve-3d;
          margin: 0 auto;
        }

        /* Klasör Arka Yüzü - Marka Mavisi Gradient */
        .hmc-folder-back {
          position: absolute;
          bottom: 0;
          width: 100%;
          height: 100%;
          background: linear-gradient(135deg, #005bb5, #003f82); /* Kurumsal koyu mavi tonu */
          border-radius: 12px 12px 10px 10px;
          box-shadow: 0 14px 28px rgba(0, 138, 249, 0.15), 0 10px 10px rgba(0, 138, 249, 0.1);
          z-index: 1;
        }

        /* Klasör Sekmesi */
        .hmc-folder-back::after {
          content: '';
          position: absolute;
          top: -14px;
          left: 14px;
          width: 70px;
          height: 20px;
          background: #005bb5;
          border-radius: 8px 8px 0 0;
        }

        /* Kağıtların Konteyneri */
        .hmc-papers {
          position: absolute;
          bottom: 15px;
          left: 50%;
          transform: translateX(-50%);
          width: 80%;
          height: 130px;
          display: flex;
          justify-content: center;
          z-index: 2;
          animation: hmcPapersRise 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
        }

        /* Genel Kağıt Stili */
        .hmc-paper {
          position: absolute;
          bottom: 0;
          width: 100px;
          height: 135px;
          background: #f8fafc;
          border-radius: 6px;
          box-shadow: 0 4px 12px rgba(0,0,0,0.06);
          border: 1px solid #e2e8f0;
          /* Çizgileri markanın hafif mavi tonuna çekildi */
          background-image: repeating-linear-gradient(
            to bottom,
            transparent,
            transparent 16px,
            rgba(0, 138, 249, 0.2) 16px,
            rgba(0, 138, 249, 0.2) 19px
          );
          background-size: 70% 100%;
          background-position: center 22px;
          background-repeat: no-repeat;
          transition: all 0.3s ease;
        }

        /* Sol Kağıt */
        .hmc-paper-left {
          transform: translateX(-35px) rotate(-6deg);
          z-index: 1;
        }

        /* Sağ Kağıt */
        .hmc-paper-right {
          transform: translateX(35px) rotate(6deg);
          z-index: 1;
        }

        /* Orta Kağıt */
        .hmc-paper-center {
          transform: translateY(-8px);
          z-index: 2;
          box-shadow: 0 6px 16px rgba(0,0,0,0.08);
          /* Orta kağıt çizgileri bir tık daha belirgin */
          background-image: repeating-linear-gradient(
            to bottom,
            transparent,
            transparent 16px,
            rgba(0, 138, 249, 0.35) 16px,
            rgba(0, 138, 249, 0.35) 19px
          );
        }

        /* Klasör Ön Yüzü - Marka Mavisi Yarı Saydam (Glassmorphism) */
        .hmc-folder-front {
          position: absolute;
          bottom: 0;
          left: -5%;
          width: 110%;
          height: 100px;
          background: rgba(0, 122, 230, 0.85); /* Canlı kurumsal mavi */
          backdrop-filter: blur(8px);
          border-radius: 10px;
          transform-origin: bottom;
          z-index: 3;
          border: 1px solid rgba(255, 255, 255, 0.3);
          box-shadow: 0 -4px 15px rgba(0, 138, 249, 0.25);
          animation: hmcFolderFlap 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
        }

        @keyframes hmcFolderFlap {
          0%, 100% { transform: rotateX(0deg); }
          50% { transform: rotateX(-45deg); }
        }

        @keyframes hmcPapersRise {
          0%, 100% { transform: translate(-50%, 0); }
          50% { transform: translate(-50%, -30px); }
        }


        /* Alt Kayar Bant (Marquee rails) */
        .hmc-track {
          display: flex;
          width: max-content;
          gap: 1.25rem;
          padding: 0.75rem clamp(1.25rem, 4vw, 3rem);
          animation-timing-function: linear;
          animation-iteration-count: infinite;
          will-change: transform; 
        }

        .hmc-track--to-right {
          transform: translate3d(-50%, 0, 0);
          animation-name: hmcMarqueeRight;
          animation-duration: 44s;
        }

        .hmc-track--to-left {
          animation-name: hmcMarqueeLeft;
          animation-duration: 50s;
        }

        @keyframes hmcMarqueeRight {
          from { transform: translate3d(-50%, 0, 0); }
          to { transform: translate3d(0, 0, 0); }
        }

        @keyframes hmcMarqueeLeft {
          from { transform: translate3d(0, 0, 0); }
          to { transform: translate3d(-50%, 0, 0); }
        }

        .hmc-mid {
          position: relative;
          margin: clamp(1.5rem, 3.5vw, 2.35rem) auto;
          max-width: min(640px, 92vw);
          z-index: 2;
        }

        .hmc-mid::before {
          content: '';
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%);
          width: 120%;
          height: 140%;
          background: radial-gradient(ellipse 70% 80% at 50% 50%, rgba(0, 138, 249, 0.06), transparent 65%);
          pointer-events: none;
          z-index: 0;
        }

        .hmc-mid-lane {
          position: relative;
          overflow: hidden;
          height: 34px;
          margin: 0 calc(-1 * clamp(1.25rem, 4vw, 3rem));
          mask-image: linear-gradient(90deg, transparent, black 12%, black 88%, transparent);
          z-index: 1;
        }

        .hmc-mid-lane--top {
          margin-bottom: clamp(0.65rem, 1.8vw, 1rem);
        }

        .hmc-mid-lane--bottom {
          margin-top: clamp(0.65rem, 1.8vw, 1rem);
        }

        .hmc-mid-track {
          display: flex;
          width: max-content;
          gap: 0.55rem;
          align-items: center;
          padding: 0 1rem;
          height: 100%;
          animation-timing-function: linear;
          animation-iteration-count: infinite;
          will-change: transform; 
        }

        .hmc-mid-track--r {
          transform: translate3d(-50%, 0, 0);
          animation-name: hmcMarqueeRight;
          animation-duration: 28s;
        }

        .hmc-mid-track--l {
          animation-name: hmcMarqueeLeft;
          animation-duration: 32s;
        }

        .hmc-mid-chip {
          flex-shrink: 0;
          display: inline-flex;
          align-items: center;
          gap: 0.35rem;
          padding: 0.32rem 0.65rem;
          border-radius: 999px;
          font-size: 0.68rem;
          font-weight: 600;
          letter-spacing: 0.04em;
          white-space: nowrap;
          border: 1px solid rgba(0, 138, 249, 0.12);
          background: rgba(255, 255, 255, 0.9);
          color: var(--hmc-muted);
          backdrop-filter: blur(10px);
          box-shadow: 0 2px 12px rgba(0, 49, 110, 0.06);
        }

        .hmc-mid-chip b {
          color: var(--hmc-text);
          font-weight: 600;
        }

        .hmc-mid-chip--accent {
          border-color: rgba(0, 138, 249, 0.35);
          background: linear-gradient(135deg, rgba(0, 138, 249, 0.14), rgba(240, 247, 255, 0.95));
          color: #0c4a6e;
        }

        .hmc-mid-hub {
          position: relative;
          margin: 1.5rem auto 0; 
          max-width: 420px;
          padding: clamp(1.15rem, 2.5vw, 1.45rem) clamp(1.2rem, 2.8vw, 1.5rem);
          border-radius: 18px;
          background: rgba(255, 255, 255, 0.95);
          border: 1px solid rgba(0, 138, 249, 0.22);
          backdrop-filter: blur(20px) saturate(160%);
          box-shadow:
            0 16px 40px rgba(0, 49, 110, 0.08),
            0 0 0 1px rgba(0, 138, 249, 0.06),
            inset 0 1px 0 #fff;
          z-index: 3;
        }

        .hmc-mid-hub-glow {
          position: absolute;
          inset: -1px;
          border-radius: inherit;
          background: linear-gradient(120deg, transparent 30%, rgba(0, 138, 249, 0.12) 50%, transparent 70%);
          background-size: 200% 100%;
          animation: hmcHubSheen 5s ease-in-out infinite;
          pointer-events: none;
          z-index: 0;
          opacity: 0.9;
        }

        @keyframes hmcHubSheen {
          0%, 100% { background-position: 100% 0; }
          50% { background-position: 0% 0; }
        }

        .hmc-mid-hub-inner {
          position: relative;
          z-index: 1;
        }

        .hmc-mid-hub-actions {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          align-items: stretch;
          gap: 0.75rem;
          padding: 0.35rem 0;
        }

        .hmc-mid-hub-actions .hmc-mid-hub-link {
          flex: 1 1 140px;
          justify-content: center;
        }

        .hmc-mid-hub-link {
          flex-shrink: 0;
          display: inline-flex;
          align-items: center;
          gap: 0.35rem;
          padding: 0.55rem 1rem;
          border-radius: 10px;
          font-size: 0.78rem;
          font-weight: 600;
          text-decoration: none;
          transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
        }

        .hmc-mid-hub-link--primary {
          color: #fff;
          background: linear-gradient(135deg, var(--hmc-accent) 0%, #0078d4 100%);
          border: 1px solid #0070c8;
          box-shadow: 0 4px 16px var(--hmc-glow);
        }

        .hmc-mid-hub-link--primary:hover {
          transform: translateY(-1px);
          box-shadow: 0 8px 24px rgba(0, 138, 249, 0.28);
        }

        .hmc-mid-hub-link--secondary {
          color: var(--hmc-accent);
          background: #fff;
          border: 2px solid var(--hmc-accent);
          box-shadow: 0 2px 10px rgba(0, 138, 249, 0.08);
        }

        .hmc-mid-hub-link--secondary:hover {
          transform: translateY(-1px);
          background: var(--hmc-accent-soft);
          color: #0060c0;
        }


        /* MOBİL VE TABLET PERFORMANS OPTİMİZASYONLARI */
        @media (max-width: 1024px) {
          .hmc-orb {
            filter: blur(32px); 
            opacity: 0.3; 
            animation-duration: 24s;
          }
          .hmc-mid-hub {
            backdrop-filter: blur(12px) saturate(140%);
            box-shadow: 0 8px 24px rgba(0, 49, 110, 0.05), 0 0 0 1px rgba(0, 138, 249, 0.06), inset 0 1px 0 #fff;
          }
        }

        @media (max-width: 768px) {
          .hmc-orb {
            filter: blur(24px);
            opacity: 0.2;
            animation: hmcOrbFloatMobile 20s ease-in-out infinite;
          }
          .hmc-mid-hub {
            backdrop-filter: blur(8px) saturate(120%);
          }
          .hmc-mid-hub-glow {
            animation-duration: 8s; 
            opacity: 0.6;
          }
          .hmc-btn--ghost {
            backdrop-filter: blur(6px);
          }
          .hmc-mid-chip {
            backdrop-filter: blur(6px);
          }
  
          /* Klasörü tablet/yatay mobilde ölçeklendir */
          .hmc-animated-folder-wrapper {
            transform: scale(0.85);
          }
        }

        @media (max-width: 480px) {
          /* Klasörü dar dikey ekranlarda daha da ölçeklendir */
          .hmc-animated-folder-wrapper {
            transform: scale(0.7);
          }
          .hmc-folder-container {
            padding: 0.5rem 0; /* Mobilde dikey boşlukları daralt */
          }
          .hmc-mid-hub {
            margin-top: 0.5rem; /* Buton alanını klasöre yaklaştır */
          }
        }

        @keyframes hmcOrbFloatMobile {
          0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
          50% { transform: translate3d(-10px, 8px, 0) scale(1.02); } 
        }

        /* ERİŞİLEBİLİRLİK VE REDUCED MOTION */
        @media (prefers-reduced-motion: reduce) {
          * {
            animation-duration: 0.001ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.001ms !important;
            scroll-behavior: auto !important;
          }
          .hmc-track--to-right,
          .hmc-track--to-left {
            animation: none;
            transform: none;
            flex-wrap: wrap;
            justify-content: center;
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
          }
          .hmc-track .hmc-duplicate { display: none; }
          .hmc-orb, .hmc-kicker span { animation: none; }
          .hmc-mid-track--r,
          .hmc-mid-track--l {
            animation: none !important;
            transform: none !important;
            flex-wrap: wrap;
            width: 100%;
            max-width: 100%;
            height: auto;
            min-height: 34px;
          }
          .hmc-mid-track--r { justify-content: center; }
          .hmc-mid-track--l { justify-content: flex-start; }
          .hmc-mid-track--r .hmc-mid-dup,
          .hmc-mid-track--l .hmc-mid-dup { display: none; }
          .hmc-mid-hub-glow { animation: none !important; }
        }
        /* Entegre bölüm — phi-section içinde */
        #dosya-merkezi .hmc-section {
          padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 2.5vw, 1.5rem);
          border-radius: var(--hmc-radius);
        }

        /* === Hesaplama Merkezi === */
        /* Hesaplama Merkezi Hub */
        :root {
                --hm-accent: #008af9;
                --hm-accent-dark: #0070c9;
                --hm-accent-soft: rgba(0, 138, 249, 0.14);
                --hm-accent-glow: rgba(0, 138, 249, 0.22);
                --hm-petrol: #050a14;
                --hm-page-bg: #ffffff;
                --hm-page-tint: #ffffff;
                --hm-card-radius: 24px;
                --hm-exit-ms: 600ms; /* Desktop varsayılan animasyon süresi */
            }

            * { box-sizing: border-box; }

            /* ——— Taşınabilir bölüm ——— */
            #gp-hesap-hub {
                --hm-card-w: min(100%, 420px);
                --hm-stack-pad-top: 3rem;
                padding: clamp(2.5rem, 6vw, 4rem) 1.25rem 3rem;
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 1.5rem;
            }

            #gp-hesap-hub .hm-wrap {
                width: 100%;
                max-width: min(980px, 100%);
                text-align: center;
            }

            #gp-hesap-hub .hm-eyebrow {
                margin: 0 0 0.4rem;
                font-size: 0.65rem;
                font-weight: 700;
                letter-spacing: 0.28em;
                text-transform: uppercase;
                color: #64748b;
            }

            #gp-hesap-hub .hm-title {
                margin: 0 0 0.5rem;
                font-size: clamp(1.5rem, 4.2vw, 1.85rem);
                font-weight: 800;
                letter-spacing: -0.04em;
                color: var(--hm-petrol);
            }

            #gp-hesap-hub .hm-title .hm-accent-text {
                color: var(--hm-accent);
            }

            #gp-hesap-hub .hm-sub {
                margin: 0 auto;
                max-width: 42rem;
                font-size: 0.875rem;
                line-height: 1.6;
                color: #475569;
            }

            #gp-hesap-hub .hm-stage {
                width: 100%;
                max-width: calc(var(--hm-card-w) + 24px);
                padding: var(--hm-stack-pad-top) 0 0.25rem;
                display: flex;
                flex-direction: column;
                align-items: center;
            }

            #gp-hesap-hub .hm-section-visual {
                display: block;
                width: min(980px, 100%);
                height: auto;
                margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
                background: transparent;
                border: 0;
                border-radius: 0;
                box-shadow: none;
            }

            #gp-hesap-hub .hm-stack {
                position: relative;
                width: var(--hm-card-w);
                height: clamp(320px, 86vw, 372px);
                perspective: 1400px;
            }

            #gp-hesap-hub .hm-card {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                border-radius: var(--hm-card-radius);
                overflow: hidden;
                background: #fff;
                border: 1px solid rgba(0, 138, 249, 0.14);
                box-shadow:
                    0 1px 0 rgba(255, 255, 255, 0.95) inset,
                    0 20px 44px rgba(5, 10, 20, 0.07),
                    0 6px 20px var(--hm-accent-glow);
                transform-origin: 50% 0%;
                transition:
                    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                    opacity 0.55s ease,
                    box-shadow 0.45s ease,
                    border-color 0.25s ease;
                cursor: pointer;
                text-decoration: none;
                color: inherit;
                display: flex;
                flex-direction: column;
                outline: none;
                will-change: transform, opacity; /* GPU İvmelenmesi */
            }

            #gp-hesap-hub .hm-card:hover {
                border-color: rgba(0, 138, 249, 0.28);
                box-shadow:
                    0 1px 0 rgba(255, 255, 255, 0.95) inset,
                    0 24px 52px rgba(5, 10, 20, 0.09),
                    0 10px 28px rgba(0, 138, 249, 0.18);
            }

            #gp-hesap-hub .hm-card:focus-visible {
                box-shadow:
                    0 0 0 2px #fff,
                    0 0 0 4px var(--hm-accent),
                    0 24px 48px rgba(0, 138, 249, 0.12);
            }

            /* GPU DOSTU ANİMASYON: translate3d eklendi */
            #gp-hesap-hub .hm-card--d0 {
                z-index: 40;
                transform: translate3d(0, 0, 0) scale(1);
                opacity: 1;
            }
            #gp-hesap-hub .hm-card--d1 {
                z-index: 30;
                transform: translate3d(0, -18px, 0) scale(0.965);
                opacity: 1;
            }
            #gp-hesap-hub .hm-card--d2 {
                z-index: 20;
                transform: translate3d(0, -34px, 0) scale(0.93);
                opacity: 1;
            }
            #gp-hesap-hub .hm-card--d3 {
                z-index: 10;
                transform: translate3d(0, -48px, 0) scale(0.895);
                opacity: 1;
            }

            #gp-hesap-hub .hm-card--exit {
                z-index: 50 !important;
                pointer-events: none;
                animation: hm-fall var(--hm-exit-ms) cubic-bezier(0.45, 0, 0.2, 1) forwards;
            }

            @keyframes hm-fall {
                to {
                    transform: translate3d(0, 115%, 0) scale(0.96);
                    opacity: 0;
                }
            }

            /* Hero ~%58–62 yükseklik */
            #gp-hesap-hub .hm-card-hero {
                position: relative;
                flex: 1.22;
                min-height: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 1.25rem 1.5rem;
                overflow: hidden;
            }

            #gp-hesap-hub .hm-card-hero::before {
                content: "";
                position: absolute;
                inset: 0;
                background: var(--hm-grad);
                z-index: 0;
            }

            /* Grain */
            #gp-hesap-hub .hm-card-hero::after {
                content: "";
                position: absolute;
                inset: 0;
                z-index: 1;
                pointer-events: none;
                opacity: 0.35;
                mix-blend-mode: overlay;
                background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.65'/%3E%3C/svg%3E");
            }

            /* Hero: kısa program açıklaması */
            #gp-hesap-hub .hm-hero-inner {
                position: relative;
                z-index: 2;
                width: 100%;
                max-width: 20rem;
                margin: 0 auto;
                padding: 0.35rem 1rem 0.75rem;
                text-align: center;
            }

            #gp-hesap-hub .hm-hero-rule {
                display: block;
                width: 2.75rem;
                height: 2px;
                margin: 0 auto 0.85rem;
                border-radius: 2px;
                background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.75), transparent);
                opacity: 0.9;
            }

            #gp-hesap-hub .hm-hero-tagline {
                margin: 0;
                font-family: Inter, system-ui, sans-serif;
                font-weight: 500;
                font-size: clamp(0.8rem, 2.75vw, 0.98rem);
                line-height: 1.5;
                letter-spacing: 0.01em;
                color: rgba(248, 250, 252, 0.95);
                text-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);
            }

            #gp-hesap-hub .hm-hero-tagline strong {
                font-weight: 700;
                color: #fff;
            }

            /* Alt panel: sol metinler, sağ hap (flex) */
            #gp-hesap-hub .hm-card-body {
                position: relative;
                flex: 0 0 auto;
                display: flex;
                flex-direction: row;
                align-items: flex-end;
                justify-content: space-between;
                gap: 1rem;
                padding: 1.25rem 1.35rem 1.35rem;
                background: #fff;
                border-top: 1px solid rgba(0, 138, 249, 0.1);
            }

            #gp-hesap-hub .hm-card-copy {
                min-width: 0;
                text-align: left;
            }

            #gp-hesap-hub .hm-card-kicker {
                margin: 0 0 0.2rem;
                font-size: 0.9rem;
                font-weight: 800;
                letter-spacing: 0.04em;
                text-transform: none;
                color: var(--hm-petrol);
                line-height: 1.15;
            }

            #gp-hesap-hub .hm-card-sub {
                margin: 0;
                font-size: 0.62rem;
                font-weight: 600;
                letter-spacing: 0.12em;
                text-transform: uppercase;
                color: #64748b;
                line-height: 1.45;
                max-width: 15rem;
            }

            #gp-hesap-hub .hm-card-sub .hm-cat {
                color: var(--hm-accent-dark);
                font-weight: 700;
            }

            #gp-hesap-hub .hm-pill {
                flex-shrink: 0;
                display: inline-flex;
                align-items: center;
                gap: 0.4rem;
                padding: 0.5rem 1.15rem;
                border-radius: 999px;
                background: var(--hm-accent);
                color: #fff;
                font-size: 0.8rem;
                font-weight: 600;
                letter-spacing: 0.02em;
                transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
            }

            #gp-hesap-hub .hm-card:hover .hm-pill {
                background: var(--hm-accent-dark);
                box-shadow: 0 6px 22px rgba(0, 138, 249, 0.35);
                transform: translate3d(0, -1px, 0); /* GPU */
            }

            #gp-hesap-hub .hm-pill svg {
                width: 0.85rem;
                height: 0.85rem;
                opacity: 0.9;
            }

            #gp-hesap-hub .hm-actions {
                display: flex;
                flex-wrap: wrap;
                align-items: center;
                justify-content: center;
                gap: 0.75rem;
                margin-top: 1.35rem;
            }

            #gp-hesap-hub .hm-btn-animate {
                appearance: none;
                font-family: inherit;
                font-size: 0.875rem;
                font-weight: 600;
                color: var(--hm-petrol);
                background: #fff;
                border: 1px solid rgba(0, 138, 249, 0.28);
                border-radius: 12px;
                padding: 0.65rem 1.5rem;
                cursor: pointer;
                transition: background 0.2s, border-color 0.2s, color 0.2s, transform 0.15s;
            }

            #gp-hesap-hub .hm-btn-animate:hover {
                background: rgba(0, 138, 249, 0.06);
                border-color: var(--hm-accent);
                color: var(--hm-accent-dark);
            }

            #gp-hesap-hub .hm-btn-animate:active {
                transform: scale(0.98);
            }

            #gp-hesap-hub .hm-btn-primary {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 0.65rem 1.35rem;
                border-radius: 12px;
                font-size: 0.85rem;
                font-weight: 700;
                color: #fff;
                background: var(--hm-accent);
                text-decoration: none;
                transition: background 0.2s, transform 0.15s;
            }

            #gp-hesap-hub .hm-btn-primary:hover {
                background: var(--hm-accent-dark);
            }

            #gp-hesap-hub .hm-btn-primary:focus-visible {
                outline: 2px solid var(--hm-accent);
                outline-offset: 3px;
            }

            #gp-hesap-hub .hm-btn-animate:focus-visible {
                outline: 2px solid var(--hm-accent);
                outline-offset: 2px;
            }

            #gp-hesap-hub .hm-note {
                margin: 0;
                font-size: 0.7rem;
                color: #94a3b8;
                text-align: center;
                max-width: 26rem;
            }

            #gp-hesap-hub .hm-rm-hint {
                display: none;
                font-size: 0.75rem;
                color: #64748b;
                text-align: center;
            }

            /* ========================================================
               MOBİL VE TABLET PERFORMANS OPTİMİZASYONLARI
               ======================================================== */

            @media (max-width: 1024px) {
                #gp-hesap-hub .hm-card {
                    /* Tabletlerde ağır gölgeler hafifletildi */
                    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset, 0 14px 32px rgba(5, 10, 20, 0.05), 0 4px 14px var(--hm-accent-glow);
                }
            }

            @media (max-width: 768px) {
                :root {
                    --hm-exit-ms: 420ms; /* Mobilde kart geçişi donanım dostu olarak hızlandırıldı */
                }
                #gp-hesap-hub .hm-card {
                    /* Mobilde en az donanım tüketen hafif gölgelendirme */
                    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 8px 24px rgba(5, 10, 20, 0.04);
                }
                #gp-hesap-hub .hm-card:hover {
                    /* Mobilde gereksiz dev hover gölgeleri iptal */
                    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 10px 28px rgba(5, 10, 20, 0.05);
                }
                #gp-hesap-hub .hm-card-hero::after {
                    /* Render maliyeti devasa olan mix-blend-mode kaldırıldı, yerine düşük opacity verildi */
                    mix-blend-mode: normal;
                    opacity: 0.12; 
                }
            }

            /* ERİŞİLEBİLİRLİK (A11Y) VE REDUCED MOTION */
            @media (prefers-reduced-motion: reduce) {
                * {
                    animation-duration: 0.001ms !important;
                    animation-iteration-count: 1 !important;
                    transition-duration: 0.001ms !important;
                    scroll-behavior: auto !important;
                }
                #gp-hesap-hub .hm-card {
                    transition: none;
                }
                #gp-hesap-hub .hm-card--exit {
                    animation: none;
                    opacity: 1;
                    transform: translate3d(0, 0, 0) scale(1);
                }
                #gp-hesap-hub .hm-rm-hint {
                    display: block;
                }
            }
        /* Entegre bölüm */
        #hesap-merkezi #gp-hesap-hub {
          --hm-page-bg: #ffffff;
          --hm-page-tint: #ffffff;
          background: #ffffff;
          padding: clamp(1.5rem, 4vw, 2.5rem) 0;
          border-radius: var(--hm-card-radius, 24px);
        }


        /* === Gayrimenkul Skorlari === */
        #gayrimenkul-skorlari {
          background-color: #ffffff;
        }
        html.gs-skor-modal-open,
        html.gs-skor-modal-open body {
          overflow: hidden;
        }

    #gp-skor-hub.gs-skor {
      --gs-ink: #0a1628;
      --gs-brand: #008af9;
      --gs-brand-light: #40a9ff;
      --gs-brand-dark: #0060b5;
      --gs-brand-soft: rgba(0, 138, 249, 0.1);
      --gs-brand-glow: rgba(0, 138, 249, 0.32);
      --gs-line: rgba(0, 138, 249, 0.14);
      --gs-gold: #d6a54c;
      --gs-green: #10b981;
      --gs-radius: 22px;
      --gs-ease: cubic-bezier(0.22, 1, 0.36, 1);
      --gs-ui-font: "DM Sans", "Inter", sans-serif;
      --gs-num-font: "Space Grotesk", "DM Sans", sans-serif;
      position: relative;
      max-width: 1180px;
      margin: 0 auto;
      padding: clamp(40px, 7vw, 72px) clamp(16px, 4vw, 28px) clamp(48px, 8vw, 80px);
      color: var(--gs-ink);
      font-family: var(--gs-ui-font);
      background: #fff;
      overflow: hidden;
      -webkit-tap-highlight-color: transparent;
    }

    #gp-skor-hub.gs-skor::before {
      content: none;
    }

    #gp-skor-hub.gs-skor > * { position: relative; z-index: 1; }

    /* ── Header ── */
    #gp-skor-hub .gs-skor__header {
      text-align: center;
      max-width: 640px;
      margin: 0 auto 40px;
      background: #fff;
    }

    #gp-skor-hub .gs-skor__badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 16px;
      border-radius: 999px;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gs-brand);
      background: var(--gs-brand-soft);
      border: 1px solid rgba(0, 138, 249, 0.18);
    }

    #gp-skor-hub .gs-skor__badge-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--gs-brand);
      box-shadow: 0 0 0 0 var(--gs-brand-glow);
      animation: gs-pulse 2.4s ease-out infinite;
    }

    @keyframes gs-pulse {
      0% { box-shadow: 0 0 0 0 var(--gs-brand-glow); }
      70% { box-shadow: 0 0 0 9px rgba(0, 138, 249, 0); }
      100% { box-shadow: 0 0 0 0 rgba(0, 138, 249, 0); }
    }

    #gp-skor-hub .gs-skor__title {
      margin: 20px 0 0;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: clamp(2rem, 5.5vw, 3rem);
      font-weight: 400;
      line-height: 1.08;
      letter-spacing: -0.03em;
    }

    #gp-skor-hub .gs-skor__title-accent {
      background: linear-gradient(120deg, var(--gs-brand) 0%, var(--gs-brand-light) 55%, #7cc3fb 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    #gp-skor-hub .gs-skor__lead {
      margin: 14px auto 0;
      max-width: 520px;
      font-size: clamp(0.9rem, 2.2vw, 1.02rem);
      font-weight: 500;
      line-height: 1.65;
      color: var(--gs-muted);
    }

    /* ── Arena ── */
    #gp-skor-hub .gs-skor__arena {
      display: grid;
      grid-template-columns: 1fr;
      gap: 32px;
      align-items: center;
    }

    @media (min-width: 900px) {
      #gp-skor-hub .gs-skor__arena {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 32px 48px;
        align-items: center;
      }
    }

    #gp-skor-hub .gs-skor__visual-col {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0;
    }

    #gp-skor-hub .gs-skor__visual-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      background: #fff;
    }

    #gp-skor-hub .gs-skor__visual-img {
      display: block;
      width: 100%;
      max-width: min(440px, 100%);
      height: auto;
      background: #fff;
    }

    @media (min-width: 900px) {
      #gp-skor-hub .gs-skor__visual-col {
        align-items: stretch;
      }

      #gp-skor-hub .gs-skor__visual-img {
        max-width: 100%;
      }
    }

    #gp-skor-hub .gs-skor__panel {
      display: flex;
      flex-direction: column;
      gap: 18px;
    }

    #gp-skor-hub .gs-skor__instrument {
      position: relative;
      padding: 28px 28px 24px;
      border-radius: 24px;
      background: #fff;
      border: 1px solid var(--gs-line);
      box-shadow: 0 24px 56px -28px rgba(0, 46, 94, 0.14);
      overflow: hidden;
    }

    #gp-skor-hub .gs-skor__instrument::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(0, 138, 249, 0.35), transparent);
    }

    #gp-skor-hub .gs-skor__instrument-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 20px;
    }

    #gp-skor-hub .gs-skor__instrument-meta {
      font-size: 0.8125rem;
      font-weight: 600;
      letter-spacing: 0.04em;
      color: var(--gs-muted);
      font-variant-numeric: tabular-nums;
    }

    #gp-skor-hub .gs-skor__instrument-meta strong {
      color: var(--gs-ink);
      font-weight: 700;
    }

    #gp-skor-hub .gs-skor__instrument-live {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 0.6875rem;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--gs-brand-dark);
    }

    #gp-skor-hub .gs-skor__instrument-live::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--gs-brand);
      box-shadow: 0 0 0 0 rgba(0, 138, 249, 0.4);
      animation: gs-pulse 2.4s ease-out infinite;
    }

    #gp-skor-hub .gs-skor__instrument-title {
      margin: 0 0 22px;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: clamp(1.35rem, 3.2vw, 1.65rem);
      font-weight: 400;
      line-height: 1.28;
      letter-spacing: -0.02em;
      color: var(--gs-ink);
      transition: opacity 0.4s var(--gs-ease), transform 0.4s var(--gs-ease);
    }

    #gp-skor-hub .gs-skor__instrument-title.is-changing {
      opacity: 0;
      transform: translateY(8px);
    }

    #gp-skor-hub .gs-skor__instrument-score {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 18px;
      padding-bottom: 20px;
      border-bottom: 1px solid rgba(0, 138, 249, 0.1);
    }

    #gp-skor-hub .gs-skor__score-primary {
      display: flex;
      align-items: baseline;
      gap: 4px;
      line-height: 1;
      min-width: 0;
    }

    #gp-skor-hub .gs-skor__score-num {
      font-family: var(--gs-num-font);
      font-size: clamp(3rem, 7.2vw, 3.6rem);
      font-weight: 800;
      letter-spacing: 0;
      font-variant-numeric: tabular-nums;
      color: var(--gs-ink);
      transition: opacity 0.35s ease, transform 0.4s var(--gs-ease);
    }

    #gp-skor-hub .gs-skor__score-num.is-changing {
      opacity: 0;
      transform: translateY(6px);
    }

    #gp-skor-hub .gs-skor__score-unit {
      font-size: 1.125rem;
      font-weight: 600;
      color: var(--gs-muted);
      margin-left: 2px;
    }

    #gp-skor-hub .gs-skor__score-side {
      text-align: right;
      flex-shrink: 0;
      min-width: 92px;
      padding: 7px 10px 8px;
      border: 1px solid rgba(0, 138, 249, 0.13);
      border-radius: 14px;
      background: linear-gradient(180deg, rgba(0, 138, 249, 0.055), rgba(255, 255, 255, 0.86));
    }

    #gp-skor-hub .gs-skor__score-grade {
      display: block;
      font-family: var(--gs-num-font);
      font-size: 1.02rem;
      font-weight: 800;
      letter-spacing: 0;
      color: var(--gs-brand-dark);
      transition: transform 0.4s var(--gs-ease), opacity 0.35s ease;
    }

    #gp-skor-hub .gs-skor__score-grade.is-pop {
      animation: gs-grade-pop 0.55s var(--gs-ease);
    }

    #gp-skor-hub .gs-skor__score-tier {
      display: block;
      margin-top: 2px;
      font-size: 0.75rem;
      font-weight: 600;
      color: var(--gs-muted);
    }

    @keyframes gs-grade-pop {
      0% { transform: scale(0.88); opacity: 0.5; }
      60% { transform: scale(1.04); }
      100% { transform: scale(1); opacity: 1; }
    }

    #gp-skor-hub .gs-skor__instrument-desc {
      margin: 0 0 20px;
      font-size: 0.9375rem;
      line-height: 1.65;
      color: var(--gs-muted);
      font-weight: 500;
      transition: opacity 0.4s var(--gs-ease);
    }

    #gp-skor-hub .gs-skor__instrument-desc.is-changing { opacity: 0; }

    #gp-skor-hub .gs-skor__progress {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    #gp-skor-hub .gs-skor__progress-labels {
      display: flex;
      justify-content: space-between;
      font-size: 0.75rem;
      font-weight: 600;
      color: var(--gs-muted);
      font-variant-numeric: tabular-nums;
    }

    #gp-skor-hub .gs-skor__progress-labels span:last-child {
      color: var(--gs-brand-dark);
    }

    #gp-skor-hub .gs-skor__gauge-bar {
      height: 6px;
      border-radius: 999px;
      background: rgba(0, 138, 249, 0.08);
      overflow: hidden;
    }

    #gp-skor-hub .gs-skor__gauge-fill {
      display: block;
      height: 100%;
      width: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, var(--gs-brand-dark), var(--gs-brand), var(--gs-brand-light));
      transform-origin: left center;
      transform: scaleX(var(--gs-bar-scale, 0));
      transition: transform 1s var(--gs-ease);
    }

    #gp-skor-hub .gs-skor__metrics {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      width: min(100%, 440px);
      margin-inline: auto;
    }

    #gp-skor-hub .gs-skor__metric {
      min-height: 58px;
      padding: 12px 10px;
      border-radius: 16px;
      text-align: center;
      background: rgba(255, 255, 255, 0.85);
      border: 1px solid var(--gs-line);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    #gp-skor-hub .gs-skor__metric-val {
      display: block;
      font-family: var(--gs-num-font);
      font-size: 1.14rem;
      font-weight: 800;
      color: var(--gs-brand);
      line-height: 1;
      letter-spacing: 0;
    }

    #gp-skor-hub .gs-skor__metric-lbl {
      display: block;
      margin-top: 4px;
      font-size: 0.68rem;
      font-weight: 600;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--gs-muted);
    }

    /* ── Score stream ── */
    #gp-skor-hub .gs-skor__stream {
      position: relative;
      height: 168px;
      overflow: hidden;
      border-radius: var(--gs-radius);
      border: 1px solid var(--gs-line);
      background: rgba(248, 251, 254, 0.8);
      -webkit-mask-image: linear-gradient(180deg, transparent, #000 12%, #000 88%, transparent);
      mask-image: linear-gradient(180deg, transparent, #000 12%, #000 88%, transparent);
    }

    #gp-skor-hub .gs-skor__stream-track {
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding: 8px 12px;
      animation: gs-stream 36s linear infinite;
    }

    #gp-skor-hub .gs-skor__stream:hover .gs-skor__stream-track {
      animation-play-state: paused;
    }

    @keyframes gs-stream {
      0% { transform: translateY(0); }
      100% { transform: translateY(-50%); }
    }

    #gp-skor-hub .gs-skor__stream-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 14px;
      border-radius: 14px;
      background: #fff;
      border: 1px solid rgba(0, 138, 249, 0.1);
      font-size: 0.8125rem;
      font-weight: 600;
      color: var(--gs-ink);
      text-decoration: none;
      transition: border-color 0.25s ease, box-shadow 0.25s ease;
    }

    #gp-skor-hub .gs-skor__stream-item:hover {
      border-color: rgba(0, 138, 249, 0.28);
      box-shadow: 0 8px 20px -10px rgba(0, 138, 249, 0.2);
    }

    #gp-skor-hub .gs-skor__stream-icon {
      flex-shrink: 0;
      width: 32px;
      height: 32px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--gs-brand-soft);
      color: var(--gs-brand);
    }

    #gp-skor-hub .gs-skor__stream-icon svg { width: 16px; height: 16px; }

    #gp-skor-hub .gs-skor__stream-grade {
      margin-left: auto;
      font-size: 0.8125rem;
      font-weight: 600;
      font-variant-numeric: tabular-nums;
      color: var(--gs-muted);
      letter-spacing: 0.02em;
    }

    /* ── CTA ── */
    #gp-skor-hub .gs-skor__cta-wrap {
      margin-top: 36px;
      text-align: center;
    }

    #gp-skor-hub .gs-skor__cta {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 15px 28px 15px 24px;
      border: none;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--gs-brand) 0%, var(--gs-brand-light) 100%);
      color: #fff;
      font-family: inherit;
      font-size: 1rem;
      font-weight: 700;
      cursor: pointer;
      box-shadow: 0 14px 36px -10px rgba(0, 138, 249, 0.45);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    #gp-skor-hub .gs-skor__cta:hover,
    #gp-skor-hub .gs-skor__cta:focus-visible {
      transform: translateY(-2px);
      box-shadow: 0 22px 48px -10px rgba(0, 138, 249, 0.55);
      outline: none;
    }

    #gp-skor-hub .gs-skor__cta-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.22);
    }

    #gp-skor-hub .gs-skor__cta-icon svg { width: 16px; height: 16px; }

    /* ── Modal (body portaled — değişkenler burada tanımlı) ── */
    #gs-skor-modal {
      --gs-ink: #0a1628;
      --gs-muted: #6b8299;
      --gs-brand: #008af9;
      --gs-brand-soft: rgba(0, 138, 249, 0.1);
      --gs-line: rgba(0, 138, 249, 0.14);
      --gs-ease: cubic-bezier(0.22, 1, 0.36, 1);
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
      box-sizing: border-box;
      background: rgba(8, 16, 28, 0.65);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    #gs-skor-modal.is-open { display: flex; }

    #gs-skor-modal .gs-modal-container {
      width: 100%;
      max-width: 960px;
      max-height: min(88dvh, calc(100dvh - 24px));
      display: flex;
      flex-direction: column;
      overflow: hidden;
      min-height: 0;
      border-radius: 28px;
      background: #fff;
      box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3);
    }

    #gs-skor-modal .gs-modal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 24px 28px;
      border-bottom: 1px solid var(--gs-line);
      background: #fcfdfe;
      flex-shrink: 0;
      flex-wrap: wrap;
    }

    #gs-skor-modal .gs-modal-header h3 {
      margin: 0;
      font-family: "Syne", sans-serif;
      font-size: 1.35rem;
      font-weight: 700;
    }

    #gs-skor-modal .gs-modal-count {
      font-family: "DM Sans", sans-serif;
      font-size: 0.78rem;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 8px;
      background: var(--gs-brand-soft);
      color: var(--gs-brand);
      margin-left: 8px;
    }

    #gs-skor-modal .gs-modal-search-wrap {
      position: relative;
      flex: 1;
      min-width: 180px;
      max-width: 280px;
    }

    #gs-skor-modal .gs-modal-search {
      width: 100%;
      padding: 10px 14px 10px 38px;
      border-radius: 12px;
      border: 1px solid var(--gs-line);
      font-family: inherit;
      font-size: 0.875rem;
      color: var(--gs-ink);
      background: #fff;
      transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }

    #gs-skor-modal .gs-modal-search:focus {
      outline: none;
      border-color: rgba(0, 138, 249, 0.4);
      box-shadow: 0 0 0 3px rgba(0, 138, 249, 0.12);
    }

    #gs-skor-modal .gs-modal-search-icon {
      position: absolute;
      left: 12px;
      top: 50%;
      transform: translateY(-50%);
      color: var(--gs-muted);
      pointer-events: none;
    }

    #gs-skor-modal .gs-modal-search-icon svg { width: 16px; height: 16px; }

    #gs-skor-modal .gs-modal-close {
      width: 44px;
      height: 44px;
      border: none;
      border-radius: 50%;
      background: #f0f4f8;
      color: var(--gs-muted);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: background 0.2s ease, color 0.2s ease;
    }

    #gs-skor-modal .gs-modal-close:hover {
      background: #ffe5e5;
      color: #ef4444;
    }

    #gs-skor-modal .gs-modal-body {
      padding: 20px 24px 28px;
      overflow-y: auto;
      background: #fafbfc;
      flex: 1 1 auto;
      min-height: 0;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
    }

    #gs-skor-modal .gs-modal-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 14px;
    }

    #gs-skor-modal .gs-modal-card {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      padding: 18px;
      border-radius: 18px;
      background: #fff;
      border: 1px solid var(--gs-line);
      text-decoration: none;
      color: inherit;
      transition: transform 0.25s var(--gs-ease), border-color 0.25s ease, box-shadow 0.25s ease;
      opacity: 1;
      transform: translateY(0);
    }

    #gs-skor-modal .gs-modal-card:hover {
      transform: translateY(-4px);
      border-color: rgba(0, 138, 249, 0.3);
      box-shadow: 0 16px 36px -14px rgba(0, 138, 249, 0.18);
    }

    #gs-skor-modal .gs-modal-card-icon {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 13px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--gs-brand-soft);
      color: var(--gs-brand);
      transition: background 0.25s ease, color 0.25s ease;
    }

    #gs-skor-modal .gs-modal-card:hover .gs-modal-card-icon {
      background: var(--gs-brand);
      color: #fff;
    }

    #gs-skor-modal .gs-modal-card-icon svg { width: 20px; height: 20px; }

    #gs-skor-modal .gs-modal-card-body { min-width: 0; }

    #gs-skor-modal .gs-modal-card-title {
      margin: 0;
      font-size: 0.9375rem;
      font-weight: 700;
      line-height: 1.35;
      letter-spacing: -0.02em;
    }

    #gs-skor-modal .gs-modal-card-desc {
      margin: 4px 0 0;
      font-size: 0.78rem;
      line-height: 1.5;
      color: var(--gs-muted);
    }

    #gs-skor-modal .gs-modal-empty {
      grid-column: 1 / -1;
      text-align: center;
      padding: 48px 20px;
      color: var(--gs-muted);
    }

    @media (max-width: 720px) {
      #gp-skor-hub .gs-skor__instrument { padding: 22px 20px 20px; }
      #gp-skor-hub .gs-skor__instrument-score {
        gap: 12px;
        align-items: center;
      }
      #gp-skor-hub .gs-skor__score-num { font-size: clamp(2.65rem, 11vw, 3.15rem); }
      #gp-skor-hub .gs-skor__score-unit { font-size: 0.95rem; }
      #gp-skor-hub .gs-skor__score-side {
        min-width: 84px;
        padding: 7px 9px;
      }
      #gp-skor-hub .gs-skor__score-grade { font-size: 0.95rem; }
      #gp-skor-hub .gs-skor__metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: min(100%, 400px);
        gap: 8px;
      }
      #gp-skor-hub .gs-skor__metric {
        min-height: 52px;
        padding: 10px 8px;
      }
      #gp-skor-hub .gs-skor__metric-val { font-size: 1rem; }
      #gp-skor-hub .gs-skor__metric-lbl { font-size: 0.62rem; }
      #gp-skor-hub .gs-skor__stream { height: 140px; }
      #gs-skor-modal { backdrop-filter: none; -webkit-backdrop-filter: none; }
      #gs-skor-modal .gs-modal-header { padding: 20px 18px; }
      #gs-skor-modal .gs-modal-search-wrap { max-width: 100%; order: 3; flex-basis: 100%; }
    }

    @media (prefers-reduced-motion: reduce) {
      #gp-skor-hub .gs-skor__stream-track,
      #gp-skor-hub .gs-skor__badge-dot {
        animation: none !important;
      }
    }
        /* === Istatistik Carklari === */
        /* Istatistik Carklari / Hayal Haritasi */
        #gp-cark-hub {
                --slot-unit-height: 360px;
                --panel-min-h: 600px;
                --safe-top: env(safe-area-inset-top, 0px);
                --safe-bottom: env(safe-area-inset-bottom, 0px);
                --safe-x: env(safe-area-inset-left, 0px) env(safe-area-inset-right, 0px);
            }
            @media (max-width: 1023px) {
                #gp-cark-hub {
                    --slot-unit-height: 200px;
                    --panel-min-h: min(520px, 70vh);
                }
            }


            #gp-cark-hub .ih-bg-mesh,
            #gp-cark-hub .ih-bg-grid {
                display: none;
            }

            #gp-cark-hub .section-visual {
                display: block;
                width: min(980px, 100%);
                height: auto;
                margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
                background: transparent;
                border: 0;
                border-radius: 0;
                box-shadow: none;
                pointer-events: none;
                user-select: none;
            }

            @media (max-width: 640px) {
                #gp-cark-hub .section-visual {
                    margin-bottom: 0.85rem;
                }
            }

            #gp-cark-hub .engine-container {
                position: relative; width: min(92vw, 480px); height: min(92vw, 480px);
                max-width: 480px; max-height: 480px;
                display: flex; align-items: center; justify-content: center;
            }

            #gp-cark-hub .outer-glow {
                position: absolute; inset: -50px;
                background: radial-gradient(circle, rgba(0, 138, 249, 0.22) 0%, transparent 70%);
                border-radius: 50%; z-index: 0;
            }

            #gp-cark-hub .ring-1 { position: absolute; inset: 0; border: 2px solid rgba(0, 138, 249, 0.18); border-radius: 50%; border-top: 2px solid #008af9; }
            #gp-cark-hub .ring-2 { position: absolute; inset: 20px; border: 1px dashed rgba(0, 138, 249, 0.22); border-radius: 50%; }
            #gp-cark-hub .ring-3 {
                position: absolute; inset: 40px; border-radius: 50%;
                background: conic-gradient(from 0deg, transparent, rgba(0, 138, 249, 0.28), transparent);
            }

            #gp-cark-hub .core-glass {
                position: absolute; inset: 60px; border-radius: 50%;
                background: rgba(255, 255, 255, 0.92);
                backdrop-filter: blur(24px);
                border: 1px solid rgba(0, 138, 249, 0.2);
                box-shadow: inset 0 0 40px rgba(0, 138, 249, 0.08), 0 24px 48px rgba(0, 91, 181, 0.12);
                z-index: 10; overflow: hidden;
                display: flex; align-items: center; justify-content: center;
            }

            #gp-cark-hub .slot-viewport { height: 100%; width: 100%; position: relative; }
            #gp-cark-hub .slot-track { display: flex; flex-direction: column; transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1); will-change: transform; }
            #gp-cark-hub .slot-unit {
                height: var(--slot-unit-height); width: 100%; flex-shrink: 0;
                display: flex; flex-direction: column; align-items: center; justify-content: center;
                padding: clamp(0.75rem, 3vw, 2rem); text-align: center;
                box-sizing: border-box;
            }

            /* SADECE MOBİL: slot içeriklerini taşmasız tut (masaüstüne dokunmaz) */
            @media (max-width: 1023px) {
                #gp-cark-hub .slot-unit {
                    overflow: hidden;
                    padding: 0.6rem 0.85rem;
                    justify-content: center;
                }

                #gp-cark-hub .slot-unit [data-slot-icon] {
                    width: 3.85rem;
                    height: 3.85rem;
                    border-radius: 1.35rem;
                    font-size: 1.75rem;
                    margin-bottom: 0.45rem !important;
                }

                #gp-cark-hub .slot-unit [data-slot-title] {
                    font-size: clamp(0.98rem, 4.1vw, 1.22rem) !important;
                    line-height: 1.12 !important;
                    max-width: min(24ch, 92%);
                    margin: 0 0 0.25rem !important;
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 2;
                    word-break: break-word;
                }

                #gp-cark-hub .slot-unit [data-slot-desc] {
                    font-size: clamp(0.72rem, 3.2vw, 0.9rem) !important;
                    line-height: 1.45 !important;
                    max-width: min(34ch, 92%);
                    margin: 0 !important;
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 2;
                    word-break: break-word;
                }

                #gp-cark-hub .slot-unit [data-slot-placeholder] {
                    font-size: clamp(0.98rem, 4.8vw, 1.35rem) !important;
                    line-height: 1.12 !important;
                    max-width: min(24ch, 92%);
                    margin: 0 !important;
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 2;
                    word-break: break-word;
                }
            }

            /* Çok dar ekranlarda başlığı tek satıra indir */
            @media (max-width: 420px) {
                #gp-cark-hub .slot-unit [data-slot-title] {
                    -webkit-line-clamp: 1;
                }
            }

            #gp-cark-hub .is-spinning .slot-unit { filter: blur(4px); opacity: 0.5; }
            #gp-cark-hub .is-spinning .ring-1 { animation: spin 0.4s linear infinite !important; border-top-width: 4px; }

            #gp-cark-hub .custom-scroll { -webkit-overflow-scrolling: touch; }
            #gp-cark-hub .custom-scroll::-webkit-scrollbar { width: 4px; }
            #gp-cark-hub .custom-scroll::-webkit-scrollbar-thumb { background: #008af9; border-radius: 10px; }

            #gp-cark-hub .item-card {
                transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
                border-bottom: 1px solid rgba(0, 138, 249, 0.1);
                position: relative; overflow: hidden;
                border-radius: 0.75rem;
                min-height: 48px;
            }
            #gp-cark-hub .item-card.active {
                background: rgba(0, 138, 249, 0.08);
                border-left: 4px solid #008af9;
                padding-left: 2rem;
            }
            #gp-cark-hub .item-card.active::after {
                content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%;
                background: linear-gradient(90deg, rgba(0, 138, 249, 0.06), transparent);
            }

            #gp-cark-hub .btn-premium {
                background: linear-gradient(135deg, #008af9, #005bb5);
                color: #ffffff;
                box-shadow: 0 4px 24px rgba(0, 138, 249, 0.35);
                transition: all 0.3s ease;
                min-height: 48px;
                touch-action: manipulation;
            }
            #gp-cark-hub .btn-premium:hover:not(:disabled) { transform: scale(1.05); box-shadow: 0 8px 32px rgba(0, 138, 249, 0.45); }
            #gp-cark-hub .btn-premium:disabled { opacity: 0.7; cursor: not-allowed; transform: none; }

            @media (max-width: 1023px) {
                #gp-cark-hub .engine-container { width: min(88vw, 320px); height: min(88vw, 320px); max-width: 320px; max-height: 320px; }
            }

            /* Toast */
            #gp-cark-hub #ih-toast-root { pointer-events: none; }
            #gp-cark-hub .toast-item {
                pointer-events: auto;
                animation: toast-in 0.35s ease forwards;
            }
            @keyframes toast-in {
                from { opacity: 0; transform: translateY(12px); }
                to { opacity: 1; transform: translateY(0); }
            }

            /* ========================================================
               MOBİL VE TABLET PERFORMANS OPTİMİZASYONLARI
               Masaüstü görünümü ve hiyerarşiyi bozmadan yapılan scope müdahaleler
               ======================================================== */
            @media (max-width: 1024px) {
                #gp-cark-hub .core-glass {
                    backdrop-filter: blur(12px); /* Renderı yoran blur düşürüldü */
                    box-shadow: inset 0 0 20px rgba(0, 138, 249, 0.05), 0 16px 32px rgba(0, 91, 181, 0.08); /* Gölgeler hafifletildi */
                }
        
                /* MOBİL LİSTE DARALTMA (COLLAPSE) STİLLERİ */
                #gp-cark-hub #ih-list-stream.mobile-collapsed .item-card:nth-child(n+6) {
                    display: none !important; /* İlk 5 haricindeki tüm katmanları mobilde gizle */
                }
            }

            @media (max-width: 768px) {
                #gp-cark-hub .core-glass {
                    backdrop-filter: blur(8px); /* Mobil için max güvenli blur değeri */
                    box-shadow: inset 0 0 10px rgba(0, 138, 249, 0.03), 0 8px 16px rgba(0, 91, 181, 0.05); /* Gölgeler mobilde daha da basitleştirildi */
                }
                #gp-cark-hub .outer-glow {
                    opacity: 0.6; /* Parlama şiddeti düşürülerek render maliyeti azaltıldı */
                }
                #gp-cark-hub .engine-container.animate-float {
                    animation-duration: 16s; /* Sürekli çalışan float animasyonu mobilde yavaşlatılarak GPU rahatlatıldı */
                }
                /* animate-scan efekti mobilde çok az opaklık ile çalıştırılsın */
                #gp-cark-hub .animate-scan {
                   opacity: 0.5;
                }
            }

            /* ERİŞİLEBİLİRLİK (A11Y) VE REDUCED MOTION */
            @media (prefers-reduced-motion: reduce) {
                #gp-cark-hub * {
                    animation-duration: 0.001ms !important;
                    animation-iteration-count: 1 !important;
                    transition-duration: 0.001ms !important;
                    scroll-behavior: auto !important;
                }
                #gp-cark-hub .is-spinning .slot-unit { filter: none; opacity: 1; }
            }

        #gp-cark-hub {
          position: relative;
          overflow: hidden;
          font-family: Outfit, Inter, system-ui, sans-serif;
          color: #0f172a;
          background: #ffffff;
        }
        #istatistik-carklari {
          background-color: #ffffff;
        }
        #gp-cark-hub #ih-toast-root {
          position: absolute;
          bottom: 1rem;
          left: 1rem;
          right: 1rem;
          z-index: 50;
        }
        #gp-cark-hub .ih-section-visual {
          display: block;
          width: min(980px, 100%);
          height: auto;
          margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
        }
        #gp-cark-hub .ih-section-title {
          display: flex;
          flex-direction: column;
          align-items: center;
          gap: 0.06em;
          line-height: 1.08;
        }
        #gp-cark-hub .ih-section-title__line {
          display: block;
        }
        @media (min-width: 1024px) {
          #gp-cark-hub #ih-list-stream {
            max-height: none;
          }
          #gp-cark-hub #ih-list-stream.mobile-collapsed .item-card:nth-child(n+6) {
            display: flex !important;
          }
        }

        /* === Rehberler === */
        #gp-rehber-hub {
                /* Altın Oran (Golden Ratio) Değişkenleri */
                --phi: 1.618;
                --base-size: 1rem;
                --space-xs: calc(var(--base-size) / var(--phi));       
                --space-sm: var(--base-size);                          
                --space-md: calc(var(--space-sm) * var(--phi));        
                --space-lg: calc(var(--space-md) * var(--phi));        
                --space-xl: calc(var(--space-lg) * var(--phi));        

                /* Renk Paleti */
                --brand: #008af9;
                --brand-deep: #04406f;
                --brand-muted: #3d9df5;
                --brand-soft: rgba(0, 138, 249, 0.1);
                --brand-glow: rgba(0, 138, 249, 0.28);
                --line-strong: rgba(0, 138, 249, 0.22);
                --ink: #0c1624;
                --ink-soft: #4a5d73;
                --bg-color: #ffffff;
                --text-muted: #9ca3af;
                --prefix-color: #6b7280;
        
                --font-sans: 'Inter', system-ui, sans-serif;
                --font-display: "Playfair Display", Georgia, serif;
            }

            * { 
                box-sizing: border-box; 
            }


            #gp-rehber-hub .rh-page-wrapper {
                display: flex;
                flex-direction: column;
                align-items: center;
                width: 100%;
                max-width: 800px;
                padding: var(--space-md);
                transform: translateY(calc(var(--space-lg) * -1));
            }

            /* --- ÜST AÇIKLAMA (MASTHEAD) --- */
            #gp-rehber-hub .rh-masthead {
                text-align: center;
                margin-bottom: var(--space-xl);
                width: 100%;
            }

            #gp-rehber-hub .rh-section-visual {
                display: block;
                width: min(980px, 100%);
                height: auto;
                margin: 0 auto var(--space-md);
                padding: 0;
                pointer-events: none;
                user-select: none;
                filter: none;
            }

            @media (max-width: 520px) {
                #gp-rehber-hub .rh-section-visual {
                    margin-bottom: var(--space-sm);
                }
            }

            #gp-rehber-hub .rh-intro-badge {
                display: inline-flex;
                align-items: center;
                gap: 0.5rem;
                padding: 0.42rem 1.05rem;
                border-radius: 999px;
                font-size: 0.72rem;
                font-weight: 600;
                letter-spacing: 0.12em;
                text-transform: uppercase;
                color: #065a9e;
                background: var(--bg-color);
                border: 1px solid var(--line-strong);
                box-shadow: 0 4px 20px rgba(0, 138, 249, 0.06);
                margin: 0 0 var(--space-md) 0;
            }

            #gp-rehber-hub .rh-intro-badge::before {
                content: "";
                width: 7px;
                height: 7px;
                border-radius: 50%;
                background: var(--brand);
                box-shadow: 0 0 0 3px var(--brand-soft), 0 0 12px var(--brand-glow);
                animation: rh-intro-dot 2s ease-in-out infinite;
            }

            @keyframes rh-intro-dot {
                0%, 100% { opacity: 1; transform: scale(1); }
                50% { opacity: 0.85; transform: scale(1.08); }
            }

            #gp-rehber-hub .rh-intro-title {
                margin: 0;
                font-family: var(--font-display);
                font-size: clamp(2rem, 5vw, 3.2rem);
                font-weight: 700;
                line-height: 1.12;
                letter-spacing: -0.02em;
            }

            #gp-rehber-hub .rh-intro-title-accent {
                background: linear-gradient(105deg, var(--brand-deep) 0%, var(--brand) 42%, var(--brand-muted) 100%);
                -webkit-background-clip: text;
                background-clip: text;
                color: transparent;
            }

            #gp-rehber-hub .rh-intro-desc {
                margin: var(--space-md) auto 0;
                max-width: 44rem;
                font-size: clamp(0.95rem, 2vw, 1.1rem);
                font-weight: 400;
                line-height: var(--phi);
                color: var(--ink-soft);
            }

            #gp-rehber-hub .rh-intro-desc strong {
                color: var(--ink);
                font-weight: 600;
            }

            /* --- MERKEZİ KAYAN YAZI (SCROLLER) --- */
            #gp-rehber-hub .rh-hero-container {
                display: flex;
                flex-direction: row; 
                flex-wrap: nowrap;
                align-items: center;
                justify-content: center;
                font-size: clamp(1.75rem, 6vw, 4.236rem);
                letter-spacing: -0.03em;
                width: 100%;
            }

            #gp-rehber-hub .rh-prefix {
                color: var(--prefix-color);
                font-weight: 400;
                margin-right: 0.25em;
                user-select: none;
                white-space: nowrap;
            }

            #gp-rehber-hub .rh-scroller-wrapper {
                height: 3em; 
                position: relative;
                overflow: hidden;
                -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 35%, black 65%, transparent 100%);
                mask-image: linear-gradient(to bottom, transparent 0%, black 35%, black 65%, transparent 100%);
            }

            #gp-rehber-hub .rh-scroller-list {
                margin: 0;
                padding: 0;
                list-style: none;
                transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
            }

            #gp-rehber-hub .rh-scroller-item {
                height: 1em;
                line-height: 1em;
                color: var(--text-muted);
                font-weight: 500;
                transition: color 0.3s ease, font-weight 0.3s ease, opacity 0.3s ease;
                white-space: nowrap;
                cursor: pointer;
                opacity: 0.3;
            }

            #gp-rehber-hub .rh-scroller-item.active {
                color: var(--ink);
                font-weight: 700;
                opacity: 1;
            }

            #gp-rehber-hub .rh-scroller-item:hover {
                color: var(--ink);
                opacity: 0.8;
            }
        #gp-rehber-hub .rh-page-wrapper {
          transform: none;
          width: 100%;
          max-width: 800px;
          margin: 0 auto;
          padding: clamp(1rem, 3vw, 2rem) 0;
        }
        #gp-rehber-hub {
          background: #ffffff;
          color: var(--ink, #0c1624);
          font-family: var(--font-sans, Inter, system-ui, sans-serif);
        }
        #rehberler {
          background-color: #ffffff;
        }

        /* === Analiz & Kesif === */
        /* Test Bölümü — beyaz zemin, marka mavisi vurgular */
            #gp-analiz-hub .test-section-bg {
                background-color: #ffffff;
                position: relative;
                overflow: hidden;
            }

            #gp-analiz-hub .section-visual {
                display: block;
                width: min(980px, 100%);
                height: auto;
                margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
                background: transparent;
                border: 0;
                border-radius: 0;
                box-shadow: none;
                pointer-events: none;
                user-select: none;
            }

            @media (max-width: 640px) {
                #gp-analiz-hub .section-visual {
                    margin-bottom: 0.85rem;
                }
            }

            #gp-analiz-hub .test-section-bg::before {
                /* Arka plan renklendirmesi kaldırıldı (düz beyaz) */
                content: none;
                display: none;
            }

            /* Kaydırma (Ticker) Animasyonları (GPU Hızlandırmalı) */
            #gp-analiz-hub .ticker-wrapper {
                display: flex;
                flex-direction: column;
                gap: 0.75rem;
                width: 100%;
                will-change: transform;
            }

            @media (max-width: 1024px) {
                #gp-analiz-hub .ticker-container {
                    contain: layout paint style;
                }

                #gp-analiz-hub .ticker-wrapper {
                    backface-visibility: hidden;
                }

                #gp-analiz-hub .ticker-card {
                    content-visibility: auto;
                    contain-intrinsic-size: auto 25.6px;
                    backface-visibility: hidden;
                }
            }

            @keyframes scroll-down {
                0% { transform: translate3d(0, -50%, 0); }
                100% { transform: translate3d(0, 0, 0); }
            }

            @keyframes scroll-up {
                0% { transform: translate3d(0, 0, 0); }
                100% { transform: translate3d(0, -50%, 0); }
            }

            #gp-analiz-hub .scroll-down {
                animation: scroll-down 35s linear infinite;
            }

            #gp-analiz-hub .scroll-up {
                animation: scroll-up 35s linear infinite;
            }

            #gp-analiz-hub .ticker-container:hover .ticker-wrapper {
                animation-play-state: paused;
            }

            /* Ticker Kart Tasarımı */
            #gp-analiz-hub .ticker-card {
                background: #ffffff;
                border: 1px solid rgba(0, 138, 249, 0.12);
                box-shadow: 0 1px 2px rgba(0, 138, 249, 0.06);
                border-radius: 1rem;
                padding: 0.75rem 1rem;
                display: flex;
                align-items: center;
                gap: 0.75rem;
                transition: all 0.3s ease;
                width: 100%;
                text-align: left;
                font: inherit;
                color: inherit;
                cursor: pointer;
                appearance: none;
                -webkit-appearance: none;
            }

            @media (min-width: 1024px) {
                #gp-analiz-hub .ticker-card {
                    padding: 1rem 1.25rem;
                    gap: 1rem;
                }
            }

            #gp-analiz-hub .ticker-card:hover {
                background: rgba(0, 138, 249, 0.04);
                border-color: rgba(0, 138, 249, 0.35);
                box-shadow: 0 8px 24px rgba(0, 138, 249, 0.12);
                transform: scale(1.02);
                cursor: pointer;
            }

            /* Merkezdeki Öne Çıkan Kart */
            #gp-analiz-hub .center-feature-card {
                background: linear-gradient(180deg, #ffffff 0%, rgba(0, 138, 249, 0.04) 100%);
                backdrop-filter: blur(20px);
                border: 1px solid rgba(0, 138, 249, 0.22);
                border-radius: 1.5rem;
                box-shadow: 0 4px 32px -8px rgba(0, 138, 249, 0.18),
                            0 0 0 1px rgba(255, 255, 255, 0.8) inset;
                transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
                will-change: transform, opacity;
                cursor: pointer;
            }

            #gp-analiz-hub .center-feature-card #ak-center-solve-btn {
                cursor: pointer;
            }

            #gp-analiz-hub .center-feature-card::before {
                content: '';
                position: absolute;
                inset: 0;
                border-radius: 1.5rem;
                padding: 2px;
                background: linear-gradient(135deg, rgba(0,138,249,0.45), rgba(0,138,249,0.08), rgba(0,91,181,0.4));
                -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                -webkit-mask-composite: xor;
                mask-composite: exclude;
                pointer-events: none;
            }

            /* Merkez Kart Değişim Animasyonu Sınıfları (GPU Optimizasyonu) */
            #gp-analiz-hub .card-fade-out {
                opacity: 0;
                transform: scale(0.95) translate3d(0, 10px, 0);
            }
    
            #gp-analiz-hub .card-fade-in {
                opacity: 1;
                transform: scale(1) translate3d(0, 0, 0);
            }

            #gp-analiz-hub .gradient-mask-y {
                -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
                mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
            }

            /* GPU Dostu Progress Bar (Width yerine ScaleX) */
            #gp-analiz-hub #ak-timer-bar {
                transform-origin: left;
                will-change: transform, opacity;
                /* JS tarafından animation eklenecek */
            }
    
            @keyframes shimmer {
                100% { left: 200%; }
            }

            @keyframes progress {
                0% { transform: scaleX(0); opacity: 1;}
                95% { opacity: 1;}
                100% { transform: scaleX(1); opacity: 0;}
            }

            /* MOBİL CSS RENDER OPTİMİZASYONU */
            @media (max-width: 1024px) {
                #gp-analiz-hub .ticker-card {
                    backdrop-filter: blur(4px); /* Azaltıldı */
                    transition: transform 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; /* all yerine spesifik */
                    box-shadow: 0 1px 2px rgba(0, 138, 249, 0.04);
                }
                #gp-analiz-hub .center-feature-card {
                    backdrop-filter: blur(8px); /* 20'den 8'e düşürüldü */
                    box-shadow: 0 4px 16px -4px rgba(0, 138, 249, 0.1),
                                0 0 0 1px rgba(255, 255, 255, 0.5) inset; /* Gölge hafifletildi */
                    transition: transform 0.4s ease, opacity 0.4s ease;
                }
                /* Blob animasyonları mobilde performansı çok etkiler, hafifletildi */
                #gp-analiz-hub .animate-blob {
                    filter: blur(30px) !important; 
                    opacity: 0.4;
                    animation-duration: 12s !important; /* Daha yavaş */
                }
            }

            /* ERİŞİLEBİLİRLİK VE REDUCED MOTION */
            @media (prefers-reduced-motion: reduce) {
                #gp-analiz-hub * {
                    animation-duration: 0.001ms !important;
                    animation-iteration-count: 1 !important;
                    transition-duration: 0.001ms !important;
                    scroll-behavior: auto !important;
                }
            }

        #gp-analiz-hub {
          background-color: #ffffff;
          position: relative;
          overflow: hidden;
          font-family: Outfit, Inter, system-ui, sans-serif;
        }
        #analiz-kesif {
          background-color: #ffffff;
        }

        html.ak-tests-modal-open,
        html.ak-tests-modal-open body {
          overflow: hidden;
        }

        #ak-tests-modal {
          position: fixed;
          inset: 0;
          z-index: 999999;
          display: none;
          align-items: center;
          justify-content: center;
          padding: 20px;
          box-sizing: border-box;
          background: rgba(8, 16, 28, 0.65);
          backdrop-filter: blur(12px);
          -webkit-backdrop-filter: blur(12px);
        }

        #ak-tests-modal.is-open {
          display: flex;
        }

        #ak-tests-modal .ak-modal-container {
          width: 100%;
          max-width: 680px;
          max-height: min(88dvh, calc(100dvh - 24px));
          display: flex;
          flex-direction: column;
          overflow: hidden;
          min-height: 0;
          border-radius: 28px;
          background: #fff;
          box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3);
        }

        #ak-tests-modal .ak-modal-header {
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 16px;
          padding: 24px 28px;
          border-bottom: 1px solid rgba(0, 138, 249, 0.14);
          background: #fcfdfe;
          flex-shrink: 0;
        }

        #ak-tests-modal .ak-modal-header h3 {
          margin: 0;
          font-family: "Sora", sans-serif;
          font-size: 1.25rem;
          font-weight: 700;
          color: #0b2238;
          letter-spacing: -0.02em;
        }

        #ak-tests-modal .ak-modal-count {
          font-family: "Inter", sans-serif;
          font-size: 0.75rem;
          font-weight: 700;
          padding: 4px 10px;
          border-radius: 8px;
          background: rgba(0, 138, 249, 0.1);
          color: #008af9;
          margin-left: 8px;
        }

        #ak-tests-modal .ak-modal-close {
          width: 44px;
          height: 44px;
          border: none;
          border-radius: 50%;
          background: #f0f4f8;
          color: #5a7389;
          cursor: pointer;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-shrink: 0;
        }

        #ak-tests-modal .ak-modal-close:hover,
        #ak-tests-modal .ak-modal-close:focus-visible {
          background: rgba(0, 138, 249, 0.12);
          color: #008af9;
          outline: none;
        }

        #ak-tests-modal .ak-modal-body {
          padding: 16px 20px 24px;
          overflow-y: auto;
          background: #fafbfc;
          flex: 1 1 auto;
          min-height: 0;
          overscroll-behavior: contain;
          -webkit-overflow-scrolling: touch;
        }

        #ak-tests-modal .ak-modal-list {
          display: flex;
          flex-direction: column;
          gap: 8px;
        }

        #ak-tests-modal .ak-modal-item {
          display: flex;
          align-items: center;
          gap: 14px;
          padding: 14px 16px;
          border-radius: 16px;
          background: #fff;
          border: 1px solid rgba(0, 138, 249, 0.14);
          box-shadow: 0 12px 32px -20px rgba(0, 55, 120, 0.12);
          text-decoration: none;
          color: inherit;
          transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
        }

        #ak-tests-modal .ak-modal-item:hover,
        #ak-tests-modal .ak-modal-item:focus-visible {
          border-color: rgba(0, 138, 249, 0.32);
          box-shadow: 0 16px 40px -18px rgba(0, 138, 249, 0.22);
          transform: translateY(-1px);
          outline: none;
        }

        #ak-tests-modal .ak-modal-item__index {
          font-size: 0.72rem;
          font-weight: 700;
          color: #008af9;
          opacity: 0.85;
          min-width: 1.5rem;
          flex-shrink: 0;
        }

        #ak-tests-modal .ak-modal-item__icon {
          width: 42px;
          height: 42px;
          border-radius: 12px;
          background: rgba(0, 138, 249, 0.1);
          border: 1px solid rgba(0, 138, 249, 0.2);
          color: #008af9;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-shrink: 0;
          font-size: 1rem;
        }

        #ak-tests-modal .ak-modal-item__content {
          flex: 1;
          min-width: 0;
          text-align: left;
        }

        #ak-tests-modal .ak-modal-item__title {
          margin: 0;
          font-size: 0.92rem;
          font-weight: 700;
          color: #0b2238;
          line-height: 1.35;
        }

        #ak-tests-modal .ak-modal-item__desc {
          margin: 4px 0 0;
          font-size: 0.78rem;
          color: #5a7389;
          line-height: 1.45;
        }

        #ak-tests-modal .ak-modal-item__arrow {
          color: #008af9;
          opacity: 0.55;
          flex-shrink: 0;
          font-size: 0.75rem;
        }

        #ak-tests-modal .ak-modal-item:hover .ak-modal-item__arrow,
        #ak-tests-modal .ak-modal-item:focus-visible .ak-modal-item__arrow {
          opacity: 1;
        }

        #ak-tests-modal .ak-modal-item.is-highlighted {
          border-color: rgba(0, 138, 249, 0.45);
          box-shadow: 0 0 0 3px rgba(0, 138, 249, 0.14), 0 16px 40px -18px rgba(0, 138, 249, 0.22);
        }

        #gp-analiz-hub .ak-tests-cta {
          touch-action: manipulation;
        }


        /* === Gayrimenkul Checklist === */
        #gayrimenkul-checklist {
          background-color: #ffffff;
        }
        html.gc-checklist-modal-open,
        html.gc-checklist-modal-open body {
          overflow: hidden;
        }


    #gp-checklist-hub.gc-checklist {
      --gc-ink: #0c1222;
      --gc-muted: #6b8299;
      --gc-brand: #008af9;
      --gc-brand-light: #5cb4fc;
      --gc-brand-dark: #0078d4;
      --gc-brand-glow: rgba(0, 138, 249, 0.35);
      --gc-brand-soft: rgba(0, 138, 249, 0.1);
      --gc-green: #10b981;
      --gc-green-dark: #059669;
      --gc-green-soft: rgba(16, 185, 129, 0.08);
      --gc-green-border: rgba(16, 185, 129, 0.22);
      --gc-line: rgba(0, 138, 249, 0.14);
      --gc-card: #fff;
      --gc-shadow: 0 16px 40px -20px rgba(0, 138, 249, 0.18);
      --gc-radius: 20px;
      position: relative;
      max-width: 920px;
      margin: 0 auto;
      padding: 48px 20px 64px;
      text-align: center;
      color: var(--gc-ink);
      background: #fff;
      overflow: hidden;
      -webkit-tap-highlight-color: transparent;
    }

    #gp-checklist-hub.gc-checklist::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 80% 60% at 50% 45%, rgba(0, 138, 249, 0.07) 0%, transparent 70%),
        radial-gradient(circle at 50% 50%, rgba(0, 138, 249, 0.04) 0%, transparent 50%);
      pointer-events: none;
    }

    #gp-checklist-hub.gc-checklist > * {
      position: relative;
      z-index: 1;
    }

    /* Header */
    #gp-checklist-hub .gc-checklist__hero {
      margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
      max-width: min(980px, 100%);
      width: 100%;
      line-height: 0;
    }

    #gp-checklist-hub .gc-checklist__hero img {
      display: block;
      width: min(980px, 100%);
      max-width: 100%;
      height: auto;
      margin: 0 auto;
      object-fit: contain;
    }

    #gp-checklist-hub .gc-checklist__title {
      margin: 0;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: clamp(2rem, 5.5vw, 2.65rem);
      font-weight: 400;
      line-height: 1.12;
      letter-spacing: -0.03em;
      color: var(--gc-ink);
    }

    #gp-checklist-hub .gc-checklist__title-accent {
      font-style: italic;
      background: linear-gradient(120deg, var(--gc-brand) 8%, var(--gc-brand-light) 92%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    #gp-checklist-hub .gc-checklist__subtitle {
      margin: 12px auto 0;
      max-width: 520px;
      font-size: clamp(0.875rem, 2.2vw, 0.95rem);
      font-weight: 500;
      color: var(--gc-muted);
      line-height: 1.55;
    }

    /* Timeline layout */
    #gp-checklist-hub .gc-checklist__flow {
      position: relative;
      margin-top: 36px;
    }

    #gp-checklist-hub .gc-checklist__flow::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 0;
      bottom: 0;
      width: 2px;
      transform: translateX(-50%);
      background: repeating-linear-gradient(
        180deg,
        rgba(0, 138, 249, 0.25) 0,
        rgba(0, 138, 249, 0.25) 6px,
        transparent 6px,
        transparent 14px
      );
      pointer-events: none;
      z-index: 0;
    }

    #gp-checklist-hub .gc-checklist__flow-stage {
      position: relative;
      max-width: 920px;
      margin: 0 auto;
    }

    /* Sürekli dikey akış */
    #gp-checklist-hub .gc-checklist__flow-viewport {
      position: relative;
      height: clamp(560px, 68vh, 720px);
      overflow: clip;
      margin: 0 auto;
      max-width: 680px;
      contain: layout style paint;
      -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
      mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
    }

    #gp-checklist-hub .gc-checklist__flow-track {
      display: flex;
      flex-direction: column;
      gap: 10px;
      transform: translate3d(0, 0, 0);
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      animation: gc-stream-flow 48s linear infinite;
    }

    #gp-checklist-hub .gc-checklist__flow-stage.is-paused .gc-checklist__flow-track {
      animation-play-state: paused;
    }

    @keyframes gc-stream-flow {
      0% { transform: translate3d(0, 0, 0); }
      100% { transform: translate3d(0, -50%, 0); }
    }

    #gp-checklist-hub .gc-flow-item {
      flex-shrink: 0;
      contain: layout style;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      transition:
        background 0.4s ease,
        border-color 0.4s ease,
        box-shadow 0.4s ease;
    }

    #gp-checklist-hub .gc-flow-item .gc-checklist__icon {
      transition: background 0.4s ease, color 0.4s ease;
    }

    #gp-checklist-hub .gc-flow-item .gc-checklist__status {
      position: relative;
      width: 32px;
      height: 32px;
      flex-shrink: 0;
    }

    #gp-checklist-hub .gc-flow-item .gc-checklist__index {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
    }

    #gp-checklist-hub .gc-flow-item .gc-checklist__check {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: var(--gc-green);
      color: #fff;
      box-shadow: 0 4px 12px -2px rgba(16, 185, 129, 0.45);
    }

    #gp-checklist-hub .gc-flow-item .gc-checklist__index,
    #gp-checklist-hub .gc-flow-item .gc-checklist__check {
      position: absolute;
      inset: 0;
      will-change: opacity, transform;
      transition: opacity 0.35s ease, transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    #gp-checklist-hub .gc-flow-item[data-zone="done"] .gc-checklist__icon {
      background: rgba(16, 185, 129, 0.14) !important;
      color: var(--gc-green-dark) !important;
    }

    #gp-checklist-hub .gc-flow-item[data-zone="pending"] .gc-checklist__index {
      opacity: 0.75;
      transform: scale(1);
    }

    #gp-checklist-hub .gc-flow-item[data-zone="pending"] .gc-checklist__check {
      opacity: 0;
      transform: scale(0.4);
    }

    #gp-checklist-hub .gc-flow-item[data-zone="morph"] {
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(230, 245, 238, 0.95) 100%) !important;
      border-color: rgba(0, 138, 249, 0.22) !important;
      box-shadow: 0 14px 36px -16px rgba(0, 138, 249, 0.18) !important;
    }

    #gp-checklist-hub .gc-flow-item[data-zone="morph"] .gc-checklist__icon {
      background: rgba(0, 138, 249, 0.12) !important;
      color: var(--gc-brand) !important;
    }

    #gp-checklist-hub .gc-flow-item[data-zone="morph"] .gc-checklist__index {
      opacity: 0.35;
      transform: scale(0.8);
    }

    #gp-checklist-hub .gc-flow-item[data-zone="morph"] .gc-checklist__check {
      opacity: 0.55;
      transform: scale(0.85);
    }

    #gp-checklist-hub .gc-flow-item[data-zone="done"] .gc-checklist__index {
      opacity: 0;
      transform: scale(0.5);
    }

    #gp-checklist-hub .gc-flow-item[data-zone="done"] .gc-checklist__check {
      opacity: 1;
      transform: scale(1);
    }

    #gp-checklist-hub .gc-checklist__flow-stage.is-paused .gc-checklist__hub-core {
      animation-play-state: paused;
    }

    #gp-checklist-hub .gc-checklist__stack {
      display: flex;
      flex-direction: column;
      gap: 10px;
      max-width: 680px;
      margin: 0 auto;
    }

    #gp-checklist-hub .gc-checklist__stack--top {
      margin-bottom: 12px;
    }

    #gp-checklist-hub .gc-checklist__stack--bottom {
      margin-top: 12px;
    }

    /* Checklist card */
    #gp-checklist-hub .gc-checklist__item {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 14px;
      padding: 14px 18px;
      border-radius: var(--gc-radius);
      text-decoration: none;
      color: inherit;
      text-align: left;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.35s ease;
    }

    #gp-checklist-hub .gc-checklist__flow-stage.is-animating .gc-checklist__item:hover,
    #gp-checklist-hub .gc-flow-item:hover {
      transform: none;
    }

    #gp-checklist-hub .gc-checklist__item:hover,
    #gp-checklist-hub .gc-checklist__item:focus-visible {
      transform: translateY(-2px);
      outline: none;
    }

    #gp-checklist-hub .gc-checklist__item--pending {
      background: rgba(255, 255, 255, 0.82);
      border: 1px solid var(--gc-line);
      box-shadow: var(--gc-shadow);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
    }

    #gp-checklist-hub .gc-checklist__item--pending:hover,
    #gp-checklist-hub .gc-checklist__item--pending:focus-visible {
      border-color: rgba(0, 138, 249, 0.3);
      box-shadow: 0 20px 48px -18px rgba(0, 138, 249, 0.22);
    }

    #gp-checklist-hub .gc-checklist__item--done {
      background: var(--gc-green-soft);
      border: 1px solid var(--gc-green-border);
      box-shadow: 0 12px 32px -18px rgba(16, 185, 129, 0.2);
    }

    #gp-checklist-hub .gc-checklist__item--done:hover,
    #gp-checklist-hub .gc-checklist__item--done:focus-visible {
      border-color: rgba(16, 185, 129, 0.38);
      box-shadow: 0 16px 40px -14px rgba(16, 185, 129, 0.28);
    }

    #gp-checklist-hub .gc-checklist__icon {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      border-radius: 14px;
    }

    #gp-checklist-hub .gc-checklist__item--pending .gc-checklist__icon {
      background: var(--gc-brand-soft);
      color: var(--gc-brand);
    }

    #gp-checklist-hub .gc-checklist__item--done .gc-checklist__icon {
      background: rgba(16, 185, 129, 0.14);
      color: var(--gc-green-dark);
    }

    #gp-checklist-hub .gc-checklist__icon svg {
      width: 22px;
      height: 22px;
    }

    #gp-checklist-hub .gc-checklist__body {
      min-width: 0;
    }

    #gp-checklist-hub .gc-checklist__name {
      margin: 0;
      font-size: 0.9375rem;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.35;
      color: var(--gc-ink);
    }

    #gp-checklist-hub .gc-checklist__tags {
      margin: 4px 0 0;
      font-size: 0.75rem;
      font-weight: 500;
      color: var(--gc-muted);
      line-height: 1.45;
    }

    #gp-checklist-hub .gc-checklist__index {
      flex-shrink: 0;
      font-size: 0.8125rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      color: var(--gc-brand);
      opacity: 0.75;
    }

    #gp-checklist-hub .gc-checklist__check {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: var(--gc-green);
      color: #fff;
      box-shadow: 0 4px 12px -2px rgba(16, 185, 129, 0.45);
    }

    #gp-checklist-hub .gc-checklist__check svg {
      width: 16px;
      height: 16px;
    }

    /* Center hub — akış üzerinde sabit overlay */
    #gp-checklist-hub .gc-checklist__hub-wrap {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 12px;
      width: 100%;
      max-width: 920px;
      padding: 0;
      z-index: 10;
      pointer-events: none;
    }

    #gp-checklist-hub .gc-checklist__hub-wrap::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255, 255, 255, 0.96) 35%, rgba(255, 255, 255, 0.75) 58%, transparent 78%);
      pointer-events: none;
      z-index: -1;
    }

    #gp-checklist-hub .gc-checklist__side-card {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 16px 18px;
      border-radius: 18px;
      background: rgba(255, 255, 255, 0.92);
      border: 1px solid var(--gc-line);
      box-shadow: var(--gc-shadow);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      pointer-events: auto;
    }

    #gp-checklist-hub .gc-checklist__side-card--left {
      flex-direction: row-reverse;
      text-align: right;
    }

    #gp-checklist-hub .gc-checklist__side-card--right {
      flex-direction: row;
      text-align: left;
    }

    #gp-checklist-hub .gc-checklist__side-card-icon {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      border-radius: 12px;
      background: var(--gc-brand-soft);
      color: var(--gc-brand);
    }

    #gp-checklist-hub .gc-checklist__side-card-icon svg {
      width: 20px;
      height: 20px;
    }

    #gp-checklist-hub .gc-checklist__side-card p {
      margin: 0;
      font-size: 0.8125rem;
      font-weight: 600;
      line-height: 1.5;
      color: var(--gc-ink);
    }

    #gp-checklist-hub .gc-checklist__hub {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 140px;
      height: 140px;
      flex-shrink: 0;
    }

    #gp-checklist-hub .gc-checklist__hub-scene {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 140px;
      height: 140px;
      contain: layout style paint;
      transform: translate3d(0, 0, 0);
    }

    /* Arka plan: radial glow + konsantrik halkalar */
    #gp-checklist-hub .gc-checklist__hub-bg {
      position: absolute;
      inset: -20px;
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 50%, rgba(0, 138, 249, 0.18) 0%, rgba(0, 138, 249, 0.06) 38%, transparent 68%),
        repeating-radial-gradient(
          circle at 50% 50%,
          transparent 0,
          transparent 18px,
          rgba(0, 138, 249, 0.04) 18px,
          rgba(0, 138, 249, 0.04) 19px
        );
      animation: gc-hub-bg-drift 8s ease-in-out infinite;
      pointer-events: none;
    }

    #gp-checklist-hub .gc-checklist__hub-bg::after {
      content: "";
      position: absolute;
      inset: 10%;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255, 255, 255, 0.55) 0%, transparent 70%);
      mix-blend-mode: overlay;
    }

    #gp-checklist-hub .gc-checklist__hub-glow {
      position: absolute;
      width: 96px;
      height: 96px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(0, 138, 249, 0.45) 0%, rgba(0, 138, 249, 0.12) 55%, transparent 72%);
      filter: blur(6px);
      animation: gc-hub-glow 3s ease-in-out infinite;
      pointer-events: none;
    }

    #gp-checklist-hub .gc-checklist__hub-ring {
      position: absolute;
      border-radius: 50%;
      border: 1px solid rgba(0, 138, 249, 0.2);
      pointer-events: none;
    }

    #gp-checklist-hub .gc-checklist__hub-ring--1 {
      inset: 8px;
      border-color: rgba(0, 138, 249, 0.28);
      animation: gc-hub-ring 4s ease-in-out infinite;
    }

    #gp-checklist-hub .gc-checklist__hub-ring--2 {
      inset: -2px;
      border-color: rgba(0, 138, 249, 0.16);
      animation: gc-hub-ring 4s ease-in-out infinite 0.6s;
    }

    #gp-checklist-hub .gc-checklist__hub-ring--3 {
      inset: -14px;
      border-color: rgba(0, 138, 249, 0.08);
      animation: gc-hub-ring 4s ease-in-out infinite 1.2s;
    }

    /* Dışa yayılan ripple dalgaları */
    #gp-checklist-hub .gc-checklist__hub-ripple {
      position: absolute;
      width: 76px;
      height: 76px;
      border-radius: 50%;
      border: 1.5px solid rgba(0, 138, 249, 0.35);
      pointer-events: none;
    }

    #gp-checklist-hub .gc-checklist__hub-ripple--1 {
      animation: gc-hub-ripple 3.2s ease-out infinite;
    }

    #gp-checklist-hub .gc-checklist__hub-ripple--2 {
      animation: gc-hub-ripple 3.2s ease-out infinite 1.6s;
    }

    #gp-checklist-hub .gc-checklist__hub-core {
      position: relative;
      z-index: 2;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 76px;
      height: 76px;
      border-radius: 50%;
      background:
        linear-gradient(155deg, rgba(255, 255, 255, 0.22) 0%, transparent 42%),
        linear-gradient(145deg, var(--gc-brand) 0%, #0096ff 45%, var(--gc-brand-light) 100%);
      color: #fff;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        inset 0 -2px 6px rgba(0, 100, 180, 0.25),
        0 0 0 5px rgba(0, 138, 249, 0.12),
        0 0 0 10px rgba(0, 138, 249, 0.06),
        0 18px 44px -10px rgba(0, 138, 249, 0.55);
      animation: gc-hub-breathe 2.8s ease-in-out infinite;
    }

    #gp-checklist-hub .gc-checklist__hub-core-shine {
      position: absolute;
      top: 8px;
      left: 14px;
      width: 28px;
      height: 14px;
      border-radius: 50%;
      background: radial-gradient(ellipse, rgba(255, 255, 255, 0.55) 0%, transparent 72%);
      pointer-events: none;
    }

    #gp-checklist-hub .gc-checklist__hub-core svg {
      position: relative;
      z-index: 1;
      width: 34px;
      height: 34px;
      filter: drop-shadow(0 1px 2px rgba(0, 80, 140, 0.3));
    }

    #gp-checklist-hub .gc-checklist__hub-line {
      position: absolute;
      top: 50%;
      height: 1px;
      pointer-events: none;
      z-index: 1;
    }

    #gp-checklist-hub .gc-checklist__hub-line--left {
      right: calc(100% + 6px);
      left: -72px;
      background: linear-gradient(90deg, transparent 0%, rgba(0, 138, 249, 0.08) 20%, rgba(0, 138, 249, 0.28) 85%, var(--gc-brand) 100%);
    }

    #gp-checklist-hub .gc-checklist__hub-line--left::after {
      content: "";
      position: absolute;
      right: -3px;
      top: 50%;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--gc-brand);
      transform: translateY(-50%);
      box-shadow: 0 0 8px rgba(0, 138, 249, 0.6);
    }

    #gp-checklist-hub .gc-checklist__hub-line--right {
      left: calc(100% + 6px);
      right: -72px;
      background: linear-gradient(90deg, var(--gc-brand) 0%, rgba(0, 138, 249, 0.28) 15%, rgba(0, 138, 249, 0.08) 80%, transparent 100%);
    }

    #gp-checklist-hub .gc-checklist__hub-line--right::after {
      content: "";
      position: absolute;
      left: -3px;
      top: 50%;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--gc-brand);
      transform: translateY(-50%);
      box-shadow: 0 0 8px rgba(0, 138, 249, 0.6);
    }

    @keyframes gc-hub-breathe {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.07); }
    }

    @keyframes gc-hub-glow {
      0%, 100% { opacity: 0.65; transform: scale(1); }
      50% { opacity: 1; transform: scale(1.12); }
    }

    @keyframes gc-hub-ring {
      0%, 100% { opacity: 0.55; transform: scale(1); }
      50% { opacity: 0.25; transform: scale(1.04); }
    }

    @keyframes gc-hub-ripple {
      0% {
        opacity: 0.55;
        transform: scale(1);
      }
      100% {
        opacity: 0;
        transform: scale(2.1);
      }
    }

    @keyframes gc-hub-bg-drift {
      0%, 100% { transform: scale(1) rotate(0deg); opacity: 0.9; }
      50% { transform: scale(1.05) rotate(3deg); opacity: 1; }
    }

    @media (hover: none) {
      #gp-checklist-hub .gc-checklist__item:hover,
      #gp-checklist-hub .gc-checklist__item:focus-visible {
        transform: none;
      }

      #gp-checklist-hub .gc-checklist__item--pending:hover,
      #gp-checklist-hub .gc-checklist__item--pending:focus-visible,
      #gp-checklist-hub .gc-checklist__item--done:hover,
      #gp-checklist-hub .gc-checklist__item--done:focus-visible {
        box-shadow: var(--gc-shadow);
      }

      #gp-checklist-hub .gc-checklist__item--done:hover,
      #gp-checklist-hub .gc-checklist__item--done:focus-visible {
        box-shadow: 0 12px 32px -18px rgba(16, 185, 129, 0.2);
      }

      #gp-checklist-hub .gc-checklist__cta:hover,
      #gp-checklist-hub .gc-checklist__cta:focus-visible {
        transform: none;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      #gp-checklist-hub .gc-checklist__hub-bg,
      #gp-checklist-hub .gc-checklist__hub-glow,
      #gp-checklist-hub .gc-checklist__hub-ring,
      #gp-checklist-hub .gc-checklist__hub-ripple,
      #gp-checklist-hub .gc-checklist__hub-core {
        animation: none !important;
      }

      #gp-checklist-hub .gc-checklist__flow-track {
        animation: none !important;
      }
    }

    /* CTA */
    #gp-checklist-hub .gc-checklist__cta-wrap {
      margin-top: 36px;
    }

    #gp-checklist-hub .gc-checklist__cta {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 15px 28px 15px 24px;
      border: none;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--gc-brand) 0%, var(--gc-brand-light) 100%);
      color: #fff;
      font-family: inherit;
      font-size: 1rem;
      font-weight: 700;
      cursor: pointer;
      box-shadow: 0 14px 36px -10px rgba(0, 138, 249, 0.45);
      transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    }

    #gp-checklist-hub .gc-checklist__cta:hover,
    #gp-checklist-hub .gc-checklist__cta:focus-visible {
      transform: translateY(-2px);
      background: linear-gradient(135deg, var(--gc-brand-dark) 0%, var(--gc-brand) 100%);
      box-shadow: 0 22px 48px -10px rgba(0, 138, 249, 0.55);
      outline: none;
    }

    #gp-checklist-hub .gc-checklist__cta-arrow {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.22);
    }

    #gp-checklist-hub .gc-checklist__cta-arrow svg {
      width: 16px;
      height: 16px;
    }

    /* Modal */
    #gc-checklist-modal {
      --gc-ink: #0c1222;
      --gc-muted: #6b8299;
      --gc-brand: #008af9;
      --gc-brand-soft: rgba(0, 138, 249, 0.1);
      --gc-line: rgba(0, 138, 249, 0.14);
      --gc-shadow: 0 12px 32px -20px rgba(0, 55, 120, 0.12);
      --gc-radius: 16px;
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
      box-sizing: border-box;
      background: rgba(8, 16, 28, 0.65);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    #gc-checklist-modal.is-open {
      display: flex;
    }

    #gc-checklist-modal .gc-modal-container {
      width: 100%;
      max-width: 680px;
      max-height: min(88dvh, calc(100dvh - 24px));
      display: flex;
      flex-direction: column;
      overflow: hidden;
      min-height: 0;
      border-radius: 28px;
      background: #fff;
      box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3);
    }

    #gc-checklist-modal .gc-modal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 24px 28px;
      border-bottom: 1px solid var(--gc-line);
      background: #fcfdfe;
      flex-shrink: 0;
    }

    #gc-checklist-modal .gc-modal-header h3 {
      margin: 0;
      font-family: "Sora", "Inter", sans-serif;
      font-size: 1.2rem;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--gc-ink);
    }

    #gc-checklist-modal .gc-modal-count {
      font-family: "Inter", sans-serif;
      font-size: 0.75rem;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 8px;
      background: var(--gc-brand-soft);
      color: var(--gc-brand);
      margin-left: 8px;
    }

    #gc-checklist-modal .gc-modal-close {
      width: 44px;
      height: 44px;
      border: none;
      border-radius: 50%;
      background: #f0f4f8;
      color: var(--gc-muted);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: background 0.2s ease, color 0.2s ease;
    }

    #gc-checklist-modal .gc-modal-close:hover,
    #gc-checklist-modal .gc-modal-close:focus-visible {
      background: var(--gc-brand-soft);
      color: var(--gc-brand);
      outline: none;
    }

    #gc-checklist-modal .gc-modal-body {
      padding: 16px 20px 24px;
      overflow-y: auto;
      background: #fafbfc;
      flex: 1 1 auto;
      min-height: 0;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
    }

    #gc-checklist-modal .gc-modal-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__item {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 14px;
      padding: 14px 16px;
      border-radius: var(--gc-radius);
      text-decoration: none;
      color: inherit;
      text-align: left;
      transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
      cursor: pointer;
      background: #fff;
      border: 1px solid var(--gc-line);
      box-shadow: var(--gc-shadow);
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__item:hover,
    #gc-checklist-modal .gc-modal-list .gc-checklist__item:focus-visible {
      border-color: rgba(0, 138, 249, 0.32);
      box-shadow: 0 16px 40px -18px rgba(0, 138, 249, 0.22);
      transform: translateY(-1px);
      outline: none;
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__icon {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      border-radius: 14px;
      background: var(--gc-brand-soft);
      color: var(--gc-brand);
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__icon svg {
      width: 22px;
      height: 22px;
      display: block;
      flex-shrink: 0;
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__body {
      min-width: 0;
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__name {
      margin: 0;
      font-size: 0.92rem;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.35;
      color: var(--gc-ink);
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__tags {
      margin: 4px 0 0;
      font-size: 0.75rem;
      font-weight: 500;
      color: var(--gc-muted);
      line-height: 1.45;
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__index {
      flex-shrink: 0;
      min-width: 1.75rem;
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      color: var(--gc-brand);
      opacity: 0.85;
      text-align: right;
    }

    #gc-checklist-modal .gc-modal-list .gc-checklist__check {
      display: none;
    }

    /* Responsive + mobil performans katmanları */
    @media (max-width: 720px) {
      #gp-checklist-hub .gc-checklist__flow-viewport {
        height: clamp(520px, 62vh, 640px);
        max-width: 100%;
      }

      #gp-checklist-hub .gc-checklist__flow-track {
        will-change: transform;
      }

      #gp-checklist-hub .gc-flow-item.gc-checklist__item--pending {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(255, 255, 255, 0.96);
      }

      #gp-checklist-hub .gc-checklist__side-card {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(255, 255, 255, 0.96);
        order: 1;
      }

      #gp-checklist-hub .gc-checklist__hub-wrap {
        grid-template-columns: 1fr;
        gap: 14px;
        top: 50%;
      }

      #gp-checklist-hub .gc-checklist__hub-wrap::before {
        width: 140px;
        height: 140px;
      }

      #gp-checklist-hub .gc-checklist__hub {
        order: 0;
        margin: 0 auto;
      }

      #gp-checklist-hub .gc-checklist__hub-line {
        display: none;
      }

      #gp-checklist-hub .gc-checklist__hub-bg,
      #gp-checklist-hub .gc-checklist__hub-glow,
      #gp-checklist-hub .gc-checklist__hub-ring,
      #gp-checklist-hub .gc-checklist__hub-ripple,
      #gp-checklist-hub .gc-checklist__hub-core {
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
      }

      #gp-checklist-hub .gc-checklist__hub-glow {
        transform: translate3d(0, 0, 0);
        will-change: transform, opacity;
      }

      #gp-checklist-hub .gc-checklist__side-card--left {
        order: 2;
        flex-direction: row;
        text-align: left;
      }

      #gp-checklist-hub .gc-checklist__side-card--right {
        order: 3;
        display: none;
      }

      #gp-checklist-hub .gc-checklist__item {
        grid-template-columns: auto 1fr auto;
        gap: 10px;
        padding: 12px 14px;
      }

      #gp-checklist-hub .gc-checklist__name {
        font-size: 0.875rem;
      }

      #gp-checklist-hub .gc-checklist__tags {
        font-size: 0.7rem;
      }

      #gp-checklist-hub .gc-checklist__cta,
      #gp-arena-hub .ga-arena__cta {
        touch-action: manipulation;
      }

      #gc-checklist-modal {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(8, 16, 28, 0.72);
      }

      #gc-checklist-modal .gc-modal-list .gc-checklist__item {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        gap: 10px;
        padding: 12px 14px;
      }

      #gc-checklist-modal .gc-modal-list .gc-checklist__icon {
        width: 40px;
        height: 40px;
        border-radius: 12px;
      }

      #gc-checklist-modal .gc-modal-list .gc-checklist__icon svg {
        width: 20px;
        height: 20px;
      }

      #gc-checklist-modal .gc-modal-list .gc-checklist__name {
        font-size: 0.875rem;
      }

      #gc-checklist-modal .gc-modal-list .gc-checklist__tags {
        font-size: 0.7rem;
      }
    }

    @media (max-width: 420px) {
      #gp-checklist-hub.gc-checklist {
        padding: 32px 14px 48px;
      }

      #gp-checklist-hub .gc-checklist__icon {
        width: 38px;
        height: 38px;
        border-radius: 12px;
      }

      #gp-checklist-hub .gc-checklist__icon svg {
        width: 18px;
        height: 18px;
      }
    }

        /* === Gayrimenkul Arenası === */
        #gayrimenkul-arenasi {
          background-color: #ffffff;
        }
        html.ga-arena-modal-open,
        html.ga-arena-modal-open body {
          overflow: hidden;
        }


    #gp-arena-hub.ga-arena {
      --ga-ink: #0c1222;
      --ga-muted: #6b8299;
      --ga-brand: #008af9;
      --ga-brand-light: #5cb4fc;
      --ga-brand-dark: #006ec7;
      --ga-line: rgba(0, 138, 249, 0.14);
      --ga-card: #fff;
      --ga-shadow: 0 20px 48px -24px rgba(0, 138, 249, 0.14);
      --ga-radius: 28px;
      max-width: 960px;
      margin: 0 auto;
      padding: 48px 20px 56px;
      text-align: center;
      color: var(--ga-ink);
      background: #fff;
    }

    #gp-arena-hub .ga-arena__hero {
      margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
      max-width: min(980px, 100%);
      width: 100%;
      line-height: 0;
    }

    #gp-arena-hub .ga-arena__hero img {
      display: block;
      width: min(980px, 100%);
      max-width: 100%;
      height: auto;
      margin: 0 auto;
      object-fit: contain;
    }

    #gp-arena-hub .ga-arena__eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin: 0 0 14px;
      padding: 6px 14px 6px 10px;
      border-radius: 999px;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--ga-brand-dark);
      background: rgba(255, 255, 255, 0.85);
      border: 1px solid var(--ga-line);
      box-shadow: 0 4px 16px -6px rgba(0, 138, 249, 0.2);
    }

    #gp-arena-hub .ga-arena__eyebrow-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--ga-brand);
    }

    #gp-arena-hub .ga-arena__title {
      margin: 0;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: clamp(2rem, 6vw, 2.75rem);
      font-weight: 400;
      line-height: 1.1;
      letter-spacing: -0.03em;
    }

    #gp-arena-hub .ga-arena__title-accent {
      font-style: italic;
      background: linear-gradient(120deg, var(--ga-brand-dark) 8%, var(--ga-brand-light) 92%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    #gp-arena-hub .ga-arena__subtitle {
      margin: 12px 0 0;
      font-size: clamp(0.9rem, 2.5vw, 1rem);
      font-weight: 500;
      color: var(--ga-muted);
      line-height: 1.5;
    }

    #gp-arena-hub .ga-arena__stack {
      margin: 0 auto 8px;
    }

    #gp-arena-hub .ga-arena__card {
      background: var(--ga-card);
      border-radius: var(--ga-radius);
      border: 1px solid var(--ga-line);
      box-shadow: var(--ga-shadow);
      overflow: hidden;
    }

    #gp-arena-hub .ga-arena__row {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 6px;
      padding: 14px 18px;
      text-decoration: none;
      color: inherit;
      transition: background 0.2s ease;
    }

    #gp-arena-hub .ga-arena__row:not(:last-child) {
      border-bottom: 1px solid rgba(0, 138, 249, 0.06);
    }

    #gp-arena-hub .ga-arena__row:hover,
    #gp-arena-hub .ga-arena__row:focus-visible {
      background: rgba(0, 138, 249, 0.04);
      outline: none;
    }

    #gp-arena-hub .ga-arena__side {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      font-size: 0.8125rem;
      font-weight: 600;
      letter-spacing: -0.01em;
    }

    #gp-arena-hub .ga-arena__side--right {
      justify-content: flex-end;
      text-align: right;
    }

    #gp-arena-hub .ga-arena__icon {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      color: var(--ga-brand);
    }

    #gp-arena-hub .ga-arena__icon svg {
      display: block;
      width: 100%;
      height: 100%;
    }

    #gp-arena-hub .ga-arena__label {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #gp-arena-hub .ga-arena__vs {
      display: flex;
      align-items: center;
      flex-shrink: 0;
      width: 108px;
    }

    #gp-arena-hub .ga-arena__vs-line {
      flex: 1;
      height: 1px;
      background: linear-gradient(90deg, var(--ga-brand), rgba(0, 138, 249, 0.15));
      position: relative;
    }

    #gp-arena-hub .ga-arena__vs-line--right {
      background: linear-gradient(90deg, rgba(0, 138, 249, 0.15), var(--ga-brand));
    }

    #gp-arena-hub .ga-arena__vs-line::after {
      content: "";
      position: absolute;
      top: 50%;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: var(--ga-brand);
      transform: translateY(-50%);
      right: -1px;
    }

    #gp-arena-hub .ga-arena__vs-line--right::after {
      left: -1px;
      right: auto;
    }

    #gp-arena-hub .ga-arena__vs-badge {
      flex-shrink: 0;
      width: 34px;
      height: 34px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      border: 1.5px solid var(--ga-brand);
      color: var(--ga-brand);
      font-size: 0.65rem;
      font-weight: 800;
      background: #fff;
    }

    #gp-arena-hub .ga-arena__cta-wrap {
      margin-top: 36px;
    }

    #gp-arena-hub .ga-arena__cta {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 15px 28px 15px 24px;
      border: none;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--ga-brand) 0%, var(--ga-brand-light) 100%);
      color: #fff;
      font-family: inherit;
      font-size: 1rem;
      font-weight: 700;
      cursor: pointer;
      box-shadow: 0 14px 36px -10px rgba(0, 138, 249, 0.45);
      transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    }

    #gp-arena-hub .ga-arena__cta:hover,
    #gp-arena-hub .ga-arena__cta:focus-visible {
      transform: translateY(-2px);
      background: linear-gradient(135deg, var(--ga-brand-dark) 0%, var(--ga-brand) 100%);
      box-shadow: 0 22px 48px -10px rgba(0, 138, 249, 0.55);
      outline: none;
    }

    #gp-arena-hub .ga-arena__cta-arrow {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.22);
    }

    #gp-arena-hub .ga-arena__cta-arrow svg {
      width: 16px;
      height: 16px;
    }

    /* Modal — body'de portal; kendi CSS değişkenleri ve satır stilleri */
    #ga-arena-modal {
      --ga-ink: #0c1222;
      --ga-muted: #6b8299;
      --ga-brand: #008af9;
      --ga-brand-light: #5cb4fc;
      --ga-brand-dark: #006ec7;
      --ga-line: rgba(0, 138, 249, 0.14);
      --ga-shadow: 0 20px 48px -24px rgba(0, 138, 249, 0.14);
      --ga-radius: 28px;
      position: fixed;
      inset: 0;
      z-index: 999999;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
      box-sizing: border-box;
      background: rgba(8, 16, 28, 0.65);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    #ga-arena-modal.is-open {
      display: flex;
    }

    #ga-arena-modal .ga-modal-container {
      width: 100%;
      max-width: 560px;
      max-height: min(88dvh, calc(100dvh - 24px));
      display: flex;
      flex-direction: column;
      overflow: hidden;
      min-height: 0;
      border-radius: 28px;
      background: #fff;
      box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3);
    }

    #ga-arena-modal .ga-modal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 24px 28px;
      border-bottom: 1px solid var(--ga-line);
      background: #fcfdfe;
      flex-shrink: 0;
    }

    #ga-arena-modal .ga-modal-header h3 {
      margin: 0;
      font-family: "Instrument Serif", Georgia, serif;
      font-size: 1.35rem;
      font-weight: 400;
      color: var(--ga-ink);
    }

    #ga-arena-modal .ga-modal-header .ga-modal-count {
      font-family: "DM Sans", sans-serif;
      font-size: 0.8rem;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 8px;
      background: rgba(0, 138, 249, 0.1);
      color: var(--ga-brand);
      margin-left: 8px;
    }

    #ga-arena-modal .ga-modal-close {
      width: 44px;
      height: 44px;
      border: none;
      border-radius: 50%;
      background: #f0f4f8;
      color: var(--ga-muted);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.2s ease, color 0.2s ease;
    }

    #ga-arena-modal .ga-modal-close:hover,
    #ga-arena-modal .ga-modal-close:focus-visible {
      background: rgba(0, 138, 249, 0.12);
      color: var(--ga-brand);
      outline: none;
    }

    #ga-arena-modal .ga-modal-body {
      padding: 16px 20px 24px;
      overflow-y: auto;
      background: #fafbfc;
      flex: 1 1 auto;
      min-height: 0;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
    }

    #ga-arena-modal .ga-modal-list {
      background: #fff;
      border-radius: var(--ga-radius);
      border: 1px solid var(--ga-line);
      box-shadow: var(--ga-shadow);
      overflow: hidden;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__row {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 6px;
      padding: 14px 18px;
      text-decoration: none;
      color: var(--ga-ink);
      transition: background 0.2s ease;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__row:not(:last-child) {
      border-bottom: 1px solid rgba(0, 138, 249, 0.06);
    }

    #ga-arena-modal .ga-modal-list .ga-arena__row:hover,
    #ga-arena-modal .ga-modal-list .ga-arena__row:focus-visible {
      background: rgba(0, 138, 249, 0.04);
      outline: none;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__side {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      font-size: 0.8125rem;
      font-weight: 600;
      letter-spacing: -0.01em;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__side--right {
      justify-content: flex-end;
      text-align: right;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__icon {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      color: var(--ga-brand);
    }

    #ga-arena-modal .ga-modal-list .ga-arena__icon svg {
      display: block;
      width: 100%;
      height: 100%;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__label {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__vs {
      display: flex;
      align-items: center;
      flex-shrink: 0;
      width: 108px;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__vs-line {
      flex: 1;
      height: 1px;
      background: linear-gradient(90deg, var(--ga-brand), rgba(0, 138, 249, 0.15));
      position: relative;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__vs-line--right {
      background: linear-gradient(90deg, rgba(0, 138, 249, 0.15), var(--ga-brand));
    }

    #ga-arena-modal .ga-modal-list .ga-arena__vs-line::after {
      content: "";
      position: absolute;
      top: 50%;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: var(--ga-brand);
      transform: translateY(-50%);
      right: -1px;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__vs-line--right::after {
      left: -1px;
      right: auto;
    }

    #ga-arena-modal .ga-modal-list .ga-arena__vs-badge {
      flex-shrink: 0;
      width: 34px;
      height: 34px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      border: 1.5px solid var(--ga-brand);
      color: var(--ga-brand);
      font-size: 0.65rem;
      font-weight: 800;
      background: #fff;
    }

    @media (max-width: 640px) {
      #ga-arena-modal .ga-modal-list .ga-arena__row {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 14px 16px;
        text-align: center;
      }

      #ga-arena-modal .ga-modal-list .ga-arena__side,
      #ga-arena-modal .ga-modal-list .ga-arena__side--right {
        justify-content: center;
        text-align: center;
      }

      #ga-arena-modal .ga-modal-list .ga-arena__vs {
        width: 100%;
        justify-content: center;
      }

      #ga-arena-modal .ga-modal-list .ga-arena__label {
        white-space: normal;
      }
    }

        /* === Oyun Alanı (Sektörel Oyun) === */
        #oyun-alani {
          background-color: #ffffff;
        }
        #gp-oyun-hub {
          background-color: #ffffff;
          position: relative;
          overflow: hidden;
          font-family: 'Space Grotesk', Inter, system-ui, sans-serif;
        }
        #gp-oyun-hub.oy-technical-grid {
          background-image: none;
          animation: none;
        }
        #gp-oyun-hub.oy-technical-grid::before {
          display: none;
        }
        #oy-toast-stack {
          position: fixed;
          left: 50%;
          transform: translateX(-50%);
          bottom: max(1rem, env(safe-area-inset-bottom, 0px));
          z-index: 200;
          display: flex;
          flex-direction: column;
          gap: 0.5rem;
          width: min(100%, 22rem);
          padding: 0 0.75rem;
          pointer-events: none;
        }

        /* Bento — açık tema */
        #gp-oyun-hub .bento-box {
            background: linear-gradient(165deg, #ffffff 0%, #f3f8fd 100%);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border: 1px solid rgba(0, 138, 249, 0.12);
            border-top: 1px solid rgba(255, 255, 255, 0.95);
            box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            position: relative;
            overflow: hidden;
            cursor: pointer;
        }

        #gp-oyun-hub .bento-box::before {
            content: '';
            position: absolute;
            inset: 0;
            background: radial-gradient(500px circle at var(--mouse-x) var(--mouse-y), rgba(0, 138, 249, 0.12), transparent 40%);
            z-index: 0;
            opacity: 0;
            transition: opacity 0.3s ease;
        }

        #gp-oyun-hub .bento-box:hover {
            transform: translateY(-5px) scale(1.02);
            border-color: rgba(0, 138, 249, 0.45);
            box-shadow: 0 18px 40px -12px rgba(0, 138, 249, 0.18),
                        0 8px 24px -8px rgba(15, 23, 42, 0.08),
                        inset 0 0 0 1px rgba(255, 255, 255, 0.6);
            z-index: 10;
        }

        #gp-oyun-hub .bento-box:hover::before {
            opacity: 1;
        }

        #gp-oyun-hub .bento-icon-wrapper {
            transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        #gp-oyun-hub .bento-box:hover .bento-icon-wrapper {
            transform: scale(1.15) rotate(5deg);
        }

        #gp-oyun-hub .section-visual {
            display: block;
            width: min(1040px, 100%);
            height: auto;
            margin: 0 auto 1.1rem;
            max-height: clamp(160px, 22svh, 240px);
            object-fit: contain;
            background: transparent;
            border: 0;
            border-radius: 0;
            box-shadow: none;
            pointer-events: none;
            user-select: none;
        }

        @media (max-width: 640px) {
            #gp-oyun-hub .section-visual {
                margin-bottom: 0.85rem;
                max-height: 190px;
            }
        }

        /* Oyun arenası */
        #gp-oyun-hub .games-arena {
            min-height: clamp(700px, 92svh, 840px);
            isolation: isolate;
        }
        @media (min-width: 768px) and (max-width: 1023px) {
            #gp-oyun-hub .games-arena { min-height: clamp(720px, 90svh, 820px); }
        }
        @media (min-width: 1024px) {
            #gp-oyun-hub .games-arena { min-height: 720px; }
        }
        #gp-oyun-hub .orbit-ring {
            position: absolute;
            inset: 0;
            z-index: 5;
            pointer-events: none;
            will-change: transform;
            box-sizing: border-box;
            padding-left: max(0px, env(safe-area-inset-left, 0px));
            padding-right: max(0px, env(safe-area-inset-right, 0px));
        }
        
        /* YAZI KESİLMESİNE YÖNELİK MOBİL GENİŞLİK OPTİMİZASYONU */
        #gp-oyun-hub .orbit-game {
            pointer-events: auto;
            position: absolute;
            width: clamp(110px, 28vw, 200px); /* Mobilde kelimelere nefes aldıracak güvenli genişlik */
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;
        }
        @media (min-width: 480px) {
            #gp-oyun-hub .orbit-game { width: clamp(140px, 32vw, 200px); }
        }
        @media (min-width: 1024px) {
            #gp-oyun-hub .orbit-game { width: min(200px, 42vw); }
        }
        
        #gp-oyun-hub .orbit-game--pos-0 { top: 4%; left: 4%; }
        #gp-oyun-hub .orbit-game--pos-1 { top: 0; left: 50%; transform: translateX(-50%); }
        #gp-oyun-hub .orbit-game--pos-2 { top: 4%; right: 4%; left: auto; }
        #gp-oyun-hub .orbit-game--pos-3,
        #gp-oyun-hub .orbit-game--pos-4 {
            top: auto;
            bottom: max(
                env(safe-area-inset-bottom, 0px),
                clamp(4.75rem, 15.5svh, 8.25rem)
            );
            right: auto;
        }
        
        #gp-oyun-hub .orbit-game--pos-3 { left: 50%; transform: translateX(calc(-100% - 0.45rem)); }
        #gp-oyun-hub .orbit-game--pos-4 { left: calc(50% + 0.45rem); transform: none; }
        
        @media (max-width: 1023px) {
            #gp-oyun-hub .orbit-game--pos-3,
            #gp-oyun-hub .orbit-game--pos-4 { width: clamp(120px, 42vw, 200px); }
        }
        @media (min-width: 1024px) {
            #gp-oyun-hub .orbit-ring { z-index: 25; }
            #gp-oyun-hub .orbit-game--pos-1 {
                top: -1.25rem;
                z-index: 2;
            }
            #gp-oyun-hub .orbit-game--pos-3 { top: 38%; left: 0; bottom: auto; transform: translateX(0); }
            #gp-oyun-hub .orbit-game--pos-4 { top: 38%; left: auto; right: 0; bottom: auto; transform: translateX(0); }
        }

        #gp-oyun-hub .orbit-spectacle {
            position: absolute;
            inset: -20%;
            pointer-events: none;
            z-index: 4;
            background: radial-gradient(circle at 50% 45%, rgba(0, 138, 249, 0.22), transparent 55%),
                        radial-gradient(circle at 30% 60%, rgba(0, 95, 163, 0.1), transparent 50%),
                        radial-gradient(circle at 70% 55%, rgba(0, 138, 249, 0.08), transparent 45%);
            opacity: 0;
        }
        #gp-oyun-hub .orbit-spectacle.is-active { animation: orbitSpectacleFlash 1.1s ease-out forwards; }
        @keyframes orbitSpectacleFlash {
            0% { opacity: 0; transform: scale(0.92); filter: blur(8px); }
            25% { opacity: 1; transform: scale(1); filter: blur(0); }
            100% { opacity: 0; transform: scale(1.08); }
        }

        #gp-oyun-hub .center-hero-card {
            position: relative;
            z-index: 15;
            max-width: min(34rem, calc(100% - 1rem));
            margin-left: auto;
            margin-right: auto;
            background: linear-gradient(180deg, #ffffff 0%, #f0f7fd 100%);
            border: 1px solid rgba(0, 138, 249, 0.15);
            border-radius: 2rem;
            box-shadow: 0 24px 64px -24px rgba(0, 138, 249, 0.18), 0 0 0 1px rgba(255, 255, 255, 0.8) inset;
        }
        @media (min-width: 1024px) {
            #gp-oyun-hub .center-hero-card { max-width: min(34rem, calc(100% - clamp(5.5rem, 28vw, 10rem))); }
        }

        /* Nihai yörünge yerleşimi: merkez kart ve 5 animasyon kartı çakışmasın */
        @media (max-width: 1023px) {
            #gp-oyun-hub .games-arena {
                min-height: clamp(760px, 100svh, 900px);
                padding-top: clamp(5.75rem, 16svh, 8.5rem) !important;
                padding-bottom: clamp(7.5rem, 18svh, 10rem) !important;
            }

            #gp-oyun-hub .center-hero-card {
                max-width: min(25.5rem, calc(100% - 1.25rem));
                padding-top: 1.15rem !important;
                padding-bottom: 1.25rem !important;
            }

            #gp-oyun-hub .center-hero-card .section-visual {
                max-height: clamp(130px, 19svh, 180px);
                margin-bottom: 0.7rem;
            }

            #gp-oyun-hub .orbit-game {
                width: clamp(90px, 25vw, 150px) !important;
            }

            #gp-oyun-hub .orbit-game--pos-0 {
                top: 0.25rem !important;
                left: max(0.25rem, 2vw) !important;
            }

            #gp-oyun-hub .orbit-game--pos-1 {
                top: 0 !important;
                left: 50% !important;
                transform: translateX(-50%) !important;
            }

            #gp-oyun-hub .orbit-game--pos-2 {
                top: 0.25rem !important;
                right: max(0.25rem, 2vw) !important;
                left: auto !important;
            }

            #gp-oyun-hub .orbit-game--pos-3,
            #gp-oyun-hub .orbit-game--pos-4 {
                top: auto !important;
                bottom: clamp(1.25rem, 5svh, 2.75rem) !important;
                width: clamp(104px, 38vw, 168px) !important;
            }

            #gp-oyun-hub .orbit-game--pos-3 {
                left: 50% !important;
                transform: translateX(calc(-100% - 0.45rem)) !important;
            }

            #gp-oyun-hub .orbit-game--pos-4 {
                left: calc(50% + 0.45rem) !important;
                right: auto !important;
                transform: none !important;
            }
        }

        @media (max-width: 420px) {
            #gp-oyun-hub .games-arena {
                min-height: clamp(740px, 100svh, 860px);
                padding-top: 6.75rem !important;
                padding-bottom: 8.75rem !important;
            }

            #gp-oyun-hub .center-hero-card {
                max-width: min(22.5rem, calc(100% - 0.75rem));
                border-radius: 1.5rem;
            }

            #gp-oyun-hub .center-hero-card .section-visual {
                max-height: 142px;
            }

            #gp-oyun-hub .orbit-game {
                width: clamp(82px, 24vw, 112px) !important;
            }

            #gp-oyun-hub .orbit-game--pos-3,
            #gp-oyun-hub .orbit-game--pos-4 {
                width: clamp(96px, 39vw, 138px) !important;
            }
        }

        #oy-games-modal-wrapper .library-skeleton:not(.hidden) {
            display: grid;
            grid-template-columns: repeat(1, minmax(0, 1fr));
            gap: 0.85rem;
            margin-bottom: 0.25rem;
        }
        @media (min-width: 640px) { #oy-games-modal-wrapper .library-skeleton:not(.hidden) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } }
        @media (min-width: 768px) { #oy-games-modal-wrapper .library-skeleton:not(.hidden) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
        @media (min-width: 1024px) { #oy-games-modal-wrapper .library-skeleton:not(.hidden) { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; } }
        #oy-games-modal-wrapper #oy-library-loading.hidden {
            display: none !important;
        }
        #oy-games-modal-wrapper .library-skeleton__card {
            height: 11.5rem;
            border-radius: 1.1rem;
            background: linear-gradient(90deg, #e2e8f0 0%, #f1f5f9 45%, #e2e8f0 90%);
            background-size: 200% 100%;
            animation: skeletonShine 1.1s ease-in-out infinite;
        }
        @keyframes skeletonShine { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

        /* =========================================
           MOBİL/TABLET PERFORMANS & BOYUT OPTİMİZASYONLARI
           ========================================= */
        @media (max-width: 1024px) {
            #gp-oyun-hub .orbit-spectacle {
                background: radial-gradient(circle at 50% 50%, rgba(0, 138, 249, 0.12), transparent 55%);
            }
            #gp-oyun-hub .animate-orbit-reveal { animation-name: orbitRevealMobile; animation-duration: 0.6s; }
            #gp-oyun-hub .animate-orbit-exit { animation-name: orbitExitMobile; animation-duration: 0.4s; }
            
            #gp-oyun-hub .bento-box:hover {
                transform: translate3d(0, -3px, 0) scale(1.01);
                box-shadow: 0 12px 24px -8px rgba(0, 138, 249, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.6);
            }
        }

        @media (max-width: 768px) {
            /* Dev GPU tasarrufu: Mobilde küçük kartlarda backdrop-filter kapatılıp, solid renk veriliyor */
            #gp-oyun-hub .bento-box {
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
                background: linear-gradient(165deg, rgba(255,255,255,0.95) 0%, rgba(243,248,253,0.95) 100%);
            }
        }

        @keyframes orbitRevealMobile {
            0% { opacity: 0; transform: translate3d(0, 16px, 0) scale(0.92); }
            100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
        }
        @keyframes orbitExitMobile {
            0% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
            100% { opacity: 0; transform: translate3d(0, -8px, 0) scale(0.92); }
        }

        @media (prefers-reduced-motion: reduce) {
            #gp-oyun-hub * {
                animation-duration: 0.001ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.001ms !important;
                scroll-behavior: auto !important;
            }
            #gp-oyun-hub.oy-technical-grid { animation: none !important; }
            #gp-oyun-hub .orbit-spectacle.is-active { animation: none !important; opacity: 0 !important; }
            #oy-toast-stack .toast-item { animation: none !important; }
            #oy-games-modal-wrapper .library-skeleton__card { animation: none !important; background: #e2e8f0 !important; }
        }
        #oy-toast-stack .toast-item {
          pointer-events: auto;
          border-radius: 1rem;
          padding: 0.875rem 1rem;
          font-size: 0.875rem;
          font-weight: 600;
          line-height: 1.35;
          box-shadow: 0 12px 40px -12px rgba(15, 23, 42, 0.2);
          border: 1px solid rgba(0, 138, 249, 0.12);
          display: flex;
          align-items: flex-start;
          gap: 0.625rem;
          animation: oyToastIn 0.35s cubic-bezier(0.22, 1, 0.36, 1) forwards;
        }
        #oy-toast-stack .toast-item.is-out { animation: oyToastOut 0.28s ease forwards; }
        #oy-toast-stack .toast-item--success { background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%); color: #065f46; border-color: rgba(16, 185, 129, 0.25); }
        #oy-toast-stack .toast-item--error { background: linear-gradient(180deg, #fef2f2 0%, #fee2e2 100%); color: #991b1b; border-color: rgba(239, 68, 68, 0.25); }
        #oy-toast-stack .toast-item--info { background: linear-gradient(180deg, #ffffff 0%, #f0f7fd 100%); color: #0f172a; }
        @keyframes oyToastIn {
          from { opacity: 0; transform: translate3d(0, 10px, 0) scale(0.96); }
          to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
        }
        @keyframes oyToastOut {
          to { opacity: 0; transform: translate3d(0, 6px, 0) scale(0.96); }
        }
        #gp-analiz-hub .ak-section-visual {
          display: block;
          width: min(980px, 100%);
          height: auto;
          margin: 0 auto clamp(1.5rem, 3.2vw, 2.25rem);
          object-fit: contain;
        }

        /* Hub bölüm görselleri — Rehberler referans (980px masaüstü) */
        @media (min-width: 1024px) {
          #gp-rehber-hub .rh-section-visual,
          #gp-dosya-hub .hmc-section-visual,
          #gp-hesap-hub .hm-section-visual,
          #gp-cark-hub .ih-section-visual,
          #gp-analiz-hub .ak-section-visual,
          #gp-checklist-hub .gc-checklist__hero img,
          #gp-arena-hub .ga-arena__hero img,
          #gp-poi-hub .gp-env-hub__hero-img,
          #ai-araclar .ai-hero-img,
          #veri-merkezi .veri-merkezi-hero img {
            width: min(980px, 100%);
            max-width: min(980px, 100%);
            height: auto;
            max-height: none;
            object-fit: contain;
          }
        }


        /* === Deprem Takibi === */
        #deprem-takibi {
          background-color: #ffffff;
        }
        #gp-deprem-hub .dt__intro .gp-section-title {
          text-align: left;
        }
        #gp-deprem-hub .dt__intro .gp-section-lead {
          max-width: 36ch;
          margin-left: 0;
          margin-right: auto;
          text-align: left;
        }


    #gp-deprem-hub.dt {
      --dt-ink: #0c1222;
      --dt-muted: #6b8299;
      --dt-brand: #008af9;
      --dt-brand-soft: #e8f4fe;
      --dt-line: rgba(12, 18, 34, 0.08);
      --dt-serif: "Instrument Serif", Georgia, serif;
      --dt-sans: "DM Sans", system-ui, sans-serif;
      --dt-ease: cubic-bezier(0.22, 1, 0.36, 1);
      position: relative;
      font-family: var(--dt-sans);
      color: var(--dt-ink);
      background: #fff;
      overflow: hidden;
    }

    #gp-deprem-hub .dt__wrap {
      max-width: 1120px;
      margin: 0 auto;
      /* phi-section zaten --section-pad ile dikey boşluk verir; çift padding önlenir */
      padding: 0 clamp(20px, 5vw, 40px);
    }

    /* Üst: başlık + görsel yan yana */
    #gp-deprem-hub .dt__hero {
      display: grid;
      grid-template-columns: 1fr;
      gap: clamp(32px, 5vw, 48px);
      align-items: end;
    }

    @media (min-width: 900px) {
      #gp-deprem-hub .dt__hero {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
        gap: clamp(24px, 4vw, 56px);
      }
    }

    #gp-deprem-hub .dt__intro {
      padding-bottom: 8px;
    }

    @media (min-width: 900px) {
      #gp-deprem-hub .dt__intro {
        padding-bottom: 48px;
      }
    }

    #gp-deprem-hub .dt__label {
      display: block;
      margin: 0 0 20px;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--dt-brand);
    }

    

    

    

    #gp-deprem-hub .dt__cta {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-top: clamp(28px, 4vw, 36px);
      padding: 0;
      border: none;
      background: none;
      font-family: inherit;
      font-size: 0.9375rem;
      font-weight: 700;
      letter-spacing: -0.01em;
      color: var(--dt-ink);
      text-decoration: none;
      cursor: pointer;
      transition: color 0.25s ease, gap 0.35s var(--dt-ease);
    }

    #gp-deprem-hub .dt__cta::after {
      content: "";
      display: block;
      width: 40px;
      height: 1px;
      background: var(--dt-ink);
      transition: width 0.35s var(--dt-ease), background 0.25s ease;
    }

    #gp-deprem-hub .dt__cta:hover,
    #gp-deprem-hub .dt__cta:focus-visible {
      color: var(--dt-brand);
      gap: 16px;
      outline: none;
    }

    #gp-deprem-hub .dt__cta:hover::after,
    #gp-deprem-hub .dt__cta:focus-visible::after {
      width: 56px;
      background: var(--dt-brand);
    }

    #gp-deprem-hub .dt__cta svg {
      width: 18px;
      height: 18px;
      flex-shrink: 0;
      transition: transform 0.35s var(--dt-ease);
    }

    #gp-deprem-hub .dt__cta:hover svg,
    #gp-deprem-hub .dt__cta:focus-visible svg {
      transform: translate(3px, -3px);
    }

    /* Görsel */
    #gp-deprem-hub .dt__media {
      position: relative;
      margin: 0;
      line-height: 0;
    }

    #gp-deprem-hub .dt__media-frame {
      position: relative;
      border-radius: 4px;
      overflow: hidden;
      background: #f6f9fc;
    }

    #gp-deprem-hub .dt__media-frame::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 48%;
      height: 3px;
      background: var(--dt-brand);
      z-index: 2;
    }

    #gp-deprem-hub .dt__media img {
      display: block;
      width: 100%;
      height: auto;
    }

    #gp-deprem-hub .dt__media-cap {
      position: absolute;
      right: 16px;
      bottom: 16px;
      padding: 8px 14px;
      border-radius: 6px;
      font-size: 0.6875rem;
      font-weight: 600;
      letter-spacing: 0.04em;
      color: var(--dt-muted);
      background: rgba(255, 255, 255, 0.94);
      border: 1px solid var(--dt-line);
      line-height: 1.3;
      z-index: 2;
    }

    /* Ayırıcı dalga */
    #gp-deprem-hub .dt__rule {
      margin: var(--section-gap) 0 calc(var(--section-gap) / var(--phi));
      height: 1px;
      background: var(--dt-line);
      position: relative;
    }

    #gp-deprem-hub .dt__rule svg {
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 120px;
      height: 24px;
      color: var(--dt-brand);
      opacity: 0.5;
    }

    /* Alt: üç sütun */
    #gp-deprem-hub .dt__cols {
      display: grid;
      grid-template-columns: 1fr;
      gap: 0;
      border-top: 1px solid var(--dt-line);
    }

    @media (min-width: 720px) {
      #gp-deprem-hub .dt__cols {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    #gp-deprem-hub .dt__col {
      padding: clamp(24px, 4vw, 32px) 0;
      border-bottom: 1px solid var(--dt-line);
    }

    @media (min-width: 720px) {
      #gp-deprem-hub .dt__col {
        padding: 32px clamp(20px, 3vw, 32px) 0 0;
        border-bottom: none;
        border-right: 1px solid var(--dt-line);
      }

      #gp-deprem-hub .dt__col:last-child {
        border-right: none;
        padding-right: 0;
      }

      #gp-deprem-hub .dt__col:not(:first-child) {
        padding-left: clamp(20px, 3vw, 32px);
      }
    }

    #gp-deprem-hub .dt__col-num {
      display: block;
      margin-bottom: 12px;
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      color: var(--dt-brand);
    }

    #gp-deprem-hub .dt__col-title {
      margin: 0 0 8px;
      font-size: 1rem;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.3;
    }

    #gp-deprem-hub .dt__col-text {
      margin: 0;
      font-size: 0.8125rem;
      font-weight: 500;
      line-height: 1.55;
      color: var(--dt-muted);
    }

    /* Dipnot */
    #gp-deprem-hub .dt__note {
      margin: calc(var(--section-gap) / var(--phi)) 0 0;
      padding-top: calc(var(--section-gap) / var(--phi));
      border-top: 1px solid var(--dt-line);
      font-size: 0.6875rem;
      font-weight: 500;
      line-height: 1.55;
      color: var(--dt-muted);
      max-width: 52ch;
    }

    @media (prefers-reduced-motion: reduce) {
      #gp-deprem-hub .dt__cta:hover,
      #gp-deprem-hub .dt__cta:hover svg {
        gap: 10px;
        transform: none;
      }
      #gp-deprem-hub .dt__cta:hover::after {
        width: 40px;
      }
    }
        /* ══ Unified section headers (Checklist reference) ══ */
        :root {
          --gp-sh-ink: #0c1222;
          --gp-sh-muted: #6b8299;
          --gp-sh-brand: #008af9;
          --gp-sh-brand-light: #5cb4fc;
        }
        .gp-section-header {
          text-align: center;
          margin-bottom: var(--section-gap);
        }
        .gp-section-title,
        #gp-checklist-hub .gc-checklist__title,
        #gp-skor-hub .gs-skor__title,
        #gp-arena-hub .ga-arena__title,
        #gp-poi-hub .gp-env-hub__title,
        #gp-konum-nabzi-hub .gp-ticker-title,
        #gp-dosya-hub .hmc-title,
        #gp-hesap-hub .hm-title,
        #gp-rehber-hub .rh-intro-title,
        .phi-header .gp-section-title {
          margin: 0;
          font-family: "Instrument Serif", Georgia, serif;
          font-size: clamp(2rem, 5.5vw, 2.65rem);
          font-weight: 400;
          line-height: 1.12;
          letter-spacing: -0.03em;
          color: var(--gp-sh-ink);
        }
        #gp-skor-hub .gs-skor__title { margin-top: 20px; }
        #gp-poi-hub .gp-env-hub__title { max-width: 20ch; margin-bottom: 14px; }
        .gp-section-title-accent,
        #gp-checklist-hub .gc-checklist__title-accent,
        #gp-skor-hub .gs-skor__title-accent,
        #gp-arena-hub .ga-arena__title-accent,
        #gp-poi-hub .gp-env-hub__title span,
        #gp-konum-nabzi-hub .gp-ticker-title span,
        #gp-hesap-hub .hm-title .hm-accent-text,
        #gp-rehber-hub .rh-intro-title-accent {
          font-style: italic;
          font-weight: 400;
          background: linear-gradient(120deg, var(--gp-sh-brand) 8%, var(--gp-sh-brand-light) 92%);
          -webkit-background-clip: text;
          background-clip: text;
          color: transparent;
          -webkit-text-fill-color: transparent;
        }
        .gp-section-lead,
        #gp-checklist-hub .gc-checklist__subtitle,
        #gp-skor-hub .gs-skor__lead,
        #gp-arena-hub .ga-arena__subtitle,
        #gp-poi-hub .gp-env-hub__lead,
        #gp-konum-nabzi-hub .gp-ticker-lead,
        #gp-dosya-hub .hmc-lead,
        #gp-hesap-hub .hm-sub,
        #gp-rehber-hub .rh-intro-desc {
          margin: 12px auto 0;
          max-width: 520px;
          font-size: clamp(0.875rem, 2.2vw, 0.95rem);
          font-weight: 500;
          color: var(--gp-sh-muted);
          line-height: 1.55;
        }
        #gp-poi-hub .gp-env-hub__lead,
        #gp-dosya-hub .hmc-lead {
          margin-left: 0;
          margin-right: auto;
        }
        #gp-poi-hub .gp-env-hub__lead { max-width: 54ch; }
        #gp-dosya-hub .hmc-lead,
        #gp-hesap-hub .hm-sub { max-width: 42rem; }
        #gp-rehber-hub .rh-intro-desc { max-width: 44rem; }
        #gp-skor-hub .gs-skor__lead { margin-top: 14px; }

        /* ══ Site açılış — PropTech vitrin ══ */
        #gp-launch-hero {
            --gl-brand: #008af9;
            --gl-brand-soft: rgba(0, 138, 249, 0.12);
            --gl-ink: #0c1222;
            --gl-muted: #64748b;
            --gl-line: rgba(0, 138, 249, 0.14);
            --gl-ease: cubic-bezier(0.22, 1, 0.36, 1);
            position: relative;
            isolation: isolate;
            margin-bottom: clamp(2.5rem, 5vw, 4rem);
            padding: clamp(1.75rem, 4vw, 3rem);
            border-radius: clamp(1.25rem, 3vw, 2rem);
            background: #f8fbff;
            border: 1px solid var(--gl-line);
            box-shadow: 0 24px 60px rgba(0, 55, 120, 0.08);
            overflow: hidden;
            text-align: center;
            contain: paint;
        }
        .gp-launch__video-bg {
            position: absolute;
            inset: 0;
            z-index: 0;
            background:
                radial-gradient(ellipse 120% 80% at 100% 0%, rgba(0, 138, 249, 0.2) 0%, transparent 55%),
                linear-gradient(165deg, #edf8ff 0%, #ffffff 100%);
            pointer-events: none;
            overflow: hidden;
            contain: paint;
        }
        .gp-launch__video-bg video {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
            opacity: 0.88;
            filter: saturate(1.06) contrast(1.04);
            transform: translateZ(0);
            backface-visibility: hidden;
            will-change: transform;
        }
        .gp-launch__badge,
        .gp-launch__pill,
        .gp-launch__cta--ghost,
        .gp-launch__card {
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            will-change: transform;
        }
        #gp-launch-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            background-image:
                linear-gradient(rgba(255, 255, 255, 0.22) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255, 255, 255, 0.2) 1px, transparent 1px);
            background-size: 32px 32px;
            mask-image: radial-gradient(ellipse 85% 75% at 50% 40%, #000 20%, transparent 100%);
            pointer-events: none;
        }
        #gp-launch-hero::after {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            background:
                radial-gradient(ellipse 90% 64% at 50% 10%, rgba(255, 255, 255, 0.76) 0%, rgba(255, 255, 255, 0.48) 48%, transparent 74%),
                linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.64) 42%, rgba(248, 251, 255, 0.94) 100%),
                linear-gradient(135deg, rgba(0, 138, 249, 0.12), rgba(56, 189, 248, 0.06));
            pointer-events: none;
        }
        #gp-launch-hero > :not(.gp-launch__video-bg) { position: relative; z-index: 2; }
        .gp-launch__badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.4rem 0.85rem;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--gl-brand);
            background: rgba(255, 255, 255, 0.74);
            border: 1px solid rgba(0, 138, 249, 0.24);
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
            backdrop-filter: blur(14px);
        }
        .gp-launch__badge-dot {
            width: 0.45rem;
            height: 0.45rem;
            border-radius: 50%;
            background: var(--gl-brand);
            box-shadow: 0 0 0 4px rgba(0, 138, 249, 0.2);
            animation: gp-launch-pulse 2.4s ease-in-out infinite;
        }
        @keyframes gp-launch-pulse {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.65; transform: scale(0.92); }
        }
        .gp-launch__hero {
            max-width: 46rem;
            margin: 1.1rem auto 0;
            text-align: center;
        }
        .gp-launch__title {
            margin: 0;
            font-family: "Instrument Serif", Georgia, serif;
            font-size: clamp(2rem, 5.5vw, 3.15rem);
            font-weight: 400;
            line-height: 1.08;
            letter-spacing: -0.03em;
            color: var(--gl-ink);
        }
        .gp-launch__title em {
            font-style: italic;
            background: linear-gradient(120deg, #008af9 8%, #38bdf8 92%);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            -webkit-text-fill-color: transparent;
        }
        .gp-launch__lead {
            margin: 0.85rem auto 0;
            max-width: 62ch;
            font-size: clamp(0.95rem, 2.2vw, 1.08rem);
            line-height: 1.62;
            color: var(--gl-muted);
        }
        .gp-launch__pills {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 0.5rem;
            margin-top: 1.1rem;
        }
        .gp-launch__pill {
            padding: 0.35rem 0.7rem;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 600;
            color: #334155;
            background: rgba(255, 255, 255, 0.72);
            border: 1px solid rgba(0, 138, 249, 0.16);
            backdrop-filter: blur(10px);
        }
        .gp-launch__cta-row {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 0.65rem;
            margin-top: 1.35rem;
        }
        .gp-launch__cta {
            display: inline-flex;
            align-items: center;
            gap: 0.45rem;
            padding: 0.7rem 1.15rem;
            border-radius: 999px;
            font-size: 0.875rem;
            font-weight: 700;
            text-decoration: none;
            transition: transform 0.22s var(--gl-ease), box-shadow 0.22s var(--gl-ease);
        }
        .gp-launch__cta--primary {
            color: #fff;
            background: linear-gradient(135deg, #0078e8, #008af9 55%, #38bdf8);
            box-shadow: 0 10px 24px rgba(0, 138, 249, 0.32);
        }
        .gp-launch__cta--ghost {
            color: var(--gl-brand);
            background: rgba(255, 255, 255, 0.82);
            border: 1px solid rgba(0, 138, 249, 0.22);
            backdrop-filter: blur(12px);
        }
        .gp-launch__cta:hover,
        .gp-launch__cta:focus-visible {
            transform: translateY(-2px);
            outline: none;
        }
        .gp-launch__shortcuts {
            margin-top: clamp(1.5rem, 3vw, 2rem);
            padding-top: clamp(1.25rem, 2.5vw, 1.75rem);
            border-top: 1px solid rgba(0, 138, 249, 0.1);
            text-align: left;
        }
        .gp-launch__grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 0.6rem;
        }
        @media (min-width: 640px) {
            .gp-launch__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; }
        }
        @media (min-width: 900px) {
            .gp-launch__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
        }
        @media (min-width: 1200px) {
            .gp-launch__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.7rem; }
        }
        .gp-launch__card {
            display: flex;
            align-items: center;
            gap: 0.7rem;
            min-height: 3.35rem;
            padding: 0.72rem 0.85rem;
            border-radius: 1rem;
            text-decoration: none;
            color: var(--gl-ink);
            background: rgba(255, 255, 255, 0.86);
            border: 1px solid rgba(0, 138, 249, 0.09);
            box-shadow: 0 2px 10px rgba(15, 23, 42, 0.03);
            backdrop-filter: blur(14px);
            transition:
                transform 0.5s var(--gl-ease),
                border-color 0.5s var(--gl-ease),
                box-shadow 0.5s var(--gl-ease),
                background 0.5s var(--gl-ease);
        }
        .gp-launch__card--glow {
            background: linear-gradient(135deg, rgba(0, 138, 249, 0.09) 0%, rgba(255, 255, 255, 0.97) 72%);
            border-color: rgba(0, 138, 249, 0.36);
            box-shadow:
                0 0 0 1px rgba(0, 138, 249, 0.14),
                0 8px 22px rgba(0, 138, 249, 0.16);
            transform: translateY(-1px);
            animation: gp-launch-card-shine 2.6s ease-in-out infinite;
        }
        @keyframes gp-launch-card-shine {
            0%, 100% {
                box-shadow:
                    0 0 0 1px rgba(0, 138, 249, 0.12),
                    0 6px 18px rgba(0, 138, 249, 0.13);
            }
            50% {
                box-shadow:
                    0 0 0 1px rgba(0, 138, 249, 0.24),
                    0 10px 28px rgba(0, 138, 249, 0.22);
            }
        }
        .gp-launch__card--glow .gp-launch__card-icon {
            background: linear-gradient(145deg, #0078e8, #008af9 55%, #38bdf8);
            color: #fff;
            box-shadow: 0 4px 14px rgba(0, 138, 249, 0.32);
        }
        .gp-launch__card--glow .gp-launch__card-title {
            color: var(--gl-brand);
        }
        .gp-launch__card--glow .gp-launch__card-desc {
            color: rgba(0, 120, 232, 0.78);
        }
        .gp-launch__card:hover,
        .gp-launch__card:focus-visible {
            transform: translateY(-2px);
            background: #fff;
            border-color: rgba(0, 138, 249, 0.24);
            box-shadow: 0 12px 28px rgba(0, 138, 249, 0.11);
            outline: none;
        }
        .gp-launch__card-icon {
            flex-shrink: 0;
            width: 2.25rem;
            height: 2.25rem;
            border-radius: 0.7rem;
            display: flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(145deg, rgba(0, 138, 249, 0.14), rgba(0, 138, 249, 0.06));
            color: var(--gl-brand);
            transition: background 0.22s var(--gl-ease), color 0.22s var(--gl-ease);
        }
        .gp-launch__card:hover .gp-launch__card-icon,
        .gp-launch__card:focus-visible .gp-launch__card-icon {
            background: var(--gl-brand);
            color: #fff;
        }
        .gp-launch__card-icon svg { width: 1.1rem; height: 1.1rem; }
        .gp-launch__card-body { min-width: 0; }
        .gp-launch__card-title {
            display: block;
            font-size: 0.78rem;
            font-weight: 700;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }
        .gp-launch__card-desc {
            display: block;
            margin-top: 0.1rem;
            font-size: 0.65rem;
            color: var(--gl-muted);
            line-height: 1.3;
        }
        .gp-launch__divider {
            display: flex;
            align-items: center;
            gap: 1rem;
            margin: clamp(2rem, 4vw, 3rem) 0 clamp(1.5rem, 3vw, 2rem);
        }
        .gp-launch__divider::before,
        .gp-launch__divider::after {
            content: "";
            flex: 1;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(0, 138, 249, 0.18), transparent);
        }
        .gp-launch__divider span {
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: #94a3b8;
            white-space: nowrap;
        }
        @media (prefers-reduced-motion: reduce) {
            .gp-launch__video-bg video { opacity: 0.74; }
            .gp-launch__badge-dot { animation: none; }
            .gp-launch__card--glow { animation: none; }
        }