:root,
html[data-theme="dark"]{
    --bg:#030405;
    --card:#0a0c12;
    --card-hover:#0f121a;
    --text:#f0f2f5;
    --muted:#7b8594;
    --accent:#3b9eff;
    --accent2:#5a7fff;
    --accent3:#00d4aa;
    --accent-glow:rgba(59,158,255,0.5);
    --accent2-glow:rgba(90,127,255,0.4);
    --border:rgba(255,255,255,0.06);
    --border-hover:rgba(59,158,255,0.3);
    --nav-bg:rgba(3,4,5,0.72);
    --nav-bg-scrolled:rgba(3,4,5,0.92);
    --glass:rgba(8,10,16,0.92);
    --btn-secondary-border:rgba(255,255,255,0.15);
    --shadow-deep:rgba(0,0,0,0.4);
    --radius:24px;
    --radius-sm:16px;
    --transition:0.5s cubic-bezier(0.4,0,0.2,1);
}
html[data-theme="light"]{
    --bg:#e8eef5;
    --card:#ffffff;
    --card-hover:#f4f8fc;
    --text:#0b1724;
    --muted:#516074;
    --accent:#1578d4;
    --accent2:#1f6fd1;
    --accent3:#0aa87a;
    --accent-glow:rgba(21,120,212,0.35);
    --accent2-glow:rgba(31,111,209,0.28);
    --border:rgba(11,23,36,0.08);
    --border-hover:rgba(21,120,212,0.35);
    --nav-bg:rgba(232,238,245,0.78);
    --nav-bg-scrolled:rgba(232,238,245,0.94);
    --glass:rgba(255,255,255,0.88);
    --btn-secondary-border:rgba(11,23,36,0.16);
    --shadow-deep:rgba(20,40,70,0.12);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Space Grotesk',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;line-height:1.6;transition:background .35s ease,color .35s ease;}
::selection{background:var(--accent);color:#fff;}
::-webkit-scrollbar{width:6px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--accent);border-radius:3px;}

/* AMBIENT */
.ambient-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.ambient-bg .orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:0.12;animation:orbFloat 20s ease-in-out infinite;}
.ambient-bg .orb:nth-child(1){width:600px;height:600px;background:var(--accent);top:-200px;left:-100px;animation-delay:0s;}
.ambient-bg .orb:nth-child(2){width:500px;height:500px;background:var(--accent2);bottom:-150px;right:-100px;animation-delay:-7s;animation-duration:25s;}
.ambient-bg .orb:nth-child(3){width:400px;height:400px;background:var(--accent3);top:50%;left:50%;transform:translate(-50%,-50%);animation-delay:-14s;animation-duration:18s;}
@keyframes orbFloat{0%,100%{transform:translate(0,0) scale(1);}25%{transform:translate(50px,-30px) scale(1.1);}50%{transform:translate(-30px,50px) scale(0.9);}75%{transform:translate(20px,20px) scale(1.05);}}

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

/* NAV */
nav{position:fixed;top:0;width:100%;z-index:1000;backdrop-filter:blur(20px) saturate(180%);background:var(--nav-bg);border-bottom:1px solid var(--border);transition:var(--transition);}
nav.scrolled{background:var(--nav-bg-scrolled);border-bottom-color:var(--border-hover);}
.nav-inner{width:min(1200px,92%);margin:auto;height:72px;display:flex;align-items:center;justify-content:space-between;}
.logo-mini{font-family:'Orbitron',sans-serif;font-weight:700;font-size:16px;letter-spacing:2px;cursor:pointer;transition:var(--transition);}
.logo-mini:hover{transform:scale(1.05);}
.logo-mini .accent-3{color:var(--accent);display:inline-block;animation:logoPulse 3s ease-in-out infinite;}
.logo-mini .accent-4{color:var(--accent2);display:inline-block;animation:logoPulse 3s ease-in-out infinite 0.5s;}
@keyframes logoPulse{0%,100%{opacity:1;text-shadow:0 0 20px var(--accent-glow);}50%{opacity:0.8;text-shadow:0 0 40px var(--accent-glow),0 0 60px var(--accent2-glow);}}
.menu{display:flex;gap:22px;align-items:center;}
.menu a{color:var(--muted);text-decoration:none;font-size:14px;font-weight:500;letter-spacing:0.5px;position:relative;transition:var(--transition);padding:4px 0;}
.menu a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:var(--transition);border-radius:1px;}
.menu a:hover{color:var(--text);}
.menu a:hover::after{width:100%;}
.menu .cta-nav{padding:10px 22px;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#041018;font-weight:700;font-size:13px;transition:var(--transition);border:none;cursor:pointer;text-decoration:none;}
.menu .cta-nav:hover{transform:translateY(-2px);box-shadow:0 8px 30px var(--accent-glow);}
.menu .cta-nav::after{display:none;}
.ui-controls{display:flex;align-items:center;gap:12px;}

/* Language segmented control */
.lang-switch{
    position:relative;
    display:grid;
    grid-template-columns:1fr 1fr;
    width:86px;
    height:34px;
    padding:3px;
    border-radius:999px;
    border:1px solid rgba(59,158,255,0.22);
    background:linear-gradient(180deg,rgba(255,255,255,0.04),rgba(255,255,255,0.01));
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.06),0 8px 24px rgba(0,0,0,0.18);
    backdrop-filter:blur(12px);
    overflow:hidden;
}
.lang-switch .seg-thumb{
    position:absolute;
    top:3px;left:3px;
    width:calc(50% - 3px);
    height:calc(100% - 6px);
    border-radius:999px;
    background:linear-gradient(135deg,var(--accent),var(--accent2));
    box-shadow:0 4px 14px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,0.35);
    transition:transform .35s cubic-bezier(.22,1,.36,1);
    z-index:0;
}
.lang-switch[data-active="en"] .seg-thumb{transform:translateX(100%);}
.lang-switch button{
    position:relative;z-index:1;
    border:0;background:transparent;cursor:pointer;
    color:var(--muted);
    font:700 11px/1 'Orbitron',sans-serif;
    letter-spacing:1.5px;
    transition:color .25s ease,text-shadow .25s ease;
}
.lang-switch button.is-active{color:#041018;text-shadow:0 0 12px rgba(255,255,255,0.25);}
html[data-theme="light"] .lang-switch{
    border-color:rgba(21,120,212,0.22);
    background:linear-gradient(180deg,rgba(255,255,255,0.85),rgba(255,255,255,0.55));
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),0 8px 20px rgba(20,40,70,0.08);
}

/* Theme toggle */
.theme-toggle{
    border:0;background:transparent;padding:0;cursor:pointer;
    display:inline-flex;align-items:center;justify-content:center;
}
.theme-toggle-track{
    position:relative;
    width:58px;height:34px;
    border-radius:999px;
    border:1px solid rgba(59,158,255,0.22);
    background:linear-gradient(135deg,#0b1220,#121a2b);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.06),0 8px 24px rgba(0,0,0,0.22);
    display:block;overflow:hidden;
    transition:background .35s ease,border-color .35s ease,box-shadow .35s ease;
}
.theme-toggle.is-light .theme-toggle-track{
    background:linear-gradient(135deg,#dce9f8,#f5f9ff);
    border-color:rgba(21,120,212,0.28);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),0 8px 20px rgba(20,40,70,0.1);
}
.theme-ico{
    position:absolute;top:50%;width:14px;height:14px;
    transform:translateY(-50%);
    fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
    transition:opacity .25s ease,transform .35s ease,color .25s ease;
}
.theme-ico.moon{left:9px;color:#9ec9ff;opacity:1;}
.theme-ico.sun{right:9px;color:#f0b429;opacity:.35;transform:translateY(-50%) scale(.85);}
.theme-toggle.is-light .theme-ico.moon{opacity:.35;transform:translateY(-50%) scale(.85);}
.theme-toggle.is-light .theme-ico.sun{opacity:1;transform:translateY(-50%) scale(1);}
.theme-knob{
    position:absolute;top:3px;left:3px;
    width:26px;height:26px;border-radius:50%;
    background:linear-gradient(160deg,#f4f8ff,#c9daf5);
    box-shadow:0 4px 12px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.8);
    transition:transform .38s cubic-bezier(.22,1,.36,1),background .35s ease,box-shadow .35s ease;
}
.theme-toggle.is-light .theme-knob{
    transform:translateX(24px);
    background:linear-gradient(160deg,#fff,#ffe7a3);
    box-shadow:0 4px 14px rgba(240,180,40,0.35),inset 0 1px 0 rgba(255,255,255,0.9);
}
.theme-toggle:hover .theme-toggle-track{border-color:var(--accent);box-shadow:0 0 0 3px rgba(59,158,255,0.12),0 8px 24px rgba(0,0,0,0.2);}
.theme-toggle:focus-visible{outline:none;}
.theme-toggle:focus-visible .theme-toggle-track{box-shadow:0 0 0 3px rgba(59,158,255,0.28);}
.lang-switch:focus-within{box-shadow:0 0 0 3px rgba(59,158,255,0.18),inset 0 1px 0 rgba(255,255,255,0.06);}

.mobile-controls{margin:18px 0 8px;justify-content:center;transform:scale(1.08);}
.mobile-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;}
.mobile-toggle span{display:block;width:24px;height:2px;background:var(--text);border-radius:2px;transition:var(--transition);}

/* ═══════ HERO — IDEA BULB ═══════ */
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;z-index:2;padding:120px 20px 60px;--lamp-power:0;}
.hero::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
        radial-gradient(circle at 88% 10%,rgba(255,220,140,calc(0.32 * var(--lamp-power))),transparent 38%),
        radial-gradient(circle at 82% 18%,rgba(255,180,80,calc(0.18 * var(--lamp-power))),transparent 55%);
    transition:opacity .4s ease;
}
.hero-inner{position:relative;z-index:3;overflow:visible;}
.hero.lamp-on{--lamp-power:1;}
.hero.lamp-spotlight .hero-grid{
    opacity:calc(0.32 + (1 - var(--lamp-power)) * 0.68);
    transition:opacity .45s ease;
}
.hero.lamp-spotlight #heroLitTarget{
    filter:brightness(calc(1 + var(--lamp-power) * 0.14));
    transition:filter .45s ease;
}
.hero.lamp-on .brand-text .line1 .accent-3,
.hero.lamp-on .brand-text .line3 .accent-4{
    text-shadow:0 0 22px rgba(255,210,120,0.45),0 0 40px var(--accent-glow);
}

.hero-lamp{
    position:absolute;
    top:-4px;
    right:clamp(0px,2vw,28px);
    width:160px;
    height:280px;
    z-index:25;
    pointer-events:auto;
    --cord-base:28px;
    overflow:visible;
}
.idea-ambient{
    position:absolute;
    top:-40px;
    left:50%;
    width:380px;
    height:380px;
    transform:translateX(-50%);
    border-radius:50%;
    background:
        radial-gradient(circle,rgba(255,240,190,0.85) 0%,rgba(255,210,120,0.45) 22%,rgba(255,170,70,0.18) 48%,transparent 72%);
    filter:blur(28px);
    opacity:calc(var(--lamp-power) * 1);
    pointer-events:none;
    transition:opacity .4s ease, transform .4s ease;
    z-index:0;
}
.idea-ambient::before{
    content:'';
    position:absolute;
    inset:-28%;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,220,140,0.35) 0%,rgba(255,180,80,0.12) 40%,transparent 68%);
    filter:blur(36px);
    opacity:calc(var(--lamp-power) * 0.9);
}
.idea-ambient::after{
    content:'';
    position:absolute;
    inset:18%;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,250,220,0.95) 0%,rgba(255,210,120,0.55) 35%,transparent 70%);
    filter:blur(10px);
    opacity:calc(var(--lamp-power) * 1);
    animation:ideaHaloPulse 3.2s ease-in-out infinite;
}
@keyframes ideaHaloPulse{
    0%,100%{transform:scale(0.92);opacity:calc(var(--lamp-power) * 0.75);}
    50%{transform:scale(1.08);opacity:calc(var(--lamp-power) * 1);}
}
.idea-wire{
    position:absolute;
    top:-96px;
    left:50%;
    width:2px;
    height:104px;
    transform:translateX(-50%);
    background:linear-gradient(180deg,rgba(255,255,255,0.08),rgba(200,210,220,0.55));
}
.idea-bulb-wrap{
    position:absolute;
    top:0;
    left:50%;
    width:78px;
    height:116px;
    transform:translateX(-50%);
    z-index:2;
    filter:drop-shadow(0 0 calc(28px * var(--lamp-power)) rgba(255,220,140,calc(0.75 * var(--lamp-power))))
           drop-shadow(0 0 calc(60px * var(--lamp-power)) rgba(255,180,80,calc(0.45 * var(--lamp-power))))
           drop-shadow(0 0 calc(110px * var(--lamp-power)) rgba(255,160,60,calc(0.22 * var(--lamp-power))));
}
.idea-bulb{width:100%;height:100%;display:block;overflow:visible;}
.idea-glass{
    fill:#9aa8b8;
    opacity:calc(0.38 + var(--lamp-power) * 0.57);
    transition:fill .35s ease, opacity .35s ease, filter .35s ease;
    filter:drop-shadow(0 0 calc(22px * var(--lamp-power)) rgba(255,230,160,calc(0.85 * var(--lamp-power))));
}
.idea-filament{
    opacity:calc(0.15 + var(--lamp-power) * 0.85);
    stroke:#ffb347;
    transition:opacity .3s ease;
}
.hero.lamp-on .idea-glass{
    fill:#ffe9b0;
}
.idea-card{
    position:absolute;
    top:132px;
    right:calc(100% - 8px);
    width:min(240px,58vw);
    padding:14px 16px;
    border-radius:16px;
    text-align:left;
    background:rgba(8,10,16,0.72);
    border:1px solid rgba(255,210,120,calc(0.12 + var(--lamp-power) * 0.28));
    box-shadow:0 12px 40px rgba(0,0,0,0.35),0 0 30px rgba(255,200,100,calc(0.12 * var(--lamp-power)));
    backdrop-filter:blur(12px);
    opacity:0;
    visibility:hidden;
    transform:translateX(8px) scale(0.96);
    transition:opacity .4s ease, visibility .4s ease, transform .4s ease, border-color .4s ease;
    pointer-events:none;
}
.hero.lamp-spotlight .idea-card{
    opacity:var(--lamp-power);
    visibility:visible;
    transform:translateX(0) scale(1);
}
.idea-card-label{
    display:block;
    font-family:'Orbitron',sans-serif;
    font-size:9px;
    letter-spacing:2.5px;
    text-transform:uppercase;
    color:#ffd27a;
    margin-bottom:6px;
}
.idea-card-text{
    font-family:'Orbitron',sans-serif;
    font-size:clamp(12px,1.5vw,14px);
    font-weight:600;
    letter-spacing:0.4px;
    line-height:1.4;
    color:#fff4dd;
    text-shadow:0 0 14px rgba(255,210,120,0.35);
    margin:0;
}

.lamp-cord{
    position:absolute;
    top:108px;
    left:50%;
    transform:translateX(-50%);
    width:60px;
    height:140px;
    z-index:3;
}
.lamp-cord-line{
    position:absolute;
    top:0;
    left:50%;
    width:2px;
    height:var(--cord-base);
    transform:translateX(-50%);
    transform-origin:top center;
    border-radius:999px;
    background:linear-gradient(180deg,#9aa8bc,#d5deea);
}
.lamp-pull{
    position:absolute;
    top:var(--cord-base);
    left:50%;
    margin-left:-27px;
    width:54px;
    padding:0;
    border:0;
    background:transparent;
    cursor:grab;
    touch-action:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    will-change:transform;
}
.lamp-pull:active{cursor:grabbing;}
.lamp-knob{
    display:block;
    width:26px;
    height:26px;
    border-radius:50%;
    background:radial-gradient(circle at 32% 28%,#ffe08a,#d4922c 55%,#8f5a14);
    border:1px solid rgba(255,255,255,0.25);
    box-shadow:0 6px 16px rgba(0,0,0,0.45), inset 0 -3px 6px rgba(0,0,0,0.25);
    animation:lampKnobPulse 2.4s ease-in-out infinite;
}
.hero.lamp-on .lamp-knob,
.hero-lamp.is-dragging .lamp-knob{animation:none;}
@keyframes lampKnobPulse{
    0%,100%{transform:translateY(0);box-shadow:0 6px 16px rgba(0,0,0,0.45),0 0 0 0 rgba(255,214,120,0.4);}
    50%{transform:translateY(3px);box-shadow:0 10px 20px rgba(0,0,0,0.5),0 0 0 8px rgba(255,214,120,0);}
}
.lamp-pull-hint{
    font-family:'Orbitron',sans-serif;
    font-size:8px;
    letter-spacing:1.2px;
    text-transform:uppercase;
    color:var(--accent);
    opacity:0.85;
    white-space:nowrap;
    pointer-events:none;
    text-shadow:0 0 12px var(--accent-glow);
}
.hero-lamp.is-dragging .lamp-pull-hint{opacity:0;}

.bot-logo-container{position:relative;width:380px;height:340px;margin:0 auto 40px;display:flex;flex-direction:column;align-items:center;justify-content:center;}

.speech-bubble{position:relative;width:260px;height:140px;margin-bottom:30px;}
.speech-bubble svg{width:100%;height:100%;overflow:visible;}

.bubble-outline{fill:none;stroke:var(--accent);stroke-width:3;filter:drop-shadow(0 0 8px var(--accent-glow)) drop-shadow(0 0 20px rgba(59,158,255,0.3));animation:bubblePulse 4s ease-in-out infinite;}
@keyframes bubblePulse{0%,100%{filter:drop-shadow(0 0 8px var(--accent-glow)) drop-shadow(0 0 20px rgba(59,158,255,0.3));}50%{filter:drop-shadow(0 0 12px var(--accent-glow)) drop-shadow(0 0 30px rgba(59,158,255,0.5)) drop-shadow(0 0 50px rgba(90,127,255,0.2));}}

.eye-0,.eye-1{font-family:'Orbitron',monospace;font-weight:700;font-size:42px;fill:var(--text);filter:drop-shadow(0 0 10px rgba(255,255,255,0.5));}
.eye-0{animation:eyeWink 5s ease-in-out infinite;transform-origin:95px 70px;}
.eye-1{animation:eyeSteady 5s ease-in-out infinite;transform-origin:165px 70px;}
@keyframes eyeWink{0%,88%,100%{transform:scaleY(1);opacity:1;}92%,96%{transform:scaleY(0.08);opacity:0.8;}}
@keyframes eyeSteady{0%,100%{transform:scaleY(1);opacity:1;}}

.voice-bars-left,.voice-bars-right{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:4px;height:40px;}
.voice-bars-left{left:-50px;}
.voice-bars-right{right:-50px;}
.voice-bars-left span,.voice-bars-right span{width:3px;background:linear-gradient(180deg,var(--accent),var(--accent2));border-radius:20px;animation:voiceBar 1.2s ease-in-out infinite;box-shadow:0 0 8px var(--accent-glow);}
.voice-bars-left span:nth-child(1){height:6px;animation-delay:0s;}
.voice-bars-left span:nth-child(2){height:12px;animation-delay:0.1s;}
.voice-bars-left span:nth-child(3){height:20px;animation-delay:0.2s;}
.voice-bars-left span:nth-child(4){height:14px;animation-delay:0.3s;}
.voice-bars-left span:nth-child(5){height:8px;animation-delay:0.4s;}
.voice-bars-right span:nth-child(1){height:8px;animation-delay:0.15s;}
.voice-bars-right span:nth-child(2){height:14px;animation-delay:0.25s;}
.voice-bars-right span:nth-child(3){height:22px;animation-delay:0.35s;}
.voice-bars-right span:nth-child(4){height:16px;animation-delay:0.45s;}
.voice-bars-right span:nth-child(5){height:10px;animation-delay:0.55s;}
@keyframes voiceBar{0%,100%{transform:scaleY(1);opacity:0.5;}50%{transform:scaleY(2.2);opacity:1;}}

.logo-particles{position:absolute;inset:-60px;pointer-events:none;}
.logo-particles .particle{position:absolute;width:3px;height:3px;background:var(--accent);border-radius:50%;animation:particleFloat 8s ease-in-out infinite;box-shadow:0 0 6px var(--accent);}
.logo-particles .particle:nth-child(1){top:10%;left:15%;animation-delay:0s;}
.logo-particles .particle:nth-child(2){top:25%;right:10%;animation-delay:1.5s;}
.logo-particles .particle:nth-child(3){bottom:30%;left:8%;animation-delay:3s;}
.logo-particles .particle:nth-child(4){bottom:15%;right:20%;animation-delay:4.5s;}
.logo-particles .particle:nth-child(5){top:50%;left:5%;animation-delay:6s;}
.logo-particles .particle:nth-child(6){top:40%;right:5%;animation-delay:2s;}
.logo-particles .particle:nth-child(7){top:70%;left:25%;animation-delay:5s;}
.logo-particles .particle:nth-child(8){bottom:40%;right:15%;animation-delay:7s;}
@keyframes particleFloat{0%,100%{transform:translate(0,0) scale(1);opacity:0.3;}50%{transform:translate(15px,-25px) scale(1.8);opacity:0.9;}}

/* BRAND TEXT */
.brand-text{position:relative;}
.brand-text .line1{font-family:'Orbitron',sans-serif;font-size:clamp(36px,8vw,72px);font-weight:700;letter-spacing:8px;line-height:1.1;color:var(--text);}
.brand-text .line1 .accent-3{color:var(--accent);text-shadow:0 0 20px var(--accent-glow),0 0 40px rgba(59,158,255,0.3);animation:textGlow 3s ease-in-out infinite;}
.brand-text .line2{font-family:'Orbitron',sans-serif;font-size:clamp(28px,6vw,56px);font-weight:500;letter-spacing:12px;line-height:1.2;color:var(--text);margin-top:4px;}
.brand-text .line3{font-family:'Orbitron',sans-serif;font-size:clamp(28px,6vw,56px);font-weight:500;letter-spacing:10px;line-height:1.2;color:var(--text);margin-top:4px;}
.brand-text .line3 .accent-4{color:var(--accent2);text-shadow:0 0 20px var(--accent2-glow),0 0 40px rgba(90,127,255,0.3);animation:textGlow 3s ease-in-out infinite 0.5s;}
@keyframes textGlow{0%,100%{text-shadow:0 0 20px var(--accent-glow),0 0 40px rgba(59,158,255,0.2);}50%{text-shadow:0 0 30px var(--accent-glow),0 0 60px var(--accent2-glow),0 0 80px rgba(59,158,255,0.3);}}

.slogan{margin-top:24px;font-family:'Orbitron',sans-serif;font-size:clamp(10px,1.8vw,14px);font-weight:500;letter-spacing:6px;text-transform:uppercase;color:var(--muted);}
.slogan .accent-ai{color:var(--accent);letter-spacing:8px;}
.slogan .accent-you{color:var(--text);letter-spacing:8px;}

.reflection{margin-top:8px;font-family:'Orbitron',sans-serif;font-size:clamp(28px,6vw,56px);font-weight:500;letter-spacing:10px;line-height:1.2;color:var(--text);opacity:0.08;transform:scaleY(-1) translateY(-10px);filter:blur(2px);pointer-events:none;user-select:none;}

.tagline{margin-top:32px;color:var(--muted);font-size:clamp(15px,2.2vw,18px);font-weight:300;max-width:650px;margin-left:auto;margin-right:auto;line-height:1.7;animation:fadeUp 1s ease-out 0.8s both;}
.tagline strong{color:var(--text);font-weight:500;}

.cta{margin-top:44px;display:flex;justify-content:center;gap:20px;flex-wrap:wrap;animation:fadeUp 1s ease-out 1s both;}
.btn{padding:16px 32px;border-radius:999px;text-decoration:none;font-weight:600;font-size:15px;letter-spacing:0.3px;transition:var(--transition);position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;font-family:'Space Grotesk',sans-serif;border:0;cursor:pointer;}
.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#041018;box-shadow:0 4px 30px var(--accent-glow);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 40px var(--accent-glow);}
.btn-primary::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent,rgba(255,255,255,0.3),transparent);transform:translateX(-100%);transition:0.6s;}
.btn-primary:hover::before{transform:translateX(100%);}
.btn-primary.liquid-btn{
    isolation:isolate;
    --mx:50%;
    --my:50%;
}
.btn-primary.liquid-btn::after{
    content:'';
    position:absolute;
    width:180%;
    aspect-ratio:1/1;
    left:var(--mx);
    top:var(--my);
    transform:translate(-50%,-50%) scale(0);
    border-radius:42%;
    background:radial-gradient(circle,rgba(255,255,255,0.45),rgba(255,255,255,0.08) 55%,transparent 72%);
    mix-blend-mode:screen;
    z-index:-1;
    transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.btn-primary.liquid-btn:hover::after{
    transform:translate(-50%,-50%) scale(1);
}
.btn-secondary{border:1.5px solid var(--btn-secondary-border);color:var(--text);background:transparent;}
.btn-secondary:hover{border-color:var(--accent);background:rgba(59,158,255,0.05);transform:translateY(-3px);box-shadow:0 8px 30px var(--accent-glow);}

.scroll-indicator{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;animation:fadeUp 1s ease-out 1.5s both;cursor:pointer;}
.scroll-indicator span{font-size:11px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;font-family:'Orbitron',sans-serif;}
.scroll-indicator .mouse{width:24px;height:40px;border:2px solid rgba(255,255,255,0.2);border-radius:12px;position:relative;}
.scroll-indicator .mouse::after{content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);width:4px;height:8px;background:var(--accent);border-radius:2px;animation:mouseScroll 2s ease-in-out infinite;}
@keyframes mouseScroll{0%,100%{top:8px;opacity:1;}50%{top:20px;opacity:0.3;}}

/* SECTIONS */
section{position:relative;z-index:2;padding:140px 0;}
.container{width:min(1200px,92%);margin:auto;}
.section-header{text-align:center;margin-bottom:80px;}
.section-label{display:inline-block;font-family:'Orbitron',sans-serif;font-size:11px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--accent);margin-bottom:16px;position:relative;}
.section-label::before,.section-label::after{content:'';position:absolute;top:50%;width:40px;height:1px;}
.section-label::before{right:calc(100% + 16px);background:linear-gradient(90deg,transparent,var(--accent));}
.section-label::after{left:calc(100% + 16px);background:linear-gradient(90deg,var(--accent),transparent);}
.section-title{font-family:'Orbitron',sans-serif;font-size:clamp(28px,4.5vw,48px);font-weight:700;line-height:1.1;letter-spacing:2px;}
.section-desc{margin-top:20px;color:var(--muted);font-size:18px;max-width:650px;margin-left:auto;margin-right:auto;line-height:1.6;}

.reveal{opacity:0;transform:translateY(40px);transition:all 0.8s cubic-bezier(0.4,0,0.2,1);}
.reveal.visible{opacity:1;transform:translateY(0);}
.reveal-delay-1{transition-delay:0.1s;}
.reveal-delay-2{transition-delay:0.2s;}
.reveal-delay-3{transition-delay:0.3s;}
.reveal-delay-4{transition-delay:0.4s;}
.reveal-delay-5{transition-delay:0.5s;}
.reveal-delay-6{transition-delay:0.6s;}

/* SERVICES */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.service-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:40px 32px;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease,background .35s ease;position:relative;overflow:hidden;cursor:default;transform-style:preserve-3d;will-change:transform;}
.service-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent2),var(--accent3));transform:scaleX(0);transform-origin:left;transition:var(--transition);}
.service-card:hover::before{transform:scaleX(1);}
.service-card:hover{background:var(--card-hover);border-color:var(--border-hover);box-shadow:0 20px 60px var(--shadow-deep),0 0 40px rgba(59,158,255,0.08);}
.service-icon{width:56px;height:56px;border-radius:var(--radius-sm);background:linear-gradient(135deg,rgba(59,158,255,0.1),rgba(90,127,255,0.1));display:flex;align-items:center;justify-content:center;margin-bottom:24px;font-size:24px;transition:var(--transition);}
.service-card:hover .service-icon{transform:scale(1.1) rotate(-5deg);background:linear-gradient(135deg,rgba(59,158,255,0.2),rgba(90,127,255,0.2));}
.service-card h3{font-family:'Orbitron',sans-serif;font-size:16px;font-weight:600;margin-bottom:12px;letter-spacing:1px;}
.service-card p{color:var(--muted);font-size:15px;line-height:1.7;}
.service-card .service-tags{margin-top:20px;display:flex;flex-wrap:wrap;gap:8px;}
.service-card .service-tags span{font-size:11px;padding:4px 12px;border-radius:999px;background:rgba(255,255,255,0.05);color:var(--muted);border:1px solid var(--border);transition:var(--transition);font-family:'Orbitron',sans-serif;letter-spacing:1px;}
.service-card:hover .service-tags span{border-color:var(--border-hover);color:var(--text);}

/* PORTFOLIO — SPIRAL */
.portfolio-section{padding-bottom:100px;overflow:visible;}
.spiral-stage{
    position:relative;
    width:100%;
    height:min(46vh,440px);
    margin:4px auto 6px;
    perspective:1800px;
    perspective-origin:50% 42%;
    user-select:none;
    touch-action:pan-y;
    z-index:1;
    overflow:hidden;
}
.spiral-stage.is-mobile{
    height:clamp(220px, 48vw, 280px);
    min-height:220px;
    max-height:280px;
    margin:0 auto 8px;
    perspective:1100px;
    perspective-origin:50% 48%;
}
.spiral-scene{
    position:absolute;
    inset:0;
    transform-style:preserve-3d;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform .2s ease-out;
}
.holo-ring,.holo-ring-2{
    position:absolute;
    left:50%;
    top:46%;
    width:min(70vw,520px);
    height:min(28vw,180px);
    border:1px solid rgba(59,158,255,0.22);
    border-radius:50%;
    transform:translate(-50%,-50%) rotateX(72deg);
    box-shadow:0 0 40px rgba(59,158,255,0.12),inset 0 0 30px rgba(90,127,255,0.08);
    pointer-events:none;
    animation:holoSpin 18s linear infinite;
    z-index:0;
}
.holo-ring-2{
    width:min(84vw,640px);
    height:min(34vw,220px);
    border-color:rgba(0,212,170,0.18);
    animation-direction:reverse;
    animation-duration:26s;
    opacity:.7;
}
@keyframes holoSpin{to{transform:translate(-50%,-50%) rotateX(72deg) rotateZ(360deg);}}
html[data-theme="light"] .holo-ring{border-color:rgba(21,120,212,0.28);box-shadow:0 0 30px rgba(21,120,212,0.12);}
html[data-theme="light"] .holo-ring-2{border-color:rgba(10,168,122,0.22);}
.spiral-card{
    position:absolute;
    width:min(168px,46vw);
    height:248px;
    border-radius:22px;
    border:1px solid rgba(255,255,255,0.1);
    background:linear-gradient(160deg,rgba(12,16,28,0.95),rgba(8,10,16,0.98));
    overflow:hidden;
    cursor:pointer;
    transform-style:preserve-3d;
    transition:box-shadow 0.4s ease, border-color 0.4s ease, opacity 0.35s ease;
    box-shadow:0 20px 50px rgba(0,0,0,0.45);
    backface-visibility:hidden;
}
.spiral-card.is-active{
    border-color:rgba(59,158,255,0.55);
    box-shadow:0 30px 80px rgba(59,158,255,0.25),0 0 40px rgba(90,127,255,0.12);
}
.spiral-card .sc-visual{
    height:50%;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
}
.spiral-card .sc-thumb{
    position:absolute;
    inset:0;
    width:250%;
    height:250%;
    border:0;
    transform:scale(0.4);
    transform-origin:top left;
    pointer-events:none;
    opacity:0;
    transition:opacity 0.35s ease;
    background:#fff;
}
.spiral-card.is-active .sc-thumb,
.spiral-card.is-near .sc-thumb{opacity:1;}
.spiral-card.is-active .sc-icon,
.spiral-card.is-near .sc-icon{opacity:0;}
.spiral-card .sc-visual::after{
    content:'';
    position:absolute;
    inset:auto 0 0;
    height:45%;
    background:linear-gradient(transparent,var(--bg));
    z-index:2;
}
.spiral-card .sc-scan{
    position:absolute;inset:0;pointer-events:none;z-index:3;
    background:linear-gradient(180deg,transparent,rgba(59,158,255,0.35),transparent);
    height:28%;
    animation:scScan 2.8s ease-in-out infinite;
    opacity:0;
}
.spiral-card.is-active .sc-scan{opacity:1;}
@keyframes scScan{0%{transform:translateY(-40%);}100%{transform:translateY(280%);}}
.spiral-card .sc-icon{
    font-size:56px;
    z-index:1;
    filter:drop-shadow(0 8px 20px rgba(0,0,0,0.4));
    transition:transform 0.5s ease, opacity 0.35s ease;
    position:relative;
}
.spiral-card.is-active .sc-icon{transform:scale(1.12);}
.spiral-card .sc-body{padding:16px 18px 20px;}
.spiral-card .sc-tag{
    font-family:'Orbitron',sans-serif;
    font-size:9px;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--accent);
    display:block;
    margin-bottom:8px;
}
.spiral-card h4{
    font-family:'Orbitron',sans-serif;
    font-size:15px;
    letter-spacing:0.5px;
    margin-bottom:6px;
    line-height:1.25;
}
.spiral-card p{
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.spiral-card.is-active p{
    -webkit-line-clamp:4;
}
.spiral-card.is-active .sc-visual{height:44%;}
.spiral-hint{
    position:absolute;
    left:50%;
    bottom:8px;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    gap:16px;
    z-index:5;
    font-family:'Orbitron',sans-serif;
    font-size:11px;
    letter-spacing:2px;
    color:var(--muted);
    text-transform:uppercase;
}
.spiral-hint strong{color:var(--text);}
.spiral-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:6;
    width:48px;
    height:48px;
    border-radius:50%;
    border:1px solid var(--border);
    background:rgba(3,4,5,0.7);
    color:var(--text);
    font-size:28px;
    line-height:1;
    cursor:pointer;
    backdrop-filter:blur(12px);
    transition:var(--transition);
}
.spiral-nav:hover{
    border-color:var(--accent);
    box-shadow:0 0 24px rgba(59,158,255,0.25);
}
.spiral-prev{left:max(12px,4vw);}
.spiral-next{right:max(12px,4vw);}

.portfolio-focus-wrap{
    position:relative;
    z-index:5;
    padding:0 16px;
}
.portfolio-focus{
    max-width:760px;
    margin:0 auto;
    text-align:center;
    padding:22px 20px 26px;
    border-radius:24px;
    background:var(--glass);
    border:1px solid var(--border);
    box-shadow:0 20px 60px var(--shadow-deep);
    backdrop-filter:blur(16px);
    opacity:1 !important;
    transform:none !important;
}
.spiral-stage.at-start::before,
.spiral-stage.at-end::after{
    content:'';
    position:absolute;
    top:18px;
    left:50%;
    transform:translateX(-50%);
    font-family:'Orbitron',sans-serif;
    font-size:10px;
    letter-spacing:2px;
    color:var(--accent);
    z-index:7;
    opacity:.7;
}
.spiral-stage.at-start::before{content:'↑ RELEASE';}
.spiral-stage.at-end::after{content:'↓ RELEASE';top:auto;bottom:36px;}
.portfolio-focus .card-tag{
    display:inline-block;
    font-family:'Orbitron',sans-serif;
    font-size:10px;
    font-weight:600;
    letter-spacing:3px;
    text-transform:uppercase;
    color:var(--accent);
    margin-bottom:12px;
}
.portfolio-focus h3{
    font-family:'Orbitron',sans-serif;
    font-size:clamp(22px,3vw,32px);
    letter-spacing:1px;
    margin-bottom:12px;
    color:var(--text);
}
.portfolio-focus p{
    color:var(--muted);
    font-size:16px;
    line-height:1.65;
    margin-bottom:14px;
    min-height:0;
}
.focus-stacks{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:center;
    margin-bottom:18px;
}
.focus-stacks span{
    font-size:11px;
    padding:4px 12px;
    border-radius:999px;
    background:rgba(255,255,255,0.05);
    color:var(--muted);
    border:1px solid var(--border);
    font-family:'Orbitron',sans-serif;
    letter-spacing:0.8px;
}

/* PROJECT VIEWER */
.project-viewer{
    position:fixed;
    inset:0;
    z-index:2000;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    pointer-events:none;
    transition:opacity 0.35s ease;
}
.project-viewer.open{
    opacity:1;
    pointer-events:all;
}
.viewer-backdrop{
    position:absolute;
    inset:0;
    background:rgba(1,2,4,0.82);
    backdrop-filter:blur(16px);
}
.viewer-window{
    position:relative;
    z-index:1;
    width:min(1100px,94vw);
    height:min(82vh,820px);
    display:flex;
    flex-direction:column;
    border-radius:18px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,0.12);
    background:#0a0c12;
    box-shadow:0 40px 120px rgba(0,0,0,0.65),0 0 80px rgba(59,158,255,0.12);
    transform:scale(0.72) translateY(40px);
    opacity:0;
    transition:transform 0.55s cubic-bezier(0.2,0.9,0.2,1),opacity 0.45s ease;
}
.project-viewer.open .viewer-window{
    transform:scale(1) translateY(0);
    opacity:1;
}
.viewer-chrome{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 16px;
    background:rgba(255,255,255,0.03);
    border-bottom:1px solid var(--border);
    flex:0 0 auto;
}
.viewer-dots{display:flex;gap:6px;}
.viewer-dots span{
    width:10px;height:10px;border-radius:50%;
    background:#ff5f57;
}
.viewer-dots span:nth-child(2){background:#febc2e;}
.viewer-dots span:nth-child(3){background:#28c840;}
.viewer-url{
    flex:1;
    min-width:0;
    font-size:12px;
    color:var(--muted);
    font-family:'Orbitron',sans-serif;
    letter-spacing:1px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    background:rgba(255,255,255,0.04);
    border:1px solid var(--border);
    border-radius:8px;
    padding:8px 12px;
}
.viewer-actions{display:flex;align-items:center;gap:10px;}
.viewer-ext{
    color:var(--accent);
    text-decoration:none;
    font-size:12px;
    font-family:'Orbitron',sans-serif;
    letter-spacing:1px;
}
.viewer-close{
    width:36px;height:36px;
    border:1px solid var(--border);
    border-radius:10px;
    background:transparent;
    color:var(--text);
    font-size:22px;
    cursor:pointer;
    transition:var(--transition);
}
.viewer-close:hover{border-color:var(--accent);color:var(--accent);}
.viewer-body{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    position:relative;
    background:#05070c;
}
.viewer-scale{
    position:absolute;
    inset:0;
    overflow:hidden;
}
.viewer-frame{
    position:absolute;
    top:0;
    left:0;
    border:0;
    background:#fff;
    transform-origin:top left;
    width:100%;
    height:100%;
}
.viewer-loading{
    position:absolute;
    inset:0;
    z-index:2;
    display:grid;
    place-items:center;
    font-family:'Orbitron',sans-serif;
    letter-spacing:3px;
    font-size:12px;
    color:var(--accent);
    background:rgba(5,7,12,0.92);
    pointer-events:none;
}
@keyframes viewerZoomIn{
    from{opacity:0}
    to{opacity:1}
}
.preview-screen{
    min-height:100%;
    padding:28px clamp(16px,4vw,40px) 40px;
    color:#f5f7fb;
    background:
        radial-gradient(ellipse at 20% 0%, color-mix(in srgb, var(--p-accent) 28%, transparent), transparent 50%),
        radial-gradient(ellipse at 90% 20%, color-mix(in srgb, var(--p-accent2) 18%, transparent), transparent 45%),
        linear-gradient(180deg,#07090f,#0c1018 45%,#06080d);
}
.preview-nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:48px;
    font-family:'Orbitron',sans-serif;
    font-size:12px;
    letter-spacing:2px;
}
.preview-nav .logo{font-weight:700;font-size:14px;}
.preview-nav .links{display:flex;gap:18px;color:rgba(255,255,255,0.45);}
.preview-hero{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:28px;
    align-items:center;
    margin-bottom:36px;
}
.preview-hero h2{
    font-family:'Orbitron',sans-serif;
    font-size:clamp(28px,4vw,46px);
    line-height:1.1;
    letter-spacing:1px;
    margin-bottom:16px;
}
.preview-hero p{
    color:rgba(255,255,255,0.62);
    font-size:15px;
    line-height:1.7;
    max-width:420px;
    margin-bottom:22px;
}
.preview-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:12px 22px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--p-accent),var(--p-accent2));
    color:#041018;
    font-weight:700;
    font-size:13px;
    text-decoration:none;
}
.preview-panel{
    border-radius:20px;
    border:1px solid rgba(255,255,255,0.1);
    background:rgba(255,255,255,0.04);
    min-height:240px;
    padding:20px;
    box-shadow:0 20px 60px rgba(0,0,0,0.35);
    position:relative;
    overflow:hidden;
}
.preview-panel .pulse{
    position:absolute;
    width:180px;height:180px;
    border-radius:50%;
    background:radial-gradient(circle,var(--p-accent),transparent 70%);
    opacity:0.35;
    top:-40px;right:-30px;
    filter:blur(10px);
}
.preview-mock-rows{display:grid;gap:10px;margin-top:12px;}
.preview-mock-rows i{
    display:block;
    height:12px;
    border-radius:999px;
    background:rgba(255,255,255,0.08);
}
.preview-mock-rows i:nth-child(1){width:78%;}
.preview-mock-rows i:nth-child(2){width:62%;}
.preview-mock-rows i:nth-child(3){width:88%;}
.preview-mock-rows i:nth-child(4){width:45%;}
.preview-cards{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
}
.preview-cards article{
    border-radius:16px;
    border:1px solid rgba(255,255,255,0.08);
    background:rgba(255,255,255,0.03);
    padding:18px;
    min-height:110px;
}
.preview-cards .dot{
    width:28px;height:28px;border-radius:8px;
    background:linear-gradient(135deg,var(--p-accent),var(--p-accent2));
    margin-bottom:12px;
}
.preview-cards h5{
    font-family:'Orbitron',sans-serif;
    font-size:12px;
    letter-spacing:1px;
    margin-bottom:6px;
}
.preview-cards p{font-size:12px;color:rgba(255,255,255,0.45);line-height:1.5;}
.preview-chat{
    display:grid;gap:10px;margin-top:18px;
}
.preview-chat .bubble{
    max-width:78%;
    padding:10px 14px;
    border-radius:14px;
    font-size:13px;
    line-height:1.45;
}
.preview-chat .bubble.in{
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.08);
}
.preview-chat .bubble.out{
    margin-left:auto;
    background:linear-gradient(135deg,var(--p-accent),var(--p-accent2));
    color:#041018;
    font-weight:600;
}

@media(max-width:900px){
    .portfolio-section .section-header{margin-bottom:24px;}
}
@media(max-width:768px){
    .portfolio-section{
        padding-top:56px;
        padding-bottom:36px;
        overflow:visible;
    }
    .portfolio-section .section-header{
        margin-bottom:10px;
        padding:0 4px;
    }
    .portfolio-section .section-label{
        margin-bottom:6px;
        font-size:10px;
    }
    .portfolio-section .section-title{
        font-size:clamp(20px,5.5vw,28px);
        letter-spacing:1px;
    }
    .portfolio-section .section-desc{
        display:none;
    }
    .spiral-stage{
        touch-action:pan-y;
        overflow:hidden;
    }
    .spiral-stage.is-mobile .holo-ring,
    .spiral-stage.is-mobile .holo-ring-2{
        display:block;
        opacity:.45;
        width:min(88vw,320px);
        height:min(36vw,120px);
    }
    .spiral-card{
        width:min(156px, 52vw);
        height:178px;
        border-radius:18px;
    }
    .spiral-card .sc-visual{height:54%;}
    .spiral-card.is-active .sc-visual{height:54%;}
    .spiral-card .sc-icon{font-size:40px;}
    .spiral-card .sc-body{padding:10px 12px 12px;}
    .spiral-card h4{font-size:12px;margin-bottom:0;line-height:1.2;}
    .spiral-card p{display:none;}
    .spiral-hint{
        top:6px;
        bottom:auto;
        gap:8px;
        font-size:9px;
        letter-spacing:1.2px;
        padding:5px 10px;
        border-radius:999px;
        background:var(--glass);
        border:1px solid var(--border);
        backdrop-filter:blur(10px);
        white-space:nowrap;
    }
    .spiral-nav{
        width:40px;
        height:40px;
        top:auto;
        bottom:10px;
        transform:none;
        font-size:24px;
        background:var(--glass);
    }
    .spiral-prev{left:10px;}
    .spiral-next{right:10px;}
    .spiral-stage.at-start::before,
    .spiral-stage.at-end::after{display:none;}
    .portfolio-focus-wrap{
        padding:0;
        margin-top:0;
    }
    .portfolio-focus{
        padding:14px 12px 16px;
        border-radius:16px;
        margin:0 auto;
    }
    .portfolio-focus .card-tag{
        margin-bottom:8px;
        font-size:9px;
    }
    .portfolio-focus h3{
        font-size:clamp(17px,5vw,22px);
        margin-bottom:8px;
        line-height:1.2;
    }
    .portfolio-focus p{
        font-size:12px;
        line-height:1.5;
        margin-bottom:10px;
        display:block;
        overflow:visible;
        -webkit-line-clamp:unset;
    }
    .focus-stacks{
        gap:5px;
        margin-bottom:14px;
    }
    .focus-stacks span{
        font-size:9px;
        padding:3px 8px;
        letter-spacing:0.6px;
    }
    .portfolio-focus .btn{
        width:100%;
        justify-content:center;
        padding:12px 18px;
        font-size:14px;
    }
    .viewer-window{
        width:100vw;
        height:100dvh;
        max-height:100dvh;
        border-radius:0;
        border:0;
    }
    .viewer-chrome{
        padding:10px 12px;
        gap:8px;
    }
    .viewer-url{
        font-size:11px;
        max-width:42vw;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
}
@media(max-width:480px){
    .spiral-stage.is-mobile{
        height:clamp(210px, 52vw, 250px);
        min-height:210px;
        margin-bottom:6px;
    }
    .spiral-card{
        width:min(148px, 54vw);
        height:168px;
    }
    .spiral-card .sc-icon{font-size:36px;}
    .portfolio-focus{padding:12px 10px 14px;}
}

/* PROCESS */
.process-section{background:linear-gradient(180deg,transparent,rgba(59,158,255,0.02),transparent);}
.process-layout{
    display:grid;
    grid-template-columns:minmax(200px,280px) 1fr;
    gap:36px;
    align-items:center;
}
.process-bot{
    position:relative;
    display:flex;
    justify-content:center;
    opacity:0;
    transform:translateX(-64px);
    transition:opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);
}
.process-bot.visible{
    opacity:1;
    transform:translateX(0);
}
.process-bot-inner{
    position:relative;
    width:100%;
    max-width:260px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
}
.process-bot-glow{
    position:absolute;
    inset:10% 5%;
    border-radius:50%;
    background:radial-gradient(circle,rgba(59,158,255,.28),transparent 70%);
    filter:blur(18px);
    pointer-events:none;
    animation:orbFloat 10s ease-in-out infinite;
}
.process-speech{
    width:100%;
    max-width:240px;
    height:auto;
    aspect-ratio:260 / 140;
    margin:0;
    position:relative;
    z-index:1;
}
.process-speech svg{width:100%;height:100%;}
.process-speech .eye-0,
.process-speech .eye-1{font-size:36px;}
.process-bot-label{
    font-family:'Orbitron',sans-serif;
    font-size:11px;
    letter-spacing:4px;
    text-transform:uppercase;
    color:var(--muted);
    position:relative;
    z-index:1;
}
.process-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.process-card{position:relative;padding:32px 24px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;text-align:center;transform-style:preserve-3d;will-change:transform;}
.process-card:hover{border-color:var(--border-hover);box-shadow:0 15px 50px var(--shadow-deep);}
.process-card .step-num{
    font-family:'Orbitron',sans-serif;
    font-size:42px;
    font-weight:700;
    line-height:1;
    margin-bottom:16px;
    display:block;
}
.process-card .step-digit{
    background:linear-gradient(135deg,var(--accent),var(--accent2));
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
}
.process-card h3{font-family:'Orbitron',sans-serif;font-size:17px;font-weight:600;margin-bottom:10px;letter-spacing:1px;}
.process-card p{color:var(--muted);font-size:14px;line-height:1.7;}
.process-card .step-line{display:none;}

/* WINKING ZERO in process numbers — visible like logo eye */
.process-card .wink-zero{
    display:inline-block;
    color:var(--text);
    -webkit-text-fill-color:currentColor;
    text-shadow:0 0 12px rgba(255,255,255,0.55),0 0 24px var(--accent-glow);
    animation:eyeWink 5s ease-in-out infinite;
    transform-origin:center bottom;
    margin-right:-0.04em;
}

/* STUDIO CREDIT (footer robot) */
.studio-credit{
    width:min(1200px,92%);
    margin:28px auto 0;
    display:flex;
    justify-content:center;
    padding-bottom:28px;
}
.studio-credit-card{
    display:inline-flex;
    align-items:center;
    gap:16px;
    padding:14px 20px;
    border-radius:20px;
    border:1px solid var(--border);
    background:rgba(255,255,255,0.03);
    text-decoration:none;
    color:inherit;
    backdrop-filter:blur(14px);
    transition:var(--transition);
    box-shadow:0 12px 40px var(--shadow-deep);
}
.studio-credit-card:hover{
    border-color:var(--border-hover);
    transform:translateY(-3px);
    box-shadow:0 16px 48px var(--shadow-deep),0 0 28px rgba(59,158,255,0.12);
}
.studio-credit-bot{
    width:88px;
    height:48px;
    flex-shrink:0;
}
.studio-credit-bot svg{width:100%;height:100%;overflow:visible;display:block;}
.studio-bubble{
    fill:rgba(59,158,255,0.06);
    stroke:var(--accent);
    stroke-width:3;
    filter:drop-shadow(0 0 8px var(--accent-glow));
}
.studio-eye{
    font-family:'Orbitron',monospace;
    font-size:42px;
    font-weight:700;
    fill:var(--text);
}
.studio-eye-0{animation:eyeWink 5s ease-in-out infinite;transform-origin:95px 70px;}
.studio-credit-text{display:flex;flex-direction:column;gap:3px;text-align:left;}
.studio-credit-tag{
    font-size:10px;
    font-weight:600;
    letter-spacing:0.28em;
    text-transform:uppercase;
    color:var(--muted);
}
.studio-credit-name{
    font-family:'Orbitron',sans-serif;
    font-size:13px;
    font-weight:800;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--text);
}
.studio-credit-desc{
    font-size:10px;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--muted);
}
.studio-credit-card:hover .studio-credit-desc{color:var(--accent);}

/* WHY US */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:800px;margin:0 auto;}
.why-item{display:flex;align-items:flex-start;gap:16px;padding:24px 28px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease,background .35s ease;transform-style:preserve-3d;will-change:transform;}
.why-item:hover{border-color:var(--border-hover);background:var(--card-hover);box-shadow:0 12px 40px var(--shadow-deep);}
.why-item .check{width:32px;height:32px;min-width:32px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-size:14px;color:#000;font-weight:700;margin-top:2px;transition:var(--transition);font-family:'Orbitron',sans-serif;}
.why-item:hover .check{transform:scale(1.2) rotate(10deg);box-shadow:0 0 20px var(--accent-glow);}
.why-item h4{font-family:'Orbitron',sans-serif;font-size:16px;font-weight:600;margin-bottom:6px;letter-spacing:1px;}
.why-item p{color:var(--muted);font-size:14px;}

/* CTA */
.cta-section{padding:160px 0;position:relative;overflow:hidden;}
.cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(59,158,255,0.08),transparent 60%);pointer-events:none;}
.cta-section .container{position:relative;z-index:2;text-align:center;}
.cta-section h2{font-family:'Orbitron',sans-serif;font-size:clamp(32px,6vw,60px);font-weight:700;line-height:1.1;letter-spacing:3px;margin-bottom:20px;}
.cta-section h2 .gradient{background:linear-gradient(135deg,var(--accent),var(--accent2),var(--accent3));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.cta-section p{color:var(--muted);font-size:18px;margin-bottom:40px;max-width:500px;margin-left:auto;margin-right:auto;line-height:1.6;}
.cta-section .email-link{display:inline-flex;align-items:center;gap:12px;color:var(--accent);font-size:18px;font-weight:500;text-decoration:none;transition:var(--transition);margin-bottom:40px;font-family:'Orbitron',sans-serif;letter-spacing:1px;}
.cta-section .email-link:hover{gap:20px;text-shadow:0 0 20px var(--accent-glow);}

.contact-form{max-width:640px;margin:0 auto 32px;text-align:left;display:grid;gap:20px;}
.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.form-field{display:grid;gap:8px;}
.form-field span{font-family:'Orbitron',sans-serif;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);}
.form-field input,.form-field textarea{width:100%;padding:14px 16px;border-radius:var(--radius-sm);border:1px solid var(--border);background:rgba(255,255,255,0.03);color:var(--text);font:inherit;transition:var(--transition);}
.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(59,158,255,0.15);}
.form-field textarea{resize:vertical;min-height:120px;}
.form-consent{grid-template-columns:auto 1fr;align-items:flex-start;gap:12px;}
.form-consent input{margin-top:4px;width:auto;}
.form-consent span{font-family:inherit;font-size:13px;letter-spacing:0;text-transform:none;color:var(--text-muted);line-height:1.5;}
.form-privacy{font-size:13px;color:var(--text-muted);margin:-8px 0 0;}
.form-privacy a{color:var(--accent);text-decoration:none;}
.form-privacy a:hover{text-decoration:underline;}
.footer-copy a{color:var(--muted);text-decoration:none;}
.footer-copy a:hover{color:var(--accent);}
.form-status{min-height:24px;font-size:14px;text-align:center;}
.form-status.success{color:var(--accent3);}
.form-status.error{color:#ff6b6b;}
.contact-form .btn-primary{width:100%;justify-content:center;}
.contact-form .btn-primary:disabled{opacity:0.6;cursor:not-allowed;transform:none;}

/* FOOTER */
footer{position:relative;z-index:2;border-top:1px solid var(--border);padding:60px 0 40px;}
.footer-inner{width:min(1200px,92%);margin:auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;}
.footer-logo{font-family:'Orbitron',sans-serif;font-weight:700;font-size:14px;letter-spacing:2px;}
.footer-logo .accent-3{color:var(--accent);}
.footer-logo .accent-4{color:var(--accent2);}
.footer-copy{color:var(--muted);font-size:12px;font-family:'Orbitron',sans-serif;letter-spacing:1px;}
.footer-social{display:flex;gap:16px;}
.footer-social a{width:40px;height:40px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--muted);text-decoration:none;transition:var(--transition);font-size:16px;font-family:'Orbitron',sans-serif;}
.footer-social a:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-4px);box-shadow:0 8px 20px rgba(59,158,255,0.15);}

@keyframes fadeUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}

/* RESPONSIVE */
@media(max-width:1024px){
    .services-grid{grid-template-columns:repeat(2,1fr);}
    .process-layout{grid-template-columns:220px 1fr;gap:24px;}
    .process-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:768px){
    .menu{display:none;}
    .mobile-toggle{display:flex;}
    .services-grid{grid-template-columns:1fr;}
    .process-layout{grid-template-columns:1fr;gap:28px;}
    .process-bot{order:-1;transform:translateY(28px);}
    .process-bot.visible{transform:translateY(0);}
    .process-bot-inner{max-width:200px;}
    .process-speech{max-width:200px;}
    .process-grid{grid-template-columns:1fr;}
    .why-grid{grid-template-columns:1fr;}
    .bot-logo-container{width:300px;height:280px;}
    .hero-lamp{
        top:-12px;
        right:2px;
        transform:scale(0.88);
        transform-origin:top right;
    }
    .idea-card{
        top:118px;
        right:auto;
        left:50%;
        transform:translateX(-50%) translateY(6px) scale(0.96);
        width:min(220px,70vw);
        text-align:center;
    }
    .hero.lamp-spotlight .idea-card{
        transform:translateX(-50%) translateY(0) scale(1);
    }
    .speech-bubble{width:200px;height:110px;}
    .voice-bars-left{left:-35px;}
    .voice-bars-right{right:-35px;}
    .voice-bars-left span,.voice-bars-right span{width:2px;}
    .footer-inner{flex-direction:column;text-align:center;}
    .studio-credit-card{flex-direction:column;text-align:center;gap:12px;padding:16px 18px;}
    .studio-credit-text{align-items:center;text-align:center;}
    section{padding:80px 0;}
    .cta-section{padding:100px 0;}
    .brand-text .line1{letter-spacing:4px;}
    .brand-text .line2,.brand-text .line3{letter-spacing:6px;}
    .slogan{letter-spacing:3px;}
    .form-row{grid-template-columns:1fr;}
}
@media(max-width:480px){
    .brand-text .line1{font-size:28px;letter-spacing:2px;}
    .brand-text .line2,.brand-text .line3{font-size:22px;letter-spacing:4px;}
    .slogan{font-size:9px;letter-spacing:2px;}
    .btn{padding:14px 24px;font-size:14px;}
    .service-card{padding:28px 24px;}
    .speech-bubble{width:170px;height:95px;}
    .eye-0,.eye-1{font-size:28px;}
    .hero-lamp{
        top:-24px;
        right:-10px;
        transform:scale(0.78);
    }
}

/* Mobile menu */
.mobile-menu{position:fixed;inset:0;background:var(--bg);z-index:999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;opacity:0;pointer-events:none;transition:var(--transition);}
.mobile-menu.active{opacity:1;pointer-events:all;}
.mobile-menu a{font-family:'Orbitron',sans-serif;font-size:24px;font-weight:600;color:var(--text);text-decoration:none;transition:var(--transition);letter-spacing:2px;}
.mobile-menu a:hover{color:var(--accent);}
.mobile-menu .close-btn{position:absolute;top:24px;right:24px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:28px;color:var(--text);font-family:'Orbitron',sans-serif;}

/* Cursor glow */
@media(pointer:fine){
    .cursor-glow{position:fixed;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(59,158,255,0.08),transparent 70%);pointer-events:none;z-index:0;transform:translate(-50%,-50%);transition:opacity 0.3s;}
    html[data-theme="light"] .cursor-glow{background:radial-gradient(circle,rgba(21,120,212,0.1),transparent 70%);}
}

/* FX LAYER */
.fx-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.85;}
.scanlines{
    position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.04;
    background:repeating-linear-gradient(to bottom,rgba(255,255,255,.18) 0 1px,transparent 1px 3px);
}
html[data-theme="light"] .scanlines{opacity:.025;background:repeating-linear-gradient(to bottom,rgba(11,23,36,.12) 0 1px,transparent 1px 3px);}
html[data-theme="light"] .noise-overlay{opacity:.02;}
html[data-theme="light"] .ambient-bg .orb{opacity:.08;}

.hero-grid{
    position:absolute;inset:0;pointer-events:none;z-index:1;
    background-image:
        linear-gradient(rgba(59,158,255,.05) 1px,transparent 1px),
        linear-gradient(90deg,rgba(59,158,255,.05) 1px,transparent 1px);
    background-size:48px 48px;
    mask-image:radial-gradient(ellipse at center,black 20%,transparent 72%);
    animation:gridPulse 8s ease-in-out infinite;
}
@keyframes gridPulse{0%,100%{opacity:.45;transform:perspective(700px) rotateX(58deg) translateY(8%);}50%{opacity:.8;transform:perspective(700px) rotateX(58deg) translateY(4%);}}
html[data-theme="light"] .hero-grid{
    background-image:
        linear-gradient(rgba(21,120,212,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(21,120,212,.08) 1px,transparent 1px);
}

.section-title{
    background:linear-gradient(120deg,var(--text) 20%,var(--accent) 50%,var(--text) 80%);
    background-size:200% auto;
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    animation:titleShine 7s linear infinite;
}
@keyframes titleShine{to{background-position:200% center;}}

.spiral-nav{background:var(--glass);}
html[data-theme="light"] .spiral-card{
    background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(240,246,252,.98));
    border-color:rgba(11,23,36,.1);
    box-shadow:0 16px 40px rgba(20,40,70,.12);
}
html[data-theme="light"] .spiral-card.is-active{
    border-color:rgba(21,120,212,.45);
    box-shadow:0 24px 60px rgba(21,120,212,.18);
}

@media(max-width:1024px){
    .menu{gap:14px;}
    .lang-switch{width:78px;height:32px;}
    .theme-toggle-track{width:54px;height:32px;}
    .theme-knob{width:24px;height:24px;}
    .theme-toggle.is-light .theme-knob{transform:translateX(22px);}
}
@media(max-width:768px){
    .menu .ui-controls{display:none;}
    .mobile-menu .ui-controls{display:flex;}
}

/* Bot peeker promo */
.bot-peeker{
    position:fixed;
    bottom:max(18px, env(safe-area-inset-bottom));
    z-index:80;
    width:min(300px, calc(100vw - 24px));
    pointer-events:none;
    opacity:0;
    transition:transform .55s cubic-bezier(.22,1,.36,1), opacity .4s ease;
}
.bot-peeker[data-side="right"]{
    right:0;
    transform:translateX(110%);
}
.bot-peeker[data-side="left"]{
    left:0;
    transform:translateX(-110%);
}
.bot-peeker.is-visible{
    opacity:1;
    pointer-events:auto;
    transform:translateX(0);
}
.bot-peeker-panel{
    position:relative;
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px 14px;
    border-radius:18px;
    border:1px solid rgba(255,201,120,.28);
    background:linear-gradient(145deg,rgba(10,14,24,.94),rgba(6,8,14,.96));
    box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 30px rgba(255,180,80,.12);
    backdrop-filter:blur(14px);
}
.bot-peeker[data-side="right"] .bot-peeker-panel{border-radius:18px 0 0 18px;}
.bot-peeker[data-side="left"] .bot-peeker-panel{border-radius:0 18px 18px 0;}
.bot-peeker-close{
    position:absolute;
    top:6px;
    right:8px;
    width:28px;
    height:28px;
    border:0;
    background:transparent;
    color:var(--muted);
    font-size:20px;
    cursor:pointer;
    line-height:1;
}
.bot-peeker[data-side="left"] .bot-peeker-close{right:auto;left:8px;}
.bot-peeker-face{
    flex:0 0 86px;
    width:86px;
    height:54px;
}
.bot-peeker-face svg{width:100%;height:100%;display:block;overflow:visible;}
.bot-peeker-bubble{
    fill:rgba(8,12,20,.9);
    stroke:rgba(59,158,255,.55);
    stroke-width:3;
}
.bot-peeker-eye{
    fill:var(--accent);
    font-family:'Orbitron',sans-serif;
    font-size:40px;
    font-weight:700;
}
.bot-peeker-eye-0{animation:botPeekWink 3.6s ease-in-out infinite;}
.bot-peeker-smile{
    stroke:#3b9eff;
    stroke-width:5;
    animation:botSmilePulse 2.8s ease-in-out infinite;
}
.bot-peeker-cheek{
    fill:rgba(255,140,160,.45);
    animation:botCheek 2.8s ease-in-out infinite;
}
@keyframes botPeekWink{
    0%,86%,100%{opacity:1;}
    90%,94%{opacity:.12;}
}
@keyframes botSmilePulse{
    0%,100%{stroke-width:5; opacity:.95;}
    50%{stroke-width:6; opacity:1;}
}
@keyframes botCheek{
    0%,100%{opacity:.35; transform:scale(1);}
    50%{opacity:.55; transform:scale(1.08);}
}
.bot-peeker-copy{
    flex:1;
    min-width:0;
    padding-right:10px;
}
.bot-peeker[data-side="left"] .bot-peeker-copy{padding-right:0;padding-left:10px;}
.bot-peeker-copy p{
    font-size:13px;
    line-height:1.35;
    margin:0 0 10px;
    color:var(--text);
}
.bot-peeker-cta{
    padding:8px 14px !important;
    font-size:12px !important;
    min-height:0;
}
html[data-theme="light"] .bot-peeker-panel{
    background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(245,248,252,.98));
    border-color:rgba(21,120,212,.22);
    box-shadow:0 16px 40px rgba(20,40,70,.14);
}
@media(max-width:480px){
    .bot-peeker{width:min(280px, calc(100vw - 16px));}
    .bot-peeker-face{flex-basis:60px;width:60px;}
    .bot-peeker-copy p{font-size:12px;}
}