/* ============================================================================
   RCORP MUN — THEME TOKENS
   ============================================================================
   ⚠️  THIS IS THE ONLY FILE YOU EDIT TO RE-SKIN THE WHOLE SITE.

   THE THEME IS PROVISIONAL. It was NOT taken from the @the_rcorp_mun Instagram —
   that account is login-walled and could not be read by anyone building this.
   It is seeded from two things that ARE known and verified:

     1. assets/rmun-logo.png — "The Rcorp Mun." wordmark: a heavy, distressed,
        near-black grotesque with a red elliptical orbit and a red square period,
        set on white.
     2. #b4121b — the accent sampled from that swoosh, already used on the
        letterhead (templates/appointment-letter.html).

   So the look here is "the letterhead, on the web": white paper, black ink, one
   red. Defensible, house-consistent, and honest — but it is NOT a claim to match
   the Instagram.

   WHEN THE INSTAGRAM SCREENSHOTS ARRIVE: change the values in :root below and
   nothing else. No other file hard-codes a colour, a font, a radius or a shadow.
   See site/README.md → "Swapping the theme".
   ========================================================================== */

:root {

  /* ---- BRAND ------------------------------------------------------------ */
  /* The one red. Sampled from the swoosh in the wordmark.
     Contrast on white = 6.9:1 → passes WCAG AA for body text, and white on it
     passes too, so it is safe as both a text colour and a button fill. If you
     swap it, re-check both directions before shipping. */
  --c-accent:            #b4121b;
  --c-accent-hover:      #8d0e15;
  --c-accent-soft:       #fdf2f2;   /* accent at ~4% — tinted panel fills      */
  --c-accent-border:     #f0cfd1;   /* accent at ~20% — hairlines on tints     */

  /* ---- INK -------------------------------------------------------------- */
  --c-ink:               #14171a;   /* headings, primary text                  */
  --c-ink-2:             #333a41;   /* body copy                               */
  --c-muted:             #616a73;   /* labels, captions — 5.4:1 on white       */
  --c-muted-strong:      #4a525a;

  /* ---- PAPER ------------------------------------------------------------ */
  --c-paper:             #ffffff;
  --c-paper-2:           #f6f7f9;   /* alternating section bands               */
  --c-paper-3:           #eceef1;   /* chips, table headers                    */
  --c-line:              #dde1e6;   /* hairlines                               */
  --c-line-strong:       #c2c9d0;

  /* ---- DARK BAND (footer, ink strip) ------------------------------------ */
  /* NOTE: rmun-logo.png has a WHITE background, not transparency. Never place
     it on a dark surface — it renders as a white box. The Rcorp Enterprises
     mark is the opposite: white on transparent, so on light backgrounds it
     needs filter:brightness(0). Both quirks are handled in site.css. */
  --c-dark:              #101316;
  --c-dark-2:            #1b2026;
  --c-dark-ink:          #f3f5f7;
  --c-dark-muted:        #a7b0b9;
  --c-dark-line:         #2b3238;

  /* ---- STATE ------------------------------------------------------------ */
  --c-ok:                #0f6b39;
  --c-ok-soft:           #eef8f2;
  --c-warn:              #8a5300;
  --c-warn-soft:         #fdf6e9;
  --c-error:             #b4121b;
  --c-error-soft:        #fdf2f2;
  --c-focus:             #b4121b;   /* focus ring                              */

  /* ---- TYPE ------------------------------------------------------------- */
  /* No webfonts are loaded — the site must work with no network beyond its own
     host, and nothing here should block first paint. --font-display exists so a
     real display face (the wordmark's grotesque, once identified) can be dropped
     in with one @font-face rule and one edit. */
  --font-display: "Helvetica Neue", "Arial Black", Helvetica, Arial, sans-serif;
  --font-body:    "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif;
  --font-mono:    ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-hero:      clamp(2.25rem, 6vw, 4rem);
  --fs-h1:        clamp(1.9rem, 4.4vw, 2.85rem);
  --fs-h2:        clamp(1.45rem, 3vw, 2rem);
  --fs-h3:        clamp(1.1rem, 2vw, 1.3rem);
  --fs-lead:      clamp(1.02rem, 1.6vw, 1.2rem);
  --fs-body:      1rem;
  --fs-sm:        0.9rem;
  --fs-xs:        0.79rem;

  --lh-tight:     1.1;
  --lh-heading:   1.18;
  --lh-body:      1.62;

  --fw-normal:    400;
  --fw-medium:    600;
  --fw-bold:      700;
  --fw-black:     800;

  --ls-display:   -0.02em;   /* the wordmark is tight — headings echo it       */
  --ls-label:     0.09em;    /* eyebrow / uppercase labels                     */

  /* ---- SPACE ------------------------------------------------------------ */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.5rem;
  --sp-6:  2rem;
  --sp-7:  3rem;
  --sp-8:  4rem;
  --sp-9:  6rem;

  --section-y:   clamp(3rem, 8vw, 5.5rem);
  --container:   1120px;
  --container-narrow: 760px;
  --gutter:      clamp(1rem, 4vw, 2rem);

  /* ---- SHAPE ------------------------------------------------------------ */
  --r-sm:  4px;
  --r-md:  8px;
  --r-lg:  14px;
  --r-pill: 999px;

  --bw:        1px;
  --bw-strong: 2px;

  /* ---- DEPTH ------------------------------------------------------------ */
  --sh-sm: 0 1px 2px rgba(16, 19, 22, .06);
  --sh-md: 0 2px 8px rgba(16, 19, 22, .08);
  --sh-lg: 0 8px 28px rgba(16, 19, 22, .12);

  /* ---- MOTION ----------------------------------------------------------- */
  --t-fast: 120ms ease;
  --t-med:  220ms ease;

  /* ---- LAYOUT CONSTANTS -------------------------------------------------- */
  --header-h: 68px;
}

/* The site is deliberately light-only. The wordmark is black-on-white and has no
   transparent variant, so a dark mode would need a second logo file that does not
   exist yet. If one appears, add a [data-theme="dark"] block here — and ONLY here.
   Until then we do not honour prefers-color-scheme, because a half-done dark mode
   that shows a white logo box is worse than no dark mode. */
