/* Defaults; font variables may be overridden by Customizer output. */
:root {
  --mio-font-body: "Inter", Arial, sans-serif;
  --mio-font-heading: "Inter", Arial, sans-serif;
  --mio-container-max: 1280px;
  --mio-container-gutter: 32px;
  --mio-space-section: 64px;
  --mio-space-heading: 30px;
  --mio-type-h1-size: 56px;
  --mio-type-h1-leading: 1.08;
  --mio-type-h1-tracking: -1.4px;
  --mio-type-h2-size: 30px;
  --mio-type-h2-leading: 1.25;
  --mio-type-h2-tracking: -.6px;
}
@media (min-width: 761px) and (max-width: 1100px) {
  :root { --mio-space-section: 52px; --mio-space-heading: 26px; }
}
@media (max-width: 760px) {
  :root {
    --mio-container-gutter: 16px;
    --mio-space-section: 22px;
    --mio-space-heading: 16px;
    --mio-type-h1-size: 31px;
    --mio-type-h1-leading: 1.08;
    --mio-type-h1-tracking: -.9px;
    --mio-type-h2-size: 22px;
    --mio-type-h2-leading: 1.25;
    --mio-type-h2-tracking: -.45px;
  }
}

/* Inner spacing belongs to standalone blocks, not the section flow gap. */
:root {
  --mio-space-panel: 64px;
  --mio-space-footer: 20px;
  --mio-space-hero-start: 56px;
  --mio-space-hero-end: 46px;
}
@media (min-width: 761px) and (max-width: 1100px) {
  :root {
    --mio-space-panel: 52px;
    --mio-space-hero-start: 40px;
    --mio-space-hero-end: 24px;
  }
}
@media (max-width: 760px) {
  :root {
    --mio-space-panel: 22px;
    --mio-space-footer: 16px;
    --mio-space-hero-start: 22px;
    --mio-space-hero-end: 22px;
  }
}

:root { --mio-space-offer-start: 28px; --mio-space-offer-end: 34px; }
@media (max-width: 760px) { :root { --mio-space-offer-start: 0px; --mio-space-offer-end: 0px; } }