/* Pourcision — shared styles for static legal/pricing pages.
   Mirrors the "Quiet Roast" design tokens from src/shared/theme.js.
   Self-hosted Pourcision Grotesk; same-origin only (CSP-safe). */

@font-face{font-family:'Pourcision Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url('/fonts/PourcisionGrotesk-Variable.woff2?v=3') format('woff2')}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* Cream (light) is the brand default — same as the app; dark follows the OS scheme. */
:root{
  --bg:#F1EFEA;--bg2:#E8E5DF;--card-solid:#F9F8F4;
  --ink:#171510;--stone:#4C473F;--muted:#635F55;
  --line:rgba(23,21,16,0.16);--line-soft:rgba(23,21,16,0.08);
  --card:#F9F8F4;--float:#FCFBF8;
  --accent:#4893FD;--accent2:#2A5CBE;--on-accent:#171510;
}
@media(prefers-color-scheme:dark){
  :root{
    --bg:#171510;--bg2:#1C1A14;--card-solid:#201D16;
    --ink:#F2EFE9;--stone:#C0BEB6;--muted:#97948B;
    --line:rgba(242,239,233,0.13);--line-soft:rgba(242,239,233,0.07);
    --card:#1D1B15;--float:#211E17;
    --accent:#4893FD;--accent2:#8ABAFD;--on-accent:#171510;
  }
}

html{-webkit-text-size-adjust:100%}
body{
  font-family:'Pourcision Grotesk',ui-sans-serif,system-ui,-apple-system,sans-serif;
  background-color:var(--bg);color:var(--ink);min-height:100vh;line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  background-image:radial-gradient(90% 60% at 50% -10%, rgba(242,239,233,0.035) 0%, transparent 60%);
  background-repeat:no-repeat;background-attachment:fixed;
}
::selection{background:rgba(72,147,253,0.30)}

.wrap{max-width:760px;margin:0 auto;padding:0 22px}

/* Header */
header.site{padding:30px 0 8px}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:inline-flex;align-items:center;text-decoration:none}
.brand img{height:26px;width:auto;display:block}
.brand .word{font-weight:500;font-size:21px;letter-spacing:-0.02em;text-transform:lowercase;color:var(--ink)}
.toapp{font-size:13px;color:var(--stone);text-decoration:none;border:1px solid var(--line);
  border-radius:999px;padding:7px 15px;transition:border-color .2s,color .2s;white-space:nowrap}
.toapp:hover{border-color:var(--accent);color:var(--ink)}

/* Document card */
main{padding:24px 0 56px}
.doc{background:var(--card);
  border:1px solid var(--line);border-radius:20px;padding:40px 38px}
@media(max-width:560px){.doc{padding:28px 22px;border-radius:16px}}

.eyebrow{font-size:11px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--muted);margin-bottom:12px}
h1{font-size:34px;font-weight:600;line-height:1.12;letter-spacing:-0.02em;margin-bottom:8px;text-wrap:balance}
@media(max-width:560px){h1{font-size:27px}}
.updated{font-size:13px;color:var(--muted);margin-bottom:30px}
.doc h2{font-size:19px;font-weight:600;letter-spacing:-0.01em;margin:30px 0 10px;color:var(--ink)}
.doc h2:first-of-type{margin-top:8px}
.doc p,.doc li{font-size:15px;color:var(--stone)}
.doc p{margin-bottom:14px}
.doc strong{color:var(--ink);font-weight:600}
.doc a{color:var(--accent2);text-decoration:none;border-bottom:1px solid rgba(72,147,253,0.4)}
.doc a:hover{border-bottom-color:var(--accent2)}
.doc ul,.doc ol{margin:0 0 16px 20px}
.doc li{margin-bottom:8px}
.lead{font-size:16px;color:var(--ink)}

/* Pricing-specific */
.price-card{text-align:center;border:1px solid var(--line);border-radius:18px;padding:34px 28px;margin:8px 0 26px;
  background:var(--card-solid)}
.price-card .tier{font-size:12px;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent2);margin-bottom:12px}
.price-card .amount{font-size:46px;font-weight:600;letter-spacing:-0.02em;line-height:1}
.price-card .amount small{font-size:18px;color:var(--muted);font-weight:400}
.price-card .term{font-size:14px;color:var(--stone);margin-top:8px}
.feats{list-style:none;margin:22px 0 0;text-align:left;max-width:340px;margin-left:auto;margin-right:auto}
.feats li{position:relative;padding-left:28px;margin-bottom:11px;font-size:15px;color:var(--stone)}
.feats li::before{content:'';position:absolute;left:0;top:8px;width:14px;height:14px;border-radius:50%;
  background:var(--accent)}
.cta{display:inline-block;margin-top:8px;background:var(--accent);color:var(--on-accent);text-decoration:none;border:none;
  border-radius:12px;padding:15px 30px;font-weight:600;font-size:14px;letter-spacing:0.04em;transition:transform .2s}
.cta:hover{transform:translateY(-1px)}
.note{font-size:13px;color:var(--muted);margin-top:18px}

/* Footer */
footer.site{border-top:1px solid var(--line-soft);padding:26px 0 48px}
footer.site .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;justify-content:center;text-align:center}
footer.site a{font-size:13px;color:var(--stone);text-decoration:none}
footer.site a:hover{color:var(--ink)}
footer.site .sep{color:var(--muted);font-size:13px}
footer.site .copy{flex-basis:100%;text-align:center;font-size:12px;color:var(--muted);margin-top:10px}