/* ============================================================
   AQUANAUT H₂O EXPLORER — MASTER STYLESHEET v2
   Edit ONLY this file to update colors, fonts, brightness
   across the entire site.
   ============================================================ */

@font-face {
  font-family: 'D3Euronism';
  src: url('D3Euronism.ttf') format('truetype');
  font-display: swap;
}

/* ── DESIGN TOKENS ──────────────────────────────────────────── */
:root {
  /* Brand colors */
  --g:   #38ee6b;
  --gd:  rgba(56,238,107,.6);
  --gf:  rgba(56,238,107,.07);
  --gb:  rgba(56,238,107,.22);

  /* Neutral palette */
  --w:   #fff;
  --w8:  rgba(255,255,255,.84);
  --w6:  rgba(255,255,255,.65);
  --w3:  rgba(255,255,255,.38);
  --navy:#010d18;

  /* Image brightness — change here, applies everywhere */
  --bri-hero:  .70;
  --bri-par:   .70;
  --bri-quote: .65;
  --bri-band:  .70;
  --bri-cta:   .65;
  --bri-photo: .88;   /* inline photos (prototype shots etc.) */
}

/* ── RESET ───────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; overflow-x:hidden; }
body { background:var(--navy); color:var(--w);
       font-family:'Barlow',sans-serif; font-weight:300; overflow-x:hidden; }

/* ── SPHERE (fixed, bottom-left) ────────────────────────────── */
#sphere {
  position:fixed; left:3vw;
  bottom:calc(env(safe-area-inset-bottom,0px) + 80px);
  z-index:3; pointer-events:none;
  width:160px; height:160px;
  transform:translateZ(0); will-change:transform;
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
}

/* ── SPLASH ──────────────────────────────────────────────────── */
#splash {
  position:fixed; inset:0; z-index:99998;
  background:#000;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .9s ease;
}
#splash.fade { opacity:0; }
#splash.gone { display:none; }
#splash img  { width:min(500px,30vw); height:auto; }

/* ── HEADER ──────────────────────────────────────────────────── */


/* Logo */


/* ── PARALLAX SECTION (main) ─────────────────────────────────── */
.par-section {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

/* ── HEADER MAIN ─────────────────────────────────────────────── */
.hdr {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  padding: 14px 36px;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(1,13,24,.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(56,238,107,.1);
}

.logo-block {
  display:inline-flex; flex-direction:row;
  align-items:center; gap:8px; text-decoration:none;
}
.logo-img  { display:block; height:36px; width:auto; object-fit:contain; flex-shrink:0; }
.logo-text { display:flex; flex-direction:column; align-items:flex-start; }
.logo-n {
  font-family:'D3Euronism',sans-serif; font-size:10px; letter-spacing:.5em;
  color:var(--g); line-height:1; text-transform:uppercase;
  white-space:nowrap; display:inline-block;
  transform:scaleX(1.75); transform-origin:left center;
}
.logo-s {
  font-family:'Montserrat',sans-serif; font-weight:400; font-size:5px;
  letter-spacing:.05em; text-transform:uppercase; color:var(--gd);
  margin-top:3px; white-space:nowrap; display:inline-block;
  transform-origin:left center;
}

/* Desktop nav */
.nav-desktop { display:flex; align-items:center; gap:4px; }
.nav-desktop a {
  font-family:'Barlow Condensed',sans-serif; font-size:12px;
  font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  color:var(--w6); text-decoration:none;
  padding:7px 14px; border-radius:6px;
  transition:color .2s, background .2s;
}
.nav-desktop a:hover  { color:var(--g); background:rgba(56,238,107,.06); }
.nav-desktop a.active { color:var(--g); }
.nav-cta {
  color:#000!important; background:var(--g)!important;
  border-radius:6px; padding:8px 18px!important; margin-left:8px;
}
.nav-cta:hover { box-shadow:0 0 20px rgba(56,238,107,.4); }

/* Hamburger */

.hamburger span {
  display:block; width:22px; height:2px;
  background:var(--g); border-radius:1px;
  transition:transform .3s, opacity .3s;
}
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile nav */

.nav-mobile.open { display:flex; }
.nav-mobile a {
  font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--w6);
  text-decoration:none; padding:14px 0;
  border-bottom:1px solid rgba(56,238,107,.06); transition:color .2s;
}
.nav-mobile a:hover, .nav-mobile a.active { color:var(--g); }
.nav-mobile a:last-child { border-bottom:none; }

/* Lang switcher */
.lang-sw { display:flex; gap:4px; align-items:center; }
.lang-sw a { font-size:18px; text-decoration:none; opacity:.45; transition:opacity .2s; }
.lang-sw a:hover { opacity:1; }
.lang-sw a.active { opacity:1; filter:drop-shadow(0 0 4px rgba(56,238,107,.6)); }

/* Badge */
.badge {
  font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--g);
  border:1px solid var(--gb); border-radius:100px; padding:7px 18px;
  display:flex; align-items:center; gap:8px;
  background:rgba(56,238,107,.05); backdrop-filter:blur(10px);
}
.bdot { width:6px; height:6px; border-radius:50%; background:var(--g); animation:bdot 2s ease infinite; }
@keyframes bdot { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.3;transform:scale(.6);} }

/* ── LAYOUT ──────────────────────────────────────────────────── */
.wrap   { position:relative; z-index:1; padding-top:65px; }
.inner  { max-width:1000px; margin:0 auto; padding:0 36px; }
.section{ padding:100px 0; }
.sdiv   { width:100%; height:1px;
          background:linear-gradient(to right,transparent,var(--gb),transparent);
          margin:72px 0; }

/* ── TYPOGRAPHY ──────────────────────────────────────────────── */
.eye {
  font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.5em; text-transform:uppercase; color:var(--g); margin-bottom:18px;
}
h1    { font-family:'Bebas Neue',sans-serif; font-size:clamp(56px,9vw,110px);
        line-height:.86; letter-spacing:.02em; color:var(--w); }
h1 em { color:var(--g); font-style:normal; }
h2    { font-family:'Bebas Neue',sans-serif; font-size:clamp(38px,5vw,68px);
        line-height:.88; letter-spacing:.03em; color:var(--w); margin-bottom:22px; }
h2 em { color:var(--g); font-style:normal; }
h3    { font-family:'Bebas Neue',sans-serif; font-size:clamp(26px,3.5vw,44px);
        line-height:.92; letter-spacing:.03em; color:var(--w); margin-bottom:14px; }
h3 em { color:var(--g); font-style:normal; }
p     { font-size:17px; font-weight:300; line-height:1.9; color:var(--w8); margin-bottom:18px; }
p strong { color:var(--w); font-weight:600; }
p em     { color:var(--g); font-style:normal; }
ul,ol { margin:0 0 20px 22px; }
li    { font-size:17px; font-weight:300; line-height:1.85; color:var(--w8); margin-bottom:8px; }
li strong { color:var(--w); font-weight:600; }
.rule { width:48px; height:2px; background:var(--g); margin-bottom:28px; }

/* Product names — D3Euronism green */
.pname {
  font-family:'D3Euronism',sans-serif; color:var(--g);
  font-style:normal; letter-spacing:.06em;
}

/* ── HERO SECTIONS ───────────────────────────────────────────── */
.hero        { position:relative; height:100vh; overflow:hidden; display:flex; align-items:center; }
.page-hero   { position:relative; min-height:72vh; display:flex; align-items:center; overflow:hidden; }
.hero-bg,.page-hero-bg {
  position:absolute; inset:-20%; background-size:cover; background-position:center;
  will-change:transform; filter:brightness(var(--bri-hero)) saturate(1.5);
}
.hero-grad,.page-hero-grad {
  position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(1,13,24,.88) 0%,rgba(1,13,24,.2) 55%,rgba(1,13,24,.65) 100%);
}
.hero-content,.page-hero-content {
  position:relative; z-index:2; max-width:1000px; margin:0 auto; padding:80px 36px;
}
.hero-eye {
  font-family:'Barlow Condensed',sans-serif; font-size:12px; font-weight:700;
  letter-spacing:.5em; text-transform:uppercase; color:var(--g); margin-bottom:32px;
  opacity:0; animation:fUp .8s ease .3s forwards;
}
.hero-rule  { width:54px; height:2px; background:var(--g); margin-bottom:28px;
              opacity:0; animation:fUp .8s ease .7s forwards; }
.hero-tagline { font-size:19px; font-weight:300; color:var(--w8);
                max-width:480px; line-height:1.78;
                opacity:0; animation:fUp .8s ease 1s forwards; }
.hero-tagline strong { color:var(--w); font-weight:600; }
.scroll-hint {
  position:absolute; bottom:40px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-family:'Barlow Condensed',sans-serif; font-size:9px; font-weight:700;
  letter-spacing:.4em; text-transform:uppercase; color:var(--w3);
  animation:fUp .8s ease 1.3s both;
}
.scroll-hint::after {
  content:''; width:1px; height:44px;
  background:linear-gradient(to bottom,var(--w3),transparent);
  animation:sLine 2s ease infinite;
}
@keyframes sLine { 0%,100%{transform:scaleY(1);opacity:.5;} 50%{transform:scaleY(.5);opacity:1;} }
@keyframes fUp   { from{opacity:0;transform:translateY(28px);} to{opacity:1;transform:translateY(0);} }

/* ── PARALLAX SECTIONS ───────────────────────────────────────── */


.par-grad-l { position:absolute; inset:0; background:linear-gradient(to right,rgba(1,13,24,.96) 0%,rgba(1,13,24,.7) 48%,transparent 100%); }
.par-grad-r { position:absolute; inset:0; background:linear-gradient(to left,rgba(1,13,24,.96) 0%,rgba(1,13,24,.7) 48%,transparent 100%); }
.par-content {
  position:relative; z-index:2; max-width:1000px; margin:0 auto;
  padding:100px 36px; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;
}
.par-content.rt .text-side          { grid-column:2; }
.par-content.rt .text-side + *      { grid-column:1; grid-row:1; }

/* ── QUOTE SECTIONS ──────────────────────────────────────────── */
.quote-section { position:relative; overflow:hidden; min-height:55vh;
                 display:flex; align-items:center; justify-content:center; text-align:center; }
.quote-bg      { position:absolute; inset:-20%; background-size:cover; background-position:center 30%;
                 will-change:transform; filter:brightness(var(--bri-quote)) saturate(1.6); }
.quote-grad    { position:absolute; inset:0;
                 background:linear-gradient(to bottom,var(--navy) 0%,rgba(1,13,24,.2) 40%,rgba(1,13,24,.2) 60%,var(--navy) 100%); }
.quote-inner   { position:relative; z-index:2; padding:80px 36px; max-width:860px; }
.quote-text    { font-family:'Bebas Neue',sans-serif; font-size:clamp(40px,7vw,90px);
                 line-height:.9; letter-spacing:.04em; color:var(--w); }
.quote-text em { color:var(--g); font-style:normal; }

/* ── PHOTO BANDS ─────────────────────────────────────────────── */
.photo-band { position:relative; height:340px; overflow:hidden; }

.photo-band-grad {
  position:absolute; inset:0;
  background:linear-gradient(to right,rgba(1,13,24,.78) 0%,rgba(1,13,24,.18) 50%,rgba(1,13,24,.78) 100%);
}
.photo-band-content {
  position:relative; z-index:2; height:100%;
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:0 36px;
}
.photo-band-quote { font-family:'Bebas Neue',sans-serif; font-size:clamp(32px,5vw,72px);
                    line-height:.88; letter-spacing:.03em; color:var(--w); }
.photo-band-quote em { color:var(--g); font-style:normal; }

/* ── CTA SECTION ─────────────────────────────────────────────── */
.cta-wrap { position:relative; overflow:hidden; min-height:80vh;
            display:flex; align-items:center; justify-content:center; text-align:center; }
.cta-bg   { position:absolute; inset:-20%; background-size:cover; background-position:center;
            will-change:transform; filter:brightness(var(--bri-cta)) saturate(1.5); }
.cta-grad { position:absolute; inset:0;
            background:radial-gradient(ellipse at 50% 50%,rgba(56,238,107,.07) 0%,rgba(1,13,24,.82) 65%); }
.cta-inner { position:relative; z-index:2; padding:80px 36px; max-width:720px; }
.cta-inner h2 { font-size:clamp(50px,8vw,96px); margin-bottom:28px; }
.cta-inner p  { font-size:19px; max-width:480px; margin:0 auto 52px; }

/* ── CARDS ───────────────────────────────────────────────────── */
.card-grid   { display:grid; grid-template-columns:repeat(2,1fr); gap:2px; }
.card-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.card { background:rgba(2,16,30,.82); border:1px solid rgba(56,238,107,.1);
        padding:44px 36px; border-radius:4px; transition:border-color .35s,background .35s; }
.card:hover { border-color:var(--gb); background:rgba(56,238,107,.04); }
.card-n { font-family:'Bebas Neue',sans-serif; font-size:52px; line-height:1;
          color:rgba(56,238,107,.1); margin-bottom:12px; }
.card-t { font-family:'Barlow Condensed',sans-serif; font-size:15px; font-weight:700;
          letter-spacing:.12em; text-transform:uppercase; color:var(--w); margin-bottom:12px; }
.card-d { font-size:15px; font-weight:300; line-height:1.8; color:var(--w6); }

/* ── STATS ───────────────────────────────────────────────────── */
.stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
              background:var(--gb); border:1px solid var(--gb);
              border-radius:10px; overflow:hidden; margin:60px 0; }
.stat   { background:rgba(1,13,24,.92); padding:44px 28px; }
.stat-n { font-family:'Bebas Neue',sans-serif; font-size:72px; line-height:1; color:var(--g); }
.stat-l { font-family:'Barlow Condensed',sans-serif; font-size:13px; font-weight:600;
          letter-spacing:.18em; text-transform:uppercase; color:var(--w6);
          margin-top:8px; line-height:1.4; }

/* ── PROCESS STEPS ───────────────────────────────────────────── */
.process { display:flex; flex-direction:column; margin-top:80px; }
.step    { display:grid; grid-template-columns:72px 1fr; gap:36px;
           align-items:start; padding-bottom:72px; position:relative; }
.step:not(:last-child)::before {
  content:''; position:absolute; left:35px; top:52px; bottom:0;
  width:1px; background:linear-gradient(to bottom,var(--gb),transparent);
}
.step-num { font-family:'Bebas Neue',sans-serif; font-size:64px; line-height:1;
            color:rgba(56,238,107,.1); text-align:center; padding-top:4px; position:relative; }
.step-num::after {
  content:''; position:absolute; top:10px; left:50%; transform:translateX(-50%);
  width:11px; height:11px; border-radius:50%;
  border:2px solid var(--g); background:var(--g); box-shadow:0 0 12px var(--g);
}
.step-tag   { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
              letter-spacing:.42em; text-transform:uppercase; color:var(--g); margin-bottom:10px; }
.step-title { font-family:'Bebas Neue',sans-serif; font-size:34px; line-height:1;
              letter-spacing:.04em; color:var(--w); margin-bottom:14px; }
.step-title em { color:var(--g); font-style:normal; }
.step-desc  { font-size:16px; font-weight:300; line-height:1.85; color:var(--w8); max-width:560px; margin-bottom:24px; }

/* Photo slots */
.photo-row      { display:grid; gap:12px; margin-top:4px; }
.photo-row.c2   { grid-template-columns:1fr 1fr; }
.photo-row.c3   { grid-template-columns:1fr 1fr 1fr; }
.photo-slot     { position:relative; border-radius:8px; overflow:hidden;
                  background:rgba(3,18,34,.9); border:1px solid rgba(56,238,107,.12);
                  aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; }
.photo-slot.tall{ aspect-ratio:4/5; }
.photo-slot img { position:absolute; inset:0; width:100%; height:100%;
                  object-fit:cover; filter:brightness(var(--bri-photo)) saturate(1.15); }
.ph-label { position:absolute; bottom:14px; left:14px;
            font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
            letter-spacing:.28em; text-transform:uppercase; color:var(--g);
            background:rgba(1,13,24,.78); backdrop-filter:blur(6px);
            padding:5px 12px; border-radius:3px; border:1px solid var(--gb); z-index:2; }
.ph-placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center;
                  gap:10px; font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:600;
                  letter-spacing:.25em; text-transform:uppercase; color:rgba(56,238,107,.25);
                  text-align:center; padding:20px; width:100%; height:100%; }

/* ── DIR SECTION ─────────────────────────────────────────────── */
.dir-section { position:relative; overflow:hidden; padding:130px 0; }
.dir-bg      { position:absolute; inset:-20%; background-size:cover; background-position:center;
               will-change:transform; filter:brightness(var(--bri-cta)) saturate(1.5); }
.dir-grad    { position:absolute; inset:0;
               background:linear-gradient(to bottom,var(--navy) 0%,rgba(1,13,24,.35) 30%,rgba(1,13,24,.35) 70%,var(--navy) 100%); }
.dir-inner   { position:relative; z-index:2; max-width:1000px; margin:0 auto; padding:0 36px; }
.dir-grid    { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; margin-top:60px; }
.dir-principles { display:flex; flex-direction:column; gap:2px; margin-top:40px; }
.dir-p      { padding:20px 22px; border:1px solid rgba(56,238,107,.1); border-radius:4px;
              background:rgba(1,13,24,.65); backdrop-filter:blur(10px); transition:border-color .3s; }
.dir-p:hover{ border-color:var(--gb); }
.dp-label   { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
              letter-spacing:.35em; text-transform:uppercase; color:var(--g); margin-bottom:7px; }
.dp-text    { font-size:15px; font-weight:300; line-height:1.75; color:var(--w6); }
.dir-quote  { font-family:'Bebas Neue',sans-serif; font-size:clamp(30px,4vw,54px);
              line-height:.9; letter-spacing:.03em; color:var(--w);
              border-left:3px solid var(--g); padding-left:22px; margin-top:40px; }
.dir-quote em { color:var(--g); font-style:normal; }

/* ── ROADMAP ─────────────────────────────────────────────────── */
.roadmap  { margin-top:64px; }
.rm-item  { display:flex; align-items:stretch; }
.rm-track { display:flex; flex-direction:column; align-items:center;
            width:32px; flex-shrink:0; padding-top:5px; }
.rm-dot   { width:12px; height:12px; border-radius:50%; border:2px solid var(--g);
            background:var(--g); flex-shrink:0; box-shadow:0 0 14px var(--g); }
.rm-dot.f { background:transparent; border-color:rgba(56,238,107,.22); box-shadow:none; }
.rm-ln    { width:1px; flex:1; background:linear-gradient(to bottom,var(--gb),transparent); margin:6px 0; }
.rm-c     { padding:0 0 60px 28px; flex:1; }
.rm-ph    { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
            letter-spacing:.38em; text-transform:uppercase; color:var(--gd); margin-bottom:8px; }
.rm-ti    { font-family:'Bebas Neue',sans-serif; font-size:36px; line-height:1;
            letter-spacing:.04em; color:var(--w); margin-bottom:10px; }
.rm-ti em { color:var(--g); font-style:normal; }
.rm-de    { font-size:16px; font-weight:300; line-height:1.8; color:var(--w6); max-width:540px; margin-bottom:14px; }
.rm-b     { display:inline-block; font-family:'Barlow Condensed',sans-serif; font-size:10px;
            font-weight:700; letter-spacing:.25em; text-transform:uppercase; border-radius:4px; padding:5px 14px; }
.rm-b.live{ background:rgba(56,238,107,.1); color:var(--g); border:1px solid var(--gb); }
.rm-b.soon{ background:transparent; color:var(--w3); border:1px solid rgba(255,255,255,.1); }

/* ── PHI GRID ────────────────────────────────────────────────── */
.phi-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px; margin-top:60px; }
.phi-item { background:rgba(2,16,30,.82); backdrop-filter:blur(12px);
            border:1px solid rgba(56,238,107,.1); padding:44px 34px;
            border-radius:4px; transition:border-color .35s,background .35s; }
.phi-item:hover { border-color:var(--gb); background:rgba(56,238,107,.04); }
.phi-n { font-family:'Bebas Neue',sans-serif; font-size:54px; line-height:1;
         color:rgba(56,238,107,.1); margin-bottom:14px; }
.phi-t { font-family:'Barlow Condensed',sans-serif; font-size:16px; font-weight:700;
         letter-spacing:.12em; text-transform:uppercase; color:var(--w); margin-bottom:12px; }
.phi-d { font-size:15px; font-weight:300; line-height:1.8; color:var(--w6); }

/* ── CHAPTER HEADER ──────────────────────────────────────────── */
.chapter-hdr    { padding:130px 0 60px; text-align:center; }
.chapter-kicker { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700;
                  letter-spacing:.55em; text-transform:uppercase; color:var(--g); margin-bottom:20px; }
.chapter-title  { font-family:'D3Euronism',sans-serif; font-size:clamp(32px,7vw,80px);
                  line-height:.9; letter-spacing:.25em; color:var(--w); text-transform:uppercase; }
.chapter-title em { color:var(--g); font-style:normal; }
.chapter-sub    { font-family:'Barlow Condensed',sans-serif; font-size:19px; font-weight:300;
                  letter-spacing:.12em; text-transform:uppercase; color:var(--w6);
                  margin-top:24px; max-width:580px; margin-left:auto; margin-right:auto; line-height:1.55; }

/* ── 3D VIEWER ───────────────────────────────────────────────── */
.viewer-section   { padding:80px 0 100px; }
.viewer-label-row { text-align:center; margin-bottom:48px; }
.viewer-box       { position:relative; width:100%; height:520px; border-radius:12px;
                    overflow:hidden; background:rgba(2,14,26,.9); border:1px solid var(--gb);
                    cursor:grab; user-select:none; }
.viewer-box:active{ cursor:grabbing; }
.viewer-box canvas{ display:block; width:100%; height:100%; }
.viewer-badge     { position:absolute; top:18px; left:20px;
                    font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
                    letter-spacing:.32em; text-transform:uppercase; color:var(--g);
                    background:rgba(1,13,24,.75); backdrop-filter:blur(6px);
                    padding:5px 12px; border-radius:3px; border:1px solid var(--gb);
                    pointer-events:none; z-index:2; }
.viewer-hint      { position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
                    font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:400;
                    letter-spacing:.22em; text-transform:uppercase; color:var(--w3);
                    pointer-events:none; z-index:2; transition:opacity 1s ease; white-space:nowrap; }
.viewer-overlay   { position:absolute; inset:0; display:flex; flex-direction:column;
                    align-items:center; justify-content:center; gap:14px; z-index:3;
                    background:rgba(2,14,26,.85); transition:opacity .5s ease; }
.viewer-overlay.hidden { opacity:0; pointer-events:none; }
.viewer-overlay-text   { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700;
                         letter-spacing:.35em; text-transform:uppercase; color:var(--g); }
.viewer-bar  { width:180px; height:1px; background:rgba(56,238,107,.15); border-radius:1px; }
.viewer-fill { height:100%; width:0%; background:var(--g); border-radius:1px; transition:width .2s ease; }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.btn-p {
  font-family:'Barlow Condensed',sans-serif; font-size:14px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:#000; background:var(--g);
  border:none; border-radius:6px; padding:16px 42px; text-decoration:none;
  cursor:pointer; display:inline-block;
  transition:transform .2s, box-shadow .2s; box-shadow:0 0 32px rgba(56,238,107,.4);
}
.btn-p:hover { transform:translateY(-3px); box-shadow:0 6px 48px rgba(56,238,107,.6); }
.btn-s {
  font-family:'Barlow Condensed',sans-serif; font-size:14px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--g);
  background:transparent; border:1px solid var(--gb); border-radius:6px;
  padding:15px 42px; text-decoration:none; cursor:pointer; display:inline-block;
  transition:background .2s, border-color .2s, transform .2s;
}
.btn-s:hover { background:var(--gf); border-color:var(--g); transform:translateY(-3px); }
.btns { display:flex; gap:16px; flex-wrap:wrap; }

/* ── CALLOUT ─────────────────────────────────────────────────── */
.callout { border:1px solid var(--gb); border-radius:8px;
           background:rgba(56,238,107,.04); padding:32px 36px; margin:40px 0; }
.callout p { margin:0; }
.callout strong { color:var(--g); }

/* ── EXT LINKS ───────────────────────────────────────────────── */
.ext-links { margin:40px 0; padding:28px 32px;
             border:1px solid rgba(56,238,107,.1); border-radius:8px; background:rgba(2,16,30,.5); }
.ext-links-title { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
                   letter-spacing:.4em; text-transform:uppercase; color:var(--g); margin-bottom:14px; }
.ext-links ul { margin:0; list-style:none; }
.ext-links li { margin-bottom:6px; }
.ext-links a  { font-size:14px; color:var(--gd); text-decoration:none; transition:color .2s; }
.ext-links a:hover { color:var(--g); }
.ext-links a::after { content:' ↗'; font-size:11px; opacity:.6; }

/* ── REVEAL ANIMATION ────────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .85s ease,transform .85s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.rd1{transition-delay:.1s;} .rd2{transition-delay:.2s;}
.rd3{transition-delay:.3s;} .rd4{transition-delay:.4s;}

/* ── BLOG ────────────────────────────────────────────────────── */
.blog-hero         { position:relative; padding:140px 36px 80px; min-height:440px;
                     display:flex; align-items:flex-end; overflow:hidden; }
.blog-hero-bg      { position:absolute; inset:-20%; background-size:cover; background-position:center;
                     will-change:transform; filter:brightness(var(--bri-par)) saturate(1.5); }
.blog-hero-grad    { position:absolute; inset:0;
                     background:linear-gradient(to top,var(--navy) 0%,rgba(1,13,24,.3) 60%,rgba(1,13,24,.65) 100%); }
.blog-hero-content { position:relative; z-index:2; max-width:760px; margin:0 auto; width:100%; }
.blog-cat  { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700;
             letter-spacing:.45em; text-transform:uppercase; color:var(--g); margin-bottom:20px; }
.blog-hero h1    { font-family:'Bebas Neue',sans-serif; font-size:clamp(40px,7vw,80px);
                   line-height:.9; letter-spacing:.03em; color:var(--w); margin-bottom:24px; }
.blog-hero h1 em { color:var(--g); font-style:normal; }
.blog-meta { font-family:'Barlow Condensed',sans-serif; font-size:13px; letter-spacing:.15em; color:var(--w3); }
.article-wrap    { max-width:760px; margin:0 auto; padding:72px 36px 120px; }
.article-wrap h2 { font-family:'Bebas Neue',sans-serif; font-size:clamp(30px,4vw,50px);
                   line-height:.9; letter-spacing:.03em; color:var(--w); margin:52px 0 18px; }
.article-wrap h2 em { color:var(--g); font-style:normal; }
.article-wrap h3 { font-family:'Bebas Neue',sans-serif; font-size:clamp(22px,3vw,36px);
                   line-height:.95; letter-spacing:.03em; color:var(--w); margin:36px 0 12px; }
.article-wrap h3 em { color:var(--g); font-style:normal; }
.article-wrap p   { font-size:17px; font-weight:300; line-height:1.9; color:var(--w8); margin-bottom:20px; }
.article-wrap p strong { color:var(--w); font-weight:600; }
.article-wrap p em     { color:var(--g); font-style:normal; }
.article-wrap ul,.article-wrap ol { margin:0 0 24px 24px; }
.article-wrap li { font-size:17px; font-weight:300; line-height:1.85; color:var(--w8); margin-bottom:10px; }
.article-wrap li strong { color:var(--w); font-weight:600; }
.cta-box       { border:1px solid var(--gb); border-radius:12px;
                 background:rgba(56,238,107,.04); padding:48px 40px;
                 text-align:center; margin:72px 0 0; }
.cta-box .eye  { color:var(--g); }
.cta-box h2    { margin-top:0; }
.cta-box p     { font-size:16px; color:var(--w6); margin-bottom:28px; }
.related       { margin:56px 0 0; }
.related-title { font-family:'Barlow Condensed',sans-serif; font-size:10px; font-weight:700;
                 letter-spacing:.4em; text-transform:uppercase; color:var(--g); margin-bottom:22px; }
.related-grid  { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.rc { border:1px solid rgba(56,238,107,.12); border-radius:8px; padding:22px;
      text-decoration:none; background:rgba(2,16,30,.6); transition:border-color .3s; }
.rc:hover { border-color:var(--gb); }
.rc .cat { font-family:'Barlow Condensed',sans-serif; font-size:9px; font-weight:700;
           letter-spacing:.35em; text-transform:uppercase; color:var(--g); margin-bottom:8px; }
.rc h4   { font-family:'Bebas Neue',sans-serif; font-size:20px; color:var(--w);
           letter-spacing:.02em; line-height:.95; }

/* ── FOOTER ──────────────────────────────────────────────────── */
footer { border-top:1px solid rgba(56,238,107,.1); padding:56px 36px 64px;
         display:grid; grid-template-columns:auto 1fr auto; gap:40px;
         align-items:center; position:relative; z-index:1; }
.ft-links   { display:flex; gap:20px; flex-wrap:wrap; justify-content:center; }
.ft-links a { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700;
              letter-spacing:.2em; text-transform:uppercase; color:var(--w3);
              text-decoration:none; transition:color .2s; }
.ft-links a:hover { color:var(--g); }
.ft-right { text-align:right; }
.ft-copy  { font-family:'Barlow Condensed',sans-serif; font-size:12px; letter-spacing:.12em; color:var(--w6); }
.ft-tag   { font-family:'Barlow Condensed',sans-serif; font-size:12px; font-style:italic;
            letter-spacing:.08em; color:var(--w3); margin-top:4px; }

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media(max-width:820px){
  .nav-desktop{display:none;}
  .hamburger{display:flex;}
  .hdr{padding:10px 16px;}
  .logo-img{height:28px;}
  .logo-n{font-size:8px;}
  .logo-s{font-size:3px;}
  .badge{padding:5px 12px;font-size:8px;letter-spacing:.15em;}
  .lang-sw a{font-size:15px;}
}
@media(max-width:700px){
  .card-grid,.card-grid-3,.stats-grid,.phi-grid,.dir-grid{grid-template-columns:1fr;}
  .par-content{grid-template-columns:1fr;gap:40px;}
  .par-content.rt .text-side{grid-column:1;}
  .par-content.rt .text-side+*{grid-column:1;grid-row:auto;}
  .page-hero-content,.hero-content{padding:60px 20px;}
  .inner{padding:0 20px;}
  .section{padding:64px 0;}
  .photo-band{height:220px;}
  .blog-hero{padding:110px 20px 56px;}
  .article-wrap{padding:48px 20px 80px;}
  .related-grid{grid-template-columns:1fr;}
  footer{grid-template-columns:1fr;}
  .ft-right{text-align:left;}
  .ft-links{justify-content:flex-start;}
  #sphere{width:100px;height:100px;left:2vw;bottom:calc(env(safe-area-inset-bottom,0px)+60px);}
  .step{grid-template-columns:1fr;gap:12px;}
  .step-num{display:none;}
  .step:not(:last-child)::before{display:none;}
  .viewer-box{height:300px;}
}

/* ═══════════════════════════════════════════════════════
   INDEX PAGE COMPONENTS (hero, parallax, viewer, etc.)
   ═══════════════════════════════════════════════════════ */


@font-face{font-family:'D3Euronism';src:url('D3Euronism.ttf') format('truetype');font-weight:normal;font-style:normal;font-display:swap;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --g:#38ee6b;--gd:rgba(56,238,107,.65);--gf:rgba(56,238,107,.07);--gb:rgba(56,238,107,.22);--b:#38ee6b;--bd:rgba(56,238,107,.65);--bb:rgba(56,238,107,.22);--bf:rgba(56,238,107,.06);
  --w:#fff;--w8:rgba(255,255,255,.84);--w6:rgba(255,255,255,.65);--w3:rgba(255,255,255,.38);
  --navy:#010d18;
  
}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{background:var(--navy);color:var(--w);font-family:'Barlow',sans-serif;font-weight:300;overflow-x:hidden;}
#bgc{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;}
#sphere{position:fixed;left:3vw;bottom:calc(env(safe-area-inset-bottom,0px) + 80px);z-index:3;pointer-events:none;width:160px;height:160px;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.wrap{position:relative;z-index:1;}
.inner{max-width:980px;margin:0 auto;padding:0 36px;}
.logo-block{display:inline-flex;flex-direction:row;align-items:center;gap:12px;}
.logo-img{display:block;width:auto;height:36px;}
.logo-text{display:flex;flex-direction:column;align-items:flex-start;}
.logo-n{font-family:'D3Euronism',sans-serif;font-size:10px;letter-spacing:.5em;color:var(--g);line-height:1;text-transform:uppercase;white-space:nowrap;display:inline-block;transform:scaleX(1.75);transform-origin:left center;}
.logo-s{font-family:'Montserrat',sans-serif;font-weight:400;font-size:5px;letter-spacing:.05em;text-transform:uppercase;color:var(--gd);margin-top:3px;white-space:nowrap;display:inline-block;transform-origin:left center;}

.badge{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--g);border:1px solid var(--gb);border-radius:100px;padding:7px 18px;display:flex;align-items:center;gap:8px;background:rgba(56,238,107,.07);backdrop-filter:blur(10px);}
.bdot{width:6px;height:6px;border-radius:50%;background:var(--b,#38ee6b);animation:bdot 2s ease infinite;}
@keyframes bdot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.3;transform:scale(.6);}}
.hero{position:relative;height:100vh;overflow:hidden;display:flex;align-items:center;}
.hero-bg{position:absolute;inset:-20%;background-image:url('aquanaut01web.jpg');background-size:cover;background-position:center;will-change:transform;filter:brightness(.55) saturate(1.5);}
.hero-grad{position:absolute;inset:0;background:linear-gradient(135deg,rgba(1,13,24,.78) 0%,rgba(1,13,24,.18) 55%,rgba(1,13,24,.65) 100%);}
.hero-content{position:relative;z-index:2;max-width:980px;margin:0 auto;padding:0 36px;padding-top:80px;}
.hero-eye{font-family:'Barlow Condensed',sans-serif;font-size:12px;font-weight:700;letter-spacing:.5em;text-transform:uppercase;color:var(--g);margin-bottom:32px;opacity:0;animation:fUp .8s ease .3s forwards;}
.hero h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(62px,11vw,116px);line-height:.86;letter-spacing:.02em;color:var(--w);margin-bottom:32px;opacity:0;animation:fUp .9s ease .5s forwards;}
.hero h1 em{color:var(--g);font-style:normal;}
.hero-rule{width:54px;height:2px;background:var(--b,#38ee6b);margin-bottom:28px;opacity:0;animation:fUp .8s ease .7s forwards;}
.hero-tagline{font-family:'Barlow',sans-serif;font-size:19px;font-weight:300;color:var(--w8);max-width:480px;line-height:1.78;opacity:0;animation:fUp .8s ease 1s forwards;}
.hero-tagline strong{color:var(--w);font-weight:600;}
.scroll-hint{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.4em;text-transform:uppercase;color:var(--w3);animation:fUp .8s ease 1.3s both;}
.scroll-hint::after{content:'';width:1px;height:44px;background:linear-gradient(to bottom,var(--w3),transparent);animation:sLine 2s ease infinite;}
@keyframes sLine{0%,100%{transform:scaleY(1);opacity:.5;}50%{transform:scaleY(.5);opacity:1;}}
@keyframes fUp{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:translateY(0);}}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--gb);border:1px solid var(--gb);border-radius:10px;overflow:hidden;margin:80px 0;}
.stat{background:rgba(1,13,24,.92);backdrop-filter:blur(16px);padding:44px 28px;}
.stat-n{font-family:'Bebas Neue',sans-serif;font-size:72px;line-height:1;color:var(--g);letter-spacing:.02em;}
.stat-l{font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--w6);margin-top:8px;line-height:1.4;}

.par-bg{position:absolute;inset:-25%;background-size:cover;background-position:center;will-change:transform;filter:brightness(.85) saturate(1.5);}
.par-grad-l{position:absolute;inset:0;background:linear-gradient(to right,rgba(1,13,24,.96) 0%,rgba(1,13,24,.7) 48%,transparent 100%);}
.par-grad-r{position:absolute;inset:0;background:linear-gradient(to left,rgba(1,13,24,.96) 0%,rgba(1,13,24,.7) 48%,transparent 100%);}
.par-content{position:relative;z-index:2;max-width:980px;margin:0 auto;padding:100px 36px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.par-content.rt .text-side{grid-column:2;}
.par-content.rt .text-side+*{grid-column:1;grid-row:1;}
.quote-section{position:relative;overflow:hidden;min-height:55vh;display:flex;align-items:center;justify-content:center;text-align:center;}
.quote-bg{position:absolute;inset:-20%;background-size:cover;background-position:center 30%;will-change:transform;filter:brightness(.50) saturate(1.6);}
.quote-grad{position:absolute;inset:0;background:linear-gradient(to bottom,var(--navy) 0%,rgba(1,13,24,.2) 40%,rgba(1,13,24,.2) 60%,var(--navy) 100%);}
.quote-inner{position:relative;z-index:2;padding:80px 36px;max-width:860px;}
.quote-text{font-family:'Bebas Neue',sans-serif;font-size:clamp(40px,7vw,90px);line-height:.9;letter-spacing:.04em;color:var(--w);}
.quote-text em{color:var(--g);font-style:normal;}
.reveal{opacity:0;transform:translateY(38px);transition:opacity .85s ease,transform .85s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}
.reveal-delay-1{transition-delay:.15s;}.reveal-delay-2{transition-delay:.3s;}.reveal-delay-3{transition-delay:.45s;}.reveal-delay-4{transition-delay:.6s;}
.eye{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.5em;text-transform:uppercase;color:var(--g);margin-bottom:18px;}
h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(44px,6vw,74px);line-height:.88;letter-spacing:.03em;color:var(--w);margin-bottom:22px;}
h2 em{color:var(--g);font-style:normal;}
h3{font-family:'Bebas Neue',sans-serif;font-size:clamp(28px,4vw,46px);line-height:.92;letter-spacing:.03em;color:var(--w);margin-bottom:14px;}
h3 em{color:var(--g);font-style:normal;}
.rule{width:48px;height:2px;background:var(--b,#38ee6b);margin-bottom:28px;}
p{font-size:17px;font-weight:300;line-height:1.9;color:var(--w8);margin-bottom:16px;max-width:580px;}
p:last-child{margin-bottom:0;}
p strong{color:var(--w);font-weight:600;}
p em{color:var(--g);font-style:normal;}
.phi-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:60px;}
.phi-item{background:rgba(2,16,30,.82);backdrop-filter:blur(12px);border:1px solid rgba(56,238,107,.12);padding:44px 34px;border-radius:4px;transition:border-color .35s,background .35s;}
.phi-item:hover{border-color:var(--gb);background:rgba(56,238,107,.06);}
.phi-n{font-family:'Bebas Neue',sans-serif;font-size:54px;line-height:1;color:rgba(56,238,107,.12);margin-bottom:14px;}
.phi-t{font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--w);margin-bottom:12px;}
.phi-d{font-size:15px;font-weight:300;line-height:1.8;color:var(--w6);}
.sdiv{width:100%;height:1px;background:linear-gradient(to right,transparent,var(--gb),transparent);}
.chapter-hdr{padding:130px 0 60px;text-align:center;}
.chapter-kicker{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.55em;text-transform:uppercase;color:var(--g);margin-bottom:20px;}
.chapter-title{font-family:'D3Euronism',sans-serif;font-size:clamp(32px,7vw,80px);line-height:.9;letter-spacing:.25em;color:var(--w);text-transform:uppercase;}
.chapter-title em{color:var(--g);font-style:normal;}
.chapter-sub{font-family:'Barlow Condensed',sans-serif;font-size:19px;font-weight:300;letter-spacing:.12em;text-transform:uppercase;color:var(--w6);margin-top:24px;max-width:580px;margin-left:auto;margin-right:auto;line-height:1.55;}

/* 3D VIEWER */
.viewer-section{padding:80px 0 100px;}
.viewer-label-row{text-align:center;margin-bottom:48px;}
.viewer-box{
  position:relative;width:100%;height:520px;
  border-radius:12px;overflow:hidden;
  background:rgba(2,14,26,.9);
  border:1px solid var(--gb);
  cursor:grab;user-select:none;
}
.viewer-box:active{cursor:grabbing;}
.viewer-box canvas{display:block;width:100%;height:100%;}
.viewer-badge{position:absolute;top:18px;left:20px;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--g);background:rgba(1,13,24,.75);backdrop-filter:blur(6px);padding:5px 12px;border-radius:3px;border:1px solid var(--gb);pointer-events:none;z-index:2;}
.viewer-hint{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:var(--w3);pointer-events:none;z-index:2;transition:opacity 1s ease;white-space:nowrap;}
.viewer-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;z-index:3;background:rgba(2,14,26,.85);transition:opacity .5s ease;}
.viewer-overlay.hidden{opacity:0;pointer-events:none;}
.viewer-overlay-text{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.35em;text-transform:uppercase;color:var(--g);}
.viewer-bar{width:180px;height:1px;background:rgba(56,238,107,.18);border-radius:1px;}
.viewer-fill{height:100%;width:0%;background:var(--b,#38ee6b);border-radius:1px;transition:width .2s ease;}

.process{display:flex;flex-direction:column;margin-top:80px;}
.step{display:grid;grid-template-columns:72px 1fr;gap:36px;align-items:start;padding-bottom:72px;position:relative;}
.step:not(:last-child)::before{content:'';position:absolute;left:35px;top:52px;bottom:0;width:1px;background:linear-gradient(to bottom,var(--gb),transparent);}
.step-num{font-family:'Bebas Neue',sans-serif;font-size:64px;line-height:1;color:rgba(56,238,107,.12);text-align:center;padding-top:4px;position:relative;}
.step-num::after{content:'';position:absolute;top:10px;left:50%;transform:translateX(-50%);width:11px;height:11px;border-radius:50%;border:2px solid var(--g);background:var(--b,#38ee6b);box-shadow:0 0 12px var(--b,#38ee6b);}
.step-tag{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.42em;text-transform:uppercase;color:var(--g);margin-bottom:10px;}
.step-title{font-family:'Bebas Neue',sans-serif;font-size:34px;line-height:1;letter-spacing:.04em;color:var(--w);margin-bottom:14px;}
.step-title em{color:var(--g);font-style:normal;}
.step-desc{font-size:16px;font-weight:300;line-height:1.85;color:var(--w8);max-width:560px;margin-bottom:24px;}
.photo-row{display:grid;gap:12px;margin-top:4px;}
.photo-row.c2{grid-template-columns:1fr 1fr;}
.photo-row.c3{grid-template-columns:1fr 1fr 1fr;}
.photo-slot{position:relative;border-radius:8px;overflow:hidden;background:rgba(3,18,34,.9);border:1px solid rgba(56,238,107,.15);aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;}
.photo-slot.tall{aspect-ratio:4/5;}
.photo-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.88) saturate(1.15);}
.ph-label{position:absolute;bottom:14px;left:14px;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--g);background:rgba(1,13,24,.78);backdrop-filter:blur(6px);padding:5px 12px;border-radius:3px;border:1px solid var(--gb);z-index:2;}
.ph-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:rgba(56,238,107,.25);text-align:center;padding:20px;width:100%;height:100%;}
.ph-placeholder svg{opacity:.18;}
.ph-placeholder span{font-size:10px;opacity:.55;letter-spacing:.1em;font-weight:400;}
.dir-section{position:relative;overflow:hidden;padding:130px 0;}
.dir-bg{position:absolute;inset:-20%;background-size:cover;background-position:center;will-change:transform;filter:brightness(.4) saturate(1.5);}
.dir-grad{position:absolute;inset:0;background:linear-gradient(to bottom,var(--navy) 0%,rgba(1,13,24,.35) 30%,rgba(1,13,24,.35) 70%,var(--navy) 100%);}
.dir-inner{position:relative;z-index:2;max-width:980px;margin:0 auto;padding:0 36px;}
.dir-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;margin-top:60px;}
.dir-principles{display:flex;flex-direction:column;gap:2px;margin-top:40px;}
.dir-p{padding:20px 22px;border:1px solid rgba(56,238,107,.12);border-radius:4px;background:rgba(1,13,24,.65);backdrop-filter:blur(10px);transition:border-color .3s;}
.dir-p:hover{border-color:var(--gb);}
.dp-label{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.35em;text-transform:uppercase;color:var(--g);margin-bottom:7px;}
.dp-text{font-size:15px;font-weight:300;line-height:1.75;color:var(--w6);}
.dir-quote{font-family:'Bebas Neue',sans-serif;font-size:clamp(30px,4vw,54px);line-height:.9;letter-spacing:.03em;color:var(--w);border-left:3px solid var(--g);padding-left:22px;margin-top:40px;}
.dir-quote em{color:var(--g);font-style:normal;}
.roadmap{margin-top:64px;}
.rm-item{display:flex;align-items:stretch;}
.rm-track{display:flex;flex-direction:column;align-items:center;width:32px;flex-shrink:0;padding-top:5px;}
.rm-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--g);background:var(--b,#38ee6b);flex-shrink:0;box-shadow:0 0 14px var(--b,#38ee6b);}
.rm-dot.f{background:transparent;border-color:rgba(56,238,107,.22);box-shadow:none;}
.rm-ln{width:1px;flex:1;background:linear-gradient(to bottom,var(--gb),transparent);margin:6px 0;}
.rm-c{padding:0 0 60px 28px;flex:1;}
.rm-ph{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.38em;text-transform:uppercase;color:var(--gd);margin-bottom:8px;}
.rm-ti{font-family:'Bebas Neue',sans-serif;font-size:36px;line-height:1;letter-spacing:.04em;color:var(--w);margin-bottom:10px;}
.rm-ti em{color:var(--g);font-style:normal;}
.rm-de{font-size:16px;font-weight:300;line-height:1.8;color:var(--w6);max-width:540px;margin-bottom:14px;}
.rm-b{display:inline-block;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.25em;text-transform:uppercase;border-radius:4px;padding:5px 14px;}
.rm-b.live{background:rgba(56,238,107,.12);color:var(--g);border:1px solid var(--gb);}
.rm-b.soon{background:transparent;color:var(--w3);border:1px solid rgba(255,255,255,.1);}
.cta-wrap{position:relative;overflow:hidden;min-height:80vh;display:flex;align-items:center;justify-content:center;text-align:center;}
.cta-bg{position:absolute;inset:-20%;background-size:cover;background-position:center;will-change:transform;filter:brightness(.26) saturate(1.5);}
.cta-grad{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(56,238,107,.07) 0%,rgba(1,13,24,.82) 65%);}
.cta-inner{position:relative;z-index:2;padding:80px 36px;max-width:720px;}
.cta-inner h2{font-size:clamp(50px,8vw,96px);margin-bottom:28px;}
.cta-inner p{font-size:19px;max-width:480px;margin:0 auto 52px;text-align:center;color:var(--w8);}
.btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}
.btn-p{font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#000;background:var(--b,#38ee6b);border:none;border-radius:6px;padding:16px 42px;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 0 32px rgba(56,238,107,.45);}
.btn-p:hover{transform:translateY(-3px);box-shadow:0 6px 48px rgba(56,238,107,.65);}
.btn-s{font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--g);background:transparent;border:1px solid var(--gb);border-radius:6px;padding:15px 42px;text-decoration:none;cursor:pointer;transition:background .2s,border-color .2s,transform .2s;}
.btn-s:hover{background:var(--gf);border-color:var(--g);transform:translateY(-3px);}
footer{border-top:1px solid rgba(56,238,107,.12);padding:56px 36px 64px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;position:relative;z-index:1;}
.ft-copy{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:.14em;color:var(--w6);}
.ft-tag{font-family:'Barlow Condensed',sans-serif;font-size:13px;font-style:italic;letter-spacing:.08em;color:var(--w3);text-align:right;}
@media(max-width:700px){
  .par-content{grid-template-columns:1fr;gap:40px;}
  .par-content.rt .text-side{grid-column:1;}
  .par-content.rt .text-side+*{grid-column:1;grid-row:auto;}
  .phi-grid,.dir-grid{grid-template-columns:1fr;}
  .stats{grid-template-columns:1fr;}
  .photo-row.c2,.photo-row.c3{grid-template-columns:1fr;}
  .step{grid-template-columns:1fr;gap:12px;}
  .step-num{display:none;}
  .step:not(:last-child)::before{display:none;}
  .viewer-box{height:300px;}
  footer{flex-direction:column;align-items:flex-start;}
  .ft-tag{text-align:left;}
  #sphere{width:100px;height:100px;left:2vw;bottom:calc(env(safe-area-inset-bottom,0px) + 60px);}
  .hdr{padding:10px 14px;}
  .logo-img{height:22px;}
  .logo-block{gap:6px;}
  .logo-n{font-size:7px;}
  .logo-s{font-size:3px;}
  .badge{padding:5px 12px;font-size:8px;letter-spacing:.15em;}
}

/* LIGHTBOX */

/* SPLASH SCREEN */
#splash{
  position:fixed;inset:0;z-index:99998;
  background:#000;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .9s ease;
}
#splash.fade{opacity:0;}
#splash.gone{display:none;}
#splash img{width:min(500px,30vw);height:auto;}

/* LANG SWITCHER */
.lang-sw{display:flex;gap:4px;align-items:center;}
.lang-sw a{font-size:18px;text-decoration:none;opacity:.45;transition:opacity .2s;line-height:1;}
.lang-sw a:hover{opacity:1;}
.lang-sw a.active{opacity:1;filter:drop-shadow(0 0 4px rgba(56,238,107,.65));}
@media(max-width:700px){.lang-sw a{font-size:16px;}}

/* NAV */

.logo-block{display:inline-flex;flex-direction:row;align-items:center;gap:8px;text-decoration:none;}
.logo-img{display:block;width:auto;height:36px;}
.logo-text{display:flex;flex-direction:column;align-items:flex-start;}
.logo-n{font-family:'D3Euronism',sans-serif;font-size:10px;letter-spacing:.5em;color:var(--g);line-height:1;text-transform:uppercase;white-space:nowrap;display:inline-block;transform:scaleX(1.75);transform-origin:left center;}
.logo-s{font-family:'Montserrat',sans-serif;font-weight:400;font-size:5px;letter-spacing:.05em;text-transform:uppercase;color:var(--gd);margin-top:3px;white-space:nowrap;display:inline-block;}
.nav-desktop{display:flex;align-items:center;gap:4px;}
.nav-desktop a{font-family:'Barlow Condensed',sans-serif;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--w6);text-decoration:none;padding:7px 14px;border-radius:6px;transition:color .2s,background .2s;}
.nav-desktop a:hover{color:var(--g);background:rgba(56,238,107,.08);}
.nav-desktop a.active{color:var(--g);}
.nav-cta{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#000!important;background:var(--b,#38ee6b)!important;border-radius:6px;padding:8px 18px!important;margin-left:8px;}
.nav-cta:hover{box-shadow:0 0 20px rgba(56,238,107,.45);}

.hamburger span{display:block;width:22px;height:2px;background:var(--b,#38ee6b);border-radius:1px;transition:transform .3s,opacity .3s;}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.nav-mobile.open{display:flex;}
.nav-mobile a{font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--w6);text-decoration:none;padding:14px 0;border-bottom:1px solid rgba(56,238,107,.08);transition:color .2s;}
.nav-mobile a:hover,.nav-mobile a.active{color:var(--g);}
.nav-mobile a:last-child{border-bottom:none;}
@media(max-width:820px){
  .nav-desktop{display:none;}
  .hamburger{display:flex;}
  .hdr{padding:10px 16px;}
  .logo-img{height:28px;}
}

footer{border-top:1px solid rgba(56,238,107,.12);padding:56px 36px 64px;display:grid;grid-template-columns:auto 1fr auto;gap:40px;align-items:center;position:relative;z-index:1;}
.ft-links{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;}
.ft-links a{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--w3);text-decoration:none;transition:color .2s;}
.ft-links a:hover{color:var(--g);}
.ft-right{text-align:right;}
.ft-copy{font-family:'Barlow Condensed',sans-serif;font-size:12px;letter-spacing:.12em;color:var(--w6);}
.ft-tag{font-family:'Barlow Condensed',sans-serif;font-size:12px;font-style:italic;letter-spacing:.08em;color:var(--w3);margin-top:4px;}
@media(max-width:700px){footer{grid-template-columns:1fr;text-align:left;}.ft-right{text-align:left;}.ft-links{justify-content:flex-start;}}

/* BLUE THEME OVERRIDES */
.eye,.stat-n,.rm-ph,.dp-label,.step-tag,.badge,.bdot,
.rule,.sdiv,.blog-cat,.ext-links-title,.card-n,
.viewer-badge,.chapter-kicker,.ft-links a:hover,
.back-btn,.nav-cta,.nav-desktop a:hover,.nav-mobile a:hover,
.rm-b.live,.ph-label,.viewer-overlay-text,.related-title,
.cta-box .eye,.hero-eye,.hero-rule,
h1 em, h2 em, h3 em, p em, .dir-quote em,
.rm-ti em, .step-title em, .quote-text em,
.chapter-title em{color:#38ee6b!important;}
.rule{background:#38ee6b!important;}
.sdiv{background:linear-gradient(to right,transparent,rgba(56,238,107,.22),transparent)!important;}
.bdot{background:#38ee6b!important;}
.btn-p{background:#38ee6b!important;color:#fff!important;box-shadow:0 0 28px rgba(56,238,107,.4)!important;}
.btn-p:hover{box-shadow:0 6px 44px rgba(56,238,107,.6)!important;}
.btn-s{color:#38ee6b!important;border-color:rgba(56,238,107,.35)!important;}
.btn-s:hover{background:rgba(56,238,107,.06)!important;border-color:#38ee6b!important;}
.nav-cta{background:#38ee6b!important;color:#fff!important;}
.back-btn{color:#38ee6b!important;border-color:rgba(56,238,107,.35)!important;}
.stat-n{color:#38ee6b!important;}
.badge{color:#38ee6b!important;border-color:rgba(56,238,107,.3)!important;}
.hero-rule{background:#38ee6b!important;}
.rm-dot{border-color:#38ee6b!important;background:#38ee6b!important;box-shadow:0 0 14px #38ee6b!important;}
.rm-dot.f{background:transparent!important;border-color:rgba(56,238,107,.22)!important;box-shadow:none!important;}
.rm-b.live{background:rgba(56,238,107,.1)!important;color:#38ee6b!important;border-color:rgba(56,238,107,.3)!important;}
.ext-links a{color:rgba(56,238,107,.75)!important;}
.ext-links a:hover{color:#38ee6b!important;}
.callout{border-color:rgba(56,238,107,.3)!important;background:rgba(56,238,107,.05)!important;}
.callout strong{color:#38ee6b!important;}
.card:hover,.phi-item:hover,.dir-p:hover,.related-card:hover,.rc:hover{border-color:rgba(56,238,107,.4)!important;}
.step-num::after{border-color:#38ee6b!important;background:#38ee6b!important;box-shadow:0 0 12px #38ee6b!important;}
.step:not(:last-child)::before{background:linear-gradient(to bottom,rgba(56,238,107,.22),transparent)!important;}
.dir-quote{border-left-color:#38ee6b!important;}
.viewer-badge{color:#38ee6b!important;border-color:rgba(56,238,107,.3)!important;}
.viewer-fill{background:#38ee6b!important;}
.ph-label{color:#38ee6b!important;border-color:rgba(56,238,107,.3)!important;}
footer{border-top-color:rgba(56,238,107,.15)!important;}


.stats-grid,.stats{background:rgba(56,238,107,.22)!important;border-color:rgba(56,238,107,.22)!important;}

/* Product name in titles - D3Euronism green */
.pname{font-family:'D3Euronism',sans-serif;color:var(--g);font-style:normal;letter-spacing:.08em;}
/* Split-quote photo-band (two quotes on one image) */
.photo-band-content.split-quote {
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 48px 40px;
  gap: 40px;
}
.photo-band-content.split-quote .photo-band-quote {
  font-size: clamp(20px, 3vw, 38px);
  max-width: 45%;
}
.photo-band-content.split-quote .photo-band-quote:first-child {
  text-align: left;
}
.photo-band-content.split-quote .photo-band-quote:last-child {
  text-align: right;
  opacity: .7;
}
@media(max-width:700px) {
  .photo-band-content.split-quote {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px 20px;
    gap: 16px;
  }
  .photo-band-content.split-quote .photo-band-quote {
    max-width: 100%;
    font-size: clamp(18px, 5vw, 28px);
  }
  .photo-band-content.split-quote .photo-band-quote:last-child {
    text-align: left;
  }
}

/* ═══ HAMBURGER FIX ═══════════════════════════════════════════ */
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 8px;
  background: none;
  border: none;
  z-index: 200;
  position: relative;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--g);
  border-radius: 1px;
  transition: transform .3s, opacity .3s;
  pointer-events: none;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media(max-width:820px) {
  .hamburger { display: flex; }
  .nav-desktop { display: none !important; }
}

/* ─── nav-mobile authoritative ─── */
.nav-mobile {
  display: none;
  position: fixed;
  top: 65px;
  left: 0;
  right: 0;
  z-index: 999;
  background: rgba(1,13,24,.98);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(56,238,107,.12);
  flex-direction: column;
  padding: 20px 24px 32px;
}
.nav-mobile.open { display: flex; }
.nav-mobile a {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,.65);
  text-decoration: none;
  padding: 14px 0;
  border-bottom: 1px solid rgba(56,238,107,.08);
  transition: color .2s;
  -webkit-tap-highlight-color: transparent;
}
.nav-mobile a:last-child { border-bottom: none; }
.nav-mobile a:hover, .nav-mobile a.active { color: var(--g); }

/* hdr z-index high enough */
.hdr { z-index: 200 !important; }


/* ═══ PHOTO-BAND: FULL WIDTH + PARALLAX FIX ═══════════════════ */
/* photo-band spans full viewport width */
.photo-band {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  overflow: hidden;
  height: 420px;
}
/* The bg image: use background-attachment:fixed for desktop parallax */
.photo-band-bg {
  position: absolute;
  top: -20%;
  left: 0;
  right: 0;
  bottom: -20%;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  filter: brightness(.65) saturate(1.4);
  z-index: 0;
}
.photo-band-grad {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to right,
    rgba(1,13,24,.75) 0%,
    rgba(1,13,24,.15) 50%,
    rgba(1,13,24,.75) 100%
  );
}
.photo-band-content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 48px;
}
.photo-band-quote {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(32px, 5vw, 72px);
  line-height: .9;
  letter-spacing: .04em;
  color: #fff;
}
.photo-band-quote em { color: var(--g); font-style: normal; }

/* Split-quote layout: left + right on same image */
.photo-band-content.split-quote {
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 48px 40px;
}
.photo-band-content.split-quote .photo-band-quote {
  font-size: clamp(20px, 3vw, 42px);
  max-width: 44%;
}
.photo-band-content.split-quote .photo-band-quote:first-child { text-align: left; }
.photo-band-content.split-quote .photo-band-quote:last-child  { text-align: right; opacity: .7; }

/* Mobile: background-attachment:fixed broken on Safari iOS
   Use the JS parallax approach instead (translateY via JS)
   On mobile just disable the fixed and use cover */
@media(max-width:820px) {
  .photo-band { height: 280px; }
  .photo-band-bg {
    background-attachment: scroll;
    top: 0; bottom: 0;
  }
  .photo-band-content.split-quote {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px 20px;
    gap: 12px;
  }
  .photo-band-content.split-quote .photo-band-quote {
    max-width: 100%;
    font-size: clamp(18px, 5vw, 28px);
  }
  .photo-band-content.split-quote .photo-band-quote:last-child {
    text-align: left;
  }
}
/* ── BLOG ARTICLE: par-section full-width breakout ─────────── */
.article-wrap .par-section {
  width: 100vw;
  position: relative;
  left: 50%;
  margin-left: -50vw;
}
.blog-card-lang {
  display: inline-flex;
  align-items: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gd);
  border: 1px solid var(--gb);
  border-radius: 3px;
  padding: 4px 10px;
  margin-left: 6px;
  margin-bottom: 14px;
}
/* ── PROTOTYPE COMPARISON TABLE ─────────────────────────────── */
.proto-story {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  margin: 56px 0 32px;
}
.proto-card {
  background: rgba(2, 16, 30, 0.7);
  border: 1px solid rgba(56, 238, 107, 0.1);
  border-radius: 6px;
  padding: 26px 22px;
  position: relative;
  transition: border-color .35s, background .35s, transform .35s;
}
.proto-card:hover {
  border-color: rgba(56, 238, 107, 0.35);
  background: rgba(56, 238, 107, 0.04);
  transform: translateY(-4px);
}
.proto-card.current {
  border-color: var(--g);
  background: rgba(56, 238, 107, 0.06);
  box-shadow: 0 0 32px rgba(56, 238, 107, 0.08);
}
.proto-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 64px;
  line-height: 0.85;
  color: rgba(56, 238, 107, 0.18);
  margin-bottom: 4px;
}
.proto-card.current .proto-num {
  color: var(--g);
}
.proto-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--w);
  margin-bottom: 18px;
}
.proto-status {
  display: inline-block;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 3px;
  margin-bottom: 16px;
}
.proto-status.done {
  background: rgba(56, 238, 107, 0.12);
  color: var(--g);
  border: 1px solid rgba(56, 238, 107, 0.25);
}
.proto-status.now {
  background: var(--g);
  color: #000;
}
.proto-status.next {
  background: transparent;
  color: rgba(255, 255, 255, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.15);
}
.proto-desc {
  font-size: 13px;
  font-weight: 300;
  line-height: 1.65;
  color: var(--w6);
  margin-bottom: 18px;
  min-height: 80px;
}
.proto-specs {
  border-top: 1px solid rgba(56, 238, 107, 0.08);
  padding-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.proto-spec-row {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(56,238,107,0.05);
}
.proto-spec-row:last-child { border-bottom: none; }
.proto-spec-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--w3);
  font-size: 9px;
  display: block;
}
.proto-spec-value {
  color: var(--w);
  font-weight: 600;
  font-size: 14px;
  display: block;
  line-height: 1.35;
}
.proto-spec-value.tbd {
  color: var(--gd);
  font-style: italic;
  font-weight: 400;
}

/* Story timeline above the cards */
.proto-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin: 40px 0 0;
}
.timeline-step {
  position: relative;
  padding-left: 24px;
}
.timeline-step::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--g);
  box-shadow: 0 0 12px var(--g);
}
.timeline-step.future::before {
  background: transparent;
  border: 2px solid rgba(56, 238, 107, 0.25);
  box-shadow: none;
  top: 4px;
}
.timeline-tag {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--g);
  margin-bottom: 6px;
}
.timeline-step.future .timeline-tag {
  color: var(--w3);
}
.timeline-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 20px;
  letter-spacing: 0.03em;
  color: var(--w);
  margin-bottom: 6px;
  line-height: 1;
}
.timeline-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--w6);
}

@media(max-width: 900px) {
  .proto-story, .proto-timeline {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media(max-width: 600px) {
  .proto-story, .proto-timeline {
    grid-template-columns: 1fr;
  }
  .proto-desc {
    min-height: auto;
  }
}
/* ── FIX: Voyager hero text overflow on mobile ──────────────── */
@media(max-width: 480px) {
  h1 .pname {
    letter-spacing: 0.02em;
    font-size: 0.85em;
  }
  h1 {
    font-size: clamp(40px, 11vw, 70px) !important;
    line-height: 0.92;
  }
  .page-hero h1, .hero h1 {
    font-size: clamp(38px, 10vw, 64px) !important;
  }
}
/* ── SPLASH SCREEN CONTENT ──────────────────────────────────── */
#splash .splash-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
#splash img {
  display: block;
  width: min(500px, 30vw);
  height: auto;
}
@media(max-width: 700px) {
  #splash img {
    width: min(280px, 60vw);
  }
}
.splash-sub {
  font-family: 'D3Euronism', sans-serif;
  font-size: clamp(14px, 1.6vw, 22px);
  letter-spacing: 0.18em;
  color: var(--g);
  text-transform: uppercase;
  margin-top: 8px;
  opacity: 0.85;
}
.splash-soon {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--gd);
  margin-top: 4px;
}
.splash-soon .bdot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--g);
  animation: bdot 2s ease infinite;
}
/* ── AIR BUBBLE 3D VIEWER (voyager page) ────────────────────── */
.air-viewer-section {
  padding: 100px 0 120px;
  position: relative;
}
.air-viewer-intro {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 60px;
}
.air-viewer-box {
  position: relative;
  width: 100%;
  max-width: 1100px;
  height: 640px;
  margin: 0 auto;
  border-radius: 18px;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(40,120,200,0.10) 0%, transparent 50%),
    radial-gradient(ellipse at 70% 80%, rgba(80,180,255,0.06) 0%, transparent 50%),
    linear-gradient(180deg, rgba(2,12,24,0.92) 0%, rgba(1,8,18,0.98) 100%);
  border: 1px solid rgba(120,200,255,0.14);
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  box-shadow:
    inset 0 0 80px rgba(80,180,255,0.04),
    0 30px 80px rgba(0,0,0,0.4);
}
.air-viewer-box:active { cursor: grabbing; }
.air-viewer-box canvas { display: block; width: 100%; height: 100%; }
.air-viewer-badge {
  position: absolute;
  top: 22px;
  left: 24px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(180,220,255,0.85);
  background: rgba(2,16,30,0.7);
  backdrop-filter: blur(8px);
  padding: 6px 14px;
  border-radius: 3px;
  border: 1px solid rgba(120,200,255,0.18);
  pointer-events: none;
  z-index: 2;
}
.air-viewer-hint {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(180,220,255,0.4);
  pointer-events: none;
  z-index: 2;
  transition: opacity 1s ease;
  white-space: nowrap;
}
.air-viewer-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  z-index: 3;
  background: rgba(2,14,26,0.92);
  transition: opacity 0.6s ease;
}
.air-viewer-overlay.hidden { opacity: 0; pointer-events: none; }
.air-viewer-overlay-text {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: rgba(120,210,255,0.85);
}
.air-viewer-bar {
  width: 180px;
  height: 1px;
  background: rgba(120,200,255,0.15);
  border-radius: 1px;
}
.air-viewer-fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(to right, #7dd3fc, #c0e8ff);
  border-radius: 1px;
  transition: width 0.2s ease;
  box-shadow: 0 0 10px rgba(125,211,252,0.5);
}

/* Caption below viewer */
.air-viewer-caption {
  max-width: 720px;
  margin: 40px auto 0;
  text-align: center;
  padding: 0 24px;
}
.air-viewer-caption p {
  font-size: 15px;
  line-height: 1.85;
  color: var(--w6);
  margin-bottom: 12px;
}
.air-viewer-caption .accent {
  color: #7dd3fc;
  font-style: normal;
}

@media(max-width: 700px) {
  .air-viewer-box { height: 420px; border-radius: 12px; }
  .air-viewer-section { padding: 60px 0 80px; }
}