:root{
  --ink:#14213D;
  --paper:#FBFAF7;
  --paper-dim:#F0EEE6;
  --marker:#D4F547;
  --marker-soft:#EAF9A0;
  --coral:#FF6B57;
  --line:#E4E1D6;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
}
.display{font-family:'Space Grotesk',sans-serif;}
.mono{font-family:'IBM Plex Mono',monospace;}

nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 6vw;
  position:sticky; top:0; background:rgba(251,250,247,0.85);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  z-index:10;
}
.logo{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:22px; letter-spacing:-0.02em; text-decoration:none; color:var(--ink);}
.logo span{background:var(--marker); padding:0 4px;}
.nav-links{display:flex; align-items:center; gap:32px;}
.nav-links a:not(.btn-primary){color:var(--ink); text-decoration:none; font-size:15px; font-weight:500; opacity:0.75;}
.nav-links a:not(.btn-primary):hover{opacity:1;}
.btn-primary{
  background:var(--ink); color:var(--paper);
  padding:11px 22px; border-radius:100px;
  font-weight:600; font-size:14.5px; text-decoration:none;
  display:inline-block; border:none; cursor:pointer;
  transition:transform 0.15s ease;
}
.btn-primary:hover{transform:translateY(-2px);}

/* Content page layout */
.page-wrap{
  max-width:760px; margin:0 auto; padding:8vh 6vw 10vh;
}
.page-eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:13px;
  text-transform:uppercase; letter-spacing:0.08em;
  color:var(--coral); font-weight:500; margin-bottom:14px;
}
.page-wrap h1{
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(30px,4vw,44px); line-height:1.1; letter-spacing:-0.02em;
  margin-bottom:14px;
}
.page-updated{font-family:'IBM Plex Mono',monospace; font-size:13px; color:#8A8A80; margin-bottom:48px;}
.page-wrap h2{
  font-family:'Space Grotesk',sans-serif; font-size:22px; margin:40px 0 14px;
}
.page-wrap p, .page-wrap li{
  font-size:15.5px; line-height:1.75; color:#3A3A3A; margin-bottom:14px;
}
.page-wrap ul{padding-left:20px; margin-bottom:14px;}
.page-wrap a.inline{color:var(--ink); font-weight:600; border-bottom:2px solid var(--marker);}
.page-wrap strong{font-weight:600;}

footer{
  padding:6vh 6vw 4vh; border-top:1px solid var(--line);
}
.footer-top{
  display:flex; justify-content:space-between; align-items:flex-start;
  max-width:1100px; margin:0 auto 30px; flex-wrap:wrap; gap:24px;
}
.footer-brand{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:20px;}
.footer-brand span{background:var(--marker); padding:0 4px;}
.footer-tag{font-size:14px; color:#8A8A80; margin-top:6px; max-width:260px;}
.footer-links{display:flex; gap:40px; flex-wrap:wrap;}
.footer-col h4{font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:#8A8A80; margin-bottom:12px;}
.footer-col a{display:block; color:var(--ink); text-decoration:none; font-size:14.5px; margin-bottom:8px; opacity:0.8;}
.footer-col a:hover{opacity:1;}
.footer-bottom{
  max-width:1100px; margin:0 auto; padding-top:24px; border-top:1px solid var(--line);
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#8A8A80;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}

@media (max-width:820px){
  .nav-links a:not(.btn-primary){display:none;}
  .footer-top{flex-direction:column;}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}
a:focus-visible, button:focus-visible{
  outline:2px solid var(--ink); outline-offset:2px;
}