/* Euclea Safaris — responsive public typography scale
   2026-10-07
   Loaded after page-specific public CSS so heading sizes remain consistent
   across homepage, market pages and all public inner pages. */

:root{
  --eu-type-display:clamp(36px,3.65vw,56px);
  --eu-type-display-compact:clamp(32px,3.15vw,48px);
  --eu-type-section:clamp(27px,2.35vw,37px);
  --eu-type-section-compact:clamp(24px,2vw,32px);
  --eu-type-editorial:clamp(23px,1.85vw,30px);
}

/* Primary page / hero titles. */
.tc-hero-copy h1,
.market-hero-copy h1,
.public-hero-small h1,
.tours-page-hero h1,
.collection-page-hero-copy h1,
.package-hero-copy h1,
.destination-hero-copy h1,
.experience-page-scope .experience-hero-copy h1,
.destination-catalog-hero h1,
.hotel-catalog-hero h1,
.hotel-hero-content h1,
.blog-index-hero h1,
.experience-catalog-hero h1,
.enquiry-intro h1,
.public-form-copy h1,
.contact-hero h1,
.contact-hero-compact h1,
.gallery-intro-section h1,
.legal-hero h1,
.pay-online-copy h1,
.quote-share-head h1,
.start-here-hero h1,
.wildlife-hero h1,
.wildlife-detail-copy h1,
.eu-about-hero h1,
.error404-copy h1,
.wishlist-hero h1{
  font-size:var(--eu-type-display);
  line-height:1.05;
  letter-spacing:-.03em;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

/* Smaller page-title contexts such as account/auth/thank-you views. */
.client-auth-card h1,
.client-account-head h1,
.enquiry-thankyou-card h1,
.quote-share-error h1,
.client-quote-document-head h1{
  font-size:var(--eu-type-display-compact);
  line-height:1.08;
  letter-spacing:-.025em;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

/* Main section headings across the public website. */
.section-heading h2,
.home-intro h2,
.experience-grid>div:first-child h2,
.departures-copy h2,
.cta-section h2,
.market-section-heading h2,
.market-cta h2,
.market-planning-head h2,
.package-section-heading h2,
.package-list-heading h2,
.package-related-heading h2,
.destination-section-heading h2,
.experience-page-scope .experience-section-heading h2,
.destination-landing-copy-heading h2,
.destination-catalog-cta h2,
.blog-index-planning h2,
.experience-catalog-toolbar-copy h2,
.collection-editorial-heading h2,
.contact-section-heading h2,
.contact-form-heading h2,
.contact-map-copy h2,
.contact-final-cta h2,
.start-here-section-head h2,
.start-here-next h2,
.wildlife-results-heading h2,
.wildlife-section-heading h2,
.wildlife-planning-cta h2,
.wildlife-editorial h2,
.eu-about-prose h2,
.eu-about-section-head h2,
.eu-about-responsible h2,
.eu-about-faq-heading h2,
.eu-about-cta h2,
.hotel-section-heading h2,
.hotel-final-cta h2,
.destination-enquiry-head h2,
.experience-catalog-editorial-heading h2,
.experience-catalog-cta h2,
.contact-page-compact .contact-section-heading h2,
.contact-page-compact .contact-form-heading h2,
.contact-map-section-compact .contact-map-header h2{
  font-size:var(--eu-type-section);
  line-height:1.12;
  letter-spacing:-.022em;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

/* Experience collection accordions — intentionally calmer than page heroes. */
.experience-page-scope .experience-accordion-heading-copy > strong{
  font-size:clamp(26px,2.05vw,34px);
  line-height:1.12;
  letter-spacing:-.018em;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

/* Long-form / editorial subheadings. */
.collection-editorial-prose h2,
.contact-editorial-prose h2,
.legal-prose h2,
.start-here-copy h2,
.experience-page-scope .experience-prose h2,
.blog-article-prose h2,
.hotel-property-description .hotel-rich-copy h2{
  font-size:var(--eu-type-editorial);
  line-height:1.18;
  letter-spacing:-.015em;
  text-wrap:balance;
}

.collection-editorial-prose h3,
.contact-editorial-prose h3,
.experience-page-scope .experience-prose h3,
.blog-article-prose h3,
.hotel-property-description .hotel-rich-copy h3{
  font-size:clamp(20px,1.45vw,25px);
  line-height:1.22;
}

/* Compact component headings that previously approached full section-title scale. */
.hotel-room-title-row h3,
.hotel-property-description-heading h3,
.hotel-booking-dialog-property h2,
.blog-index-card.is-lead h2,
.pay-online-card h2,
.pay-online-help h2{
  font-size:var(--eu-type-section-compact);
  line-height:1.16;
  letter-spacing:-.012em;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

/* A few oversized feature headings that are not covered by the shared section classes. */
.cross-border-feature h3,
.destination-showcase-copy h3,
.eu-about-platform-card h3{
  font-size:clamp(23px,1.85vw,30px);
  line-height:1.16;
}

.testimonial-section blockquote{
  font-size:clamp(26px,2.45vw,34px);
  line-height:1.32;
}

/* Tablet: reduce display hierarchy before columns start stacking. */
@media(max-width:980px){
  :root{
    --eu-type-display:clamp(34px,5.2vw,46px);
    --eu-type-display-compact:clamp(30px,4.7vw,40px);
    --eu-type-section:clamp(26px,3.8vw,34px);
    --eu-type-section-compact:clamp(23px,3.2vw,30px);
    --eu-type-editorial:clamp(22px,3vw,28px);
  }

  .experience-page-scope .experience-accordion-heading-copy > strong{
    font-size:clamp(25px,3.6vw,32px);
  }
}

/* Phones: keep headings readable without taking over the viewport. */
@media(max-width:620px){
  :root{
    --eu-type-display:clamp(30px,8.2vw,38px);
    --eu-type-display-compact:clamp(27px,7.4vw,34px);
    --eu-type-section:clamp(23px,6.3vw,29px);
    --eu-type-section-compact:clamp(21px,5.7vw,27px);
    --eu-type-editorial:clamp(21px,5.4vw,26px);
  }

  .experience-page-scope .experience-accordion-heading-copy > strong{
    font-size:clamp(23px,6.1vw,28px);
    line-height:1.15;
  }

  .experience-page-scope .experience-accordion-heading-copy > small{
    font-size:11px;
    line-height:1.55;
  }

  .cross-border-feature h3,
  .destination-showcase-copy h3,
  .eu-about-platform-card h3{
    font-size:23px;
  }

  .testimonial-section blockquote{
    font-size:26px;
  }
}

@media(max-width:420px){
  :root{
    --eu-type-display:clamp(28px,8vw,34px);
    --eu-type-display-compact:clamp(26px,7.5vw,31px);
    --eu-type-section:clamp(22px,6.4vw,27px);
    --eu-type-editorial:clamp(20px,5.8vw,25px);
  }

  .experience-page-scope .experience-accordion-heading-copy > strong{
    font-size:clamp(22px,6.5vw,26px);
  }
}

/* Site-wide heading weight: apply after all page-specific typography rules.
   This stylesheet is shared by the homepage, market pages and inner pages.
   Keep externally embedded Trustindex widget typography unmodified. */
body :is(h1, h2, h3, h4, h5, h6, [role="heading"]):not(.ti-widget *):not(.trustindex-widget *) {
  font-weight: 600 !important;
}