/* A restrained foil system for the site's editorial type. Keep reading and UI text solid. */
body.quiet-luxury {
  --type-forest: #294b3e;
  --type-brass: #79572e;
  --type-muted: #586b5d;
  --type-foil-ink: linear-gradient(105deg,
    #304b40 0%, #72542d 18%, #956b32 34%, #416d60 51%,
    #72506a 67%, #8a6433 83%, #304b40 100%);
  --type-foil-light: linear-gradient(105deg,
    #fff3d3 0%, #e1b66d 18%, #fff6dd 34%, #a9d8cb 53%,
    #e5bad5 71%, #f4d493 86%, #fff3d3 100%);
}

/* A warm metallic note in navigation and section labels. */
body.quiet-luxury :is(.qh-wordmark > span, .site-header .brand > span, .journal-brand, .atlas-map-brand) {
  color: var(--type-forest);
}
body.quiet-luxury :where(.qh-eyebrow, .editorial-kicker, .atlas-section-index, .atlas-map-intro > span,
  .essentials-page .eyebrow, .essentials-page .breadcrumbs [aria-current], .wonder-eyebrow) {
  color: var(--type-brass);
}
body.quiet-luxury :is(.qh-desktop-nav a, .site-header .desktop-nav a, .journal-header nav a,
  .atlas-map-header nav a, .atlas-navigation .nav-links a):hover,
body.quiet-luxury :is(.qh-desktop-nav a, .site-header .desktop-nav a, .journal-header nav a,
  .atlas-map-header nav a, .atlas-navigation .nav-links a):focus-visible {
  color: var(--type-brass) !important;
}

/* Reading pages use rich ink and brass. These headings sit on pale surfaces. */
body.quiet-luxury.quiet-home :is(.qh-intro h2, .qh-section-head h2, .qh-feature-copy h2,
  .qh-closing h2, .field-guide h2),
body.quiet-luxury.explore-page :is(.season-heading h2, .wish-heading h2,
  .atlas-destination-heading h2, .atlas-wayfinding-v2 h2, .atlas-inspiration-title h2,
  .craft-barrel-heading h2, .atlas-essentials-copy h2, .atlas-footer-statement h2),
body.quiet-luxury.essentials-page :is(.decision-section h2,
  .search-band h2, .tools-section h2, .trust-section h2, .stage-hero h1,
  .article-header h1, .tool-header h1),
body.quiet-luxury.journal-page :is(.journal-hero h1, .chapter-heading h2, .credits-main h1),
body.quiet-luxury.atlas-map-page .atlas-map-intro h1,
body.quiet-luxury.original-explore-page :is(.hd h1, .th h1, .ph h1, .city-section .section-heading h2) {
  color: var(--type-forest);
}

/* Solid colour gives smaller titles and long form copy an unbroken reading rhythm. */
body.quiet-luxury.quiet-home :is(.qh-place-title h3, .qh-essential h3),
body.quiet-luxury.explore-page :is(.dest-body h3, .atlas-v2-place-body h3),
body.quiet-luxury.essentials-page :is(.guide-card h3, .article-section h2, .tool-card strong,
  .decision-card h3, .source-box h2),
body.quiet-luxury.journal-page .credits-grid h2 {
  color: var(--type-forest);
}
body.quiet-luxury.quiet-home :is(.qh-place-card, .qh-essential):hover h3,
body.quiet-luxury.essentials-page :is(.guide-card, .tool-card, .decision-card):hover h3,
body.quiet-luxury.explore-page .dest:hover .dest-body h3 {
  color: var(--type-brass);
}

/* Photo and dark chapters receive a luminous counterpart with a quiet shadow. */
body.quiet-luxury.quiet-home .qh-hero-copy h1,
body.quiet-luxury.explore-page .voyage-copy h1,
body.quiet-luxury.essentials-page .essentials-orientation-heading h2,
body.quiet-luxury.journal-page :is(.journal-closing h2, .editorial-transformation h2),
body.quiet-luxury.wonder-page .wonder-copy h1,
body.quiet-luxury.original-explore-page :is(.city-hero h1, .hero h1) {
  color: #f5dfac;
  text-shadow: 0 3px 24px rgba(8, 20, 18, .42);
}
body.quiet-luxury.quiet-home .qh-hero-copy .qh-eyebrow,
body.quiet-luxury.explore-page .voyage-eyebrow,
body.quiet-luxury.journal-page .journal-closing .editorial-kicker,
body.quiet-luxury.wonder-page .wonder-eyebrow {
  color: #f0cb84;
}

/* The moving highlight is limited to large editorial type. */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  body.quiet-luxury.quiet-home :is(.qh-intro h2, .qh-section-head h2, .qh-feature-copy h2,
    .qh-closing h2, .field-guide h2),
  body.quiet-luxury.explore-page :is(.season-heading h2, .wish-heading h2,
    .atlas-destination-heading h2, .atlas-wayfinding-v2 h2, .atlas-inspiration-title h2,
    .craft-barrel-heading h2, .atlas-essentials-copy h2, .atlas-footer-statement h2),
  body.quiet-luxury.essentials-page :is(.decision-section h2,
    .search-band h2, .tools-section h2, .trust-section h2, .stage-hero h1,
    .article-header h1, .tool-header h1),
  body.quiet-luxury.journal-page :is(.journal-hero h1, .chapter-heading h2, .credits-main h1),
  body.quiet-luxury.atlas-map-page .atlas-map-intro h1,
  body.quiet-luxury.original-explore-page :is(.hd h1, .th h1, .ph h1, .city-section .section-heading h2) {
    background-image: var(--type-foil-ink);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  body.quiet-luxury.quiet-home .qh-hero-copy h1,
  body.quiet-luxury.explore-page .voyage-copy h1,
  body.quiet-luxury.essentials-page .essentials-orientation-heading h2,
  body.quiet-luxury.journal-page :is(.journal-closing h2, .editorial-transformation h2),
  body.quiet-luxury.wonder-page .wonder-copy h1,
  body.quiet-luxury.original-explore-page :is(.city-hero h1, .hero h1) {
    background-image: var(--type-foil-light);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 3px 16px rgba(8, 20, 18, .45));
  }
  @media (prefers-reduced-motion: no-preference) {
    body.quiet-luxury.quiet-home :is(.qh-hero-copy h1, .qh-intro h2, .qh-section-head h2,
      .qh-feature-copy h2, .qh-closing h2, .field-guide h2),
    body.quiet-luxury.explore-page :is(.voyage-copy h1, .season-heading h2, .wish-heading h2,
      .atlas-destination-heading h2, .atlas-wayfinding-v2 h2, .atlas-inspiration-title h2,
      .craft-barrel-heading h2, .atlas-essentials-copy h2, .atlas-footer-statement h2),
    body.quiet-luxury.essentials-page :is(.essentials-orientation-heading h2, .decision-section h2,
      .search-band h2, .tools-section h2, .trust-section h2, .stage-hero h1,
      .article-header h1, .tool-header h1),
    body.quiet-luxury.journal-page :is(.journal-hero h1, .chapter-heading h2,
      .journal-closing h2, .editorial-transformation h2),
    body.quiet-luxury.wonder-page .wonder-copy h1,
    body.quiet-luxury.atlas-map-page .atlas-map-intro h1,
    body.quiet-luxury.original-explore-page :is(.hd h1, .th h1, .ph h1) {
      animation: type-foil-drift 20s ease-in-out infinite alternate;
    }
  }
}

@keyframes type-foil-drift {
  from { background-position: 0% 50%; }
  to { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce), (forced-colors: active), print {
  body.quiet-luxury :is(h1, h2, h3) {
    animation: none !important;
  }
  body.quiet-luxury :is(h1, h2) {
    -webkit-text-fill-color: currentColor;
    background-image: none;
  }
}