/* SO Clinic typography layer. Loaded after wp.css so it wins over the generated Elementor rules,
   which set fonts per element with high specificity — hence the !important on the overrides below.
   Headings: Playfair Display. Everything else (body, navigation, buttons): Manrope. */

:root {
  --so-font-heading: "Playfair Display", Georgia, serif;
  --so-font-body: "Manrope", system-ui, -apple-system, sans-serif;
}

/* Base for the plain WordPress/WooCommerce templates (blog posts, shop, privacy, cart…),
   which otherwise fall back to Times New Roman. */
body {
  font-family: var(--so-font-body);
}
body :where(p, li, td, th, label, input, textarea, select, blockquote) {
  font-family: var(--so-font-body);
}
body :where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--so-font-heading);
  font-weight: 500;
  line-height: 1.2;
}
body :where(h1:not(.elementor-heading-title)) { font-size: clamp(36px, 4.5vw, 52px); }
body :where(h2:not(.elementor-heading-title)) { font-size: clamp(28px, 3.2vw, 36px); }
body :where(h3:not(.elementor-heading-title)) { font-size: clamp(20px, 2vw, 24px); }
body :where(h4:not(.elementor-heading-title)) { font-size: 20px; }
body :where(.entry-content p, .page-content p) {
  font-size: 18px;
  line-height: 1.6;
}
body :where(.entry-content, .page-content) {
  max-width: 72ch;
}
.woocommerce-loop-product__title { font-size: 20px !important; }
.comment-reply-title { font-size: 24px !important; }

/* Heading scale: one size per level everywhere, and one style — upright, medium weight, no forced case. */
.so-h1,
.so-h2,
.so-h3,
.elementor-post__title {
  font-weight: 500 !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
.so-h1 {
  font-family: var(--so-font-heading) !important;
  font-size: clamp(36px, 4.5vw, 52px) !important;
  line-height: 1.15 !important;
}
.so-h2 {
  font-family: var(--so-font-heading) !important;
  font-size: clamp(28px, 3.2vw, 36px) !important;
  line-height: 1.2 !important;
}
.so-h3,
.elementor-post__title {
  font-family: var(--so-font-heading) !important;
  font-size: clamp(20px, 2vw, 24px) !important;
  line-height: 1.3 !important;
}

/* Body copy: text that used to be marked up as headings, plus Elementor text-editor blocks. */
.elementor-widget-text-editor {
  font-family: var(--so-font-body) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  max-width: 70ch !important;
}
.so-body {
  font-family: var(--so-font-body) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  max-width: 70ch;
}
.so-body--center {
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 767px) {
  .so-body,
  .elementor-widget-text-editor { font-size: 17px !important; }
}

/* Small heading-widget labels that Elementor left in Roboto/Inter (footer, "see all", coupon codes). */
.elementor-element-b266628 .elementor-heading-title,
.elementor-element-caaaaf6 .elementor-heading-title,
.elementor-element-4f83ba6 .elementor-heading-title,
.elementor-element-9dbcc6b .elementor-heading-title,
.elementor-element-ea5d838 .elementor-heading-title,
.elementor-element-d6b8b59 .elementor-heading-title {
  font-family: var(--so-font-body) !important;
}
.elementor-element-35ec4a3 .elementor-heading-title {
  font-family: var(--so-font-heading) !important;
}

/* Buttons: Manrope, semibold, sentence case. */
.elementor-button,
.elementor-post__read-more,
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
input[type="submit"],
button[type="submit"] {
  font-family: var(--so-font-body) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
}

/* Navigation: Manrope throughout, including dropdowns and the mobile menu. */
.elementor-nav-menu a,
.elementor-nav-menu--dropdown a {
  font-family: var(--so-font-body) !important;
}
.elementor-nav-menu .sub-menu a,
.elementor-nav-menu--dropdown a {
  font-size: 15px !important;
}
