/*
  Invarity — shared stylesheet for the legal pages
  (terms.html, privacy.html, refund.html).

  Tokens, reset, nav, buttons and footer are copied from contact.html so
  these pages render identically to the rest of the site. index.html and
  contact.html still embed their own CSS; if that is ever extracted, this
  file's first three blocks are the ones to dedupe.
*/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400;1,6..72,500&display=swap');

:root{
  --bg-app:#0A0D11; --bg-surface:#11151B; --bg-surface-2:#161B23; --bg-surface-hover:#1B212B;
  --border:rgba(255,255,255,0.06); --border-strong:rgba(255,255,255,0.10); --border-focus:rgba(93,202,165,0.6);
  --text-primary:rgba(255,255,255,0.92); --text-secondary:rgba(255,255,255,0.62); --text-tertiary:rgba(255,255,255,0.38); --text-quaternary:rgba(255,255,255,0.22);
  --accent:#5DCAA5; --accent-hover:#6EDDB5; --accent-dim:rgba(93,202,165,0.14);
  --warning:#F2A93C; --warning-dim:rgba(242,169,60,0.14);
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; --font-mono:'JetBrains Mono',ui-monospace,monospace; --font-display:'Newsreader',Georgia,serif;
  --r-sm:4px; --r-md:6px; --r-lg:8px; --r-xl:12px; --r-pill:999px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:84px;}
body{background:var(--bg-app);color:var(--text-primary);font-family:var(--font-sans);font-size:14px;line-height:1.5;letter-spacing:-0.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;display:flex;flex-direction:column;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
svg{flex-shrink:0;}
::selection{background:rgba(93,202,165,0.24);}
a:focus-visible,button:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px;border-radius:var(--r-sm);}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--r-md);font-size:13px;font-weight:500;background:var(--bg-surface);border:1px solid var(--border);color:var(--text-primary);transition:background .12s,border-color .12s;white-space:nowrap;}
.btn:hover{background:var(--bg-surface-hover);border-color:var(--border-strong);}
.btn--ghost{background:transparent;border-color:transparent;color:var(--text-secondary);}
.btn--ghost:hover{background:var(--bg-surface);color:var(--text-primary);}
.btn--sm{padding:4px 9px;font-size:12px;}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(10,13,17,0.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border);}
.nav__inner{max-width:1080px;margin:0 auto;padding:0 32px;height:62px;display:flex;align-items:center;}
.nav__brand{display:inline-flex;align-items:center;gap:9px;}
.nav__word{font-family:var(--font-display);font-weight:500;font-size:21px;color:var(--text-primary);letter-spacing:-0.015em;}
.nav__logo{flex-shrink:0;}
.nav__spacer{flex:1;}

/* legal page layout: sticky contents rail + article */
.legal{flex:1;max-width:1080px;width:100%;margin:0 auto;padding:56px 32px 96px;display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;align-items:start;}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-tertiary);}
.eyebrow::before{content:'';width:20px;height:1px;background:var(--accent);}

.toc{position:sticky;top:86px;}
.toc__title{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-quaternary);margin-bottom:12px;}
.toc ol{list-style:none;display:flex;flex-direction:column;gap:2px;}
.toc a{display:block;padding:5px 10px;border-left:1px solid var(--border);font-size:12.5px;color:var(--text-tertiary);line-height:1.4;transition:color .12s,border-color .12s;}
.toc a:hover{color:var(--text-primary);border-color:var(--border-strong);}
.toc a.is-active{color:var(--accent-text,var(--accent));border-color:var(--accent);}
.toc__other{margin-top:28px;padding-top:18px;border-top:1px solid var(--border);}
.toc__other a{border-left:0;padding-left:0;}

.doc{max-width:720px;}
.doc__head{padding-bottom:28px;margin-bottom:36px;border-bottom:1px solid var(--border);}
.doc__head h1{font-size:clamp(30px,4vw,40px);line-height:1.1;letter-spacing:-0.03em;font-weight:600;margin-top:16px;}
.doc__head h1 em{font-family:var(--font-display);font-style:italic;font-weight:500;color:var(--accent);}
.doc__meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-family:var(--font-mono);font-size:11.5px;color:var(--text-tertiary);}
.doc__meta span b{color:var(--text-secondary);font-weight:500;}
.doc__lede{font-size:15px;color:var(--text-secondary);line-height:1.65;margin-top:16px;}

.doc section{margin-bottom:40px;scroll-margin-top:84px;}
.doc h2{font-size:18px;font-weight:600;letter-spacing:-0.02em;margin-bottom:12px;display:flex;gap:12px;align-items:baseline;}
.doc h2 .n{font-family:var(--font-mono);font-size:11.5px;color:var(--text-quaternary);font-weight:500;letter-spacing:0.04em;}
.doc h3{font-size:14px;font-weight:600;margin:18px 0 8px;color:var(--text-primary);}
.doc p{font-size:14px;line-height:1.7;color:var(--text-secondary);margin-bottom:12px;}
.doc p strong{color:var(--text-primary);font-weight:600;}
.doc ul,.doc ol{margin:0 0 14px 20px;color:var(--text-secondary);}
.doc li{font-size:14px;line-height:1.65;margin-bottom:6px;padding-left:2px;}
.doc li::marker{color:var(--text-quaternary);}
.doc a{color:var(--accent);border-bottom:1px solid rgba(93,202,165,0.3);transition:border-color .12s;}
.doc a:hover{border-color:var(--accent);}
.doc code{font-family:var(--font-mono);font-size:12px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);padding:1px 5px;color:var(--text-primary);}

/* callouts */
.callout{border:1px solid var(--border);border-left:2px solid var(--accent);background:var(--bg-surface);border-radius:var(--r-lg);padding:14px 16px;margin:16px 0 20px;}
.callout p{margin:0;font-size:13.5px;}
.callout--warn{border-left-color:var(--warning);}
.callout__t{font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-tertiary);margin-bottom:6px;}
.callout--warn .callout__t{color:var(--warning);}

/* definition table */
.dt{width:100%;border-collapse:collapse;margin:8px 0 18px;font-size:13.5px;}
.dt th,.dt td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--border);line-height:1.55;}
.dt th{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-quaternary);font-weight:500;}
.dt td{color:var(--text-secondary);}
.dt td:first-child{color:var(--text-primary);font-weight:500;white-space:nowrap;}

/* placeholders the company must fill before publishing */
.todo{background:var(--warning-dim);color:var(--warning);border-radius:var(--r-sm);padding:0 5px;font-family:var(--font-mono);font-size:12px;}

/* footer */
.footer{border-top:1px solid var(--border);padding:28px 0;}
.footer__inner{max-width:1080px;margin:0 auto;padding:0 32px;display:flex;flex-direction:column;gap:14px;}
.footer__row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-start;}
.footer__legal{display:flex;gap:18px;flex-wrap:wrap;}
.footer__legal a{font-size:12.5px;color:var(--text-secondary);transition:color .12s;}
.footer__legal a:hover{color:var(--text-primary);}
.footer__copy{font-size:12px;color:var(--text-tertiary);}
.footer__disclaimer{font-size:11.5px;color:var(--text-quaternary);max-width:520px;line-height:1.5;}

@media (max-width:820px){
  .legal{grid-template-columns:1fr;gap:32px;padding:40px 16px 72px;}
  .toc{position:static;}
  .toc ol{flex-direction:row;flex-wrap:wrap;gap:6px;}
  .toc a{border:1px solid var(--border);border-radius:var(--r-pill);padding:4px 10px;}
  .toc a.is-active{border-color:var(--accent);}
  .toc__other{margin-top:16px;padding-top:12px;}
  .toc__other ol{flex-direction:row;}
  .nav__inner{padding:0 16px;}
  .footer__inner{padding:0 16px;}
  .dt td:first-child{white-space:normal;}
}
