:root {
  --type-display: clamp(72px, 6.3vw, 92px);
  --type-section: clamp(52px, 5vw, 68px);
  --type-block: clamp(26px, 2vw, 30px);
  --type-intro: 18px;
  --type-body: 16px;
  --type-label: 12px;
  --type-action: 14px;
  --text-on-dark: #d0d2d4;
}

main h1 {
  color: #fff;
  font-family: Manrope, sans-serif;
  font-size: var(--type-display) !important;
  font-weight: 400;
  line-height: 1.02;
}

main h2 {
  color: var(--ink);
  font-family: Manrope, sans-serif;
  font-size: var(--type-section) !important;
  font-weight: 400;
  line-height: 1.02;
}

main h1 > br:has(+ em),
main h1 > br:has(+ span),
main h2 > br:has(+ em),
main h2 > br:has(+ span) {
  display: none;
}

main h1 > em,
main h1 > span,
main h2 > em,
main h2 > span {
  display: block;
  margin-top: .14em;
}

main h3 {
  color: var(--ink);
  font-family: Manrope, sans-serif;
  font-weight: 500;
}

.card h3,
.pillars h3,
.benefit-grid h3,
.centre-service-grid h3,
.value-grid h3,
.effortless-grid h3 {
  font-size: var(--type-block);
  line-height: 1.2;
}

.journey-steps h3,
.session-content h3,
.format-grid h3 {
  font-size: 24px;
  line-height: 1.25;
}

.journey-steps h3 {
  font-size: 25px;
  font-weight: 600;
}

.eyebrow,
.section-kicker,
.pillar-label {
  color: var(--gold);
  font-size: var(--type-label) !important;
}

.intro,
.service-hero-copy > p:not(.eyebrow),
.mission-hero-copy > p:not(.eyebrow),
.legal-hero > p:last-child {
  font-size: var(--type-intro);
  line-height: 1.65;
}

.service-copy p,
.pricing-intro > div:last-child p,
.mission-story-copy p,
.mission-life > div:last-child p,
.journey-head > p:last-child,
.service-cta > p:not(.section-kicker) {
  font-size: var(--type-body);
  line-height: 1.7;
}

.card p,
.review-grid p,
.journey-steps p,
.benefit-grid p,
.centre-service-grid p,
.value-grid p,
.effortless-grid li {
  font-size: 15px;
}

.button,
.cards .card > a,
.technology-gallery figcaption em,
.location-actions a,
.price-link,
.text-link {
  font-size: var(--type-action) !important;
}

.solutions h2,
.benefit-section h2,
.centre-services h2,
.centre-convenience h2,
.mission-signature h2,
.mission-values h2,
.pricing-hero h2,
.programme-price h2,
.effortless h2,
.booking h2,
.service-cta h2 {
  color: #fff;
}

.solutions h3,
.benefit-section h3,
.centre-services h3,
.centre-convenience h3,
.mission-signature h3,
.mission-values h3,
.programme-price h3,
.effortless h3,
.booking h3,
.service-cta h3 {
  color: #fff;
}

.solutions p,
.benefit-section p,
.centre-services p,
.centre-convenience p,
.mission-signature p,
.mission-values p,
.programme-price p,
.effortless p,
.booking > div > p:last-child,
.service-cta p {
  color: var(--text-on-dark);
}

.solutions .section-kicker,
.benefit-section .section-kicker,
.centre-services .section-kicker,
.centre-convenience .section-kicker,
.mission-signature .section-kicker,
.mission-values .section-kicker,
.programme-price .section-kicker,
.effortless .section-kicker,
.booking .section-kicker,
.service-cta .section-kicker {
  color: var(--gold);
}

@media (hover: hover) {
  .solutions .card:hover h3 {
    color: var(--dark);
  }
}

.concept-promise h3,
.concept-promise p,
.pricing-assurance h3,
.pricing-assurance p,
.price-featured h3,
.price-featured p,
.weight-offer-featured h3,
.weight-offer-featured p {
  color: var(--dark);
}

@media (max-width: 900px) {
  :root {
    --type-display: clamp(56px, 10vw, 72px);
    --type-section: clamp(42px, 7vw, 56px);
  }
}

@media (max-width: 600px) {
  :root {
    --type-display: 48px;
    --type-section: clamp(36px, 10vw, 44px);
    --type-block: 24px;
    --type-intro: 16px;
    --type-body: 15px;
  }

  .journey-steps h3,
  .session-content h3,
  .format-grid h3 {
    font-size: 22px;
  }
}