/* ===========================================================
   RÚSTICA V4.2 · Acabados visuales y experiencia móvil
   Complementa, sin sustituir, el diseño original.
   =========================================================== */

/* Espacio para las anclas y foco claro para teclado. */
html { scroll-padding-top: 88px; }
:where(a, button):focus-visible {
  outline: 3px solid #f1ae63;
  outline-offset: 4px;
}
:where(#pizzas, #pizzas-carta, #contacto, #resenas, #alergenos) {
  scroll-margin-top: 88px;
}

/* La información y el precio tienen más peso que el elemento decorativo. */
.pizza-card {
  border: 1px solid rgba(54, 66, 39, .12);
  box-shadow: 0 8px 22px rgba(24, 38, 17, .065);
}
.pizza-card .pizza-card-body {
  min-width: 0;
}
.pizza-card h3 { overflow-wrap: break-word; }
.pizza-card .pizza-card-bottom .pizza-price {
  color: #233b1b;
  letter-spacing: -.025em;
}
.pizza-allergens .allergen-tag {
  border-color: rgba(49, 65, 35, .18);
}
.tabs button:focus-visible {
  outline-offset: 2px;
}

/* Enlaces de acción: área táctil cómoda, sin modificar las pinceladas. */
.header-call, .hero-cta, .hero-map-btn, .carta-call-primary,
.contact-call, .allergen-contact .brush-btn,
.contact .contact-whatsapp, .carta-back-home,
.reviews-v4 .reviews-write-link {
  min-height: 44px;
}
.contact .contact-whatsapp {
  text-underline-offset: 4px;
}
.reviews-v4 .review-testimonial {
  border-color: rgba(248, 234, 193, .22);
}
.reviews-v4 .review-author strong { overflow-wrap: anywhere; }

/* Tablets: las tarjetas ganan aire entre títulos, ingredientes y precio. */
@media (min-width: 621px) and (max-width: 1000px) {
  .pizza-grid, .carta-pizza-grid { gap: 16px; }
  .pizza-card .pizza-card-body { padding: 18px; }
  .pizza-card p, .carta-pizza-grid .pizza-card p { line-height: 1.58; }
  .carta-pizzas { padding-block: 42px 52px; }
}

/* Móviles: lectura más cómoda y botón de llamada siempre prioritario. */
@media (max-width: 620px) {
  html { scroll-padding-top: 76px; }
  :where(#pizzas, #pizzas-carta, #contacto, #resenas, #alergenos) { scroll-margin-top: 76px; }
  .hamb { min-width: 44px; min-height: 44px; }
  .tabs { -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain; }
  .tabs button { min-height: 46px; }
  .pizza-grid, .carta-pizza-grid { gap: 15px; }
  .pizza-card, .carta-pizza-grid .pizza-card {
    grid-template-columns: minmax(108px, 32%) minmax(0, 1fr);
    min-height: 178px;
    border-radius: 11px;
  }
  .pizza-card > .pizza-placeholder,
  .carta-pizza-grid .pizza-card > .pizza-placeholder {
    min-height: 178px;
    height: 100%;
  }
  .pizza-card .pizza-card-body { padding: 15px 13px; }
  .pizza-card h3, .carta-pizza-grid .pizza-card h3 { font-size: 15px; line-height: 1.3; }
  .pizza-card p, .carta-pizza-grid .pizza-card p { font-size: 12px; line-height: 1.5; }
  .pizza-card-bottom { gap: 10px; }
  .pizza-card-bottom .pizza-price { font-size: 20px; }
  .pizza-allergens .allergen-tag { min-height: 25px; }
  .carta-extras { gap: 17px; }
  .carta-list-card { padding: 23px 20px; }
  .menu-row { gap: 14px; }
  .menu-row span { min-width: 0; }
  .menu-row strong { white-space: nowrap; }
  .allergen-legend-item { min-height: 42px; }
  .contact-call { min-height: 48px; }
  body { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  .mobile-phone-cta {
    left: max(10px, env(safe-area-inset-left));
    right: max(10px, env(safe-area-inset-right));
    bottom: max(10px, env(safe-area-inset-bottom));
    min-height: 54px;
    padding: 12px 15px;
    border: 1px solid rgba(255, 236, 203, .35);
    border-radius: 12px;
    background: linear-gradient(135deg, #cd782f, #aa541d);
    box-shadow: 0 9px 26px rgba(20, 28, 14, .27);
    font-size: clamp(11px, 3.4vw, 13px);
    letter-spacing: .015em;
  }
}
@media (max-width: 350px) {
  .pizza-card, .carta-pizza-grid .pizza-card { grid-template-columns: 96px minmax(0, 1fr); }
  .pizza-card .pizza-card-body { padding: 12px 10px; }
  .pizza-card h3, .carta-pizza-grid .pizza-card h3 { font-size: 13.5px; }
  .pizza-allergens { gap: 4px; }
  .pizza-allergens .allergen-tag { font-size: 9.5px; padding-inline: 4px; }
  .pizza-allergens .allergen-tag img { width: 17px; height: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
  .pizza-card, .pizza-card *, .mobile-phone-cta { transition-duration: 0s !important; }
}