/* Otomatik olarak _Layout.cshtml içinden taşındı (tarayıcı önbelleği için). Sıra korunmuştur. */
        /* PERFORMANS: büyük "blur-[Npx]" ışık lekeleri her karede GPU'da bulanıklaştırılıyordu.
           Sayfa sonundaki betik her lekenin boyutuna ve blur değerine göre aynı Gauss ışık dağılımını
           veren maskeyi hesaplar ve .glow-ok ekler. Betik çalışmazsa orijinal blur aynen kalır. */
        .glow-ok { filter: none !important; -webkit-mask-image: var(--gm); mask-image: var(--gm); }
        :root {
            --bg: #030303;
            --fg: #ffffff;
        }

        body {
            background-color: var(--bg);
            color: var(--fg);
            font-family: 'Plus Jakarta Sans', sans-serif;
            overflow-x: hidden;
            cursor: none;
        }

        .font-sync {
            font-family: 'Syncopate', sans-serif;
        }

        #preloader {
            position: fixed;
            inset: 0;
            background: var(--bg);
            z-index: 9999;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        /* ===== PRELOADER (motion graphics, yükleme çubuğu yok) ===== */
        #preloader.pl { background: transparent; overflow: hidden; }
        .pl-half { position: absolute; left: 0; right: 0; height: 50.5%; background: var(--bg); will-change: transform; }
        .pl-top { top: 0; }
        .pl-bot { bottom: 0; }
        .pl-seam { position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px; opacity: 0; transform: scaleX(0); will-change: transform, opacity;
            background: linear-gradient(90deg, transparent, #3b82f6 30%, #93c5fd 50%, #3b82f6 70%, transparent); }
        #preloader.pl { display: flex; }
        .pl-mark { position: relative; display: flex; flex-direction: column; align-items: center; }
        .pl-name { display: flex; overflow: hidden; font-family: 'Syncopate', sans-serif; font-weight: 700; font-size: clamp(30px, 6vw, 84px); line-height: 1.15; letter-spacing: .16em; padding-left: .16em; color: #fff; }
        .pl-ch { display: inline-block; transform: translateY(110%); will-change: transform; }
        .pl-dot { color: #3b82f6; letter-spacing: 0; }
        .pl-rule { width: 100%; height: 1px; margin-top: 18px; background: rgba(255,255,255,.18); transform: scaleX(0); transform-origin: left center; will-change: transform; }
        .pl-sub { margin: 14px 0 0; overflow: hidden; font-size: 10px; font-weight: 600; letter-spacing: .8em; padding-left: .8em; text-transform: uppercase; color: rgba(255,255,255,.5); opacity: 0; }

        .loader-text {
            font-family: 'Syncopate', sans-serif;
            font-size: 5vw;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5em;
            overflow: hidden;
        }

            .loader-text span {
                display: inline-block;
                transform: translateY(100%);
            }

        .cursor-dot {
            width: 8px;
            height: 8px;
            background: var(--fg);
            border-radius: 50%;
            position: fixed;
            top: 0;
            left: 0;
            pointer-events: none;
            z-index: 99999;
            mix-blend-mode: difference;
        }

        .cursor-ring {
            width: 40px;
            height: 40px;
            border: 1px solid rgba(255,255,255,0.3);
            border-radius: 50%;
            position: fixed;
            top: 0;
            left: 0;
            pointer-events: none;
            z-index: 99998;
            transition: width 0.3s, height 0.3s, background 0.3s;
        }

        .boxed-wrapper {
            margin: 1.5vw;
            border-radius: 2vw;
            border: 1px solid rgba(255,255,255,0.05);
            background: #080808;
            overflow: hidden;
            overflow: clip; /* sticky bölümler için: clip scroll container oluşturmaz */
            position: relative;
        }

        @media (max-width: 768px) {
            .boxed-wrapper {
                margin: 10px;
                border-radius: 20px;
            }
        }

        /* ================= MOBİL MENÜ ================= */
        #mobile-menu {
            position: fixed;
            inset: 0;
            z-index: 10000;
            background:
                radial-gradient(120% 60% at 100% 0%, rgba(37, 99, 235, .22), transparent 60%),
                #030304;
            clip-path: circle(0% at calc(100% - 44px) 44px);
            visibility: hidden;
            overscroll-behavior: contain;
            will-change: clip-path;
        }
        .mm-inner {
            height: 100%;
            height: 100dvh;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            padding: max(18px, env(safe-area-inset-top)) 22px max(22px, env(safe-area-inset-bottom));
        }
        .mm-top { display: flex; align-items: center; justify-content: space-between; min-height: 52px; }
        .mm-close {
            width: 48px; height: 48px; border-radius: 9999px;
            display: flex; align-items: center; justify-content: center;
            border: 1px solid rgba(255, 255, 255, .15); background: rgba(255, 255, 255, .04); color: #fff;
            transition: background .3s, transform .4s;
        }
        .mm-close:active { transform: scale(.92); background: rgba(255, 255, 255, .1); }

        .mm-nav { margin-top: 28px; flex: 1; }
        .mm-row { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, .07); }
        .mm-link { flex: 1; display: flex; align-items: baseline; gap: 16px; padding: 18px 0; min-height: 48px; }
        .mm-num { font-family: ui-monospace, monospace; font-size: 11px; color: rgba(255, 255, 255, .3); width: 22px; }
        .mm-label {
            font-family: 'Syncopate', sans-serif; font-weight: 700; text-transform: uppercase;
            font-size: clamp(22px, 7vw, 34px); letter-spacing: -.02em; line-height: 1; color: #fff;
        }
        .mm-row.is-active .mm-num { color: #3b82f6; }
        .mm-row.is-active .mm-label { color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .7); }
        .mm-arrow { font-size: 20px; color: rgba(255, 255, 255, .25); }
        .mm-toggle {
            width: 44px; height: 44px; border-radius: 9999px; flex-shrink: 0;
            display: flex; align-items: center; justify-content: center;
            border: 1px solid rgba(255, 255, 255, .12); color: #fff; font-size: 18px;
            transition: transform .4s cubic-bezier(.16, 1, .3, 1), background .3s, border-color .3s;
        }
        .mm-toggle[aria-expanded="true"] { transform: rotate(45deg); background: #2563eb; border-color: #2563eb; }

        /* Alt menü: yüksekliği GSAP açar */
        .mm-sub { height: 0; overflow: hidden; }
        .mm-sub-inner { display: flex; flex-direction: column; padding: 8px 0 14px 38px; }
        .mm-sub-link {
            display: flex; align-items: center; justify-content: space-between; gap: 12px;
            padding: 12px 0; min-height: 44px; font-size: 13px; font-weight: 600; color: rgba(255, 255, 255, .7);
            border-bottom: 1px dashed rgba(255, 255, 255, .06);
        }
        .mm-sub-link:last-child { border-bottom: 0; }
        .mm-sub-link { opacity: 0; transform: translateX(28px); }
        .mm-sub-link i { color: rgba(96, 165, 250, .8); }

        .mm-footer { margin-top: 28px; }
        .mm-cta {
            display: flex; align-items: center; justify-content: center; gap: 10px;
            min-height: 52px; padding: 0 16px; border-radius: 16px; border-width: 1px; border-style: solid;
            font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase;
        }
        /* Dokunma: hafif içe basılma + dalga (ripple) */
        .mm-cta, .mm-close, .mm-toggle, .mm-social { position: relative; overflow: hidden; -webkit-tap-highlight-color: transparent; }
        .mm-cta { transition: transform .25s cubic-bezier(.16, 1, .3, 1), filter .25s; }
        .mm-cta:active { transform: scale(.95); }
        .mm-ripple {
            position: absolute; border-radius: 9999px; pointer-events: none;
            background: rgba(255, 255, 255, .35); transform: scale(0); opacity: .7;
            animation: mm-ripple .6s ease-out forwards;
        }
        @keyframes mm-ripple { to { transform: scale(2.6); opacity: 0; } }

        /* Demo butonu: periyodik ışık süpürmesi */
        .mm-cta-shine::after {
            content: ""; position: absolute; top: 0; bottom: 0; width: 45%; left: -60%;
            background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .35), transparent);
            transform: skewX(-20deg);
            animation: mm-shine 3.2s ease-in-out infinite;
        }
        @keyframes mm-shine { 0%, 55% { left: -60%; } 85%, 100% { left: 130%; } }

        /* Telefon ikonu: çalma hareketi, WhatsApp: nabız halkası */
        #mobile-menu.active .mm-ring i { animation: mm-ring 2.4s ease-in-out infinite; transform-origin: 50% 60%; }
        @keyframes mm-ring {
            0%, 60%, 100% { transform: rotate(0); }
            64% { transform: rotate(-18deg); } 68% { transform: rotate(16deg); }
            72% { transform: rotate(-12deg); } 76% { transform: rotate(8deg); } 80% { transform: rotate(0); }
        }
        .mm-pulse::before {
            content: ""; position: absolute; inset: -1px; border-radius: inherit;
            border: 1px solid rgba(37, 211, 102, .6); opacity: 0; pointer-events: none;
        }
        #mobile-menu.active .mm-pulse::before { animation: mm-pulse 2.4s ease-out infinite 1.2s; }
        @keyframes mm-pulse { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.12); } }

        /* X butonu: dokununca döner */
        .mm-close i { transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
        .mm-close:active i { transform: rotate(90deg); }
        .mm-social { transition: transform .25s, background .25s, color .25s, border-color .25s; }
        .mm-social:active { transform: scale(.9); background: #2563eb; border-color: #2563eb; color: #fff; }

        /* ===== Mobil menü alt alan (yeniden tasarım) ===== */
        .mm-demo {
            justify-content: flex-start; gap: 14px; min-height: 0; padding: 12px 12px 12px 12px; border-radius: 20px;
            letter-spacing: 0; text-transform: none; text-align: left; color: #fff; border-color: rgba(147,197,253,.35);
            background: radial-gradient(120% 140% at 0% 0%, rgba(96,165,250,.35), transparent 55%), linear-gradient(135deg, #2563eb, #1e3a8a);
            box-shadow: 0 18px 40px -16px rgba(37,99,235,.9), inset 0 1px 0 rgba(255,255,255,.18);
        }
        .mm-demo-ico { width: 46px; height: 46px; flex-shrink: 0; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 22px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.2); }
        .mm-demo-txt { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
        .mm-demo-txt b { font-size: 15px; font-weight: 800; letter-spacing: .01em; }
        .mm-demo-txt small { font-size: 11px; font-weight: 500; color: rgba(255,255,255,.7); }
        .mm-demo-go { width: 38px; height: 38px; flex-shrink: 0; border-radius: 999px; display: flex; align-items: center; justify-content: center; background: #fff; color: #1d4ed8; font-size: 16px; transition: transform .3s cubic-bezier(.16,1,.3,1); }
        .mm-demo:active .mm-demo-go { transform: rotate(45deg); }
        .mm-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
        .mm-tile {
            justify-content: flex-start; gap: 10px; min-height: 0; padding: 10px; border-radius: 18px;
            letter-spacing: 0; text-transform: none; text-align: left; color: #fff;
            background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.09);
        }
        .mm-tile-ico { width: 38px; height: 38px; flex-shrink: 0; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 18px; color: #fff; }
        .mm-tile-call { background: linear-gradient(135deg, #60a5fa, #2563eb); box-shadow: 0 8px 18px -8px rgba(59,130,246,.9); }
        .mm-tile-wa { background: linear-gradient(135deg, #4ade80, #16a34a); box-shadow: 0 8px 18px -8px rgba(34,197,94,.9); }
        .mm-tile-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
        .mm-tile-txt b { font-size: 13px; font-weight: 800; }
        .mm-tile-txt small { font-size: 10px; font-weight: 500; color: rgba(255,255,255,.45); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .mm-tile.mm-pulse::before { border-radius: 18px; }

        .mm-social {
            width: 40px; height: 40px; border-radius: 9999px;
            display: flex; align-items: center; justify-content: center;
            border: 1px solid rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .7); font-size: 18px;
        }

        /* Giriş animasyonları GSAP ile (başlangıç durumu) */
        .mm-item, .mm-top { opacity: 0; }
        .mm-link, .mm-row > .mm-arrow, .mm-row > .mm-toggle { will-change: transform; }
        .mm-row { position: relative; }
        .mm-row::after {
            content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%;
            background: linear-gradient(90deg, #3b82f6, transparent); transform: scaleX(0); transform-origin: left;
            transition: transform .5s cubic-bezier(.16, 1, .3, 1);
        }
        .mm-row:active::after, .mm-row.is-active::after { transform: scaleX(1); }
        .mm-link:active .mm-label { color: #60a5fa; }

        /* Hamburger -> X */
        #menu-btn span { transition: transform .4s cubic-bezier(.16, 1, .3, 1), width .4s, opacity .3s; transform-origin: center; }
        body.menu-open #menu-btn span:first-child { transform: translateY(5px) rotate(45deg); width: 2rem; }
        body.menu-open #menu-btn span:last-child { transform: translateY(-5px) rotate(-45deg); width: 2rem; }
        body.menu-open { overflow: hidden; }
        /* Menü açıkken yüzen widget'lar (Steve, iletişim) menünün üstünde kalmasın */
        body.menu-open #steve-wrapper,
        body.menu-open #mobile-contact-widget { opacity: 0; visibility: hidden; pointer-events: none; }


        .text-outline {
            color: transparent;
            -webkit-text-stroke: 1px rgba(255,255,255,0.5);
        }

        html.lenis {
            height: auto;
        }

        .lenis.lenis-smooth {
            scroll-behavior: auto;
        }

        .magnetic-btn {
            display: inline-block;
            cursor: pointer;
        }

        /* Scroll Olduğunda Navbar Buzlu Cam Efekti */
        .nav-scrolled {
            background: rgba(255, 255, 255, 0.03) !important;
            backdrop-filter: blur(25px) !important;
            -webkit-backdrop-filter: blur(25px) !important;
            border: 1px solid rgba(255, 255, 255, 0.1) !important;
            border-radius: 24px;
            margin-top: 10px;
            padding: 15px 35px !important;
        }


        /* ================= FOOTER ŞOVU ================= */
        .ft-marquee-track { display: flex; width: max-content; animation: ft-marquee 38s linear infinite; }
        .ft-marquee:hover .ft-marquee-track { animation-play-state: paused; }
        .ft-marquee-group { display: flex; align-items: center; gap: 2.5rem; padding-right: 2.5rem; }
        .ft-marquee-word {
            font-family: 'Syncopate', sans-serif; font-weight: 700; text-transform: uppercase; white-space: nowrap;
            font-size: clamp(26px, 4.5vw, 56px); letter-spacing: -.02em; color: #fff;
        }
        .ft-marquee-word:nth-of-type(even) { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.45); }
        @keyframes ft-marquee { to { transform: translateX(-50%); } }

        .ft-spot {
            --fx: 50%; --fy: 30%;
            background-image: linear-gradient(rgba(59,130,246,.35) 1px, transparent 1px), linear-gradient(90deg, rgba(59,130,246,.35) 1px, transparent 1px);
            background-size: 56px 56px;
            -webkit-mask-image: radial-gradient(380px circle at var(--fx) var(--fy), #000, transparent 70%);
            mask-image: radial-gradient(380px circle at var(--fx) var(--fy), #000, transparent 70%);
            opacity: .45;
        }

        .ft-head { color: #fff; font-weight: 700; margin-bottom: 1.5rem; letter-spacing: .25em; text-transform: uppercase; font-size: 11px; display: flex; align-items: center; gap: 10px; }
        .ft-head::before { content: ""; width: 14px; height: 1px; background: #3b82f6; }
        .ft-link { position: relative; display: inline-block; font-size: 14px; color: rgba(255,255,255,.45); transition: color .3s, transform .3s; }
        .ft-link::after { content: ""; position: absolute; left: 0; bottom: -3px; height: 1px; width: 100%; background: #3b82f6; transform: scaleX(0); transform-origin: right; transition: transform .4s cubic-bezier(.16,1,.3,1); }
        .ft-link:hover { color: #fff; transform: translateX(4px); }
        .ft-link:hover::after { transform: scaleX(1); transform-origin: left; }
        .ft-social { width: 44px; height: 44px; border-radius: 9999px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.15); color: rgba(255,255,255,.6); transition: all .3s; }
        .ft-social:hover { color: #fff; border-color: transparent; transform: translateY(-4px); }

        .ft-btn-ghost::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent, rgba(255,255,255,.18), transparent); transform: translateX(-100%); transition: transform .7s; }
        .ft-btn-ghost:hover::before { transform: translateX(100%); }
        .ft-btn-ghost:hover { border-color: rgba(255,255,255,.5); }

        /* Dev yazı: scroll ile alttan ışıkla dolar (--fill GSAP ile 0%→100%) */
        .ft-giant {
            --fill: 0%;
            font-size: 15vw;
            color: transparent;
            -webkit-text-stroke: 1px rgba(59,130,246,.35);
            background-image: linear-gradient(to top, #2563eb 0%, #60a5fa calc(var(--fill) * .7), #a5f3fc var(--fill), transparent calc(var(--fill) + .5%));
            -webkit-background-clip: text;
            background-clip: text;
            filter: drop-shadow(0 0 40px rgba(37,99,235,.25));
            margin-bottom: -2.5vw;
        }
        .ft-cta-outline { transition: -webkit-text-stroke-color .4s; }
        .footer-cta:hover .ft-cta-outline { -webkit-text-stroke-color: #60a5fa; }

        /* ================= ORTAK MEGA MENÜ SİSTEMİ ================= */
        /* Tetikleyici: header yüksekliği boyunca hover alanı (fare panele inerken menü kapanmaz) */
        .mega-group { padding-block: 26px; margin-block: -26px; }
        .mega-group:hover .mega-trigger { color: rgba(255,255,255,.6); }

        /* Panel header'a göre konumlanır: her menü aynı genişlikte ve tam ortada açılır */
        .mega-panel {
            position: absolute;
            left: 50%;
            top: calc(100% + 10px);
            width: min(1080px, calc(100vw - 48px));
            display: grid;
            grid-template-columns: 250px minmax(0, 1fr);
            gap: 12px;
            padding: 12px;
            border-radius: 2rem;
            background: rgba(7, 7, 9, .97);
            border: 1px solid rgba(255, 255, 255, .08);
            box-shadow: 0 40px 120px rgba(0, 0, 0, .85), inset 0 1px 0 rgba(255, 255, 255, .04);
            text-transform: none;
            letter-spacing: normal;
            font-weight: 400;
            z-index: 60;
        }
        /* Header ile panel arasındaki boşlukta da hover kopmasın */
        .mega-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -28px; height: 28px; }

        .mega-menu-content {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transform: translate(-50%, 12px) scale(.985);
            transform-origin: top center;
            transition: opacity .3s ease, transform .5s cubic-bezier(.16, 1, .3, 1), visibility 0s linear .3s;
        }
        .group\/mega:hover .mega-menu-content {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
            transform: translate(-50%, 0) scale(1);
            transition-delay: 0s;
        }

        /* İçerikler sırayla belirir */
        .mega-anim {
            opacity: 0;
            transform: translateY(8px);
            transition: opacity .4s ease, transform .5s cubic-bezier(.16, 1, .3, 1), background-color .3s, border-color .3s;
        }
        .group\/mega:hover .mega-anim {
            opacity: 1;
            transform: none;
            transition-delay: calc(var(--d, 0) * 45ms + 60ms), calc(var(--d, 0) * 45ms + 60ms), 0s, 0s;
        }

        .mega-side {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 28px;
            padding: 28px;
            border-radius: 1.5rem;
            background: radial-gradient(120% 80% at 0% 0%, rgba(37, 99, 235, .2), transparent 60%), rgba(255, 255, 255, .02);
            border: 1px solid rgba(255, 255, 255, .05);
        }
        .mega-eyebrow { font-size: 9px; letter-spacing: .35em; text-transform: uppercase; color: #3b82f6; font-weight: 700; }
        .mega-title { font-family: 'Syncopate', sans-serif; font-weight: 700; font-size: 24px; line-height: 1.05; text-transform: uppercase; letter-spacing: -.02em; color: #fff; margin-top: 16px; }
        .mega-desc { font-size: 12px; line-height: 1.65; color: rgba(255, 255, 255, .45); margin-top: 14px; }
        .mega-cta {
            display: flex; align-items: center; justify-content: space-between; gap: 10px;
            padding: 13px 16px; border-radius: 14px;
            background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .08);
            font-size: 10px; font-weight: 700; letter-spacing: .25em; text-transform: uppercase; color: #fff;
            transition: background .3s, border-color .3s;
        }
        .mega-cta:hover { background: #2563eb; border-color: #2563eb; }

        .mega-row { display: flex; align-items: center; gap: 16px; padding: 12px 14px; border-radius: 16px; border: 1px solid transparent; }
        .mega-row:hover { background: rgba(59, 130, 246, .08); border-color: rgba(59, 130, 246, .2); }
        .mega-num {
            width: 36px; height: 36px; flex-shrink: 0; border-radius: 12px;
            display: flex; align-items: center; justify-content: center;
            font-family: ui-monospace, monospace; font-size: 10px; color: #60a5fa;
            background: rgba(59, 130, 246, .1); transition: background .3s, color .3s;
        }
        .mega-row:hover .mega-num { background: #2563eb; color: #fff; }

        @media (prefers-reduced-motion: reduce) {
            .mega-menu-content, .mega-anim { transition: opacity .2s ease, visibility 0s; transform: translate(-50%, 0); }
            .mega-anim { transform: none; }
        }

        .center_item{
            align-items: center;
        }
        /* SPLINE LOGO GİZLEME (HİLESİ) */
        #logo {
            display: none !important;
        }
        @media (max-width: 768px) {
            /* #ai-robot-wrapper { display: none !important; } — robot devre dışı */

            .cursor-dot{
                display: none !important;
            }
                .cursor-ring{
                    display: none !important;
            }
        }
        /* Yüzen İletişim Butonları İçin Animasyon */
        .floating-action-btn {
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

            .floating-action-btn:hover {
                transform: scale(1.15) translateY(-5px);
            }

        .wiggle-hover:hover i {
            animation: wiggle 1s ease-in-out infinite;
        }
        @keyframes wiggle {
            0%, 100%

        {
            transform: rotate(-10deg);
        }

        50% {
            transform: rotate(10deg);
        }

        }
    

                    @property --mcs-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
                    .mcs { position: relative; display: flex; align-items: center; gap: 14px; margin-top: 18px; padding: 12px 14px 12px 12px; border-radius: 22px; overflow: hidden; isolation: isolate;
                        background: linear-gradient(135deg, #0b1124, #070910) padding-box, conic-gradient(from var(--mcs-a), #3b82f6, #22d3ee, #a78bfa, #3b82f6) border-box;
                        border: 1px solid transparent; animation: mcs-spin 5s linear infinite; }
                    @keyframes mcs-spin { to { --mcs-a: 360deg; } }
                    .mcs-glow { position: absolute; right: -40px; top: -60px; width: 180px; height: 180px; border-radius: 50%; z-index: -1; background: radial-gradient(circle, rgba(59,130,246,.35), transparent 70%); }
                    .mcs-phone { flex: none; width: 46px; height: 92px; border-radius: 11px; padding: 3px; background: linear-gradient(160deg, #31343f, #0b0c10); transform: rotate(-8deg); box-shadow: 0 10px 24px -8px rgba(37,99,235,.7); transition: transform .5s cubic-bezier(.16,1,.3,1); }
                    .mcs:active .mcs-phone { transform: rotate(0) scale(1.05); }
                    .mcs-phone img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 8px; display: block; }
                    .mcs-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
                    .mcs-eye { display: inline-flex; align-items: center; gap: 8px; font-size: 9px; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; color: #67e8f9; }
                    .mcs-eye i { width: 6px; height: 6px; border-radius: 50%; background: #22d3ee; box-shadow: 0 0 0 0 rgba(34,211,238,.6); animation: mcs-ping 2s infinite; }
                    @keyframes mcs-ping { 70% { box-shadow: 0 0 0 7px rgba(34,211,238,0); } 100% { box-shadow: 0 0 0 0 rgba(34,211,238,0); } }
                    .mcs-title { font-family: 'Syncopate', sans-serif; font-weight: 700; font-size: 18px; letter-spacing: -.01em; text-transform: uppercase; margin-top: 6px; padding-top: .15em; background: linear-gradient(90deg, #fff, #93c5fd); -webkit-background-clip: text; background-clip: text; color: transparent; }
                    .mcs-desc { font-size: 12px; line-height: 1.4; color: rgba(255,255,255,.55); margin-top: 4px; }
                    .mcs-go { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: #050505; font-size: 15px; transition: transform .4s; }
                    .mcs:active .mcs-go { transform: rotate(45deg); }
                    @media (prefers-reduced-motion: reduce) { .mcs, .mcs-eye i { animation: none; } }
                

                    @property --ncs-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
                    .ncs { position: relative; margin-left: 6px; }
                    .ncs-pill { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 6px 0 5px; border-radius: 999px; isolation: isolate;
                        font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff;
                        background: linear-gradient(#0a0d16, #0a0d16) padding-box, conic-gradient(from var(--ncs-a), #3b82f6, #22d3ee, #a78bfa, #3b82f6) border-box;
                        border: 1px solid transparent; animation: ncs-spin 4s linear infinite; transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s; }
                    .ncs-pill:hover, .ncs:focus-within .ncs-pill, .ncs-pill.is-active { box-shadow: 0 8px 30px -8px rgba(59,130,246,.7); transform: translateY(-1px); }
                    @keyframes ncs-spin { to { --ncs-a: 360deg; } }
                    .ncs-ico { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 15px; background: linear-gradient(135deg, #2563eb, #06b6d4); transition: transform .5s cubic-bezier(.34,1.56,.64,1); }
                    .ncs-pill:hover .ncs-ico { transform: rotate(-14deg) scale(1.08); }
                    .ncs-new { font-size: 9px; letter-spacing: .12em; padding: 4px 7px; border-radius: 999px; color: #a5f3fc; background: rgba(34,211,238,.12); border: 1px solid rgba(34,211,238,.3); }
                    .ncs-pop { position: absolute; top: 100%; right: -40px; padding-top: 18px; opacity: 0; visibility: hidden; transform: translateY(8px) scale(.98); transform-origin: top right;
                        transition: opacity .3s, transform .4s cubic-bezier(.16,1,.3,1), visibility 0s linear .3s; z-index: 60; }
                    .ncs:hover .ncs-pop, .ncs:focus-within .ncs-pop { opacity: 1; visibility: visible; transform: none; transition: opacity .3s, transform .4s cubic-bezier(.16,1,.3,1), visibility 0s; }
                    .ncs-card { width: 400px; display: grid; grid-template-columns: 120px 1fr; gap: 20px; padding: 18px; border-radius: 24px; background: rgba(10,12,18,.96);
                        border: 1px solid rgba(255,255,255,.1); box-shadow: 0 40px 80px -20px rgba(0,0,0,.9), 0 0 0 1px rgba(59,130,246,.08); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
                    .ncs-phone { height: 230px; border-radius: 20px; padding: 5px; background: linear-gradient(160deg, #31343f, #0b0c10); box-shadow: 0 20px 40px -12px rgba(37,99,235,.6); transform: rotate(-4deg); transition: transform .6s cubic-bezier(.16,1,.3,1); }
                    .ncs:hover .ncs-phone { transform: rotate(0) translateY(-4px); }
                    .ncs-phone img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 16px; display: block; }
                    .ncs-body { display: flex; flex-direction: column; min-width: 0; text-transform: none; letter-spacing: 0; }
                    .ncs-eye { font-size: 10px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; color: #93c5fd; }
                    .ncs-body b { font-family: 'Syncopate', sans-serif; font-size: 15px; line-height: 1.25; margin-top: 10px; color: #fff; text-transform: uppercase; }
                    .ncs-body p { font-size: 13px; line-height: 1.55; color: rgba(255,255,255,.55); margin: 10px 0 0; font-weight: 400; }
                    .ncs-body ul { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 6px; font-size: 12px; color: rgba(255,255,255,.8); font-weight: 500; }
                    .ncs-body li { display: flex; align-items: center; gap: 7px; } .ncs-body li i { color: #34d399; }
                    .ncs-actions { display: flex; align-items: center; gap: 14px; margin-top: auto; padding-top: 14px; }
                    .ncs-go { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 16px; border-radius: 999px; background: #fff; color: #050505; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; transition: background .3s, color .3s; }
                    .ncs-go:hover { background: #2563eb; color: #fff; }
                    .ncs-ext { font-size: 12px; color: rgba(255,255,255,.55); font-weight: 500; transition: color .3s; } .ncs-ext:hover { color: #fff; }
                    /* Navbar sığdırma: genişlik azaldıkça önce rozet, sonra "Hemen Ara" yazısı gizlenir, aralıklar daralır */
                    @media (max-width: 1600px) { .center_item { gap: 34px !important; } .ncs-new { display: none; } .nb-actions { margin-left: 16px !important; } }
                    @media (max-width: 1440px) { .center_item { gap: 26px !important; } .nb-ghost > span:last-child { display: none; } .nb-ghost { padding: 0 14px !important; } }
                    @media (max-width: 1180px) { .center_item { gap: 18px !important; letter-spacing: .2em; } .ncs-txt { display: none; } .ncs-pill { padding: 0 5px; } }
                    @media (prefers-reduced-motion: reduce) { .ncs-pill { animation: none; } }
                

                    .nb-actions { display: flex; align-items: center; gap: 10px; margin-left: 28px; }
                    .nb-btn { position: relative; display: inline-flex; align-items: center; gap: 10px; height: 44px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; white-space: nowrap; transition: background-color .35s, color .35s, border-color .35s, box-shadow .35s; }
                    .nb-btn i { font-size: 16px; }
                    .nb-ghost { padding: 0 20px; color: rgba(255,255,255,.8); border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.03); }
                    .nb-ghost:hover { color: #fff; border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.07); }
                    .nb-live { width: 6px; height: 6px; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 0 rgba(16,185,129,.6); animation: nb-ping 2s infinite; }
                    @keyframes nb-ping { 70% { box-shadow: 0 0 0 7px rgba(16,185,129,0); } 100% { box-shadow: 0 0 0 0 rgba(16,185,129,0); } }
                    .nb-primary { padding: 0 6px 0 22px; background: #fff; color: #050505; }
                    .nb-primary:hover { background: #2563eb; color: #fff; box-shadow: 0 10px 30px -10px rgba(37,99,235,.8); }
                    .nb-go { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: #050505; color: #fff; transition: transform .35s, background-color .35s; }
                    .nb-go i { font-size: 13px; }
                    .nb-primary:hover .nb-go { background: #fff; color: #2563eb; transform: rotate(45deg); }
                    @media (max-width: 1200px) { .nb-ghost > span:last-child { display: none; } .nb-ghost { padding: 0 14px; } }
                

        /* ---- WRAPPER ---- */
        #steve-wrapper { position:fixed; bottom:24px; right:24px; z-index:9000; display:flex; flex-direction:column; align-items:flex-end; gap:10px; pointer-events:none; }
        #steve-wrapper > * { pointer-events:auto; }

        /* ---- ROBOT KARAKTERİ (ORB) ---- */
        :root {
          --grad-a: #ffffff; --grad-b: #a8d8ff; --grad-c: #4fa8f0;
          --grad-d: #1a6ec7; --grad-e: #0a4fa8; --grad-f: #ffffff;
        }
        #steve-char { position:relative; width:100px; height:100px; cursor:pointer; }
        #steve-char.jump { animation: steveJump .55s cubic-bezier(.34,1.56,.64,1); }
        @keyframes steveJump {
          0%   { transform: translateY(0); }
          35%  { transform: translateY(-26px) scale(1.04, .96); }
          55%  { transform: translateY(0) scale(.97, 1.03); }
          75%  { transform: translateY(-8px); }
          100% { transform: translateY(0); }
        }
        .steve-orb-glow {
          position:absolute; inset:-16px; border-radius:50%;
          background: conic-gradient(from -100deg, var(--grad-a) 0%, var(--grad-b) 18%, var(--grad-c) 38%, var(--grad-d) 55%, var(--grad-e) 70%, var(--grad-f) 85%, var(--grad-a) 100%);
          filter:blur(28px); opacity:.5; animation:steveOrbSpin 14s linear infinite;
        }
        .steve-orb-ring {
          position:absolute; inset:0; border-radius:50%;
          background: conic-gradient(from -100deg, var(--grad-a) 0%, var(--grad-b) 18%, var(--grad-c) 38%, var(--grad-d) 55%, var(--grad-e) 70%, var(--grad-f) 85%, var(--grad-a) 100%);
          animation:steveOrbSpin 14s linear infinite;
        }
        .steve-orb-ring::after { content:''; position:absolute; inset:7px; border-radius:50%; background:#000; }
        @keyframes steveOrbSpin { to { transform: rotate(360deg); } }
        #steve-char.thinking .steve-orb-ring,
        #steve-char.thinking .steve-orb-glow { animation-duration:1.3s; }
        .steve-orb-face { position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center; }
        .steve-orb-eyes { display:flex; gap:26px; transition:opacity .25s ease, transform .25s ease; }
        .steve-eye-track { display:inline-flex; transition:transform .22s cubic-bezier(.34,1.56,.64,1); }
        .steve-eye { width:8px; height:24px; border-radius:4px; background:#f5f6fa; box-shadow:0 0 8px rgba(255,255,255,.4); transform-origin:center; }
        .steve-eye.blink { animation:steveBlinkAnim .22s ease-in-out; }
        @keyframes steveBlinkAnim { 0%{transform:scaleY(1);} 45%{transform:scaleY(.08);} 100%{transform:scaleY(1);} }
        .steve-orb-dots { position:absolute; display:flex; gap:9px; opacity:0; transform:scale(.7); transition:opacity .25s ease, transform .25s ease; }
        .steve-orb-dot { width:9px; height:9px; border-radius:50%; background:#f5f6fa; animation:steveOrbDotPulse 1.1s infinite ease-in-out; }
        .steve-orb-dot:nth-child(2) { animation-delay:.15s; }
        .steve-orb-dot:nth-child(3) { animation-delay:.3s; }
        @keyframes steveOrbDotPulse { 0%,80%,100%{transform:translateY(0);opacity:.35;} 40%{transform:translateY(-5px);opacity:1;} }
        #steve-char.thinking .steve-orb-eyes { opacity:0; transform:scale(.6); }
        #steve-char.thinking .steve-orb-dots { opacity:1; transform:scale(1); }

        /* ---- KONUŞMA BALONU ---- */
        #steve-bubble { position:relative; background:#fff; color:#0a0a0a; font-size:13px; font-weight:700; padding:10px 18px; border-radius:20px 20px 4px 20px; box-shadow:0 8px 32px rgba(26,110,199,0.18),0 2px 8px rgba(0,0,0,0.12); white-space:nowrap; animation:steveBubbleIn 0.5s cubic-bezier(0.34,1.56,0.64,1) both 0.5s; overflow:hidden; min-width:90px; text-align:center; }
        #steve-bubble::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(79,168,240,0.08),transparent); pointer-events:none; }
        @keyframes steveBubbleIn { from{opacity:0;transform:scale(0.6) translateY(14px);} to{opacity:1;transform:scale(1) translateY(0);} }
        #steve-bubble-hi { display:block; }
        #steve-bubble-name { display:none; font-size:16px; font-weight:900; letter-spacing:0.06em; background:linear-gradient(135deg,#1a6ec7,#4fa8f0); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
        @keyframes sbHiOut { 0%{opacity:1;transform:scale(1);} 100%{opacity:0;transform:scale(0.7) translateY(-8px);} }
        @keyframes sbNameIn { 0%{opacity:0;transform:scale(0.5) translateY(8px);} 70%{transform:scale(1.12) translateY(-2px);} 100%{opacity:1;transform:scale(1) translateY(0);} }
        @keyframes sbNamePulse { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:0.75;transform:scale(0.97);} }

        /* ---- CHAT PENCERESİ ---- */
        #steve-window { width:360px; max-height:580px; background:#050508; border:1px solid rgba(79,168,240,0.2); border-radius:24px; box-shadow:0 40px 100px rgba(0,0,0,0.95),0 0 0 1px rgba(255,255,255,0.04),inset 0 1px 0 rgba(255,255,255,0.06); display:flex; flex-direction:column; overflow:hidden; backdrop-filter:blur(24px); transform:scale(0.85) translateY(20px); opacity:0; pointer-events:none; transition:transform 0.4s cubic-bezier(0.34,1.4,0.64,1),opacity 0.3s ease; transform-origin:bottom right; }
        #steve-window.open { transform:scale(1) translateY(0); opacity:1; pointer-events:auto; }
        #steve-messages { flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; scrollbar-width:thin; scrollbar-color:rgba(79,168,240,0.2) transparent; }
        #steve-messages::-webkit-scrollbar { width:4px; }
        #steve-messages::-webkit-scrollbar-thumb { background:rgba(79,168,240,0.25); border-radius:99px; }
        .steve-msg-bot { animation:steveMsgIn 0.35s cubic-bezier(0.34,1.4,0.64,1) both; display:flex; gap:8px; align-items:flex-end; }
        .steve-msg-user { animation:steveMsgRight 0.3s cubic-bezier(0.34,1.4,0.64,1) both; display:flex; justify-content:flex-end; }
        @keyframes steveMsgIn { from{opacity:0;transform:translateY(12px) scale(0.9);} to{opacity:1;transform:none;} }
        @keyframes steveMsgRight { from{opacity:0;transform:translateX(12px) scale(0.9);} to{opacity:1;transform:none;} }
        .steve-bubble-bot { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:18px 18px 18px 4px; padding:10px 14px; font-size:13.5px; color:rgba(255,255,255,0.88); line-height:1.6; max-width:82%; }
        .steve-bubble-user { background:linear-gradient(135deg,rgba(26,110,199,0.7),rgba(10,79,168,0.6)); border:1px solid rgba(79,168,240,0.3); border-radius:18px 18px 4px 18px; padding:10px 14px; font-size:13.5px; color:white; line-height:1.6; max-width:82%; }
        .steve-avatar-sm { position:relative; width:28px; height:28px; flex-shrink:0; border-radius:50%; }
        .steve-avatar-sm .sav-glow { position:absolute; inset:-4px; border-radius:50%; background:conic-gradient(from -100deg,#fff 0%,#a8d8ff 25%,#4fa8f0 50%,#1a6ec7 75%,#fff 100%); filter:blur(6px); opacity:.5; animation:steveOrbSpin 4s linear infinite; }
        .steve-avatar-sm .sav-ring { position:absolute; inset:0; border-radius:50%; background:conic-gradient(from -100deg,#fff 0%,#a8d8ff 25%,#4fa8f0 50%,#1a6ec7 75%,#fff 100%); animation:steveOrbSpin 4s linear infinite; }
        .steve-avatar-sm .sav-ring::after { content:''; position:absolute; inset:2px; border-radius:50%; background:#050508; }
        .steve-avatar-sm .sav-face { position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center; gap:4px; }
        .sav-eye { width:3px; height:8px; border-radius:2px; background:#fff; box-shadow:0 0 4px rgba(255,255,255,.5); animation:savBlink 3.5s ease-in-out infinite; }
        .sav-eye:nth-child(2) { animation-delay:0.05s; }
        @keyframes savBlink { 0%,88%,100%{transform:scaleY(1);} 92%{transform:scaleY(.08);} }
        .steve-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#4fa8f0; animation:steveBounceDot 1.2s ease-in-out infinite; }
        @keyframes steveBounceDot { 0%,80%,100%{transform:translateY(0);opacity:0.4;} 40%{transform:translateY(-5px);opacity:1;} }
        .steve-inp { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:14px; padding:10px 14px; color:white; font-size:13px; outline:none; transition:border-color 0.2s,box-shadow 0.2s; width:100%; }
        .steve-inp:focus { border-color:rgba(79,168,240,0.6); box-shadow:0 0 0 3px rgba(79,168,240,0.1); }
        .steve-inp::placeholder { color:rgba(255,255,255,0.2); }
        /* ---- HIZLI BUTONLAR ---- */
        #steve-quick { flex-shrink:0; padding:0 14px 12px; display:flex; flex-wrap:wrap; gap:7px; }
        .steve-qbtn { border:1px solid rgba(79,168,240,0.25); background:rgba(79,168,240,0.06); color:rgba(255,255,255,0.75); font-size:11.5px; padding:6px 12px; border-radius:20px; cursor:pointer; white-space:nowrap; transition:all 0.2s; animation:steveMsgIn 0.35s cubic-bezier(0.34,1.4,0.64,1) both; }
        .steve-qbtn:hover { background:rgba(79,168,240,0.18); border-color:rgba(79,168,240,0.6); color:white; transform:translateY(-1px); }
        .steve-qbtn:active { transform:scale(0.96); }

        /* ===== Tasarım yenilemesi ===== */
        #steve-window {
            background:
                radial-gradient(120% 60% at 100% 0%, rgba(37,99,235,.16), transparent 55%),
                linear-gradient(180deg, #07080d, #040407);
            border-color: rgba(96,165,250,.22);
        }
        .steve-head { position: relative; background: linear-gradient(135deg, rgba(37,99,235,.14), rgba(34,211,238,.04)); }
        .steve-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(96,165,250,.6), rgba(34,211,238,.4), transparent); }
        .steve-badge { font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; color: #a5f3fc; background: rgba(34,211,238,.1); border: 1px solid rgba(34,211,238,.3); }
        #steve-messages {
            background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
            background-size: 22px 22px;
        }
        .steve-bubble-bot { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.09); box-shadow: 0 6px 20px -10px rgba(0,0,0,.6); word-break: break-word; }
        .steve-bubble-user { background: linear-gradient(135deg, #2563eb, #1d4ed8); border-color: rgba(147,197,253,.35); box-shadow: 0 10px 24px -12px rgba(37,99,235,.8); word-break: break-word; }
        #steve-input-area .steve-inp { border-radius: 999px; padding: 12px 18px; }
        #steve-input-area button { border-radius: 999px !important; background: linear-gradient(135deg, #3b82f6, #22d3ee) !important; }
        .steve-foot { margin: 0; padding: 0 16px 12px; text-align: center; font-size: 10px; color: rgba(255,255,255,.3); }
        .steve-qbtn { font-weight: 600; }
        #steve-bubble { font-family: 'Plus Jakarta Sans', sans-serif; }

        /* ===== Mobil: daha küçük karakter, tam genişlik alttan açılan pencere ===== */
        @media (max-width: 640px) {
            #steve-wrapper { bottom: 14px; right: 14px; gap: 6px; }
            #steve-char { width: 62px; height: 62px; }
            .steve-orb-glow { inset: -10px; filter: blur(18px); }
            .steve-orb-ring::after { inset: 5px; }
            .steve-orb-eyes { gap: 15px; }
            .steve-eye { width: 6px; height: 15px; }
            .steve-orb-dot { width: 6px; height: 6px; }
            .steve-orb-dots { gap: 6px; }
            #steve-bubble { font-size: 11px; padding: 7px 12px; min-width: 70px; }
            #steve-bubble-name { font-size: 13px; }

            #steve-window {
                position: fixed; left: 0; right: 0; bottom: 0;
                width: 100%; max-height: none; height: min(82dvh, 640px);
                border-radius: 24px 24px 0 0; border-bottom: 0;
                transform: translateY(100%); transform-origin: bottom center;
                padding-bottom: env(safe-area-inset-bottom);
            }
            #steve-window.open { transform: translateY(0); }
            /* Pencere açıkken karakter ve balon gizlenir (pencerenin altında kalmasın) */
            #steve-wrapper:has(#steve-window.open) #steve-char,
            #steve-wrapper:has(#steve-window.open) #steve-bubble { opacity: 0; pointer-events: none; transform: scale(.6); }
            #steve-char, #steve-bubble { transition: opacity .25s, transform .25s; }
            /* Hızlı butonlar tek satırda yatay kayar (yer kaplamaz) */
            #steve-quick { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
            #steve-quick::-webkit-scrollbar { display: none; }
            .steve-inp { font-size: 16px; } /* iOS'ta odaklanınca sayfa zoom yapmasın */
        }
    

        /* ===== Mobil hızlı iletişim kapsülü (Steve ile aynı hizada, sol alt) ===== */
        #mobile-contact-widget {
            position: fixed; left: 14px; bottom: 14px; z-index: 8990;
            display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 5px;
            border-radius: 999px;
            background: rgba(8, 10, 18, .72);
            border: 1px solid rgba(255, 255, 255, .12);
            backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
            box-shadow: 0 14px 40px -12px rgba(0, 0, 0, .8), inset 0 1px 0 rgba(255, 255, 255, .06);
            opacity: 0; transform: translateY(24px) scale(.9); pointer-events: none;
            transition: opacity .4s ease, transform .5s cubic-bezier(.16, 1, .3, 1);
        }
        #mobile-contact-widget.is-visible { opacity: 1; transform: none; pointer-events: auto; }
        .mcw-btn {
            position: relative; width: 46px; height: 46px; border-radius: 999px;
            display: flex; align-items: center; justify-content: center; color: #fff; font-size: 21px;
            transition: transform .2s ease;
            -webkit-tap-highlight-color: transparent;
        }
        .mcw-btn:active { transform: scale(.9); }
        .mcw-call { background: linear-gradient(135deg, #3b82f6, #1d4ed8); box-shadow: 0 6px 18px -6px rgba(59, 130, 246, .8); }
        .mcw-wa { background: linear-gradient(135deg, #34d399, #059669); box-shadow: 0 6px 18px -6px rgba(16, 185, 129, .8); }
        .mcw-wa::after {
            content: ""; position: absolute; inset: -3px; border-radius: inherit; border: 2px solid rgba(52, 211, 153, .55);
            animation: mcw-pulse 2.6s ease-out infinite; pointer-events: none;
        }
        @keyframes mcw-pulse { 0% { opacity: .9; transform: scale(.92); } 70%, 100% { opacity: 0; transform: scale(1.25); } }
        .mcw-sep { width: 18px; height: 1px; background: rgba(255, 255, 255, .14); }

        /* Steve penceresi açıkken, mobil menü açıkken veya kampanya alt çubuğu görünürken kapsül gizlenir */
        body:has(#steve-window.open) #mobile-contact-widget,
        body.menu-open #mobile-contact-widget,
        body:has(#kmp-dock.is-on) #mobile-contact-widget { opacity: 0 !important; transform: translateY(24px) scale(.9) !important; pointer-events: none !important; }
        /* Kampanya alt çubuğu görünürken Steve çubuğun üstüne kalkar */
        @media (max-width: 767px) {
            #steve-wrapper { transition: bottom .4s cubic-bezier(.16, 1, .3, 1); }
            /* Steve yerinde kalır; kampanya çubuğu sağdan kısalarak yanına hizalanır */
        }
        @media (prefers-reduced-motion: reduce) { .mcw-wa::after { animation: none; } }
    

        #km-saver {
            position: fixed; inset: 0; z-index: 10000; opacity: 0; visibility: hidden; cursor: none;
            background: #020308; transition: opacity .9s ease, visibility 0s linear .9s;
        }
        #km-saver.on { opacity: 1; visibility: visible; transition: opacity 1.2s ease, visibility 0s; }
        #km-saver-rain {
            position: absolute; inset: 0;
            --dr-bg-0: #020308; --dr-bg-1: #04060d; --dr-bg-2: #071230;
            --dr-calm: #3b82f6; --dr-mid: #22d3ee; --dr-hot: #a5b4fc; --dr-core: #eaf4ff;
            --dr-vignette: .75; --dr-grain: .05; --dr-bloom-blur: 10px; --dr-bloom-opacity: .7;
        }
        #km-saver .dr-root { position: absolute; inset: 0; overflow: hidden; pointer-events: none;
            background: radial-gradient(120% 80% at 50% 40%, var(--dr-bg-2) 0%, transparent 60%), linear-gradient(180deg, var(--dr-bg-1), var(--dr-bg-0)); }
        #km-saver .dr-root canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
        #km-saver .dr-bloom { opacity: var(--dr-bloom-opacity); mix-blend-mode: screen; }
        #km-saver .dr-vignette { position: absolute; inset: 0; background: radial-gradient(ellipse at center, transparent 30%, rgba(2,3,8,var(--dr-vignette)) 100%); }
        #km-saver .dr-grain { display: none; }
        .kss-content { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none;
            background: radial-gradient(40% 35% at 50% 50%, rgba(2,3,8,.55), transparent 70%); }
        .kss-eyebrow { display: flex; align-items: center; gap: 14px; margin: 0; font-size: 10px; font-weight: 700; letter-spacing: .5em; text-transform: uppercase; color: rgba(147,197,253,.7); }
        .kss-eyebrow span { width: 34px; height: 1px; background: #3b82f6; }
        .kss-time { margin-top: 14px; font-family: 'Syncopate', sans-serif; font-weight: 700; font-size: clamp(64px, 16vw, 200px); line-height: 1; letter-spacing: -.02em; color: #fff; font-variant-numeric: tabular-nums;
            text-shadow: 0 0 60px rgba(59,130,246,.35); }
        .kss-date { margin: 14px 0 0; font-size: 12px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: rgba(255,255,255,.55); }
        .kss-brand { margin-top: 40px; font-family: 'Syncopate', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .4em; color: rgba(255,255,255,.85); }
        .kss-brand b { color: #3b82f6; }
        .kss-hint { position: absolute; left: 0; right: 0; bottom: 34px; margin: 0; text-align: center; font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(255,255,255,.35);
            animation: kss-breathe 2.8s ease-in-out infinite; }
        @keyframes kss-breathe { 50% { opacity: .35; } }
        #km-saver.on .kss-time, #km-saver.on .kss-eyebrow, #km-saver.on .kss-date, #km-saver.on .kss-brand { animation: kss-in 1.4s cubic-bezier(.16,1,.3,1) both; }
        #km-saver.on .kss-eyebrow { animation-delay: .2s; } #km-saver.on .kss-time { animation-delay: .35s; }
        #km-saver.on .kss-date { animation-delay: .5s; } #km-saver.on .kss-brand { animation-delay: .65s; }
        @keyframes kss-in { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }