@charset "UTF-8";
/* SBVORA v2 — motion layer. Loaded after style.css; everything here is additive. */

/* ---------- Intro (pure CSS, removes itself even without JS) ---------- */
.intro{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;color:#eaf7ff;pointer-events:none;animation:introGone 0s 2.35s forwards}
.intro-panel{position:absolute;left:0;right:0;height:50.5%;background:#061a36;z-index:-1;transition:none}
.intro-panel-a{top:0;animation:panelUp .8s 1.6s cubic-bezier(.76,0,.24,1) forwards}
.intro-panel-b{bottom:0;animation:panelDown .8s 1.6s cubic-bezier(.76,0,.24,1) forwards}
.intro-grid{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(45,197,248,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(45,197,248,.08) 1px,transparent 1px);background-size:56px 56px;animation:fadeOut .4s 1.5s forwards}
.intro-mark{display:flex;gap:.12em;font-family:Michroma,"Arial Narrow",sans-serif;font-size:clamp(38px,8vw,96px);font-weight:700;letter-spacing:.1em;animation:markOut .55s 1.45s cubic-bezier(.76,0,.24,1) forwards}
.intro-mark span{display:inline-block;opacity:0;transform:translateY(60%) rotateX(-80deg);filter:blur(8px);animation:letterIn .7s cubic-bezier(.2,.7,.2,1) forwards}
.intro-mark span:nth-child(1){animation-delay:.1s}.intro-mark span:nth-child(2){animation-delay:.17s}.intro-mark span:nth-child(3){animation-delay:.24s}.intro-mark span:nth-child(4){animation-delay:.31s}.intro-mark span:nth-child(5){animation-delay:.38s}.intro-mark span:nth-child(6){animation-delay:.45s}
.intro-mark .v{color:#2dc5f8;text-shadow:0 0 30px rgba(45,197,248,.7)}
.intro-line{position:absolute;left:50%;top:calc(50% + clamp(40px,6vw,80px));width:min(340px,60vw);height:1px;transform:translateX(-50%);background:rgba(207,223,235,.18);overflow:hidden;animation:fadeOut .3s 1.45s forwards}
.intro-line i{position:absolute;inset:0;background:linear-gradient(90deg,#1868c0,#2dc5f8);transform-origin:left;transform:scaleX(0);animation:lineFill 1.25s .15s cubic-bezier(.6,0,.2,1) forwards;box-shadow:0 0 14px #2dc5f8}
.intro-meta{position:absolute;left:50%;top:calc(50% + clamp(52px,6vw,92px));width:min(340px,60vw);transform:translateX(-50%);display:flex;justify-content:space-between;font:600 10px/1 ui-monospace,Menlo,monospace;letter-spacing:.24em;color:#7fb6d6;animation:fadeOut .3s 1.45s forwards}
@keyframes letterIn{to{opacity:1;transform:none;filter:none}}
@keyframes markOut{to{opacity:0;transform:scale(1.08);filter:blur(6px)}}
@keyframes lineFill{to{transform:scaleX(1)}}
@keyframes fadeOut{to{opacity:0}}
@keyframes panelUp{to{transform:translateY(-101%)}}
@keyframes panelDown{to{transform:translateY(101%)}}
@keyframes introGone{to{visibility:hidden}}

/* ---------- Hero ---------- */
.hero-field{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:0;animation:fadeIn 1.4s 1.9s forwards}
@keyframes fadeIn{to{opacity:1}}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero h1 .line>*{display:inline-block;transform:translateY(105%);animation:lineUp 1.1s cubic-bezier(.16,1,.3,1) forwards}
.hero h1 .line:nth-child(1)>*{animation-delay:1.85s}
.hero h1 .line:nth-child(2)>*{animation-delay:2s}
@keyframes lineUp{to{transform:none}}
.hero h1 strong{background-size:220% 100%!important;animation:lineUp 1.1s 2s cubic-bezier(.16,1,.3,1) forwards,shimmer 7s 3.2s ease-in-out infinite}
@keyframes shimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.scroll-cue{position:absolute;left:50%;bottom:110px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font:600 9px/1 ui-monospace,Menlo,monospace;letter-spacing:.3em;text-transform:uppercase;color:currentColor;opacity:0;animation:fadeIn 1s 2.8s forwards;z-index:3;pointer-events:none}
.scroll-cue i{position:relative;width:1px;height:46px;background:linear-gradient(currentColor,transparent);opacity:.55;overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;left:-1px;top:-14px;width:3px;height:14px;border-radius:2px;background:#2dc5f8;box-shadow:0 0 10px #2dc5f8;animation:cue 1.8s ease-in-out infinite}
@keyframes cue{to{transform:translateY(64px)}}
.hero-shell{position:relative}
.hero .signal-strip{transition:transform .2s linear}

/* Magnetic buttons */
.magnetic{transition:transform .35s cubic-bezier(.2,.7,.2,1),background .3s,color .3s,box-shadow .3s;will-change:transform}
.magnetic.is-magnet{transition:transform .12s linear,background .3s,color .3s,box-shadow .3s}

/* ---------- Custom cursor ---------- */
.fx-cursor,.fx-cursor-dot{position:fixed;left:0;top:0;pointer-events:none;z-index:1500;border-radius:50%;opacity:0;transition:opacity .3s}
.fx-cursor{width:38px;height:38px;margin:-19px 0 0 -19px;border:1px solid rgba(45,197,248,.75);transition:opacity .3s,width .3s cubic-bezier(.2,.7,.2,1),height .3s cubic-bezier(.2,.7,.2,1),margin .3s cubic-bezier(.2,.7,.2,1),background .3s,border-color .3s}
.fx-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:#2dc5f8;box-shadow:0 0 12px #2dc5f8}
html.has-cursor .fx-cursor,html.has-cursor .fx-cursor-dot{opacity:1}
html.cursor-hover .fx-cursor{width:70px;height:70px;margin:-35px 0 0 -35px;background:rgba(45,197,248,.1);border-color:rgba(45,197,248,.95)}
html.cursor-down .fx-cursor{width:28px;height:28px;margin:-14px 0 0 -14px}

/* ---------- Stats band ---------- */
.stats-band{position:relative;background:var(--paper);padding:90px 0 20px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat{padding:34px 28px 30px;border-left:1px solid var(--line);position:relative;overflow:hidden}
.stat:first-child{border-left:0}
.stat::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left;transition:transform 1.2s .3s cubic-bezier(.16,1,.3,1)}
.stat.is-visible::after{transform:scaleX(1)}
.stat strong{display:block;font-family:Michroma,"Arial Narrow",sans-serif;font-size:clamp(54px,6vw,92px);line-height:1;letter-spacing:-.05em;font-weight:650;background:linear-gradient(120deg,#0b3e7a,#1868c0 45%,#2dc5f8);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:14px}
.stat>span{display:block;font-size:14px;color:#55658a;max-width:22ch}

/* ---------- Stacked project cards ---------- */
@media (min-width:1121px) and (min-height:760px) and (prefers-reduced-motion:no-preference){
  .stack-card{position:sticky;top:112px;transform-origin:50% 0;will-change:scale,filter}
  .stack-card:nth-of-type(2){top:130px}
  .stack-card:nth-of-type(3){top:148px}
  .projects-section .project-grid{position:relative;z-index:2}
}
.project-visual img{transition:transform 1.2s cubic-bezier(.16,1,.3,1),clip-path 1.3s cubic-bezier(.16,1,.3,1)}
.project-card.reveal .project-visual img{clip-path:inset(0 0 100% 0)}
.project-card.reveal.is-visible .project-visual img{clip-path:inset(0 0 0 0)}
.project-card:hover .project-visual img{transform:scale(1.025)}
.mini-project{position:relative;overflow:hidden}
.mini-project::before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--x,50%) var(--y,50%),rgba(45,197,248,.16),transparent 70%);opacity:0;transition:opacity .35s;pointer-events:none}
.mini-project:hover::before{opacity:1}

/* ---------- Live demo ---------- */
.live-section{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--paper),#e7f2fa)}
.live-glow{position:absolute;width:900px;height:900px;right:-300px;top:10%;border-radius:50%;background:radial-gradient(circle,rgba(45,197,248,.18),transparent 65%);pointer-events:none;animation:float 9s ease-in-out infinite}
.live-demo{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:center;margin-top:20px;position:relative}
.live-steps{display:flex;flex-direction:column;gap:10px}
.live-step{position:relative;display:grid;grid-template-columns:46px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;text-align:left;padding:18px 20px;background:rgba(255,255,255,.66);border:1px solid var(--line);cursor:pointer;overflow:hidden;transition:background .35s,border-color .35s,transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.live-step span{grid-row:1/3;display:grid;place-items:center;width:46px;height:46px;border:1px solid #b7d4e8;font:700 12px/1 ui-monospace,Menlo,monospace;color:#1868c0;transition:background .35s,color .35s,border-color .35s}
.live-step b{font-size:17px;color:var(--navy)}
.live-step small{font-size:13px;color:#5d6d8d}
.live-step i{position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left}
.live-step:hover{transform:translateX(6px);border-color:#9ccbe9}
.live-step[aria-pressed="true"]{background:#fff;border-color:#7fc3ea;box-shadow:0 18px 45px rgba(6,35,90,.1);transform:translateX(10px)}
.live-step[aria-pressed="true"] span{background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;border-color:transparent}
.live-step[aria-pressed="true"] i{animation:stepTimer var(--step-ms,3200ms) linear forwards}
.live-demo.paused .live-step[aria-pressed="true"] i{animation-play-state:paused}
.live-step.done span{color:#0aa36b;border-color:#9ad8be}
@keyframes stepTimer{to{transform:scaleX(1)}}

.live-device{position:relative;background:#061a36;color:#e6f5ff;border:1px solid rgba(124,190,230,.3);box-shadow:0 50px 120px rgba(6,35,90,.28),0 0 0 1px rgba(255,255,255,.04) inset;transform:perspective(1400px) rotateY(-6deg) rotateX(3deg);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.live-device:hover{transform:perspective(1400px) rotateY(0) rotateX(0)}
.live-device .browser-bar{background:#0b2547;border-bottom:1px solid rgba(124,190,230,.18);color:#8fb8d6}
.device-screen{padding:26px 28px 24px;display:grid;gap:18px}
.device-head{display:flex;justify-content:space-between;align-items:end}
.device-head small{display:block;font:600 10px/1 ui-monospace,Menlo,monospace;letter-spacing:.22em;color:#7fb6d6;margin-bottom:8px}
.device-head strong{font-family:Michroma,"Arial Narrow",sans-serif;font-size:30px;letter-spacing:-.03em}
.device-status{display:flex;align-items:center;gap:9px;padding:8px 14px;border:1px solid rgba(124,190,230,.3);font-size:13px;color:#bfe6ff}
.device-status i{width:8px;height:8px;border-radius:50%;background:#2dc5f8;box-shadow:0 0 0 0 rgba(45,197,248,.6);animation:ping 1.6s infinite}
@keyframes ping{70%{box-shadow:0 0 0 10px rgba(45,197,248,0)}100%{box-shadow:0 0 0 0 rgba(45,197,248,0)}}
.device-progress{height:4px;background:rgba(255,255,255,.08);overflow:hidden}
.device-progress i{display:block;height:100%;width:calc(var(--p,0) * 1%);background:linear-gradient(90deg,#1868c0,#2dc5f8);box-shadow:0 0 14px #2dc5f8;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.device-body{display:grid;grid-template-columns:1fr 1fr;gap:18px;min-height:190px}
.scan-zone{position:relative;border:1px solid rgba(124,190,230,.2);background:radial-gradient(circle at 50% 50%,rgba(45,197,248,.1),transparent 70%);overflow:hidden;display:grid;place-items:center}
.scan-corners i{position:absolute;width:22px;height:22px;border-color:#2dc5f8;border-style:solid;border-width:0}
.scan-corners i:nth-child(1){left:14px;top:14px;border-left-width:2px;border-top-width:2px}
.scan-corners i:nth-child(2){right:14px;top:14px;border-right-width:2px;border-top-width:2px}
.scan-corners i:nth-child(3){left:14px;bottom:14px;border-left-width:2px;border-bottom-width:2px}
.scan-corners i:nth-child(4){right:14px;bottom:14px;border-right-width:2px;border-bottom-width:2px}
.scan-box{width:88px;height:70px;background:linear-gradient(160deg,#d9a35b,#b97a33);position:relative;box-shadow:0 14px 30px rgba(0,0,0,.35);transform:translateY(0);transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .6s}
.scan-box::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:14px;margin-left:-7px;background:rgba(255,255,255,.22)}
.scan-box span{position:absolute;right:8px;bottom:8px;width:30px;height:20px;background:#f4f8fb;opacity:0;transition:opacity .5s .3s}
.scan-beam{position:absolute;left:10%;right:10%;height:2px;top:20%;background:#2dc5f8;box-shadow:0 0 18px 3px rgba(45,197,248,.8);opacity:0}
.check-badge{position:absolute;right:16px;top:16px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#0aa36b;color:#fff;font-weight:800;transform:scale(0);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.label-printer{position:relative;border:1px solid rgba(124,190,230,.2);overflow:hidden;display:flex;justify-content:center}
.printer-slot{position:absolute;left:18%;right:18%;top:0;height:10px;background:#0b2547;border-bottom:2px solid #2dc5f8;z-index:2}
.label-paper{position:relative;width:64%;margin-top:4px;padding:16px 14px;background:#f8fbfd;color:#061a36;display:grid;gap:7px;align-content:start;transform:translateY(-104%);transition:transform 1.4s cubic-bezier(.45,0,.2,1);box-shadow:0 12px 24px rgba(0,0,0,.3)}
.label-paper b{font:800 13px/1 ui-monospace,Menlo,monospace;letter-spacing:.2em}
.label-paper span{height:7px;background:#cbd8e3}.label-paper span.short{width:60%}
.label-paper em{font:600 11px/1 ui-monospace,Menlo,monospace;font-style:normal;color:#1868c0;margin-top:6px}
.unit-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:6px}
.unit-grid i{aspect-ratio:1;border:1px solid rgba(124,190,230,.25);background:rgba(255,255,255,.03);transition:background .4s,border-color .4s,transform .4s cubic-bezier(.34,1.56,.64,1)}
.unit-grid i.on{background:linear-gradient(135deg,#1868c0,#2dc5f8);border-color:transparent;transform:scale(1.06);box-shadow:0 0 12px rgba(45,197,248,.45)}
.device-log{display:grid;gap:6px;min-height:118px;font:500 12px/1.4 ui-monospace,Menlo,monospace;color:#7fa9c6}
.device-log p{margin:0;opacity:.18;transform:translateX(-8px);transition:opacity .5s,transform .5s,color .5s}
.device-log p::before{content:"› ";color:#2dc5f8}
/* stage states */
.live-demo[data-stage="0"] .scan-beam{animation:beam 1.4s ease-in-out infinite}
.live-demo[data-stage="0"] .log-0,.live-demo[data-stage="1"] .log-1,.live-demo[data-stage="2"] .log-2,.live-demo[data-stage="3"] .log-3,.live-demo[data-stage="4"] .log-4{opacity:1;transform:none;color:#e6f5ff}
.live-demo[data-stage="1"] .log-0,.live-demo[data-stage="2"] :is(.log-0,.log-1),.live-demo[data-stage="3"] :is(.log-0,.log-1,.log-2),.live-demo[data-stage="4"] :is(.log-0,.log-1,.log-2,.log-3){opacity:.6;transform:none}
.live-demo:not([data-stage="0"]) .check-badge{transform:scale(1)}
.live-demo:not([data-stage="0"]) .scan-box span{opacity:1}
.live-demo[data-stage="1"] .scan-zone{background:radial-gradient(circle at 50% 50%,rgba(10,163,107,.18),transparent 70%)}
.live-demo:is([data-stage="2"],[data-stage="3"],[data-stage="4"]) .label-paper{transform:translateY(0)}
.live-demo:is([data-stage="3"],[data-stage="4"]) .scan-box{transform:translateX(140%);opacity:0}
.live-demo[data-stage="4"] .device-status{border-color:#0aa36b;color:#8ff0c6}
.live-demo[data-stage="4"] .device-status i{background:#0aa36b;animation:none}
@keyframes beam{0%,100%{top:18%;opacity:1}50%{top:80%;opacity:1}}

/* ---------- Services spotlight ---------- */
.spotlight{position:relative;isolation:isolate}
.spotlight::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(420px circle at var(--x,50%) var(--y,50%),rgba(45,197,248,.14),transparent 65%);opacity:0;transition:opacity .4s}
.spotlight:hover::before{opacity:1}
.spotlight .service-icon{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.spotlight:hover .service-icon{transform:rotate(180deg) scale(1.12)}

/* ---------- System links ---------- */
.system-links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.system-links line{stroke:rgba(24,104,192,.28);stroke-width:1;stroke-dasharray:4 7;animation:dash 1.6s linear infinite}
.system-links circle{fill:#2dc5f8;filter:drop-shadow(0 0 6px #2dc5f8)}
@keyframes dash{to{stroke-dashoffset:-22}}
.system-orbit .system-node{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s,border-color .5s}
.system-orbit .system-node:hover{box-shadow:0 20px 50px rgba(24,104,192,.22);border-color:#7fc3ea}
.system-orbit .core-mark{z-index:2}
.system-orbit .system-node{z-index:2}

/* ---------- Process line draw ---------- */
.process-line{position:relative}
.process-line::after{content:"";position:absolute;left:0;top:-1px;height:2px;width:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(var(--draw,0));transform-origin:left;box-shadow:0 0 12px rgba(45,197,248,.6)}

/* ---------- Kinetic band ---------- */
.kinetic{position:relative;padding:70px 0;background:var(--paper);overflow:hidden;display:grid;gap:6px}
.kinetic-row{white-space:nowrap;overflow:hidden}
.kinetic-track{display:inline-flex;align-items:center;gap:.4em;font-family:Michroma,"Arial Narrow",sans-serif;font-size:clamp(46px,9vw,140px);font-weight:700;letter-spacing:-.05em;line-height:1.1;will-change:transform}
.kinetic-track span{color:transparent;-webkit-text-stroke:1.5px #1868c0;transition:color .4s}
.kinetic-track span:hover{color:#1868c0}
.kinetic-row.reverse .kinetic-track span{-webkit-text-stroke:0;background:linear-gradient(90deg,#0b3e7a,#2dc5f8);-webkit-background-clip:text;background-clip:text;color:transparent}
.kinetic-track b{font-size:.45em;color:#2dc5f8}

/* ---------- Contact aurora ---------- */
.contact-aurora{position:absolute;inset:0;pointer-events:none;overflow:hidden;filter:blur(60px);opacity:.7}
.contact-aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen}
.contact-aurora i:nth-child(1){width:540px;height:540px;left:-120px;top:-160px;background:#1868c0;animation:aur1 14s ease-in-out infinite alternate}
.contact-aurora i:nth-child(2){width:460px;height:460px;right:-80px;bottom:-200px;background:#2dc5f8;opacity:.55;animation:aur2 17s ease-in-out infinite alternate}
.contact-aurora i:nth-child(3){width:380px;height:380px;left:40%;top:30%;background:#5b3fd6;opacity:.35;animation:aur1 20s ease-in-out infinite alternate-reverse}
@keyframes aur1{to{transform:translate(220px,140px) scale(1.2)}}
@keyframes aur2{to{transform:translate(-260px,-120px) scale(.9)}}
.contact-shell{position:relative;z-index:1}
.contact-section h2 em{background:linear-gradient(90deg,#bdeaff,#fff,#7fd6ff,#bdeaff);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 8s ease-in-out infinite}

/* ---------- Section headings ---------- */
.section-intro h2 em{display:inline-block;transition:clip-path 1.2s .15s cubic-bezier(.16,1,.3,1)}
.section-intro.reveal h2 em,.studio-heading.reveal h2 em{clip-path:inset(0 100% 0 0)}
.section-intro.reveal.is-visible h2 em,.studio-heading.reveal.is-visible h2 em{clip-path:inset(0 0 0 0)}
.studio-heading h2 em{display:inline-block;transition:clip-path 1.2s .15s cubic-bezier(.16,1,.3,1)}

/* ---------- Dark mode ---------- */
html[data-theme="dark"] .intro-panel{background:#051629}
html[data-theme="dark"] .stats-band,html[data-theme="dark"] .kinetic{background:#081a2c}
html[data-theme="dark"] .stat strong{background:linear-gradient(120deg,#e8f6ff,#8fd9ff 50%,#2dc5f8);-webkit-background-clip:text;background-clip:text}
html[data-theme="dark"] .stat>span{color:#a8c2d3}
html[data-theme="dark"] .live-section{background:linear-gradient(180deg,#081a2c,#0a2238)}
html[data-theme="dark"] .live-step{background:rgba(16,40,62,.7);border-color:#2c4c64}
html[data-theme="dark"] .live-step b{color:#eaf7ff}
html[data-theme="dark"] .live-step small{color:#a6c1d3}
html[data-theme="dark"] .live-step span{border-color:#3d6e8d;color:#6fd1fa}
html[data-theme="dark"] .live-step[aria-pressed="true"]{background:#123352;border-color:#4fa6d6;box-shadow:0 18px 45px rgba(0,0,0,.3)}
html[data-theme="dark"] .live-step[aria-pressed="true"] span{color:#fff}
html[data-theme="dark"] .live-device{background:#04111f;border-color:#2b5470}
html[data-theme="dark"] .system-links line{stroke:rgba(111,209,250,.3)}
html[data-theme="dark"] .kinetic-track span{-webkit-text-stroke-color:#6fd1fa}
html[data-theme="dark"] .kinetic-track span:hover{color:#6fd1fa}
html[data-theme="dark"] .kinetic-row.reverse .kinetic-track span{background-image:linear-gradient(90deg,#e8f6ff,#2dc5f8)}

/* ---------- Responsive ---------- */
@media(max-width:1120px){
  .live-demo{grid-template-columns:1fr}
  .live-steps{flex-direction:row;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .live-steps::-webkit-scrollbar{display:none}
  .live-step{flex:0 0 220px}
  .live-step:hover,.live-step[aria-pressed="true"]{transform:none}
  .live-device{transform:none}
}
@media(max-width:860px){
  .stats-grid{grid-template-columns:1fr 1fr}
  .stat:nth-child(3){border-left:0}
  .stat:nth-child(n+3){border-top:1px solid var(--line)}
  .scroll-cue{display:none}
}
@media(max-width:560px){
  .stats-band{padding-top:60px}
  .stat{padding:24px 16px}
  .device-screen{padding:18px 16px}
  .device-body{min-height:150px;gap:10px}
  .device-head strong{font-size:22px}
  .unit-grid{gap:4px}
  .live-step{flex-basis:190px;padding:14px}
  .kinetic{padding:44px 0}
}
@media(hover:none),(pointer:coarse){.fx-cursor,.fx-cursor-dot{display:none}}

/* ---------- Reduced motion: keep everything visible and still ---------- */
@media(prefers-reduced-motion:reduce){
  .intro,.hero-field,.scroll-cue,.fx-cursor,.fx-cursor-dot,.contact-aurora{display:none!important}
  .hero h1 .line>*,.hero h1 strong{transform:none!important;animation:none!important}
  .project-card.reveal .project-visual img,.section-intro.reveal h2 em,.studio-heading.reveal h2 em{clip-path:none!important}
  .live-step[aria-pressed="true"] i,.scan-beam,.device-status i,.system-links line,.live-glow{animation:none!important}
  .label-paper,.scan-box,.unit-grid i,.device-progress i{transition:none!important}
  .kinetic-track{transform:none!important}
  .process-line::after{transform:scaleX(1)}
  .stat::after{transform:scaleX(1);transition:none}
}