/**
 * Responsive token overrides — load after tokens.css.
 * @media widths MUST match :root --bp-chrome / --bp-shell / --bp-narrow in tokens.css.
 */

@media (width <= 1250px) {
  :root {
    --header-height: var(--header-height-mobile);
  }
}

@media (width <= 767px) {
  :root {
    --h2-size: 28px;
    --h1-size: clamp(32px, 8vw, 48px);
    --h3-size: 16px;
    --shell-gutter-double: var(--shell-gutter-mobile-double);
  }
}