/* ==========================================================================
   CASA VALDORIA — responsive.css
   Breakpoints probados: 375 / 390 / 430 / 768 / 1024 / 1440
   ========================================================================== */

/* ---------- Laptop / tablet landscape (<=1024px) ---------- */
@media (max-width: 1024px) {
  .main-nav__list { display: none; }
  .hamburger { display: block; }

  .hero {
    display: flex;
    flex-direction: column;
    min-height: auto;
    padding-top: 5.25rem;
  }
  .hero__rail {
    order: 2;
    flex-direction: row;
    justify-content: flex-start;
    padding: 1.4rem var(--gutter) 0;
  }
  .hero__rail span { writing-mode: horizontal-tb; transform: none; letter-spacing: .1em; }
  .hero__media { order: 1; margin: 0; border-radius: 0 0 70px 0; }
  .hero__media img { min-height: 62vh; }
  .hero__content { order: 3; padding: 1.6rem var(--gutter) 3.25rem; }
  .hero__scroll { position: static; margin-top: 2rem; }

  .cocina .container,
  .reservas .container,
  .contacto .container {
    grid-template-columns: 1fr;
  }
  .cocina__media { order: -1; max-width: 480px; }
  .cocina__media-small { border-width: 5px; }

  .platos__featured { grid-template-columns: 1fr; }
  .platos__grid { grid-template-columns: repeat(2, 1fr); }

  .espacio__layout { grid-template-columns: 1fr; }
  .espacio__media { order: -1; }

  .carta-groups { gap: 2rem 1.5rem; }
}

/* ---------- Tablet portrait (<=768px) ---------- */
@media (max-width: 768px) {
  .experiencia__grid { grid-template-columns: 1fr; gap: 2.2rem; }
  .experiencia__intro { max-width: 100%; }

  .footer-top { grid-template-columns: 1fr 1fr; row-gap: 2.2rem; }
  .footer-top .footer-col:first-child { grid-column: 1 / -1; }

  .carta-groups { grid-template-columns: 1fr; }
  .carta-modal__panel { padding: 5.5rem 1.5rem 3rem; }

  .platos__grid { grid-template-columns: repeat(2, 1fr); gap: 1.4rem; }

  .res-form { grid-template-columns: 1fr 1fr; }

  .espacio__stats { flex-wrap: wrap; row-gap: 1.4rem; }
  .espacio__stat { width: calc(50% - 1rem); border-right: none; padding-right: 0; }
}

/* ---------- Large phones (<=430px) ---------- */
@media (max-width: 430px) {
  :root { --section-pad: clamp(3.5rem, 14vw, 5rem); }

  .site-header { padding-block: 1.1rem; }
  .site-header.is-scrolled { padding-block: .8rem; }
  .wordmark { font-size: 1.05rem; }
  .header-actions { gap: .7rem; }
  .site-header .btn-primary { padding: .65rem 1rem; font-size: .82rem; }

  .hero__media img { min-height: 56vh; }
  .hero__title { font-size: clamp(2.5rem, 12vw, 3.4rem); }
  .hero__lede { max-width: 28ch; }

  .cocina__media-small { left: -4%; bottom: -8%; width: 50%; border-width: 4px; }

  .platos__grid { grid-template-columns: 1fr; }
  .platos__featured .dish-media { aspect-ratio: 1 / 1; }

  .carta-item__name { font-size: .96rem; }

  .res-form { grid-template-columns: 1fr; }

  .contacto__row { grid-template-columns: 5.5rem 1fr; }

  .footer-top { grid-template-columns: 1fr; }
  .footer-top .footer-col:first-child { grid-column: auto; }

  .footer-bottom { flex-direction: column; align-items: flex-start; gap: .75rem; }

  .to-top { width: 42px; height: 42px; }
}

/* ---------- Small phones (<=390px / 375px) ---------- */
@media (max-width: 390px) {
  .section-head h2 { font-size: clamp(1.9rem, 9vw, 2.6rem); }
  .hero__scroll { display: none; }
  .cocina__list li { font-size: 1.02rem; }
  .dish-price { font-size: 1.02rem; }
  .carta-modal__head h2 { font-size: 1.8rem; }
}

/* ---------- Large desktop refinement (>=1440px) ---------- */
@media (min-width: 1440px) {
  :root { --container: 1360px; }
  .hero__title { font-size: clamp(5rem, 6.4vw, 7rem); }
}

/* ---------- No horizontal scroll safety ---------- */
html, body { max-width: 100%; overflow-x: hidden; }