:root{
  --ink:#0D1626;
  --well:#070B12;
  --parchment:#EFE8D6;
  --parchment-2:#E4D9BE;
  --brass:#C9982F;
  --brass-bright:#E4B04A;
  --brass-deep:#8A6119;
  --rust:#B0532B;
  --rust-bright:#D06B3B;
  --slate:#3A4F63;
  --cream-text:#F4EFE2;
  --ink-soft:#33405A;
  --line:rgba(13,22,38,0.12);
  --line-dark:rgba(244,239,226,0.14);

  --display:'Space Grotesk', sans-serif;
  --mono:'JetBrains Mono', monospace;
  --body:'Inter', sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--body);
  background:var(--parchment);
  color:var(--ink);
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
}

a{color:inherit; text-decoration:none;}
ul{list-style:none;}
img{max-width:100%; display:block;}

.eyebrow{
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--brass-deep);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:'';
  width:26px; height:1px;
  background:var(--brass-deep);
  display:inline-block;
}
.eyebrow.on-dark{color:var(--rust-bright);}
.eyebrow.on-dark::before{background:var(--rust-bright);}

h1,h2,h3{
  font-family:var(--display);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-0.01em;
}

.wrap{
  max-width:1240px;
  margin:0 auto;
  padding:0 48px;
}
@media (max-width:800px){ .wrap{padding:0 22px;} }

/* ---------------- NAV ---------------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:200;
  padding:22px 0;
  transition:all 0.4s ease;
}
header .wrap{
  display:flex; align-items:center; justify-content:space-between;
}
header.scrolled, header.solid{
  background:rgba(13,22,38,0.94);
  backdrop-filter:blur(10px);
  padding:14px 0;
  box-shadow:0 8px 30px rgba(0,0,0,0.18);
}
.brand{
  display:flex; align-items:center; gap:16px;
}
.brand-logo-color{
  height:62px;
  width:auto;
  display:block;
}
.brand-divider{
  width:1px;
  height:30px;
  background:var(--line);
  transition:background 0.3s ease;
}
header.scrolled .brand-divider, header.solid .brand-divider{
  background:var(--line-dark);
}
.brand-tagline{
  display:block;
  font-family:var(--mono);
  font-weight:400;
  font-size:9px;
  letter-spacing:0.14em;
  color:var(--slate);
  text-transform:uppercase;
  transition:color 0.3s ease;
}
header.scrolled .brand-tagline, header.solid .brand-tagline{
  color:var(--brass-bright);
}
@media (max-width:500px){
  .brand-logo-color{height:44px;}
  .brand-divider{display:none;}
}

.tab-nav{
  display:flex; align-items:center; gap:4px;
  background:rgba(13,22,38,0.06);
  border-radius:100px;
  padding:5px;
}
header.scrolled .tab-nav, header.solid .tab-nav{background:rgba(244,239,226,0.08);}
.tab-nav a{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink);
  padding:9px 18px;
  border-radius:100px;
  transition:all 0.25s ease;
}
header.scrolled .tab-nav a, header.solid .tab-nav a{color:rgba(244,239,226,0.75);}
.tab-nav a:hover{color:var(--ink);}
header.scrolled .tab-nav a:hover, header.solid .tab-nav a:hover{color:var(--cream-text);}
.tab-nav a.active{
  background:var(--ink);
  color:var(--cream-text) !important;
}
header.scrolled .tab-nav a.active, header.solid .tab-nav a.active{background:var(--brass); color:var(--well) !important;}

nav.links{display:flex; align-items:center; gap:20px;}
.nav-call{
  font-family:var(--mono);
  font-size:12.5px;
  padding:9px 18px;
  border:1px solid var(--ink);
  border-radius:100px;
  color:var(--ink);
  white-space:nowrap;
}
header.scrolled .nav-call, header.solid .nav-call{border-color:var(--brass-bright); color:var(--brass-bright);}
@media (max-width:900px){
  .nav-call{display:none;}
  .tab-nav a{padding:8px 12px; font-size:10.5px;}
  .brand small{display:none;}
}

/* ---------------- HERO ---------------- */
.hero{
  position:relative;
  min-height:92vh;
  display:flex;
  align-items:center;
  padding-top:120px;
  overflow:hidden;
}
.hero.light{
  background:
    radial-gradient(ellipse at 75% 20%, rgba(201,152,47,0.16), transparent 55%),
    var(--parchment);
}
.hero.dark{
  background:
    radial-gradient(ellipse at 75% 20%, rgba(208,107,59,0.18), transparent 55%),
    var(--well);
  color:var(--cream-text);
}
.hero .wrap{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:40px;
  align-items:center;
  position:relative;
  z-index:2;
}
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr; } }
.hero-eyebrow-line{
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--slate); margin-bottom:22px;
}
.hero.dark .hero-eyebrow-line{color:var(--rust-bright);}
.hero h1{
  font-size:clamp(36px, 5vw, 64px);
  color:var(--ink);
  margin-bottom:26px;
}
.hero.dark h1{color:var(--cream-text);}
.hero h1 em{
  font-style:normal;
  background:linear-gradient(120deg, var(--rust) 0%, var(--brass) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero.light h1 em{
  background:linear-gradient(120deg, var(--rust) 0%, var(--brass-deep) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero p.lead{
  font-size:17.5px;
  line-height:1.65;
  color:var(--ink-soft);
  max-width:520px;
  margin-bottom:38px;
}
.hero.dark p.lead{color:rgba(244,239,226,0.72);}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap;}
.btn{
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding:16px 30px;
  border-radius:100px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  transition:transform 0.25s ease, box-shadow 0.25s ease;
}
.btn-primary{background:var(--ink); color:var(--cream-text);}
.btn-primary:hover{transform:translateY(-3px); box-shadow:0 14px 30px rgba(13,22,38,0.28);}
.btn-outline{border:1px solid var(--ink-soft); color:var(--ink);}
.btn-outline:hover{transform:translateY(-3px); border-color:var(--rust); color:var(--rust);}
.btn-rust{background:var(--rust-bright); color:var(--well);}
.btn-rust:hover{transform:translateY(-3px); box-shadow:0 14px 30px rgba(208,107,59,0.35);}
.btn-outline-dark{border:1px solid rgba(244,239,226,0.4); color:var(--cream-text);}
.btn-outline-dark:hover{transform:translateY(-3px); border-color:var(--brass-bright); color:var(--brass-bright);}

/* 3D gear stage */
.gear-stage{
  position:relative;
  height:480px;
  perspective:1200px;
  display:flex; align-items:center; justify-content:center;
}
@media (max-width:900px){ .gear-stage{height:320px;} }
.gear-3d{
  position:relative;
  width:340px; height:340px;
  transform-style:preserve-3d;
  animation:spinGear 26s linear infinite;
}
@media (max-width:900px){ .gear-3d{width:230px; height:230px;} }
@keyframes spinGear{
  from{transform:rotateX(58deg) rotateZ(0deg);}
  to{transform:rotateX(58deg) rotateZ(360deg);}
}
.gear-layer{position:absolute; inset:0; transform-style:preserve-3d;}
.gear-layer svg{width:100%; height:100%;}
.gear-layer.back{transform:translateZ(-26px); opacity:0.35;}
.gear-layer.mid{transform:translateZ(-8px); opacity:0.6;}
.gear-layer.front{transform:translateZ(14px);}
.gear-core{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  transform:translateZ(30px);
}
.gear-core-inner{
  width:40%; height:40%;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--brass-bright), var(--rust) 75%);
  box-shadow:0 0 0 8px rgba(244,239,226,0.06), inset 0 4px 14px rgba(0,0,0,0.25);
}
.hero.light .gear-core-inner{box-shadow:0 0 0 8px rgba(13,22,38,0.06), inset 0 4px 14px rgba(0,0,0,0.25);}

.float-card{
  position:absolute;
  border-radius:14px;
  padding:14px 18px;
  box-shadow:0 20px 40px rgba(13,22,38,0.14);
  font-family:var(--mono);
  font-size:11.5px;
  letter-spacing:0.04em;
  animation:floaty 7s ease-in-out infinite;
}
.hero.light .float-card{background:var(--parchment); border:1px solid var(--line); color:var(--ink-soft);}
.hero.dark .float-card{background:#101a2b; border:1px solid var(--line-dark); color:rgba(244,239,226,0.65);}
.float-card b{display:block; font-family:var(--display); font-size:15px; margin-bottom:2px;}
.hero.light .float-card b{color:var(--ink);}
.hero.dark .float-card b{color:var(--cream-text);}
.float-card.c1{top:8%; left:-4%; animation-delay:0s;}
.float-card.c2{bottom:10%; right:-6%; animation-delay:2.2s;}
.float-card.c3{bottom:-2%; left:14%; animation-delay:4s;}
@keyframes floaty{ 0%,100%{transform:translateY(0px);} 50%{transform:translateY(-14px);} }
@media (max-width:900px){ .float-card{display:none;} }

.scroll-cue{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  font-family:var(--mono); font-size:10.5px; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--slate); display:flex; flex-direction:column; align-items:center; gap:8px; z-index:3;
}
.hero.dark .scroll-cue{color:rgba(244,239,226,0.5);}
.scroll-cue .line{width:1px; height:34px; background:var(--slate); position:relative; overflow:hidden;}
.hero.dark .scroll-cue .line{background:rgba(244,239,226,0.3);}
.scroll-cue .line::after{
  content:''; position:absolute; top:-100%; left:0; width:100%; height:100%;
  background:var(--brass); animation:scrollLine 1.8s ease-in-out infinite;
}
@keyframes scrollLine{ to{top:100%;} }

/* ---------------- reveal ---------------- */
.reveal{opacity:0; transform:translateY(28px); transition:opacity 0.8s ease, transform 0.8s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}

/* ---------------- SECTION shared ---------------- */
section{position:relative; padding:120px 0;}
@media (max-width:800px){ section{padding:80px 0;} }
.section-head{max-width:640px; margin-bottom:64px;}
.section-head h2{font-size:clamp(30px,3.6vw,46px); margin-bottom:18px;}
.section-head p{font-size:16px; line-height:1.7; color:var(--ink-soft);}

/* ---------------- LANDING CHOOSER ---------------- */
.chooser{
  display:grid; grid-template-columns:1fr 1fr; gap:26px;
  perspective:1400px;
}
@media (max-width:850px){ .chooser{grid-template-columns:1fr;} }
.choose-card{
  position:relative;
  border-radius:22px;
  padding:44px 38px;
  min-height:360px;
  display:flex; flex-direction:column; justify-content:space-between;
  overflow:hidden;
  transform-style:preserve-3d;
  transition:transform 0.2s ease, box-shadow 0.3s ease;
  will-change:transform;
}
.choose-card.export{
  background:linear-gradient(160deg,#ffffff 0%, var(--parchment-2) 100%);
  border:1px solid var(--line);
  color:var(--ink);
}
.choose-card.academy{
  background:linear-gradient(160deg, #101a2b 0%, var(--well) 100%);
  border:1px solid var(--line-dark);
  color:var(--cream-text);
}
.choose-card:hover{box-shadow:0 30px 60px rgba(13,22,38,0.2);}
.choose-card .cnum{
  font-family:var(--mono); font-size:12px; letter-spacing:0.14em; text-transform:uppercase;
  transform:translateZ(20px);
}
.choose-card.export .cnum{color:var(--brass-deep);}
.choose-card.academy .cnum{color:var(--rust-bright);}
.choose-card h3{font-size:32px; margin:18px 0 14px; transform:translateZ(24px);}
.choose-card p{font-size:15px; line-height:1.65; opacity:0.8; max-width:400px; transform:translateZ(16px);}
.choose-card .cta-row{
  display:flex; align-items:center; justify-content:space-between; margin-top:30px;
  transform:translateZ(28px);
}
.choose-card .go{
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:8px;
}
.choose-card .icon-big{
  width:52px; height:52px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  transform:translateZ(20px);
}
.choose-card.export .icon-big{background:var(--ink);}
.choose-card.academy .icon-big{background:rgba(244,239,226,0.08);}
.choose-card .icon-big svg{width:26px; height:26px;}
.choose-card.export .icon-big svg{stroke:var(--brass-bright);}
.choose-card.academy .icon-big svg{stroke:var(--rust-bright);}

/* ---------------- TRADE CARDS ---------------- */
.cards-3d{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; perspective:1400px;
}
@media (max-width:900px){ .cards-3d{grid-template-columns:1fr;} }
.tcard{
  background:linear-gradient(160deg, #ffffff 0%, var(--parchment-2) 100%);
  border:1px solid var(--line);
  border-radius:20px;
  padding:34px 28px;
  transform-style:preserve-3d;
  transition:transform 0.15s ease, box-shadow 0.3s ease;
  box-shadow:0 12px 30px rgba(13,22,38,0.06);
  will-change:transform;
}
.tcard:hover{box-shadow:0 26px 50px rgba(13,22,38,0.16);}
.tcard .icon{
  width:56px; height:56px; border-radius:14px; background:var(--ink);
  display:flex; align-items:center; justify-content:center; margin-bottom:22px;
  transform:translateZ(20px);
}
.tcard .icon svg{width:28px; height:28px; stroke:var(--brass-bright);}
.tcard h3{font-size:21px; margin-bottom:10px; transform:translateZ(16px);}
.tcard p{font-size:14.5px; line-height:1.6; color:var(--ink-soft); transform:translateZ(10px);}

.values-strip{
  margin-top:80px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden;
}
@media (max-width:800px){ .values-strip{grid-template-columns:repeat(2,1fr);} }
.vitem{background:var(--parchment); padding:30px 24px; display:flex; flex-direction:column; gap:12px;}
.vitem svg{width:24px; height:24px; stroke:var(--rust);}
.vitem span{font-family:var(--display); font-weight:600; font-size:15px;}

/* ---------------- ACADEMY ROADMAP ---------------- */
#academy-body{background:var(--well); color:var(--cream-text);}
#academy-body .section-head p{color:rgba(244,239,226,0.72);}
#academy-body .section-head h2{color:var(--cream-text);}

.roadmap{position:relative; margin-top:20px;}
.roadmap::before{
  content:''; position:absolute; left:29px; top:10px; bottom:10px; width:1px;
  background:linear-gradient(180deg, var(--rust-bright), transparent);
}
@media (max-width:700px){ .roadmap::before{left:20px;} }
.rstep{display:grid; grid-template-columns:60px 1fr; gap:26px; padding:30px 0; border-bottom:1px solid var(--line-dark);}
@media (max-width:700px){ .rstep{grid-template-columns:40px 1fr; gap:18px;} }
.rstep:last-child{border-bottom:none;}
.rstep .num{
  font-family:var(--mono); font-size:13px; color:var(--well); background:var(--rust-bright);
  width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  position:relative; z-index:2;
}
@media (max-width:700px){ .rstep .num{width:40px; height:40px; font-size:11px;} }
.rstep h3{font-size:21px; color:var(--cream-text); margin-bottom:8px;}
.rstep p{font-size:14.5px; line-height:1.7; color:rgba(244,239,226,0.68); max-width:600px;}
.rstep .tag{font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--brass-bright); margin-top:10px; display:inline-block;}

.academy-cta{
  margin-top:60px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:24px;
  padding:36px; border:1px solid var(--line-dark); border-radius:18px; background:rgba(244,239,226,0.03);
}
.academy-cta h3{font-size:22px; color:var(--cream-text); max-width:420px;}

/* Track cards (used on academy page) */
.tracks-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:36px;}
@media (max-width:900px){ .tracks-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .tracks-grid{grid-template-columns:1fr;} }
.track-card{
  border:1px solid var(--line-dark); border-radius:16px; padding:26px 22px;
  background:rgba(244,239,226,0.03);
}
.track-card h4{font-family:var(--display); font-size:16px; color:var(--cream-text); margin-bottom:8px;}
.track-card p{font-size:13.5px; line-height:1.6; color:rgba(244,239,226,0.62);}

/* ---------------- CROSS-LINK TEASER ---------------- */
.crosslink{
  border-radius:22px; padding:48px; display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:24px;
}
.crosslink.to-academy{background:linear-gradient(120deg, var(--well), #101a2b);}
.crosslink.to-export{background:linear-gradient(120deg, var(--parchment-2), var(--parchment));}
.crosslink h3{font-size:24px; max-width:460px;}
.crosslink.to-academy h3{color:var(--cream-text);}
.crosslink.to-export h3{color:var(--ink);}
.crosslink p{font-size:14.5px; margin-top:8px; max-width:460px;}
.crosslink.to-academy p{color:rgba(244,239,226,0.65);}
.crosslink.to-export p{color:var(--ink-soft);}

/* ---------------- CONTACT ---------------- */
.contact-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:50px;}
@media (max-width:900px){ .contact-grid{grid-template-columns:1fr;} }
.cinfo-item{display:flex; gap:20px; padding:26px 0; border-bottom:1px solid var(--line);}
.cinfo-item:first-child{padding-top:0;}
.cinfo-item .ic{
  width:44px; height:44px; border-radius:12px; background:var(--ink);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.cinfo-item .ic svg{width:20px; height:20px; stroke:var(--brass-bright);}
.cinfo-item h4{font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate); margin-bottom:6px;}
.cinfo-item p, .cinfo-item a{font-size:16px; color:var(--ink); font-family:var(--display); font-weight:500;}

.map-card{
  border-radius:20px; border:1px solid var(--line);
  background:linear-gradient(160deg,#fff, var(--parchment-2));
  padding:36px; display:flex; flex-direction:column; justify-content:space-between; min-height:320px;
}
.map-card .pin{
  width:52px; height:52px; border-radius:50%; background:var(--ink);
  display:flex; align-items:center; justify-content:center; margin-bottom:24px;
}
.map-card .pin svg{width:24px; height:24px; stroke:var(--brass-bright);}
.map-card p{font-size:15px; color:var(--ink-soft); line-height:1.6; margin-bottom:22px;}
.map-card a.dir{
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:3px; display:inline-flex; gap:8px; align-self:flex-start;
}

/* ---------------- FOOTER ---------------- */
footer{background:var(--ink); color:var(--cream-text); padding:60px 0 30px;}
.foot-top{
  display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:30px;
  padding-bottom:40px; border-bottom:1px solid var(--line-dark);
}
.foot-brand{display:flex; align-items:center; gap:12px;}
.foot-logo-color{height:44px; width:auto; display:block;}
.foot-nav{display:flex; gap:30px; flex-wrap:wrap;}
.foot-nav a{font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:rgba(244,239,226,0.7);}
.foot-nav a:hover{color:var(--brass-bright);}
.foot-bottom{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; padding-top:24px;
  font-family:var(--mono); font-size:11px; color:rgba(244,239,226,0.45);
}