/* IvaniaPhoto · publico/assets/css/tema-booking.css
 * Ocampo-Infra Agent System · autor Roberto Ocampo · 9/19/2026
 *
 * ADR-001/ADR-006 (`docs/web-publica-20260919/02-DISENO-ARQUITECTURA.md` §1,
 * §6): landing "resaltada" — SCOPED a `main[data-tema="booking"]`, nunca a
 * `:root`. El resaltado del ítem de menú (`.ip2-nav__cta`) es CSS aparte, ya
 * decidido en `base.css`/ADR-002 — aquí sólo el cuerpo de la página.
 */

/* stand-w2 (10/8/2026) · Tema PAQUETES = paleta del tríptico de paquetes IMPRESO (P5/P6, v8 «final» del 10/7/2026,
 * `InvitaSystem/expo/diseno/sangre-v2/triptico-paquetes-final.html`): el bloque v6 de Roberto y Sarahi (10/6 12:10 pm,
 * «vuelve el marfil con textos dorados… sobre un fondo pastel») anula al v5 azul; franjas Premium salvia · Álbum vino ·
 * Mini celeste (v7). Fondo = degradado del INTERIOR (#FCF7F4→#F1DFE1): el del exterior baja a #EED9DC y ahí el dorado
 * #7A6238 se queda en 4.29:1 (CODIGO-DE-COLOR-IMPRESOS: «si el fondo se oscurece… oscurecerlos»). Sólo /reserva
 * (el único módulo con `tema: booking`); /expo conserva la paleta del sitio (coincide con el BlackBook). Los tokens
 * --ip-* del sitio se redefinen DENTRO de <main>: botones, `.ojo` y enlaces de base.css toman el tema sin tocar cabecera
 * ni pie. Contraste calculado: InvitaSystem/expo/bitacoras/stand-w2-temas-css.md. */
main[data-tema="booking"] {
  --pq-fondo-1: #FCF7F4; --pq-fondo-2: #F8ECEA; --pq-fondo-3: #F1DFE1;
  --pq-tinta: #1C2733; --pq-texto-2: #4F5663; --pq-rotulo: #7A6238; --pq-ornamento: #C2A878;
  --pq-vino: #7B2435;
  --ip-noche: var(--pq-tinta);
  --ip-marfil: var(--pq-tinta);
  --ip-tinta: var(--pq-tinta);
  --ip-humo: var(--pq-texto-2);
  --ip-oro: var(--pq-rotulo);
  --ip-oro-claro: var(--pq-tinta);
  --ip-oro-oscuro: var(--pq-rotulo);
  display: block;
  background: linear-gradient(158deg, var(--pq-fondo-1) 0%, var(--pq-fondo-2) 45%, var(--pq-fondo-3) 100%);
  color: var(--pq-tinta);
}
main[data-tema="booking"] h1,
main[data-tema="booking"] h2 { color: var(--pq-tinta); }
main[data-tema="booking"] .boton--primario { background: var(--pq-vino); border-color: var(--pq-vino); color: #FFFFFF; }
main[data-tema="booking"] .boton--primario:hover,
main[data-tema="booking"] .boton--primario:focus-visible { background: var(--pq-tinta); border-color: var(--pq-tinta); color: #FFFFFF; }
main[data-tema="booking"] .boton--fantasma { color: var(--pq-tinta); border-color: rgba(28, 39, 51, .45); }
main[data-tema="booking"] .boton--fantasma:hover,
main[data-tema="booking"] .boton--fantasma:focus-visible { color: var(--pq-tinta); border-color: var(--pq-tinta); }
main[data-tema="booking"] .enlace-sec { border-bottom-color: rgba(122, 98, 56, .45); }

/* Banda de paquetes: «caja» clara entre dos filetes de ornamento, con el aire de las demás secciones */
main[data-tema="booking"] .ip2-marfil {
  background: linear-gradient(158deg, #FFFFFF 0%, var(--pq-fondo-1) 100%);
  color: var(--pq-tinta);
  padding-block: calc(var(--sec-pad) * .78);
  border-block: 1px solid var(--pq-ornamento);
}
main[data-tema="booking"] .ip2-marfil p,
main[data-tema="booking"] .ip2-marfil .prosa { color: var(--pq-texto-2); }

main[data-tema="booking"] .ip2-reserva-hero {
  padding-block: var(--sec-pad);
  text-align: center;
  background: transparent;
}
main[data-tema="booking"] .ip2-reserva-hero .prosa {
  margin-inline: auto;
}
main[data-tema="booking"] .ip2-reserva-hero .ctas {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 1rem; margin-top: 1.6rem;
}

main[data-tema="booking"] .ip2-reserva-paquetes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.6rem;
  margin-top: 2.4rem;
  text-align: left;
}

main[data-tema="booking"] .ip2-reserva-paquete {
  background: #FFFFFF;
  border: 1px solid var(--pq-ornamento);
  border-radius: 6px;
  padding: 1.4rem 1.3rem;
  position: relative;
}
main[data-tema="booking"] .ip2-reserva-paquete.destacado {
  border-color: var(--pq-ornamento);
  border-top: 4px solid var(--pq-vino);
  box-shadow: 0 20px 50px -30px rgba(123, 36, 53, .35);
}
main[data-tema="booking"] .ip2-marfil .ip2-reserva-insignia {
  display: inline-block;
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 500;
  color: #FFFFFF;
  background: var(--pq-vino);   /* la pestaña «El más elegido» del tríptico */
  padding: .25rem .6rem;
  margin: 0 0 .6rem;
}
main[data-tema="booking"] .ip2-reserva-paquete h3 {
  color: var(--pq-tinta);
  margin: 0 0 .4rem;
  font-size: 1.2rem;
}
main[data-tema="booking"] .ip2-reserva-resumen {
  color: var(--pq-texto-2);
  font-size: .92rem;
  margin: 0 0 .9rem;
}
main[data-tema="booking"] .ip2-reserva-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: .88rem;
  color: var(--pq-tinta);
}
main[data-tema="booking"] .ip2-reserva-lista li {
  padding: .3rem 0 .3rem 1.2rem;
  position: relative;
  border-top: 1px solid rgba(28, 39, 51, .10);
}
main[data-tema="booking"] .ip2-reserva-lista li:first-child { border-top: none; }
main[data-tema="booking"] .ip2-reserva-lista li::before {
  content: '✓';
  position: absolute; left: 0;
  color: var(--pq-rotulo);
}

main[data-tema="booking"] .ip2-reserva-cta-final {
  margin-top: 2.4rem;
  text-align: center;
}

main[data-tema="booking"] .ip2-vacia {
  color: var(--pq-texto-2);
  margin-top: 1.6rem;
}

/* 10/8/2026 (stand-w3): portada y galería con fotos del estudio (lib/portada-galeria.php). */
main[data-tema="booking"] .ip2-portada {
  margin: 2.2rem auto 0; max-width: 1100px; overflow: hidden; border-radius: 6px;
  border: 1px solid var(--pq-ornamento); aspect-ratio: 21 / 9;
}
main[data-tema="booking"] .ip2-portada img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
@media (max-width: 700px) { main[data-tema="booking"] .ip2-portada { aspect-ratio: 3 / 2; } }
main[data-tema="booking"] .ip2-reserva-galeria { padding-block: calc(var(--sec-pad) * .78); }
main[data-tema="booking"] .ip2-reserva-galeria h2 { margin-bottom: .4rem; }
main[data-tema="booking"] .ip2-galeria { list-style: none; margin: 1.6rem 0 0; padding: 0; columns: 2; column-gap: 10px; text-align: left; }
main[data-tema="booking"] .ip2-galeria li { break-inside: avoid; margin: 0 0 10px; }
main[data-tema="booking"] .ip2-galeria a { display: block; overflow: hidden; border-radius: 6px; outline-offset: 3px; }
main[data-tema="booking"] .ip2-galeria img { display: block; width: 100%; height: auto; transition: transform .35s ease; }
main[data-tema="booking"] .ip2-galeria a:hover img,
main[data-tema="booking"] .ip2-galeria a:focus-visible img { transform: scale(1.03); }
@media (min-width: 700px) { main[data-tema="booking"] .ip2-galeria { columns: 3; column-gap: 14px; } main[data-tema="booking"] .ip2-galeria li { margin-bottom: 14px; } }
@media (min-width: 1100px) { main[data-tema="booking"] .ip2-galeria { columns: 4; } }
@media (prefers-reduced-motion: reduce) { main[data-tema="booking"] .ip2-galeria img { transition: none; } }
