/*
Theme Name: Hotel Isla Múcura
Theme URI: https://hotelislamucura.com
Author: Hotel Isla Múcura
Description: Tema a medida para Hotel Isla Múcura — hotel boutique frente al mar en el Archipiélago de San Bernardo, Caribe colombiano. Convertido del prototipo HTML fiel al diseño real del cliente.
Version: 1.0.6
Text Domain: hotel-mucura
*/

:root{
	--color-arena: #F6EEE1;
	--color-arena-oscura: #EADFC9;
	--color-crema: #F7F3EA;
	--color-verde: #3F4A33;
	--color-verde-oscuro: #2E3627;
	--color-terracota: var(--color-verde);
	--color-terracota-oscura: var(--color-verde-oscuro);
	--color-turquesa: #1F6F6F;
	--color-turquesa-oscura: #16504F;
	--color-texto: #262620;
	--color-texto-suave: #6B6255;
	--color-blanco: #FFFFFF;
	--fuente-display: 'Taviraj', 'Georgia', serif;
	--fuente-texto: 'Work Sans', 'Helvetica Neue', Arial, sans-serif;
	--radio: 14px;
	--sombra: 0 20px 40px rgba(42, 36, 32, 0.12);

	/* Paleta real de marca (muestreada del PDF Home-Page-Hotel-Isla-Muruca.pdf) */
	--color-header: #594D42;
	--color-seccion-crema: #F5EEE5;
	--color-seccion-verde: #8C9576;
	--color-caja-verde: #C0C6AF;
	--color-texto-oscuro: #2A2320;
	--color-texto-marron: #5B4C40;
	--color-dorado: #D6B99E;
	--color-dorado-estrella: #C4996F;
}

/* ============ Header real del sitio (fiel al PDF Home) ============ */
.site-header-real{
	background:var(--color-header); color:var(--color-cream, #FBF0E6);
	position:sticky; top:0; z-index:200;
}
.header-top-row{
	font-family:var(--fuente-texto); font-size:11.2px; font-weight:400;
	border-bottom:1px solid rgba(251,240,230,.12);
}
.header-top-inner{
	display:flex; align-items:center; gap:1.5em; flex-wrap:wrap;
	max-width:1260px; margin:0 auto; padding:.5em clamp(24px, 6vw, 72px);
}
.header-top-row .estrella{ color:var(--color-dorado-estrella); }
.header-top-row .sep{ opacity:.5; }
.header-top-left{ display:flex; align-items:center; gap:1.5em; flex-wrap:wrap; }
.header-top-right{ display:flex; align-items:center; gap:1.2em; margin-left:auto; }
.header-top-right .lang{ display:flex; gap:.3em; font-weight:600; }
.header-main-row{
	display:flex; align-items:center; justify-content:space-between; gap:2em;
	max-width:1260px; margin:0 auto; padding:.9em clamp(24px, 6vw, 72px);
}
.header-main-row nav ul{ list-style:none; display:flex; align-items:center; gap:2em; margin:0; padding:0; }
.header-main-row nav li{ position:relative; display:flex; align-items:center; }
.header-main-row nav a{
	display:flex; align-items:center;
	font-family:var(--fuente-texto); font-size:11.5px; font-weight:500;
	letter-spacing:.04em; text-transform:uppercase; color:rgba(251,240,230,.85);
}
.header-main-row nav a:hover{ opacity:.8; }
.header-main-row .btn-reservar{
	background:#FBF0E6; color:var(--color-texto-oscuro);
	font-family:var(--fuente-display); font-weight:400; font-size:15.2px;
	padding:.7em 1.6em; border-radius:999px;
}

/* ============ Submenú (desplegable) ============ */
.header-main-row nav .menu-item-has-children > a{ display:flex; align-items:center; gap:.35em; }
.header-main-row nav .menu-item-has-children > a::after{ content:"▾"; font-size:.65em; opacity:.7; }
.header-main-row nav ul ul{
	display:none; position:absolute; top:100%; left:0; z-index:50;
	flex-direction:column; gap:0; margin:0; padding:.5em 0; list-style:none;
	background:var(--color-header); min-width:250px; border-radius:10px;
	box-shadow:0 16px 34px rgba(0,0,0,.22);
}
.header-main-row nav li:hover > ul,
.header-main-row nav li.is-open > ul{ display:flex; }
.header-main-row nav ul ul li{ width:100%; }
.header-main-row nav ul ul a{
	display:block; padding:.65em 1.3em; font-weight:500; white-space:nowrap; opacity:1;
}
.header-main-row nav ul ul a:hover{ background:rgba(251,240,230,.1); }
.header-main-row nav ul ul .menu-item-has-children > a::after{ display:none; }

/* ============ Menú móvil (hamburguesa) ============ */
.mobile-menu-toggle{
	display:none; background:none; border:0; cursor:pointer; padding:8px; margin-left:.4em;
}
.mobile-menu-toggle span{
	display:block; width:22px; height:2px; background:#FBF0E6; margin:5px 0; transition:transform .2s, opacity .2s;
}
.mobile-menu-toggle.is-active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.mobile-menu-toggle.is-active span:nth-child(2){ opacity:0; }
.mobile-menu-toggle.is-active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width: 720px){
	.header-main-row{ flex-wrap:wrap; }
	.mobile-menu-toggle{ display:block; order:1; }
	.header-main-row .btn-reservar{ order:2; }
	.header-main-row nav{ display:none; width:100%; order:3; flex-basis:100%; }
	.header-main-row nav.is-open{ display:block; }
	.header-main-row nav ul{ flex-direction:column; gap:0; padding:.5em 0 1.2em; }
	.header-main-row nav li{ width:100%; border-top:1px solid rgba(251,240,230,.14); }
	.header-main-row nav a{ display:block; padding:.9em 0; }
	.header-main-row nav li:hover > ul{ display:none; }
	.header-main-row nav li.is-open > ul{ display:flex; }
	.header-main-row nav ul ul{
		position:static; box-shadow:none; background:rgba(0,0,0,.16); border-radius:0; padding:0 0 0 1em;
	}
	.header-main-row nav .menu-item-has-children > a::after{ content:"+"; margin-left:auto; }
	.header-main-row nav li.is-open > a::after{ content:"–"; }
}

/* ============ Barra de confianza bajo el hero ============ */
.trust-bar{
	background:var(--color-seccion-crema); color:#5B4C40;
	display:flex; flex-wrap:wrap; justify-content:center; gap:.6em 2em; align-items:center;
	padding:1em 6vw; font-family:var(--fuente-texto); font-size:12px;
}
.trust-bar strong{ color:#5B4C40; }
.trust-bar .estrellas{ color:#C4996F; }
.trust-bar .sep{ opacity:.4; }

/* ============ Patrón reutilizable: intro de sección ============ */
/*
 * Textura de fondo con hojas grandes y muy tenues, presente en el diseño real
 * sobre fondo verde Y crema (confirmado con capturas del cliente). Es la misma
 * imagen extraída del PDF (images/textura-hojas-verde.jpg — ahí viene en tonos
 * teal/menta a escala de patrón chico) reescalada mucho más grande y aclarada
 * con filtros CSS para lograr el aspecto "apenas visible" del original, en vez
 * de usar sus colores/escala originales tal cual.
 */
.seccion-verde, .seccion-crema{ position:relative; overflow:hidden; }
.seccion-verde > .container, .seccion-crema > .container{ position:relative; z-index:1; }
.seccion-verde::before, .seccion-crema::before{
	content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
	/* background-image se inyecta en wp_head (functions.php) apuntando a Medios */
	background-size:1500px auto; background-position:center;
}
.seccion-verde{ background-color:var(--color-seccion-verde); color:#FBF0E6; }
.seccion-verde::before{ filter:grayscale(1) brightness(1.55) contrast(.6); opacity:.09; }
.seccion-crema{ background-color:var(--color-seccion-crema); color:var(--color-texto-oscuro); }
.seccion-crema::before{ filter:grayscale(1) sepia(1) hue-rotate(-8deg) saturate(1.1) brightness(1.15) contrast(.65); opacity:.1; }
.seccion-intro{ max-width:640px; }
.seccion-kicker{
	font-family:var(--fuente-texto); font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
	opacity:1; margin-bottom:.6em; display:block; color:#8A6236;
}
.seccion-verde .seccion-kicker{ color:#5B4C40; opacity:1; }
.breadcrumbs{
	font-family:var(--fuente-texto); font-size:11px; font-weight:400; letter-spacing:.01em;
	margin-bottom:2.2em; display:block;
}
.breadcrumbs a{ color:inherit; opacity:.7; text-decoration:none; }
.breadcrumbs a:hover{ opacity:1; text-decoration:underline; }
.breadcrumbs .sep{ margin:0 .5em; opacity:.4; }
.breadcrumbs .actual{ opacity:1; }
.breadcrumbs-oscuro{ color:#FBF0E6; }
.breadcrumbs-claro{ color:#8A6236; }
/* Heroes muy altos (.hero, con imagen de fondo grande): el contenido se
   centra o ancla abajo, así que el breadcrumb va aparte, pegado arriba de
   toda la sección en vez de "top" relativo al bloque de texto. */
.hero-breadcrumb-top{
	position:absolute; top:28px; left:0; right:0; z-index:2;
	max-width:1260px; margin:0 auto; padding:0 clamp(24px, 6vw, 72px);
}
.hero-breadcrumb-top .breadcrumbs{ position:static; }
.seccion-titulo{
	display:flex; align-items:center; gap:1.2em; margin-bottom:.6em;
}
.seccion-titulo h2{
	font-family:var(--fuente-display); font-weight:300; font-style:normal;
	font-size:clamp(2rem, 4vw, 49px); margin:0; color:#8A6236;
	text-transform:uppercase; letter-spacing:normal;
}
.seccion-verde .seccion-titulo h2{ color:#5B4C40; }
.seccion-titulo .linea{ flex:1; height:1px; background:currentColor; opacity:.3; }
.seccion-comparar .seccion-titulo .linea{ background:#5B4C40; opacity:.4; }
.seccion-intro > p{
	font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.3; color:#2A2320;
}
.seccion-verde .seccion-intro > p{ color:#FBF0E6; }
.seccion-intro > p + p{
	font-family:var(--fuente-texto); font-weight:400; font-size:15px; line-height:1.5; color:#5B4C40;
}
.seccion-verde .seccion-intro > p + p{ color:#FBF0E6; }

/*
 * Mini-label vertical: el texto se sienta sobre el MISMO eje que el filete
 * (no al lado) — el filete sube hasta el texto, se corta, y sigue después.
 * Por eso es una sola columna (filete arriba + texto + filete abajo), no dos
 * columnas lado a lado.
 */
.seccion-marca{ display:flex; gap:1.3em; align-items:stretch; }
.marca-vertical{ display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
.marca-vertical .linea-v{ width:1px; background:currentColor; opacity:.35; }
.marca-vertical .linea-v:first-child{ flex:0 0 32px; }
.marca-vertical .linea-v:last-child{ flex:1 1 auto; }
.marca-vertical .vertical{
	writing-mode:vertical-rl; transform:rotate(180deg); font-size:.6rem; letter-spacing:.13em;
	text-transform:uppercase; opacity:.65; white-space:nowrap; padding:.6em 0; flex-shrink:0;
}
.seccion-marca .seccion-intro{ flex:1; }
.marca-contenido{ flex:1; min-width:0; }
.seccion-intro > p{ font-size:1.05rem; }
.seccion-cta{ margin-top:1.4em; }
.btn-pill{
	display:inline-flex; align-items:center; padding:.85em 1.7em; border-radius:999px;
	border:1.3px solid currentColor; font-family:var(--fuente-display); font-weight:400; font-size:16px;
	background:none; color:inherit;
	cursor:pointer;
}
.btn-pill:hover{ background:rgba(255,255,255,.12); }
.seccion-crema .btn-pill:hover{ background:rgba(0,0,0,.05); }
.seccion-head-row{
	display:flex; justify-content:space-between; align-items:flex-end; gap:2em; flex-wrap:wrap; margin-bottom:3em;
}

/* ============ Oasis del alma (bienvenida) ============ */
.oasis{
	position:relative; background-size:cover; background-position:center;
	background-color:var(--color-seccion-verde); padding:110px 0;
}
.oasis-container{ width:90%; max-width:none; margin:0 auto; padding:0; position:relative; z-index:1; }
.oasis .grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.oasis-kicker{
	display:block; font-family:var(--fuente-texto); font-weight:600; font-size:24px;
	color:#5B4C40; margin-bottom:.4em;
}
.oasis-h2{
	font-family:var(--fuente-display); font-weight:300; font-style:normal;
	font-size:clamp(2.6rem,7vw,6rem); line-height:1.02; color:#5B4C40; margin:0 0 .3em;
}
.oasis-lead{
	font-family:var(--fuente-display); font-weight:400; font-style:normal;
	font-size:32px; line-height:1.3; color:#FBF0E6; margin:0 0 .8em;
}
.oasis .descripcion{
	font-family:var(--fuente-texto); font-weight:400; font-size:24px; line-height:1.45;
	color:#FBF0E6; opacity:1; max-width:56ch;
}
.oasis .pilares{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5em; margin-top:2.5em; }
.oasis .pilar h4{
	font-family:var(--fuente-display); font-weight:300; font-size:20px;
	color:#FBF0E6; margin-bottom:.3em; text-transform:uppercase; letter-spacing:.03em;
}
.oasis .pilar p{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#FBF0E6; opacity:.9; margin:0; }
.oasis .foto-arco{
	border-radius:280px 280px 16px 16px; overflow:hidden; box-shadow:var(--sombra);
	aspect-ratio:3/4; width:100%; max-width:600px; margin:0 auto;
}
.oasis .foto-arco img{ width:100%; height:100%; object-fit:cover; }

/* ============ Alojamientos preview ============ */
.alojamientos-preview .seccion-kicker{
	font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#8A6236;
}
.alojamientos-preview .seccion-titulo h2{
	font-family:var(--fuente-display); font-weight:300; font-style:normal;
	font-size:49px; color:#8A6236; text-transform:uppercase; letter-spacing:normal;
}
.alojamientos-preview .seccion-intro > p{
	font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.3; color:#2A2320;
}
.alojamientos-preview .marca-vertical .vertical{
	font-family:var(--fuente-texto); font-weight:400; font-size:9px; color:#5B4C40; opacity:1;
}
.alojamientos-preview .btn-pill{
	font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320;
}
.alojamientos-preview .habitaciones-grid{ margin-top:1em; }
.alojamientos-preview .habitacion-card .foto{ aspect-ratio:4/5; position:relative; }
.alojamientos-preview .habitacion-card .foto::after{
	content:""; position:absolute; inset:0;
	background:linear-gradient(0deg, rgba(20,20,15,.65) 0%, rgba(20,20,15,0) 55%);
}
.alojamientos-preview .habitacion-card .foto-label{
	position:absolute; left:0; right:0; bottom:0; z-index:1; padding:1em 1.2em; color:#FBF0E6;
}
.alojamientos-preview .habitacion-card .foto-label h3{
	font-family:var(--fuente-display); font-weight:300; font-size:30px;
	color:#FBF0E6; margin:0 0 .15em; text-transform:none;
}
.alojamientos-preview .habitacion-card .foto-label span{
	font-family:var(--fuente-texto); font-weight:400; font-size:12px; color:#FBF0E6; opacity:1;
}
.alojamientos-preview .habitacion-card .info{
	display:flex; justify-content:space-between; align-items:center; padding:1em 0; background:none; box-shadow:none;
}
.alojamientos-preview .habitacion-card{ display:block; background:none; box-shadow:none; border-radius:0; }
.alojamientos-preview .habitacion-card .foto{ border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); }
.alojamientos-preview .habitacion-card .cama{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; }
.alojamientos-preview .habitacion-card .ver-mas{ font-family:var(--fuente-texto); font-weight:600; font-size:14px; color:#8A6236; }
.ver-mas{ white-space:nowrap; }

/* ============ Incluido ============ */
.incluido-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:2.5em; align-items:start; margin-top:3em; }
.incluido-lista{ list-style:none; margin:0; padding:0; }
.incluido-lista li{ display:flex; gap:.8em; padding:.9em 0; border-bottom:1px solid rgba(255,255,255,.18); font-size:.92rem; }
.seccion-crema .incluido-lista li{ border-bottom-color:rgba(0,0,0,.1); }
.incluido-lista .marca{ flex-shrink:0; opacity:.8; }
.incluido-lista h5{ font-size:.7rem; text-transform:uppercase; letter-spacing:.14em; margin:0 0 1em; opacity:.7; }

.seccion-incluido .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#5B4C40; }
.seccion-incluido .seccion-titulo h2{
	font-family:var(--fuente-display); font-weight:300; font-size:49px;
	color:#5B4C40; text-transform:uppercase; letter-spacing:normal;
}
.seccion-incluido .seccion-titulo .linea{ background:#5B4C40; opacity:.4; }
.seccion-incluido .incluido-lead{
	font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.25;
	color:#FBF0E6; margin:0 0 .5em;
}
.seccion-incluido .incluido-sub{ font-family:var(--fuente-texto); font-weight:400; font-size:15px; color:#FBF0E6; opacity:1; }
.seccion-incluido .btn-pill{
	background:#FBF0E6; border-color:#FBF0E6;
	font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320;
}
.seccion-incluido .incluido-lista h5{ font-family:var(--fuente-texto); font-weight:400; font-size:10px; color:#FBF0E6; opacity:1; }
.seccion-incluido .incluido-lista li{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#FBF0E6; }
.seccion-incluido .incluido-viene .marca{ color:#698047; opacity:1; }
.seccion-incluido .incluido-aparte .marca{ color:#8A6236; opacity:1; }
.tarifas-caja{
	background:var(--color-caja-verde); color:var(--color-texto-oscuro); border-radius:var(--radio);
	padding:1.6em; font-size:.95rem; line-height:1.7;
}
.tarifas-caja strong{ display:block; }

/* ============ Cómo llegar ============ */
.llegar-grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; align-items:start; }
.mapa-diagrama{
	background-image:
		linear-gradient(rgba(42,35,32,.08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(42,35,32,.08) 1px, transparent 1px);
	background-size:60px 60px;
	padding:1.5em 0;
	font-size:.85rem;
}
.mapa-diagrama img{ width:100%; height:auto; display:block; margin-bottom:1em; }
.mapa-diagrama .caption{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--color-texto-suave); }
.tabla-llegar{ width:100%; border-collapse:collapse; margin-top:1.5em; font-size:.88rem; }
.tabla-llegar th{ text-align:left; font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; color:var(--color-texto-suave); padding:0 1.4em .6em 0; border-bottom:1px solid rgba(0,0,0,.1); }
.tabla-llegar td{ padding:.9em 1.4em .9em 0; border-bottom:1px solid rgba(0,0,0,.08); vertical-align:top; }
.tag-consultar{ background:var(--color-caja-verde); color:var(--color-texto-oscuro); border-radius:999px; padding:.3em .8em; font-size:.78rem; font-weight:600; white-space:nowrap; }
.tabla-nota{ font-size:.78rem; color:var(--color-texto-suave); margin-top:1em; }

.seccion-llegar .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#8A6236; }
.seccion-llegar .seccion-titulo h2{
	font-family:var(--fuente-display); font-weight:300; font-size:49px;
	color:#8A6236; text-transform:uppercase; letter-spacing:normal;
}
.seccion-llegar .seccion-titulo .linea{ background:#8A6236; opacity:.4; }
.seccion-llegar .llegar-lead{
	font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.25;
	color:#2A2320; margin:0 0 .5em;
}
.seccion-llegar .llegar-sub{ font-family:var(--fuente-texto); font-weight:400; font-size:15px; color:#5B4C40; }
.seccion-llegar .btn-pill{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; }
.seccion-llegar .tabla-llegar th{
	font-family:var(--fuente-texto); font-weight:400; font-size:10px; text-transform:uppercase;
	letter-spacing:.05em; color:#5B4C40; opacity:1;
}
.seccion-llegar .tabla-llegar td{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#5B4C40; }
.seccion-llegar .tabla-llegar td strong{ font-weight:400; }
.seccion-llegar .tag-consultar{
	background:rgba(214,185,158,.35); color:#5B4C40;
	font-family:var(--fuente-texto); font-weight:700; font-size:15px;
	display:inline-flex; align-items:flex-start; gap:.6em;
	padding:.9em 1.4em; border-radius:24px; line-height:1.3;
	white-space:normal; text-align:left;
}
.seccion-llegar .tag-consultar .dot{
	width:8px; height:8px; border-radius:50%; background:#C4996F; flex-shrink:0; margin-top:.45em;
}
@media (max-width:680px){
	.tabla-llegar{ display:block; width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
	.tabla-llegar th, .tabla-llegar td{ white-space:nowrap; }
}

/* ============ Experiencias (scroll horizontal) ============ */
.scroll-cards{
	display:flex; gap:1.6em; overflow-x:auto; padding-bottom:1em; margin-top:2.5em; scrollbar-width:thin;
	-webkit-mask-image:linear-gradient(to right, #000 calc(100% - 90px), transparent 100%);
	mask-image:linear-gradient(to right, #000 calc(100% - 90px), transparent 100%);
}
.scroll-cards.is-scrolled{
	-webkit-mask-image:linear-gradient(to right, transparent 0, #000 90px, #000 calc(100% - 90px), transparent 100%);
	mask-image:linear-gradient(to right, transparent 0, #000 90px, #000 calc(100% - 90px), transparent 100%);
}
.scroll-card{ flex:0 0 260px; min-width:0; display:block; }
.scroll-card .foto{ aspect-ratio:4/3; border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); margin-bottom:1em; }
.seccion-elmar .scroll-card .foto{ aspect-ratio:3/4; }
.scroll-card-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:.6em; margin-bottom:.3em; }
.scroll-card h4{ font-size:1rem; margin:0; min-width:0; }
.scroll-card .precio{ font-size:.85rem; font-weight:700; color:var(--color-dorado); flex-shrink:0; text-align:right; }
.seccion-crema .scroll-card .precio{ color:#9C7A4E; }
.scroll-card p{ font-size:.85rem; opacity:.85; margin:0; }

.seccion-elmar .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#5B4C40; }
.seccion-elmar .seccion-titulo h2{
	font-family:var(--fuente-display); font-weight:300; font-size:49px;
	color:#5B4C40; text-transform:uppercase; letter-spacing:normal;
}
.seccion-elmar .seccion-titulo .linea{ background:#5B4C40; opacity:.4; }
.seccion-elmar .elmar-lead{
	font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.3;
	color:#FBF0E6; opacity:.85;
}
.seccion-elmar .btn-pill{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#FBF0E6; border-color:#FBF0E6; }
.seccion-elmar .scroll-card h4{ font-family:var(--fuente-display); font-weight:300; font-size:21px; color:#2A2320; line-height:1.2; text-transform:uppercase; }
.seccion-elmar .scroll-card .precio{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; }
.seccion-elmar .scroll-card .precio.tag-consultar{
	font-family:var(--fuente-texto); font-weight:700; font-size:10px; color:#5B4C40;
	background:rgba(214,185,158,.55); display:inline-flex; align-items:center; gap:.4em;
	padding:.45em .8em; border-radius:999px; white-space:nowrap; line-height:1;
}
.seccion-elmar .scroll-card .precio.tag-consultar .dot{
	width:5px; height:5px; border-radius:50%; background:#C4996F; flex-shrink:0; margin-top:0;
}
.seccion-elmar .scroll-card p{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; opacity:1; }

/* ============ Gastronomía / Bienestar (fotos en arco superpuestas) ============ */
.arco-doble{ position:relative; height:420px; }
.arco-doble .foto-a, .arco-doble .foto-b{
	position:absolute; width:56%; aspect-ratio:3/4; border-radius:140px 140px 12px 12px;
	overflow:hidden; box-shadow:var(--sombra);
}
.arco-doble .foto-a{ left:0; top:40px; z-index:1; }
.arco-doble .foto-b{ right:0; top:0; z-index:2; }
.arco-doble img{ width:100%; height:100%; object-fit:cover; }

/* Fotos ya recortadas en arco con transparencia propia (PNG con alfa): sin
   recorte ni radio adicional de CSS, para no imponer una forma uniforme
   sobre dos imágenes que no comparten la misma silueta. */
.arco-doble-recortado{ height:auto; display:flex; align-items:center; }
.arco-doble-recortado .foto-a, .arco-doble-recortado .foto-b{
	position:static; aspect-ratio:auto; height:auto; border-radius:0; overflow:visible; box-shadow:none;
}
.arco-doble-recortado .foto-a{ width:56%; flex-shrink:0; }
.arco-doble-recortado .foto-b{ width:44%; flex-shrink:0; margin-left:-16%; }
.arco-doble-recortado img{ width:100%; height:auto; object-fit:contain; filter:drop-shadow(0 16px 26px rgba(42,36,32,.18)); }

/* Variante invertida: la foto B (derecha) es la más grande y queda más
   arriba; la foto A (izquierda) es más chica y queda más abajo, asomando
   detrás. */
.arco-doble-invertido{ align-items:flex-start; }
.arco-doble-invertido .foto-a{ width:57%; margin-top:110px; z-index:2; }
.arco-doble-invertido .foto-b{ width:64%; margin-left:-18%; margin-top:0; z-index:1; }
.franja-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.franja-datos{ display:flex; gap:2.5em; margin-top:1.5em; padding-top:1.2em; border-top:1px solid rgba(0,0,0,.1); }
.seccion-verde .franja-datos{ border-top-color:rgba(255,255,255,.2); }
.franja-datos h5{
	font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.12em;
	text-transform:uppercase; opacity:1; color:#5B4C40; margin:0 0 .3em;
}
.seccion-verde .franja-datos h5{ color:#FBF0E6; opacity:.85; }
.franja-datos p{
	font-family:var(--fuente-display); font-weight:300; font-size:21px; color:#2A2320; margin:0;
}
.seccion-verde .franja-datos p{ color:#FBF0E6; }

/* ============ Celebraciones ============ */
.celebraciones{
	position:relative; min-height:640px; display:flex; align-items:center;
	background-size:cover; background-position:center; color:#fff;
}
.celebraciones::before{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(245,238,225,.82) 0%, rgba(245,238,225,.55) 32%, rgba(245,238,225,0) 55%); }
.celebraciones .container{ position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:stretch; width:100%; }
.celebraciones .seccion-intro{ height:100%; display:flex; flex-direction:column; }
.celebraciones .seccion-intro .celebrar-centro{ margin-top:auto; margin-bottom:auto; }
.celebraciones .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#8A6236; opacity:1; }
.celebraciones h2{
	font-family:var(--fuente-display); font-weight:300; font-style:normal;
	font-size:clamp(2.6rem, 6vw, 84px); color:#2A2320; text-transform:uppercase; letter-spacing:normal;
}
.celebraciones .seccion-titulo .linea{ background:#2A2320; }
.celebraciones .seccion-intro > p{
	font-family:var(--fuente-display); font-weight:400; font-size:32px; line-height:1.3; color:#2A2320;
}
.celebraciones .btn-pill{ font-family:var(--fuente-display); font-weight:400; font-size:20px; color:#2A2320; border-color:#2A2320; }
.propuesta-form{
	background:#CDC3B2; color:var(--color-texto-oscuro); border-radius:var(--radio);
	padding:2em; box-shadow:var(--sombra);
}
.propuesta-form .seccion-kicker{ font-family:var(--fuente-texto); font-weight:400; font-size:20px; color:#8A6236; opacity:1; letter-spacing:.1em; }
.propuesta-form h3{ margin:0 0 .3em; font-family:var(--fuente-display); font-weight:300; font-size:30px; color:#2A2320; }
.propuesta-form > p{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#5B4C40; margin-bottom:1.4em; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1em; margin-bottom:1em; }
.form-grid > div{ display:flex; flex-direction:column; justify-content:flex-end; }
.form-grid label, .form-full label{
	display:block; font-family:var(--fuente-texto); font-weight:600; font-size:13px; color:#2A2320; margin-bottom:.4em;
}
.form-grid input, .form-full input, .form-full textarea{
	width:100%; border:1px solid rgba(0,0,0,.15); border-radius:8px; padding:.7em .9em; font-family:var(--fuente-texto); font-size:.9rem;
}
.form-full{ margin-bottom:1em; }
.form-check{
	display:flex; gap:.6em; align-items:flex-start; margin-bottom:1.2em;
	font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40;
}
.form-check input[type="checkbox"]{ flex-shrink:0; margin-top:.2em; }
.form-check a{ color:inherit; text-decoration:underline; }

/* ============ Opiniones ============ */
.opiniones-layout{ display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:start; }
.opiniones-grid{ display:grid; grid-template-columns:1fr 1fr; gap:3em; padding-top:1.6em; margin-top:0; }
.opinion-fuente{ border-top:1px solid rgba(255,255,255,.25); padding-top:1.4em; }
.opinion-fuente h4{ font-family:var(--fuente-texto); font-weight:600; font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:#FBF0E6; opacity:.85; margin:0 0 .5em; }
.opinion-fuente .rating{ font-family:var(--fuente-display); font-weight:300; font-size:2.6rem; color:#FBF0E6; margin:0; }
.opinion-fuente .rating .estrellas{ font-size:1rem; color:var(--color-dorado-estrella); margin-left:.4em; }
.opinion-fuente p{ font-family:var(--fuente-texto); font-size:.85rem; color:#FBF0E6; opacity:.85; margin:.5em 0; }
.opinion-fuente a{ font-family:var(--fuente-texto); font-size:.85rem; font-weight:700; color:#FBF0E6; text-decoration:underline; }
.dist-calificaciones{ margin-top:2.5em; }
.dist-calificaciones h5{
	font-family:var(--fuente-texto); font-weight:600; font-size:.7rem; text-transform:uppercase;
	letter-spacing:.12em; color:#FBF0E6; opacity:.85; margin-bottom:1.2em;
}
.dist-row{ display:flex; align-items:center; gap:1em; font-size:.82rem; color:#FBF0E6; margin-bottom:.6em; }
.dist-row .dist-label{ width:2.4em; flex-shrink:0; font-weight:600; }
.dist-row .barra{ flex:1; height:6px; background:rgba(255,255,255,.25); border-radius:99px; overflow:hidden; }
.dist-row .barra span{ display:block; height:100%; background:var(--color-verde-oscuro); }
.dist-row .pct{ width:3ch; text-align:right; opacity:.9; }
.dist-nota{ font-family:var(--fuente-texto); font-size:.78rem; color:#FBF0E6; opacity:.75; margin-top:1.2em; max-width:44ch; }

/* ============ Guía ============ */
.seccion-split{ display:grid; grid-template-columns:.62fr 1.38fr; gap:60px; align-items:start; }
.seccion-split .seccion-intro{ max-width:none; }

.guia-links{ display:grid; grid-template-columns:1fr 1fr; gap:0 3em; margin-top:0; align-self:start; }
.guia-links a{
	display:flex; justify-content:space-between; align-items:center; padding:1.1em 0;
	border-bottom:1px solid rgba(0,0,0,.1); font-family:var(--fuente-display); font-weight:300;
	font-size:20px; letter-spacing:.03em; text-transform:uppercase; color:#2A2320;
}
.guia-links a span{ color:#C4996F; font-weight:400; }

/* ============ FAQ ============ */
.faq-list{ margin-top:0; }
.faq-item{ border-bottom:1px solid rgba(0,0,0,.1); padding:1.3em 0; }
.faq-item summary{
	display:flex; justify-content:space-between; align-items:center; cursor:pointer; list-style:none;
	font-family:var(--fuente-display); font-weight:400; font-size:18px; color:#2A2320;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .signo{
	font-size:.85rem; flex-shrink:0; width:1.8em; height:1.8em; border-radius:50%;
	border:1px solid rgba(0,0,0,.2); display:flex; align-items:center; justify-content:center; margin-left:1em;
}
.faq-item[open] summary .signo{ transform:rotate(45deg); }
.faq-item p{ margin:1em 0 0; color:var(--color-texto-marron); font-size:.92rem; }

/* ============ Newsletter PDF ============ */
.newsletter-pdf .container{ display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:2em; }
.newsletter-pdf .btn-pill{ justify-self:end; }
.newsletter-pdf .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#FBF0E6; opacity:1; }
.newsletter-pdf h2{
	font-family:var(--fuente-display); font-weight:400; font-style:normal;
	font-size:40px; color:#FBF0E6; margin:0 0 .4em; text-transform:none; line-height:1.2;
}
.newsletter-pdf p{ font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.3; color:#FBF0E6; opacity:1; max-width:50ch; margin:0; }
.newsletter-pdf .btn-pill{ font-family:var(--fuente-display); font-weight:400; font-size:36px; color:#FBF0E6; border-color:#FBF0E6; }

/* ============ Blog / Historias ============ */
.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2em; margin-top:1em; }
.blog-card{ display:block; }
.blog-card .foto{ aspect-ratio:4/3; border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); margin-bottom:1em; }
.blog-card .categoria{
	font-family:var(--fuente-texto); font-weight:600; font-size:10px; text-transform:uppercase;
	letter-spacing:.1em; color:#8A6236; display:block; margin-bottom:.5em;
}
.blog-card h4{ font-family:var(--fuente-display); font-weight:400; font-size:23px; line-height:1.3; color:#2A2320; margin:0 0 .4em; }
.blog-card p{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#5B4C40; margin:0 0 .6em; }
.blog-card .meta{
	font-family:var(--fuente-texto); font-weight:400; font-size:11px; text-transform:uppercase;
	letter-spacing:.08em; color:#5B4C40; opacity:.8;
}

/* ============ Footer real ============ */
.footer-real{ background:var(--color-header); color:#FBF0E6; padding:60px 0 0; }
.footer-real .logo-row{ margin-bottom:2em; }
.footer-real .logo-row svg{ width:105px; height:auto; display:block; }
.footer-oasis{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:1.5em; padding-bottom:2em; border-bottom:1px solid rgba(251,240,230,.15); }
.footer-oasis h4{ font-family:var(--fuente-display); font-style:italic; font-size:1.4rem; margin:0 0 .3em; }
.footer-oasis address{ font-style:normal; font-size:.85rem; opacity:.85; max-width:34ch; }
.footer-oasis .contactos{ display:flex; gap:2.5em; flex-wrap:wrap; }
.footer-oasis .contactos strong{ display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; opacity:.7; margin-bottom:.3em; }
.footer-cols{ display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:2.5em; padding:2.5em 0; }
.footer-cols h5{ font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; margin:0 0 1em; opacity:.85; }
.footer-cols ul{ list-style:none; margin:0; padding:0; }
.footer-cols li{ margin-bottom:.7em; font-size:.92rem; opacity:.9; }
.footer-newsletter p{ font-size:.85rem; opacity:.85; margin-bottom:1em; }
.footer-newsletter input[type="email"]{
	width:100%; padding:.8em 1em; border-radius:8px; border:0; margin-bottom:.8em; font-family:var(--fuente-texto);
}
.footer-newsletter .form-check{ color:#FBF0E6; opacity:.85; }
.footer-newsletter .btn-suscribir{
	background:var(--color-verde); color:#fff; border:0; padding:.8em 1.6em; border-radius:999px; font-weight:600; cursor:pointer;
}
.footer-legal{ border-top:1px solid rgba(251,240,230,.15); padding:1.6em 0; font-size:.78rem; opacity:.8; display:flex; flex-wrap:wrap; justify-content:space-between; gap:1em; }
.footer-legal .marco{ display:flex; gap:1.5em; flex-wrap:wrap; }
.footer-legal .redes{ display:flex; gap:.8em; }
.footer-legal .redes a{ width:32px; height:32px; border-radius:50%; border:1px solid rgba(251,240,230,.3); display:flex; align-items:center; justify-content:center; }

/* ============ WhatsApp flotante ============ */
.wa-float{
	position:fixed; right:24px; bottom:24px; z-index:150; width:56px; height:56px; border-radius:50%;
	background:#3F4A33; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.6rem;
	box-shadow:0 8px 24px rgba(0,0,0,.25);
}

@media (max-width: 980px){
	.oasis .grid, .llegar-grid, .franja-grid, .celebraciones .container{ grid-template-columns:1fr; }
	.incluido-grid{ grid-template-columns:1fr; gap:2em; }
	.oasis .pilares{ grid-template-columns:repeat(2,1fr); }
	.opiniones-grid, .guia-links, .footer-cols, .opiniones-layout, .seccion-split, .newsletter-pdf .container{ grid-template-columns:1fr; }
	.blog-grid{ grid-template-columns:1fr; }
	.arco-doble{ height:340px; }
}
@media (max-width: 720px){
	.header-top-row{ font-size:.7rem; }
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
	margin:0;
	font-family:var(--fuente-texto);
	color:var(--color-texto);
	background:var(--color-arena);
	line-height:1.6;
	overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--fuente-display); margin:0 0 .5em; font-weight:600; }
p{ margin:0 0 1em; }
.container{ max-width:1260px; margin:0 auto; padding:0 clamp(24px, 6vw, 72px); }
.eyebrow{
	display:inline-block;
	font-family:var(--fuente-texto);
	font-size:.8rem;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--color-terracota);
	font-weight:600;
	margin-bottom:.8em;
}
.btn{
	display:inline-flex;
	align-items:center;
	gap:.5em;
	padding:.9em 1.8em;
	border-radius:999px;
	font-family:var(--fuente-display); font-weight:400; font-style:normal;
	font-size:16.8px;
	transition:transform .2s ease, box-shadow .2s ease;
}
.btn-primary{ background:var(--color-terracota); color:var(--color-blanco); }
.btn-primary:hover{ background:var(--color-terracota-oscura); transform:translateY(-2px); box-shadow:var(--sombra); }
.btn-outline{ border:1.5px solid #FBF0E6; color:#FBF0E6; }
.btn-outline:hover{ background:rgba(255,255,255,.15); }
.btn-crema{ background:#FBF0E6; color:var(--color-texto-marron); border:1.5px solid #FBF0E6; }
.btn-crema:hover{ background:#fff; }

/* Header */
header.site-header{
	position:fixed; top:0; left:0; right:0; z-index:100;
	display:flex; align-items:center; justify-content:space-between;
	padding:22px 6vw;
	transition:background .3s ease, padding .3s ease, box-shadow .3s ease;
}
header.site-header.is-scrolled{
	background:rgba(246,238,225,.94);
	backdrop-filter:blur(6px);
	padding:14px 6vw;
	box-shadow:0 2px 20px rgba(0,0,0,.06);
}
.site-header .brand{ font-family:var(--fuente-display); font-size:1.4rem; font-weight:700; color:var(--color-blanco); letter-spacing:.02em; }
header.site-header.is-scrolled .brand{ color:var(--color-turquesa-oscura); }
.site-header .logo-lockup{ height:42px; width:auto; }
.site-header nav ul{ list-style:none; display:flex; gap:2.2em; margin:0; padding:0; }
.site-header nav a{ font-size:.92rem; font-weight:600; color:var(--color-blanco); }
header.site-header.is-scrolled nav a{ color:var(--color-texto); }
.site-header nav a:hover{ color:var(--color-terracota); }
.header-actions{ display:flex; align-items:center; gap:1.2em; }
header.site-header.is-scrolled .btn-outline{ border-color:var(--color-turquesa); color:var(--color-turquesa-oscura); }
.menu-toggle{ display:none; background:none; border:0; cursor:pointer; padding:6px; }
.menu-toggle span{ display:block; width:24px; height:2px; background:var(--color-blanco); margin:5px 0; transition:.2s; }
header.site-header.is-scrolled .menu-toggle span{ background:var(--color-texto); }

/* Hero — slider + widget de reserva (fiel al PDF "Hero 1") */
.hero{
	position:relative;
	min-height:88vh;
	display:flex;
	align-items:flex-end;
	color:var(--color-blanco);
	overflow:hidden;
	padding:60px 0 60px;
}
.hero.hero-generica{ align-items:center; }
.hero.hero-generica::before{
	content:""; position:absolute; inset:0; z-index:1;
	background:linear-gradient(0deg, rgba(15,20,12,.82) 0%, rgba(15,20,12,.15) 65%);
}
.hero-slides{ position:absolute; inset:0; z-index:0; }
.hero-slide{
	position:absolute; inset:0;
	background-position:center; background-size:cover; background-repeat:no-repeat;
	background-color:var(--color-verde-oscuro);
	opacity:0;
	transition:opacity 1.2s ease;
}
.hero-slide.is-active{ opacity:1; }
.hero::before{
	content:"";
	position:absolute; inset:0; z-index:1;
	background:linear-gradient(0deg, rgba(20,26,16,.78) 0%, rgba(20,26,16,.4) 45%, rgba(20,26,16,.15) 100%);
}
.hero-inner{ position:relative; z-index:2; width:100%; }
.hero-heading{ position:relative; margin-bottom:.35em; width:fit-content; max-width:100%; }
.hero-heading h1{
	font-family:var(--fuente-display); font-style:italic; font-weight:600; text-transform:uppercase;
	font-size:clamp(2.4rem, 7vw, 6rem); color:#FFFFFF; margin:0; line-height:1.05;
}
.hero-eyebrow{
	position:absolute; top:-1.5em; right:0;
	font-family:var(--fuente-texto); font-style:normal; font-size:.72rem; font-weight:700;
	letter-spacing:.28em; text-transform:uppercase; color:var(--color-header); opacity:1;
	white-space:nowrap;
}
.hero-subtitle{
	max-width:34ch; font-family:var(--fuente-display); font-weight:400; font-style:normal;
	font-size:28px; line-height:1.25; color:#FBF0E6; opacity:1; margin:0 0 1.6em;
}
.hero-actions{ display:flex; gap:1em; flex-wrap:wrap; margin-bottom:3.6em; }

/* Widget de reserva */
.booking-widget{
	display:flex; align-items:center; flex-wrap:wrap; gap:.3em;
	background:var(--color-crema); color:var(--color-texto);
	border-radius:20px; box-shadow:var(--sombra);
	width:100%; max-width:1040px; margin:0 0 .8em; padding:10px 14px;
}
.booking-field, .booking-stepper{
	display:flex; flex-direction:column; justify-content:center;
	flex:1 1 0;
	padding:.6em .35em;
	min-width:100px;
}
.booking-field{ flex:1.9 1 0; min-width:150px; }
.booking-submit{ flex:0 0 auto; }
.booking-field label, .booking-stepper label{
	font-family:var(--fuente-texto); font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
	color:var(--color-texto-suave); margin-bottom:.4em;
}
.booking-field input{
	border:1px solid rgba(38,38,32,.15); background:#fff; border-radius:8px;
	padding:.7em .9em; font-family:var(--fuente-display);
	font-size:18px; color:var(--color-texto); width:100%;
}
.booking-field input:focus{ outline:none; border-color:rgba(38,38,32,.3); }
.stepper-control{
	display:flex; align-items:center; justify-content:space-between; gap:.8em;
	border:1px solid rgba(38,38,32,.15); background:#fff; border-radius:8px;
	padding:.7em .9em;
}
.stepper-btn{
	width:16px; border:0; background:none; color:var(--color-texto); font-size:1rem; line-height:1;
	display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; opacity:.75;
}
.stepper-btn:hover{ opacity:1; }
.stepper-value{ font-family:var(--fuente-display); font-size:18px; min-width:1ch; text-align:center; }
.booking-submit{
	display:flex; align-items:center; justify-content:center;
	background:var(--color-verde); color:var(--color-blanco);
	border:0; border-radius:999px; padding:.75em 1.6em; font-family:var(--fuente-texto);
	font-weight:600; font-size:.92rem; text-decoration:none;
	cursor:pointer; white-space:nowrap; transition:background .2s ease;
}
.booking-submit:hover{ background:var(--color-verde-oscuro); }
.booking-caption{
	flex-basis:100%; width:100%; font-family:var(--fuente-texto); font-weight:400; font-size:11px;
	opacity:.85; margin:0; padding:0 1.1em;
}
.hero-dots{ position:absolute; z-index:2; right:6vw; bottom:26px; display:flex; gap:.5em; }
.hero-dot{
	width:8px; height:8px; border-radius:50%; border:1px solid rgba(255,255,255,.7);
	background:rgba(255,255,255,.25); padding:0; cursor:pointer;
}
.hero-dot.is-active{ background:var(--color-blanco); }

/*
 * Breakpoint propio para el widget de reserva, más ancho que el del resto del
 * hero: con los 5 campos + botón en una sola fila, el contenido se queda sin
 * espacio bastante antes de los 720px del resto del layout, y el botón
 * "Ver disponibilidad" quedaba huérfano en su propia línea, sin ocupar el
 * ancho completo. A partir de 900px pasa a su forma apilada (fecha/fecha en
 * fila, huéspedes en fila, botón a ancho completo) en vez de un wrap parcial.
 */
@media (max-width: 1160px){
	.booking-widget{ border-radius:22px; flex-direction:column; align-items:stretch; width:100%; max-width:100%; }
	.booking-field, .booking-stepper{ width:100%; flex-direction:row; align-items:center; justify-content:space-between; }
	.booking-submit{ padding:1em; width:100%; }
}

@media (max-width: 720px){
	.hero{ align-items:flex-end; padding:40px 0 40px; }
	.hero-eyebrow{ position:static; display:block; margin-bottom:.4em; }
	.hero-dots{ display:none; }
}

/* Variante oscura del widget de reserva, fuera del hero (ej: pie del grid de Alojamientos) */
.booking-widget.booking-widget-oscuro{ background:rgba(79,95,53,.67); color:#FBF0E6; max-width:100%; }
.booking-widget-oscuro .booking-field label,
.booking-widget-oscuro .booking-stepper label{ color:#FBF0E6; opacity:.85; }
.booking-widget-oscuro .booking-caption{ color:#FBF0E6; opacity:.85; }
.booking-widget-oscuro .booking-submit{ background:#FBF0E6; color:var(--color-texto-marron); }
.booking-widget-oscuro .booking-submit:hover{ background:#fff; }

/* Utilidad: zoom suave en imágenes al hacer hover */
.img-hover-zoom{ position:relative; overflow:hidden; }
.img-hover-zoom img{ width:100%; height:100%; object-fit:cover; display:block; }
.img-hover-zoom img,
.img-hover-zoom .zoom-bg{
	transition:transform .7s cubic-bezier(.2,.7,.3,1);
	transform:scale(1);
}
.img-hover-zoom .zoom-bg{
	position:absolute; inset:0; background-position:center; background-size:cover; background-repeat:no-repeat;
}
.img-hover-zoom:hover img,
.img-hover-zoom:hover .zoom-bg{ transform:scale(1.08); }

/* Secciones genéricas */
section{ padding:110px 0; }
.section-head{ text-align:center; max-width:640px; margin:0 auto 3.5em; }
.section-head p{ color:var(--color-texto-suave); }

/* Bienvenida */
.bienvenida{ background:var(--color-blanco); }
.bienvenida .grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.bienvenida .imagen{ border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); aspect-ratio:4/5; background:var(--color-arena-oscura); }
.bienvenida .imagen img{ width:100%; height:100%; object-fit:cover; }
.bienvenida .cifras{ display:flex; gap:2.5em; margin-top:2em; }
.bienvenida .cifra strong{ display:block; font-family:var(--fuente-display); font-size:2rem; color:var(--color-terracota); }
.bienvenida .cifra span{ font-size:.85rem; color:var(--color-texto-suave); }

/* Habitaciones */
.habitaciones{ background:var(--color-arena); }
.habitaciones-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:32px; }
.habitacion-card{ background:var(--color-blanco); border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); }
.habitacion-card .foto{ aspect-ratio:4/3; background:var(--color-arena-oscura); }
.habitacion-card .info{ padding:1.6em; }
.habitacion-card h3{ font-size:1.25rem; margin-bottom:.2em; }
.habitacion-card .precio{ color:var(--color-turquesa); font-weight:700; margin-bottom:.6em; display:block; }
.habitacion-card ul{ list-style:none; margin:0 0 1.2em; padding:0; font-size:.88rem; color:var(--color-texto-suave); }
.habitacion-card ul li{ display:inline-block; margin:0 .6em .4em 0; }
.ver-todas{ text-align:center; margin-top:3em; }

/* Experiencias */
.experiencias{ background:var(--color-turquesa); color:var(--color-blanco); }
.experiencias .section-head p{ color:rgba(255,255,255,.8); }
.experiencias-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:28px; }
.experiencia-item{ text-align:center; padding:1.5em 1em; }
.experiencia-item .icono{ font-size:2rem; margin-bottom:.5em; }
.experiencia-item h4{ color:var(--color-blanco); font-size:1.05rem; }
.experiencia-item p{ font-size:.88rem; color:rgba(255,255,255,.78); margin:0; }

/* Galería */
.galeria{ background:var(--color-blanco); }
.galeria-grid{ display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:180px; gap:14px; }
.galeria-grid a{ border-radius:10px; overflow:hidden; background:var(--color-arena-oscura); }
.galeria-grid a:nth-child(1){ grid-column:span 2; grid-row:span 2; }
.galeria-grid a:nth-child(6){ grid-column:span 2; }

/* Testimonios */
.testimonios{ background:var(--color-arena); }
.testimonios-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; }
.testimonio-card{ background:var(--color-blanco); border-radius:var(--radio); padding:2em; box-shadow:var(--sombra); }
.testimonio-card .estrellas{ color:var(--color-terracota); margin-bottom:.8em; }
.testimonio-card .autor{ margin-top:1.2em; font-weight:600; font-size:.9rem; }
.testimonio-card .autor span{ display:block; font-weight:400; color:var(--color-texto-suave); font-size:.82rem; }

/* Contacto / Ubicación */
.contacto{ background:var(--color-turquesa-oscura); color:var(--color-blanco); }
.contacto .grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; }
.contacto .section-head{ text-align:left; margin:0 0 2em; }
.contacto .section-head p{ color:rgba(255,255,255,.8); }
.contacto-datos li{ list-style:none; margin-bottom:1.1em; font-size:.95rem; }
.contacto-datos strong{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.12em; color:var(--color-terracota); margin-bottom:.2em; }
.mapa-embed{ border-radius:var(--radio); overflow:hidden; aspect-ratio:4/3; background:rgba(255,255,255,.08); }
.redes{ display:flex; gap:1em; margin-top:1.5em; }
.redes a{ width:40px; height:40px; border-radius:50%; border:1.5px solid rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center; }
.redes a:hover{ background:rgba(255,255,255,.15); }

/* Footer */
footer.site-footer{ background:var(--color-texto); color:rgba(255,255,255,.75); padding:60px 0 30px; }
footer.site-footer .grid{ display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px; margin-bottom:40px; }
footer.site-footer .brand{ font-family:var(--fuente-display); font-size:1.4rem; color:var(--color-blanco); margin-bottom:.6em; }
footer.site-footer h5{ color:var(--color-blanco); font-size:.85rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:1em; }
footer.site-footer ul{ list-style:none; margin:0; padding:0; }
footer.site-footer li{ margin-bottom:.6em; font-size:.9rem; }
footer.site-footer a:hover{ color:var(--color-terracota); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding-top:24px; font-size:.82rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5em; }

/* Página interior genérica (habitaciones detalle, contacto, etc.) */
.page-hero{
	min-height:46vh; display:flex; align-items:center; justify-content:center; text-align:center;
	background:linear-gradient(180deg, rgba(22,50,50,.6), rgba(22,50,50,.4)), var(--color-turquesa) center/cover no-repeat;
	color:var(--color-blanco); padding:140px 6vw 60px;
}
.page-hero h1{ color:var(--color-blanco); }

/* Responsive */
@media (max-width: 980px){
	.bienvenida .grid, .contacto .grid{ grid-template-columns:1fr; }
	.habitaciones-grid, .testimonios-grid{ grid-template-columns:repeat(2, 1fr); }
	.experiencias-grid{ grid-template-columns:repeat(2, 1fr); }
	.galeria-grid{ grid-template-columns:repeat(2, 1fr); grid-auto-rows:150px; }
	footer.site-footer .grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px){
	.site-header nav{
		position:fixed; inset:0 0 0 auto; width:78%; max-width:320px;
		background:var(--color-arena); padding:100px 32px; transform:translateX(100%);
		transition:transform .3s ease; box-shadow:-10px 0 30px rgba(0,0,0,.1);
	}
	.site-header nav.is-open{ transform:translateX(0); }
	.site-header nav ul{ flex-direction:column; gap:1.4em; }
	.site-header nav a{ color:var(--color-texto) !important; font-size:1.1rem; }
	.menu-toggle{ display:block; }
	.header-actions .btn-outline{ display:none; }
	.menu-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.35); opacity:0; pointer-events:none; transition:opacity .3s ease; z-index:90; }
	.menu-backdrop.is-open{ opacity:1; pointer-events:auto; }
	.habitaciones-grid, .testimonios-grid, .experiencias-grid{ grid-template-columns:1fr; }
	.galeria-grid{ grid-template-columns:repeat(2, 1fr); grid-auto-rows:130px; }
	.galeria-grid a:nth-child(1){ grid-column:span 2; grid-row:span 1; }
	footer.site-footer .grid{ grid-template-columns:1fr; }
	section{ padding:70px 0; }
}

/* ============================================================
   Componentes de páginas internas (habitaciones, experiencias)
   ============================================================ */

/* Logo real: ícono de palmera + wordmark en 2 líneas */
.logo-palm{ display:flex; align-items:center; }
.logo-palm svg{ width:105px; height:auto; flex-shrink:0; display:block; }

/* Hero de página interna (habitación): fondo verde con textura, foto en arco + galería */
.pagina-hero{ padding-top:70px; padding-bottom:70px; }
.pagina-hero .grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(24px, 4.17vw, 60px); align-items:center; }
.pagina-hero .room-hero-bleed{ max-width:none; width:100%; margin:0; padding-left:5%; padding-right:0; position:relative; }
.pagina-hero .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:clamp(12px, 1.39vw, 20px); color:#FBF0E6; opacity:1; }
.pagina-hero h1{
	font-family:var(--fuente-display); font-style:normal; font-weight:600; text-transform:uppercase;
	font-size:clamp(42px, 7.64vw, 110px); color:#FBF0E6; line-height:1.02; margin:.2em 0 .6em;
}
.pagina-hero .hero-actions{ margin-top:1.6em; margin-bottom:0; }
.pagina-hero .hero-actions .btn{ font-family:var(--fuente-display); font-weight:400; font-size:clamp(14px, 1.39vw, 20px); }
.pagina-hero .hero-actions .btn-crema{ color:#2A2320; }
.room-galeria .principal{
	border-radius:50% 50% 20px 20px / clamp(120px, 18.06vw, 260px) clamp(120px, 18.06vw, 260px) 20px 20px;
	overflow:hidden; box-shadow:var(--sombra);
	aspect-ratio:4/4.8; width:calc(64% + 1em); border:6px solid #D6D2CB;
}
.room-galeria .principal img{ width:100%; height:100%; object-fit:cover; transition:opacity .35s ease; }
.room-galeria .principal img.cambiando{ opacity:0; }
.room-galeria .miniaturas{ margin-top:1em; padding-bottom:.3em; gap:1em; }
.room-galeria .miniaturas .foto{ flex:0 0 32%; aspect-ratio:3/2; border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); cursor:pointer; border:6px solid #D6D2CB; transition:border-color .3s ease; }
.room-galeria .miniaturas .foto.activa{ border-color:var(--color-dorado); }

/* Contenido principal de la página (crema): descripción + ficha/widget */
.room-content .grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:60px; align-items:start; }
.room-content .descripcion p{ font-family:var(--fuente-texto); font-weight:400; font-size:18px; line-height:1.6; color:#5B4C40; }
.comodidades-titulo{ font-family:var(--fuente-display); font-weight:300; font-size:23px; color:#2A2320; text-transform:uppercase; margin:2em 0 .6em; }
.comodidades-grid{
	display:grid; grid-template-columns:1fr 1fr; gap:.2em 2em; list-style:none; margin:1em 0 2em; padding:0;
}
.comodidades-grid li{ display:flex; align-items:center; gap:.6em; padding:.5em 0; font-family:var(--fuente-texto); font-weight:400; font-size:16px; color:#5B4C40; }
.comodidades-grid li::before{ content:"•"; color:var(--color-verde); font-size:1.2em; }
.plan-alimentacion h3{ font-family:var(--fuente-display); font-weight:300; font-size:23px; color:#2A2320; text-transform:uppercase; margin:0 0 .6em; }
.plan-alimentacion p{ font-size:.92rem; color:var(--color-texto-marron); }
.plan-alimentacion a{ font-weight:700; text-decoration:underline; }

.ficha-card{
	background:#FBF0E6; border-radius:var(--radio); box-shadow:var(--sombra);
	padding:1.6em 1.8em; margin-bottom:1.4em;
}
.ficha-card h3{ font-family:var(--fuente-display); font-weight:400; font-size:24px; color:#2A2320; margin:0 0 1em; }
.ficha-row{ display:flex; justify-content:space-between; gap:1em; padding:.7em 0; border-bottom:1px solid rgba(0,0,0,.07); }
.ficha-row:last-child{ border-bottom:0; }
.ficha-row span:first-child{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; }
.ficha-row span:last-child{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; text-align:right; }

.ficha-desde-row{ display:flex; justify-content:space-between; align-items:center; margin:1.4em 0 1em; }
.ficha-desde-label{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; }
.ficha-card .tag-consultar{
	font-family:var(--fuente-texto); font-weight:700; font-size:14px; color:#5B4C40;
	background:rgba(214,185,158,.45); display:inline-flex; align-items:center; gap:.5em;
	padding:.55em 1.1em; border-radius:999px; white-space:nowrap;
}
.ficha-card .tag-consultar .dot{ width:7px; height:7px; border-radius:50%; background:#C4996F; flex-shrink:0; }
.booking-widget-en-ficha{
	display:grid; grid-template-columns:1fr 1fr; gap:.8em 1em; align-items:end;
	background:transparent; box-shadow:none; border:1px solid #D6D2CB; max-width:100%; margin:0; padding:16px;
}
.booking-widget-en-ficha .booking-field,
.booking-widget-en-ficha .booking-stepper{ flex:none; min-width:0; padding:0; }
.booking-widget-en-ficha .booking-submit{ background:#8A6236; width:100%; }
.booking-widget-en-ficha .booking-submit:hover{ background:#6f4f2b; }
.ficha-card .booking-caption{ padding:0 .2em; margin-top:.8em; }

/* FAQ + políticas (páginas internas) */
.politicas-lista{ list-style:disc; padding-left:1.2em; font-size:.85rem; color:var(--color-texto-marron); line-height:1.7; }
.politicas-lista li{ margin-bottom:.5em; }

/* Consultar (formulario de dudas) */
.consultar-grid{ display:grid; grid-template-columns:1fr 1.3fr; gap:60px; align-items:start; }
.consultar-form-card{
	background:var(--color-crema); border-radius:56px; box-shadow:var(--sombra); padding:2em;
}
.consultar-form-card .form-grid{ margin-bottom:1em; }
.seccion-consultar .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#8A6236; }
.seccion-consultar .seccion-titulo h2{ font-family:var(--fuente-display); font-weight:400; font-size:40px; text-transform:none; color:#2A2320; }
.seccion-consultar .seccion-intro > p{ font-family:var(--fuente-display); font-weight:400; font-size:28px; color:#2A2320; }
.seccion-consultar .btn-pill{ font-family:var(--fuente-display); font-weight:400; font-size:15px; background:#3B5839; color:#FBF0E6; border-color:#3B5839; }
.seccion-consultar .btn-pill:hover{ background:#2E4A2C; }

/* Otras tipologías / relacionados */
.relacionados-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.6em; margin-top:2em; }
.relacionado-card .foto{ aspect-ratio:4/3; border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); margin-bottom:.8em; }
.relacionado-card .categoria{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:#8A6236; }
.relacionado-card h3{ font-family:var(--fuente-display); font-weight:300; font-size:19px; color:#2A2320; margin:.3em 0 .2em; text-transform:uppercase; }
.relacionado-card .capacidad{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; }

/* Banda CTA con foto de fondo (palmeras) — variante de .celebraciones sin formulario */
.cta-banda{
	position:relative; min-height:420px; display:flex; align-items:center;
	background-size:cover; background-position:center; color:#fff;
}
.cta-banda::before{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,20,15,.72) 0%, rgba(20,20,15,.35) 100%); }
.cta-banda .container{ position:relative; z-index:1; display:flex; justify-content:space-between; align-items:flex-end; gap:2em; flex-wrap:wrap; }
.cta-banda .seccion-kicker{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; color:#D6B99E; opacity:1; }
.cta-banda h2{ font-family:var(--fuente-display); font-weight:300; font-style:normal; text-transform:none; font-size:49px; line-height:54px; color:#D6B99E; margin:.2em 0 .5em; }
.cta-banda-habitacion h2{ text-transform:uppercase; }
.cta-banda p{ font-family:var(--fuente-display); font-weight:400; font-size:28px; line-height:1.3; max-width:44ch; color:#FBF0E6; opacity:1; }
.cta-banda .cta-actions{ display:flex; gap:1em; flex-wrap:wrap; }

/* ============ Hero de Planes (hub) ============ */
.planes-hero{ position:relative; overflow:hidden; padding:130px 0; background-color:var(--color-verde); min-height:760px; display:flex; align-items:center; }
.planes-hero-bleed{ max-width:none; width:100%; margin:0; padding-left:5%; padding-right:5%; position:relative; }
.planes-hero-grid{ display:grid; grid-template-columns:1fr 1.2fr; gap:40px; align-items:center; position:relative; z-index:1; }
.planes-hero h1{
	font-family:var(--fuente-display); font-weight:600; font-style:normal; text-transform:uppercase;
	font-size:62px; line-height:1.05; color:#FBF0E6; margin:0 0 .4em; max-width:14ch;
}
.planes-hero p{ font-family:var(--fuente-display); font-weight:400; font-size:20px; line-height:1.4; color:#FBF0E6; opacity:.92; max-width:42ch; margin-bottom:1.2em; }
.planes-hero .btn-crema{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; background:#FBF0E6; border-color:#FBF0E6; }

/* Carrusel de 3 posiciones (izquierda/centro/derecha): las tarjetas rotan de
   posición solas (ver assets/js/main.js) — la del centro siempre es la más
   grande/destacada, no importa cuál tarjeta esté ahí en cada momento. */
.planes-hero-carousel{ position:relative; height:500px; }
.planes-hero-card{
	position:absolute; top:50%; left:50%; margin:0; text-decoration:none;
	border-radius:24px; overflow:hidden;
	transition:transform .7s cubic-bezier(.4,0,.2,1), width .7s cubic-bezier(.4,0,.2,1), box-shadow .7s ease;
}
.planes-hero-card img{ width:100%; height:auto; display:block; }
.planes-hero-card[data-slot="left"]{
	width:270px; transform:translate(-50%,-50%) translateX(-235px) scale(.9); z-index:1;
	box-shadow:0 16px 30px rgba(20,20,15,.25);
}
.planes-hero-card[data-slot="right"]{
	width:270px; transform:translate(-50%,-50%) translateX(235px) scale(.9); z-index:1;
	box-shadow:0 16px 30px rgba(20,20,15,.25);
}
.planes-hero-card[data-slot="center"]{
	width:360px; transform:translate(-50%,-50%) scale(1); z-index:2;
	box-shadow:0 30px 50px rgba(20,20,15,.4);
}
.planes-hero-card .etiqueta{
	position:absolute; left:22px; bottom:20px; right:18px; font-family:var(--fuente-display); font-weight:400;
	font-size:22px; line-height:1.15; color:#fff; transition:font-size .7s ease;
}
.planes-hero-card[data-slot="center"] .etiqueta{ font-size:28px; }
.badge-favorito{
	position:absolute; top:16px; left:16px; z-index:3; display:inline-flex; align-items:center; gap:.4em;
	background:#FBF0E6; color:#2A2320; font-family:var(--fuente-texto); font-weight:600; font-size:11px;
	padding:.5em 1em; border-radius:999px; white-space:nowrap;
	opacity:0; transition:opacity .4s ease;
}
.planes-hero-card[data-slot="center"] .badge-favorito{ opacity:1; }

/* Tabla comparativa + tarjetas de los 4 planes */
.tabla-planes{ width:100%; border-collapse:collapse; }
.tabla-planes th{
	text-align:left; font-family:var(--fuente-texto); font-weight:600; font-size:10px; text-transform:uppercase;
	letter-spacing:.08em; color:#5B4C40; padding:0 1.6em .9em 0; border-bottom:1px solid rgba(0,0,0,.1); white-space:nowrap;
}
.tabla-planes td{ padding:1.3em 1.6em 1.3em 0; border-bottom:1px solid rgba(0,0,0,.08); vertical-align:top; }
.tabla-planes td:first-child{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; white-space:nowrap; }
.tabla-planes td:not(:first-child){ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#5B4C40; }

.planes-cards-grid{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:1.6em; margin-top:3.5em; align-items:stretch; }
.planes-card{
	display:flex; flex-direction:column; background:rgba(212,242,164,.25); border-radius:20px; padding:1.2em 1.4em;
	text-decoration:none; min-height:190px; height:100%; min-width:0;
	border:1px solid rgba(42,36,32,.1); box-shadow:var(--sombra);
}
.planes-card .kicker{
	font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.08em; text-transform:uppercase;
	color:#8A6236; margin-bottom:.6em;
}
.planes-card h2{ font-family:var(--fuente-display); font-weight:300; font-size:26px; line-height:1.15; text-transform:uppercase; color:#2A2320; margin:0 0 .35em; }
.planes-card p{ font-family:var(--fuente-texto); font-weight:400; font-size:12.6px; line-height:1.4; color:#2A2320; margin:0; flex:1; }
.planes-card .ver-mas{ align-self:flex-end; font-family:var(--fuente-texto); font-weight:600; font-size:14px; color:#8A6236; margin-top:1em; }

@media (max-width: 980px){
	.planes-cards-grid{ grid-template-columns:repeat(2,1fr); }
	.pagina-hero .grid, .room-content .grid, .consultar-grid{ grid-template-columns:1fr; }
	.planes-hero-grid{ grid-template-columns:1fr; }
	.relacionados-grid{ grid-template-columns:repeat(2,1fr); }
	.comodidades-grid{ grid-template-columns:1fr; }
	.todo-incluido-intro-grid, .incluye-grid{ grid-template-columns:1fr; }
}

/* ============ Todo incluido ============ */
.todo-incluido-intro-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:60px; align-items:start; margin-bottom:3.5em; }
.todo-incluido-lead{ font-family:var(--fuente-display); font-weight:400; font-size:24px; line-height:1.5; color:#000; text-transform:uppercase; margin:0; }
.todo-incluido-precios{
	background:rgba(212,242,164,.25); border:1px solid rgba(42,36,32,.1); box-shadow:var(--sombra);
	border-radius:20px; padding:1.6em 2em;
}
.incluye-grid{ display:grid; grid-template-columns:1fr 1fr; gap:3em; }
.lista-incluye, .lista-no-incluye{ list-style:none; padding:0; margin:0; }
.lista-incluye li, .lista-no-incluye li{
	display:flex; gap:.7em; align-items:flex-start; font-family:var(--fuente-texto); font-weight:400;
	font-size:16px; line-height:1.6; color:#5B4C40; padding:.5em 0;
}
.icono-check{ color:#698047; flex-shrink:0; font-weight:700; }
.icono-x{ color:#D66634; flex-shrink:0; font-weight:700; }

/* ============ Tarifas ============ */
.tarifas-tabla-grid{ display:grid; grid-template-columns:1fr 1.6fr; gap:60px; align-items:center; margin-bottom:3.5em; }
.tarifas-titulo{
	font-family:var(--fuente-display); font-weight:400; font-style:normal; text-transform:none;
	font-size:90px; line-height:1.02; color:#2A2320; margin:0;
}
.tabla-tarifas th{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.08em; color:#5B4C40; }
.tabla-tarifas td{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#5B4C40; padding-top:1.1em; padding-bottom:1.1em; }
.tabla-tarifas td:first-child{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; }
.tabla-tarifas td:first-child a{ color:#2A2320; text-decoration:none; }
.tabla-tarifas .tag-consultar{
	background:#DCE6B4; color:#2A2320; font-family:var(--fuente-texto); font-weight:600; font-size:13px;
	display:inline-flex; align-items:center; gap:.5em; padding:.4em 1em;
}
.tabla-tarifas .tag-consultar .dot{ width:6px; height:6px; border-radius:50%; background:#698047; flex-shrink:0; }
.tabla-tarifas td:last-child{ text-align:right; }
.tabla-tarifas td:last-child a, .tabla-tarifas td:last-child span{
	font-family:var(--fuente-texto); font-weight:700; font-size:14px; color:#2A2320; text-decoration:none; white-space:nowrap;
}
.booking-widget-centrado{ margin-left:auto; margin-right:auto; }

@media (max-width: 980px){
	.tarifas-tabla-grid{ grid-template-columns:1fr; }
	.tarifas-titulo{ font-size:clamp(2.4rem, 8vw, 90px); }
	.tabla-tarifas th{ font-size:9px; }
	.tabla-tarifas td{ font-size:12.5px; padding-right:1em; }
	.tabla-tarifas td:first-child{ font-size:14px; }
	.tabla-tarifas .tag-consultar{ font-size:11.5px; padding:.35em .8em; }
	.tabla-tarifas td:last-child a, .tabla-tarifas td:last-child span{ font-size:12.5px; }
}

@media (max-width: 680px){
	/* .tabla-llegar vuelve display:block a los 680px (ver arriba) para su
	   propio scroll horizontal; acá se deshace para esta tabla porque ya
	   tiene su propio wrapper con overflow-x:auto — con display:block el
	   layout de tabla se rompía y las 2 últimas columnas desaparecían. */
	.tabla-tarifas{ display:table; overflow-x:visible; }
	.tabla-tarifas th{ font-size:8px; }
	.tabla-tarifas td{ font-size:11px; padding-right:.8em; }
	.tabla-tarifas td:first-child{ font-size:12.5px; }
	.tabla-tarifas .tag-consultar{ font-size:10.5px; padding:.3em .7em; }
	.tabla-tarifas td:last-child a, .tabla-tarifas td:last-child span{ font-size:11px; }
	.tabla-otros-costos{ display:table; overflow-x:visible; }
}

.tarifas-subtitulo{
	font-family:var(--fuente-display); font-weight:400; font-size:40px; text-transform:none;
	color:#2A2320; margin:2.5em 0 1em;
}
.tabla-otros-costos th, .tabla-otros-costos td{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; }
.tabla-otros-costos .tag-consultar{
	background:#DCE6B4; color:#2A2320; font-family:var(--fuente-texto); font-weight:600; font-size:13px;
	display:inline-flex; align-items:center; gap:.5em; padding:.4em 1em;
}
.tabla-otros-costos .tag-consultar .dot{ width:6px; height:6px; border-radius:50%; background:#698047; flex-shrink:0; }
.politicas-lista{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; }

/* ============ Pasadía ============ */
.pasadia-precios-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2.4em; margin-bottom:3.5em; }
.pasadia-precio-card{
	background:rgba(212,242,164,.25); border:1px solid rgba(42,36,32,.1); box-shadow:var(--sombra);
	border-radius:20px; padding:2em 2.2em;
}
.pasadia-precio-card .kicker{
	display:block; font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.08em;
	text-transform:uppercase; color:#8A6236; margin-bottom:.6em;
}
.pasadia-precio{ font-family:var(--fuente-display); font-weight:300; font-size:51px; color:#2A2320; line-height:1.1; }
.pasadia-precio-nota{ font-family:var(--fuente-texto); font-weight:400; font-size:12.5px; color:#8A7A68; margin:.3em 0 1.4em; }
.pasadia-precio-card .ficha-row{ justify-content:flex-start; gap:1.6em; border-bottom-color:rgba(42,36,32,.08); }
.pasadia-precio-card .ficha-row span:first-child{ font-family:var(--fuente-texto); font-weight:600; font-size:13px; color:#2A2320; min-width:2.6em; }
.pasadia-precio-card .ficha-row span:last-child{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; text-align:left; }
.pasadia-nota-extra{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; margin:1em 0 0; }
.pasadia-nota-extra strong{ font-weight:700; color:#2A2320; }
.pasadia-badge{
	display:inline-block; margin-top:1em; background:#FBF0E6; color:#5B4C40; font-family:var(--fuente-texto);
	font-weight:400; font-size:12.5px; padding:.7em 1.2em; border-radius:999px;
}

.pasadia-galeria{
	display:grid; grid-template-columns:repeat(3, 1fr); gap:1em; margin-top:3.5em;
}
.pasadia-galeria .foto-grande{ grid-column:1/3; grid-row:1/3; border-radius:150px 20px 20px 20px; overflow:hidden; }
.pasadia-galeria .foto-chica-1{ grid-column:3; grid-row:1; border-radius:20px; overflow:hidden; aspect-ratio:4/3; }
.pasadia-galeria .foto-chica-2{ grid-column:3; grid-row:2; border-radius:20px; overflow:hidden; aspect-ratio:4/3; }
.pasadia-galeria .foto-ancha{ grid-column:1; grid-row:3; border-radius:20px; overflow:hidden; aspect-ratio:4/3; }
.pasadia-galeria img{ width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width:980px){
	.pasadia-precios-grid{ grid-template-columns:1fr; }
	.pasadia-galeria{ grid-template-columns:1fr; grid-template-rows:auto; }
	.pasadia-galeria .foto-grande, .pasadia-galeria .foto-chica-1, .pasadia-galeria .foto-chica-2, .pasadia-galeria .foto-ancha{ grid-column:1; grid-row:auto; }
	.promociones-exp-grid{ grid-template-columns:1fr; }
}

/* ============ Promociones ============ */
.promociones-exp-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1em; margin-top:2em; max-width:100%; }
.promociones-exp-item{
	display:flex; justify-content:space-between; align-items:center; gap:1em;
	background:#FBF0E6; border-radius:16px; padding:1.1em 1.4em; text-decoration:none;
}
.promociones-exp-item span:first-child{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; }
.promociones-exp-item span:last-child{ font-family:var(--fuente-texto); font-weight:700; font-size:13px; color:#2A2320; white-space:nowrap; }

.promociones-vigentes-titulo{ font-family:var(--fuente-display); font-weight:400; font-size:40px; color:#2A2320; margin:0 0 1.2em; }
.promociones-vigentes-grid{ display:grid; grid-template-columns:1fr 1.5fr; gap:2em; align-items:start; }
.promociones-card{ background:#F0E6D6; border-radius:24px; box-shadow:var(--sombra); padding:2.2em 2.4em; }
.promociones-card .kicker{
	display:block; font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.08em;
	text-transform:uppercase; color:#8A6236; margin-bottom:.8em;
}
.promociones-card h3{ font-family:var(--fuente-display); font-weight:400; font-size:24px; color:#2A2320; margin:0 0 .5em; }
.promociones-card p{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#5B4C40; line-height:1.6; margin:0 0 1.4em; }
.promociones-card .form-grid{ margin-bottom:0; }
.promociones-card .form-grid input{
	width:100%; border:1px solid rgba(0,0,0,.1); border-radius:10px; padding:.9em 1.1em; background:#fff;
	font-family:var(--fuente-texto); font-size:14px;
}
.promociones-card .form-check{ margin:1em 0 1.4em; font-size:13px; }
.promociones-btn{ background:#5B4C40; color:#FBF0E6; border-color:#5B4C40; font-family:var(--fuente-texto); font-weight:600; font-size:14px; }
.promociones-btn:hover{ background:#463A31; }

@media (max-width:980px){
	.promociones-vigentes-grid{ grid-template-columns:1fr; }
}

/* Grid de experiencias (mismo patrón de tarjeta que Alojamientos/Dormir) */
.experiencias-grid-cards{ display:grid; grid-template-columns:repeat(3, 1fr); gap:32px; margin-top:1em; }
.experiencias-preview .habitacion-card{ display:block; background:none; box-shadow:none; border-radius:0; text-decoration:none; }
.experiencias-preview .habitacion-card .foto{ aspect-ratio:4/5; position:relative; border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); }
.experiencias-preview .habitacion-card .foto::after{
	content:""; position:absolute; inset:0;
	background:linear-gradient(0deg, rgba(20,20,15,.65) 0%, rgba(20,20,15,0) 55%);
}
.experiencias-preview .habitacion-card .foto-label{
	position:absolute; left:0; right:0; bottom:0; z-index:1; padding:1em 1.2em; color:#FBF0E6;
}
.experiencias-preview .habitacion-card .foto-label h3{
	font-family:var(--fuente-display); font-weight:300; font-size:26px;
	color:#FBF0E6; margin:0 0 .15em; text-transform:none;
}
.experiencias-preview .habitacion-card .foto-label span{
	font-family:var(--fuente-texto); font-weight:400; font-size:12px; color:#FBF0E6; opacity:1;
}
.experiencias-preview .habitacion-card .info{
	display:flex; justify-content:space-between; align-items:center; padding:1em 0; background:none; box-shadow:none;
}
.experiencias-preview .habitacion-card .cama{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#5B4C40; }
.experiencias-preview .habitacion-card .ver-mas{ font-family:var(--fuente-texto); font-weight:600; font-size:14px; color:#8A6236; }

@media (max-width:980px){
	.experiencias-grid-cards{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:680px){
	.experiencias-grid-cards{ grid-template-columns:1fr; }
}

/* La isla (grid de fotos, sección verde) */
.isla-titulo{
	font-family:var(--fuente-display); font-weight:300; font-size:48px; text-transform:uppercase;
	letter-spacing:.04em; color:#FBF0E6; margin:0 0 .5em;
}
.isla-lead{ font-family:var(--fuente-texto); font-weight:400; font-size:15px; color:#FBF0E6; opacity:.9; max-width:70ch; margin:0; }
.isla-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:2em; margin-top:2.5em; }
.isla-item .foto{ aspect-ratio:4/3; border-radius:var(--radio); overflow:hidden; box-shadow:var(--sombra); margin-bottom:1em; }
.isla-item .foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.isla-item h4{
	font-family:var(--fuente-texto); font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:.04em;
	color:#FBF0E6; margin:0 0 .4em;
}
.isla-item p{ font-family:var(--fuente-texto); font-weight:400; font-size:13px; color:#FBF0E6; opacity:.78; line-height:1.5; margin:0; }
.isla-botones{ display:flex; gap:1em; flex-wrap:wrap; margin-top:2.5em; }

@media (max-width:980px){
	.isla-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:680px){
	.isla-grid{ grid-template-columns:1fr; }
	.isla-titulo{ font-size:clamp(2rem,8vw,48px); }
}

/* Hero de página de experiencia individual: igual que Tarifas/Pasadía/etc. pero un poco menos alto */
.planes-hero.exp-hero{ min-height:620px; padding:100px 0; }

/* Página de experiencia individual: ficha Dato/Valor + descripción + Incluye/Información importante */
.exp-dato-card h3{
	display:flex; justify-content:space-between; margin:0 0 .6em; padding-bottom:.6em;
	border-bottom:1px solid rgba(0,0,0,.1); font-weight:400;
}
.exp-dato-card h3 span{ font-family:var(--fuente-texto); font-weight:600; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#5B4C40; }
.exp-dato-card .ficha-row span:first-child{ font-family:var(--fuente-display); font-weight:400; font-size:16px; color:#2A2320; }
.exp-dato-card .ficha-row span:last-child{ font-family:var(--fuente-texto); font-weight:400; font-size:14px; color:#2A2320; text-align:left; }
.exp-descripcion{ margin-top:2em; }
.exp-descripcion p{ font-family:var(--fuente-texto); font-weight:400; font-size:18px; line-height:1.6; color:#5B4C40; }
.lista-punto{ list-style:none; padding:0; margin:0; }
.lista-punto li{
	display:flex; gap:.7em; align-items:flex-start; font-family:var(--fuente-texto); font-weight:400;
	font-size:16px; line-height:1.6; color:#5B4C40; padding:.5em 0;
}
.icono-punto{ color:#8A6236; flex-shrink:0; font-weight:700; }

/* Página de experiencia: 2 fotos recortadas del mismo tamaño, centradas
   horizontalmente entre sí, con desfase solo vertical (una más arriba). */
.arco-doble-vertical{ position:relative; padding:30px 0; }
.arco-doble-vertical .foto-a, .arco-doble-vertical .foto-b{ display:block; width:94%; margin:0 auto; overflow:visible; }
.arco-doble-vertical .foto-b{ margin-top:-35%; }
.arco-doble-vertical img{
	width:100%; height:auto; object-fit:contain; display:block;
	filter:drop-shadow(0 16px 26px rgba(42,36,32,.18));
}
/* Variante con fotos reales (no PNG recortado): arco vía border-radius,
   igual criterio que .arco-doble-diagonal.arco-fotos en Bienestar. */
.arco-doble-vertical.arco-fotos .foto-a, .arco-doble-vertical.arco-fotos .foto-b{
	overflow:hidden; box-shadow:var(--sombra); border-radius:16px 200px 16px 16px; aspect-ratio:3/4;
}
.arco-doble-vertical.arco-fotos img{
	width:100%; height:100%; object-fit:cover; filter:none;
}

/* Bienestar (Spa): 2 fotos recortadas del mismo tamaño, en diagonal —
   foto-a arriba a la izquierda, foto-b abajo a la derecha, superpuestas. */
.arco-doble-diagonal{ position:relative; padding:20px 0 40px; }
.arco-doble-diagonal .foto-a, .arco-doble-diagonal .foto-b{ display:block; width:56%; overflow:visible; }
.arco-doble-diagonal .foto-a{ margin:0 auto 0 0; }
.arco-doble-diagonal .foto-b{ width:52%; margin:-38% 0 0 auto; }
.arco-doble-diagonal img{
	width:100%; height:auto; object-fit:contain; display:block;
	filter:drop-shadow(0 16px 26px rgba(42,36,32,.18));
}
@media (max-width:980px){
	.arco-doble-diagonal .foto-b{ margin-top:-20%; }
}

/* Igual que .container a la izquierda, pero a la derecha solo 5% de margen */
.exp-content-bleed{
	max-width:none; margin:0;
	padding-left:calc(max(0px, (100vw - 1260px) / 2) + clamp(24px, 6vw, 72px));
	padding-right:5%;
}

/* Bienestar: cada servicio (Spa/Gimnasio/Yoga) como sección completa */
.bienestar-servicio-seccion .linea-h{
	width:340px; max-width:60%; height:1px; background:#2A2320; margin:0 0 40px;
}
.bienestar-servicio-seccion .marca-vertical .linea-v{ background:#2A2320; opacity:1; }
.bienestar-servicio-seccion .marca-vertical .vertical{
	font-family:var(--fuente-texto); font-weight:400; font-size:18px; letter-spacing:.13em;
	text-transform:uppercase; color:#2A2320; opacity:1;
}
.bienestar-servicio-grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:60px; align-items:start; }
.seccion-badge{
	display:inline-block; font-family:var(--fuente-texto); font-weight:400; font-size:20px;
	color:#FBF0E6; border:1px solid #FBF0E6; border-radius:999px; padding:.5em 1.3em; margin-bottom:1.2em;
}
.bienestar-servicio-titulo{
	font-family:var(--fuente-display); font-weight:600; font-style:normal; text-transform:uppercase;
	font-size:80px; line-height:1.05; color:#FBF0E6; margin:0 0 .4em;
}
.bienestar-servicio-grid .seccion-intro > p{
	font-family:var(--fuente-texto); font-weight:400; font-size:36px; line-height:1.3; color:#FBF0E6;
}
.bienestar-servicio-precio{ font-family:var(--fuente-texto); font-weight:700; font-size:32px; color:#FBF0E6; margin:0 0 1.6em; }
.bienestar-servicio-grid .hero-actions .btn{ font-family:var(--fuente-display); font-weight:400; font-size:16px; }
.bienestar-servicio-grid .hero-actions .btn-crema{ color:#2A2320; }
.bienestar-servicio-grid .hero-actions .btn-outline{ color:#FBF0E6; border-color:#FBF0E6; background:transparent; }

@media (max-width:980px){
	.bienestar-servicio-grid{ grid-template-columns:1fr; }
	.bienestar-servicio-titulo{ font-size:clamp(2.2rem,9vw,80px); }
	.bienestar-servicio-grid .seccion-intro > p{ font-size:clamp(1.2rem,5vw,36px); }
}

/* Variante clara (Gimnasio/Yoga): fondo crema, fotos a la izquierda, texto a la derecha */
.bienestar-servicio-grid-inv{ grid-template-columns:1.05fr 1fr; }
.bienestar-servicio-crema .seccion-intro{ text-align:right; align-self:center; }
.bienestar-servicio-yoga .seccion-intro{ align-self:center; }
.bienestar-servicio-yoga .marca-contenido{ position:relative; }
.bienestar-servicio-yoga .marca-contenido > .linea-h{ position:absolute; top:0; left:0; margin:0; }
.bienestar-servicio-crema .arco-doble-diagonal{ padding-top:0; }
.bienestar-servicio-crema .arco-doble-diagonal .foto-b{ margin-top:-50%; }
.bienestar-servicio-crema .bienestar-servicio-titulo{ color:var(--color-texto-oscuro); }
.bienestar-servicio-crema .bienestar-servicio-grid .seccion-intro > p{
	font-size:36px; color:var(--color-texto-oscuro);
}
.bienestar-servicio-crema .seccion-badge{
	font-family:var(--fuente-texto); font-weight:400; font-size:20px;
	color:var(--color-texto-oscuro); border-color:transparent; background:rgba(91,76,64,.21);
}
.bienestar-servicio-crema .hero-actions{ justify-content:flex-end; }
.bienestar-servicio-crema .hero-actions .btn-crema{ background:#C4996F; border-color:#C4996F; }
.bienestar-servicio-crema .hero-actions .btn-crema:hover{ background:#b6885d; }
.bienestar-servicio-crema .hero-actions .btn-outline{ border-color:#8A6236; color:var(--color-texto-oscuro); }
.bienestar-servicio-crema .hero-actions .btn-outline:hover{ background:rgba(138,98,54,.08); }

/* Fotos reales (no PNG recortado): arco vía border-radius en vez de forma pre-cortada */
.arco-doble-diagonal.arco-fotos .foto-a, .arco-doble-diagonal.arco-fotos .foto-b{
	border-radius:200px 200px 16px 16px; overflow:hidden; box-shadow:var(--sombra); aspect-ratio:3/4;
}
.arco-doble-diagonal.arco-fotos img{ width:100%; height:100%; object-fit:cover; filter:none; }

@media (max-width:980px){
	.bienestar-servicio-grid-inv{ grid-template-columns:1fr; }
}
