/* Prague winter guide — design tokens. Light only, Hebrew RTL.
   The brand's own palette and hand-made shapes, defined once. Every other landing stylesheet uses var(--token). */
@font-face{font-family:Rubik;src:url(Rubik-variable.ttf);font-weight:100 900;font-display:swap}
@font-face{font-family:Assistant;src:url(Assistant-variable.ttf);font-weight:200 800;font-display:swap}

:root {
  color-scheme: light;

  /* Colour: warm cream ground, ink type, salmon for the one action, rose and beige for the paper shapes. */
  --surface: #fff8f4;          /* page */
  --surface-raised: #fffdfb;   /* prints, panels, dialogs, inputs */
  --surface-sunken: #f8e8e8;   /* purchase panel, tips */
  --ink: #191719;              /* headlines and reading text (≥16:1 on cream) */
  --ink-muted: #65544e;        /* captions and secondary lines (≥6.8:1 on cream, ≥5.6:1 on rose) */
  --line: #ddcec7;             /* hairlines and section rules */
  --line-warm: #d8b5a7;        /* map labels, place panel, dialog edges */
  --salmon: #f69489;           /* purchase and access actions; ink text on it (≥8:1) */
  --rose: #ffd8dd;             /* highlighter, selected, hover of the action, second shape tint */
  --rose-strong: #fac7ce;      /* pressed quiet controls */
  --beige: #f5e1d5;            /* first shape tint, ticket stamp, pills */
  --accent: #7a4943;           /* eyebrows, links, numerals, focus ring (≥7.5:1 on cream) */
  --stamp: #ae726a;            /* stamp borders, dashed outlines, drawings — never text */
  --danger: #9c2323;
  --scrim: rgba(25, 23, 25, 0.44);
  --scrim-photo: rgba(25, 23, 25, 0.85);
  --gradient-instagram: linear-gradient(35deg, #e7a567, #cb607a, #92689b);

  /* Type */
  --font-display: Rubik, "Arial Hebrew", Arial, sans-serif;
  --font-sans: Assistant, "Arial Hebrew", Arial, sans-serif;
  --text-body: 18px;
  --text-small: 15px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 112px;

  /* Layout */
  --gutter: 20px;
  --page-max: 1120px;
  --measure: 760px;

  /* Radius: geometric for controls and frames */
  --radius-xs: 3px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-device: 36px;
  --radius-device-lg: 48px;
  --radius-pill: 999px;

  /* Shape: the hand-cut paper forms that give the page its character */
  --shape-blob-a: 46% 54% 41% 59% / 52% 39% 61% 48%;
  --shape-blob-b: 55% 45% 59% 41% / 39% 58% 42% 61%;
  --shape-portrait: 43% 57% 34% 66% / 38% 32% 68% 62%;
  --shape-stamp: 5px;
  --shape-oval: 45%;
  --shape-ticket: 28px 4px 28px 4px;
  --shape-pin: 50% 50% 50% 4px;
  --tilt: 2deg;

  /* Shadow: offset = pressable; the others are for things you look at */
  --shadow-offset-sm: 1px 1px 0 0 #191719;
  --shadow-offset: 3px 3px 0 0 #191719;
  --shadow-offset-lg: 5px 5px 0 0 #191719;
  --shadow-soft: 0 8px 24px 0 rgba(73, 51, 42, 0.08);
  --shadow-lift: 0 18px 40px 0 rgba(122, 73, 67, 0.15);
  --shadow-dialog: 0 20px 70px 0 rgba(25, 23, 25, 0.19);
  --shadow-device: 0 0 0 2px #9b9691, 0 0 0 4px #252323, 0 20px 40px rgba(73, 51, 42, 0.15);
  --shadow-stamp: 3px 4px 0 0 rgba(122, 73, 67, 0.07);
  --shadow-print: 0 8px 20px 0 rgba(112, 71, 61, 0.1);
  --shadow-text: 0 1px 4px rgba(0, 0, 0, 0.8);
  --shadow-paper: 12px 14px 0 0 #f2e6dc;
}
@media (min-width: 768px) { :root { --gutter: 32px; --text-body: 20px; --text-small: 16px; } }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--surface); color: var(--ink); font: 400 var(--text-body)/1.6 var(--font-sans); -webkit-font-smoothing: antialiased; }
