/* ============================================================================
   Legal pages (Privacy / Terms) — self-contained styles.
   Loaded ONLY by privacy.html (not by the landing), so it can safely style
   bare elements without colliding with styles.css. Reuses the landing's brand
   tokens and self-hosted WOFF2 fonts (no Google Fonts).
   ============================================================================ */

/* Self-hosted brand fonts — the SAME WOFF2 files the landing uses (fonts/).
   Only the weights/subset this page needs: Oswald 500/700, JetBrains Mono 400,
   Latin. No third-party font request. */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/oswald-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/oswald-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrainsmono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/inter-tight-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/inter-tight-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  /* Brand tokens — mirror styles.css (:root --c-black / --c-red). */
  --c-black:#2B0F2A;              /* brand plum: header, footer, headings */
  --c-red:#EA3829;                /* brand red accent */
  /* Legal-page-only tokens (kept with the page, not in the landing :root). */
  --paper:#FFFFFF;                /* white reading area */
  --ink:#26121D;                  /* long-form body text */
  --muted:#7A6670;                /* dates / meta */
  --line:rgba(38,18,29,.14);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Inter Tight',Arial,sans-serif;
  font-size:17px; line-height:1.72; -webkit-font-smoothing:antialiased;
}
a{color:var(--c-red)}
a:focus-visible,button:focus-visible{outline:2px solid var(--c-red);outline-offset:3px}

/* Top bar */
.topbar{background:var(--c-black);color:#F2EBE3}
.topbar .wrap{max-width:1100px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;text-decoration:none;color:inherit}
/* Brand name — SAME font as the landing logo (.logo in styles.css:
   Oswald 700, tight -0.02em tracking). No separate font for the legal pages. */
.brand .name{font-family:'Oswald',sans-serif;font-weight:700;letter-spacing:-0.02em;text-transform:uppercase;font-size:16px}
.back{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#E9DED4;text-decoration:none;opacity:.85}
.back:hover{opacity:1;color:#fff}

/* Head */
.head{max-width:760px;margin:0 auto;padding:66px 24px 6px}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--c-red);margin:0 0 16px}
.head h1{position:relative;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:-0.02em;line-height:.96;font-size:clamp(44px,9vw,82px);margin:0;color:var(--c-black)}
/* Brand safety pin standing upright in the left margin, so the H1 stays flush
   with the body text column (LEGAL / 01 / paragraphs). The PNG is pre-rotated
   vertical + trimmed, sized to the cap height of the first line. */
.title-pin{position:absolute;right:100%;top:clamp(6px,1.3vw,13px);height:clamp(32px,6.6vw,59px);width:auto;margin-right:.32em}
.updated{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.12em;color:var(--muted);margin:20px 0 0}

/* Content */
main{max-width:760px;margin:0 auto;padding:22px 24px 8px}
.intro{font-size:18px;color:#3a2530;border-top:2px solid var(--ink);padding-top:26px;margin:26px 0 6px}
section.clause{padding:34px 0;border-top:1px solid var(--line)}
.clause .num{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.12em;color:var(--c-red)}
.clause h2{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:-0.02em;font-size:22px;color:var(--c-black);margin:8px 0 15px}
.clause p{margin:0 0 14px}
.clause ul{margin:0 0 14px;padding:0;list-style:none}
.clause li{position:relative;padding-left:22px;margin:0 0 12px}
.clause li::before{content:"";position:absolute;left:0;top:12px;width:9px;height:2px;background:var(--c-red)}
.clause a{text-decoration:underline;text-underline-offset:3px}
strong{color:var(--c-black);font-weight:500}
.ph{background:rgba(226,58,46,.12);border-bottom:1px dashed var(--c-red);padding:0 3px;border-radius:2px}

/* Disclaimer callout (Terms) — plum block with a red edge; text stays legible. */
.callout{background:var(--c-black);color:#EFE6DD;padding:22px 24px;margin:20px 0;border-left:3px solid var(--c-red)}
.callout p{margin:0 0 12px}
.callout p:last-child{margin-bottom:0}
.callout strong{color:#fff}

/* Footer */
footer{background:var(--c-black);color:#E9DED4;margin-top:44px}
footer .wrap{max-width:1100px;margin:0 auto;padding:34px 24px;display:flex;flex-wrap:wrap;gap:18px 28px;align-items:center;justify-content:space-between}
footer .copy{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.8}
footer nav a{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:13px;color:#E9DED4;text-decoration:none;margin-left:24px}
footer nav a:first-child{margin-left:0}
footer nav a:hover{color:#fff}
footer nav a[aria-current="page"]{color:var(--c-red)}

/* Narrow screens: no room in the left margin — stand the pin ABOVE the title,
   left-aligned with the text, instead of letting it run off the edge. */
@media (max-width:820px){
  .title-pin{position:static;display:block;margin:0 0 .4em 0;height:clamp(30px,7.5vw,46px)}
}
@media (max-width:560px){
  body{font-size:16px}
  .head{padding-top:46px}
  footer .wrap{flex-direction:column;align-items:flex-start}
  footer nav a{margin:0 22px 0 0}
}
@media (prefers-reduced-motion:no-preference){
  .fade{opacity:0;transform:translateY(10px);animation:rise .6s ease forwards}
}
@keyframes rise{to{opacity:1;transform:none}}