/* Shared styles for the WildRush landing pages.
   Linked by index.html, privacy.html and terms.html — each page's own <style>
   comes after this file and overrides it where the page differs.

   Two things this file deliberately does NOT own:
   - The Vazirmatn @font-face rules. Those are self-hosted in
     /fonts/vazirmatn.css (OFL, see fonts/OFL.txt); everything here only
     *points* at the family, so the font keeps loading from our own origin.
   - The page chrome of index.html. Its header is fixed and transparent until
     scrolled, with a mobile drawer, and its footer is a dark three-column
     grid. The legal pages have a sticky ivory header and a one-line footer.
     They look shared but no rule survives being merged, so the legal pages'
     chrome lives in the `.doc-page` section at the bottom instead of
     pretending all three agree. */

/* ── palette ───────────────────────────────────────────────────────────── */
:root{
  --ivory:#FBF9F4;
  --linen:#F4F1E8;
  --sage:#EDF1EA;
  --sage-soft:#E4EBE2;
  --sage-deep:#D6E0D5;
  --euc:#3B7A61;
  --euc-soft:#5A9077;
  --pine:#234A3B;
  --pine-ink:#18342A;
  --honey:#E0924C;
  --honey-deep:#C2783A;
  --muted:#6A786E;
  --muted-light:rgba(255,255,255,.74);
  --line:rgba(24,52,42,.10);
  --line-soft:rgba(24,52,42,.07);
  --font-display:'Fraunces',Georgia,serif;
  --font-body:'Inter',system-ui,sans-serif;
}

/* ── reset ─────────────────────────────────────────────────────────────── */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
img,svg{display:block}
.wrap{width:100%;margin:0 auto;padding:0 26px}

/* ── brand mark + language switcher (in every header) ──────────────────── */
.brand{display:flex;align-items:center;gap:11px}
.brand .wordmark{font-family:var(--font-body);font-weight:600;font-size:20px;color:var(--pine);letter-spacing:-.01em}
.brand .wordmark .r{color:var(--honey-deep)}
.langs{display:flex;gap:2px;background:rgba(24,52,42,.05);border:1px solid var(--line-soft);border-radius:999px;padding:3px}
.langs button{font-family:var(--font-body);font-weight:500;font-size:12.5px;border:none;background:transparent;color:var(--muted);padding:5px 12px;border-radius:999px;cursor:pointer;transition:.2s}
.langs button.active{background:var(--euc);color:#fff}

/* RTL, the part that is true on every page. "WildRush" stays in the Latin
   body face — it is a Latin wordmark, not text to be typeset in Persian. */
[dir="rtl"] .langs button{font-family:'Vazirmatn',Tahoma,sans-serif}
[dir="rtl"] .brand .wordmark{font-family:var(--font-body)}

/* ── the legal documents: privacy.html and terms.html ──────────────────── */
/* Both carry class="doc-page" on <body>. These two pages really were
   copy-pasted — the blocks differed only in which of `.back`, `.doc h3` and
   `.doc .warn` each happened to declare, all three of which are harmless on
   the page that has no such element. */
.doc-page{font-family:var(--font-body);color:var(--pine-ink);background:var(--ivory);line-height:1.8;-webkit-font-smoothing:antialiased}
.doc-page a{color:var(--euc);text-decoration:none}
.doc-page a:hover{text-decoration:underline}
.doc-page .wrap{max-width:820px}

.doc-page header{position:sticky;top:0;z-index:50;background:rgba(251,249,244,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft)}
.doc-page .nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 26px;max-width:820px;margin:0 auto}
.doc-page .back{font-size:14px;font-weight:500;color:var(--muted)}
.doc-page .back:hover{color:var(--pine);text-decoration:none}

.doc-page .hero{background:var(--sage);padding:64px 0 48px;border-bottom:1px solid var(--line-soft)}
.doc-page .hero .eyebrow{font-family:var(--font-body);font-weight:500;font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--honey-deep);margin-bottom:14px}
.doc-page .hero h1{font-family:var(--font-display);font-weight:500;font-size:clamp(32px,5vw,46px);letter-spacing:-.02em;color:var(--pine-ink)}
.doc-page .hero .updated{margin-top:14px;font-size:14.5px;color:var(--muted)}

.doc-page main{padding:54px 0 72px}
.doc-page .doc h2{font-family:var(--font-display);font-weight:500;font-size:23px;color:var(--pine);margin:38px 0 12px;letter-spacing:-.01em}
.doc-page .doc h2:first-child{margin-top:0}
.doc-page .doc h3{font-family:var(--font-body);font-weight:600;font-size:16.5px;color:var(--pine-ink);margin:22px 0 4px}
.doc-page .doc p{font-size:16px;color:#33433B;margin-bottom:16px;line-height:1.85}
.doc-page .doc .intro{font-size:17px;color:var(--muted)}
.doc-page .doc .warn{background:rgba(224,146,76,.10);border:1px solid rgba(224,146,76,.28);border-radius:12px;padding:16px 20px;margin-bottom:16px;color:#8A5A28;font-weight:500}
.doc-page .doc strong{color:var(--pine);font-weight:600}

.doc-page footer{border-top:1px solid var(--line);padding:34px 0;background:var(--ivory)}
.doc-page .foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--muted)}
.doc-page .foot a{color:var(--muted)}
.doc-page .foot a:hover{color:var(--pine)}
.doc-page .foot .links{display:flex;gap:20px}

[dir="rtl"] .doc-page,
[dir="rtl"] .doc-page .doc p,[dir="rtl"] .doc-page .doc .intro,[dir="rtl"] .doc-page .doc .warn,
[dir="rtl"] .doc-page .doc h3,[dir="rtl"] .doc-page .hero .updated,[dir="rtl"] .doc-page .hero .eyebrow,
[dir="rtl"] .doc-page .back,[dir="rtl"] .doc-page .foot{font-family:'Vazirmatn',Tahoma,sans-serif}
[dir="rtl"] .doc-page .doc h2,[dir="rtl"] .doc-page .hero h1{font-family:'Vazirmatn',Tahoma,sans-serif;font-weight:700;letter-spacing:0}
[dir="rtl"] .doc-page .doc p{line-height:2.05}

@media(max-width:560px){.doc-page .back span{display:none}}
