/* Shared type scale for standalone LowStyleLife pages.
   The existing font families and component layout remain page-specific. */

:is(body, #lsl-typography-priority) {
  font-size: 17px !important;
  line-height: 1.65 !important;
}

:is(body, #lsl-typography-priority) :is(h1, h2, h3, h4) {
  font-weight: 600 !important;
}

:is(body, #lsl-typography-priority) h1 {
  font-size: 32px !important;
  line-height: 1.2 !important;
}

:is(body, #lsl-typography-priority) h2 {
  font-size: 26px !important;
  line-height: 1.25 !important;
}

:is(body, #lsl-typography-priority) h3 {
  font-size: 22px !important;
  line-height: 1.3 !important;
}

:is(body, #lsl-typography-priority) h4 {
  font-size: 19px !important;
  line-height: 1.35 !important;
}

:is(body, #lsl-typography-priority) :is(p, li, dt, dd, blockquote):not(.lsl-eyebrow):not(.lsl-label):not(.eyebrow):not(.label):not([class*="eyebrow"]):not([class*="label"]) {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

:is(body, #lsl-typography-priority) :is(.path-grid p, .hub-feature-grid p, .hub-link-list em, .recipe-hub-card-copy p, .newsfeed p, .latest-grid p, .photo-slider p, .encyclopedia-category-grid p, .encyclopedia-related p, .tool-category-grid p, .materials-card p, .nutrition-table-card p, .legacy-index-card small, .card-recipes span, .home-new-grid em) {
  font-size: 15px !important;
  line-height: 1.55 !important;
}

:is(body, #lsl-typography-priority) :is(.hub-feature-grid strong, .hub-link-list strong, .path-grid h3, .newsfeed strong, .latest-grid strong, .photo-slider strong, .encyclopedia-preview-grid h2, .encyclopedia-category-grid h3, .encyclopedia-related strong, .tool-category-grid h3, .jona-collection-card strong, .recipe-hub-card h3, .nutrition-table-card h3, .materials-card h3, .legacy-index-card span, .card-recipes strong, .home-new-grid strong) {
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}

:is(body, #lsl-typography-priority) :is(.lsl-site-nav > a, .lsl-site-nav > details > summary, .lsl-nav-panel a, .lsl-nav-panel details > summary, .lsl-menu-toggle > summary, .lsl-site-actions a) {
  font-size: 15px !important;
  line-height: 1.4 !important;
}

:is(body, #lsl-typography-priority) :is(button, [role="button"], .button, .btn) {
  font-size: 15px !important;
}

:is(body, #lsl-typography-priority) :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) :is(h2, h3) {
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}

:is(body, #lsl-typography-priority) :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) p {
  font-size: 15px !important;
  line-height: 1.55 !important;
}

:is(body, #lsl-typography-priority) :is(figcaption, .caption, .image-caption) {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

@media (min-width: 821px) and (max-width: 1100px) {
  :is(body, #lsl-typography-priority) h1 { font-size: 30px !important; }
  :is(body, #lsl-typography-priority) h2 { font-size: 24px !important; }
  :is(body, #lsl-typography-priority) h3 { font-size: 21px !important; }
  :is(body, #lsl-typography-priority) h4 { font-size: 18px !important; }
}

@media (max-width: 820px) {
  :is(body, #lsl-typography-priority) {
    font-size: 16px !important;
    line-height: 1.6 !important;
  }

  :is(body, #lsl-typography-priority) h1 { font-size: 27px !important; }
  :is(body, #lsl-typography-priority) h2 { font-size: 23px !important; }
  :is(body, #lsl-typography-priority) h3 { font-size: 20px !important; }
  :is(body, #lsl-typography-priority) h4 { font-size: 18px !important; }

  :is(body, #lsl-typography-priority) :is(p, li, dt, dd, blockquote):not(.lsl-eyebrow):not(.lsl-label):not(.eyebrow):not(.label):not([class*="eyebrow"]):not([class*="label"]) {
    font-size: 16px !important;
    line-height: 1.6 !important;
  }

  :is(body, #lsl-typography-priority) :is(.path-grid p, .hub-feature-grid p, .hub-link-list em, .recipe-hub-card-copy p, .newsfeed p, .latest-grid p, .photo-slider p, .encyclopedia-category-grid p, .encyclopedia-related p, .tool-category-grid p, .materials-card p, .nutrition-table-card p, .legacy-index-card small, .card-recipes span, .home-new-grid em) {
    font-size: 15px !important;
  }

  :is(body, #lsl-typography-priority) :is(.hub-feature-grid strong, .hub-link-list strong, .path-grid h3, .newsfeed strong, .latest-grid strong, .photo-slider strong, .encyclopedia-preview-grid h2, .encyclopedia-category-grid h3, .encyclopedia-related strong, .tool-category-grid h3, .jona-collection-card strong, .recipe-hub-card h3, .nutrition-table-card h3, .materials-card h3, .legacy-index-card span, .card-recipes strong, .home-new-grid strong) {
    font-size: 18px !important;
  }

  :is(body, #lsl-typography-priority) :is(.lsl-site-nav > a, .lsl-site-nav > details > summary, .lsl-nav-panel a, .lsl-nav-panel details > summary, .lsl-menu-toggle > summary, .lsl-site-actions a, button, [role="button"], .button, .btn) {
    font-size: 16px !important;
  }

  :is(body, #lsl-typography-priority) :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) :is(h2, h3) {
    font-size: 18px !important;
  }

  :is(body, #lsl-typography-priority) :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) p {
    font-size: 15px !important;
  }
}
