/* crshdAI site. Tokens follow the app's design system (crushd/DESIGN.md 1.2-1.5): Blush, light only. */
/* Plus Jakarta Sans (SIL OFL), latin subset, one variable file for 400 to 700. Served from here so no request goes to Google. */
@font-face { font-family:'Plus Jakarta Sans'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url(fonts/plus-jakarta-sans-latin.woff2) format('woff2'); }
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --canvas:#FFF7FA; --surface:#FFFFFF; --sunken:#F7E9EF; --hairline:#EADCE2;
  --ink:#261C23; --ink-hover:#3A2C36; --muted:#74636D; --rose:#C24F78; --rose-deep:#A63F66;
  --gut:clamp(16px,5vw,72px);
  --measure:680px;
  --ease:cubic-bezier(.23,1,.32,1);
}
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; color-scheme:light; }
body { background:var(--canvas); color:var(--ink); font-family:'Plus Jakarta Sans',system-ui,sans-serif;
  font-size:16px; line-height:1.5; overflow-x:hidden; }
a { color:var(--rose-deep); }
img, svg { display:block; max-width:100%; }
::selection { background:color-mix(in srgb, var(--rose) 20%, transparent); color:var(--ink); }
:focus-visible { outline:2px solid var(--rose); outline-offset:3px; border-radius:8px; }

/* nav: glass bar, content scrolls under it */
.nav { position:sticky; top:0; z-index:10; display:flex; align-items:center; gap:4px;
  padding:12px var(--gut); background:rgba(255,247,250,.88);
  -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4);
  border-bottom:.5px solid transparent; transition:border-color .16s var(--ease); }
.nav.scrolled { border-bottom-color:var(--hairline); }
/* the heart lockup from marketing/brand (BRAND.md: marketing logo) */
.nav .wordmark { display:flex; align-items:center; min-height:40px; margin-right:auto; }
.nav .wordmark img { width:auto; height:24px; }
.nav a.link { display:inline-flex; align-items:center; min-height:40px; padding:0 12px; font-size:14px; font-weight:600;
  color:var(--muted); text-decoration:none; border-radius:999px; transition:color .12s var(--ease); }
.nav a.link:hover { color:var(--ink); }

/* primary button: solid Ink, white text, full radius */
.btn { display:inline-flex; align-items:center; gap:8px; min-height:48px; padding:0 24px;
  background:var(--ink); color:#fff; border-radius:999px; text-decoration:none;
  font-size:15px; font-weight:600; transition:transform .12s var(--ease), background-color .12s var(--ease); }
.btn:hover { background:var(--ink-hover); }
.btn:active { transform:scale(.97); }
.btn svg { width:18px; height:18px; flex:none; }
.btn.small { min-height:40px; padding:0 16px; font-size:14px; margin-left:8px; }
/* secondary button: Surface with a hairline, Ink text */
.btn.quiet { background:var(--surface); color:var(--ink); box-shadow:inset 0 0 0 1px var(--hairline); }
.btn.quiet:hover { background:var(--sunken); }

/* footer */
footer { border-top:.5px solid var(--hairline); padding:32px var(--gut) 40px; font-size:13px; color:var(--muted); }
footer .row { display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center; }
footer .row + .row { margin-top:16px; }
footer a { color:var(--muted); text-decoration:none; transition:color .12s var(--ease); }
footer a:hover { color:var(--ink); }
footer .made { margin-right:auto; }

/* legal pages */
.doc { max-width:var(--measure); margin:0 auto; padding:48px var(--gut) 96px; }
.doc h1 { font-size:clamp(30px,5vw,40px); line-height:1.15; letter-spacing:-.02em; font-weight:700; }
.doc .updated { margin-top:8px; font-size:13px; color:var(--muted); }
.doc .intro { margin-top:20px; font-size:17px; color:var(--muted); }
.doc h2 { margin-top:48px; font-size:20px; line-height:1.3; letter-spacing:-.01em; font-weight:700; }
.doc p, .doc ul, .doc ol { margin-top:12px; }
.doc ul, .doc ol { padding-left:24px; }
.doc li + li { margin-top:8px; }
.doc .box { margin-top:20px; background:var(--surface); border:.5px solid var(--hairline); border-radius:16px; padding:20px; }
.doc .box p:first-child { margin-top:0; }
.doc code { font-size:.92em; }

@media (max-width:640px) {
  .nav a.link { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
