:root{
  --bg:#070709;
  --bg-1:#0a0b0d;
  --bg-2:#101114;
  --border:#1d1f24;
  --border-bright:#2a2d33;
  --ink:#efece3;
  --ink-dim:#a8a49a;
  --ink-mute:#6c6960;
  --amber:#c4a875;
  --amber-bright:#e8c792;
  --amber-dim:#7a6848;
  --serif:'Fraunces', Georgia, serif;
  --mono:'IBM Plex Mono', monospace;
  --sans:'IBM Plex Sans', -apple-system, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  min-height:100vh;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.6;
  overflow-x:hidden;
  cursor:none;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
.reticle{
  position:fixed;
  width:32px;
  height:32px;
  top:0;
  left:0;
  z-index:9999;
  pointer-events:none;
  transform:translate(-50%,-50%);
  mix-blend-mode:difference;
  will-change:transform;
  transition:width .3s cubic-bezier(.2,.8,.2,1),height .3s cubic-bezier(.2,.8,.2,1);
}
.reticle::before,.reticle::after{content:'';position:absolute;background:var(--ink)}
.reticle::before{top:50%;left:0;right:0;height:1px;transform:translateY(-50%)}
.reticle::after{left:50%;top:0;bottom:0;width:1px;transform:translateX(-50%)}
.reticle .ring{position:absolute;inset:8px;border:1px solid var(--ink);border-radius:50%;opacity:.7;transition:inset .3s,opacity .3s}
.reticle .dot{position:absolute;top:50%;left:50%;width:3px;height:3px;background:var(--amber);transform:translate(-50%,-50%);border-radius:50%;transition:background .3s}
.reticle.active{width:52px;height:52px}
.reticle.active .ring{inset:4px;opacity:1}
.reticle.active .dot{background:var(--amber-bright)}
.grain,
.grid-bg{
  position:fixed;
  inset:0;
  pointer-events:none;
}
.grain{
  z-index:0;
  opacity:.05;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.grid-bg{
  z-index:0;
  opacity:.18;
  background-image:
    linear-gradient(var(--border) 1px,transparent 1px),
    linear-gradient(90deg,var(--border) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:radial-gradient(circle at center,#000 20%,transparent 78%);
  -webkit-mask-image:radial-gradient(circle at center,#000 20%,transparent 78%);
}
.page{
  position:relative;
  z-index:1;
}
.ticker{
  border-bottom:1px solid var(--border);
  background:rgba(10,11,13,.92);
  overflow:hidden;
  height:32px;
  display:flex;
  align-items:center;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ink-dim);
}
.ticker-track{
  display:flex;
  gap:42px;
  white-space:nowrap;
  padding-left:32px;
  animation:tick 60s linear infinite;
}
.ticker-track span{display:inline-flex;align-items:center;gap:8px}
.ticker-track .sep{color:var(--ink-mute)}
.ticker-track .live{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--amber);
  box-shadow:0 0 8px var(--amber);
}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
nav{
  position:sticky;
  top:0;
  z-index:20;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:24px;
  align-items:center;
  padding:20px 32px;
  background:rgba(7,7,9,.86);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(18px);
}
.logo{
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:.1em;
  text-transform:uppercase;
  white-space:nowrap;
}
.logo .slash{color:var(--amber);margin:0 4px}
.logo .sub{color:var(--ink-mute)}
.nav-copy{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.nav-actions{
  display:flex;
  gap:12px;
  align-items:center;
}
.nav-link,
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-decoration:none;
  border:1px solid var(--border-bright);
  background:rgba(16,17,20,.72);
  color:var(--ink);
  padding:12px 16px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:none;
  transition:border-color .25s,color .25s,background .25s,transform .25s;
}
.nav-link:hover,
.button:hover{
  border-color:var(--amber-dim);
  color:var(--amber-bright);
  background:rgba(196,168,117,.08);
  transform:translateY(-1px);
}
.button.primary{
  border-color:var(--amber-dim);
  background:rgba(196,168,117,.08);
}
.button.ghost{
  background:transparent;
}
.hero{
  padding:88px 32px 60px;
  border-bottom:1px solid var(--border);
  opacity:0;
  transform:translateY(28px);
  animation:fadeLift 1s cubic-bezier(.2,.8,.2,1) forwards;
}
.hero-inner{
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:36px;
  align-items:end;
  position:relative;
}
.hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-bottom:24px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--amber);
}
.hero-kicker::before{
  content:'';
  width:34px;
  height:1px;
  background:var(--amber);
}
.hero h1{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(46px,6vw,92px);
  line-height:.96;
  letter-spacing:-.04em;
  margin-bottom:24px;
}
.hero h1 em{
  font-style:italic;
  color:var(--amber-bright);
}
.hero p{
  max-width:680px;
  color:var(--ink-dim);
  font-size:17px;
}
.hero-actions{
  margin-top:34px;
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.hero-panel{
  position:relative;
  min-height:520px;
  overflow:hidden;
}
.hero-radar{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.9;
}
.hero-panel-overlay{
  position:absolute;
  inset:0;
  border:1px solid var(--border);
  background:
    linear-gradient(180deg, rgba(7,7,9,.04), rgba(7,7,9,.18)),
    linear-gradient(90deg, rgba(196,168,117,.02) 1px, transparent 1px),
    linear-gradient(0deg, rgba(196,168,117,.02) 1px, transparent 1px);
  background-size:auto,72px 72px,72px 72px;
  pointer-events:none;
}
.metric-grid{
  position:absolute;
  left:24px;
  right:24px;
  bottom:24px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border:1px solid var(--border);
  background:rgba(7,7,9,.58);
  backdrop-filter:blur(10px);
}
.metric{
  padding:20px;
  border-right:1px solid var(--border);
}
.metric:last-child{border-right:none}
.metric .label{
  display:block;
  margin-bottom:6px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.metric .value{
  font-family:var(--serif);
  font-size:28px;
  color:var(--ink);
}
.hero-reticle{
  position:absolute;
  top:22%;
  right:16%;
  width:50px;
  height:50px;
  pointer-events:none;
  opacity:.84;
  animation:heroReticleDrift 5.4s ease-in-out infinite;
}
.hero-reticle::before,.hero-reticle::after{
  content:'';
  position:absolute;
  background:var(--ink);
}
.hero-reticle::before{top:50%;left:0;right:0;height:1px;transform:translateY(-50%)}
.hero-reticle::after{left:50%;top:0;bottom:0;width:1px;transform:translateX(-50%)}
.hero-reticle .ring{
  position:absolute;
  inset:11px;
  border:1px solid var(--ink);
  border-radius:50%;
}
.hero-reticle .dot{
  position:absolute;
  top:50%;
  left:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:var(--amber);
  box-shadow:0 0 10px rgba(196,168,117,.55);
}
@keyframes heroReticleDrift{
  0%,100%{transform:translate(0,0)}
  50%{transform:translate(10px,-8px)}
}
.section{
  padding:90px 32px;
  border-bottom:1px solid var(--border);
}
.section-inner{
  max-width:1280px;
  margin:0 auto;
}
.section-num{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--amber);
}
.section-num::before{
  content:'';
  width:30px;
  height:1px;
  background:var(--amber);
}
.section-head{
  display:grid;
  grid-template-columns:1fr .82fr;
  gap:34px;
  align-items:end;
  margin-bottom:34px;
}
.section-head h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(34px,4.4vw,60px);
  line-height:1.02;
  letter-spacing:-.03em;
}
.section-head h2 em{
  font-style:italic;
  color:var(--amber-bright);
}
.section-head p{
  color:var(--ink-dim);
}
.cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border-top:1px solid var(--border);
  border-left:1px solid var(--border);
}
.card{
  padding:28px;
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:rgba(10,11,13,.7);
  opacity:0;
  transform:translateY(24px);
  animation:fadeLift .9s cubic-bezier(.2,.8,.2,1) forwards;
}
.card:nth-child(2){animation-delay:.08s}
.card:nth-child(3){animation-delay:.16s}
.card .eyebrow{
  display:block;
  margin-bottom:14px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--amber);
}
.card h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:28px;
  line-height:1.1;
  margin-bottom:12px;
}
.card p{
  color:var(--ink-dim);
}
.module-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.module{
  border:1px solid var(--border);
  padding:24px;
  background:rgba(10,11,13,.72);
  min-height:126px;
  opacity:0;
  transform:translateY(24px);
  animation:fadeLift .9s cubic-bezier(.2,.8,.2,1) forwards;
}
.module:nth-child(2){animation-delay:.08s}
.module:nth-child(3){animation-delay:.16s}
.module:nth-child(4){animation-delay:.24s}
.module .idx{
  display:block;
  margin-bottom:16px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.module p{
  color:var(--ink);
  font-size:15px;
}
.process{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.process-step{
  border:1px solid var(--border);
  padding:26px;
  background:
    linear-gradient(180deg, rgba(196,168,117,.06), rgba(196,168,117,0) 28%),
    rgba(10,11,13,.8);
  opacity:0;
  transform:translateY(24px);
  animation:fadeLift .9s cubic-bezier(.2,.8,.2,1) forwards;
}
.process-step:nth-child(2){animation-delay:.08s}
.process-step:nth-child(3){animation-delay:.16s}
.process-step h3{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:14px;
}
.process-step p{
  color:var(--ink-dim);
}
.bottom-cta{
  display:grid;
  grid-template-columns:1fr auto;
  gap:24px;
  align-items:center;
  border:1px solid var(--border-bright);
  padding:30px;
  background:
    radial-gradient(circle at bottom left, rgba(196,168,117,.12), transparent 38%),
    rgba(10,11,13,.84);
  opacity:0;
  transform:translateY(24px);
  animation:fadeLift 1s cubic-bezier(.2,.8,.2,1) .14s forwards;
}
.bottom-cta h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(30px,3.4vw,48px);
  line-height:1.05;
  margin-bottom:10px;
}
.bottom-cta p{
  color:var(--ink-dim);
  max-width:760px;
}
footer{
  padding:34px 32px 46px;
}
.footer-inner{
  max-width:1280px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  color:var(--ink-mute);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
@keyframes fadeLift{
  from{opacity:0;transform:translateY(28px)}
  to{opacity:1;transform:translateY(0)}
}
@media(max-width:1024px){
  .hero-inner,
  .section-head,
  .bottom-cta{
    grid-template-columns:1fr;
  }
  .cards,
  .process{
    grid-template-columns:1fr;
  }
}
@media(max-width:820px){
  nav{
    grid-template-columns:1fr;
    gap:14px;
    padding:18px 20px;
  }
  .nav-actions{
    flex-wrap:wrap;
  }
  .hero,
  .section,
  footer{
    padding-left:20px;
    padding-right:20px;
  }
  .metric-grid,
  .module-grid{
    grid-template-columns:1fr;
  }
  .hero-panel{min-height:420px}
  .metric-grid{
    left:18px;
    right:18px;
    bottom:18px;
  }
  .button,
  .nav-link{
    width:100%;
  }
  .footer-inner{
    flex-direction:column;
    align-items:flex-start;
  }
}
@media(hover:none){
  body{cursor:auto}
  .reticle{display:none}
  .nav-link,.button{cursor:pointer}
}