/* Public typography: one role-based scale, loaded after layout and navigation.
   Bundled fonts are static: Editorial 400 (roman/italic), Manrope 400 and 500. */
@font-face {
  font-family: Editorial; src: url('./fonts/editorial-regular.woff') format('woff');
  font-style: normal; font-weight: 400; font-display: swap;
}
@font-face {
  font-family: Editorial; src: url('./fonts/editorial-italic.woff') format('woff');
  font-style: italic; font-weight: 400; font-display: swap;
}
@font-face {
  font-family: Manrope; src: url('./fonts/sans-regular.woff') format('woff');
  font-style: normal; font-weight: 400; font-display: swap;
}
@font-face {
  font-family: Manrope; src: url('./fonts/sans-medium.woff') format('woff');
  font-style: normal; font-weight: 500; font-display: swap;
}
:root {
  --type-display: clamp(4.25rem, 3.7rem + 2vw, 5.5rem);
  --type-page: clamp(2.625rem, 2.1rem + 2.1vw, 4rem);
  --type-section: clamp(2.375rem, 1.9rem + 1.8vw, 3.5rem);
  --type-subtitle: clamp(1.875rem, 1.65rem + .8vw, 2.25rem);
  --type-card: clamp(1.625rem, 1.5rem + .5vw, 1.875rem);
  --type-small-heading: clamp(1.375rem, 1.25rem + .5vw, 1.75rem);
  --type-lead: 1.125rem;
  --type-body: 1rem;
  --type-reading: 1.125rem;
  --type-question: clamp(1rem, .95rem + .2vw, 1.125rem);
  --type-ui: .875rem;
  --type-caption: .8125rem;
  --type-label: .75rem;
  --leading-heading: 1.14;
  --leading-body: 1.75;
  --leading-ui: 1.5;
}
body { font-size: var(--type-body); line-height: var(--leading-body); font-synthesis-weight: none; }
main :is(h1,h2,h3) { font-weight: 400; text-wrap: balance; overflow-wrap: break-word; }
main strong, main b { font-weight: 500; }

/* Page titles share a hierarchy; the short home greeting is deliberately a display. */
.detail-hero h1, .clinic h1, .clinic-overview h1, .contact h1, .blog-heading h1,
.blog-article h1, .faq-page-heading h1, .legal-page h1 {
  font-family: var(--serif); font-size: var(--type-page);
  line-height: var(--leading-heading); letter-spacing: -.025em;
}
.welcome h1 {
  font-family: var(--serif); font-size: var(--type-display); font-style: italic;
  line-height: 1.04; letter-spacing: -.035em;
}
.welcome .welcome-title {
  font-family: var(--serif); font-size: var(--type-subtitle);
  line-height: 1.2; letter-spacing: -.02em;
}
.section-heading h2, .about-copy h2, .philosophy h2, .reviews-heading h2,
.closing h2, .detail-content h2, .detail-faq h2, .clinic-note h2, .clinic-visit h2, .clinic-overview h2, .about-approach h2, .location-heading h2 {
  font-family: var(--serif); font-size: var(--type-section);
  line-height: var(--leading-heading); letter-spacing: -.025em;
}
.treatment h3, .blog-card h2, .team-card h3, .detail-grid h3,
.values h3, .blog-empty p:first-child, .clinic-space h2, .clinic-space h3 {
  font-family: var(--serif); font-size: var(--type-card);
  line-height: 1.25; letter-spacing: -.015em;
}
.contact-copy #hours-title {
  font-family: var(--serif); font-size: var(--type-small-heading);
  line-height: 1.3; letter-spacing: -.01em;
}
/* Form headings describe a task, so use the same sans-serif as their controls. */
.contact-form.contact-form-compact .contact-form-title {
  font-family: var(--sans); font-size: var(--type-small-heading);
  font-weight: 500; line-height: 1.35; letter-spacing: 0;
}

/* Main copy stays readable, including cards and narrow-screen descriptions. */
.welcome p, .welcome .intro, .section-heading > p, .treatment p,
.about-copy p, .team-card p, .values p, .steps p, .detail-hero p,
.detail-grid p, .clinic-note p, .contact-copy > p, .contact-copy .address,
.location-heading p, .blog-card p, .faq-page .faq-answer, .legal-content,
.closing p, .questions details p, .clinic-space figcaption p, .clinic-arrival p,
.clinic-visit-intro, .clinic-visit-steps p {
  font-family: var(--sans); font-size: var(--type-body);
  font-weight: 400; line-height: var(--leading-body); letter-spacing: 0;
}
.detail-hero .detail-lead, .about-copy .large-copy, .blog-heading > p,
.faq-page-heading > p, .article-intro {
  font-family: var(--sans); font-size: var(--type-lead);
  font-weight: 400; line-height: var(--leading-body); letter-spacing: 0;
}
.article-body { font-size: var(--type-reading); line-height: 1.8; }
.article-body p { font-size: inherit; line-height: inherit; }
.review-slide blockquote, .reviews-ready .review-slide blockquote {
  font-family: var(--sans); font-size: clamp(1.0625rem, 1rem + .2vw, 1.1875rem);
  font-weight: 400; line-height: var(--leading-body); letter-spacing: 0;
}
/* Question labels are controls, not large editorial section headings. */
.questions summary, .faq-page summary h2 {
  font-family: var(--sans); font-size: var(--type-question);
  font-weight: 500; line-height: 1.55; letter-spacing: 0;
}
/* Editable wrappers inherit the question text; only the plus icon is enlarged/rotated. */
.questions summary > span:not([aria-hidden="true"]) { font: inherit; transform: none; }

/* Labels and secondary information use a small, consistent and legible scale. */
main .eyebrow, .welcome .eyebrow, .about-copy .eyebrow,
.detail-hero .eyebrow, .closing .eyebrow {
  font-family: var(--sans); font-size: var(--type-label); font-weight: 500;
  line-height: 1.6; letter-spacing: .1em;
}
.breadcrumb, .blog-card time, .blog-article time, .reading-source,
.reviews-disclosure, .review-source-link, .review-slide figcaption .review-source {
  font-family: var(--sans); font-size: var(--type-caption);
  font-weight: 400; line-height: 1.6; letter-spacing: 0;
}
.text-link, .treatment .text-link, .button, .header .button, .welcome .button,
.mobile-actions a, .review-slide figcaption, .review-slide figcaption .review-author {
  font-family: var(--sans); font-size: var(--type-ui);
  font-weight: 500; line-height: var(--leading-ui); letter-spacing: 0;
}
.contact-email, .contact-whatsapp { font-size: var(--type-body); line-height: 1.6; }
.contact-number {
  font-family: var(--serif); font-size: clamp(2.25rem, 2rem + 1vw, 3rem);
  font-weight: 400; line-height: 1.3; letter-spacing: -.02em;
  font-variant-numeric: lining-nums tabular-nums;
}
.site-header #navigation .nav-link, .site-header #navigation .nav-trigger,
.site-header #navigation .services-link {
  font-size: var(--type-ui); line-height: var(--leading-ui);
}
.site-header #navigation .services-link[aria-current=page] { font-weight: 500; }
.header-phone { font-size: var(--type-ui); line-height: var(--leading-ui); }

/* Keep 16px controls to avoid focus zoom on iPhones; the floated label remains 12px. */
.contact-form.contact-form-compact .contact-fields .floating-control,
.contact-form.contact-form-compact .contact-fields .floating-label { font-size: var(--type-body); line-height: 1.5; }
.contact-form-compact .form-consent-copy label, .contact-form-compact .form-privacy,
.contact-form-compact .form-status {
  font-size: var(--type-caption); font-weight: 400; line-height: 1.6;
}
.contact-form-compact .form-message-note, .closing-with-form .contact-form-compact .form-message-note,
.contact-form-compact .form-local-note, .closing-with-form .contact-form-compact .form-local-note {
  font-size: var(--type-label); line-height: 1.65;
}
body > footer .footer-links, body > footer .footer-top > div:first-child p,
.clinic-bottom p, .clinic-gallery button > span, .team-card .team-role {
  font-family: var(--sans); font-size: var(--type-ui); line-height: 1.75;
}
body > footer .footer-links > span {
  font-size: var(--type-label); font-weight: 500; line-height: 1.6; letter-spacing: .1em;
}
body > footer .footer-bottom { font-size: var(--type-caption); line-height: 1.6; }
@media(max-width:1100px) {
  .site-header #navigation .nav-link, .site-header #navigation .nav-trigger,
  .site-header #navigation .services-link { font-size: var(--type-body); line-height: 1.5; }
}
