/* Design tokens extracted from the original Divi build.
   Every component consumes these — no hardcoded values downstream. */

:root {
  /* ---- Color ---- */
  --c-text: #636265;
  --c-text-strong: #2a2a2a;
  --c-heading: #2a2a2a;
  --c-muted: #b3b3b3;
  --c-accent: #ffb400;
  --c-accent-dark: #e0a000;
  --c-secondary: #7ebec5;
  --c-dark: #2a2a2a;
  --c-gray: #636265;
  --c-surface: #ffffff;
  --c-surface-alt: #f7f7f7;
  --c-surface-tint: rgba(0, 0, 0, 0.06);
  --c-border: #d8d8d8;
  --c-on-dark: #ffffff;

  /* ---- Typography ---- */
  --f-heading: "Roboto", Helvetica, Arial, Lucida, sans-serif;
  --f-display: "Rubik", Helvetica, Arial, Lucida, sans-serif;
  --f-body: "Open Sans", Helvetica, Arial, Lucida, sans-serif;

  --fs-body: 14px;
  --fs-lead: 15px;
  --fs-md: 17px;
  --fs-nav: 18px;
  --fs-h4: 18px;
  --fs-h3: 22px;
  --fs-h2: 26px;
  --fs-h1: 30px;
  --fs-display: 42px;
  --fs-display-lg: 49px;
  --fs-hero-title: 60px;
  --fs-hero-content: 40px;

  --lh-tight: 1.1;
  --lh-heading: 1.2;
  --lh-snug: 1.4;
  --lh-body: 1.6;
  --lh-loose: 1.8;

  /* ---- Spacing ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 27px;
  --sp-7: 40px;
  --sp-8: 54px;
  --sp-9: 80px;

  /* ---- Layout ---- */
  --container: 1080px;
  --container-wide: 1280px;
  --gutter: 5.5%;
  --topbar-h: 31px;
  --header-h: 60px;
  --header-h-fixed: 54px;

  /* ---- Effects ---- */
  --radius: 0px;
  --shadow-section: 0 10px 105px 0 rgba(0, 0, 0, 0.12);
  --shadow-card: 0 2px 18px rgba(0, 0, 0, 0.08);
  --transition: 300ms ease;
  --z-header: 100;
  --z-float: 90;
}

/* Divi breakpoints, taken from the original media queries:
   981px (desktop -> tablet) and 767px (tablet -> phone). */