/* Design tokens: the only file (with preview.css) allowed raw design values.
   Source: design_guide_lines.md, Complete token list. Change a value there first. */
:root {
  color-scheme: only light;

  --c-bg: #F5F5F3;
  --c-ink: #161616;
  --c-ink-2: #262626;
  --c-paper: #FFFFFF;
  --c-yellow: #F9C80E;
  --c-muted: #5E5E61;
  --c-muted-inv: #C9C9CC;
  --c-line: #97979A;
  --c-scrim: rgba(22, 22, 22, .72);
  --c-glass: rgba(22, 22, 22, .55);

  --f-display: "Karantina", "Karantina Fallback", "Heebo", "Arial Hebrew", Arial, sans-serif;
  --f-body: "Heebo", "Heebo Fallback", "Arial Hebrew", Arial, sans-serif;

  --fs-hero: 5.5rem;
  --fs-h2: 3.75rem;
  --fs-h3: 1.875rem;
  --fs-giant: min(16.25rem, 81.25vw);
  --fs-quote: 1.5rem;
  --fs-body: 1.0625rem;
  --fs-btn: 1.125rem;
  --fs-small: 0.875rem;

  --lh-display: .86;
  --lh-price: .9;
  --lh-solid: 1;
  --lh-display-loose: 1.1;
  --lh-quote: 1.4;
  --lh-caption: 1.4;
  --lh-body: 1.55;

  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 48px;
  --s8: 64px;
  --s9: 96px;

  --gutter: var(--s5);
  --pad-inline: max(var(--gutter), env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --day-col: 4.5ch;
  --day-w: 8.25rem;
  --day-min: 7rem;
  --safe-top: env(safe-area-inset-top, 0px);
  --screen-h: 100dvh;
  --giant-drop: -0.28;
  --giant-visible: .6;
  --max: 1120px;
  --band-tail: var(--s9);

  --measure-lead: 34ch;
  --measure-band: 30ch;
  --measure-quote: 28ch;
  --measure-text: 65ch;

  --cta-h: 56px;
  --cta-max: 440px;
  --tap: 44px;
  --logo-h: 44px;
  --icon: 22px;
  --menu-clear: calc(max(var(--s4), var(--safe-top)) + var(--tap) + var(--s2));
  --bar-h: calc(var(--cta-h) + 2 * var(--s3) + var(--safe-bottom));
  --bar-fade: var(--c-bg);

  --radius-pill: 999px;
  --radius-chip: var(--s1);

  --dur-bar: 250ms;

  --z-bar: 10;
  --z-menu-btn: 11;
  --z-skip: 12;
  --z-band-text: 1;
}

@media (min-width: 56.25em) and (min-height: 37.5em) {
  :root {
    --fs-hero: 11rem;
    --fs-h2: 6.5rem;
    --fs-h3: 2.25rem;
    --fs-giant: min(32.5rem, 81.25vw);
    --fs-quote: 1.875rem;
    --fs-body: 1.1875rem;
    --gutter: var(--s7);
  }
}