:root{
  --navy-dark:#1B3A50;
  --navy-text:#0F2535;
  --navy-deep:#091924;
  --teal-mid:#2A5F7A;
  --sage-green:#6E9050;
  --forest-green:#2D5A3A;
  --copper-orange:#D08850;
  --copper-hover:#C07540;
  --cream-bg:#F5F3EB;
  --cream-alt:#EDE9DD;
  --white:#FFFFFF;
  --border-soft:rgba(15,37,53,.08);
  --shadow-card:0 1px 2px rgba(15,37,53,.04), 0 8px 24px rgba(15,37,53,.06);
  --shadow-hover:0 4px 8px rgba(15,37,53,.06), 0 16px 40px rgba(15,37,53,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{
  margin:0;
  font-family:"Manrope",system-ui,sans-serif;
  color:var(--navy-text);
  background:var(--cream-bg);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{font-family:"Sora",sans-serif;letter-spacing:-0.02em;line-height:1.1;color:var(--navy-text);margin:0}
h1{font-weight:700;font-size:clamp(40px,5.5vw,68px)}
h2{font-weight:700;font-size:clamp(30px,3.6vw,46px)}
h3{font-weight:600;font-size:clamp(20px,1.7vw,26px)}
h4{font-weight:600;font-size:18px}
p{margin:0}
a{color:inherit;text-decoration:none}
.mono{font-family:"JetBrains Mono",monospace;font-size:.8em;letter-spacing:.02em}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
section{padding:96px 0;position:relative}
@media(max-width:768px){section{padding:64px 0}}

.skip{position:absolute;left:-9999px;top:auto}
.skip:focus{left:16px;top:16px;background:var(--navy-text);color:#fff;padding:10px 16px;border-radius:8px;z-index:9999}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 22px;border-radius:8px;
  font-family:"Sora",sans-serif;font-weight:600;font-size:15px;
  cursor:pointer;border:none;transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
  text-decoration:none;line-height:1;
}
.btn-primary{background:var(--copper-orange);color:#fff;box-shadow:0 4px 12px rgba(208,136,80,.3)}
.btn-primary:hover{background:var(--copper-hover);transform:translateY(-1px);box-shadow:0 6px 16px rgba(208,136,80,.4)}
.btn-outline{background:transparent;color:var(--navy-text);border:1.5px solid var(--navy-text)}
.btn-outline:hover{background:var(--navy-text);color:#fff}
.btn-outline-light{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.6)}
.btn-outline-light:hover{background:#fff;color:var(--navy-text);border-color:#fff}
.btn-ghost{background:transparent;color:var(--navy-text);padding:13px 12px}
.btn-ghost:hover{color:var(--copper-orange)}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(0.16,1,0.3,1),transform .7s cubic-bezier(0.16,1,0.3,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .reveal{transition:none}
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:"JetBrains Mono",monospace;font-size:12px;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--sage-green);font-weight:500;
  margin-bottom:18px;
}
.eyebrow::before{content:"";width:24px;height:1.5px;background:var(--sage-green);display:inline-block}

.hero-mesh{
  position:absolute;inset:0;overflow:hidden;z-index:0;
  background:
    radial-gradient(60% 80% at 80% 10%, rgba(110,144,80,.18), transparent 60%),
    radial-gradient(50% 70% at 10% 20%, rgba(42,95,122,.18), transparent 60%),
    radial-gradient(60% 60% at 50% 100%, rgba(208,136,80,.14), transparent 60%);
}
.hero-mesh::before{
  content:"";position:absolute;inset:-20%;
  background:
    radial-gradient(circle at 30% 40%, rgba(110,144,80,.25), transparent 30%),
    radial-gradient(circle at 70% 60%, rgba(42,95,122,.25), transparent 30%),
    radial-gradient(circle at 50% 80%, rgba(208,136,80,.20), transparent 30%);
  filter:blur(60px);
  animation:meshDrift 18s ease-in-out infinite alternate;
}
@keyframes meshDrift{
  0%{transform:translate(0,0) rotate(0deg)}
  100%{transform:translate(4%,-3%) rotate(8deg)}
}
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(15,37,53,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,37,53,.05) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%, #000 30%, transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%, #000 30%, transparent 80%);
}

.card{
  background:#fff;border:1px solid var(--border-soft);
  border-radius:16px;padding:28px;
  box-shadow:var(--shadow-card);
  transition:transform .25s cubic-bezier(0.25,1,0.5,1), box-shadow .25s cubic-bezier(0.25,1,0.5,1), border-color .2s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:rgba(110,144,80,.4)}

.tag{
  display:inline-block;padding:4px 10px;border-radius:999px;
  background:rgba(110,144,80,.14);color:var(--forest-green);
  font-family:"JetBrains Mono",monospace;font-size:11px;
  letter-spacing:.06em;font-weight:500;
}
.tag-orange{background:rgba(208,136,80,.16);color:#A85F2C}

.booting{display:flex;align-items:center;justify-content:center;min-height:80vh;color:var(--navy-text);opacity:.5;font-family:"Sora",sans-serif}
