/*
  Compact site-wide typography layer.
  Loaded after page-level styles so one semantic scale governs the production
  site without changing its layout, colour palette, imagery or behaviour.
*/

body {
  font-size: var(--font-body);
  line-height: var(--line-height-body);
  letter-spacing: normal;
}

h1,
h2,
h3,
h4,
p {
  overflow-wrap: break-word;
}

h1,
.inner-hero h1,
.profile-hero h1,
.article-page h1,
.legal-page h1,
.contact-hero h1,
.patient-stories-hero h1,
.story-detail-hero h1,
.concept-page h1,
.preview-intro h1,
html[data-concept] h1,
.not-found h1 {
  max-width: 18ch;
  font-size: var(--font-h1);
  font-weight: 800;
  line-height: var(--line-height-title);
  letter-spacing: -0.025em;
  text-wrap: balance;
}

h2,
.section-heading h2,
.about h2,
.care-feature h2,
.pharmacy h2,
.final-cta h2,
.split-content h2,
.internal-heading h2,
.catalog-toolbar h2,
.fact-band + * h2,
.internal-cta h2,
.certificate-heading h2,
.branch-page-grid h2,
.article-page__content h2,
.legal-page h2,
.vacancy-list > article > h2,
.story-library__heading h2,
.story-detail-hero h2,
.story-chapter h2,
.story-result h2,
.story-next h2,
.story-format__layout > div > h2,
.story-publication-note h2,
.contact-locations__heading h2,
.contact-section-heading h2,
.contact-visit h2,
.concept-card h2,
.preview-card h2,
html[data-concept] .section-heading h2,
html[data-concept] .about h2,
html[data-concept] .care-feature h2,
html[data-concept] .pharmacy h2,
html[data-concept] .final-cta h2 {
  max-width: 24ch;
  font-size: var(--font-h2);
  font-weight: 800;
  line-height: var(--line-height-heading);
  letter-spacing: -0.02em;
  text-wrap: balance;
}

h3,
.team-card h3,
.feature-grid h3,
.steps b,
.clinic-card h3,
.article-card h3,
.person-card h2,
.catalog-card h2,
.shop-grid h2,
.article-directory-card h2,
.branch-mini-grid h3,
.patient-story-card__body h3,
.patient-story-preview__body h3,
.patient-case__title h3,
.story-path b,
.contact-branch-card h2,
.contact-branch-card h3 {
  max-width: 30ch;
  font-size: var(--font-h3);
  font-weight: 750;
  line-height: var(--line-height-heading);
  letter-spacing: -0.015em;
  text-wrap: balance;
}

h4,
.patient-case__content > h4,
.accordion summary,
.booking-steps__grid h3,
.review-card h3,
.contact-visit__steps b {
  font-size: var(--font-h4);
  font-weight: 700;
  line-height: var(--line-height-heading);
  letter-spacing: -0.01em;
}

.service-card h3,
.service-card--photo h3 {
  max-width: 24ch;
  font-size: 1.375rem;
  line-height: var(--line-height-title);
  letter-spacing: -0.02em;
}

.patient-story-card__body h3,
.patient-story-preview__body h3 {
  max-width: 24ch;
  font-size: var(--font-feature-card-title);
  line-height: var(--line-height-title);
  letter-spacing: -0.02em;
}

html[data-concept] .service-card h3 {
  max-width: 24ch;
  font-size: 1.375rem;
  line-height: var(--line-height-title);
  letter-spacing: -0.02em;
}

html[data-concept] .clinic-card h3 {
  font-size: var(--font-h3);
  line-height: var(--line-height-heading);
}

p,
li,
.prose,
.article-page__content,
.legal-page > p,
.legal-page li {
  font-size: var(--font-body);
  line-height: var(--line-height-body);
  letter-spacing: normal;
}

.hero__lead,
.inner-hero__content > p,
.article-page > header > p,
.contact-hero__lead,
.story-chapter__lead,
.story-result > p {
  max-width: 65ch;
  font-size: var(--font-lead);
  line-height: var(--line-height-body);
  letter-spacing: normal;
}

.hero__facts b,
.about__facts b,
.fact-band b,
.patient-case__metric strong,
.story-detail-hero__visual strong,
.story-result h2 {
  font-size: var(--font-stat);
  line-height: var(--line-height-title);
  letter-spacing: -0.02em;
}

.eyebrow,
.kicker,
.service-card__index,
.service-card--photo .service-card__index,
.label,
.pill,
.team-card__tag,
.person-card__body small,
.catalog-card__index,
.article-card > span,
.article-card div > span,
.article-directory-card small,
.certificate-card__meta small,
.breadcrumbs,
.story-detail-aside > span,
.story-detail-aside > div small,
.patient-story-card__body small,
.patient-story-preview__body > small,
.patient-case__title small,
.contact-channel small,
.contact-branch-card small {
  font-size: var(--font-xs);
  line-height: var(--line-height-ui);
  letter-spacing: 0.04em;
}

.main-nav,
.mobile-nav,
.button,
.filter-button,
.text-button,
.header-phone b,
.clinic-card__footer,
.article-card a,
.patient-story-card__body a,
.story-detail-aside nav a,
.contact-branch-tab,
.contact-branch-card__details a,
.mobile-action-bar > * {
  font-size: var(--font-ui);
  line-height: var(--line-height-ui);
  letter-spacing: normal;
}

.service-card p,
.team-card p,
.person-card p,
.feature-grid p,
.catalog-card p,
.article-card p,
.article-directory-card p,
.patient-story-card__body p,
.patient-story-preview__body > p,
.patient-case__journey p,
.story-path p,
.contact-branch-card p,
.booking-steps__grid p,
.review-card p {
  font-size: var(--font-body);
  line-height: var(--line-height-body);
  letter-spacing: normal;
}

.main-nav,
.mobile-nav,
.button,
.filter-button,
.text-button,
.mobile-action-bar > * {
  font-weight: 700;
}

.service-card__copy,
.service-card--photo .service-card__copy {
  min-width: 0;
}

.service-card h3,
.service-card p,
.patient-story-card__body h3,
.patient-story-card__body p,
.patient-story-preview__body h3,
.patient-story-preview__body > p,
.clinic-card h3,
.article-card h3 {
  overflow-wrap: anywhere;
}

.modal__dialog h2,
.form-success h3 {
  font-size: var(--font-h3);
  line-height: var(--line-height-heading);
  letter-spacing: -0.015em;
}

.modal label,
.field-error,
.form-alt,
.form-note {
  font-size: var(--font-xs);
  line-height: 1.45;
  letter-spacing: normal;
}

.modal input,
.modal select,
.modal textarea {
  font-size: var(--font-body);
  line-height: 1.4;
}

.header-phone small,
.footer-bottom,
.footer-grid p,
.footer-grid a {
  font-size: var(--font-sm);
  line-height: 1.5;
  letter-spacing: normal;
}

/* Preserve graphic placeholders while preventing them from becoming display type. */
.team-card__fallback,
.person-card__image > span,
.profile-hero__image > span,
.not-found h1,
.patient-case__title > span {
  font-size: var(--font-h1);
}

/* Tablet: compact but visibly stepped hierarchy. */
@media (min-width: 768px) and (max-width: 1023px) {
  :root {
    --font-h1: clamp(2.5rem, 2.35rem + 0.4vw, 2.625rem);
    --font-h2: clamp(1.9375rem, 1.85rem + 0.25vw, 2rem);
    --font-h3: clamp(1.4375rem, 1.35rem + 0.2vw, 1.5rem);
    --font-h4: 1.1875rem;
    --font-feature-card-title: clamp(1.6875rem, 1.6rem + 0.25vw, 1.75rem);
    --font-lead: 1.0625rem;
  }
}

/* Mobile caps: never let the hierarchy become poster-like. */
@media (max-width: 767px) {
  :root {
    --font-h1: clamp(2.125rem, 2.02rem + 0.45vw, 2.25rem);
    --font-h2: 1.75rem;
    --font-h3: 1.375rem;
    --font-h4: 1.125rem;
    --font-feature-card-title: 1.5rem;
    --font-lead: 1.0625rem;
    --font-stat: 1.75rem;
  }

  .hero h1,
  .inner-hero h1,
  .profile-hero h1,
  .article-page h1,
  .legal-page h1,
  .contact-hero h1,
  .patient-stories-hero h1,
  .story-detail-hero h1,
  .concept-page h1,
  .preview-intro h1,
  html[data-concept] h1,
  .not-found h1 {
    font-size: var(--font-h1);
    line-height: var(--line-height-title);
  }

  .section-heading h2,
  .about h2,
  .care-feature h2,
  .pharmacy h2,
  .final-cta h2,
  .split-content h2,
  .internal-heading h2,
  .catalog-toolbar h2,
  .internal-cta h2,
  .certificate-heading h2,
  .branch-page-grid h2,
  .article-page__content h2,
  .legal-page h2,
  .vacancy-list > article > h2,
  .story-library__heading h2,
  .story-detail-hero h2,
  .story-chapter h2,
  .story-result h2,
  .story-next h2,
  .story-format__layout > div > h2,
  .story-publication-note h2,
  .contact-locations__heading h2,
  .contact-section-heading h2,
  .contact-visit h2,
  .concept-card h2,
  .preview-card h2,
  html[data-concept] .section-heading h2,
  html[data-concept] .about h2,
  html[data-concept] .care-feature h2,
  html[data-concept] .pharmacy h2,
  html[data-concept] .final-cta h2 {
    font-size: var(--font-h2);
    line-height: var(--line-height-heading);
  }

  .service-card h3,
  .service-card--photo h3,
  .patient-story-card__body h3,
  .patient-story-preview__body h3 {
    font-size: var(--font-feature-card-title);
  }

  html[data-concept] .service-card h3 {
    font-size: var(--font-feature-card-title);
  }

  .specialization-list article {
    grid-template-columns: 36px minmax(0, 1fr) 46px;
    gap: 12px;
    padding-inline: 0;
  }

  .specialization-list article > a {
    min-width: 0;
  }

  .hero__mobile-actions .button,
  .mobile-action-bar > * {
    font-size: var(--font-ui);
  }
}

/* The homepage network headline must keep long Russian words intact. */
.hero--network h1 {
  max-width: none;
  overflow-wrap: normal;
  word-break: normal;
}

@media (max-width: 767px) {
  .hero--network h1 {
    font-size: clamp(30px, 8.2vw, 34px);
    line-height: .98;
  }
}