/* =========================================================
   Páginas interiores: catering y contacto
   ========================================================= */

/* ---------- Hero interior ---------- */
.hero-int {
  position: relative; isolation: isolate; overflow: hidden;
  color: var(--blanco);
  padding-bottom: calc(clamp(52px, 4.4vw, 82px) + clamp(48px, 5vw, 96px));
}
.hero-int--catering { background: var(--degradado-marca); }
.hero-int--contacto { background: var(--rosa); }
.hero-int__sello { right: -2%; top: 2%; opacity: 1; }
.hero-int__grid {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  align-items: center; gap: clamp(32px, 4vw, 80px);
  padding-top: clamp(40px, 5vw, 100px);
}
.hero-int__titulo { font-size: var(--t-xl); margin-bottom: clamp(24px, 3.4vw, 64px); }
.hero-int__texto { max-width: 46ch; font-size: clamp(1.05rem, 1.3vw, 1.5rem); line-height: 1.65; text-shadow: var(--sombra-texto); }
.hero-int__collage { width: min(100%, 820px); justify-self: end; }
@media (max-width: 899px) {
  .hero-int__grid { grid-template-columns: 1fr; }
  .hero-int__collage { justify-self: center; width: min(100%, 520px); }
}

/* ---------- Catering · Lo que ponemos sobre la mesa ---------- */
.mesa { padding-block: calc(var(--sec-y) + clamp(40px, 6vw, 125px)) var(--sec-y); }
.mesa__tarjeta {
  position: relative; background: var(--naranja); color: var(--blanco);
  border-radius: var(--radio-bloque);
  padding: clamp(72px, 7vw, 120px) clamp(24px, 4.6vw, 90px) clamp(40px, 4.6vw, 80px);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 96px);
}
.mesa__titulo { font-size: var(--t-xl); margin-bottom: clamp(28px, 3.6vw, 72px); }
.mesa__texto p { font-size: clamp(1.05rem, 1.3vw, 1.5rem); line-height: 1.65; max-width: 40ch; }
.mesa__texto .boton { margin-top: clamp(32px, 4vw, 72px); }
.mesa__lista { font-size: clamp(1.05rem, 1.3vw, 1.5rem); line-height: 1.6; padding: clamp(28px, 4.4vw, 90px) clamp(24px, 4.6vw, 90px); margin-top: calc(clamp(72px, 7vw, 120px) * -.6); }
.mesa__lista strong { font-weight: 700; }
.mesa__lista .lista-puntos { margin-block: 1.6em; }
@media (max-width: 899px) {
  .mesa__tarjeta { grid-template-columns: 1fr; }
  .mesa__lista { margin-top: 0; }
}

/* ---------- Catering · Ideal para ---------- */
.ideal { position: relative; overflow: hidden; padding-block: var(--sec-y) clamp(40px, 5vw, 96px); text-align: center; }
.ideal__sello { right: 3%; top: clamp(24px, 4vw, 80px); }
.ideal__cuerpo { position: relative; z-index: 1; display: grid; justify-items: center; }
.ideal__titulo { font-size: clamp(2.4rem, 5.8vw, 7.2rem); line-height: 1.05; margin-top: clamp(12px, 2vw, 40px); }
.ideal__texto { max-width: 52ch; margin-top: clamp(28px, 3.6vw, 64px); font-size: clamp(1rem, 1.2vw, 1.35rem); }
.ideal .boton { margin-top: clamp(28px, 3.2vw, 56px); }
.deslizar {
  display: flex; align-items: center; gap: clamp(24px, 6vw, 120px);
  padding-left: clamp(16px, 11vw, 220px);
  margin-top: clamp(48px, 6vw, 110px);
  width: max-content;
}
.deslizar__item { width: clamp(150px, 20vw, 380px); flex: none; }
.deslizar__item img { width: 100%; height: auto; filter: drop-shadow(0 14px 18px rgba(66, 33, 11, .22)); }

/* ---------- Catering · Échanos un grito ---------- */
.grito { padding-block: calc(var(--sec-y) + 60px) var(--sec-y); }
.grito__tarjeta {
  position: relative; background: var(--degradado-marca); color: var(--blanco);
  border-radius: var(--radio-bloque); text-align: center;
  padding: clamp(96px, 10vw, 190px) clamp(24px, 20vw, 420px) clamp(56px, 5vw, 96px);
}
.grito__titulo { font-size: var(--t-l); }
.grito__texto { margin: clamp(20px, 2.4vw, 48px) auto 0; max-width: 46ch; font-size: clamp(1.05rem, 1.25vw, 1.45rem); }
.grito .boton { margin-top: clamp(28px, 4vw, 80px); }
.grito__foto { position: absolute; width: clamp(130px, 17.5vw, 340px); aspect-ratio: 340 / 440; top: 50%; translate: 0 -40%; }
.grito__foto--izq { left: -4%; rotate: -5deg; }
.grito__foto--der { right: -4%; rotate: 4deg; }
@media (max-width: 899px) {
  .grito__tarjeta { padding-inline: clamp(20px, 6vw, 48px); padding-bottom: clamp(230px, 56vw, 360px); }
  .grito__foto { top: auto; bottom: 28px; translate: none; width: 40%; }
  .grito__foto--izq { left: 6%; } .grito__foto--der { right: 6%; }
}

/* ---------- Contacto · Lo que hay detrás ---------- */
.detras { position: relative; overflow: hidden; padding-block: var(--sec-y); text-align: center; }
.detras__cuerpo { position: relative; z-index: 1; max-width: 1000px; margin-inline: auto; padding-inline: var(--gutter); display: grid; justify-items: center; }
.detras__titulo { font-size: clamp(2.4rem, 5.6vw, 6.6rem); margin-top: clamp(12px, 2vw, 32px); }
.detras__texto { margin-top: clamp(20px, 2vw, 40px); display: grid; gap: 1.3em; max-width: 58ch; font-size: clamp(1rem, 1.2vw, 1.4rem); }
.detras__foto { position: absolute; left: -1.5%; top: 50%; translate: 0 -46%; width: clamp(160px, 20vw, 390px); aspect-ratio: 390 / 520; rotate: -5deg; }
.detras__flautas { position: absolute; right: -6%; bottom: 0; width: clamp(200px, 30vw, 600px); }
@media (max-width: 1100px) {
  .detras { padding-bottom: 0; }
  .detras__foto, .detras__flautas { position: relative; left: auto; right: auto; top: auto; translate: none; }
  .detras__foto { width: min(60%, 320px); margin: clamp(32px, 6vw, 64px) auto 0; }
  .detras__flautas { width: min(90%, 520px); margin: 24px 0 0 auto; }
}

/* ---------- Contacto · Tu lugar en la mesa ---------- */
.lugar { background: var(--naranja-oscuro); color: var(--blanco); padding-block: var(--sec-y); }
.lugar__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 5vw, 96px) clamp(32px, 4vw, 72px); align-items: center; }
.lugar__titulo { font-size: var(--t-l); margin-bottom: .35em; }
.lugar__texto p { font-size: clamp(1.05rem, 1.25vw, 1.45rem); line-height: 1.65; max-width: 44ch; }
.lugar__texto p + p { margin-top: 1.4em; }
.lugar__fachada { aspect-ratio: 830 / 520; rotate: 4deg; }
.lugar__comedor { aspect-ratio: 800 / 510; }
@media (max-width: 899px) {
  .lugar__grid { grid-template-columns: 1fr; }
  .lugar__comedor { order: 4; }
}

/* ---------- Contacto · Reseñas ---------- */
.resenas { padding-block: var(--sec-y); text-align: center; overflow: hidden; }
.resenas__titulo { font-size: clamp(2.4rem, 5.6vw, 6.6rem); margin-top: clamp(12px, 2vw, 32px); }
.resenas .carrusel { margin-top: clamp(48px, 6vw, 110px); padding-block: 40px; }
.resena {
  flex: none; width: clamp(280px, 28vw, 540px); margin-right: clamp(20px, 3vw, 56px);
  padding: clamp(24px, 2.2vw, 40px); text-align: left;
  background: var(--acento-20); border: var(--borde-punteado-cafe); border-radius: var(--radio-tarjeta);
  display: flex; flex-direction: column; justify-content: space-between; gap: 1em;
}
.resena:nth-child(odd) { rotate: -4deg; }
.resena:nth-child(even) { rotate: 4deg; }
.resena blockquote { margin: 0; font-size: clamp(1rem, 1.2vw, 1.35rem); line-height: 1.55; }
.resena__autor { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-weight: 700; font-size: clamp(1.15rem, 1.6vw, 1.9rem); }
.resena__icono { width: clamp(36px, 3.2vw, 60px); height: auto; color: var(--naranja); flex: none; }
.resenas__mas { display: inline-block; margin-top: clamp(16px, 2vw, 32px); font-weight: 700; color: var(--naranja-oscuro); text-underline-offset: 4px; }
.resenas__mas:hover { color: var(--cafe); }

/* ---------- Contacto · ¿Estás de paso? ---------- */
.paso { position: relative; overflow: hidden; padding-block: var(--sec-y); }
.paso__sello { right: 3%; top: clamp(24px, 4vw, 60px); }
.paso__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 96px); align-items: center; }
.mapa { aspect-ratio: 1; border-radius: var(--radio-foto); overflow: hidden; background: #ece8e1; position: relative; }
.mapa iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.mapa__respaldo { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 24px; color: var(--cafe-20); font-size: var(--t-chico); }
.paso__titulo { font-size: var(--t-xl); }
.paso__texto { margin-top: clamp(24px, 3.6vw, 80px); font-size: clamp(1.05rem, 1.25vw, 1.45rem); line-height: 1.65; }
.paso__linea { border: 0; border-top: var(--borde-punteado-cafe); border-color: rgba(242, 101, 34, .5); margin: clamp(16px, 1.6vw, 28px) 0; }
.paso__destacado { color: var(--naranja); font-weight: 700; font-size: clamp(1.05rem, 1.25vw, 1.45rem); line-height: 1.55; }
.paso__acciones { margin-top: clamp(28px, 3.4vw, 64px); display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.paso__whatsapp { font-weight: 700; color: var(--cafe); text-underline-offset: 4px; }
.paso__whatsapp:hover { color: var(--naranja-oscuro); }
@media (max-width: 899px) { .paso__grid { grid-template-columns: 1fr; } }

/* ---------- Pie en páginas interiores (sin bloque de servicios) ---------- */
.bloque-final--solo-pie .pie { padding-top: var(--sec-y); }

/* ---------- Aviso de privacidad ---------- */
.legal { padding-block: var(--sec-y); }
.legal__cuerpo { max-width: 72ch; display: grid; gap: 1.1em; }
.legal__cuerpo h1 { font-size: var(--t-l); margin-bottom: .3em; }
.legal__cuerpo h2 { font-size: clamp(1.25rem, 1.6vw, 1.8rem); font-weight: 700; margin-top: 1em; }
.legal__cuerpo ul { padding-left: 1.2em; }
.hero-int--corto { padding-bottom: calc(clamp(52px, 4.4vw, 82px) + 56px); }

/* Dirección en el hero de contacto */
.hero-int__direccion {
  display: flex; align-items: center; gap: 16px;
  margin-top: clamp(24px, 2.6vw, 40px); font-style: normal;
  font-size: clamp(1rem, 1.2vw, 1.35rem); font-weight: 700; line-height: 1.45;
}
.hero-int__direccion-texto { color: var(--blanco); text-underline-offset: 3px; }
.hero-int__direccion-texto:hover { color: var(--acento); }
.hero-int__direccion-icono {
  flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
  color: var(--blanco); background: rgba(255, 255, 255, .2);
  transition: background-color var(--t-hover), color var(--t-hover), transform var(--t-hover);
}
.hero-int__direccion-icono .icono { width: 28px; height: 28px; }
.hero-int__direccion-icono:hover { background: var(--blanco); color: var(--rosa); transform: translateY(-2px); }

/* Teléfono en el hero de contacto */
.hero-int__telefono { margin-top: 12px; padding-left: 68px; font-weight: 700; font-size: clamp(1rem, 1.2vw, 1.35rem); }
.hero-int__telefono a { color: var(--blanco); text-underline-offset: 3px; }
.hero-int__telefono a:hover { color: var(--acento); }

/* Mapa: portada que carga Google Maps solo al tocar (sin cookies antes) */
.mapa__portada {
  position: absolute; inset: 0; z-index: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  padding: 24px; text-align: center; color: var(--cafe);
  background:
    radial-gradient(circle at 50% 42%, rgba(242, 101, 34, .14), transparent 55%),
    repeating-linear-gradient(0deg, transparent 0 46px, rgba(66, 33, 11, .06) 46px 48px),
    repeating-linear-gradient(90deg, transparent 0 46px, rgba(66, 33, 11, .06) 46px 48px),
    var(--acento-20);
}
.mapa__pin { width: 46px; height: 61px; color: var(--naranja); filter: drop-shadow(0 6px 10px rgba(66, 33, 11, .25)); }
.mapa__direccion { font-weight: 700; font-size: clamp(1rem, 1.2vw, 1.25rem); line-height: 1.45; }
.mapa__externo { font-weight: 700; color: var(--naranja-oscuro); text-underline-offset: 3px; }
.mapa__externo:hover { color: var(--cafe); }
.mapa__nota { font-size: .8rem; color: var(--cafe-20); max-width: 32ch; }
.mapa.is-cargado .mapa__portada { display: none; }

/* Página 404 */
.error404__cuerpo { justify-items: start; padding-block: clamp(24px, 4vw, 64px); }
.error404__cuerpo .firma { margin-bottom: .2em; }
.error404__acciones { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 1em; }
