/* NumbersDone landing page. Mobile-first. Tokens mirror /brand/numbersdone/tokens/numbersdone.tokens.css */
@font-face{font-family:"Archivo";src:url(fonts/archivo-var.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter-var.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/ibmplexmono-500.woff2) format("woff2");font-weight:500;font-display:swap}
:root{
  --yellow:#FFD60A;--asphalt:#121316;--steel:#2A2D33;--concrete:#8B9096;--paper:#F4F2EC;--white:#fff;--muted:#5E636A;--line:#D9D6CC;--line-dk:#3A3E45;
  --ok:#0E7A4F;--ok-dk:#3DD68C;
  --display:"Archivo","Arial Black",system-ui,sans-serif;--text:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --r-sm:6px;--r-md:10px;--r-lg:16px;--r-xl:24px;--max:1200px;--gut:20px;
  --ease:cubic-bezier(.2,.8,.2,1);--snap:cubic-bezier(.3,1.4,.5,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:400 16px/1.55 var(--text);color:var(--asphalt);background:var(--paper);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-9999px;top:8px;background:var(--yellow);color:var(--asphalt);padding:10px 14px;border-radius:var(--r-sm);z-index:100;font-weight:600}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--asphalt);outline-offset:3px;border-radius:4px}
.dark :focus-visible{outline-color:var(--yellow)}
.dark{background:var(--asphalt);color:var(--paper)}
.eyebrow{font:500 13px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;margin:0 0 16px}
.dark .eyebrow{color:var(--yellow)} .eyebrow{color:var(--muted)}
h1,h2,h3{font-family:var(--display);font-stretch:112%;font-weight:800;letter-spacing:-.01em;margin:0}
.display{font-stretch:125%;font-weight:900;font-size:clamp(2.6rem,1.6rem + 5vw,5.4rem);line-height:.98}
h2{font-size:clamp(1.65rem,1.2rem + 2vw,2.5rem);line-height:1.08}
h3{font-size:1.2rem;line-height:1.25}
.dot{display:inline-block;width:.17em;height:.17em;background:var(--yellow);margin-left:.05em;vertical-align:baseline}
.paper .dot,.hl .dot{background:var(--asphalt)}
.hl{background:linear-gradient(var(--yellow),var(--yellow));background-size:100% 86%;background-position:0 70%;background-repeat:no-repeat;padding:0 .12em;margin:0 -.04em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lead{font-size:clamp(1.05rem,1rem + .4vw,1.25rem);line-height:1.55;max-width:38em}
.dark .lead{color:#C9CCD0}
.muted{color:var(--muted)} .dark .muted{color:var(--concrete)}
section{padding:72px 0}
@media (min-width:900px){section{padding:112px 0} :root{--gut:32px}}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:var(--r-md);font:600 16px/1.2 var(--text);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform var(--ease) .12s,background-color .12s}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--yellow);color:var(--asphalt)}
.btn-primary:hover{background:#FFE14D}
.btn-ghost{border-color:currentColor;background:transparent}
.btn-dark{background:var(--asphalt);color:var(--paper)}
.btn-dark:hover{background:var(--steel)}
/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(18,19,22,.96);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--line-dk)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.brand{display:flex;align-items:center;text-decoration:none}
.brand svg{height:30px;width:auto}
.nav{display:none}
.nav a{color:var(--paper);text-decoration:none;font-weight:500;font-size:15px;padding:10px 4px}
.nav a:hover{color:var(--yellow)}
.header-cta{min-height:44px;padding:8px 14px;font-size:15px;white-space:nowrap}
.nw{white-space:nowrap}
@media (max-width:380px){.brand svg{height:24px}.header-cta{font-size:14px;padding:8px 12px}}
@media (min-width:900px){.nav{display:flex;gap:28px}.brand svg{height:34px}}
/* hero */
.hero{padding:48px 0 64px}
.hero-grid{display:grid;gap:40px}
@media (min-width:980px){.hero{padding:88px 0 96px}.hero-grid{grid-template-columns:1.15fr .85fr;align-items:center;gap:56px}}
.hero .lead{margin:24px 0 32px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.trust-line{margin:24px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;color:var(--concrete)}
.trust-line li::before{content:"";display:inline-block;width:7px;height:7px;background:var(--yellow);margin-right:8px;vertical-align:1px}
/* phone */
.phone{position:relative;margin:0 auto;max-width:340px;width:100%;background:#0A0A0B;border-radius:44px;padding:12px;box-shadow:0 24px 64px rgba(0,0,0,.45)}
.phone::after{content:"";position:absolute;right:-26px;bottom:60px;width:120px;height:120px;background:var(--yellow);z-index:-1}
.screen{background:#fff;border-radius:34px;overflow:hidden;color:var(--asphalt)}
.screen-head{display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px 0 10px;background:#F6F6F8;border-bottom:1px solid #E7E7EA;font:600 13px var(--text)}
.screen-head svg{width:34px;height:34px}
.chat{padding:14px 12px 16px;display:flex;flex-direction:column;gap:8px;font-size:14.5px;line-height:1.35}
.b{max-width:82%;padding:9px 13px;border-radius:18px;margin:0}
.b.me{align-self:flex-end;background:var(--yellow);border-bottom-right-radius:6px}
.b.nd{align-self:flex-start;background:#EDEDF0;border-bottom-left-radius:6px}
.receipt{display:flex;gap:10px;align-items:center}
.receipt i{display:block;width:34px;height:46px;background:#fff;border-radius:3px;box-shadow:inset 0 0 0 1px #ddd;background-image:repeating-linear-gradient(#fff 0 6px,#ccc 6px 8px);background-size:70% 100%;background-repeat:no-repeat;background-position:center 6px}
.done-card{background:var(--asphalt);color:var(--paper);border-radius:16px;padding:14px 16px;margin-top:4px}
.done-card .dc-h,.done-list h3{font:500 12px/1 var(--mono);letter-spacing:.14em;color:var(--yellow);margin:0 0 10px;text-transform:uppercase}
.done-card ul,.done-list ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.done-card li,.done-list li{display:flex;gap:10px;align-items:flex-start}
.done-card li::before,.done-list li::before{content:"";flex:0 0 12px;height:12px;margin-top:4px;background:var(--yellow);border-radius:2px}
.example-tag{display:inline-block;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--concrete);margin-top:12px;text-align:center;width:100%}
/* problem */
.cards{display:grid;gap:16px;margin-top:40px}
@media (min-width:760px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px}
.card p{margin:10px 0 0;color:var(--muted)}
.card .k{font:500 13px var(--mono);letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
/* steps */
.steps{counter-reset:s;display:grid;gap:16px;margin:40px 0 0;padding:0;list-style:none}
@media (min-width:760px){.steps{grid-template-columns:repeat(3,1fr)}}
.steps li{counter-increment:s;background:var(--steel);border-radius:var(--r-lg);padding:28px 24px}
.steps li::before{content:counter(s);display:grid;place-items:center;width:44px;height:44px;background:var(--yellow);color:var(--asphalt);font:900 22px/1 var(--display);font-stretch:125%;border-radius:10px;margin-bottom:18px}
.steps p{margin:10px 0 0;color:#C9CCD0}
/* features */
.feat{display:grid;gap:16px;margin-top:40px}
@media (min-width:760px){.feat{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.feat{grid-template-columns:repeat(3,1fr)}}
.feat article{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px}
.feat .ic{width:44px;height:44px;border-radius:10px;background:var(--asphalt);display:grid;place-items:center;margin-bottom:16px}
.feat .ic svg{width:26px;height:26px}
.feat ul{margin:12px 0 0;padding-left:18px;color:var(--muted)} .feat li{margin:4px 0}
/* done list showcase */
.split{display:grid;gap:40px;align-items:center}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;gap:64px}}
.done-list{background:var(--asphalt);color:var(--paper);border-radius:var(--r-xl);padding:28px;max-width:460px;box-shadow:var(--shadow,0 24px 64px rgba(18,19,22,.22))}
.done-list .big{display:flex;justify-content:space-between;gap:16px;margin:8px 0 18px;padding-bottom:18px;border-bottom:1px solid var(--line-dk)}
.done-list .big b{display:block;font:900 40px/1 var(--display);font-stretch:112%} .done-list .big b.y{color:var(--yellow)}
.done-list .big span{font-size:13px;color:var(--concrete)}
/* security */
.sec{display:grid;gap:12px;margin-top:36px;padding:0;list-style:none}
@media (min-width:760px){.sec{grid-template-columns:repeat(2,1fr)}}
.sec li{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:18px}
.sec svg{flex:0 0 28px;width:28px;height:28px}
.sec b{display:block} .sec span{color:var(--muted);font-size:15px}
.fine{font-size:13px;color:var(--muted);margin-top:24px;max-width:60em}
/* pricing */
.tiers{display:grid;gap:16px;margin-top:40px}
@media (min-width:700px){.tiers{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.tiers{grid-template-columns:repeat(4,1fr)}}
.tier{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px}
.tier.feature{background:var(--asphalt);color:var(--paper);border-color:var(--asphalt)}
.tier .tag{align-self:flex-start;font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;background:var(--yellow);color:var(--asphalt);padding:6px 8px;border-radius:4px;margin-bottom:14px}
.price{font:900 44px/1 var(--display);font-stretch:112%;margin:14px 0 4px}
.price small{font:500 15px var(--text);color:var(--muted)} .tier.feature .price small{color:var(--concrete)}
.tier .promise{font-weight:600;margin:12px 0}
.tier ul{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:8px;font-size:15px}
.tier li{padding-left:22px;position:relative}
.tier li::before{content:"";position:absolute;left:0;top:7px;width:10px;height:10px;background:var(--asphalt)}
.tier.feature li::before{background:var(--yellow)}
.tier .btn{margin-top:auto}
/* cpa */
.cpa-grid{display:grid;gap:32px}
@media (min-width:900px){.cpa-grid{grid-template-columns:1.1fr .9fr;align-items:center}}
.ticks{list-style:none;padding:0;margin:24px 0 32px;display:grid;gap:12px}
.ticks li{padding-left:28px;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:8px;width:12px;height:12px;background:var(--yellow)}
.cobrand{background:var(--steel);border-radius:var(--r-xl);padding:28px;display:grid;gap:16px}
.cobrand .row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cobrand .x{color:var(--paper);font:500 22px var(--mono)}
.firm{border:2px dashed var(--concrete);color:var(--concrete);border-radius:10px;padding:10px 14px;font:600 14px var(--text)}
/* faq */
.faq{margin-top:32px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font:700 17px/1.35 var(--text);position:relative;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font:900 26px/1 var(--display)}
.faq details[open] summary::after{content:"\2013"}
.faq details p{margin:0 0 20px;color:var(--muted);max-width:52em}
/* form */
.form{display:grid;gap:16px;margin-top:32px;max-width:640px}
@media (min-width:700px){.form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}}
.field{display:grid;gap:6px}
label{font-weight:600;font-size:15px}
input,select{font:400 16px var(--text);min-height:48px;padding:10px 14px;border:2px solid var(--concrete);border-radius:var(--r-md);background:var(--white);color:var(--asphalt);width:100%}
input:focus-visible,select:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;border-color:var(--asphalt)}
.hint{font-size:13px;color:var(--concrete)}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.check input{width:22px;min-height:22px;height:22px;margin-top:2px;accent-color:var(--yellow)}
/* footer */
.site-footer{padding:48px 0;border-top:1px solid var(--line-dk)}
.site-footer .wrap{display:grid;gap:24px}
@media (min-width:800px){.site-footer .wrap{grid-template-columns:1fr auto;align-items:end}}
.site-footer nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.site-footer a{color:var(--concrete);text-decoration:none;font-size:14px;padding:6px 0} .site-footer a:hover{color:var(--yellow)}
.legal{font-size:13px;color:var(--concrete);margin:12px 0 0;max-width:46em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:no-preference){
  .hero .dot{animation:drop .32s var(--snap) .35s both}
  @keyframes drop{from{transform:translateY(-.6em);opacity:0}to{transform:none;opacity:1}}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
.cobrand .row{flex-wrap:nowrap;gap:12px}.cobrand .firm{white-space:nowrap;font-size:13px}.cobrand .ndlogo{display:block;width:min(170px,42%)}.cobrand .ndlogo svg{width:100%;height:auto}
.paper .example-tag{color:var(--muted)}
.cobrand .muted,.cobrand .firm{color:#B4B8BD}.cobrand .firm{border-color:#6B7078}
.founding{margin:6px 0 0;font-size:15px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.founding .fk{font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--asphalt);color:var(--paper);padding:5px 7px;border-radius:4px}
.tier.feature .founding .fk{background:var(--yellow);color:var(--asphalt)}
