@font-face { font-family:"DM Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("assets/DMMono-Regular.ttf") format("truetype"); }
@font-face { font-family:"DM Mono"; font-style:normal; font-weight:500; font-display:swap; src:url("assets/DMMono-Medium.ttf") format("truetype"); }
@font-face { font-family:"DM Serif Display"; font-style:normal; font-weight:400; font-display:swap; src:url("assets/DMSerifDisplay-Regular.ttf") format("truetype"); }
@font-face { font-family:"DM Serif Display"; font-style:italic; font-weight:400; font-display:swap; src:url("assets/DMSerifDisplay-Italic.ttf") format("truetype"); }

:root { color-scheme:dark; --ink:#09110b; --surface:#121b14; --line:#3a4136; --lime:#a9bf18; --paper:#f2e8d0; --smoke:#a69b82; --orange:#e85b20; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:"DM Mono", monospace; }
img { max-width:100%; }
main, footer { width:min(1120px, calc(100% - 40px)); margin:auto; }
a { text-underline-offset:4px; }
a:focus-visible { border-radius:4px; outline:3px solid var(--paper); outline-offset:4px; }
.skip-link { background:var(--paper); color:var(--ink); left:16px; padding:12px 16px; position:fixed; top:12px; transform:translateY(-160%); transition:transform .15s ease; z-index:10; }
.skip-link:focus { transform:translateY(0); }
.site-header { position:relative; z-index:2; }
.nav, footer { display:flex; align-items:center; justify-content:space-between; padding:24px 0; }
.nav { gap:22px; }
.wordmark { color:var(--paper); display:flex; align-items:center; gap:10px; text-decoration:none; }
.lockup { display:block; height:auto; width:150px; }
.footer-lockup { display:block; height:auto; width:112px; }
.nav-link, .nav-cta { align-items:center; display:inline-flex; font-size:11px; justify-content:center; letter-spacing:1.4px; min-height:44px; text-transform:uppercase; }
.nav-link { color:var(--paper); margin-left:auto; }
.nav-cta { border:1px solid var(--line); border-radius:12px; color:var(--lime); padding:0 14px; text-decoration:none; }
.nav-cta:hover { border-color:var(--lime); }
.hero { align-items:center; display:grid; gap:64px; grid-template-columns:minmax(0,1fr) minmax(330px,400px); min-height:650px; padding:76px 0 92px; }
.hero-copy { max-width:650px; }
.eyebrow, .availability { color:var(--lime); font-size:11px; letter-spacing:1.6px; text-transform:uppercase; }
h1 { font:clamp(56px,6vw,84px)/.9 "DM Serif Display", serif; letter-spacing:-2px; margin:18px 0 25px; }
h1 em { color:var(--lime); font-weight:400; }
.lede { color:#c7bca3; font-size:15px; line-height:1.7; max-width:560px; }
.button { align-items:center; background:var(--lime); border:2px solid var(--lime); border-radius:14px; color:var(--ink); display:inline-flex; font-size:12px; font-weight:500; gap:24px; justify-content:space-between; letter-spacing:1.3px; margin-top:24px; min-height:54px; padding:0 20px; text-decoration:none; text-transform:uppercase; }
.button:hover { background:var(--paper); border-color:var(--paper); }
.availability { color:var(--smoke); line-height:1.6; margin-top:17px; }
.scorecard { background:var(--surface); border:1px solid #64705c; border-radius:18px; box-shadow:16px 16px 0 #244b2b; padding:17px; position:relative; transform:rotate(3deg); width:100%; }
.card-head, .card-foot { color:var(--smoke); display:flex; font-size:9px; gap:16px; justify-content:space-between; letter-spacing:.5px; text-transform:uppercase; }
.score { align-items:baseline; border-bottom:1px solid var(--line); border-top:1px solid var(--line); display:flex; gap:10px; justify-content:center; margin:13px 0; padding:12px 0; }
.score strong { color:var(--orange); font:44px/1 "DM Serif Display", serif; }
.score span { color:var(--smoke); font-size:9px; letter-spacing:1px; }
.holes { display:grid; gap:5px; grid-template-columns:repeat(9,1fr); margin-bottom:14px; }
.holes span { background:#1b271d; border-radius:5px; color:var(--paper); font-size:11px; padding:7px 0; text-align:center; }
.holes .good { color:var(--lime); }
.holes .bad { color:var(--orange); }
.features { border-top:1px solid var(--line); padding:90px 0 110px; scroll-margin-top:24px; }
.section-title { font:clamp(40px,5vw,64px)/.98 "DM Serif Display",serif; letter-spacing:-1px; margin:18px 0 0; max-width:780px; }
.feature-grid { display:grid; gap:18px; grid-template-columns:repeat(6,1fr); margin-top:42px; }
.feature-card { border:1px solid var(--line); border-radius:16px; grid-column:span 2; min-height:270px; padding:24px; transition:border-color .15s ease, transform .15s ease; }
.feature-card:nth-child(4) { grid-column:2 / span 2; }
.feature-card:hover { border-color:#64705c; transform:translateY(-3px); }
.number { color:var(--lime); font-size:11px; }
.feature-grid h3 { font:31px/1.05 "DM Serif Display",serif; margin:52px 0 14px; }
.feature-grid p, .manifesto > p { color:#c7bca3; font-size:13px; line-height:1.7; }
.app-preview { align-items:center; border-top:1px solid var(--line); display:grid; gap:72px; grid-template-columns:minmax(240px,.8fr) minmax(420px,1.2fr); padding:110px 0; }
.preview-copy { position:sticky; top:40px; }
.preview-copy h2 { font:clamp(42px,5vw,64px)/.98 "DM Serif Display",serif; letter-spacing:-1px; margin:18px 0 22px; }
.preview-copy > p:last-child { color:#c7bca3; font-size:14px; line-height:1.75; }
.phone-gallery { align-items:flex-start; display:grid; gap:24px; grid-template-columns:repeat(2,1fr); }
.phone-shot { margin:0; min-width:0; }
.phone-shot--tracer { margin-top:72px; }
.phone-shot img { background:var(--surface); border:1px solid #64705c; border-radius:28px; display:block; height:auto; width:100%; }
.phone-shot figcaption { color:var(--smoke); font-size:10px; letter-spacing:1.4px; margin-top:13px; text-align:center; text-transform:uppercase; }
.manifesto { background:#244b2b; border-radius:18px; margin-bottom:72px; padding:64px 48px; text-align:center; }
.tape { background:var(--lime); color:var(--ink)!important; display:inline-block; font-size:10px!important; letter-spacing:1.2px; padding:8px 13px; text-transform:uppercase; transform:rotate(-1deg); }
blockquote { font:clamp(38px,6vw,66px)/.96 "DM Serif Display",serif; margin:30px auto 22px; max-width:800px; }
.manifesto > p:last-child { margin:auto; max-width:520px; }
.early-access { border:1px solid var(--line); border-radius:18px; margin:0 0 86px; padding:64px; text-align:center; }
.early-access h2 { font:clamp(40px,5vw,62px)/.98 "DM Serif Display",serif; margin:16px auto; max-width:760px; }
.early-access > p:not(.eyebrow) { color:#c7bca3; font-size:14px; line-height:1.7; margin:0 auto; max-width:620px; }
.button--secondary { background:var(--paper); border-color:var(--paper); }
.button--secondary:hover { background:var(--lime); border-color:var(--lime); }
footer { border-top:1px solid var(--line); color:var(--smoke); font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.footer-meta { align-items:flex-end; display:flex; flex-direction:column; gap:10px; }
.footer-links { display:flex; gap:16px; }
.footer-links a { align-items:center; color:var(--paper); display:inline-flex; min-height:44px; text-decoration:none; }
.footer-links a[aria-current="page"] { color:var(--lime); }
.legal-main { max-width:760px; }
.legal-intro { border-bottom:1px solid var(--line); padding:76px 0 46px; }
.legal-intro h1 { font:clamp(52px,8vw,80px)/.95 "DM Serif Display",serif; letter-spacing:-2px; margin:16px 0; }
.legal-intro > p:last-child { color:var(--smoke); font-size:11px; letter-spacing:1px; text-transform:uppercase; }
.legal-copy { color:#c7bca3; font-size:15px; line-height:1.75; padding:44px 0 88px; }
.legal-copy h2 { color:var(--paper); font:31px/1 "DM Serif Display",serif; margin:47px 0 12px; }
.legal-copy p { margin:0 0 16px; }
.legal-copy a { color:var(--lime); }
.legal-lede { color:var(--paper); font:22px/1.45 "DM Serif Display",serif; }

@media (max-width:900px) {
  .hero { gap:68px; grid-template-columns:1fr; min-height:0; padding:70px 0 104px; }
  .hero-copy { max-width:720px; }
  .scorecard { margin:auto; max-width:520px; transform:rotate(2deg); }
  .feature-grid { grid-template-columns:repeat(2,1fr); }
  .feature-card, .feature-card:nth-child(4) { grid-column:auto; }
  .feature-card:last-child { grid-column:1 / -1; min-height:230px; }
  .app-preview { align-items:start; gap:52px; grid-template-columns:1fr; padding:92px 0; }
  .preview-copy { max-width:680px; position:static; }
  .phone-gallery { margin:auto; max-width:620px; }
}

@media (max-width:600px) {
  main, footer { width:min(100% - 32px,1120px); }
  .nav { gap:12px; }
  .nav-link { display:none; }
  .nav-cta { font-size:10px; margin-left:auto; padding:0 11px; }
  .lockup { width:138px; }
  .hero { gap:58px; padding:58px 0 88px; }
  h1 { font-size:clamp(49px,15vw,67px); letter-spacing:-1.4px; }
  .lede { font-size:14px; }
  .button { width:100%; }
  .scorecard { box-shadow:10px 10px 0 #244b2b; margin:0 6px; width:calc(100% - 12px); }
  .features { padding:72px 0 82px; }
  .feature-grid { grid-template-columns:1fr; margin-top:32px; }
  .feature-card, .feature-card:last-child { grid-column:auto; min-height:240px; }
  .feature-grid h3 { margin-top:42px; }
  .app-preview { padding:76px 0; }
  .phone-gallery { gap:12px; }
  .phone-shot--tracer { margin-top:36px; }
  .phone-shot img { border-radius:18px; }
  .manifesto { padding:46px 20px; }
  .early-access { margin-bottom:64px; padding:46px 20px; }
  footer { align-items:flex-start; gap:18px; }
  .footer-meta { align-items:flex-end; text-align:right; }
  .legal-intro { padding:50px 0 38px; }
  .legal-copy { padding:36px 0 66px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { scroll-behavior:auto!important; transition-duration:.01ms!important; }
}
