/* Preserve the original visual identity; adapt navigation to the new reading order. */
@media (min-width: 901px) {
  .hd__in { gap: clamp(12px, 1.4vw, 20px); }
  #nav {
    flex: 1;
    min-inline-size: 0;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    gap: 2px clamp(10px, 1vw, 18px);
    font-size: .875rem;
    line-height: 1.6;
  }
  #nav a { padding-block: 3px; }
  .logo, .hd__act { flex-shrink: 0; }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .logo__txt { display: none; }
  .hd__act .btn { padding-inline: 14px; font-size: .875rem; }
  .hd__in, .hd.is-stuck .hd__in { block-size: 92px; }
  html { scroll-padding-top: 130px; }
}
@media (max-width: 900px) {
  .hero__in {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  .hero__txt { inline-size: 100%; padding-block-end: 18px; }
  .hero .badge {
    position: relative;
    inset: auto;
    flex: none;
    align-self: flex-end;
    inline-size: 84px;
    margin-block: 0 22px;
  }
  .hero__media::after {
    background: linear-gradient(to bottom, rgba(243,240,234,.5), rgba(243,240,234,.91) 25%, rgba(243,240,234,.97) 72%, var(--cream));
  }
  #nav {
    block-size: 100svh;
    overflow-y: auto;
    overscroll-behavior: contain;
    justify-content: flex-start;
    gap: 0;
    padding-block: 120px max(28px, env(safe-area-inset-bottom));
    font-size: clamp(1.125rem, 4.4vw, 1.5rem);
    line-height: 1.6;
  }
  #nav a { display: block; inline-size: 100%; padding-block: 10px; }
  .burger, .x-lang button { min-inline-size: 44px; min-block-size: 44px; }
  .chips label span { min-block-size: 44px; }
  .hero__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); inline-size: 100%; }
  .hero__facts li, .hero__facts li:last-child {
    min-inline-size: 0;
    margin: 0;
    padding: 10px 12px;
    border: 0;
  }
}

/* Horizontal comparison remains draggable while the page can scroll vertically. */
.x-ba__frame { touch-action: pan-y; }

@media (max-width: 360px) {
  .tgrid--3, .tgrid--5 { grid-template-columns: minmax(0, 1fr); }
  .tgrid--3 .tm:first-child { grid-column: auto; }
}