/*
 * Glow Lab design tokens. MUST match inc/design-tokens.php (Session 2).
 * Sources: Elementor kit 9 custom_colors, Ohio ACF typo, Playwright computed.
 */

@font-face {
  font-family: "chopglow";
  src: url("../fonts/Chopard-Regular.woff2") format("woff2"),
       url("../fonts/Chopard-Regular.woff") format("woff");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "chop regular";
  src: url("../fonts/Chopard-Regular.woff2") format("woff2"),
       url("../fonts/Chopard-Regular.woff") format("woff");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "merriweather";
  src: url("../fonts/Merriweather-Light.woff2") format("woff2"),
       url("../fonts/Merriweather-Light.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --gl-color-green: #0f3d33;
  --gl-color-green-soft: #0f3d33e8;
  --gl-color-ink: #113d34;
  --gl-color-cream: #f7eacd;
  --gl-color-grey-btn: #a3a3a3;
  --gl-color-grey-bg: #f8f8f8;
  --gl-color-white: #ffffff;
  --gl-color-gold: #d2b068;
  --gl-color-green-amelia: #123c34;

  --gl-font-display: "chopglow", "chop regular", "Chopard Regular", serif;
  --gl-font-body: "merriweather", "Merriweather", serif;
  --gl-font-ui: "chop regular", "chopglow", serif;

  --gl-fs-body: 16.4px;
  --gl-lh-body: 26.24px;
  --gl-fw-body: 400;

  --gl-fs-h1-d: 79.2px;
  --gl-fs-h1-m: 28.8px;
  --gl-lh-h1-d: 79.2px;
  --gl-lh-h1-m: 28.8px;
  --gl-fw-h1: 500;
  --gl-fs-h1-inner-d: 41px;
  --gl-fs-h1-inner-m: 1.75rem;

  --gl-fs-h2-d: 52.56px;
  --gl-fs-h2-m: 24.6px;
  --gl-lh-h2-d: 55.2px;
  --gl-lh-h2-m: 25.8px;
  --gl-ls-h2-d: -2.1024px;
  --gl-fw-h2: 300;

  --gl-fs-h3: 30px;
  --gl-fw-h3: 400;

  --gl-fs-h4-d: 60px;
  --gl-fs-h4-m: 28px;
  --gl-fw-h4: 300;

  --gl-fs-h5: 20px;
  --gl-fw-h5: 700;

  --gl-fs-h6: 16.4px;
  --gl-fw-h6: 700;

  --gl-fs-nav: 22.96px;
  --gl-fw-nav: 700;

  --gl-radius-btn: 24px;
  --gl-pad-container: 0 20px;
  --gl-wrapper: 1400px;
  --gl-header-wrapper: 1680px;
  --gl-bp-tablet: 1024px;
  --gl-bp-mobile: 767px;
  --gl-header-sticky-offset: 150px;
}
