/* Typography only: existing layouts, imagery and motion are preserved. */
:root {
  --heading-font: DM, Arial, sans-serif;
  --type-accent-start: #edf2e5;
  --type-accent-middle: #d3dfbf;
  --type-accent-end: #bacd91;
}

h1, h2, .drive-caption {
  font-family: var(--heading-font);
  font-weight: 700;
  letter-spacing: -.055em;
  text-transform: none;
}

h1, h2 { line-height: 1.12; }
h1 em, h2 em, .drive-caption em {
  font-weight: 400;
  color: var(--type-accent-middle);
}

.hero-title h1 {
  font-size: clamp(3.5rem, 7.6vw, 7.4rem);
  line-height: 1.03;
  letter-spacing: -.06em;
  color: #f7f8f2;
  text-shadow: 0 3px 24px #06121845;
}
.hero-title h1 em {
  color: #e3ebcf;
  --type-accent-start: #f5f7ee;
  --type-accent-middle: #e3ebcf;
  --type-accent-end: #cadba6;
}
.hero-title p { font-weight: 400; letter-spacing: .01em; }

/* Fit the complete welcome message without covering the vehicle on phones. */
.home .hero-title h1 { font-size: clamp(3rem, 6.6vw, 6.25rem); }
.home .hero-title h1 em { font-size: .78em; line-height: 1.15; }
.home .drive-caption { max-width: 82%; font-size: clamp(2.5rem, 6.4vw, 6.5rem); }
.home .drive-caption em { font-size: .78em; }

h2, .intro h2, .reviews-featured h2, .contact h2 {
  font-size: clamp(2rem, 3.8vw, 4.1rem);
}
.page-hero h1 {
  font-size: clamp(3rem, 6vw, 6.3rem);
  line-height: 1.12;
  letter-spacing: -.055em;
}

.intro, .offers-section, .review-section {
  --type-accent-start: #294d42;
  --type-accent-middle: #3e5846;
  --type-accent-end: #536429;
}
.contact, .mini-cta, .language-band {
  --type-accent-start: #172622;
  --type-accent-middle: #2f442b;
  --type-accent-end: #3b4821;
}
.intro h2 em, .offers-section h2 em, .review-section h2 em,
.contact h2 em, .mini-cta h2 em, .language-band h2 em,
.licenses h2 em, .locations h2 em {
  color: var(--type-accent-middle);
}

.category-row h3, .course-row h3, .offer.referral h3,
.location-panel h3, .location-cards h3, .detail-aside h3,
.article-body[lang=de] h2, .article-body[lang=de] h3 {
  font-family: var(--heading-font);
  letter-spacing: -.035em;
  text-transform: none;
  line-height: 1.15;
}
.section-label, .hero-top {
  font-weight: 400;
  letter-spacing: .07em;
}
.brand-strip > div { font-family: var(--heading-font); letter-spacing: -.045em; }
.footer-big {
  font-family: var(--heading-font);
  font-size: clamp(2.5rem, 5.4vw, 6rem);
  font-weight: 400;
  letter-spacing: -.045em;
}

@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  h1 em, h2 em, .drive-caption em {
    background-image: linear-gradient(110deg,
      var(--type-accent-start),
      var(--type-accent-middle) 55%,
      var(--type-accent-end));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }
}

/* Keep the established Arabic typeface and its natural letter connections. */
html:is([lang=ar],[lang=ur]) h1, html:is([lang=ar],[lang=ur]) h2, html:is([lang=ar],[lang=ur]) .drive-caption,
html:is([lang=ar],[lang=ur]) .category-row h3, html:is([lang=ar],[lang=ur]) .course-row h3,
html:is([lang=ar],[lang=ur]) .offer.referral h3, html:is([lang=ar],[lang=ur]) .location-panel h3,
html:is([lang=ar],[lang=ur]) .location-cards h3, html:is([lang=ar],[lang=ur]) .detail-aside h3,
html:is([lang=ar],[lang=ur]) .footer-big {
  font-family: Arabic, Arial, sans-serif;
  letter-spacing: 0;
  line-height: 1.5;
}
html:is([lang=ar],[lang=ur]) h1 em, html:is([lang=ar],[lang=ur]) h2 em { font-weight: 400; }
html:is([lang=ar],[lang=ur]) .section-label, html:is([lang=ar],[lang=ur]) .hero-top { letter-spacing: 0; }
html:is([lang=ar],[lang=ur]) .home .hero-title h1 { font-size: clamp(3rem, 6.4vw, 7rem); }
html:is([lang=ar],[lang=ur]) .home .hero-title h1 em { font-size: .9em; }
html:is([lang=ar],[lang=ur]) .article-body[lang=de] h2,
html:is([lang=ar],[lang=ur]) .article-body[lang=de] h3 { font-family: var(--heading-font); }

@media (max-width: 700px) {
  .hero-title h1 {
    font-size: clamp(2.625rem, 13.2vw, 5.25rem);
    line-height: 1.08;
    letter-spacing: -.055em;
  }
  html[lang=tr] .hero-title h1 { font-size: clamp(2.5rem, 12.4vw, 5rem); }
  h2, .intro h2, .reviews-featured h2, .contact h2 {
    font-size: clamp(2rem, 8.4vw, 3.2rem);
  }
  .page-hero h1 { font-size: clamp(2.25rem, 10vw, 4rem); }
  .footer-big { font-size: clamp(2rem, 8.4vw, 3.2rem); }
  html:is([lang=ar],[lang=ur]) .hero-title h1 { font-size: 10.7vw; line-height: 1.5; }
  html:is([lang=ar],[lang=ur]) .intro h2, html:is([lang=ar],[lang=ur]) .reviews-featured h2,
  html:is([lang=ar],[lang=ur]) .contact h2 { font-size: 8vw; }
  html:is([lang=ar],[lang=ur]) .page-hero h1 { font-size: 10vw; }
  .home .hero-title h1 {
    font-size: clamp(2rem, 11.7vw, 4.5rem);
    max-width: 88vw;
    line-height: 1.07;
  }
  .home .drive-caption { font-size: clamp(2rem, 11.7vw, 4.5rem); }
  html[lang=tr] .home .hero-title h1 { font-size: clamp(2rem, 10.8vw, 4.5rem); }
  html:is([lang=ar],[lang=ur]) .home .hero-title h1 { font-size: 10.7vw; }
}

@media (forced-colors: active), print {
  h1 em, h2 em, .drive-caption em {
    background-image: none;
    -webkit-text-fill-color: currentColor;
  }
}