@media (max-width: 64rem) {
  .site-header__inner { position: relative; min-height: 4.75rem; }
  .menu-toggle { display: grid; z-index: 30; }
  .primary-navigation {
    position: absolute;
    z-index: 25;
    top: 100%;
    left: 50%;
    width: 100vw;
    max-height: 0;
    overflow: hidden;
    border-bottom: 1px solid rgb(23 24 23 / 10%);
    background: var(--color-header-glass);
    box-shadow: 0 1rem 1.75rem rgb(23 24 23 / 9%);
    opacity: 0;
    transform: translateX(-50%) translateY(-0.5rem);
    visibility: hidden;
    transition: max-height 320ms ease, opacity var(--transition-base), transform var(--transition-base), visibility var(--transition-base);
  }
  .primary-navigation.is-open {
    max-height: 18rem;
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    visibility: visible;
  }
  .primary-navigation__list {
    width: min(100% - (var(--content-padding) * 2), var(--content-width));
    margin-inline: auto;
    padding-block: var(--space-3) var(--space-5);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    text-align: left;
  }
  .primary-navigation li + li { border-top: 1px solid rgb(23 24 23 / 8%); }
  .primary-navigation a { padding-block: var(--space-3); font-family: var(--font-body); font-size: var(--text-base); font-weight: 600; }
  .primary-navigation a::after { bottom: 0.45rem; width: 2rem; right: auto; }
  .language-switch {
    width: 100%;
    justify-content: flex-start;
    padding-block: var(--space-3);
    font-size: var(--text-base);
  }
  .language-switch > a { padding-block: 0; }
  .language-switch > a::after { bottom: -0.2rem; width: 100%; }
  .menu-toggle[aria-expanded="true"] .menu-toggle__line:nth-child(1) { transform: translateY(0.4rem) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__line:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] .menu-toggle__line:nth-child(3) { transform: translateY(-0.4rem) rotate(-45deg); }
  .site-footer { margin-top: var(--space-8); }
  .site-footer__main { grid-template-columns: 1fr 1fr; gap: var(--space-6) var(--space-5); padding-block: var(--space-7); }
  .site-footer__intro { grid-column: 1 / -1; }
  .two-column-layout, .three-column-layout { grid-template-columns: 1fr; }
  .section-heading { margin-bottom: var(--space-6); }
  .hero { min-height: 36rem; }
  .hero__content h1 { max-width: 15ch; }
  .hero__image-wrap::after { background: rgb(18 19 18 / 68%); }
  .image-caption { right: var(--content-padding); bottom: var(--space-4); }
  .article-grid { grid-template-columns: 1fr; }
  .featured-posts .article-grid { grid-template-columns: 1fr; grid-template-rows: none; }
  .featured-posts .article-card, .featured-posts .article-card--featured { min-height: clamp(18rem, 72vw, 27rem); grid-row: auto; }
  .article-card--featured { grid-row: auto; }
  .article-card--featured .article-card__image-link { aspect-ratio: 16 / 10; }
  .map-teaser__layout, .home-about__layout { grid-template-columns: 1fr; }
  .map-teaser__globe { width: min(78vw, 21rem); }
  .report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-hero { margin-bottom: var(--space-7); }
  .article-gallery { --gallery-image-height: min(66vh, 32rem); }
  .article-facts { grid-template-columns: 1fr; }
  .packing-checklist__groups { grid-template-columns: 1fr; }
  .destination-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 16rem; }
  .destination-card--large { grid-row: span 1; grid-column: span 2; }
  .contact-layout { grid-template-columns: 1fr; }
  .tips-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .world-map-shell { grid-template-columns: 1fr; }
  .world-map-detail { width: min(100%, 32rem); margin-inline: auto; }
  .about-hero { min-height: 0; }
  .about-hero__portrait { justify-self: center; }
}
@media (max-width: 30rem) {
  .site-footer__main { grid-template-columns: 1fr; }
  .site-footer__intro { grid-column: auto; }
  .site-footer__bottom { align-items: flex-start; flex-direction: column; }
  .report-grid { grid-template-columns: 1fr; }
  .destination-grid { grid-template-columns: 1fr; }
  .destination-card--large { grid-column: auto; }
  .tips-grid { grid-template-columns: 1fr; }
}

@media (min-width: 64.01rem) and (max-width: 75rem) {
  .site-header__inner { gap: var(--space-3); }
  .primary-navigation__list { gap: clamp(0.75rem, 1.4vw, 1.1rem); }
}

@media (min-width: 42rem) and (max-width: 64rem) {
  .hero__image-wrap {
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 72%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 72%, transparent 100%);
  }

  .map-teaser__layout {
    grid-template-columns: minmax(15rem, 0.85fr) minmax(0, 1.15fr);
    gap: clamp(var(--space-5), 4vw, var(--space-7));
  }

  .home-about__layout {
    grid-template-columns: minmax(13rem, 0.75fr) minmax(0, 1.25fr);
    gap: clamp(var(--space-5), 4vw, var(--space-7));
  }

  .about-hero .two-column-layout {
    grid-template-columns: minmax(0, 1.1fr) minmax(15rem, 0.9fr);
    gap: clamp(var(--space-5), 4vw, var(--space-7));
  }

  .about-hero__portrait {
    width: min(100%, 28rem);
    justify-self: end;
  }
}

@keyframes soft-section-reveal {
  from {
    opacity: 0.01;
    transform: translateY(1.35rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slow-image-drift {
  from { transform: scale(1.01); }
  to { transform: scale(1.055); }
}

@supports (animation-timeline: view()) {
  :is(
    .section-heading,
    .article-card,
    .map-teaser__globe,
    .map-teaser__content,
    .home-about__portrait,
    .home-about__content,
    .page-intro__content,
    .article-header,
    .article-facts,
    .route-map,
    .article-content > h2,
    .article-content > .article-image,
    .article-content > .article-gallery,
    .article-content > .tip-box,
    .value-card
  ) {
    animation-name: soft-section-reveal;
    animation-duration: 1ms;
    animation-fill-mode: both;
    animation-timeline: view();
    animation-range: entry 6% cover 28%;
  }

  .hero__image {
    animation-name: slow-image-drift;
    animation-duration: 1ms;
    animation-fill-mode: both;
    animation-timeline: view();
    animation-range: exit 0% exit 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(
    .section-heading,
    .article-card,
    .map-teaser__globe,
    .map-teaser__content,
    .home-about__portrait,
    .home-about__content,
    .page-intro__content,
    .article-header,
    .article-facts,
    .route-map,
    .article-content > h2,
    .article-content > .article-image,
    .article-content > .article-gallery,
    .article-content > .tip-box,
    .value-card,
    .hero__image
  ) {
    animation: none !important;
    transform: none !important;
  }
}

@keyframes hero-copy-in {
  from {
    opacity: 0;
    transform: translateY(1rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes hero-fade-transition {
  from { opacity: 0; }
  to { opacity: 1; }
}

.hero__content > * {
  animation: hero-copy-in 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero__content > :nth-child(2) { animation-delay: 90ms; }
.hero__content > :nth-child(3) { animation-delay: 180ms; }
.hero__content > :nth-child(4) { animation-delay: 270ms; }

@media (prefers-reduced-motion: reduce) {
  .hero__content > *,
  .hero::after {
    animation: none !important;
    transform: none !important;
  }
}
@media (max-width: 64rem) {
  .primary-navigation.is-open { max-height: min(23rem, calc(100vh - 4.75rem)); overflow-y: auto; }
  .navigation-topics__details > summary { padding-block: var(--space-3); font-size: var(--text-base); }
  .navigation-topics__menu { position: static; min-width: 0; padding: 0 0 var(--space-2) var(--space-4); border: 0; background: transparent; box-shadow: none; transform: none; }
  .navigation-topics__menu a { padding-block: .6rem; font-size: var(--text-sm); }
}

@media(max-width:42rem){.topic-map-panel,.topic-map{min-height:21rem}}
