/* ============================================================
   StereoMed — Design tokens
   ============================================================ */
:root{
  --bg-light:#F7F9FC;
  --white:#FFFFFF;
  --ink:#0A1428;
  --navy-deep:#07111F;
  --dark-surface:#0B1728;
  --blue:#2477FF;
  --cyan:#35D9FF;
  --violet:#7467FF;
  --text-light:#F5F8FC;
  --muted:#4C5A70;        /* darkened for contrast */
  --muted-on-dark:#A9B8D0; /* lightened for contrast */
  --border-light:rgba(10,20,40,0.10);
  --border-dark:rgba(255,255,255,0.14);

  --font-head:'Sora', sans-serif;
  --font-body:'IBM Plex Sans', sans-serif;

  --max:1280px;
  --gutter:48px;
  --radius-lg:22px;
  --radius-md:14px;
  --radius-sm:8px;

  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
}
body{
  margin:0;
  background:var(--navy-deep);
  color:var(--text-light);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4,.font-head{font-family:var(--font-head); margin:0;}
p{margin:0;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit;}
.wrap{max-width:var(--max); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter);}

:focus-visible{outline:2px solid var(--blue); outline-offset:3px; border-radius:4px;}

.eyebrow{
  font-family:var(--font-head);
  font-size:12.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--blue);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{content:''; width:16px; height:1.5px; background:var(--blue); display:inline-block;}
.on-dark .eyebrow{color:var(--cyan);}
.on-dark .eyebrow::before{background:var(--cyan);}

.section-title{
  font-size:clamp(28px,3.6vw,42px);
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.01em;
  margin:14px 0 0;
}
.section-support{
  font-size:16px;
  line-height:1.65;
  color:var(--muted);
  max-width:560px;
  margin-top:16px;
}
.on-dark .section-support{color:var(--muted-on-dark);}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 26px;
  font-size:14.5px;
  font-weight:600;
  border-radius:var(--radius-sm);
  font-family:var(--font-body);
  transition:transform .2s var(--ease), background .2s var(--ease), border-color .2s var(--ease), opacity .2s var(--ease);
  white-space:nowrap;
  border:1px solid transparent;
  cursor:pointer;
}
.btn-primary{background:var(--ink); color:var(--white);}
.btn-primary:hover{transform:translateY(-1px); background:var(--blue);}
.btn-ghost{border-color:var(--border-light); color:var(--ink);}
.btn-ghost:hover{border-color:var(--ink); transform:translateY(-1px);}
.on-dark .btn-ghost, .hero .btn-ghost, header .btn-ghost{border-color:var(--border-dark); color:var(--text-light);}
.on-dark .btn-ghost:hover, .hero .btn-ghost:hover, header .btn-ghost:hover{border-color:var(--text-light);}
.btn-cyan{background:var(--cyan); color:var(--navy-deep);}
.btn-cyan:hover{transform:translateY(-1px); opacity:.9;}

.section{position:relative; padding:112px 0; background:var(--navy-deep); color:var(--text-light);}
.section.tight{padding:88px 0;}
.section.on-dark{background:var(--navy-deep); color:var(--text-light);}
.section .section-support,
.section .muted,
.section .showcase .desc,
.section .feature-list .fdesc{color:var(--muted-on-dark);}
.section .feature-list .f{border-top-color:var(--border-dark);}
.section .btn-ghost{border-color:var(--border-dark); color:var(--text-light);}
.section .btn-ghost:hover{border-color:var(--text-light);}
.muted{color:var(--muted);}

/* reveal-on-scroll */
[data-reveal]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
[data-reveal].in-view{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1; transform:none; transition:none;}
}

/* ============================================================
   NAV
   ============================================================ */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:20px 0;
  transition:background .35s var(--ease), border-color .35s var(--ease), padding .35s var(--ease), backdrop-filter .35s var(--ease);
  border-bottom:1px solid transparent;
}
header.on-dark-hero{background:transparent;}
header.scrolled{
  background:rgba(7,17,31,.72);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--border-dark);
  padding:14px 0;
}
nav.wrap{display:flex; align-items:center; justify-content:space-between;}
.brand{display:flex; align-items:center; gap:9px;}
.brand img.wordmark{height:22px; width:auto;}
.nav-mid{display:flex; align-items:center; gap:38px;}
.nav-links{display:flex; gap:30px; font-size:14px; font-weight:500; color:var(--text-light);}
.nav-links a{position:relative; padding:4px 0;}
.nav-links a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1.5px; background:var(--cyan);
  transition:right .25s var(--ease);
}
.nav-links a:hover::after{right:0;}
.nav-actions{display:flex; align-items:center; gap:18px;}
.nav-toggle{
  display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer;
  padding:10px; margin:-10px;
}
.nav-toggle span{width:20px; height:1.5px; background:var(--text-light); display:block; transition:transform .25s var(--ease), opacity .25s var(--ease);}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

.mobile-panel{
  display:none;
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:99;
  background:var(--navy-deep);
  padding:100px 32px 40px;
  flex-direction:column; gap:6px;
}
.mobile-panel.open{display:flex;}
.mobile-panel a{font-family:var(--font-head); font-size:26px; font-weight:700; padding:14px 0; border-bottom:1px solid var(--border-dark); color:var(--text-light);}
.mobile-panel .btn{margin-top:20px; width:100%; border-bottom:none; font-family:var(--font-body); font-size:14.5px; padding:14px 26px;}
.mobile-panel .btn-ghost{border-color:var(--border-dark); color:var(--text-light);}

/* ============================================================
   HERO — dark cinematic
   ============================================================ */
.hero{position:relative; overflow:hidden; padding:150px 0 0; background:var(--navy-deep); color:var(--text-light);}
.hero-bg-grid{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(85% 60% at 60% 20%, black, transparent 75%);
}
.hero-grid{position:relative; z-index:1; display:grid; grid-template-columns:.82fr 1.18fr; gap:12px; align-items:center; padding-bottom:0;}
.hero-copy .lede{font-size:17px; line-height:1.65; color:var(--muted-on-dark); max-width:460px; margin-top:22px;}
.hero-copy h1{
  font-size:clamp(38px,4.6vw,58px);
  line-height:1.06;
  font-weight:800;
  letter-spacing:-.02em;
  margin-top:20px;
  max-width:560px;
  color:var(--text-light);
}
.hero-copy .cta-row{display:flex; gap:14px; margin-top:36px; flex-wrap:wrap;}
.hero-copy .meta{
  margin-top:44px; font-family:var(--font-head); font-size:12.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted-on-dark); display:flex; align-items:center; gap:10px;
}
.hero-copy .meta .sep{width:5px; height:5px; border-radius:50%; background:var(--cyan);}

.hero-visual-lg{position:relative; height:680px;}
.hero-stage-lg{position:absolute; inset:-40px -40px -60px 0; overflow:visible;}
.hero-atmo{
  position:absolute; inset:6% 4% 10% 4%; border-radius:28px; overflow:hidden;
}
.hero-atmo img{width:100%; height:100%; object-fit:cover; filter:blur(2px) saturate(1.1) brightness(.55); transform:scale(1.08);}
.hero-atmo::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(7,17,31,.55), rgba(7,17,31,.85) 70%);
}
.hero-glow{position:absolute; border-radius:50%; filter:blur(60px); pointer-events:none;}
.hero-glow.g1{width:420px; height:420px; right:0; top:-6%; background:radial-gradient(circle, rgba(116,103,255,.45), transparent 70%);}
.hero-glow.g2{width:380px; height:380px; left:6%; bottom:-4%; background:radial-gradient(circle, rgba(53,217,255,.32), transparent 70%);}

.hero-float{
  position:absolute; border-radius:16px; overflow:hidden;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.1);
  transition:transform .2s var(--ease);
  will-change:transform;
}
.hero-float img{width:100%; height:100%; display:block; object-fit:cover;}
.hero-float-main{left:6%; top:10%; width:64%; z-index:3; box-shadow:0 50px 100px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.12);}
.hero-float-depth{right:1%; bottom:12%; width:32%; z-index:4;}
.hero-float-left{left:-2%; top:44%; width:26%; z-index:2; aspect-ratio:4/3;}
.hero-float-left img{object-position:0% 50%; width:200%; max-width:none;}

.hero-chip{
  position:absolute; left:7%; top:4%; z-index:5;
  background:rgba(11,23,40,.72);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(8px);
  border-radius:100px;
  padding:9px 16px;
  display:flex; align-items:center; gap:8px;
  font-family:var(--font-head); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-light);
  transition:transform .2s var(--ease);
  will-change:transform;
}
.hero-chip .dot{width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan);}
@media (prefers-reduced-motion: reduce){
  .hero-float, .hero-chip{transition:none;}
}
.hero-scroll-cue{
  position:relative; z-index:10; display:flex; justify-content:center; padding:22px 0;
  background:linear-gradient(180deg, rgba(7,17,31,.9), var(--navy-deep) 45%);
  font-family:var(--font-head); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-on-dark);
}

/* ============================================================
   TECHNOLOGY / TRANSFORMATION SEQUENCE
   ============================================================ */
.tech-section{background:var(--navy-deep);}
.transform-scroller{position:relative; margin-top:56px;}
.transform-sticky{position:relative;}
.transform-stage{
  display:grid; grid-template-columns:repeat(4,1fr); gap:22px;
}
.tf-layer{position:relative; border-radius:var(--radius-md); overflow:hidden; background:var(--navy-deep); border:1px solid var(--border-light); box-shadow:0 24px 48px -32px rgba(10,20,40,.28);}
.tf-layer img{width:100%; aspect-ratio:4/3; object-fit:cover; display:block;}
.tf-layer.tf-1 img{object-position:0% 50%; width:200%; max-width:none;}
.tf-label{padding:16px 18px 18px; }
.tf-label .tf-n{font-family:var(--font-head); font-size:11px; color:var(--blue); font-weight:700; letter-spacing:.05em;}
.tf-label .tf-name{font-family:var(--font-head); font-weight:700; font-size:16px; margin-top:5px; color:var(--ink);}
.tf-label .tf-desc{font-size:13px; color:var(--muted); margin-top:4px; line-height:1.5;}
.tf-layer[style]{}

.transform-ticks{display:none;}

/* Enhanced (JS + motion allowed) pinned crossfade mode */
.tf-enhanced.transform-scroller{height:340vh;}
.tf-enhanced .transform-sticky{position:sticky; top:96px; height:calc(100vh - 120px); display:flex; flex-direction:column; justify-content:center;}
.tf-enhanced .transform-stage{
  position:relative; height:min(64vh,560px); display:block; grid-template-columns:none;
}
.tf-enhanced .tf-layer{
  position:absolute; inset:0; opacity:0; transition:opacity .6s var(--ease), transform .6s var(--ease);
  transform:scale(.98);
}
.tf-enhanced .tf-layer img{height:100%;}
.tf-enhanced .tf-layer.active{opacity:1; transform:scale(1); z-index:2;}
.tf-enhanced .tf-label{
  position:absolute; left:28px; bottom:28px; z-index:2;
  background:rgba(7,17,31,.68); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:14px 18px;
}
.tf-enhanced .tf-label .tf-name, .tf-enhanced .tf-label .tf-n{color:var(--text-light);}
.tf-enhanced .tf-label .tf-desc{color:var(--muted-on-dark);}
.tf-enhanced .transform-ticks{
  display:flex; gap:10px; margin-top:26px; justify-content:center;
}
.tf-enhanced .transform-ticks span{
  font-family:var(--font-head); font-size:11.5px; letter-spacing:.04em; color:var(--muted);
  padding:8px 16px; border:1px solid var(--border-light); border-radius:100px; transition:all .3s var(--ease);
}
.tf-enhanced .transform-ticks span.active{color:var(--white); background:var(--ink); border-color:var(--ink);}

/* ============================================================
   ECOSYSTEM (Create -> Present -> Powered By)
   ============================================================ */
.products-hero{overflow:hidden; padding-top:176px;}
.products-hero>.wrap{position:relative; z-index:1;}
.products-bg-image{
  position:absolute; left:0; right:0; top:0; height:760px; pointer-events:none;
  background-image:linear-gradient(90deg, rgba(7,17,31,.9) 0%, rgba(7,17,31,.58) 42%, rgba(7,17,31,.32) 72%, rgba(7,17,31,.62) 100%), url('../products-hero-background.png');
  background-position:calc(50% + 300px) -80px;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:.72;
  mask-image:linear-gradient(to bottom, black 0%, black 68%, transparent 100%);
}
.products-bg-grid{
  position:absolute; inset:0; pointer-events:none;
  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:44px 44px;
  mask-image:radial-gradient(80% 42% at 38% 8%, black, transparent 78%);
}
.products-hero-copy h1{
  max-width:820px; margin-top:20px; color:var(--text-light);
  font-family:var(--font-head); font-size:clamp(46px,7vw,88px); font-weight:800; line-height:1.02; letter-spacing:-.035em;
}
.products-ecosystem-intro{margin-top:104px; padding-top:48px; border-top:1px solid var(--border-dark);}
.products-ecosystem-intro .section-support{max-width:620px;}
.ecosystem-track{position:relative; margin-top:80px;}
.ecosystem-line-wrap{position:absolute; left:0; right:0; top:44px; height:140px; z-index:0;}
.ecosystem-line-wrap svg{width:100%; height:100%; overflow:visible;}
.ecosystem-line-wrap path{fill:none; stroke:rgba(255,255,255,.14); stroke-width:1.5;}
.ecosystem-line-wrap path.progress{stroke:url(#ecoGrad); stroke-width:2.5;}
.ecosystem-line-wrap .flow-dot{fill:var(--cyan); filter:drop-shadow(0 0 6px var(--cyan));}
@media (prefers-reduced-motion: reduce){ .ecosystem-line-wrap .flow-dot{display:none;} }
.ecosystem-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:36px; position:relative; z-index:1;}
.eco-stage{cursor:default;}
.eco-node{
  width:92px; height:92px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--dark-surface);
  border:1px solid var(--border-dark);
  font-family:var(--font-head); font-weight:700; font-size:15px; color:var(--muted-on-dark);
  margin:0 auto 30px;
  transition:all .35s var(--ease);
  position:relative;
}
.eco-node::after{content:''; position:absolute; inset:-10px; border-radius:50%; border:1px solid transparent; transition:border-color .35s var(--ease);}
.eco-node.accent-blue{box-shadow:inset 0 0 0 1px rgba(36,119,255,.35);}
.eco-node.accent-cyan{box-shadow:inset 0 0 0 1px rgba(53,217,255,.35);}
.eco-node.accent-violet{box-shadow:inset 0 0 0 1px rgba(116,103,255,.35);}
.eco-stage.active .eco-node.accent-blue{background:linear-gradient(140deg,var(--blue),#1558c7); color:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.2), 0 0 44px -6px var(--blue);}
.eco-stage.active .eco-node.accent-cyan{background:linear-gradient(140deg,var(--cyan),#1499b3); color:#07111F; box-shadow:0 0 0 1px rgba(255,255,255,.2), 0 0 44px -6px var(--cyan);}
.eco-stage.active .eco-node.accent-violet{background:linear-gradient(140deg,var(--violet),#4b3fd1); color:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.2), 0 0 44px -6px var(--violet);}
.eco-stage.active .eco-node::after{border-color:rgba(255,255,255,.28);}
.eco-card{
  text-align:center; padding:30px 24px 34px; border-radius:var(--radius-md);
  border:1px solid var(--border-dark); background:rgba(255,255,255,.02);
  transition:border-color .35s var(--ease), background .35s var(--ease), transform .35s var(--ease);
}
.eco-stage.active .eco-card{border-color:rgba(255,255,255,.24); background:rgba(255,255,255,.05); transform:translateY(-5px);}
.eco-card .tag{font-family:var(--font-head); font-size:11px; letter-spacing:.1em; color:var(--cyan); font-weight:700;}
.eco-card .name{font-family:var(--font-head); font-size:23px; font-weight:700; margin-top:9px; color:var(--text-light);}
.eco-card p{font-size:14.5px; line-height:1.6; color:var(--muted-on-dark); margin-top:11px;}

/* ============================================================
   PRODUCT BREAKOUTS (AI / XR / StereoCore)
   ============================================================ */
.showcase{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
.showcase.reverse .copy{order:2;}
.showcase.reverse .visual{order:1;}
.showcase .tag{font-family:var(--font-head); font-size:12px; letter-spacing:.08em; font-weight:700; color:var(--blue);}
.on-dark .showcase .tag{color:var(--cyan);}
.showcase h3{font-size:clamp(26px,3vw,34px); font-weight:700; margin-top:14px;}
.showcase .desc{font-size:15.5px; line-height:1.7; color:var(--muted); margin-top:16px; max-width:460px;}
.on-dark .showcase .desc{color:var(--muted-on-dark);}
.feature-list{margin-top:26px; display:flex; flex-direction:column;}
.feature-list .f{padding:16px 0; border-top:1px solid var(--border-light);}
.on-dark .feature-list .f{border-top-color:var(--border-dark);}
.feature-list .f:last-child{padding-bottom:0;}
.feature-list .fname{font-weight:600; font-size:14.5px;}
.feature-list .fdesc{font-size:14px; line-height:1.6; color:var(--muted); margin-top:4px;}
.on-dark .feature-list .fdesc{color:var(--muted-on-dark);}
.link-more{
  display:inline-flex; align-items:center; gap:6px; margin-top:28px;
  font-size:14px; font-weight:600; border-bottom:1px solid currentColor; padding-bottom:3px;
  transition:gap .2s var(--ease);
}
.link-more:hover{gap:10px;}

/* AI cinematic showcase */
.ai-tabs{display:flex; gap:10px; margin-bottom:22px; flex-wrap:wrap;}
.ai-tab{
  background:rgba(255,255,255,.04); border:1px solid var(--border-dark); color:var(--muted-on-dark);
  font-size:13px; font-weight:600; padding:9px 16px; border-radius:100px; cursor:pointer;
  transition:all .25s var(--ease); font-family:var(--font-body);
}
.ai-tab.active{background:var(--text-light); color:var(--navy-deep); border-color:var(--text-light);}
.ai-visual{position:relative; height:560px; perspective:1600px;}
.ai-visual .stage-glow{position:absolute; inset:-10%; background:radial-gradient(65% 65% at 62% 38%, rgba(36,119,255,.32), transparent 65%); filter:blur(14px);}
.ai-visual .main-shot{
  position:absolute; left:0; top:6%; width:92%;
  border-radius:16px; overflow:hidden;
  box-shadow:0 50px 100px -30px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.1);
  transform:perspective(1600px) rotateY(-3deg) rotateX(1.5deg);
  transition:transform .4s var(--ease);
}
.ai-visual:hover .main-shot{transform:perspective(1600px) rotateY(0deg) rotateX(0deg);}
.ai-visual .main-shot img{width:100%; display:block;}
.ai-visual .mode-highlight{
  position:absolute; border:2px solid var(--cyan); border-radius:8px;
  box-shadow:0 0 0 4px rgba(53,217,255,.16), 0 0 24px rgba(53,217,255,.35);
  opacity:0; transition:opacity .3s var(--ease), left .3s var(--ease), top .3s var(--ease);
  pointer-events:none;
}
.ai-visual .mode-highlight.show{opacity:1;}
.ai-visual .crop-detail{
  position:absolute; border-radius:12px; overflow:hidden;
  box-shadow:0 30px 60px -22px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.14);
}
.ai-visual .crop-detail img{display:block; max-width:none;}
.ai-visual .crop-1{width:190px; height:140px; right:-4%; top:2%; z-index:3;}
.ai-visual .crop-1 img{width:520px; object-fit:cover; object-position:-1080px -330px;}
.ai-visual .crop-2{width:170px; height:125px; left:-6%; bottom:6%; z-index:3;}
.ai-visual .crop-2 img{width:460px; object-fit:cover; object-position:-50px -80px;}
.ai-annot{
  position:absolute; display:flex; align-items:center; gap:8px; z-index:4;
  background:rgba(11,23,40,.78); border:1px solid rgba(255,255,255,.16); backdrop-filter:blur(8px);
  border-radius:100px; padding:7px 14px 7px 10px;
  font-family:var(--font-head); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-light);
}
.ai-annot .dot{width:6px; height:6px; border-radius:50%; background:var(--cyan);}
.ai-annot.a3{left:30%; bottom:-2%;}
.ai-workflow-photo{position:relative; margin:0; overflow:hidden; border-radius:var(--radius-lg); border:1px solid var(--border-dark); background:var(--dark-surface); box-shadow:0 30px 72px -38px rgba(36,119,255,.72);}
.ai-workflow-photo::after{content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(150deg, rgba(53,217,255,.06), transparent 45%, rgba(116,103,255,.06));}
.ai-workflow-photo img{width:100%; aspect-ratio:16/9; object-fit:cover;}
.ai-workflow-photo figcaption{position:absolute; left:18px; bottom:16px; z-index:1; display:flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid var(--border-dark); border-radius:100px; background:rgba(7,17,31,.8); backdrop-filter:blur(10px); color:var(--text-light); font-size:11.5px; letter-spacing:.025em;}
.ai-workflow-photo figcaption .dot{width:6px; height:6px; flex:0 0 auto; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px rgba(53,217,255,.9);}

/* XR — dark core panel inside light section: one live session, distributed to grouped device clusters */
.xr-core-panel{
  background:radial-gradient(120% 100% at 25% 15%, rgba(36,119,255,.18), transparent 60%),
             linear-gradient(160deg, var(--navy-deep), var(--dark-surface) 70%);
  border-radius:var(--radius-lg);
  padding:26px;
  box-shadow:0 40px 80px -40px rgba(10,20,40,.4);
}
.xr-diagram{position:relative; width:100%; aspect-ratio:720/480;}
.xr-links{position:absolute; inset:0; width:100%; height:100%;}
.xr-line.sync{fill:none; stroke:url(#xrSyncGrad); stroke-width:2.5; opacity:.9; stroke-linecap:round;}
.xr-line.sync.flow{fill:none; stroke:rgba(255,255,255,.95); stroke-width:1.4; stroke-dasharray:3 9; opacity:.9; stroke-linecap:round;}
@media (prefers-reduced-motion: no-preference){
  .xr-line.sync.flow{animation:dashFlow 1.6s linear infinite;}
  .xr-live-dot{animation:pulseGlow 2.2s ease-in-out infinite;}
}
@keyframes dashFlow{to{stroke-dashoffset:-140;}}
@keyframes pulseGlow{
  0%,100%{opacity:1; box-shadow:0 0 6px var(--cyan);}
  50%{opacity:.6; box-shadow:0 0 14px var(--cyan);}
}
.xr-line.remote-line{fill:none; stroke:var(--violet); stroke-width:1.6; stroke-dasharray:5 6; opacity:.8; stroke-linecap:round;}

/* Source panel */
.xr-source{
  position:absolute; left:3.33%; top:31.25%; width:32.78%; height:37.5%;
  background:linear-gradient(160deg, rgba(36,119,255,.16), rgba(255,255,255,.03));
  border:1px solid rgba(53,217,255,.4);
  border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:9px;
  box-shadow:0 0 44px -12px rgba(36,119,255,.4), inset 0 0 0 1px rgba(255,255,255,.04);
  z-index:2;
}
.xr-source-head{display:flex; align-items:center; gap:9px;}
.xr-live-dot{width:9px; height:9px; border-radius:50%; background:var(--cyan); box-shadow:0 0 8px var(--cyan); flex-shrink:0;}
.xr-source-title{font-family:var(--font-head); font-weight:700; font-size:13px; color:var(--text-light); line-height:1.2;}
.xr-source-sub{font-size:10.5px; color:var(--cyan); letter-spacing:.02em; margin-top:2px;}
.xr-source-frame{position:relative; flex:1; border-radius:8px; overflow:hidden; border:1px solid rgba(255,255,255,.12); min-height:0;}
.xr-source-frame img{width:100%; height:100%; object-fit:cover; filter:brightness(.8) saturate(1.15); display:block;}
.xr-pointer-dot{
  position:absolute; left:58%; top:42%; width:10px; height:10px; border-radius:50%;
  background:var(--cyan); box-shadow:0 0 0 4px rgba(53,217,255,.22), 0 0 10px var(--cyan);
  transform:translate(-50%,-50%);
}
.xr-pointer-dot::after{content:''; position:absolute; inset:-7px; border:1px solid rgba(53,217,255,.5); border-radius:50%;}
.xr-source-timeline{height:4px; border-radius:3px; background:rgba(255,255,255,.1); overflow:hidden; flex-shrink:0;}
.xr-timeline-fill{display:block; height:100%; width:62%; background:linear-gradient(90deg,var(--blue),var(--cyan));}

/* Destination groups */
.xr-group{
  position:absolute; left:47.22%; width:49.44%;
  border:1px dashed rgba(255,255,255,.18); border-radius:12px; padding:12px 14px;
  background:rgba(255,255,255,.015);
  display:flex; flex-direction:column; justify-content:center; gap:10px;
  z-index:2;
}
.xr-group-conf{top:8.33%; height:27.08%;}
.xr-group-class{top:40.63%; height:27.08%;}
.xr-group-remote{top:72.92%; height:20.83%; opacity:.85;}
.xr-group-label{font-family:var(--font-head); font-size:11.5px; letter-spacing:.05em; color:var(--muted-on-dark); font-weight:600;}
.xr-group-nodes{display:flex; gap:8px; flex-wrap:wrap;}
.xr-node{
  width:36px; height:27px; border-radius:6px; flex-shrink:0;
  background:linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.02));
  border:1px solid rgba(53,217,255,.45);
  position:relative;
}
.xr-node::before{content:''; position:absolute; left:5px; right:5px; top:6px; height:2px; background:rgba(255,255,255,.4); border-radius:1px;}
.xr-node::after{content:''; position:absolute; left:5px; bottom:5px; width:5px; height:5px; border-radius:50%; background:var(--cyan);}
.xr-node.remote{border-color:rgba(116,103,255,.5);}
.xr-node.remote::after{background:var(--violet);}

.xr-legend{display:flex; gap:22px; margin-top:18px; padding:0 4px; font-size:12px; color:var(--muted-on-dark); flex-wrap:wrap;}
.xr-legend-item{display:flex; align-items:center; gap:8px;}
.xr-swatch{width:18px; height:2px; display:inline-block; border-radius:2px;}
.xr-swatch.sync{background:linear-gradient(90deg,var(--blue),var(--cyan));}
.xr-swatch.remote{background:repeating-linear-gradient(90deg, var(--violet) 0 5px, transparent 5px 9px);}

.xr-caption{margin-top:18px; font-size:13.5px; line-height:1.6; color:var(--muted-on-dark); max-width:480px;}
.xr-photo{position:relative; margin:0; overflow:hidden; border-radius:var(--radius-lg); border:1px solid var(--border-dark); background:var(--dark-surface); box-shadow:0 28px 70px -36px rgba(36,119,255,.65);}
.xr-photo::after{content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(145deg, rgba(53,217,255,.09), transparent 42%, rgba(116,103,255,.08));}
.xr-photo img{width:100%; aspect-ratio:16/9; object-fit:cover;}
.xr-photo figcaption{position:absolute; left:18px; bottom:16px; z-index:1; display:flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid var(--border-dark); border-radius:100px; background:rgba(7,17,31,.76); backdrop-filter:blur(10px); color:var(--text-light); font-size:11.5px; letter-spacing:.035em;}
.xr-photo figcaption .dot{width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px rgba(53,217,255,.9);}

@media (max-width:700px){
  .xr-diagram{position:static; aspect-ratio:auto; display:flex; flex-direction:column; gap:12px;}
  .xr-links{display:none;}
  .xr-source, .xr-group{position:static; width:100%; height:auto;}
  .xr-source-frame{min-height:120px;}
}

/* StereoCore mega visual */
.core-mega-visual{position:relative; border-radius:var(--radius-lg); overflow:hidden; height:520px; border:1px solid var(--border-dark);}
.core-mega-visual > img{width:100%; height:100%; object-fit:cover; display:block;}
.core-mega-visual::after{
  content:''; position:absolute; inset:0; mix-blend-mode:overlay; opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.9) 1px, transparent 1.4px);
  background-size:16px 16px;
}
.core-mega-visual .core-inset{
  position:absolute; right:5%; bottom:6%; width:34%; border-radius:12px; overflow:hidden;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.14); z-index:2;
}
.core-mega-visual .core-inset img{width:100%; display:block;}
.core-mega-visual .tech-tag{
  position:absolute; left:20px; bottom:20px; z-index:2;
  font-family:'IBM Plex Sans',monospace; font-size:11px; letter-spacing:.04em;
  background:rgba(7,17,31,.75); color:var(--muted-on-dark);
  padding:6px 12px; border-radius:5px; border:1px solid var(--border-dark);
}
.core-model-visual{position:relative; margin:0; overflow:hidden; border-radius:var(--radius-lg); border:1px solid var(--border-dark); background:var(--dark-surface); box-shadow:0 30px 72px -38px rgba(116,103,255,.62);}
.core-model-visual::after{content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(145deg, rgba(53,217,255,.05), transparent 48%, rgba(116,103,255,.08));}
.core-model-visual img{width:100%; aspect-ratio:16/9; object-fit:cover;}
.core-model-visual figcaption{position:absolute; left:18px; bottom:16px; z-index:1; display:flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid var(--border-dark); border-radius:100px; background:rgba(7,17,31,.82); backdrop-filter:blur(10px); color:var(--text-light); font-size:11.5px; letter-spacing:.025em;}
.core-model-visual figcaption .dot{width:6px; height:6px; flex:0 0 auto; border-radius:50%; background:var(--violet); box-shadow:0 0 12px rgba(116,103,255,.9);}
.core-flow{margin-top:24px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-family:var(--font-head); font-size:12px; letter-spacing:.03em; color:var(--muted-on-dark);}
.core-flow .step{padding:8px 14px; border:1px solid var(--border-dark); border-radius:100px;}
.core-flow .arrow{color:var(--cyan);}

/* ============================================================
   APPLICATIONS — unified cinematic treatment
   ============================================================ */
.app-panel{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding:56px 0; border-top:1px solid var(--border-light);}
.app-panel:first-of-type{border-top:none; padding-top:0;}
.app-panel.reverse .copy{order:2;}
.app-panel.reverse .visual{order:1;}
.app-panel .n{font-family:var(--font-head); font-size:13px; color:var(--blue); font-weight:700;}
.app-panel h3{font-size:clamp(23px,2.6vw,28px); font-weight:700; margin-top:10px;}
.app-panel p{font-size:15px; line-height:1.7; color:var(--muted); margin-top:14px; max-width:440px;}
.app-panel .visual{border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:16/11; border:1px solid var(--border-light); position:relative;}
.app-panel .visual img{width:100%; height:100%; object-fit:cover; filter:grayscale(25%) contrast(1.08) saturate(1.08) brightness(.96);}
.app-panel .visual::after{content:''; position:absolute; inset:0; background:linear-gradient(155deg, rgba(7,17,31,.32), rgba(36,119,255,.08) 60%, transparent 90%);}

/* ============================================================
   ABOUT
   ============================================================ */
.about-grid{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:96px; align-items:start;}
.about-heading .section-title{max-width:560px;}
.about-copy>p{font-size:17px; line-height:1.75; color:var(--muted-on-dark); max-width:650px;}
.about-copy>p+p{margin-top:18px;}
.about-values{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:48px; padding-top:30px; border-top:1px solid var(--border-dark);}
.about-values span{display:block; font-family:var(--font-head); font-size:11px; color:var(--cyan); letter-spacing:.08em; margin-bottom:12px;}
.about-values strong{display:block; font-family:var(--font-head); font-size:16px;}
.about-values p{font-size:13.5px; line-height:1.6; color:var(--muted-on-dark); margin-top:8px;}

@media (max-width:900px){
  .about-grid{grid-template-columns:1fr; gap:42px;}
}
@media (max-width:560px){
  .about-values{grid-template-columns:1fr; gap:26px;}
}

/* ============================================================
   FINAL CTA — full dark cinematic close
   ============================================================ */
.final-cta{position:relative; overflow:hidden; text-align:center; padding:140px 0 100px;}
.final-cta::before{
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, rgba(53,217,255,.4), rgba(116,103,255,.4), transparent);
}
.final-cta .bg-visual{position:absolute; inset:0; z-index:0;}
.final-cta .bg-visual .wash{
  position:absolute; inset:0;
  background:radial-gradient(60% 55% at 50% 25%, rgba(116,103,255,.24), transparent 62%),
             radial-gradient(55% 55% at 82% 85%, rgba(53,217,255,.16), transparent 60%);
}
.final-cta .content{position:relative; z-index:1;}
.final-cta h2{font-size:clamp(32px,4.4vw,50px); font-weight:800; max-width:700px; margin:0 auto; line-height:1.2; color:var(--text-light);}
.final-cta p.sub{font-size:17px; color:var(--muted-on-dark); margin-top:20px;}
.final-cta .cta-actions{display:flex; align-items:center; justify-content:center; gap:22px; margin-top:40px; flex-wrap:wrap;}
.final-cta .email-secondary{
  font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--muted-on-dark);
  border-bottom:1px solid var(--border-dark); padding-bottom:4px;
}
.final-cta .email-secondary:hover{color:var(--text-light);}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--navy-deep); padding:0 0 28px;}
.footer-links{
  display:flex; flex-wrap:wrap; gap:28px; padding:36px 0 24px;
  border-bottom:1px solid var(--border-dark);
  font-size:13.5px; color:var(--muted-on-dark);
}
.footer-links a:hover{color:var(--text-light);}
.footer-row{display:flex; justify-content:space-between; align-items:center; padding-top:22px; font-size:12.5px; color:var(--muted-on-dark); flex-wrap:wrap; gap:10px;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .hero-grid{grid-template-columns:1fr; gap:56px;}
  .hero-visual-lg{height:520px;}
  .hero-stage-lg{inset:0;}
  .transform-stage{grid-template-columns:1fr 1fr; gap:16px;}
  .tf-enhanced.transform-scroller{height:auto;}
  .tf-enhanced .transform-sticky{position:static; height:auto;}
  .tf-enhanced .transform-stage{display:grid; grid-template-columns:1fr 1fr; height:auto; position:static;}
  .tf-enhanced .tf-layer{position:relative; inset:auto; opacity:1; transform:none;}
  .tf-enhanced .tf-layer img{height:auto; aspect-ratio:4/3;}
  .tf-enhanced .tf-label{position:static; background:none; border:none; padding:16px 2px 0; backdrop-filter:none;}
  .tf-enhanced .tf-label .tf-name, .tf-enhanced .tf-label .tf-n{color:var(--ink);}
  .tf-enhanced .tf-label .tf-desc{color:var(--muted);}
  .tf-enhanced .transform-ticks{display:none;}
  .ecosystem-grid{grid-template-columns:1fr; gap:24px;}
  .ecosystem-line-wrap{display:none;}
  .app-panel{grid-template-columns:1fr; gap:28px;}
  .app-panel.reverse .copy{order:1;}
  .app-panel.reverse .visual{order:2;}
}
@media (max-width:900px){
  :root{--gutter:24px;}
  .section{padding:76px 0;}
  .products-hero{padding-top:140px;}
  .products-bg-image{background-position:calc(50% + 150px) -40px;}
  .products-ecosystem-intro{margin-top:72px; padding-top:36px;}
  .nav-mid{display:none;}
  .nav-toggle{display:flex;}
  .showcase{grid-template-columns:1fr; gap:36px;}
  .showcase.reverse .copy{order:1;}
  .showcase.reverse .visual{order:2;}
  .ai-visual{height:380px;}
  .ai-visual .crop-1, .ai-visual .crop-2{display:none;}
  .xr-core-panel{padding:18px;}
  .core-mega-visual{height:340px;}
  .hero-float-left{display:none;}
}
@media (max-width:560px){
  .hero{padding:120px 0 0;}
  .hero-visual-lg{height:380px;}
  .transform-stage{grid-template-columns:1fr;}
  .hero-copy .cta-row .btn{width:100%;}
  .final-cta{padding:96px 0 72px;}
}

/* ============================================================
   SUB-PAGE INTRO (services.html, request-a-quote.html)
   ============================================================ */
.subhero{position:relative; overflow:hidden; background:var(--navy-deep); color:var(--text-light); padding:150px 0 80px;}
.subhero .bg-grid{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(75% 65% at 30% 20%, black, transparent 75%);
}
.subhero .glow{position:absolute; width:420px; height:420px; border-radius:50%; filter:blur(70px); right:-8%; top:-10%; background:radial-gradient(circle, rgba(116,103,255,.32), transparent 70%); z-index:0;}
.subhero .wrap{position:relative; z-index:1;}
.subhero h1{font-size:clamp(32px,4.4vw,50px); font-weight:800; line-height:1.12; letter-spacing:-.015em; max-width:760px; margin-top:18px;}
.subhero .lede{font-size:16.5px; line-height:1.7; color:var(--muted-on-dark); max-width:620px; margin-top:20px;}
.subhero .cta-row{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
.subhero .btn-ghost{border-color:var(--border-dark); color:var(--text-light);}
.subhero .btn-ghost:hover{border-color:var(--text-light);}

/* ============================================================
   SERVICE SECTIONS — editorial, alternating
   ============================================================ */
.service-block{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; padding:96px 0; border-top:1px solid var(--border-dark);}
.service-block:first-of-type{border-top:none;}
.service-block.reverse .copy{order:2;}
.service-block.reverse .visual{order:1;}
.service-block .n{font-family:var(--font-head); font-size:12.5px; color:var(--blue); font-weight:700; letter-spacing:.06em;}
.service-block h2{font-size:clamp(24px,2.8vw,32px); font-weight:700; margin-top:12px; line-height:1.2;}
.service-block .desc{font-size:15.5px; line-height:1.7; color:var(--muted-on-dark); margin-top:16px; max-width:480px;}
.service-block .potential{margin-top:26px; display:grid; grid-template-columns:1fr 1fr; gap:28px;}
.service-block .potential h4{font-family:var(--font-head); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted-on-dark); font-weight:700; margin-bottom:10px;}
.service-block .potential ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px;}
.service-block .potential li{font-size:13.5px; line-height:1.5; color:var(--text-light); padding-left:16px; position:relative;}
.service-block .potential li::before{content:''; position:absolute; left:0; top:7px; width:5px; height:5px; border-radius:50%; background:var(--cyan);}
.service-block .note{margin-top:18px; font-size:12.5px; line-height:1.6; color:var(--muted-on-dark); font-style:italic;}
.service-visual{border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3; border:1px solid var(--border-light); position:relative;}
.service-visual img{width:100%; height:100%; object-fit:cover; filter:grayscale(25%) contrast(1.08) saturate(1.08) brightness(.96);}
.service-visual::after{content:''; position:absolute; inset:0; background:linear-gradient(155deg, rgba(7,17,31,.32), rgba(36,119,255,.08) 60%, transparent 90%);}
.service-visual.dark{background:linear-gradient(160deg, var(--navy-deep), var(--dark-surface) 70%); border:1px solid var(--border-dark);}
.service-visual.dark::after{display:none;}

/* Service 4 — abstract device grid (no stock photography) */
.rental-grid{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:28px;}
.rental-tiles{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; width:100%;}
.rental-tile{
  aspect-ratio:4/3; border-radius:10px;
  background:linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.02));
  border:1px solid rgba(53,217,255,.4); position:relative;
}
.rental-tile::before{content:''; position:absolute; left:6px; right:6px; top:8px; height:2px; background:rgba(255,255,255,.35); border-radius:1px;}
.rental-tile::after{content:''; position:absolute; left:6px; bottom:6px; width:6px; height:6px; border-radius:50%; background:var(--cyan);}
.rental-tile.v2::after{background:var(--violet);}
.rental-tile.v2{border-color:rgba(116,103,255,.45);}
.rental-label{
  position:absolute; left:20px; bottom:20px; z-index:2;
  font-family:var(--font-head); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted-on-dark);
  background:rgba(7,17,31,.7); border:1px solid var(--border-dark); padding:6px 12px; border-radius:100px;
}

/* ============================================================
   FULL-SERVICE PACKAGE CALLOUT
   ============================================================ */
.package-callout{
  position:relative; overflow:hidden; text-align:center;
  background:var(--navy-deep); color:var(--text-light);
  border-radius:var(--radius-lg); padding:88px 48px; margin:0 auto;
}
.package-callout::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(55% 60% at 30% 20%, rgba(36,119,255,.22), transparent 60%), radial-gradient(50% 50% at 80% 85%, rgba(116,103,255,.2), transparent 60%);
}
.package-callout .content{position:relative; z-index:1;}
.package-callout h2{font-size:clamp(26px,3.4vw,38px); font-weight:700; max-width:680px; margin:0 auto; line-height:1.25;}
.package-callout p{font-size:16px; line-height:1.7; color:var(--muted-on-dark); max-width:560px; margin:18px auto 0;}
.package-callout .btn{margin-top:32px;}

/* ============================================================
   HOW IT WORKS — connected 4-step process
   ============================================================ */
.process-track{position:relative; margin-top:72px;}
.process-line-wrap{position:absolute; left:0; right:0; top:34px; height:100px; z-index:0;}
.process-line-wrap svg{width:100%; height:100%; overflow:visible;}
.process-line-wrap path{fill:none; stroke:url(#processGrad); stroke-width:2; opacity:.55;}
.process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:28px; position:relative; z-index:1;}
.process-step .num{
  width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--white); border:1px solid var(--border-light); box-shadow:0 16px 32px -16px rgba(10,20,40,.25);
  font-family:var(--font-head); font-weight:700; font-size:14px; color:var(--blue); margin-bottom:22px;
}
.process-step h4{font-family:var(--font-head); font-size:17px; font-weight:700; margin-bottom:8px;}
.process-step p{font-size:14px; line-height:1.6; color:var(--muted-on-dark);}

/* ============================================================
   REQUEST A QUOTE — form system
   ============================================================ */
.quote-layout{display:grid; grid-template-columns:1fr; gap:0; max-width:840px; margin:0 auto;}
.form-section{padding:44px 0; border-top:1px solid var(--border-dark);}
.form-section:first-child{border-top:none; padding-top:0;}
.form-section h3{font-size:19px; font-weight:700;}
.form-section .form-section-sub{font-size:13.5px; color:var(--muted-on-dark); margin-top:6px;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:24px;}
.field{display:flex; flex-direction:column; gap:7px;}
.field.full{grid-column:1 / -1;}
.field label{font-size:13.5px; font-weight:600; color:var(--text-light);}
.field .optional{font-weight:400; color:var(--muted-on-dark); font-size:12px;}
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field input[type="date"],
.field input[type="number"],
.field select,
.field textarea{
  font-family:var(--font-body); font-size:14.5px; color:var(--ink);
  padding:12px 14px; border-radius:var(--radius-sm); border:1px solid #cbd3dd; background:var(--white);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.field textarea{resize:vertical; min-height:110px; font-family:inherit;}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(36,119,255,.15);
}
.field input[aria-invalid="true"], .field select[aria-invalid="true"], .field textarea[aria-invalid="true"]{
  border-color:#e0455a; box-shadow:0 0 0 3px rgba(224,69,90,.12);
}
.field-error{font-size:12.5px; color:#c8283f; display:none;}
.field-error.show{display:block;}

.check-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:22px;}
.check-item{
  display:flex; align-items:flex-start; gap:10px; padding:14px 16px; border:1px solid var(--border-dark);
  border-radius:var(--radius-sm); cursor:pointer; transition:border-color .2s var(--ease), background .2s var(--ease);
}
.check-item:has(input:checked){border-color:var(--blue); background:rgba(36,119,255,.05);}
.check-item input{margin-top:2px; accent-color:var(--blue); width:16px; height:16px; flex-shrink:0;}
.check-item span{font-size:14px; line-height:1.4;}

.conditional-fields{
  margin-top:8px; padding:26px 24px; border-radius:var(--radius-md); background:var(--dark-surface);
  border:1px dashed var(--border-dark);
}
.conditional-fields[hidden]{display:none;}
.conditional-fields .cf-title{font-family:var(--font-head); font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--blue); font-weight:700; margin-bottom:16px;}
.conditional-fields + .conditional-fields{margin-top:16px;}

.consent-block{display:flex; flex-direction:column; gap:16px; margin-top:8px;}
.consent-item{display:flex; align-items:flex-start; gap:10px;}
.consent-item input{margin-top:3px; accent-color:var(--blue); width:16px; height:16px; flex-shrink:0;}
.consent-item label{font-size:13.5px; line-height:1.55; color:var(--text-light);}

.hp-field{position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden;}

.form-status{margin-top:18px; font-size:13.5px; padding:12px 16px; border-radius:var(--radius-sm); display:none;}
.form-status.show{display:block;}
.form-status.error{background:rgba(224,69,90,.08); color:#c8283f; border:1px solid rgba(224,69,90,.25);}
.form-status.info{background:rgba(36,119,255,.08); color:var(--blue); border:1px solid rgba(36,119,255,.2);}

.submit-row{display:flex; align-items:center; gap:16px; margin-top:34px; flex-wrap:wrap;}
.submit-row .btn[disabled]{opacity:.6; cursor:not-allowed;}
.submit-note{font-size:12px; color:var(--muted-on-dark);}

.quote-confirmation{text-align:center; padding:70px 24px; max-width:560px; margin:0 auto;}
.quote-confirmation[hidden]{display:none;}
.quote-confirmation .icon{
  width:56px; height:56px; border-radius:50%; margin:0 auto 24px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(140deg, var(--blue), var(--cyan)); color:#fff; font-size:24px;
}
.quote-confirmation h2{font-size:26px; font-weight:700;}
.quote-confirmation p{font-size:15px; line-height:1.7; color:var(--muted-on-dark); margin-top:14px;}
.quote-confirmation .actions{display:flex; gap:14px; justify-content:center; margin-top:30px; flex-wrap:wrap;}

.privacy-note{font-size:12.5px; line-height:1.7; color:var(--muted); max-width:640px; margin:0 auto; text-align:center; padding:32px 24px 0;}

@media (max-width:900px){
  .service-block{grid-template-columns:1fr; gap:32px; padding:64px 0;}
  .service-block.reverse .copy{order:1;}
  .service-block.reverse .visual{order:2;}
  .service-block .potential{grid-template-columns:1fr;}
  .process-grid{grid-template-columns:1fr 1fr; gap:24px;}
  .process-line-wrap{display:none;}
  .form-grid{grid-template-columns:1fr;}
  .check-grid{grid-template-columns:1fr;}
  .package-callout{padding:56px 24px; border-radius:var(--radius-md);}
}
@media (max-width:560px){
  .process-grid{grid-template-columns:1fr;}
  .quote-confirmation .actions .btn{width:100%;}
}

/* ============================================================
   PRINT / PDF export — force everything visible
   ============================================================ */
@media print{
  *{animation:none !important; transition:none !important;}
  header{position:static !important;}
  [data-reveal]{opacity:1 !important; transform:none !important;}
  .tf-layer{position:static !important; opacity:1 !important; transform:none !important; height:auto !important; margin-bottom:16px;}
  .transform-stage{display:block !important;}
  .tf-enhanced.transform-scroller{height:auto !important;}
  .tf-enhanced .transform-sticky{position:static !important; height:auto !important;}
  .eco-node, .eco-card, .hero-float, .hero-chip, .ai-visual .main-shot{opacity:1 !important; transform:none !important;}
  .section.on-dark, .hero, .final-cta, footer{
    background:var(--navy-deep) !important;
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
  .xr-core-panel, .core-mega-visual{-webkit-print-color-adjust:exact; print-color-adjust:exact;}
}