@import url("https://fonts.googleapis.com/css2?family=Karantina:wght@700&family=Miriam+Libre:wght@400;700&family=IBM+Plex+Sans+Hebrew:wght@400;500;600&display=swap&subset=hebrew");

:root {
  
  --paper: #EFE6D8;
  --paper-2: #E4D8C3;
  --ink: #14171B;
  --ink-2: #1D2126;
  --line: rgba(20, 23, 27, .16);
  --line-strong: rgba(20, 23, 27, .32);
  --blue: #1F4FA3;
  --blue-2: #5BC8F5;
  --red: #C3552A;
  --red-hi: #D97142;

  
  --livery-green: #4E7E3E;
  --livery-yellow: #E0A422;

  
  --paper-on-ink: rgba(244, 241, 234, .92);
  --line-on-ink: rgba(244, 241, 234, .18);

  
  --font-display: "Karantina", "Arial Narrow", sans-serif;
  --font-meta: "Miriam Libre", ui-monospace, monospace;
  --font-body: "IBM Plex Sans Hebrew", "Segoe UI", sans-serif;

  
  --sp-1: .25rem;
  --sp-2: .5rem;
  --sp-3: .75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4.5rem;
  --sp-9: 7rem;
  --sp-10: 10rem;

  
  --r-sm: 4px;
  --r-md: 10px;
  --r-lg: 18px;

  
  --container: 1320px;
  --container-narrow: 880px;
  --gutter: clamp(20px, 4vw, 64px);

  
  --z-base: 1;
  --z-watermark: 2;
  --z-content: 10;
  --z-header: 210; 
  --z-mobile-bar: 110;
  --z-dial: 120;
  --z-menu: 200;
  --z-lightbox: 300;

  
  --scene-hue: 214; 
}

@property --scene-hue {
  syntax: "<number>";
  inherits: true;
  initial-value: 214;
}


:root {
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --t-fast: .2s;
  --t-med: .45s;
  --t-slow: .9s;
}


:root {
  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}