/* NoxSon Coding Website V2 – immersive home experience */
.home-v2 {
  --v2-bg: #04060b;
  --v2-bg-2: #080d17;
  --v2-cyan: #28e7f4;
  --v2-purple: #8c5cff;
  --v2-white: #f6f8fc;
  --v2-muted: #96a3b8;
  --v2-line: rgba(255,255,255,.11);
  min-height: 100%;
  overflow-x: clip;
  background: var(--v2-bg);
}

.home-v2.intro-pending { overflow: hidden; }
.home-v2 main { overflow: clip; }
.home-v2::selection { color:#061018; background:var(--v2-cyan); }

/* Intro */
.intro-gate {
  position: fixed;
  z-index: 9999;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #020307;
  opacity: 1;
  visibility: visible;
  transition: opacity .9s cubic-bezier(.22,.61,.36,1), visibility .9s;
}

.intro-gate.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.intro-video { width:100%; height:100%; object-fit:cover; background:#020307; }
.intro-vignette {
  position:absolute; inset:0;
  background: radial-gradient(circle at 50% 50%, transparent 25%, rgba(2,3,7,.12) 55%, rgba(2,3,7,.76) 100%);
  pointer-events:none;
}
.intro-controls {
  position:absolute; right:clamp(18px,3vw,46px); bottom:clamp(18px,3vw,40px);
  display:flex; gap:10px; align-items:center;
}
.intro-control {
  color:rgba(255,255,255,.72); font:700 11px/1 Inter,system-ui,sans-serif;
  letter-spacing:.08em; text-transform:uppercase;
  padding:10px 12px; background:rgba(4,7,12,.35); border:1px solid rgba(255,255,255,.14);
  border-radius:999px; backdrop-filter:blur(12px); cursor:pointer;
  transition:.25s ease;
}
.intro-control:hover { color:#fff; border-color:rgba(40,231,244,.48); transform:translateY(-1px); }
.intro-enter {
  position:absolute; left:50%; bottom:7.5%; transform:translateX(-50%) translateY(12px);
  display:grid; gap:4px; text-align:center; opacity:0;
  transition:opacity .45s ease, transform .45s ease;
}
.intro-gate.ending .intro-enter { opacity:.8; transform:translateX(-50%) translateY(0); }
.intro-enter span { font-size:11px; letter-spacing:.34em; font-weight:800; }
.intro-enter small { color:var(--v2-muted); font-size:8px; letter-spacing:.23em; }

/* Persistent shell */
.home-v2 .v2-header {
  position: fixed;
  z-index: 100;
  top: 16px; left:50%; transform:translateX(-50%);
  width:min(calc(100% - 28px),1220px);
  height:66px;
  padding:0 18px;
  background:rgba(6,9,16,.48);
  border:1px solid rgba(255,255,255,.075);
  border-radius:18px;
  backdrop-filter:blur(20px) saturate(140%);
  box-shadow:0 14px 50px rgba(0,0,0,.18);
  opacity:0; translate:0 -16px;
  transition:opacity .7s ease, translate .7s ease, background .35s ease, border-color .35s ease;
}
.home-v2.is-ready .v2-header { opacity:1; translate:0 0; }
.home-v2 .v2-header.is-scrolled { background:rgba(5,8,14,.78); border-color:rgba(255,255,255,.12); }
.home-v2 .v2-header nav a { position:relative; }
.home-v2 .v2-header nav a:not(.nav-cta)::after {
  position:absolute; left:0; right:100%; bottom:-7px; height:1px; content:"";
  background:linear-gradient(90deg,var(--v2-cyan),var(--v2-purple));
  transition:right .25s ease;
}
.home-v2 .v2-header nav a:hover::after { right:0; }

.page-progress { position:fixed; z-index:120; top:0; left:0; right:0; height:2px; pointer-events:none; }
.page-progress span { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--v2-cyan),var(--v2-purple)); box-shadow:0 0 18px rgba(40,231,244,.55); }
.cursor-glow {
  position:fixed; z-index:0; width:340px; height:340px; left:0; top:0; border-radius:50%;
  background:radial-gradient(circle,rgba(40,231,244,.07),rgba(140,92,255,.035) 34%,transparent 68%);
  transform:translate(-50%,-50%); pointer-events:none; opacity:0; filter:blur(8px);
  transition:opacity .35s ease;
}
@media (hover:hover) and (pointer:fine) { .home-v2:hover .cursor-glow { opacity:1; } }

/* Hero */
.v2-hero {
  position:relative; min-height:100svh; display:grid; place-items:center; isolation:isolate;
  padding:130px 24px 90px; overflow:hidden;
  background:
    radial-gradient(circle at 78% 37%,rgba(140,92,255,.11),transparent 27%),
    radial-gradient(circle at 20% 68%,rgba(40,231,244,.08),transparent 26%),
    linear-gradient(180deg,#05070d 0%,#060912 62%,#04060b 100%);
}
.ambient-grid {
  position:absolute; inset:-20%; z-index:-3; opacity:.23;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:72px 72px; transform:perspective(900px) rotateX(64deg) translateY(34%); transform-origin:center;
  mask-image:radial-gradient(circle at 50% 50%,#000 28%,transparent 72%);
}
.orb { position:absolute; z-index:-2; border-radius:50%; filter:blur(80px); opacity:.28; animation:orbFloat 11s ease-in-out infinite alternate; }
.orb-a { width:360px;height:360px;right:-80px;top:18%;background:#6337e7; }
.orb-b { width:280px;height:280px;left:-70px;bottom:8%;background:#12c9df;animation-delay:-3s; }
.orb-c { width:190px;height:190px;left:42%;top:12%;background:#3b73ff;opacity:.13;animation-delay:-6s; }
@keyframes orbFloat { to { transform:translate3d(20px,-28px,0) scale(1.08); } }

.hero-stage { width:min(100%,1220px); display:grid; grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr); align-items:center; gap:62px; }
.hero-copy-v2 { position:relative; z-index:3; }
.hero-kicker { display:inline-flex; align-items:center; gap:10px; margin-bottom:22px; color:#c8d1df; font-size:11px; font-weight:800; letter-spacing:.18em; }
.hero-kicker i { width:7px;height:7px;border-radius:50%;background:var(--v2-cyan);box-shadow:0 0 18px var(--v2-cyan);animation:statusPulse 1.8s ease-in-out infinite; }
@keyframes statusPulse { 50% { opacity:.35; box-shadow:0 0 5px var(--v2-cyan); } }
.hero-copy-v2 h1 { margin:0; max-width:680px; font-size:clamp(54px,6.9vw,94px); line-height:.91; letter-spacing:-.067em; font-weight:780; }
.hero-copy-v2 h1 span { color:transparent; background:linear-gradient(90deg,#fff 5%,var(--v2-cyan) 48%,#a981ff 90%); -webkit-background-clip:text; background-clip:text; }
.hero-copy-v2 p { max-width:610px; margin:30px 0 32px; color:var(--v2-muted); font-size:clamp(16px,1.35vw,19px); line-height:1.7; }
.hero-copy-v2 .button span { margin-left:14px; }

.hero-visual { position:relative; min-height:600px; perspective:1400px; transform-style:preserve-3d; }
.hero-halo { position:absolute; inset:15% 7%; background:conic-gradient(from 180deg,rgba(40,231,244,.3),rgba(140,92,255,.24),transparent 56%,rgba(40,231,244,.17)); filter:blur(70px); border-radius:50%; opacity:.45; }
.desk-window {
  position:absolute; z-index:4; top:50%; left:50%; width:min(740px,92%); margin:0; overflow:hidden;
  transform:translate(-50%,-50%) rotateY(-7deg) rotateX(3deg) rotateZ(-1deg);
  border:1px solid rgba(255,255,255,.17); border-radius:18px; background:#080d16;
  box-shadow:0 38px 100px rgba(0,0,0,.55),0 0 70px rgba(40,231,244,.09);
  transition:transform .25s ease-out;
}
.desk-window-bar { height:34px; display:flex; align-items:center; gap:7px; padding:0 12px; background:rgba(255,255,255,.045); border-bottom:1px solid rgba(255,255,255,.08); }
.desk-window-bar small { margin-left:10px; color:#718099; font-size:8px; letter-spacing:.12em; }
.desk-dot { width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.22); }
.desk-window img { display:block; width:100%; }
.floating-window { position:absolute; z-index:1; width:230px; height:154px; padding:13px; border:1px solid rgba(255,255,255,.12); border-radius:16px; backdrop-filter:blur(12px); box-shadow:0 26px 60px rgba(0,0,0,.28); }
.window-purple { right:-2%; top:10%; background:linear-gradient(145deg,rgba(140,92,255,.2),rgba(10,14,25,.76)); transform:rotate(9deg); }
.window-cyan { left:-4%; bottom:5%; background:linear-gradient(145deg,rgba(40,231,244,.16),rgba(10,14,25,.8)); transform:rotate(-8deg); }
.mini-bar { display:flex; gap:5px; }.mini-bar span{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.28)}
.mini-lines { display:grid; gap:9px; margin-top:27px; }.mini-lines i{height:7px;border-radius:4px;background:rgba(255,255,255,.08)}.mini-lines i:nth-child(2){width:76%}.mini-lines i:nth-child(3){width:87%}.mini-lines i:nth-child(4){width:52%}
.mini-stat { margin-top:24px;color:#8ba0b8;font-size:9px;letter-spacing:.15em }.mini-stat strong{display:block;margin-top:5px;color:var(--v2-cyan);font-size:24px;letter-spacing:-.04em}
.hero-badge { position:absolute; z-index:7; display:flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(7,11,19,.67);backdrop-filter:blur(12px);color:#aebbd0;font-size:9px;font-weight:800;letter-spacing:.11em;box-shadow:0 10px 28px rgba(0,0,0,.28); }
.hero-badge span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(40,231,244,.1);color:var(--v2-cyan)}
.badge-one{left:2%;top:20%;}.badge-two{right:5%;bottom:13%;}
.scroll-cue { position:absolute; left:50%; bottom:25px; transform:translateX(-50%); display:flex;flex-direction:column;align-items:center;gap:9px;color:#66758b;font-size:8px;font-weight:800;letter-spacing:.2em; }
.scroll-cue i{width:1px;height:34px;background:linear-gradient(var(--v2-cyan),transparent);animation:scrollLine 1.6s ease-in-out infinite;transform-origin:top}
@keyframes scrollLine{0%,100%{transform:scaleY(.4);opacity:.3}50%{transform:scaleY(1);opacity:1}}

/* Generic reveal */
.reveal { opacity:0; transform:translateY(34px); transition:opacity .85s cubic-bezier(.22,.61,.36,1), transform .85s cubic-bezier(.22,.61,.36,1); }
.reveal.in-view { opacity:1; transform:translateY(0); }

/* Marquee */
.brand-marquee { overflow:hidden; padding:28px 0; border-block:1px solid rgba(255,255,255,.06); background:#050810; }
.marquee-track { display:flex;align-items:center;gap:28px;width:max-content;white-space:nowrap;animation:marqueeMove 30s linear infinite; }
.marquee-track span { color:rgba(255,255,255,.13); font-size:clamp(42px,7vw,98px); line-height:.85;font-weight:850;letter-spacing:-.055em; }
.marquee-track i { color:rgba(40,231,244,.42);font-style:normal;font-size:24px; }
@keyframes marqueeMove { to { transform:translateX(-50%); } }

/* Story */
.story-shell { position:relative; height:410vh; background:linear-gradient(180deg,#04060b,#070b14 50%,#04060b); }
.story-sticky { position:sticky; top:0; min-height:100svh; display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);align-items:center;gap:40px;width:min(100%,1220px);margin:0 auto;padding:110px 24px 70px;overflow:hidden; }
.story-visual { position:relative; min-height:650px; display:grid;place-items:center; }
.core-rings { position:relative; width:min(420px,72vw);aspect-ratio:1;display:grid;place-items:center; }
.core-rings img { position:relative;z-index:5;width:31%;filter:drop-shadow(0 0 28px rgba(40,231,244,.28));transform:scale(.93);transition:transform .8s ease,filter .8s ease; }
.ring { position:absolute; inset:0;border:1px solid rgba(255,255,255,.07);border-radius:50%;box-shadow:inset 0 0 80px rgba(40,231,244,.018); }
.ring::before { position:absolute;top:50%;left:-4px;width:8px;height:8px;margin-top:-4px;content:"";border-radius:50%;background:var(--v2-cyan);box-shadow:0 0 16px var(--v2-cyan); }
.ring-1{animation:spin 14s linear infinite}.ring-2{inset:13%;border-style:dashed;animation:spinReverse 18s linear infinite}.ring-3{inset:29%;animation:spin 9s linear infinite;opacity:.7}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes spinReverse{to{transform:rotate(-360deg)}}
.story-lines { position:absolute;inset:0;width:100%;height:100%;overflow:visible; }
.story-lines path { stroke:rgba(40,231,244,.16);stroke-width:1;fill:none;stroke-dasharray:9 10;vector-effect:non-scaling-stroke; }
.story-node { position:absolute;z-index:6;padding:8px 12px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(8,12,20,.72);backdrop-filter:blur(12px);color:#8e9db3;font-size:9px;font-weight:800;letter-spacing:.12em;transition:.6s ease; }
.node-1{left:4%;top:17%}.node-2{right:4%;top:17%}.node-3{left:3%;bottom:17%}.node-4{right:2%;bottom:17%}
.story-shell[data-step="0"] .node-1,.story-shell[data-step="1"] .node-3,.story-shell[data-step="2"] .node-2,.story-shell[data-step="3"] .node-4 { color:#eaffff;border-color:rgba(40,231,244,.48);box-shadow:0 0 30px rgba(40,231,244,.1); }
.story-shell[data-step="3"] .core-rings img { transform:scale(1.08);filter:drop-shadow(0 0 46px rgba(140,92,255,.38)); }
.story-copy { position:relative; min-height:430px; }
.story-chapter { position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(26px);pointer-events:none;transition:opacity .55s ease,transform .55s ease; }
.story-chapter.active { opacity:1;transform:translateY(0);pointer-events:auto; }
.story-chapter>span { color:var(--v2-cyan);font-size:10px;font-weight:850;letter-spacing:.18em; }
.story-chapter h2 { margin:17px 0 24px;font-size:clamp(44px,5vw,72px);line-height:.98;letter-spacing:-.06em; }
.story-chapter h2 em { color:transparent;background:linear-gradient(90deg,var(--v2-cyan),#b693ff);-webkit-background-clip:text;background-clip:text;font-style:normal; }
.story-chapter p { max-width:510px;margin:0;color:var(--v2-muted);font-size:17px; }
.story-counter { position:absolute;right:24px;bottom:40px;display:flex;gap:8px; }
.story-counter span{width:28px;height:2px;background:rgba(255,255,255,.1);transition:.35s ease}.story-counter span.active{width:55px;background:linear-gradient(90deg,var(--v2-cyan),var(--v2-purple))}

/* Products and horizontal journey */
.product-world { position:relative;padding:145px 0 0;background:linear-gradient(180deg,#04060b,#070a12 20%,#05080e); }
.product-world-head { width:min(100%,1220px);margin:0 auto;padding:0 24px 50px; }
.product-world-head h2 { margin:0;max-width:920px;font-size:clamp(52px,7.4vw,104px);line-height:.91;letter-spacing:-.067em; }
.product-world-head h2 span{color:transparent;background:linear-gradient(90deg,#fff,var(--v2-cyan) 56%,#a37eff);-webkit-background-clip:text;background-clip:text}
.product-world-head p{max-width:650px;margin:26px 0 0;color:var(--v2-muted);font-size:18px}
.horizontal-journey { height:360vh; position:relative; }
.horizontal-sticky { position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center;padding-top:80px; }
.journey-track { display:flex;align-items:stretch;gap:28px;width:max-content;padding:0 max(24px,calc((100vw - 1172px)/2));will-change:transform; }
.journey-panel { position:relative;flex:0 0 min(1120px,86vw);height:min(690px,75vh);overflow:hidden;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:34px;padding:clamp(30px,4vw,64px);border:1px solid rgba(255,255,255,.1);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:0 30px 90px rgba(0,0,0,.28); }
.journey-panel::after{position:absolute;inset:0;content:"";pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.035),transparent 36%);}
.desk-panel { background:radial-gradient(circle at 85% 20%,rgba(40,231,244,.11),transparent 35%),radial-gradient(circle at 18% 80%,rgba(140,92,255,.1),transparent 38%),#0a0e18; }
.panel-copy{position:relative;z-index:4}.panel-index{display:block;margin-bottom:22px;color:var(--v2-cyan);font-size:10px;font-weight:850;letter-spacing:.16em}.product-logo-line{display:flex;align-items:center;gap:10px;margin-bottom:22px}.product-logo-line img{width:45px;height:45px;object-fit:contain;filter:drop-shadow(0 0 14px rgba(40,231,244,.25))}.product-logo-line span{font-size:12px;font-weight:850;letter-spacing:.15em}.panel-copy h3{margin:0;font-size:clamp(48px,5.3vw,78px);line-height:.92;letter-spacing:-.06em}.panel-copy p{max-width:510px;margin:24px 0;color:var(--v2-muted);font-size:16px}.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}.tag-row span{padding:7px 10px;border:1px solid rgba(255,255,255,.1);border-radius:999px;color:#aab6c9;font-size:10px}.panel-media{position:relative;height:100%;perspective:1400px}.shot-stack{position:absolute;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:#080d16;box-shadow:0 24px 70px rgba(0,0,0,.46)}.shot-stack img{display:block;width:100%}.shot-a{z-index:5;width:84%;left:5%;top:19%;transform:rotateY(-8deg) rotateZ(-1.5deg)}.shot-b{z-index:3;width:67%;right:-4%;top:4%;transform:rotateY(-11deg) rotateZ(6deg);opacity:.72}.shot-c{z-index:2;width:61%;left:-6%;bottom:2%;transform:rotateY(9deg) rotateZ(-7deg);opacity:.55}
.system-panel{grid-template-columns:1.05fr .95fr;background:radial-gradient(circle at 32% 50%,rgba(140,92,255,.13),transparent 35%),#090d17}.compact-copy{max-width:520px}.system-orbit{position:relative;width:min(520px,42vw);aspect-ratio:1;margin:auto;border:1px solid rgba(255,255,255,.06);border-radius:50%;box-shadow:inset 0 0 80px rgba(40,231,244,.025)}.system-orbit::before,.system-orbit::after{position:absolute;inset:16%;content:"";border:1px dashed rgba(255,255,255,.08);border-radius:50%;animation:spin 18s linear infinite}.system-orbit::after{inset:32%;animation-direction:reverse;animation-duration:12s}.orbit-center{position:absolute;z-index:3;inset:36%;display:grid;place-items:center;border-radius:50%;background:rgba(9,14,24,.9);border:1px solid rgba(40,231,244,.26);box-shadow:0 0 55px rgba(40,231,244,.11)}.orbit-center img{width:68%;filter:drop-shadow(0 0 20px rgba(40,231,244,.22))}.orbit-dot{position:absolute;z-index:4;display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:#0b111e;border:1px solid rgba(255,255,255,.12);color:#92a1b6;font-size:9px;font-weight:850;letter-spacing:.08em;box-shadow:0 12px 30px rgba(0,0,0,.25)}.dot-a{top:5%;left:43%;color:var(--v2-cyan);border-color:rgba(40,231,244,.32)}.dot-b{right:3%;top:43%}.dot-c{bottom:5%;left:43%}.dot-d{left:3%;top:43%}
.page-panel{grid-template-columns:1.18fr .82fr;background:radial-gradient(circle at 26% 20%,rgba(40,231,244,.09),transparent 33%),#090d16}.browser-frame{overflow:hidden;align-self:stretch;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:#060a11;box-shadow:0 30px 80px rgba(0,0,0,.36);transform:rotateY(6deg) rotateZ(-1deg);perspective:900px}.browser-top{height:38px;display:flex;align-items:center;gap:6px;padding:0 12px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.025)}.browser-top i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.2)}.browser-top span{margin-left:10px;padding:5px 12px;border-radius:6px;background:rgba(255,255,255,.04);color:#58677d;font-size:9px}.browser-body{height:calc(100% - 38px);display:flex;flex-direction:column;justify-content:center;padding:9%;background:radial-gradient(circle at 72% 40%,rgba(140,92,255,.12),transparent 35%),linear-gradient(145deg,#070b13,#0b101b)}.browser-label{color:var(--v2-cyan);font-size:9px;font-weight:850;letter-spacing:.17em}.browser-body strong{margin:17px 0 35px;font-size:clamp(35px,4vw,61px);line-height:.95;letter-spacing:-.055em}.browser-cards{display:grid;grid-template-columns:1.3fr .7fr;gap:12px}.browser-cards span{height:120px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:linear-gradient(145deg,rgba(40,231,244,.07),rgba(255,255,255,.018))}.browser-cards span:nth-child(3){grid-column:1/-1;height:75px;background:linear-gradient(145deg,rgba(140,92,255,.08),rgba(255,255,255,.015))}
.journey-progress{position:absolute;left:50%;bottom:28px;width:min(calc(100% - 48px),1172px);height:2px;transform:translateX(-50%);background:rgba(255,255,255,.08)}.journey-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--v2-cyan),var(--v2-purple));box-shadow:0 0 16px rgba(40,231,244,.3)}

/* NSC Desk spotlight */
.desk-spotlight{width:min(100%,1220px);margin:0 auto;padding:160px 24px;background:transparent}.spotlight-head{max-width:760px;margin-bottom:100px}.spotlight-head h2{margin:0;font-size:clamp(66px,9vw,126px);line-height:.84;letter-spacing:-.075em}.spotlight-head p{max-width:620px;margin:28px 0 0;color:var(--v2-muted);font-size:18px}.spotlight-grid{display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;gap:70px;margin:0 0 140px}.spotlight-grid.reverse{grid-template-columns:1.3fr .7fr}.spotlight-grid.reverse .spotlight-copy{order:2}.spotlight-grid.reverse .spotlight-screen{order:1}.spotlight-copy .chapter-number{display:block;color:var(--v2-cyan);font-size:10px;font-weight:850;letter-spacing:.16em;margin-bottom:22px}.spotlight-copy h3{margin:0;font-size:clamp(38px,4vw,58px);line-height:.98;letter-spacing:-.05em}.spotlight-copy p{margin:22px 0;color:var(--v2-muted);font-size:16px}.spotlight-copy a{display:inline-flex;align-items:center;gap:10px;color:#e9f5f7;font-size:13px;font-weight:780}.spotlight-copy a span{color:var(--v2-cyan);transition:transform .2s ease}.spotlight-copy a:hover span{transform:translateX(4px)}.spotlight-screen{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:#080d16;box-shadow:0 35px 90px rgba(0,0,0,.36);transform-style:preserve-3d;transition:transform .16s ease-out}.spotlight-screen::before{position:absolute;z-index:2;inset:0;content:"";background:linear-gradient(120deg,rgba(255,255,255,.07),transparent 30%);pointer-events:none}.spotlight-screen img{display:block;width:100%}

/* Philosophy */
.philosophy{width:min(100%,1220px);margin:0 auto;padding:70px 24px 170px}.philosophy-line{display:grid;grid-template-columns:54px minmax(0,1fr) minmax(260px,.52fr);align-items:center;gap:26px;padding:34px 0;border-top:1px solid rgba(255,255,255,.09)}.philosophy-line:last-child{border-bottom:1px solid rgba(255,255,255,.09)}.philosophy-line>span{color:var(--v2-cyan);font-size:10px;font-weight:850;letter-spacing:.14em}.philosophy-line strong{font-size:clamp(54px,8.6vw,128px);line-height:.8;letter-spacing:-.07em;transition:.35s ease}.philosophy-line small{color:var(--v2-muted);font-size:14px;line-height:1.55}.philosophy-line:hover strong{color:transparent;background:linear-gradient(90deg,#fff,var(--v2-cyan),#a47cff);-webkit-background-clip:text;background-clip:text;transform:translateX(10px)}

/* CTA / Footer */
.v2-cta{position:relative;overflow:hidden;width:min(calc(100% - 48px),1172px);margin:0 auto 110px;padding:clamp(45px,7vw,100px);text-align:center;border:1px solid rgba(40,231,244,.18);border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015));isolation:isolate}.v2-cta .cta-orb{position:absolute;z-index:-1;left:50%;top:50%;width:72%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:conic-gradient(from 180deg,rgba(40,231,244,.2),rgba(140,92,255,.18),transparent 56%);filter:blur(80px);opacity:.5}.v2-cta h2{margin:0;font-size:clamp(56px,7.7vw,108px);line-height:.88;letter-spacing:-.07em}.v2-cta h2 span{color:transparent;background:linear-gradient(90deg,var(--v2-cyan),#af8cff);-webkit-background-clip:text;background-clip:text}.v2-cta p{max-width:620px;margin:28px auto 30px;color:var(--v2-muted);font-size:17px}.home-v2 .v2-footer{position:relative;z-index:2}.footer-replay{padding:0;color:inherit;font:inherit;background:none;border:0;cursor:pointer}.footer-replay:hover{color:var(--v2-white)}

/* Magnetic buttons */
.home-v2 .button { position:relative; overflow:hidden; }
.home-v2 .primary { color:#031014;background:linear-gradient(110deg,#55f0f8,var(--v2-cyan) 40%,#9a79ff 115%);box-shadow:0 12px 40px rgba(40,231,244,.14); }
.home-v2 .primary::after { position:absolute;top:-90%;left:-45%;width:32%;height:280%;content:"";background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:rotate(22deg);transition:left .55s ease; }
.home-v2 .primary:hover::after { left:118%; }
.home-v2 .secondary { background:rgba(255,255,255,.025);backdrop-filter:blur(10px); }

/* Responsive */
@media (max-width: 1050px) {
  .hero-stage { grid-template-columns:1fr;gap:30px;padding-top:45px; }
  .v2-hero { align-items:start; }
  .hero-copy-v2 { max-width:780px;padding-top:35px; }
  .hero-visual { min-height:540px;width:min(100%,820px);margin:0 auto; }
  .story-sticky { grid-template-columns:1fr;gap:0;align-content:center; }
  .story-visual { min-height:460px;opacity:.75; }
  .story-copy { min-height:330px;max-width:720px; }
  .story-counter { right:auto;left:24px; }
  .journey-panel { grid-template-columns:1fr 1fr;flex-basis:90vw; }
  .spotlight-grid,.spotlight-grid.reverse { grid-template-columns:1fr;gap:35px; }
  .spotlight-grid.reverse .spotlight-copy,.spotlight-grid.reverse .spotlight-screen{order:initial}
  .spotlight-copy{max-width:720px}.spotlight-grid{margin-bottom:100px}
}

@media (max-width: 850px) {
  .home-v2 .v2-header { top:10px;width:calc(100% - 20px); }
  .home-v2 .v2-header nav { top:74px;right:0;left:0;background:rgba(8,13,23,.96);backdrop-filter:blur(20px); }
  .home-v2 .v2-header nav a:not(.nav-cta)::after { display:none; }
  .v2-hero { padding-inline:20px; }
  .hero-copy-v2 h1 { font-size:clamp(52px,12vw,78px); }
  .hero-visual { min-height:460px; }
  .floating-window { transform:scale(.8) !important; }
  .story-shell { height:360vh; }
  .story-sticky { padding-top:100px; }
  .story-visual { min-height:390px; }
  .core-rings { width:min(330px,70vw); }
  .story-node { font-size:7px;padding:6px 8px; }
  .journey-panel { flex-basis:92vw;height:72vh;min-height:610px;grid-template-columns:1fr;padding:32px; }
  .panel-media { position:absolute;inset:auto -7% -5% 32%;height:52%;opacity:.42; }
  .desk-panel .panel-copy { max-width:600px; }
  .system-panel,.page-panel{grid-template-columns:1fr}.system-orbit{position:absolute;width:420px;right:-110px;bottom:-100px;opacity:.42}.browser-frame{position:absolute;right:-18%;bottom:-16%;width:70%;height:62%;opacity:.35}.compact-copy{align-self:start;max-width:580px}.product-world-head h2{font-size:clamp(50px,11vw,78px)}
  .philosophy-line{grid-template-columns:40px 1fr}.philosophy-line small{grid-column:2}.philosophy-line strong{font-size:clamp(50px,14vw,90px)}
}

@media (max-width: 620px) {
  .intro-controls { left:16px;right:16px;justify-content:space-between; }
  .intro-enter { bottom:12%; }
  .v2-hero { min-height:100svh;padding-top:105px;padding-bottom:65px; }
  .hero-stage { display:block; }
  .hero-copy-v2 h1 { font-size:clamp(48px,14vw,68px);line-height:.92; }
  .hero-copy-v2 p{margin:22px 0 25px;font-size:15px}.hero-copy-v2 .hero-actions{display:grid;grid-template-columns:1fr}.hero-copy-v2 .button{width:100%}
  .hero-visual{min-height:385px;margin-top:28px}.desk-window{width:96%;transform:translate(-50%,-50%) rotateY(-5deg) rotateZ(-1deg)}.desk-window-bar small{display:none}.window-purple{right:-16%;top:0}.window-cyan{left:-17%;bottom:-4%}.hero-badge{font-size:7px}.badge-one{left:-3%;top:12%}.badge-two{right:-2%;bottom:8%}.scroll-cue{display:none}
  .brand-marquee{padding:22px 0}.marquee-track span{font-size:45px}
  .story-shell{height:330vh}.story-sticky{display:block;padding:92px 18px 40px}.story-visual{min-height:330px}.story-copy{min-height:300px}.story-chapter{justify-content:flex-start;padding-top:12px}.story-chapter h2{font-size:clamp(42px,12vw,58px)}.story-chapter p{font-size:14px}.story-counter{left:18px;bottom:18px}
  .product-world{padding-top:100px}.product-world-head{padding-inline:20px}.product-world-head p{font-size:15px}.horizontal-journey{height:300vh}.horizontal-sticky{padding-top:70px}.journey-track{gap:14px;padding-inline:16px}.journey-panel{flex-basis:calc(100vw - 32px);height:74vh;min-height:590px;border-radius:22px;padding:26px}.panel-copy h3{font-size:clamp(45px,13vw,62px)}.panel-copy p{font-size:14px}.product-logo-line{margin-bottom:16px}.product-logo-line img{width:38px;height:38px}.panel-media{left:18%;right:-14%;bottom:-3%;height:42%}.system-orbit{width:330px}.browser-frame{width:84%;height:54%;right:-26%}.journey-progress{bottom:16px}
  .desk-spotlight{padding:105px 20px}.spotlight-head{margin-bottom:65px}.spotlight-head h2{font-size:clamp(62px,18vw,90px)}.spotlight-head p{font-size:15px}.spotlight-grid{margin-bottom:75px}.spotlight-copy h3{font-size:clamp(38px,11vw,50px)}
  .philosophy{padding:20px 20px 110px}.philosophy-line{gap:12px;padding:26px 0}.philosophy-line strong{font-size:clamp(46px,15vw,74px)}
  .v2-cta{width:calc(100% - 32px);margin-bottom:70px;padding:52px 24px;border-radius:24px}.v2-cta h2{font-size:clamp(48px,14vw,70px)}.v2-cta p{font-size:15px}.v2-cta .button{width:100%}
  .home-v2 .v2-footer{padding-inline:20px}.home-v2 .v2-footer .footer-links{gap:14px}
}

@media (prefers-reduced-motion: reduce) {
  .home-v2 *, .home-v2 *::before, .home-v2 *::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .intro-gate { display:none !important; }
  .home-v2.intro-pending { overflow:auto; }
  .reveal { opacity:1; transform:none; }
  .journey-track { transform:none !important; }
  .horizontal-journey { height:auto; }
  .horizontal-sticky { position:relative;height:auto;overflow-x:auto;padding:80px 0; }
}

/* NSC System Center product card */
.systemcenter-panel{position:relative;cursor:pointer;background:radial-gradient(circle at 20% 28%,rgba(38,229,238,.13),transparent 34%),radial-gradient(circle at 82% 72%,rgba(139,92,246,.15),transparent 38%),#080c15;transition:border-color .28s ease,box-shadow .28s ease,transform .28s ease}
.systemcenter-panel:hover{border-color:rgba(57,225,238,.3);box-shadow:0 34px 100px rgba(0,0,0,.4),0 0 70px rgba(57,225,238,.055)}
.panel-hit-link{position:absolute;z-index:8;inset:0;border-radius:inherit}
.panel-hit-link:focus-visible{outline:2px solid var(--v2-cyan);outline-offset:-5px}
.systemcenter-panel .panel-copy{pointer-events:none}
.systemcenter-panel .product-logo-line{margin-bottom:16px}
.panel-faux-button{display:inline-flex;align-items:center;padding:13px 19px;border-radius:11px;color:#061018;font-size:14px;font-weight:800;background:linear-gradient(135deg,var(--v2-cyan),var(--v2-purple));box-shadow:0 12px 35px rgba(40,231,244,.13)}
.systemcenter-mini-media{position:relative;height:100%;min-height:440px;perspective:1300px;pointer-events:none}
.systemcenter-mini-glow{position:absolute;inset:15% 10%;background:linear-gradient(135deg,rgba(40,231,244,.24),rgba(139,92,246,.22));filter:blur(70px);opacity:.46}
.systemcenter-mini-screen{position:absolute;z-index:2;left:-5%;top:15%;width:104%;overflow:hidden;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:#0e131d;box-shadow:0 35px 90px rgba(0,0,0,.48);transform:rotateY(7deg) rotateZ(-1.2deg);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.systemcenter-panel:hover .systemcenter-mini-screen{transform:rotateY(3deg) rotateZ(-.4deg) translateY(-5px)}
.systemcenter-mini-screen img{display:block;width:100%;height:auto}
.systemcenter-mini-screen::after{position:absolute;inset:0;content:"";background:linear-gradient(115deg,rgba(255,255,255,.06),transparent 30%,transparent 70%,rgba(40,231,244,.035));pointer-events:none}
.systemcenter-mini-chip{position:absolute;z-index:4;display:flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(7,11,19,.86);box-shadow:0 18px 42px rgba(0,0,0,.32);backdrop-filter:blur(14px);font-size:10px;letter-spacing:.05em}
.systemcenter-mini-chip strong{color:#f3f7fb;font-size:11px}.systemcenter-mini-chip span{color:#91a0b4}.systemcenter-mini-chip i{width:7px;height:7px;border-radius:50%;background:#22d98a;box-shadow:0 0 12px rgba(34,217,138,.75)}
.chip-health{left:3%;bottom:14%}.chip-health strong{color:#39dca0}.chip-live{right:-2%;top:10%}.chip-live span{color:var(--v2-cyan);font-weight:900}
@media(max-width:900px){.systemcenter-mini-media{position:absolute;inset:auto -7% -6% 25%;height:53%;min-height:0;opacity:.43}.systemcenter-mini-screen{left:0;top:8%;width:100%}.systemcenter-mini-chip{display:none}.systemcenter-panel .panel-copy{max-width:620px}}
@media(max-width:650px){.systemcenter-mini-media{left:14%;right:-22%;height:40%;opacity:.36}.systemcenter-panel .tag-row{max-width:82%}}

/* =========================================================
   V2.4 — responsive desktop / large-display refinements
   ========================================================= */
@media (min-width: 1280px) {
  .home-v2 .v2-header {
    width: min(calc(100% - 64px), 1680px);
  }

  .hero-stage,
  .product-world-head,
  .story-sticky,
  .philosophy {
    width: min(calc(100% - 64px), 1680px);
  }

  .hero-stage {
    grid-template-columns: minmax(420px, .82fr) minmax(620px, 1.18fr);
    gap: clamp(56px, 4vw, 92px);
  }

  .horizontal-journey {
    height: 365vh;
  }

  .horizontal-sticky {
    padding-top: clamp(72px, 7vh, 110px);
  }

  .journey-track {
    gap: clamp(24px, 1.8vw, 40px);
    padding-inline: max(5vw, calc((100vw - 2200px) / 2));
  }

  .journey-panel {
    flex-basis: clamp(1120px, 90vw, 2200px);
    height: min(780px, calc(100svh - 150px));
    min-height: 620px;
    padding: clamp(48px, 4vw, 82px);
    gap: clamp(42px, 4vw, 90px);
    grid-template-columns: minmax(390px, .82fr) minmax(0, 1.18fr);
  }

  .journey-panel.systemcenter-panel {
    grid-template-columns: minmax(390px, .9fr) minmax(0, 1.1fr);
  }

  .panel-copy h3 {
    font-size: clamp(64px, 5vw, 96px);
  }

  .panel-copy p {
    max-width: 620px;
    font-size: clamp(16px, 1vw, 19px);
  }

  .panel-media,
  .systemcenter-mini-media {
    min-width: 0;
  }

  .systemcenter-mini-media {
    min-height: 0;
  }

  .systemcenter-mini-screen {
    left: 0;
    top: 50%;
    width: 100%;
    transform: translateY(-50%) rotateY(4deg) rotateZ(-.6deg);
  }

  .systemcenter-panel:hover .systemcenter-mini-screen {
    transform: translateY(calc(-50% - 5px)) rotateY(2deg) rotateZ(-.25deg);
  }

  .journey-progress {
    width: min(90vw, 2200px);
  }
}

@media (min-width: 1800px) {
  .hero-stage,
  .product-world-head,
  .story-sticky,
  .philosophy {
    width: min(calc(100% - 96px), 1820px);
  }

  .product-world-head h2 {
    max-width: 1180px;
  }
}