/* ==========================================================================
   REVORA — responsive
   ========================================================================== */

/* Laptop */
@media (max-width: 1200px) {
  .featured__card { width: min(420px, 44vw); }
  .footer__top { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer__top .footer__col:last-child { grid-column: 3; }
}

/* Tablet */
@media (max-width: 960px) {
  :root { --nav-h: 60px; }
  .nav__inner { grid-template-columns: 1fr auto; }
  .nav__links, .btn--nav { display: none; }
  .burger { display: block; }

  .hero__index { display: none; }
  .hero__content { padding-bottom: 120px; }

  .featured__card { position: relative; right: auto; bottom: auto; width: auto; margin: -48px var(--gutter) 0 calc(var(--gutter) * 2); }
  .featured__figure { aspect-ratio: 4/3; }

  .collections__headrow { grid-template-columns: 1fr; }
  .grid { grid-template-columns: repeat(6, 1fr); }
  .tile--a { grid-column: 1 / span 6; }
  .tile--b { grid-column: 4 / span 3; margin-top: 0; }
  .tile--c { grid-column: 1 / span 3; margin-top: clamp(40px, 8vw, 80px); }
  .tile--d { grid-column: 1 / span 6; margin-top: 0; }
  .tile--e { grid-column: 1 / span 3; }
  .tile--f { grid-column: 4 / span 3; margin-top: 60px; }
  .tile--f figure { aspect-ratio: 3/4; }
  .tile__go span, .tile__go { font-size: 0; gap: 0; }
  .tile__go i { width: 30px; }

  .studio__grid { grid-template-columns: 1fr; }
  .viewer { aspect-ratio: 4/3.2; }

  .heritage__grid { grid-template-columns: 1fr; }
  .journal__grid { grid-template-columns: 1fr; }
  .lead figure { aspect-ratio: 16/10; }

  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__brand { grid-column: 1 / -1; }
  .footer__top .footer__col:last-child { grid-column: auto; }

  .sheet[open] { grid-template-columns: 1fr; }
  .sheet__media { min-height: 0; aspect-ratio: 16/9; }
}

/* Mobile */
@media (max-width: 600px) {
  body { font-size: 15px; }
  .hero__img { object-position: 42% 55%; }
  .hero__title { font-size: clamp(40px, 12.6vw, 64px); }
  .hero__row { flex-direction: column; align-items: flex-start; gap: 24px; }
  .btn { padding: 16px 22px; min-height: 48px; }
  .icon-btn { width: 44px; height: 44px; }
  .hero__scroll { display: none; }

  .featured__card { margin: -32px 16px 0 16px; }
  .featured { padding-bottom: 72px; }

  .grid { grid-template-columns: 1fr; gap: 44px; }
  .tile--a, .tile--b, .tile--c, .tile--d, .tile--e, .tile--f { grid-column: 1; margin-top: 0; }
  .tile--b { width: 82%; margin-left: auto; }
  .tile--c { width: 82%; }
  .tile--f { width: 90%; margin-left: auto; }
  .tile--b figure, .tile--c figure, .tile--f figure { aspect-ratio: 4/5; }
  .tile--d figure, .tile--a figure, .tile--e figure { aspect-ratio: 4/3; }
  .tile__go { font-size: 10.5px; gap: 10px; }

  .hints { gap: 20px; flex-wrap: wrap; }
  .viewer { aspect-ratio: 1/1; min-height: 300px; touch-action: pan-y; }
  .viewer__credit { display: none; }

  .legend { grid-template-columns: 32px 1fr; }
  .heritage__stage { aspect-ratio: 4/3.2; }
  .heritage__cta { flex-direction: column; align-items: flex-start; }

  .item a { grid-template-columns: 104px 1fr; }
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__credits ul { columns: 1; }
  .footer__bottom { flex-direction: column; }
  .search__form { padding-top: 96px; }
}

/* Short landscape phones */
@media (max-height: 520px) and (orientation: landscape) {
  .hero { min-height: 560px; }
  .hero__title { font-size: clamp(34px, 8vh, 60px); }
}

/* Touch devices: remove hover-only affordances that cause stuck states */
@media (hover: none) {
  .tile:hover img, .featured__stage:hover .featured__img, .lead a:hover img, .item a:hover img { transform: none; }
}