/* ==========================================================================
   El Dorado — responsive layer (desktop-first overrides)
   ========================================================================== */

/* ---------- ≤ 1180px : small desktop ---------- */
@media (max-width: 1180px) {
  .nav-desktop { gap: 1.6rem; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 2.5rem 3rem; }
  .footer-brand { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 3rem; }
  .footer-brand p { margin: 0; }
}

/* ---------- ≤ 1024px : tablet landscape ---------- */
@media (max-width: 1024px) {
  .drinks__copy { grid-column: 8 / span 5; }
  .order__grid { gap: 2.5rem 3rem; }
  .hours { grid-template-columns: 1fr; gap: 1.5rem; }
  .hours dl > div:first-child { padding-left: 1.25rem; }
}

/* ---------- ≤ 960px : switch to compact navigation ---------- */
@media (max-width: 960px) {
  :root { --header-h: 76px; }
  .nav-desktop { display: none; }
  .header-actions { display: flex; }
  .brand img { height: 56px; }
  .is-scrolled .header-inner { height: 64px; }
  .is-scrolled .brand img { height: 46px; }
  .jump { top: 64px; }
}
@media (min-width: 961px) {
  .mobile-menu { display: none; }
}

/* ---------- ≤ 900px : tablet portrait ---------- */
@media (max-width: 900px) {
  .section-head { grid-template-columns: 1fr; gap: 1.25rem; }

  .intro__grid,
  .drinks,
  .place { grid-template-columns: minmax(0, 1fr); }
  .intro__grid { gap: 4rem; }
  .intro__copy,
  .intro__media { grid-column: 1 / -1; }
  .intro__copy h2 { max-width: 18ch; }
  .intro__media { width: min(100%, 520px); margin-left: auto; margin-right: 1.25rem; }
  .intro__media .frame { aspect-ratio: 5 / 4; }

  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: clamp(200px, 34vw, 300px); }
  .tile--feature { grid-column: 1 / -1; grid-row: span 2; }
  .tile--a { grid-column: 1; }
  .tile--b { grid-column: 2; }

  .drinks .tile { grid-column: 1 / -1; }
  .drinks__copy { grid-column: 1 / -1; padding-block: 1.25rem 0; max-width: 34rem; }

  .loc-grid { grid-template-columns: 1fr; }
  .loc { padding-right: 0; }
  .loc + .loc { border-left: 0; border-top: 1px solid var(--line-dark); padding-left: 0; }

  .order__grid { grid-template-columns: 1fr; }

  .page-hero__grid { grid-template-columns: 1fr; }

  .place { gap: 2rem; }
  .place__info,
  .place--reverse .place__info { grid-column: 1 / -1; grid-row: auto; }
  .place__map,
  .place--reverse .place__map { grid-column: 1 / -1; grid-row: auto; }
  .map { min-height: 0; height: auto; aspect-ratio: 16 / 10; }
}

/* ---------- ≤ 640px : mobile ---------- */
@media (max-width: 640px) {
  :root { --header-h: 68px; --fs-body: 1rem; }
  html { scroll-padding-top: 76px; }
  .brand img { height: 50px; }
  .is-scrolled .header-inner { height: 60px; }
  .is-scrolled .brand img { height: 42px; }
  .jump { top: 60px; }
  .mobile-menu { padding-top: calc(68px + 1rem); }

  .hero { min-height: 0; }
  .hero__media img { object-position: 72% 50%; }
  .hero::after {
    background:
      linear-gradient(0deg, rgba(17, 22, 29, 0.97) 0%, rgba(17, 22, 29, 0.86) 45%, rgba(17, 22, 29, 0.45) 100%);
  }
  .hero__content { padding-top: 22vh; padding-bottom: 2.5rem; }
  .hero__ctas .btn { flex: 1 1 100%; }
  .hero__bar { background: rgba(17, 22, 29, 0.85); }
  .hero__bar ul { grid-template-columns: 1fr; }
  .hero__bar li { padding: 0.95rem 0; }
  .hero__bar li + li { border-left: 0; border-top: 1px solid var(--line-dark); }

  .facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
  .facts strong { font-size: 1.85rem; }
  .facts span { font-size: 0.64rem; letter-spacing: 0.12em; }

  .intro__media { margin-right: 0.75rem; }
  .intro__media::before { inset: -0.75rem 0.75rem 0.75rem -0.75rem; }
  .intro__media figcaption { left: -0.75rem; bottom: 1.25rem; }

  .gallery { grid-auto-rows: auto; }
  .tile--feature { grid-row: auto; aspect-ratio: 4 / 5; }
  .tile--a,
  .tile--b { aspect-ratio: 1 / 1; }
  .tile figcaption { padding: 2rem 0.85rem 0.75rem; font-size: 0.64rem; letter-spacing: 0.12em; }

  .loc__actions .btn { flex: 1 1 100%; }
  .loc__row--phone span { font-size: 1.25rem; }

  .hours dl { grid-template-columns: 1fr; }
  .hours dl > div,
  .hours dl > div:first-child {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding: 0.9rem 0;
    border-left: 0;
    border-bottom: 1px solid var(--line-dark);
  }
  .hours dd { margin: 0; text-align: right; font-size: 0.98rem; }

  .choice { grid-template-columns: 1fr; padding: 1.35rem 1.25rem; }
  .choice__go { grid-column: 1; grid-row: auto; margin-top: 0.85rem; }

  .footer-top { grid-template-columns: 1fr; gap: 2.25rem; }
  .footer-brand { display: block; }
  .footer-brand p { margin: 1.25rem 0 1.5rem; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  .quick__row strong { font-size: 1.05rem; }

  .map { aspect-ratio: 4 / 3; max-height: 320px; }
  .place-hours { font-size: 0.95rem; }
  .place .loc__actions .btn { flex: 1 1 100%; }
}

/* ---------- ≤ 400px : small phones ---------- */
@media (max-width: 400px) {
  .header-actions .btn { padding-inline: 0.85rem; letter-spacing: 0.1em; }
  .brand img { height: 44px; }
  .facts strong { font-size: 1.6rem; }
  .socials { flex-wrap: wrap; }
  .quick__row { flex-direction: column; align-items: flex-start; gap: 0.2rem; }
}
