/*
 * Typography system — load after the page-specific styles.
 * It affects content areas only. Navigation, controls, forms, cookie dialog,
 * buttons and the footer deliberately retain their existing sizing.
 */

:root {
  --type-display: clamp(2.75rem, 5.2vw, 5.125rem);
  --type-h1: clamp(2.5rem, 4.6vw, 4.625rem);
  --type-h2: clamp(2rem, 3.45vw, 3.5rem);
  --type-h3: clamp(1.3rem, 1.75vw, 1.625rem);
  --type-lead: clamp(1.0625rem, 1.25vw, 1.1875rem);
  --type-body: clamp(1rem, 1.45vw, 1.125rem);
  --leading-display: 1;
  --leading-heading: 1.12;
  --leading-body: 1.72;
  --space-section: clamp(4.5rem, 7vw, 7rem);
  --space-heading: clamp(1.125rem, 2vw, 1.5rem);
  --space-copy: clamp(0.875rem, 1.3vw, 1.125rem);
}

/* Shared content rhythm. Restricting these selectors keeps cards and controls intact. */
:where(.service-main, .location-main, .contact-main, .blog-main, .article-main) :is(h1, h2, h3) {
  text-wrap: balance;
}

:where(.service-main, .location-main, .contact-main, .blog-main, .article-main) :is(p, li) {
  line-height: var(--leading-body);
}

.service-hero h1,
.contact-page-hero h1,
.location-hero h1,
.article-hero h1,
.blog-hero h1,
.hero h1 {
  font-size: var(--type-h1);
  line-height: var(--leading-display);
}

.service-hero-lead,
.blog-hero-copy > p:last-of-type,
.article-lead,
.contact-page-hero .service-hero-lead,
.hero-lead {
  font-size: var(--type-lead);
  line-height: 1.65;
}

/* Section headings used on service, local, contact and blog pages. */
.service-section-heading h2,
.service-scope-heading h2,
.service-deliverables-copy > h2,
.service-preparation-heading h2,
.service-contact h2,
.location-planning-copy h2,
.location-coverage-copy h2,
.contact-direct-heading h2,
.contact-form-intro h2,
.contact-area-copy h2,
.blog-featured > header h2,
.blog-library > header h2,
.blog-safety h2,
.article-body h2,
.article-faq h2,
.article-related h2,
.article-cta h2,
.pricing-main h2,
.guide-main h2,
.case-studies-main h2,
.case-study-main h2,
.about-main h2,
main.guide-main .guide-section-heading h2,
main.case-studies-main .service-contact h2,
main.case-study-main .article-body h2,
main.case-study-main .service-contact h2 {
  margin-bottom: var(--space-heading);
  font-size: var(--type-h2);
  line-height: var(--leading-heading);
}

/* Homepage: use the same scale without reaching into its header, cards or CTA controls. */
.identity-copy h2,
.section-heading h2,
.evidence-heading h2,
.contact-heading h2,
.region-copy h2,
.business-card h2,
.faq h2,
.articles-heading h2 {
  margin-bottom: var(--space-heading);
  font-size: var(--type-h2);
  line-height: var(--leading-heading);
}

.section-lead,
.section-heading > p:last-child,
.evidence-heading > p:last-child,
.region-copy > p:not(.eyebrow),
.business-card > p:not(.eyebrow),
.contact-heading > p:last-child,
.articles-heading p,
.faq details p {
  font-size: var(--type-body);
  line-height: var(--leading-body);
}

.case-panel h3,
.process-list h3,
.standards-grid h3,
.article-list strong {
  font-size: var(--type-h3);
  line-height: 1.25;
}

.case-panel > p,
.process-list p,
.standards-grid p {
  font-size: 0.9375rem;
  line-height: 1.62;
}

/* Long-form articles require the most deliberate reading rhythm. */
.article-body > section {
  padding-bottom: clamp(2.75rem, 5vw, 3.75rem);
}

.article-body > section + section {
  padding-top: clamp(2.75rem, 5vw, 3.75rem);
}

.article-body p {
  font-size: var(--type-body);
  line-height: 1.78;
}

main.case-study-main .article-body p,
.pricing-intro-text p,
.about-story-copy p {
  font-size: var(--type-body);
  line-height: 1.78;
}

.article-body p + p {
  margin-top: var(--space-copy);
}

.article-body h2 + p,
.article-body h3 + p {
  margin-top: 0;
}

.article-body h3 {
  margin: clamp(1.75rem, 3vw, 2.25rem) 0 0.75rem;
  font-size: var(--type-h3);
  line-height: 1.25;
}

.article-body :is(ul, ol) {
  margin-top: clamp(1.25rem, 2vw, 1.75rem);
}

.article-faq summary {
  font-size: clamp(1.125rem, 1.7vw, 1.3125rem);
  line-height: 1.35;
}

/* Supporting copy across landing pages gets one comfortable, consistent measure. */
.service-section-heading > p:last-child,
.service-scope-heading > p:last-child,
.service-deliverables-copy > p:not(.eyebrow),
.service-preparation-heading > p:not(.eyebrow),
.service-intro-copy > p,
.service-visual-copy > p:not(.eyebrow),
.location-planning-copy > p:not(.eyebrow),
.location-coverage-copy > p:not(.eyebrow),
.contact-direct-heading > p:last-child,
.contact-form-intro > p,
.contact-area-copy > p:not(.eyebrow),
.blog-safety > div > p:last-child {
  font-size: var(--type-body);
  line-height: var(--leading-body);
}

/* Cards preserve their hierarchy but receive a shared heading/copy relationship. */
:is(.service-card-grid, .service-related-grid, .location-service-grid, .blog-featured, .blog-library) h3 {
  margin-bottom: 0.625rem;
  font-size: var(--type-h3);
  line-height: 1.2;
}

:is(.service-card-grid, .service-related-grid, .location-service-grid, .blog-featured, .blog-library) p {
  font-size: 0.9375rem;
  line-height: 1.62;
}

/* Explanatory text in special-purpose cards should not drop to 13px. */
.pricing-factor-grid p,
.pricing-main .pricing-intro-text aside p,
.pricing-model-list p,
.pricing-scenario-grid p,
.pricing-main .pricing-steps ol p,
.pricing-main .service-faq-list p,
main.guide-main .guide-card-grid p,
.case-reading-principles p,
.case-index-card-copy p,
.about-standard-grid p,
.about-main .service-faq-list p {
  font-size: 0.9375rem;
  line-height: 1.62;
}

/* Content sections share a rhythm; hero sections keep their deliberately distinct padding. */
:is(.service-main, .location-main, .contact-main, .blog-main, .article-main) .section-pad:not(.service-hero):not(.contact-page-hero):not(.location-hero):not(.blog-hero):not(.article-hero),
.identity-section.section-pad,
.case-section.section-pad,
.evidence-section.section-pad,
.process-section.section-pad,
.knowledge-section.section-pad,
.contact-section.section-pad {
  padding-top: var(--space-section);
  padding-bottom: var(--space-section);
}

@media (max-width: 760px) {
  :root {
    --space-section: clamp(3.75rem, 13vw, 4.75rem);
    --space-heading: 1rem;
  }

  .service-hero h1,
  .contact-page-hero h1,
  .location-hero h1,
  .article-hero h1,
  .blog-hero h1,
  .hero h1 {
    font-size: clamp(2.35rem, 10.4vw, 3.35rem);
    line-height: 1.03;
  }

  .article-body p,
  main.case-study-main .article-body p,
  .pricing-intro-text p,
  .about-story-copy p,
  .service-section-heading > p:last-child,
  .service-scope-heading > p:last-child,
  .service-deliverables-copy > p:not(.eyebrow),
  .service-preparation-heading > p:not(.eyebrow),
  .service-intro-copy > p,
  .service-visual-copy > p:not(.eyebrow),
  .location-planning-copy > p:not(.eyebrow),
  .location-coverage-copy > p:not(.eyebrow),
  .contact-direct-heading > p:last-child,
  .contact-form-intro > p,
  .contact-area-copy > p:not(.eyebrow),
  .blog-safety > div > p:last-child {
    font-size: 1rem;
    line-height: 1.7;
  }

  .section-lead,
  .section-heading > p:last-child,
  .evidence-heading > p:last-child,
  .region-copy > p:not(.eyebrow),
  .business-card > p:not(.eyebrow),
  .contact-heading > p:last-child,
  .articles-heading p,
  .faq details p {
    font-size: 1rem;
    line-height: 1.7;
  }

  .article-body > section,
  .article-body > section + section {
    padding-bottom: 2.75rem;
    padding-top: 2.75rem;
  }

  .article-body > section:first-child {
    padding-top: 0;
  }

  :is(.service-card-grid, .service-related-grid, .location-service-grid, .blog-featured, .blog-library) h3 {
    font-size: 1.375rem;
  }

  .pricing-factor-grid p,
  .pricing-main .pricing-intro-text aside p,
  .pricing-model-list p,
  .pricing-scenario-grid p,
  .pricing-main .pricing-steps ol p,
  .pricing-main .service-faq-list p,
  main.guide-main .guide-card-grid p,
  .case-reading-principles p,
  .case-index-card-copy p,
  .about-standard-grid p,
  .about-main .service-faq-list p {
    font-size: 1rem;
    line-height: 1.62;
  }
}