/* ============================================================
   ROSA'S BIRRIA — token sheet (the per-client re-skin surface)
   Seal Sites demo. Re-skinning a new client = edit THIS file
   (colors, fonts, shape) + menu.data.js. index.html stays put.
   ------------------------------------------------------------
   Shape rule (one system, stated): cards & photos 18px,
   interactive controls full-pill. Nothing else gets a radius.
   ============================================================ */

:root {
  /* color — warm near-black counter, one chile-red accent,
     food photos supply every other color on the page */
  --ink:        #191113;   /* page ground */
  --surface:    #241719;   /* raised cards */
  --line:       #3b2528;   /* hairlines */
  --cream:      #f7eee3;   /* primary text */
  --muted:      #c9b2a4;   /* secondary text */
  --accent:     #ef4e23;   /* chile oil, CTAs, prices, frames */
  --accent-hot: #ff6136;   /* hover state of accent controls */
  --accent-ink: #1f0d07;   /* text ON accent surfaces */
  --header-veil: rgba(25, 17, 19, 0.92);  /* sticky header over photos */
  --scrim-strong: rgba(25, 17, 19, 0.72); /* hero gradient, mid stop */
  --scrim-soft: rgba(25, 17, 19, 0.15);   /* hero gradient, top stop */

  /* type — poster display + working grotesque */
  --font-display: "Anton", "Franklin Gothic Medium", "Arial Narrow", sans-serif;
  --font-body: "Archivo", system-ui, "Segoe UI", Roboto, sans-serif;

  /* shape */
  --r-card: 18px;
  --r-pill: 999px;
  --frame: 5px;            /* the plate-frame border on photos */

  /* rhythm (4/8 scale) */
  --sp-1: 8px;
  --sp-2: 16px;
  --sp-3: 24px;
  --sp-4: 40px;
  --sp-5: 64px;
  --sp-6: 96px;

  --w-page: 1080px;
}