/* Spec 23. The only file allowed to contain hex. Official WOFF2 files are copied
   unmodified from design/brand/fonts/ (OFL reserved name "Plex": do not subset). */
@font-face{
  font-family:"IBM Plex Sans Hebrew";
  font-style:normal;
  font-weight:200;
  font-display:swap;
  src:url("/static/fonts/IBMPlexSansHebrew-ExtraLight.woff2?v=24") format("woff2");
  unicode-range:U+0000-00FF,U+0590-05FF,U+2000-206F,U+20AA,U+FB1D-FB4F;
}
@font-face{
  font-family:"IBM Plex Sans Hebrew";
  font-style:normal;
  font-weight:300;
  font-display:swap;
  src:url("/static/fonts/IBMPlexSansHebrew-Light.woff2?v=24") format("woff2");
  unicode-range:U+0000-00FF,U+0590-05FF,U+2000-206F,U+20AA,U+FB1D-FB4F;
}
@font-face{
  font-family:"IBM Plex Sans Hebrew";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("/static/fonts/IBMPlexSansHebrew-Regular.woff2?v=24") format("woff2");
  unicode-range:U+0000-00FF,U+0590-05FF,U+2000-206F,U+20AA,U+FB1D-FB4F;
}
@font-face{
  font-family:"IBM Plex Sans Hebrew";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("/static/fonts/IBMPlexSansHebrew-Medium.woff2?v=24") format("woff2");
  unicode-range:U+0000-00FF,U+0590-05FF,U+2000-206F,U+20AA,U+FB1D-FB4F;
}

:root{
  /* palette, design-system §1 */
  --ivory:#f7f5f2;
  --surface:#fbfaf8;
  --ink:#2b2a28;
  --ink-soft:#4a4740;
  --muted:#6b675f;
  --sage:#8a9a7b;
  --sage-deep:#4d5e40;
  --sage-mist:#e3eadc;
  --champagne:#c9b48a;
  --champagne-light:#f3e8cf;
  --champagne-deep:#7a5d1e;
  --terracotta:#8a4434;
  --terracotta-bg:#f4e1dc;
  --line:#e6e1d8;

  /* type */
  --font:"IBM Plex Sans Hebrew","Arial Hebrew",Arial,sans-serif;
  --display-size:32px;
  --display-lh:1.1;
  --h1-size:32px;
  --h1-lh:1.15;
  --h2-size:24px;
  --h2-lh:1.25;
  --h3-size:24px;
  --price-size:22px;
  --price-lh:1.3;
  --body-size:16px;
  --body-lh:1.6;
  --small-size:14px;
  --small-lh:1.5;
  --caption-size:12px;

  /* spacing, 4px base */
  --s-4:4px;
  --s-8:8px;
  --s-12:12px;
  --s-16:16px;
  --s-24:24px;
  --s-32:32px;
  --s-48:48px;
  --s-64:64px;
  --s-96:96px;
  --s-128:128px;

  /* radius: 0 cards and images, 2 controls, 999 pills */
  --radius-card:0;
  --radius-control:2px;
  --radius-pill:999px;

  --focus:2px solid var(--sage-deep);

  /* breakpoints (used as documentation; media queries repeat the values) and container */
  --bp-tablet:600px;
  --bp-desktop:1024px;
  --container:1280px;
}

@media(min-width:1024px){
  :root{
    --display-size:44px;
    --h2-size:28px;
    --price-size:28px;
  }
}