/* ===========================================================================
   00 · TOKENS
   The only file in this theme permitted to contain a hex code.
   A hex code in a Divi module or in any other partial is a defect.
   =========================================================================== */

/* ---------------------------------------------------------------------------
   Warbler Text — self-hosted. Files go in /fonts/. Set BLENN_WARBLER to true
   in functions.php once they are licensed and in place. Until then the stack
   falls through to Source Serif 4 and nothing here does harm.
   --------------------------------------------------------------------------- */
@font-face {
  font-family: "Warbler Text";
  src: url("../fonts/WarblerText-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Warbler Text";
  src: url("../fonts/WarblerText-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {

  /* === GIOVANNI LAYER =====================================================
     Collection colour system plus one property-specific value.
     Components must never reference these directly.
     ====================================================================== */
  --gv-field:          #F4EFE6;   /* Ivory Stone   · primary, 60-70% of every surface */
  --gv-linen:          #E6DDCD;   /* Linen         · secondary surface */
  --gv-walnut-light:   #B08A63;   /* Light Walnut  · rules, dividers, mattes. 2.75:1 — never type */
  --gv-brass:          #9E7F4E;   /* Antique Brass · type and rules only. 3.28:1 — never body, never a fill */
  --gv-walnut:         #5C3F2B;   /* Walnut        · body ink, selective depth. 8.33:1 */
  --gv-slate:          #1E3040;   /* River Slate   · contrast ground, booking CTA. 11.81:1 */
  --gv-slate-hover:    #2B4459;   /* River Slate hover */
  --gv-slate-deep:     #16242F;   /* River Slate deep · footer only */
  --gv-olive:          #6C7A4F;   /* Olive Leaf    · living accent, trace use only */

  /* RETIRED — do not reintroduce:
     cream #F2EDD5 · oxblood #441300 · sage #718A7F · terracotta #A85A3E · gold #BB9D63 */

  /* If the Campo exception on River Slate is declined, this single line reverts
     the whole theme to the collection standard. No component changes, and no
     contrast consequence (Soft Charcoal is 11.98:1 against Ivory Stone).
     --gv-slate: #2F2D2A;  */


  /* === SEMANTIC LAYER =====================================================
     Components reference these and only these.
     ====================================================================== */
  --surface-primary:   var(--gv-field);
  --surface-secondary: var(--gv-linen);
  --surface-contrast:  var(--gv-slate);
  --surface-footer:    var(--gv-slate-deep);

  --ink:               var(--gv-walnut);
  --ink-on-contrast:   var(--gv-field);
  --ink-display:       var(--gv-brass);        /* 24px and above, on Ivory Stone or Slate only */

  --rule:              var(--gv-walnut-light);
  --rule-accent:       var(--gv-brass);
  --matte:             var(--gv-linen);

  --cta-bg:            var(--gv-slate);
  --cta-bg-hover:      var(--gv-slate-hover);
  --cta-ink:           var(--gv-field);
  --focus:             var(--gv-slate);        /* Light Walnut fails 3:1 and cannot carry focus */
  --accent-living:     var(--gv-olive);

  /* Scrims are built from River Slate, never black. The palette has no black. */
  --scrim-hero: linear-gradient(
      to top,
      rgba(30, 48, 64, 0.55) 0%,
      rgba(30, 48, 64, 0.18) 45%,
      rgba(30, 48, 64, 0.05) 100%);
  --scrim-flat: rgba(30, 48, 64, 0.42);


  /* === TYPE ===============================================================
     Warbler Text and Aktiv Grotesk when licensed; Source Serif 4 and Inter
     until then. Swapping either is an edit to one line.
     ====================================================================== */
  --display: "Warbler Text", "Source Serif 4", Georgia, "Times New Roman", serif;
  --text:    "aktiv-grotesk", "Aktiv Grotesk", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  --fs-h1: 56px;   --ls-h1: 0.08em;  --lh-h1: 1.08;
  --fs-h2: 40px;   --ls-h2: 0.07em;  --lh-h2: 1.15;
  --fs-h3: 28px;   --ls-h3: 0.06em;  --lh-h3: 1.25;
  --fs-h4: 20px;   --ls-h4: 0.12em;  --lh-h4: 1.30;
  --fs-eyebrow: 12px;  --ls-eyebrow: 0.18em;
  --fs-lead: 21px; --lh-lead: 1.70;
  --fs-body: 17px; --lh-body: 1.75;
  --fs-caption: 14px;
  --fs-micro: 12.5px;
  --fs-btn: 13px;  --ls-btn: 0.14em;

  --measure-body: 68ch;
  --measure-lead: 60ch;
  --measure-h1:   30ch;
  --measure-h2:   40ch;


  /* === SPACING · 4px base. Only these values. ============================= */
  --sp-1: 4px;   --sp-2: 8px;    --sp-3: 12px;   --sp-4: 16px;
  --sp-5: 24px;  --sp-6: 32px;   --sp-7: 48px;   --sp-8: 64px;
  --sp-9: 96px;  --sp-10: 128px; --sp-11: 160px; --sp-12: 200px;

  --section-y:      var(--sp-11);   /* standard section, top and bottom */
  --section-y-tall: var(--sp-12);   /* statement and River Slate sections */

  --container:        1200px;
  --container-pct:    82%;
  --container-narrow: 760px;
  --container-wide:   1600px;


  /* === MOTION ============================================================= */
  --ease:       cubic-bezier(0.22, 1, 0.36, 1);
  --dur-ui:     200ms;
  --dur-reveal: 400ms;
  --dur-image:  600ms;

  /* === STRUCTURE ========================================================== */
  --radius: 0;          /* square corners everywhere. Do not change this. */
  --hairline: 1px;
  --header-h: 88px;
  --header-h-solid: 68px;
  --stickybook-h: 56px;
}

/* Tablet and phone type steps. Divi native breakpoints only. */
@media (max-width: 1200px) {
  :root {
    --fs-h1: 48px; --fs-h2: 34px;
    --section-y: var(--sp-10); --section-y-tall: var(--sp-10);
  }
}
@media (max-width: 980px) {
  :root { --section-y: var(--sp-9); --section-y-tall: var(--sp-9); }
}
@media (max-width: 767px) {
  :root {
    --fs-h1: 34px; --fs-h2: 26px; --fs-h3: 21px; --fs-h4: 17px;
    --fs-eyebrow: 11px; --fs-lead: 18px; --fs-body: 16.5px;
    --fs-caption: 13.5px; --fs-micro: 12px;
    --section-y: var(--sp-8); --section-y-tall: 88px;
    --container-pct: 88%;
  }
}
