/* Approval preview: shared readability, control, and image-fit refinements. */

html {
  text-size-adjust: 100%;
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(h1, h2, h3, h4) {
  letter-spacing: 0;
  text-wrap: balance;
}

:where(p, li, summary, .btn span, .phone-link span) {
  text-wrap: pretty;
}

:where(.btn, .phone-link) {
  min-height: 46px;
  font-size: 15px;
  line-height: 1.2;
}

.site-header nav a,
.sticky-header nav a {
  line-height: 1.25;
}

.hero-content > p:not(.kicker) {
  max-width: 62ch;
}

/* Keep each section label, headline, and supporting copy in one clear hierarchy. */
.section-heading {
  display: grid;
  grid-template-columns: minmax(150px, 0.28fr) minmax(0, 1fr);
  column-gap: clamp(32px, 4.5vw, 72px);
  row-gap: 14px;
  align-items: start;
  margin-bottom: 34px;
}

.section-heading > .kicker {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  margin: 8px 0 0;
}

.section-heading > h2 {
  grid-column: 2;
  grid-row: 1;
  max-width: 20ch;
  margin: 0;
}

.section-heading > p:not(.kicker) {
  grid-column: 2;
  grid-row: 2;
  max-width: 62ch;
  margin: 0;
}

.is-home-page:not(.epm-page) .hero-content .button-row .btn.ghost {
  min-height: 44px;
  padding-inline: 10px;
  border-color: transparent;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.is-home-page:not(.epm-page) .hero-content .button-row .btn.ghost:hover {
  border-bottom-color: var(--accent);
  background: transparent;
}

.hero-form label,
.quote-form label {
  font-size: 14px;
  line-height: 1.35;
}

.hero-form :where(input, select, textarea),
.quote-form :where(input, select, textarea) {
  font-size: 16px;
}

.form-note {
  font-size: 14px !important;
  line-height: 1.48;
}

.proof-strip p,
.info-card p,
.timeline p,
.stats-heading > p:last-child,
.split-copy > p,
.faq-list details p,
.coverage-section p,
.selector-section p,
.action-strip p,
.hero-feature p,
.contact-section p,
.site-footer p,
.site-footer a {
  font-size: max(14px, 0.875rem);
}

.info-card h3,
.timeline h3 {
  font-size: clamp(18px, 1.45vw, 22px);
}

.split-image {
  min-height: 360px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--soft);
}

.split-image img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  display: block;
  object-fit: cover;
  object-position: 50% 42%;
}

.image-band {
  background-repeat: no-repeat;
}

.band-copy > p:not(.kicker) {
  max-width: 58ch;
}

.band-points span {
  font-size: 14px;
  line-height: 1.25;
}

@media (hover: hover) and (pointer: fine) {
  :where(.info-card, .timeline article, .stats-grid > *, .proof-strip article, .split-image) {
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
  }
}

@media (max-width: 760px) {
  body {
    font-size: 16px;
  }

  .section-heading {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 24px;
  }

  .section-heading > .kicker {
    margin: 0 0 8px;
  }

  .section-heading > h2 {
    max-width: 100%;
    margin: 0 0 12px;
  }

  .section-heading > p:not(.kicker) {
    max-width: 100%;
  }

  .site-header nav a,
  .sticky-header nav a {
    font-size: 16px !important;
    line-height: 1.3;
  }

  .kicker,
  .mini-label,
  .form-kicker {
    font-size: 12.5px !important;
    line-height: 1.35;
  }

  .proof-strip strong {
    font-size: 16px;
  }

  .proof-strip p,
  .info-card p,
  .timeline p,
  .stats-heading > p:last-child,
  .stats-grid span,
  .split-copy > p,
  .tick-list span,
  .faq-list details p,
  .coverage-section p,
  .selector-section p,
  .action-strip p,
  .hero-feature p,
  .hero-proof span,
  .hero-proof small,
  .contact-section p,
  .site-footer p,
  .site-footer a {
    font-size: 14px !important;
    line-height: 1.48;
  }

  .info-card h3,
  .timeline h3 {
    font-size: 17px !important;
    line-height: 1.2;
  }

  .timeline span {
    font-size: 13px !important;
  }

  .hero-form label,
  .quote-form label {
    font-size: 14px !important;
  }

  .split-image,
  .split-image img {
    min-height: 260px;
  }

  .split-image {
    aspect-ratio: 4 / 3;
  }

  .image-band {
    min-height: 430px;
  }

  .band-points span {
    font-size: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :where(.info-card, .timeline article, .stats-grid > *, .proof-strip article, .split-image) {
    transition: none !important;
  }
}
