/* Generado por scripts/build.mjs desde bloques/<tipo>/estilos.css. No se edita aquí. */

/* ===== portada ===== */
/* ---------- 6. Héroe ---------- */
/* La foto es una <img> (editable desde el panel) detrás del contenido, con el mismo velo de 60 % */
.heroe{position:relative;isolation:isolate;background:#1a1a1a;color:#fff}
.heroe__fondo{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;object-position:center}
.heroe::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.6)}
.heroe__contenido{padding:calc(var(--hdr-h) + var(--hero-t)) 0 var(--hero-b);text-align:center}
.heroe__titulo{grid-column:var(--c-hero-h)}
.heroe__texto{grid-column:var(--c-hero-p);margin-top:16px;color:rgba(255,255,255,.7)}
.heroe__cta{grid-column:1/-1;margin-top:40px;display:flex;justify-content:center}


/* ===== servicios ===== */
/* ---------- 8. Lo que hacemos (servicios) ---------- */
.servicio{grid-column:var(--c-svc);text-align:center;position:relative}
.servicio__icono{height:56px;display:flex;align-items:center;justify-content:center;color:var(--acento)}
.servicio__icono .icono{width:52px;height:52px;display:block}
.servicio h3{margin:16px 0 8px}
.servicio::before,.servicio::after{content:"";position:absolute;background:var(--pleca);pointer-events:none;display:none}
.servicio::before{left:calc(var(--gut) / -2);top:0;bottom:0;width:1px}
.servicio::after{left:0;right:0;top:-24px;height:1px}
.servicio + .servicio::after{display:block}
@media (min-width:600px) and (max-width:1023.98px){
  .servicio + .servicio::after{display:none}
  .servicio:nth-of-type(2)::before{display:block;bottom:-24px}
  .servicio:nth-of-type(4)::before{display:block;top:-24px}
  .servicio:nth-of-type(3)::after{display:block;right:calc(var(--gut) / -2)}
  .servicio:nth-of-type(4)::after{display:block;left:calc(var(--gut) / -2)}
}
@media (min-width:1024px){
  .servicio + .servicio::after{display:none}
  .servicio + .servicio::before{display:block}
}


/* ===== imagen_texto ===== */
/* ---------- 9. Cómo empezamos ---------- */
.historia{background:#F8F6F4;container-type:inline-size}
.historia__reticula{display:grid;grid-template-columns:var(--ab-cols);column-gap:0;align-items:stretch}
.historia__imagen{position:relative;min-width:0;min-height:var(--ab-img-h);overflow:hidden}
.historia__imagen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Caja de texto con margen recíproco, proporcional a la tipografía */
.historia__texto{padding:var(--ab-in);display:flex;flex-direction:column;justify-content:space-between;gap:var(--h3-l)}
.historia--espejo .historia__imagen{order:var(--ab-ord)}
.historia__cuerpo h2{margin:0 0 var(--h3-l)}



/* ===== galeria ===== */
/* ---------- 10. El espacio (galería) ---------- */
.foto{grid-column:var(--c-gal);position:relative;container-type:inline-size;border-radius:8px;overflow:hidden}
.foto img{width:100%;height:round(down, 128cqw, 8px);object-fit:cover}
.foto figcaption{position:absolute;left:0;right:0;bottom:0;padding:16px;background:linear-gradient(0deg,rgba(0,0,0,.4),transparent);color:#fff;text-align:center;text-shadow:0 0 1.5px #000}


/* ===== equipo ===== */
/* ---------- 11. El equipo ---------- */
.persona{grid-column:var(--c-card);text-align:center}
.persona__foto{container-type:inline-size}
.persona__foto img{width:100%;height:round(down, 127cqw, 8px);object-fit:cover;border-radius:8px}
.persona h3{margin:24px 0 8px}
.persona .t-cargo{margin-bottom:8px}


/* ===== testimonios ===== */
/* ---------- 12. Testimonios ---------- */
.fondo-oscuro .t-h2{color:#fff}
.fondo-oscuro .intro .t-ld{color:#ffffffb3}
.testimonio{grid-column:var(--c-card);padding:32px;border-radius:8px;box-shadow:inset 0 0 0 1px #ffffff1a}
.estrellas{color:var(--estrella)}
.testimonio__cita{margin:16px 0 32px;color:#ffffffe6}
.testimonio__autor{display:flex;gap:16px;align-items:center;color:#fff}
.testimonio__autor img{width:48px;height:48px;border-radius:50%;object-fit:contain;flex:none}


/* ===== precios ===== */
/* ---------- 13. Paquetes ----------
   Las tarjetas comparten 5 filas (subgrid): encabezado · pleca · precio · lista · botón */
.paquete{grid-column:var(--c-card);grid-row:span 5;display:grid;grid-template-rows:subgrid;row-gap:0;padding:32px 32px 40px;border-radius:12px;background:#fff}
.paquete__encabezado{align-self:end}
.paquete__encabezado h3{margin-bottom:8px}
.paquete__encabezado p{margin-bottom:24px}
.paquete__pleca{height:1px;background:var(--pleca);margin-bottom:23px}
.paquete__precio{margin-bottom:48px}
.paquete__precio .t-pr{color:var(--oro)}
.paquete__lista{display:flex;flex-direction:column;gap:8px;align-self:start;list-style:none;margin:0;padding:0}
.paquete__lista li{display:flex;gap:16px;align-items:flex-start}
.vineta{color:var(--acento)}
.paquete__boton{display:block;align-self:end;margin-top:32px;height:56px;border-radius:4px;box-shadow:inset 0 0 0 1px var(--pleca);color:#405861;font-size:13px;line-height:56px;letter-spacing:2px;text-transform:uppercase;text-align:center;transition:box-shadow .2s,background-color .2s}
.paquete__boton:hover{box-shadow:inset 0 0 0 1px var(--acento);text-decoration:none}
.paquete__boton span{display:block;position:relative;top:-1.01px}
.paquete--destacado{background:#1a1a1a;color:#fff}
.paquete--destacado .gris{color:#ffffffb3}
.paquete--destacado .paquete__pleca{background:rgba(255,255,255,.15)}
.paquete--destacado .paquete__boton{background:var(--oro);box-shadow:none;color:#000}
.paquete--destacado .paquete__boton:hover{background:#c39a6a}
.etiqueta{display:flex;margin-bottom:16px}
.etiqueta p{height:24px;padding:0 12px;border-radius:3px;background:var(--oro);color:#000;font-size:11px;line-height:24px;letter-spacing:2px;text-transform:uppercase}
.etiqueta span{position:relative;top:-.24px}


/* ===== reservaciones ===== */
/* ---------- 14. Reserva ---------- */
.reserva .reticula{align-items:start}
.reserva__info{grid-column:var(--c-book-l)}
.reserva__info h2{margin-bottom:24px}
.reserva__info > .t-ld{margin-bottom:40px}
.contacto{display:flex;flex-direction:column;gap:24px}
.contacto > div{display:flex;gap:16px;align-items:flex-start}
.contacto .t-icono{color:var(--estrella)}
.reserva__tarjeta{grid-column:var(--c-book-r);padding:40px;border-radius:8px;background:#fff}
.reserva__tarjeta h3{margin-bottom:8px}

