/* =========================================================================
   Paracas Explorer — Sistema visual
   Mobile-first. Variables CSS. Sin dependencias externas.
   ========================================================================= */

/* ------------------------------------------------------------------ Tokens */
:root {
	--pex-primary: #006C32;
	--pex-primary-dark: #005126;
	--pex-primary-soft: #e6f2ec;
	/* Más claro que -soft: para paneles de fondo, donde -soft anularía las
	   pastillas que ya usan ese tono. */
	--pex-primary-tint: #f4faf7;
	--pex-ink: #1e242b;
	--pex-ink-soft: #4b555f;
	--pex-gray: #8a939c;
	--pex-line: #e7eaed;
	--pex-line-strong: #cfd6d2;
	--pex-off-white: #f7f8f7;
	--pex-sand: #f3ede2;
	--pex-sand-deep: #e8dfcd;
	--pex-white: #ffffff;
	--pex-wa: #1fa855;
	--pex-star: #f5a623;

	--pex-font: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--pex-radius-sm: 10px;
	--pex-radius: 16px;
	--pex-radius-lg: 22px;
	--pex-radius-pill: 999px;

	--pex-shadow-sm: 0 1px 3px rgba(20, 30, 25, 0.07);
	--pex-shadow: 0 6px 24px rgba(20, 30, 25, 0.09);
	--pex-shadow-lg: 0 16px 48px rgba(20, 30, 25, 0.14);

	/* --pex-bar-h: barra principal (única visible al hacer scroll).
	   --pex-header-h: alto total inicial, usado para el offset del contenido. */
	--pex-bar-h: 84px;
	--pex-topbar-h: 0px;
	--pex-header-h: 84px;
	/* Alto de la barra sticky inferior de mobile, incluido el safe-area. */
	--pex-mobile-bar-h: calc(62px + env(safe-area-inset-bottom));
	--pex-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ------------------------------------------------------------------- Base */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--pex-font);
	font-size: 16px;
	line-height: 1.65;
	color: var(--pex-ink);
	background: var(--pex-white);
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--pex-primary); text-decoration: none; }
a:hover { color: var(--pex-primary-dark); }

h1, h2, h3, h4, h5 {
	line-height: 1.2;
	font-weight: 800;
	letter-spacing: -0.02em;
	margin: 0 0 0.5em;
	color: var(--pex-ink);
}

h1 { font-size: clamp(1.9rem, 5vw, 3.1rem); }
h2 { font-size: clamp(1.5rem, 3.6vw, 2.2rem); }
h3 { font-size: clamp(1.15rem, 2.4vw, 1.4rem); }

p { margin: 0 0 1em; }

ul, ol { padding-left: 1.2em; }

.pex-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

.pex-section { padding: 64px 0; }
.pex-section--alt { background: var(--pex-off-white); }
.pex-section--sand { background: var(--pex-sand); }

.pex-section__head { max-width: 680px; margin: 0 auto 40px; text-align: center; }
.pex-section__head--left { margin-left: 0; text-align: left; }
.pex-section__kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--pex-primary);
	margin-bottom: 10px;
}
.pex-section__subtitle { color: var(--pex-ink-soft); font-size: 1.05rem; margin: 0; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	overflow: hidden;
	word-wrap: normal !important;
}

.skip-link:focus {
	clip: auto; clip-path: none;
	width: auto; height: auto;
	left: 12px; top: 12px;
	z-index: 100000;
	padding: 12px 18px;
	background: var(--pex-white);
	border-radius: var(--pex-radius-sm);
	box-shadow: var(--pex-shadow);
	font-weight: 700;
}

:focus-visible {
	outline: 3px solid var(--pex-primary);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ----------------------------------------------------------------- Íconos */
.pex-icon { flex-shrink: 0; transition: transform 0.35s var(--pex-ease); vertical-align: middle; }

a:hover > .pex-icon,
button:hover > .pex-icon,
.pex-benefit:hover .pex-benefit__icon .pex-icon,
.pex-fact:hover .pex-icon { transform: scale(1.12); }

.pex-icon--whatsapp { color: inherit; }

/* ----------------------------------------------------------------- Botones */
.pex-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 13px 26px;
	border: 2px solid transparent;
	border-radius: var(--pex-radius-pill);
	font-family: var(--pex-font);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	text-align: center;
	transition: transform 0.25s var(--pex-ease), box-shadow 0.25s var(--pex-ease), background 0.25s, color 0.25s, border-color 0.25s;
}

.pex-btn:hover { transform: translateY(-2px); box-shadow: var(--pex-shadow); }
.pex-btn:active { transform: translateY(0); }

.pex-btn--primary { background: var(--pex-primary); color: #fff; }
.pex-btn--primary:hover { background: var(--pex-primary-dark); color: #fff; }

.pex-btn--whatsapp { background: var(--pex-wa); color: #fff; }
.pex-btn--whatsapp:hover { background: #178a45; color: #fff; }

.pex-btn--outline { background: transparent; color: var(--pex-primary); border-color: var(--pex-primary); }
.pex-btn--outline:hover { background: var(--pex-primary); color: #fff; }

.pex-btn--light { background: #fff; color: var(--pex-primary); }
.pex-btn--light:hover { background: var(--pex-off-white); color: var(--pex-primary-dark); }

.pex-btn--ghost-light { background: rgba(255, 255, 255, 0.14); color: #fff; border-color: rgba(255, 255, 255, 0.65); backdrop-filter: blur(4px); }
.pex-btn--ghost-light:hover { background: rgba(255, 255, 255, 0.28); color: #fff; }

.pex-btn--lg { padding: 16px 34px; font-size: 1.05rem; }
.pex-btn--block { width: 100%; }

/* ------------------------------------------------------------------ Header */
body.pex-has-topbar { --pex-topbar-h: 38px; --pex-header-h: 122px; }

.pex-header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 1000;
	transition: background 0.35s var(--pex-ease), box-shadow 0.35s, border-color 0.35s;
}

/* Auto-hide en mobile: al bajar la barra se retira y devuelve su alto al
   contenido; al subir vuelve de inmediato, así el menú queda siempre a un
   gesto de distancia. Con el menú abierto no se transforma nunca: el panel
   `.pex-nav` es `position: fixed` y un ancestro transformado lo arrastraría. */
@media (max-width: 960px) {
	.pex-header {
		transition: background 0.35s var(--pex-ease), box-shadow 0.35s,
			border-color 0.35s, transform 0.3s var(--pex-ease);
	}
	.pex-header.is-hidden:not(.is-open) { transform: translateY(-100%); }
}

@media (prefers-reduced-motion: reduce) {
	.pex-header { transition: none; }
}

.pex-header__bar { height: var(--pex-bar-h); }

.pex-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	height: 100%;
}

/* ------------------------------------------------------- Barra superior */
.pex-topbar {
	height: var(--pex-topbar-h);
	/* Visible para que el desplegable de idiomas no quede recortado. */
	overflow: visible;
	background: var(--pex-primary-dark);
	color: rgba(255, 255, 255, 0.92);
	font-size: 0.78rem;
	transition: height 0.3s var(--pex-ease), opacity 0.3s;
}

/* Al hacer scroll la franja se repliega y queda solo la barra principal. */
.pex-header.is-scrolled .pex-topbar { height: 0; opacity: 0; overflow: hidden; }

.pex-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	height: var(--pex-topbar-h);
}

.pex-topbar__text {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.pex-topbar__text .pex-icon { color: #8fd4ae; flex-shrink: 0; }

.pex-topbar__links { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }

.pex-topbar__link,
.pex-topbar__ta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: var(--pex-radius-sm);
	color: rgba(255, 255, 255, 0.92);
	font-weight: 600;
	white-space: nowrap;
	transition: background 0.2s, color 0.2s;
}
.pex-topbar__link:hover,
.pex-topbar__ta:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
.pex-topbar__link--wa .pex-icon { color: #8fd4ae; }
.pex-topbar__ta .pex-icon { color: var(--pex-star); }
.pex-topbar__ta span { color: rgba(255, 255, 255, 0.75); }

@media (max-width: 900px) {
	.pex-topbar__text { display: none; }
	.pex-topbar__inner { justify-content: center; }
}
/* En teléfono la barra principal baja a 64px: con 84px el cromo fijo
   (header + barra inferior) se comía casi un cuarto de un viewport de
   ~664px. 64px siguen alcanzando para el logo y el burger. */
@media (max-width: 760px) {
	:root { --pex-bar-h: 64px; --pex-header-h: 64px; }
	body.pex-has-topbar { --pex-header-h: 102px; }
}

@media (max-width: 560px) {
	body.pex-has-topbar { --pex-topbar-h: 34px; --pex-header-h: 98px; }
	.pex-topbar { font-size: 0.72rem; }
	.pex-topbar__ta { display: none; }
}

/* Estado sólido al hacer scroll o con el mega menú abierto.
   Blanco pleno, sin esmerilado: el logo tiene fondo blanco propio y sobre
   una barra translúcida se recortaba contra el contenido que pasaba por
   detrás. La opacidad total lo sostiene en cualquier página. */
.pex-header--solid,
.pex-header.is-scrolled,
.pex-header.is-mega-open {
	background: #fff;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 2px 18px rgba(20, 30, 25, 0.06);
}

/* Con el mega menú abierto la barra y el panel forman una sola superficie:
   sin línea ni sombra que las corte. */
.pex-header.is-mega-open {
	border-bottom-color: transparent;
	box-shadow: none;
}

/* Estado transparente sobre el hero */
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) {
	background: transparent;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

/* Altura explícita: los SVG del logo traen viewBox pero no width/height,
   y la regla global img{height:auto} deja al navegador sin dimensiones
   para calcular. Con la altura fija, el ancho sale del viewBox. */
.pex-logo {
	display: block;
	height: 64px;
	width: auto;
	max-width: 260px;
	object-fit: contain;
	object-position: left center;
}

/* Con la barra a 64px el logo baja a 44px y conserva aire arriba y abajo. */
@media (max-width: 760px) {
	.pex-logo { height: 44px; max-width: 190px; }
}
.pex-logo--light { display: none; }

.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-logo--dark { display: none; }
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-logo--light { display: block; }

.pex-logo-text {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--pex-ink);
}
.pex-logo-text .pex-icon { color: var(--pex-primary); }

.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-logo-text { color: #fff; }
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-logo-text .pex-icon { color: #fff; }

/* Navegación desktop */
.pex-nav { display: flex; align-items: center; gap: 28px; }

.pex-nav__list {
	display: flex;
	align-items: center;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.pex-nav__list a {
	display: block;
	padding: 9px 13px;
	border-radius: var(--pex-radius-sm);
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--pex-ink);
	transition: background 0.2s, color 0.2s;
}

.pex-nav__list a:hover { background: var(--pex-primary-soft); color: var(--pex-primary-dark); }

.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-nav__list a { color: #fff; }
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-nav__list a:hover { background: rgba(255, 255, 255, 0.14); color: #fff; }

.pex-nav__list .current-menu-item > a { color: var(--pex-primary); }

/* Submenús */
.pex-nav__list .sub-menu {
	position: absolute;
	min-width: 220px;
	list-style: none;
	margin: 6px 0 0;
	padding: 8px;
	background: #fff;
	border-radius: var(--pex-radius);
	box-shadow: var(--pex-shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.25s, transform 0.25s, visibility 0.25s;
}
.pex-nav__list li { position: relative; }
.pex-nav__list li:hover > .sub-menu,
.pex-nav__list li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.pex-nav__list .sub-menu a { color: var(--pex-ink) !important; }

/* ------------------------------------------------------------ Mega menú */
.pex-mega {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 999;
	padding: 26px 0 24px;
	background: #fff;
	/* Sin borde superior: el header ya está en blanco pleno y la línea
	   marcaría un corte innecesario entre ambas superficies. */
	box-shadow: 0 20px 44px rgba(20, 30, 25, 0.14);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-12px);
	transition:
		opacity 0.3s var(--pex-ease),
		transform 0.38s var(--pex-ease),
		visibility 0.38s;
}

.pex-nav__list > li.pex-has-mega { position: static; }

/* La apertura la controla el JS: entre el ítem y el panel hay una zona
   muerta y con :hover el panel se cerraba al cruzarla. Con clase el
   estado se mantiene hasta que el puntero abandona todo el header. */
.pex-nav__list > li.pex-has-mega.is-mega-active > .pex-mega,
.pex-nav__list > li.pex-has-mega:focus-within > .pex-mega {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Entrada escalonada del contenido: primero baja el panel y los bloques
   lo siguen con un desfase mínimo. Solo se animan opacity y transform,
   que el navegador compone en GPU sin recalcular layout ni pintar de
   nuevo: no agrega coste de carga ni de scroll. */
.pex-mega__inner > * {
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.3s var(--pex-ease), transform 0.3s var(--pex-ease);
}

.pex-nav__list > li.pex-has-mega.is-mega-active > .pex-mega .pex-mega__inner > *,
.pex-nav__list > li.pex-has-mega:focus-within > .pex-mega .pex-mega__inner > * {
	opacity: 1;
	transform: none;
}

/* Los retardos van solo en el estado abierto: al cerrar se quita la clase,
   los delays desaparecen y el panel se va de una sola vez. */
.pex-nav__list > li.pex-has-mega.is-mega-active > .pex-mega .pex-mega__inner > *:nth-child(1) { transition-delay: 0.05s; }
.pex-nav__list > li.pex-has-mega.is-mega-active > .pex-mega .pex-mega__inner > *:nth-child(2) { transition-delay: 0.1s; }
.pex-nav__list > li.pex-has-mega.is-mega-active > .pex-mega .pex-mega__inner > *:nth-child(3) { transition-delay: 0.14s; }

/* El ítem con mega panel no muestra además su submenú clásico. */
.pex-nav__list > li.pex-has-mega > .sub-menu { display: none; }

.pex-mega__head { margin-bottom: 20px; }
.pex-mega__title {
	display: block;
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--pex-primary);
}
.pex-mega__subtitle { display: block; font-size: 0.92rem; color: var(--pex-ink-soft); margin-top: 3px; }

/* minmax(0,1fr) evita que el contenido ensanche las columnas y
   desborde el contenedor. */
.pex-mega__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

/* Card de destino: la foto es la protagonista, con el nombre encima. */
.pex-mega-card {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	border-radius: 14px;
	overflow: hidden;
	background: linear-gradient(160deg, #0e3d26, var(--pex-primary));
	box-shadow: var(--pex-shadow-sm);
	transition: transform 0.3s var(--pex-ease), box-shadow 0.3s var(--pex-ease);
}
.pex-mega-card:hover { transform: translateY(-3px); box-shadow: var(--pex-shadow); }

.pex-mega-card__media {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, 0.6);
}
.pex-mega-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s var(--pex-ease);
}
.pex-mega-card:hover .pex-mega-card__media img { transform: scale(1.07); }

.pex-mega-card__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(6, 16, 11, 0) 35%, rgba(6, 16, 11, 0.82) 100%);
}

.pex-mega-card__body {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 2;
	padding: 12px 14px;
	min-width: 0;
}
.pex-mega-card__name {
	display: block;
	font-size: 0.95rem;
	font-weight: 800;
	line-height: 1.25;
	color: #fff;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}
.pex-mega-card__desc {
	display: block;
	font-size: 0.76rem;
	line-height: 1.35;
	color: rgba(255, 255, 255, 0.85);
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.35s var(--pex-ease), opacity 0.35s, margin-top 0.35s;
}
.pex-mega-card:hover .pex-mega-card__desc,
.pex-mega-card:focus-visible .pex-mega-card__desc {
	max-height: 40px;
	opacity: 1;
	margin-top: 3px;
}

@media (max-width: 1180px) {
	.pex-mega__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Taxonomías a la izquierda y tours a la derecha, en una sola fila. La
   columna de filtros se acota para dejarle el ancho a las cards. */
.pex-mega__body {
	display: grid;
	grid-template-columns: 190px minmax(0, 1fr);
	gap: 36px;
	align-items: start;
}

.pex-mega__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 24px;
}

/* Tres columnas fijas: con auto-fit las cards se estirarían de más si
   alguna vez se muestran menos de tres. */
.pex-mega__featured-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.pex-mega__col-title {
	display: block;
	font-size: 0.72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--pex-gray);
	margin-bottom: 10px;
}
.pex-mega__col ul { list-style: none; margin: 0; padding: 0; }
.pex-mega__col li { margin-bottom: 7px; }
.pex-mega__col a { font-size: 0.9rem; font-weight: 600; color: var(--pex-ink); }
.pex-mega__col a:hover { color: var(--pex-primary); }

.pex-mega__featured {
	display: block;
	padding: 8px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius);
	transition: border-color 0.2s, box-shadow 0.2s;
}
.pex-mega__featured:hover { border-color: var(--pex-primary); box-shadow: var(--pex-shadow-sm); }

.pex-mega__featured-media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	border-radius: 8px;
	overflow: hidden;
	background: var(--pex-primary-soft);
	margin-bottom: 7px;
}
.pex-mega__featured-media img { width: 100%; height: 100%; object-fit: cover; }
.pex-mega__featured-label {
	position: absolute;
	top: 8px; left: 8px;
	padding: 3px 9px;
	background: var(--pex-primary);
	color: #fff;
	font-size: 0.64rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	border-radius: var(--pex-radius-pill);
}
/* Nombre acotado a dos líneas: con tres cards en media fila, un título
   largo desalinearía los precios entre sí. */
.pex-mega__featured-name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 0.82rem;
	font-weight: 700;
	color: var(--pex-ink);
	line-height: 1.28;
	min-height: 2.56em;
}
.pex-mega__featured-price { display: block; font-size: 0.72rem; color: var(--pex-gray); margin-top: 3px; }
.pex-mega__featured-price strong { color: var(--pex-ink); font-size: 0.88rem; }

.pex-mega__foot {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--pex-line);
}
.pex-mega__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.88rem;
	font-weight: 800;
	color: var(--pex-primary);
}
.pex-mega__cta:hover { gap: 12px; }

/* Subrayado animado en los ítems del menú */
.pex-nav__list > li > a { position: relative; }
.pex-nav__list > li > a::after {
	content: "";
	position: absolute;
	left: 13px; right: 13px;
	bottom: 4px;
	height: 2px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s var(--pex-ease);
}
.pex-nav__list > li:hover > a::after { transform: scaleX(1); }

.pex-nav__extra { display: flex; align-items: center; gap: 14px; }

/* Los bloques extra del menú son exclusivos de mobile. */
.pex-nav-mobile { display: none; }

.pex-header__cta { padding: 10px 20px; font-size: 0.9rem; }

/* Hamburguesa */
.pex-burger {
	display: none;
	background: none;
	border: 0;
	padding: 10px;
	cursor: pointer;
	color: var(--pex-ink);
}
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-burger { color: #fff; }
.pex-burger__icon--close { display: none; }
.pex-header.is-open .pex-burger__icon--open { display: none; }
.pex-header.is-open .pex-burger__icon--close { display: block; }

/* Menú mobile */
@media (max-width: 960px) {
	.pex-burger { display: block; }

	.pex-nav {
		position: fixed;
		top: var(--pex-header-h);
		left: 0; right: 0;
		bottom: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
		padding: 22px 20px 40px;
		background: #fff;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		transform: translateX(105%);
		transition: transform 0.4s var(--pex-ease);
	}

	/* Con la franja replegada, el menú arranca bajo la barra principal. */
	.pex-header.is-scrolled .pex-nav { top: var(--pex-bar-h); }

	.pex-header.is-open .pex-nav { transform: translateX(0); }
	.pex-header.is-open .pex-header__bar { background: #fff; }

	.pex-nav__list { flex-direction: column; align-items: stretch; gap: 2px; }
	.pex-nav__list a { font-size: 1.08rem; padding: 12px 10px; color: var(--pex-ink) !important; }
	.pex-nav__list > li > a::after { display: none; }
	.pex-nav__list .sub-menu {
		position: static;
		opacity: 1; visibility: visible; transform: none;
		box-shadow: none;
		padding-left: 18px;
	}

	/* El mega menú es exclusivo de escritorio. */
	.pex-mega { display: none; }

	.pex-nav__extra { flex-direction: column; align-items: stretch; margin-top: 14px; order: 3; }
	.pex-header__cta { width: 100%; padding: 15px 20px; font-size: 1rem; }

	/* -------------------------------------------- Menú mobile premium */
	.pex-nav-mobile { display: block; }

	.pex-nav-mobile__block { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--pex-line); }

	.pex-nav-mobile__title {
		display: block;
		font-size: 0.72rem;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		color: var(--pex-gray);
		margin-bottom: 12px;
	}

	.pex-nav-mobile__dests { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

	.pex-nav-mobile__dest {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 7px;
		border: 1px solid var(--pex-line);
		border-radius: 12px;
		font-size: 0.86rem;
		font-weight: 700;
		color: var(--pex-ink);
	}
	.pex-nav-mobile__dest-media {
		flex-shrink: 0;
		width: 46px; height: 40px;
		border-radius: 9px;
		overflow: hidden;
		background: var(--pex-primary-soft);
		display: flex;
		align-items: center;
		justify-content: center;
		color: var(--pex-primary);
	}
	.pex-nav-mobile__dest-media img { width: 100%; height: 100%; object-fit: cover; }

	.pex-nav-mobile__link {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 12px 14px;
		margin-bottom: 8px;
		border: 1px solid var(--pex-line);
		border-radius: 12px;
		color: var(--pex-ink);
	}
	.pex-nav-mobile__link .pex-icon { color: var(--pex-primary); flex-shrink: 0; }
	.pex-nav-mobile__link strong { display: block; font-size: 0.9rem; }
	.pex-nav-mobile__link small { display: block; font-size: 0.8rem; color: var(--pex-ink-soft); }
	.pex-nav-mobile__link--wa { background: #f2f9f5; border-color: #d3e9dc; }
	.pex-nav-mobile__link--wa .pex-icon { color: var(--pex-wa); }

	.pex-nav-mobile__trust {
		display: flex;
		align-items: flex-start;
		gap: 9px;
		margin: 14px 0 0;
		font-size: 0.8rem;
		line-height: 1.45;
		color: var(--pex-ink-soft);
	}
	.pex-nav-mobile__trust .pex-icon { color: var(--pex-primary); flex-shrink: 0; margin-top: 2px; }
}

/* -------------------------------------------------------------------- Hero */
.pex-hero {
	position: relative;
	min-height: 78vh;
	display: flex;
	align-items: center;
	/* El padding inferior deja aire entre los badges y el cotizador,
	   que se monta sobre el hero con margen negativo. */
	padding: calc(var(--pex-header-h) + 48px) 0 168px;
	overflow: hidden;
	background: #0c1f16;
	color: #fff;
}

.pex-hero__media,
.pex-hero__media video,
.pex-hero__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pex-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(8, 20, 14, 0.55) 0%, rgba(8, 20, 14, var(--pex-hero-overlay, 0.45)) 55%, rgba(8, 20, 14, 0.72) 100%);
}

.pex-hero__content {
	position: relative;
	z-index: 2;
	max-width: 780px;
	margin: 0 auto;
	text-align: center;
}
.pex-hero--left .pex-hero__content { margin-left: 0; text-align: left; }

.pex-hero__title { color: #fff; text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35); margin-bottom: 0.4em; }
.pex-hero__subtitle {
	font-size: clamp(1rem, 2vw, 1.2rem);
	color: rgba(255, 255, 255, 0.92);
	max-width: 640px;
	margin: 0 auto 1.6em;
}
.pex-hero--left .pex-hero__subtitle { margin-left: 0; }

.pex-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.pex-hero--left .pex-hero__actions { justify-content: flex-start; }

.pex-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	justify-content: center;
	list-style: none;
	margin: 34px 0 0;
	padding: 0;
}
.pex-hero--left .pex-hero__badges { justify-content: flex-start; }

.pex-hero__badges li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 0.85rem;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.92);
}
.pex-hero__badges .pex-icon { color: #8fd4ae; }

.pex-hero__scroll {
	position: absolute;
	/* Por encima del cotizador, que se monta sobre el hero. */
	bottom: 132px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	color: rgba(255, 255, 255, 0.75);
	animation: pex-bounce 2.4s infinite;
}

@keyframes pex-bounce {
	0%, 100% { transform: translate(-50%, 0); }
	50% { transform: translate(-50%, 8px); }
}

/* ------------------------------------------------------------- Cotizador */
/* Montado sobre el hero: el panel se apoya sobre la imagen y acerca
   el resto de la home, evitando el vacío entre secciones. */
.pex-quoter {
	position: relative;
	z-index: 5;
	margin-top: -118px;
}

/* La sección siguiente arranca más cerca porque el cotizador ya
   aporta su propio aire. */
.pex-quoter + .pex-section { padding-top: 42px; }

/* Panel principal */
.pex-quoter__panel {
	background: #fff;
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-lg);
	padding: 24px 26px 26px;
}

.pex-quoter__head { margin-bottom: 18px; }
.pex-quoter__title { font-size: 1.25rem; margin: 0 0 4px; }
.pex-quoter__subtitle { font-size: 0.92rem; color: var(--pex-ink-soft); margin: 0; }

.pex-quoter__form {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	align-items: end;
}
@media (min-width: 900px) {
	.pex-quoter__form { grid-template-columns: 1.6fr 1fr 1fr 1fr auto; }
}

.pex-quoter__field { position: relative; min-width: 0; }

.pex-quoter__label {
	display: block;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--pex-gray);
	margin-bottom: 5px;
}

/* Controles: misma caja para botón, select e input */
.pex-quoter__control {
	display: flex;
	align-items: center;
	gap: 9px;
	width: 100%;
	padding: 11px 13px;
	border: 1.5px solid var(--pex-line);
	border-radius: 12px;
	background: var(--pex-off-white);
	font-family: var(--pex-font);
	font-size: 0.92rem;
	font-weight: 600;
	color: var(--pex-ink);
	text-align: left;
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
}
.pex-quoter__control:hover { border-color: #cdd4da; background: #fff; }
.pex-quoter__control:focus-within,
.pex-quoter__control:focus-visible {
	outline: none;
	background: #fff;
	border-color: var(--pex-primary);
	box-shadow: 0 0 0 3px rgba(0, 108, 50, 0.12);
}
.pex-quoter__control > .pex-icon { color: var(--pex-primary); flex-shrink: 0; }

.pex-quoter__value {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--pex-gray);
	font-weight: 600;
}
.pex-quoter__field--dest.has-value .pex-quoter__value,
.pex-quoter__value.has-value { color: var(--pex-ink); }

.pex-quoter__chevron { display: inline-flex; color: var(--pex-ink-soft); transition: transform 0.25s var(--pex-ease); }
.pex-quoter__field.is-open .pex-quoter__chevron { transform: rotate(180deg); }
.pex-quoter__field.is-open .pex-quoter__control { background: #fff; border-color: var(--pex-primary); }

/* Desplegable de destinos */
.pex-quoter__panel-drop {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	z-index: 30;
	min-width: 260px;
	padding: 10px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: 14px;
	box-shadow: var(--pex-shadow-lg);
}

.pex-quoter__hint {
	font-size: 0.74rem;
	color: var(--pex-gray);
	margin: 2px 4px 8px;
}

.pex-quoter__check {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border-radius: 9px;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s;
}
.pex-quoter__check:hover { background: var(--pex-off-white); }
.pex-quoter__check input { position: absolute; opacity: 0; pointer-events: none; }

.pex-quoter__check-box {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px; height: 20px;
	flex-shrink: 0;
	border: 1.5px solid var(--pex-line);
	border-radius: 6px;
	background: #fff;
	color: transparent;
	transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.pex-quoter__check input:checked + .pex-quoter__check-box {
	background: var(--pex-primary);
	border-color: var(--pex-primary);
	color: #fff;
}
.pex-quoter__check input:focus-visible + .pex-quoter__check-box {
	box-shadow: 0 0 0 3px rgba(0, 108, 50, 0.18);
}

/* Variantes de panel */
.pex-quoter__panel-drop--pax { min-width: 250px; padding: 14px; }
.pex-quoter__panel-drop--cal { min-width: 290px; padding: 14px; }
.pex-quoter__panel-drop--list { max-height: 280px; overflow-y: auto; }

/* Panel de viajeros */
.pex-quoter__stepper-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.pex-quoter__stepper-row strong { display: block; font-size: 0.9rem; }
.pex-quoter__stepper-row small { display: block; font-size: 0.75rem; color: var(--pex-gray); }

.pex-quoter__stepper { display: inline-flex; align-items: center; gap: 4px; }
.pex-quoter__stepper button {
	width: 32px; height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1.5px solid var(--pex-line);
	border-radius: 50%;
	background: #fff;
	color: var(--pex-primary);
	font-family: var(--pex-font);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.pex-quoter__stepper button:hover:not(:disabled) { border-color: var(--pex-primary); background: var(--pex-primary-soft); }
.pex-quoter__stepper button:disabled { opacity: 0.4; cursor: not-allowed; color: var(--pex-gray); }
.pex-quoter__stepper output { min-width: 30px; text-align: center; font-weight: 800; font-size: 0.95rem; }

/* Lista de países */
.pex-quoter__option {
	display: block;
	width: 100%;
	padding: 9px 12px;
	border: 0;
	border-radius: 9px;
	background: none;
	font-family: var(--pex-font);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--pex-ink);
	text-align: left;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}
.pex-quoter__option:hover { background: var(--pex-off-white); }
.pex-quoter__option.is-selected { background: var(--pex-primary-soft); color: var(--pex-primary-dark); }

/* --------------------------------------------------- Calendario del theme */
.pex-cal__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 10px;
}
.pex-cal__month { font-size: 0.88rem; font-weight: 800; text-transform: capitalize; }
.pex-cal__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px; height: 30px;
	border: 1.5px solid var(--pex-line);
	border-radius: 50%;
	background: #fff;
	color: var(--pex-primary);
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s;
}
.pex-cal__arrow:hover:not(:disabled) { border-color: var(--pex-primary); background: var(--pex-primary-soft); }
.pex-cal__arrow:disabled { opacity: 0.35; cursor: not-allowed; color: var(--pex-gray); }

.pex-cal__weekdays,
.pex-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.pex-cal__weekdays span {
	text-align: center;
	font-size: 0.68rem;
	font-weight: 800;
	color: var(--pex-gray);
	padding-bottom: 4px;
}

.pex-cal__day {
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 9px;
	background: transparent;
	font-family: var(--pex-font);
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--pex-ink);
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}
.pex-cal__day:hover:not(:disabled) { background: var(--pex-primary-soft); color: var(--pex-primary-dark); }
.pex-cal__day:disabled { color: #c8ced4; cursor: not-allowed; }
.pex-cal__day.is-selected { background: var(--pex-primary); color: #fff; font-weight: 800; }

.pex-quoter__submit { white-space: nowrap; padding: 13px 24px; }

.pex-quoter__note {
	margin: 12px 0 0;
	font-size: 0.84rem;
	font-weight: 600;
	color: #b3261e;
}

@media (max-width: 899px) {
	.pex-quoter { margin-top: -40px; }
	.pex-quoter__panel { padding: 20px; }
	.pex-quoter__submit { width: 100%; margin-top: 4px; }
}

/* -------------------------------------------------------------------- Cards */
.pex-grid { display: grid; gap: 24px; grid-template-columns: 1fr; }

/* ------------------------------------------------------------- Slider */
/* El track es la misma grilla de siempre; solo por debajo de 1000px pasa a
   deslizarse, que es donde las cards no entran. Las medidas por vista
   coinciden con las columnas que ya tenía la grilla en cada breakpoint,
   así la card conserva su tamaño exacto. */
.pex-slider { position: relative; }

.pex-slider__arrow {
	position: absolute;
	z-index: 2;
	display: none;
	place-items: center;
	width: 40px; height: 40px;
	/* Lo calcula el JS con el alto real de la foto: así las flechas quedan
	   centradas sobre la imagen y no sobre el texto de la card. */
	top: var(--pex-slider-arrow-top, 40%);
	transform: translateY(-50%);
	border: 1px solid var(--pex-line);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.95);
	color: var(--pex-ink);
	box-shadow: var(--pex-shadow);
	cursor: pointer;
	transition: opacity 0.2s, background 0.2s;
}
.pex-slider__arrow:hover { background: #fff; }
.pex-slider__arrow[disabled] { opacity: 0; pointer-events: none; }

/* Montadas sobre el borde de la card, mitad adentro y mitad afuera. */
.pex-slider__arrow--prev { left: -8px; }
.pex-slider__arrow--next { right: -8px; }
.pex-slider__arrow--prev .pex-icon { transform: rotate(90deg); }
.pex-slider__arrow--next .pex-icon { transform: rotate(270deg); }

@media (max-width: 999px) {
	.pex-slider__track {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		/* Aire para que la sombra y el hover de la card no se recorten. */
		padding: 6px 6px 12px;
		margin: -6px -6px -12px;
	}
	.pex-slider__track::-webkit-scrollbar { display: none; }

	.pex-slider__track > * {
		flex: 0 0 100%;
		scroll-snap-align: center;
	}

	.pex-slider.is-scrollable .pex-slider__arrow { display: grid; }
}

/* De 640 a 999 la grilla mostraba dos columnas: el slider las conserva. */
@media (min-width: 640px) and (max-width: 999px) {
	.pex-slider__track > * { flex: 0 0 calc(50% - 12px); }
}

@media (prefers-reduced-motion: reduce) {
	.pex-slider__track { scroll-behavior: auto; }
}

@media (min-width: 640px) { .pex-grid--2, .pex-grid--3, .pex-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) {
	.pex-grid--3 { grid-template-columns: repeat(3, 1fr); }
	.pex-grid--4 { grid-template-columns: repeat(4, 1fr); }
	.pex-grid--5 { grid-template-columns: repeat(5, 1fr); }
}
@media (min-width: 640px) and (max-width: 999px) { .pex-grid--5 { grid-template-columns: repeat(2, 1fr); } }

.pex-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	box-shadow: var(--pex-shadow-sm);
	transition: transform 0.35s var(--pex-ease), box-shadow 0.35s var(--pex-ease);
}

.pex-card:hover { transform: translateY(-6px); box-shadow: var(--pex-shadow-lg); }

.pex-card__media {
	position: relative;
	aspect-ratio: 16 / 11;
	overflow: hidden;
	background: linear-gradient(135deg, var(--pex-primary-soft), var(--pex-sand));
}

/* Solo la foto (hijo directo): los logos dentro de overlays no deben
   estirarse al 100% ni recibir el zoom del hover. */
.pex-card__media > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s var(--pex-ease);
}

.pex-card:hover .pex-card__media > img { transform: scale(1.06); }

.pex-card__media-fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: var(--pex-primary);
	opacity: 0.55;
}

.pex-card__badge {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	padding: 5px 12px;
	background: var(--pex-primary);
	color: #fff;
	font-size: 0.72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	border-radius: var(--pex-radius-pill);
	box-shadow: var(--pex-shadow-sm);
}

.pex-card__body { display: flex; flex-direction: column; flex: 1; padding: 20px; gap: 10px; }

.pex-card__title { font-size: 1.12rem; margin: 0; }
.pex-card__title a { color: var(--pex-ink); }
.pex-card__title a:hover { color: var(--pex-primary); }

.pex-card__route { font-size: 0.88rem; color: var(--pex-ink-soft); margin: 0; }

/* Máx. 4 ítems, siempre en una sola fila: el texto largo se recorta con ellipsis. */
.pex-card__meta {
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.78rem;
	color: var(--pex-ink-soft);
}
.pex-card__meta li {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	min-width: 0;
	flex: 0 1 auto;
}
.pex-card__meta li > span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pex-card__meta .pex-icon { color: var(--pex-primary); flex: none; }

.pex-card__rating {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--pex-ink);
}
.pex-card__rating .pex-icon { color: var(--pex-star); fill: var(--pex-star); }

/* Bloque de valoración global: mismo lenguaje que el chip de las cards.
   Las estrellas van llenas siempre; el valor real lo dice el puntaje. */
.pex-rating {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-weight: 700;
	color: var(--pex-ink);
	white-space: nowrap;
}
.pex-rating__stars { display: inline-flex; align-items: center; gap: 1px; }
.pex-rating__stars .pex-icon { color: var(--pex-star); fill: var(--pex-star); }
.pex-rating__score { font-weight: 800; }
.pex-rating__score small { font-weight: 600; color: var(--pex-gray); font-size: 0.78em; }
.pex-rating__count { font-weight: 600; color: var(--pex-ink-soft); }
.pex-rating__logo { flex: none; object-fit: contain; margin-left: 2px; }

.pex-rating--sm { font-size: 0.8rem; gap: 6px; }
.pex-rating--lg { font-size: 1.25rem; gap: 10px; }
.pex-rating--lg .pex-rating__count { font-size: 0.95rem; }

/* En la barra superior el fondo es oscuro. */
.pex-topbar__ta .pex-rating,
.pex-topbar__ta .pex-rating__count { color: inherit; }
.pex-topbar__ta .pex-rating__score small { color: inherit; opacity: 0.75; }

/* El búho es verde oscuro y se pierde contra la barra: va sobre un disco
   blanco. content-box para que el padding agrande el disco y no achique
   el logo, que tiene width/height fijos en el HTML. */
.pex-topbar__ta .pex-rating__logo {
	box-sizing: content-box;
	padding: 3px;
	background: #fff;
	border-radius: 50%;
}

@media (max-width: 640px) {
	.pex-rating--sm .pex-rating__count { display: none; }
}

/* Chip de valoración sobre la foto (abajo izq.; el badge ocupa arriba izq.). */
.pex-card__media-rating {
	position: absolute;
	left: 14px;
	bottom: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	max-width: calc(100% - 28px);
	padding: 5px 11px;
	background: rgba(255, 255, 255, 0.95);
	border-radius: var(--pex-radius-pill);
	box-shadow: var(--pex-shadow-sm);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.pex-card__media-rating .pexrs-rating,
.pex-card__media-rating .pex-card__rating {
	flex-wrap: nowrap;
	gap: 5px;
	font-size: 0.78rem;
	white-space: nowrap;
}
/* En el chip sobran la fuente y el "/5": el contexto ya se entiende. */
.pex-card__media-rating .pexrs-rating__source,
.pex-card__media-rating .pexrs-rating__score small { display: none; }
.pex-card__media-rating .pexrs-rating__count { font-size: 0.74rem; }
.pex-card__media-rating-logo {
	width: 21px;
	height: 21px;
	flex: none;
	object-fit: contain;
	margin-left: 7px;
}

.pex-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--pex-line);
}

.pex-card__price { font-size: 0.8rem; color: var(--pex-gray); line-height: 1.3; }
.pex-card__price strong { display: block; font-size: 1.15rem; color: var(--pex-ink); font-weight: 800; }

/* Precio con oferta: actual + regular tachado a la derecha */
.pex-price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.pex-price__current { font-size: 1.15rem; color: var(--pex-ink); font-weight: 800; }
.pex-price__was { color: var(--pex-gray); font-size: 0.86rem; font-weight: 600; text-decoration: line-through; }

.pex-card__badge--sale { background: #d9432f; }

.pex-card__actions { display: flex; gap: 8px; }
.pex-card__actions .pex-btn { padding: 10px 16px; font-size: 0.85rem; }

.pex-card__link-cover { position: absolute; inset: 0; z-index: 1; }

/* Toda la foto es clicable. z-index 1 la deja por debajo del chip de
   valoración y del badge, que van en 2. */
.pex-card__media-link {
	position: absolute;
	inset: 0;
	z-index: 1;
}
/* El cursor de mano ya lo da el enlace; el zoom del hover sigue siendo
   de la card, así que la foto responde igual al pasar por encima. */
.pex-card__media-link:focus-visible {
	outline: 2px solid var(--pex-primary);
	outline-offset: -3px;
}
.pex-card__actions, .pex-card__footer a { position: relative; z-index: 2; }

/* Card de destino */
.pex-dcard {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	background: linear-gradient(160deg, #0e3d26, var(--pex-primary));
	box-shadow: var(--pex-shadow-sm);
	transition: transform 0.35s var(--pex-ease), box-shadow 0.35s var(--pex-ease);
}
.pex-dcard:hover { transform: translateY(-6px); box-shadow: var(--pex-shadow-lg); }

.pex-dcard img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 0.6s var(--pex-ease);
}
.pex-dcard:hover img { transform: scale(1.07); }

.pex-dcard::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(6, 16, 11, 0) 35%, rgba(6, 16, 11, 0.82) 100%);
}

.pex-dcard__body {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 2;
	padding: 18px;
	color: #fff;
}

.pex-dcard__icon { color: #a8ddc2; margin-bottom: 6px; }
.pex-dcard__title { color: #fff; font-size: 1.15rem; margin: 0 0 4px; }
.pex-dcard__desc {
	font-size: 0.83rem;
	color: rgba(255, 255, 255, 0.88);
	margin: 0;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.45s var(--pex-ease), opacity 0.45s;
}
.pex-dcard:hover .pex-dcard__desc, .pex-dcard:focus .pex-dcard__desc { max-height: 90px; opacity: 1; }

.pex-dcard__badge {
	position: absolute;
	top: 14px; left: 14px;
	z-index: 2;
	padding: 4px 11px;
	background: rgba(255, 255, 255, 0.92);
	color: var(--pex-primary-dark);
	font-size: 0.7rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	border-radius: var(--pex-radius-pill);
}

/* Card de paquete */
/* La card de paquete se diferencia de la de tour por tres cosas: el borde
   apilado que sugiere varios días, el itinerario con paradas y la fila de
   servicios incluidos (alojamiento y comidas, que un tour suelto no trae). */
.pex-pcard {
	display: flex;
	flex-direction: column;
	position: relative;
}

/* Hoja apilada detrás: se ve solo el canto superior. */
.pex-pcard::before {
	content: "";
	position: absolute;
	top: -6px;
	left: 10px;
	right: 10px;
	height: 14px;
	background: var(--pex-off-white, #f7f7f4);
	border: 1px solid var(--pex-line);
	border-bottom: 0;
	border-radius: var(--pex-radius-lg) var(--pex-radius-lg) 0 0;
	z-index: -1;
}

.pex-pcard .pex-card__media { aspect-ratio: 16 / 9; }

/* Sello de días sobre la foto, abajo a la derecha. */
.pex-pcard__days {
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	background: var(--pex-ink);
	color: #fff;
	font-size: 0.78rem;
	font-weight: 800;
	border-radius: var(--pex-radius-pill);
	box-shadow: var(--pex-shadow-sm);
}
.pex-pcard__days .pex-icon { color: #fff; }

/* Itinerario: paradas unidas por una línea vertical. */
.pex-pcard__route {
	position: relative;
	margin: 0;
	padding: 0 0 0 15px;
	list-style: none;
	font-size: 0.84rem;
	color: var(--pex-ink-soft);
}
.pex-pcard__route::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 7px;
	bottom: 7px;
	width: 2px;
	background: var(--pex-line);
}
.pex-pcard__route li { position: relative; padding: 1px 0; }
.pex-pcard__route-dot {
	position: absolute;
	left: -15px;
	top: 7px;
	width: 8px;
	height: 8px;
	background: #fff;
	border: 2px solid var(--pex-primary);
	border-radius: 50%;
}

/* Servicios incluidos. */
.pex-pcard__includes {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.pex-pcard__includes li {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 9px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary-dark, var(--pex-primary));
	font-size: 0.74rem;
	font-weight: 700;
	border-radius: var(--pex-radius-pill);
}
.pex-pcard__includes .pex-icon { color: var(--pex-primary); }

.pex-pcard__dests { font-size: 0.85rem; color: var(--pex-ink-soft); margin: 0; }
.pex-pcard__ideal {
	font-size: 0.8rem;
	color: var(--pex-gray);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 6px;
}

/* ------------------------------------------------------------- Beneficios */
.pex-benefits { display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pex-benefits { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .pex-benefits { grid-template-columns: repeat(4, 1fr); } }

.pex-benefit {
	padding: 26px 22px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius);
	transition: transform 0.3s var(--pex-ease), box-shadow 0.3s var(--pex-ease);
}
.pex-benefit:hover { transform: translateY(-4px); box-shadow: var(--pex-shadow); }

.pex-benefit__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px; height: 52px;
	border-radius: 14px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary);
	margin-bottom: 14px;
}

.pex-benefit__title { font-size: 1rem; margin-bottom: 6px; }
.pex-benefit__desc { font-size: 0.88rem; color: var(--pex-ink-soft); margin: 0; }

/* ------------------------------------------------- Destacados (Ballestas) */
.pex-highlight__grid {
	display: grid;
	gap: 34px;
	grid-template-columns: 1fr;
	align-items: center;
}

.pex-highlight__media {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	background: linear-gradient(150deg, #0e3d26, var(--pex-primary));
	box-shadow: var(--pex-shadow);
}
.pex-highlight__media img { width: 100%; height: 100%; object-fit: cover; }

.pex-highlight__actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* En mobile los dos botones ocupan el ancho completo. No se centran: el
   bloque entero está alineado a la izquierda y mezclar ejes se nota. Con
   el mismo ancho, además, la pila se lee prolija y el área táctil crece. */
@media (max-width: 640px) {
	.pex-highlight__actions { flex-direction: column; align-items: stretch; gap: 10px; }
	.pex-highlight__actions .pex-btn { width: 100%; justify-content: center; }
}

/* En escritorio la imagen acompaña la altura de la columna de texto para
   que ambos bordes queden alineados.
   Va después de la regla base: si se declarara antes, el aspect-ratio 4/3
   seguiría vigente y el navegador calcularía el ANCHO a partir de la
   altura, desbordando la columna. */
@media (min-width: 900px) {
	/* minmax(0,...) permite que la columna se achique por debajo del ancho
	   intrínseco de la foto. */
	.pex-highlight__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
		gap: 56px;
		align-items: stretch;
	}
	.pex-highlight__media {
		aspect-ratio: auto;
		height: 100%;
		min-height: 380px;
	}
	.pex-highlight__body { display: flex; flex-direction: column; justify-content: center; }
}

.pex-highlight__fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: rgba(255, 255, 255, 0.55);
}

.pex-highlight__pill {
	position: absolute;
	top: 16px; left: 16px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 7px 15px;
	background: #fff;
	color: var(--pex-primary-dark);
	font-size: 0.76rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	border-radius: var(--pex-radius-pill);
	box-shadow: var(--pex-shadow);
}
.pex-highlight__pill .pex-icon { color: var(--pex-primary); }

.pex-highlight__pill--static {
	position: static;
	background: var(--pex-primary);
	color: #fff;
	margin-bottom: 14px;
	box-shadow: none;
}
.pex-highlight__pill--static .pex-icon { color: #fff; }

.pex-highlight__text { color: var(--pex-ink-soft); font-size: 1.02rem; }

.pex-highlight__points { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 12px; }
.pex-highlight__points li { display: flex; align-items: center; gap: 12px; font-weight: 600; font-size: 0.95rem; }

.pex-highlight__point-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: 12px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary);
}

/* --------------------------------------------------------------- Transporte */

/* Corredor: la línea corre por detrás y se recorta en el primer y último
   nodo para que no sobresalga de los extremos. */
.pex-corridor {
	margin-top: 28px;
	padding: 22px 16px 18px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-sm);
	overflow-x: auto;
}

.pex-corridor__track {
	position: relative;
	display: flex;
	min-width: 340px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pex-corridor__track::before {
	content: "";
	position: absolute;
	top: 6px;
	left: calc(50% / var(--pex-corridor-count, 4));
	right: calc(50% / var(--pex-corridor-count, 4));
	height: 2px;
	background: var(--pex-line);
}

.pex-corridor__node {
	position: relative;
	flex: 1;
	min-width: 0;
	text-align: center;
}

.pex-corridor__dot {
	display: block;
	width: 13px;
	height: 13px;
	margin: 0 auto 9px;
	background: var(--pex-primary);
	border: 2px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 2px var(--pex-primary);
}

.pex-corridor__name {
	display: block;
	padding: 0 4px;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--pex-ink);
	/* Que envuelva entre palabras, nunca dentro de una: "Huacachin/a"
	   es peor que dos líneas limpias. */
	word-break: keep-all;
	overflow-wrap: normal;
	hyphens: none;
	text-wrap: balance;
}

/* En mobile el corredor sigue horizontal: son cuatro nodos y la línea es
   el mensaje. Se achica la tipografía en vez de pasarlo a vertical, que
   alargaría la home para decir lo mismo. */
@media (max-width: 560px) {
	.pex-corridor {
		padding: 20px 10px 16px;
		overflow-x: visible;
	}
	.pex-corridor__track { min-width: 0; }
	.pex-corridor__name { padding: 0 2px; font-size: 0.74rem; line-height: 1.25; }
	.pex-corridor__dot { width: 11px; height: 11px; margin-bottom: 8px; }
	.pex-corridor__track::before { top: 5px; }
}

/* Ruta regular: bloque destacado, por encima de los privados. */
.pex-route-main {
	display: grid;
	gap: 16px 28px;
	align-items: center;
	margin-top: 16px;
	padding: 22px 24px;
	background: #fff;
	border: 2px solid var(--pex-primary);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-sm);
}
@media (min-width: 900px) {
	.pex-route-main { grid-template-columns: minmax(0, 1fr) auto auto; }
}

.pex-route-main__pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 8px;
	padding: 4px 11px;
	background: var(--pex-primary);
	color: #fff;
	font-size: 0.72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	border-radius: var(--pex-radius-pill);
}

.pex-route-main__title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px;
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--pex-ink);
}

.pex-route-main__deps {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.pex-route-main__deps li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 10px;
	padding: 8px 14px;
	background: var(--pex-sand, #f7f2ea);
	border-radius: var(--pex-radius);
	font-size: 0.85rem;
}
.pex-route-main__dep-from { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--pex-ink); }
.pex-route-main__dep-from .pex-icon { color: var(--pex-primary); }
.pex-route-main__dep-freq { color: var(--pex-ink-soft); }
.pex-route-main__dep-times { font-weight: 700; color: var(--pex-primary); }

.pex-route-main .pex-btn { white-space: nowrap; }
@media (min-width: 900px) { .pex-route-main .pex-btn--block { width: auto; } }

.pex-transport__subtitle {
	margin: 30px 0 0;
	font-size: 1rem;
	font-weight: 800;
	color: var(--pex-ink-soft);
	text-align: center;
}

/* Rutas privadas: grilla en vez de filas de ancho completo. */
.pex-transport__routes {
	display: grid;
	gap: 12px;
	margin-top: 16px;
	grid-template-columns: 1fr;
}
@media (min-width: 640px) { .pex-transport__routes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pex-transport__routes { grid-template-columns: repeat(3, 1fr); } }

.pex-route-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 16px 18px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius);
	box-shadow: var(--pex-shadow-sm);
	transition: border-color 0.2s var(--pex-ease), transform 0.2s var(--pex-ease);
}
.pex-route-card:hover { border-color: var(--pex-primary); transform: translateY(-2px); }

.pex-route-card__title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 7px;
	margin: 0;
	font-size: 0.98rem;
	font-weight: 800;
	color: var(--pex-ink);
}
.pex-route-card__arrow { color: var(--pex-primary); font-weight: 400; }

.pex-route-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	margin: 0;
	font-size: 0.83rem;
	color: var(--pex-ink-soft);
}
.pex-route-card__meta span { display: inline-flex; align-items: center; gap: 6px; }
.pex-route-card__meta .pex-icon { color: var(--pex-primary); flex: none; }

.pex-route-card .pex-btn { margin-top: auto; }
.pex-btn--block { display: flex; width: 100%; justify-content: center; }

/* CTA de ruta a medida: barra de ancho completo, para no dejar una card
   suelta como cuarto ítem de una grilla de tres. */
.pex-route-custom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px 20px;
	margin-top: 12px;
	padding: 16px 22px;
	background: #fff;
	border: 1px dashed var(--pex-primary);
	border-radius: var(--pex-radius);
	text-align: center;
}
.pex-route-custom__text {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--pex-ink);
}
.pex-route-custom__text .pex-icon { color: var(--pex-primary); flex: none; }

/* Flota: franja de apoyo, ya no tarjetas. */
.pex-fleet-strip {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px 24px;
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid var(--pex-line);
}
.pex-fleet-strip__label {
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--pex-gray);
	font-weight: 700;
}
.pex-fleet-strip__item {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--pex-ink-soft);
}
.pex-fleet-strip__item .pex-icon { color: var(--pex-primary); }

/* En mobile el rótulo ocupa la primera línea completa y empuja los tres
   ítems abajo, en su propia fila. Con el rótulo en línea quedaban dos
   ítems arriba y uno colgado. */
@media (max-width: 640px) {
	.pex-fleet-strip { gap: 12px 18px; }
	.pex-fleet-strip__label { flex: 0 0 100%; text-align: center; }
	.pex-fleet-strip__item { font-size: 0.84rem; }
}

/* ------------------------------------------------------------ Ruta visual */
.pex-route { overflow-x: auto; padding-bottom: 12px; scrollbar-width: thin; }

.pex-route__track {
	display: flex;
	align-items: flex-start;
	gap: 0;
	min-width: 760px;
	padding: 20px 6px 6px;
}

.pex-route__stop {
	position: relative;
	flex: 1;
	min-width: 100px;
	text-align: center;
	padding: 0 8px;
}

.pex-route__stop::before {
	content: "";
	position: absolute;
	top: 27px;
	left: 50%;
	width: 100%;
	border-top: 2px dashed var(--pex-sand-deep);
}
.pex-route__stop:last-child::before { display: none; }

.pex-route__dot {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px; height: 54px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--pex-primary);
	color: var(--pex-primary);
	box-shadow: var(--pex-shadow-sm);
	transition: transform 0.3s var(--pex-ease), background 0.3s, color 0.3s;
}

.pex-route__stop:hover .pex-route__dot { transform: scale(1.1); background: var(--pex-primary); color: #fff; }

.pex-route__name { display: block; font-weight: 800; font-size: 0.9rem; margin-top: 10px; }
.pex-route__desc { display: block; font-size: 0.76rem; color: var(--pex-ink-soft); margin-top: 2px; }

/* ------------------------------------------------------- Mapa de la ruta */
.pex-map {
	position: relative;
	max-width: 980px;
	margin-inline: auto;
}

.pex-map__canvas { display: block; width: 100%; height: auto; }

.pex-map__ocean { fill: #e9f1f5; }
.pex-map__land { fill: #fdfcfa; }
.pex-map__coast { fill: none; stroke: #b6c6cd; stroke-width: 2; }
.pex-map__lake { fill: #cbe1eb; stroke: #a4c4d1; stroke-width: 1.5; }

.pex-map__route {
	fill: none;
	stroke: var(--pex-primary);
	stroke-width: 2.5;
	stroke-dasharray: 9 9;
	stroke-linecap: round;
	opacity: 0.85;
}

.pex-map__dot { fill: #fff; stroke: var(--pex-primary); stroke-width: 3.5; }

/* Rótulos cartográficos: llenan el océano y el altiplano, que si no quedan
   como dos vacíos grandes, y le dan al bloque lectura de mapa. */
.pex-map__sea,
.pex-map__range {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.24em;
	text-anchor: middle;
}
.pex-map__sea { fill: #a7bcc5; }
.pex-map__range { fill: #cdbfa6; }

/* Las etiquetas van en HTML sobre el SVG para que el texto conserve su
   tamaño en px reales: dentro del viewBox se encogería con el mapa. */
.pex-map__pins { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }

.pex-map__pin {
	position: absolute;
	display: grid;
	width: max-content;
	max-width: 150px;
	line-height: 1.25;
}

.pex-map__name { font-size: 0.94rem; font-weight: 800; color: var(--pex-ink); }
.pex-map__desc { font-size: 0.76rem; color: var(--pex-ink-soft); }

/* Chapa numerada: en el mapa marca la parada, en la leyenda la enlaza. El
   aro blanco hace que dos paradas vecinas se lean como superpuestas y no
   como un choque: Paracas e Ica, y Cusco y Machu Picchu, casi se tocan. */
.pex-map__num {
	display: none;
	place-items: center;
	width: 22px; height: 22px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: var(--pex-primary);
	color: #fff;
	font-size: 0.7rem;
	font-weight: 800;
	line-height: 1;
	box-shadow: 0 1px 4px rgba(20, 30, 25, 0.28);
}

/* La dirección solo decide hacia qué lado se despliega el texto, para que
   no pise la ruta ni a la parada vecina. */
@media (min-width: 761px) {
	.pex-map__pin--n { transform: translate(-50%, calc(-100% - 14px)); text-align: center; }
	.pex-map__pin--s { transform: translate(-50%, 14px); text-align: center; }
	.pex-map__pin--e { transform: translate(16px, -50%); }
	.pex-map__pin--w { transform: translate(calc(-100% - 16px), -50%); text-align: right; }
	.pex-map__pin--ne { transform: translate(14px, calc(-100% - 6px)); }
	.pex-map__pin--nw { transform: translate(calc(-100% - 14px), calc(-100% - 6px)); text-align: right; }
	.pex-map__pin--se { transform: translate(14px, 6px); }
	.pex-map__pin--sw { transform: translate(calc(-100% - 14px), 6px); text-align: right; }
}

.pex-map__legend { display: none; }

/* En mobile el mapa no puede sostener ocho etiquetas de texto: el SVG escala
   a ~0,4 y cualquier tamaño legible se pisaría con el vecino. Los pines
   quedan como números sobre el mapa y el texto baja a una leyenda de dos
   columnas, que ocupa la mitad que la lista vertical. */
@media (max-width: 760px) {
	.pex-map__sea,
	.pex-map__range { display: none; }

	.pex-map__pin { transform: translate(-50%, -50%); max-width: none; }

	/* El texto sigue en el DOM para lectores de pantalla. */
	.pex-map__pin .pex-map__name,
	.pex-map__pin .pex-map__desc {
		position: absolute;
		width: 1px; height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
	}

	.pex-map__pin .pex-map__num { display: grid; }

	.pex-map__legend {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px 14px;
		margin: 20px 0 0;
		padding: 0;
		list-style: none;
	}
	.pex-map__legend li {
		display: grid;
		grid-template-columns: 22px minmax(0, 1fr);
		gap: 0 9px;
		align-items: start;
	}
	.pex-map__legend .pex-map__num { display: grid; margin-top: 1px; }
	.pex-map__legend .pex-map__name,
	.pex-map__legend .pex-map__desc { display: block; }
}

/* En mobile la ruta se pone vertical. En horizontal el track necesita
   760px y obliga a un scroll que deja las paradas cortadas: el usuario ve
   media palabra y no sabe que hay más. En vertical entra todo, sin scroll
   y sin cortes de palabra, y se lee como el itinerario que es. */
@media (max-width: 720px) {
	.pex-route { overflow-x: visible; padding-bottom: 0; }

	/* El bloque se centra como conjunto, pero el texto de cada parada
	   queda alineado a la izquierda: centrar líneas de distinto largo
	   rompe el eje de lectura. fit-content mide la fila más ancha. */
	.pex-route__track {
		display: grid;
		width: fit-content;
		max-width: 100%;
		min-width: 0;
		margin-inline: auto;
		padding: 6px 0 0;
	}

	.pex-route__stop {
		display: grid;
		grid-template-columns: 54px minmax(0, 1fr);
		align-items: start;
		gap: 0 16px;
		padding: 0 0 26px;
		text-align: left;
	}
	.pex-route__stop:last-child { padding-bottom: 0; }

	/* El conector pasa de horizontal a vertical, alineado con el círculo. */
	.pex-route__stop::before {
		top: 54px;
		bottom: -4px;
		left: 26px;
		width: 0;
		height: auto;
		border-top: 0;
		border-left: 2px dashed var(--pex-sand-deep);
	}

	/* Posición explícita: sin esto la descripción cae bajo el círculo en
	   vez de bajo el nombre, porque la grilla la coloca por orden. */
	.pex-route__dot { grid-column: 1; grid-row: 1 / span 2; }

	.pex-route__name {
		grid-column: 2;
		grid-row: 1;
		margin-top: 0;
		padding-top: 14px;
		font-size: 0.98rem;
	}
	.pex-route__desc {
		grid-column: 2;
		grid-row: 2;
		font-size: 0.84rem;
		margin-top: 3px;
	}

	/* Sin hover en táctil: el círculo no debe quedar en estado activo. */
	.pex-route__stop:hover .pex-route__dot { transform: none; background: #fff; color: var(--pex-primary); }
}

/* ---------------------------------------------------------------- Reseñas */
.pex-reviews__score {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin-bottom: 26px;
}

.pex-reviews__rating {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 1.6rem;
	font-weight: 800;
}
.pex-reviews__rating .pex-icon { color: var(--pex-star); }

.pex-reviews__count { color: var(--pex-ink-soft); font-size: 0.95rem; }

.pex-reviews__fallback {
	max-width: 560px;
	margin: 0 auto;
	text-align: center;
	padding: 40px 26px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
}
.pex-reviews__fallback .pex-icon { color: var(--pex-primary); margin-bottom: 12px; }

.pex-reviews__cta { text-align: center; margin-top: 28px; }

/* ------------------------------------------------------------------- Blog */
.pex-post-card .pex-card__media { aspect-ratio: 16 / 10; }
.pex-post-card time { font-size: 0.78rem; color: var(--pex-gray); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.pex-post-card__excerpt { font-size: 0.9rem; color: var(--pex-ink-soft); margin: 0; }

.pex-post-card__more {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-weight: 700;
	font-size: 0.9rem;
	margin-top: auto;
}

/* --------------------------------------------------------------- CTA final */
.pex-final-cta {
	background: linear-gradient(140deg, var(--pex-primary-dark) 0%, var(--pex-primary) 60%, #0d8446 100%);
	color: #fff;
	padding: 72px 0;
}

.pex-final-cta__inner { max-width: 640px; text-align: center; }
.pex-final-cta__icon { color: rgba(255, 255, 255, 0.85); margin-bottom: 14px; }
.pex-final-cta__title { color: #fff; }
.pex-final-cta__text { color: rgba(255, 255, 255, 0.92); font-size: 1.05rem; margin-bottom: 1.8em; }

/* ------------------------------------------------------------------ Footer */
.pex-footer {
	background: #10161c;
	color: #b9c2ca;
	padding: 64px 0 0;
	font-size: 0.92rem;
}

.pex-footer a { color: #d7dee4; }
.pex-footer a:hover { color: #fff; }

.pex-footer__grid { display: grid; gap: 36px; grid-template-columns: 1fr; padding-bottom: 44px; }
@media (min-width: 700px) { .pex-footer__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1020px) { .pex-footer__grid { grid-template-columns: 1.4fr 1fr 0.8fr 0.9fr; } }

.pex-footer__logo { display: inline-block; margin-bottom: 14px; }
.pex-logo-text--footer { color: #fff; }
.pex-logo-text--footer .pex-icon { color: #6fc79a; }

.pex-footer__title {
	color: #fff;
	font-size: 0.85rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	margin-bottom: 18px;
}

.pex-footer__menu, .pex-footer__contact { list-style: none; margin: 0; padding: 0; }
.pex-footer__menu li { margin-bottom: 10px; }

.pex-footer__contact li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 12px;
}
.pex-footer__contact li > .pex-icon { color: #6fc79a; margin-top: 3px; }
.pex-footer__contact a { display: inline-flex; align-items: center; gap: 10px; }
.pex-footer__contact a .pex-icon { color: #6fc79a; }

.pex-footer__social { display: flex; gap: 10px; list-style: none; margin: 18px 0 0; padding: 0; }
.pex-footer__social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	transition: background 0.25s, transform 0.25s var(--pex-ease);
}
.pex-footer__social a:hover { background: var(--pex-primary); transform: translateY(-3px); }

.pex-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding: 20px 0;
	font-size: 0.82rem;
	color: #77828c;
	text-align: center;
}
.pex-footer__bottom p { margin: 0; }

/* En mobile las columnas se apilan y quedan como bloques sueltos alineados
   a la izquierda. Centradas se leen como un cierre ordenado. */
@media (max-width: 699px) {
	.pex-footer__grid { text-align: center; gap: 30px; }

	.pex-footer__col--brand p { margin-inline: auto; max-width: 40ch; }

	.pex-footer__social { justify-content: center; }

	/* Los ítems de contacto son flex: hay que centrarlos a nivel de fila
	   y también dentro del enlace, que tiene ícono más texto. */
	.pex-footer__contact li,
	.pex-footer__contact a { justify-content: center; }
	.pex-footer__contact li { text-align: left; }

	.pex-footer__pay-list { justify-content: center; }

	/* El selector de idioma es un bloque en línea: se centra con margen
	   automático, no con text-align. */
	.pex-footer__col .pex-weglot { margin-inline: auto; }
}

/* --------------------------------------------------- Barra mobile / float */
.pex-mobile-bar {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 990;
	display: none;
	min-height: var(--pex-mobile-bar-h);
	padding: 8px 14px calc(8px + env(safe-area-inset-bottom));
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	border-top: 1px solid var(--pex-line);
	box-shadow: 0 -6px 24px rgba(20, 30, 25, 0.1);
}

/* Alto de botón acotado para que la barra respete `--pex-mobile-bar-h`
   y el hueco reservado en el body coincida con lo que ocupa. */
.pex-mobile-bar .pex-btn { padding-top: 11px; padding-bottom: 11px; }

.pex-mobile-bar__btn { width: 100%; }

@media (max-width: 760px) {
	.pex-mobile-bar { display: block; }

	/* El hueco se reserva solo donde la barra se renderiza. */
	body.pex-has-mobile-bar { padding-bottom: var(--pex-mobile-bar-h); }
}

.pex-wa-float {
	position: fixed;
	right: 22px; bottom: 22px;
	z-index: 990;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px; height: 58px;
	border-radius: 50%;
	background: var(--pex-wa);
	color: #fff;
	box-shadow: 0 8px 28px rgba(31, 168, 85, 0.45);
	transition: transform 0.3s var(--pex-ease);
	animation: pex-pulse 3s infinite;
}
.pex-wa-float:hover { transform: scale(1.08); color: #fff; }

/* En mobile la barra sticky inferior ya ofrece WhatsApp y reserva:
   el botón flotante se oculta para no duplicar el CTA ni taparla.
   (Va después de la regla base para ganar la cascada.) */
@media (max-width: 760px) {
	.pex-wa-float { display: none; }

	/* Carrito y checkout no llevan barra inferior: ahí el flotante
	   se mantiene para no dejar al usuario sin contacto rápido. */
	.woocommerce-cart .pex-wa-float,
	.woocommerce-checkout .pex-wa-float { display: inline-flex; }
}

@keyframes pex-pulse {
	0%, 100% { box-shadow: 0 8px 28px rgba(31, 168, 85, 0.45), 0 0 0 0 rgba(31, 168, 85, 0.35); }
	50% { box-shadow: 0 8px 28px rgba(31, 168, 85, 0.45), 0 0 0 12px rgba(31, 168, 85, 0); }
}

/* ------------------------------------------------------------- Breadcrumbs */
.pex-breadcrumbs { font-size: 0.82rem; }
.pex-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.pex-breadcrumbs li { display: flex; align-items: center; gap: 6px; }
.pex-breadcrumbs li + li::before { content: "›"; color: var(--pex-gray); }
.pex-breadcrumbs span { color: var(--pex-gray); }

/* ---------------------------------------------------------------- Archivo */
.pex-archive-hero {
	padding: calc(var(--pex-header-h) + 40px) 0 40px;
	background: linear-gradient(150deg, #0e2c1d, var(--pex-primary-dark));
	color: #fff;
}
.pex-archive-hero h1 { color: #fff; margin-bottom: 0.3em; }
.pex-archive-hero p { color: rgba(255, 255, 255, 0.88); max-width: 640px; margin: 0; }
.pex-archive-hero .pex-breadcrumbs a { color: rgba(255, 255, 255, 0.85); }
.pex-archive-hero .pex-breadcrumbs span { color: rgba(255, 255, 255, 0.6); }
.pex-archive-hero .pex-breadcrumbs { margin-bottom: 14px; }

.pex-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: end;
	padding: 18px;
	margin: 26px 0;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius);
	box-shadow: var(--pex-shadow-sm);
}

.pex-filters__field { flex: 1; min-width: 150px; }
.pex-filters__field label {
	display: block;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--pex-gray);
	margin-bottom: 4px;
}
.pex-filters__field select {
	width: 100%;
	padding: 10px 12px;
	border: 1.5px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
	font-family: var(--pex-font);
	background: var(--pex-off-white);
}

/* Paginación */
.pex-pagination { display: flex; justify-content: center; gap: 6px; margin: 40px 0 10px; }
.pex-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px; height: 42px;
	padding: 0 10px;
	border-radius: var(--pex-radius-sm);
	border: 1px solid var(--pex-line);
	font-weight: 700;
	color: var(--pex-ink);
}
.pex-pagination .page-numbers.current { background: var(--pex-primary); border-color: var(--pex-primary); color: #fff; }
.pex-pagination a.page-numbers:hover { border-color: var(--pex-primary); color: var(--pex-primary); }

/* -------------------------------------------------------------- Contenido */
.pex-page-hero {
	padding: calc(var(--pex-header-h) + 44px) 0 44px;
	background: var(--pex-off-white);
	border-bottom: 1px solid var(--pex-line);
}
.pex-page-hero .pex-breadcrumbs { margin-bottom: 12px; }

.pex-content { padding: 48px 0 64px; }
.pex-content--narrow { max-width: 760px; margin: 0 auto; }

.pex-prose { font-size: 1rem; }
.pex-prose img { border-radius: var(--pex-radius); }
.pex-prose h2 { margin-top: 1.6em; }
.pex-prose blockquote {
	margin: 1.4em 0;
	padding: 4px 22px;
	border-left: 4px solid var(--pex-primary);
	background: var(--pex-off-white);
	border-radius: 0 var(--pex-radius-sm) var(--pex-radius-sm) 0;
	font-style: italic;
}

/* --------------------------------------------------------------- Formularios */
.pex-form { display: grid; gap: 14px; }
.pex-form__row { display: grid; gap: 14px; }
@media (min-width: 640px) { .pex-form__row--2 { grid-template-columns: 1fr 1fr; } }

.pex-form label { font-size: 0.85rem; font-weight: 700; display: block; margin-bottom: 5px; }

.pex-form input[type="text"],
.pex-form input[type="email"],
.pex-form input[type="tel"],
.pex-form input[type="date"],
.pex-form input[type="number"],
.pex-form select,
.pex-form textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
	font-family: var(--pex-font);
	font-size: 0.95rem;
	background: #fff;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.pex-form input:focus,
.pex-form select:focus,
.pex-form textarea:focus {
	outline: none;
	border-color: var(--pex-primary);
	box-shadow: 0 0 0 3px rgba(0, 108, 50, 0.12);
}

.pex-form__privacy { display: flex; gap: 10px; align-items: flex-start; font-size: 0.83rem; color: var(--pex-ink-soft); }
.pex-form__privacy input { margin-top: 3px; }

.pex-form__msg { padding: 13px 16px; border-radius: var(--pex-radius-sm); font-size: 0.92rem; display: none; }
.pex-form__msg.is-success { display: block; background: var(--pex-primary-soft); color: var(--pex-primary-dark); }
.pex-form__msg.is-error { display: block; background: #fdecea; color: #b3261e; }

/* WPForms: integración visual */
.pex-quote .wpforms-container input,
.pex-quote .wpforms-container select,
.pex-quote .wpforms-container textarea {
	border-radius: var(--pex-radius-sm) !important;
	border: 1.5px solid var(--pex-line) !important;
	font-family: var(--pex-font) !important;
}
.pex-quote .wpforms-container button[type="submit"] {
	background: var(--pex-primary) !important;
	border: 0 !important;
	border-radius: var(--pex-radius-pill) !important;
	padding: 13px 28px !important;
	font-weight: 700 !important;
	color: #fff !important;
}

/* -------------------------------------------------- Checkout de reservas */
/* Checkout y carrito a ancho completo del contenedor (como el footer). */
.woocommerce-checkout .pex-content--narrow,
.woocommerce-cart .pex-content--narrow,
.woocommerce-checkout article.pex-content--narrow,
.woocommerce-cart article.pex-content--narrow { max-width: none; width: 100%; }

.woocommerce-checkout form.checkout {
	display: grid;
	gap: 40px;
	grid-template-columns: 1fr;
	align-items: start;
}
@media (min-width: 960px) {
	.woocommerce-checkout form.checkout { grid-template-columns: 1.15fr 0.85fr; }
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review { grid-column: 2; }
	.woocommerce-checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; }
}

.woocommerce-checkout h3 { font-size: 1.15rem; margin: 0 0 16px; }

.woocommerce-checkout .form-row { margin: 0 0 14px; padding: 0; display: block; }
.woocommerce-checkout .form-row label { display: block; font-size: 0.85rem; font-weight: 700; margin-bottom: 5px; }
.woocommerce-checkout .form-row .required { color: #d9432f; text-decoration: none; }

.woocommerce-checkout .input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
	font-family: var(--pex-font);
	font-size: 0.95rem;
	background: #fff;
}
.woocommerce-checkout .input-text:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
	outline: none;
	border-color: var(--pex-primary);
	box-shadow: 0 0 0 3px rgba(0, 108, 50, 0.12);
}

@media (min-width: 640px) {
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last { width: calc(50% - 7px); display: inline-block; vertical-align: top; }
	.woocommerce-checkout .form-row-first { margin-right: 10px; }
}

/* Preferencias del tour (idioma) */
.pex-preferences { margin-top: 26px; }
.pex-preferences__title { padding-top: 18px; border-top: 1px solid var(--pex-line); }
.pex-preferences__note { font-size: 0.85rem; color: var(--pex-ink-soft); margin-bottom: 14px; }

/* Pasajeros */
.pex-passengers { margin-top: 30px; }
.pex-passengers__title { padding-top: 18px; border-top: 1px solid var(--pex-line); }
.pex-passengers__note { font-size: 0.85rem; color: var(--pex-ink-soft); margin-bottom: 18px; }

.pex-passenger {
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius);
	padding: 16px 18px;
	margin: 0 0 16px;
	background: var(--pex-off-white);
}
.pex-passenger legend {
	font-weight: 800;
	font-size: 0.9rem;
	padding: 3px 12px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary-dark);
	border-radius: var(--pex-radius-pill);
}
.pex-passenger__hint { font-size: 0.82rem; color: var(--pex-gray); margin: 4px 0 10px; }

/* El pasajero principal se distingue: es el titular del contacto y el que
   valida con el banco, así que no debe confundirse con los acompañantes. */
.pex-passenger:first-of-type { border-color: var(--pex-primary); background: #fff; }
.pex-passenger:first-of-type legend { background: var(--pex-primary); color: #fff; }

/* Fecha de nacimiento en tres selectores */
.pex-birthdate__group {
	display: grid;
	grid-template-columns: 0.8fr 1.4fr 1fr;
	gap: 8px;
}

.pex-birthdate select {
	width: 100%;
	min-height: 46px;
	padding: 10px 30px 10px 12px;
	font: inherit;
	font-size: 0.94rem;
	color: var(--pex-ink);
	background-color: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
	/* Flecha propia: la nativa cambia de forma en cada navegador. */
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234b555f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 9px center;
	background-size: 16px;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.pex-birthdate select:hover { border-color: var(--pex-line-strong); }
.pex-birthdate select:focus-visible {
	outline: 0;
	border-color: var(--pex-primary);
	box-shadow: 0 0 0 3px var(--pex-primary-soft);
}
.pex-birthdate select:invalid,
.pex-birthdate select option[value=""] { color: var(--pex-gray); }

@media (max-width: 480px) {
	.pex-birthdate__group { grid-template-columns: 1fr 1fr; }
	.pex-birthdate__year { grid-column: 1 / -1; }
	.pex-birthdate select { min-height: 48px; font-size: 16px; }
}

/* Resumen del pedido */
.woocommerce-checkout #order_review {
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow);
	padding: 24px;
}

.woocommerce-checkout table.shop_table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td { padding: 10px 6px; text-align: left; border-bottom: 1px solid var(--pex-line); vertical-align: top; }
.woocommerce-checkout table.shop_table tfoot .order-total td,
.woocommerce-checkout table.shop_table tfoot .order-total th { font-size: 1.05rem; font-weight: 800; border-bottom: 0; }
/* Datos de la reserva: cada dato en su propia fila */
.woocommerce-checkout dl.variation {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 3px 8px;
	margin: 8px 0 0;
	font-size: 0.8rem;
	color: var(--pex-ink-soft);
}
.woocommerce-checkout dl.variation dt { margin: 0; font-weight: 700; }
.woocommerce-checkout dl.variation dd { margin: 0; }
.woocommerce-checkout dl.variation dd p { margin: 0; display: inline; }

/* Tacho para eliminar un ítem del resumen */
.pex-remove-item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px; height: 30px;
	margin-left: 8px;
	border-radius: 8px;
	color: var(--pex-gray);
	vertical-align: middle;
	transition: color 0.2s, background 0.2s;
}
.pex-remove-item:hover { color: #d9432f; background: #fdf0ee; }

.woocommerce-checkout #payment { margin-top: 18px; }
.woocommerce-checkout #payment ul.payment_methods { list-style: none; margin: 0 0 16px; padding: 0; }
.woocommerce-checkout #payment li { margin-bottom: 10px; }
.woocommerce-checkout #payment .payment_box {
	background: var(--pex-off-white);
	border-radius: var(--pex-radius-sm);
	padding: 12px 14px;
	font-size: 0.87rem;
	margin-top: 8px;
}

.woocommerce-checkout #place_order {
	width: 100%;
	padding: 16px 24px;
	border: 0;
	border-radius: var(--pex-radius-pill);
	background: var(--pex-primary);
	color: #fff;
	font-family: var(--pex-font);
	font-size: 1.02rem;
	font-weight: 800;
	cursor: pointer;
	transition: background 0.25s, transform 0.25s var(--pex-ease);
}
.woocommerce-checkout #place_order:hover { background: var(--pex-primary-dark); transform: translateY(-2px); }

.pex-tour__notices { padding-top: calc(var(--pex-header-h) + 14px); position: relative; z-index: 5; }
.pex-tour__notices:empty { display: none; }
.pex-tour__notices + .pex-tour-hero { padding-top: 20px; }
.pex-tour__notices .woocommerce-error { border-left-color: #d9432f; background: #fdf0ee; }
.pex-tour__notices .woocommerce-error,
.pex-tour__notices .woocommerce-message,
.pex-tour__notices .woocommerce-info,
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info {
	list-style: none;
	margin: 0 0 20px;
	padding: 14px 18px;
	border-radius: var(--pex-radius-sm);
	background: var(--pex-off-white);
	border-left: 4px solid var(--pex-primary);
	font-size: 0.92rem;
}
.woocommerce-checkout .woocommerce-error { border-left-color: #d9432f; background: #fdf0ee; }
.woocommerce-checkout .woocommerce-error li { margin-bottom: 6px; }

/* ------------------------------------------------------------------ Weglot
   El plugin trae su propia caja blanca (.country-selector.weglot-dropdown),
   un relleno de 60px en la etiqueta y una flecha en PNG. Aquí se neutraliza
   todo eso y se reconstruye con el lenguaje visual del theme.
   La hoja del theme carga después de la de Weglot, así que con igualar o
   superar su especificidad alcanza: no hacen falta !important.
   ------------------------------------------------------------------------ */
.pex-weglot { display: inline-flex; align-items: center; gap: 8px; }
.pex-weglot__icon { color: currentColor; opacity: 0.8; display: inline-flex; }
.pex-weglot__label { font-size: 0.82rem; font-weight: 600; }

/* --- Contenedor: fuera la caja blanca --- */
.pex-weglot .country-selector.weglot-dropdown {
	position: relative;
	width: auto;
	min-width: 0;
	background-color: transparent;
	border: 0;
	box-shadow: none;
}

/* --- Botón actual --- */
.pex-weglot .country-selector.weglot-dropdown .wgcurrent {
	position: relative;
	display: inline-block;
	width: auto;
	margin: 0;
	padding: 4px 30px 4px 13px;
	background: transparent;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-pill);
	line-height: 1.6;
	cursor: pointer;
	transition: background 0.2s, border-color 0.2s;
}
.pex-weglot .country-selector.weglot-dropdown .wgcurrent span,
.pex-weglot .country-selector.weglot-dropdown .wgcurrent a {
	padding: 0;
	font-family: var(--pex-font);
	font-size: 0.82rem;
	font-weight: 600;
	color: inherit;
}

/* --- Flecha propia en lugar del PNG --- */
.pex-weglot .country-selector.weglot-dropdown .wgcurrent::after {
	background: none;
	width: 7px;
	height: 7px;
	top: 50%;
	right: 13px;
	margin-top: -5px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	border-radius: 1px;
	opacity: 0.65;
	transform: rotate(45deg);
	transition: transform 0.2s var(--pex-ease);
}
.pex-weglot .country-selector.weglot-dropdown input:checked ~ .wgcurrent::after {
	transform: rotate(-135deg);
	margin-top: -2px;
}

/* --- Desplegable --- */
.pex-weglot .country-selector.weglot-dropdown ul {
	left: auto;
	right: 0;
	top: calc(100% + 8px);
	z-index: 1100;
	min-width: 165px;
	padding: 6px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: 12px;
	box-shadow: var(--pex-shadow-lg);
}
.pex-weglot .country-selector.weglot-dropdown ul li { width: 100%; margin: 0; }
.pex-weglot .country-selector.weglot-dropdown ul li a {
	display: block;
	padding: 8px 12px;
	border-radius: 8px;
	font-family: var(--pex-font);
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--pex-ink);
	white-space: nowrap;
	transition: background 0.15s, color 0.15s;
}
.pex-weglot .country-selector.weglot-dropdown ul li a:hover {
	background: var(--pex-primary-soft);
	color: var(--pex-primary-dark);
}

/* --- Contexto: barra superior ---
   Sin recuadro: se comporta como los demás enlaces de la franja
   (teléfono, WhatsApp), con fondo solo al pasar el mouse. */
.pex-weglot--topbar { color: rgba(255, 255, 255, 0.92); gap: 5px; }
.pex-weglot--topbar .country-selector.weglot-dropdown .wgcurrent {
	border: 0;
	border-radius: var(--pex-radius-sm);
	color: rgba(255, 255, 255, 0.92);
	padding: 4px 22px 4px 6px;
	line-height: 1.4;
}
.pex-weglot--topbar .country-selector.weglot-dropdown .wgcurrent:hover {
	background: rgba(255, 255, 255, 0.12);
}
.pex-weglot--topbar .country-selector.weglot-dropdown .wgcurrent span { font-size: 0.78rem; }
.pex-weglot--topbar .country-selector.weglot-dropdown .wgcurrent::after { right: 7px; }

/* --- Contexto: footer (fondo oscuro) --- */
.pex-weglot--footer { margin-top: 16px; color: #d7dee4; }
.pex-weglot--footer .country-selector.weglot-dropdown .wgcurrent {
	border-color: rgba(255, 255, 255, 0.22);
	color: #d7dee4;
}
.pex-weglot--footer .country-selector.weglot-dropdown .wgcurrent:hover {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.4);
}
/* En el footer el panel se abre hacia arriba para no salirse de la página. */
.pex-weglot--footer .country-selector.weglot-dropdown ul {
	top: auto;
	bottom: calc(100% + 8px);
	left: 0;
	right: auto;
}

/* --- Contexto: menú (header claro y menú mobile) --- */
.pex-weglot--nav .country-selector.weglot-dropdown .wgcurrent { color: var(--pex-ink); }
.pex-weglot--nav .country-selector.weglot-dropdown .wgcurrent:hover {
	background: var(--pex-off-white);
	border-color: #cdd4da;
}
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-weglot--nav { color: #fff; }
.pex-header--transparent:not(.is-scrolled):not(.is-open):not(.is-mega-open) .pex-weglot--nav .country-selector.weglot-dropdown .wgcurrent {
	border-color: rgba(255, 255, 255, 0.4);
	color: #fff;
}

/* En escritorio el idioma vive en la barra superior: se evita duplicarlo. */
@media (min-width: 961px) {
	body.pex-has-topbar .pex-weglot--nav { display: none; }
}

/* Opciones del theme para el selector */
.pex-weglot--pills .country-selector.weglot-dropdown ul { display: flex; gap: 6px; position: static; box-shadow: none; border: 0; padding: 0; }
.pex-weglot--pills .country-selector.weglot-dropdown ul li a { border: 1.5px solid var(--pex-line); border-radius: var(--pex-radius-pill); }

/* ------------------------------------------------------------------ Varios */
.pex-error-404 { text-align: center; padding: 120px 0 80px; }
.pex-error-404 .pex-icon { color: var(--pex-primary); margin-bottom: 18px; }

.pex-center { text-align: center; }
.pex-mt-lg { margin-top: 40px; }

/* Animación de aparición al hacer scroll */
/* El aparecer-al-scrollear se quitó a pedido: daba aire de plantilla
   armada con constructor. La clase .pex-reveal sigue en las plantillas
   como punto de enganche, pero ya no oculta ni anima nada. */

/* ------------------------------------------------- Carrusel en mobile */
@media (max-width: 760px) {
	.pex-carousel-mobile {
		display: flex !important;
		grid-template-columns: none !important;
		gap: 14px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		padding: 4px 20px 18px;
		margin-left: -20px;
		margin-right: -20px;
		scrollbar-width: none;
	}
	.pex-carousel-mobile::-webkit-scrollbar { display: none; }

	.pex-carousel-mobile > * {
		flex: 0 0 76%;
		max-width: 76%;
		scroll-snap-align: center;
	}

	/* Cards de destino más compactas en carrusel */
	.pex-carousel-mobile > .pex-dcard { flex-basis: 62%; max-width: 62%; aspect-ratio: 3 / 4; }

	/* En carrusel la descripción del destino siempre visible */
	.pex-carousel-mobile .pex-dcard__desc { max-height: 90px; opacity: 1; }
}

/* ------------------------------------------------ prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0s !important;
		scroll-behavior: auto !important;
	}
	.pex-hero__scroll { display: none; }
}

/* ------------------------------------------------------------- Artículo */

.pex-article-hero {
	padding: calc(var(--pex-header-h) + 40px) 0 30px;
	background: var(--pex-off-white);
}
/* Va DENTRO de .pex-container, nunca en el mismo elemento: si comparten
   etiqueta, este max-width pisa el del contenedor y el hero se desalinea
   del resto del sitio. Acota el ancho del texto sin mover el margen. */
.pex-article-hero__inner { max-width: 100%; }
@media (min-width: 1000px) {
	.pex-article-hero__inner { max-width: calc(100% - 330px - 56px); }
}
.pex-article-hero .pex-breadcrumbs { margin-bottom: 16px; }

.pex-article-hero__kicker {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 14px;
	padding: 5px 13px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary-dark);
	font-size: 0.76rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	border-radius: var(--pex-radius-pill);
}
.pex-article-hero__kicker:hover { background: var(--pex-primary); color: #fff; }

.pex-article-hero h1 {
	margin: 0;
	font-size: clamp(1.9rem, 4.2vw, 3rem);
	line-height: 1.14;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.pex-article-hero__lead {
	margin: 16px 0 0;
	max-width: 62ch;
	font-size: 1.12rem;
	line-height: 1.6;
	color: var(--pex-ink-soft);
	text-wrap: pretty;
}

.pex-article-hero__meta {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 20px 0 0;
	font-size: 0.82rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--pex-gray);
}
.pex-article-hero__meta .pex-icon { color: var(--pex-primary); }

/* Portada recortada: conserva el ancho de la columna pero muestra solo una
   franja, para que no empuje el texto por debajo del pliegue. */
.pex-article-cover {
	margin: 0 0 32px;
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	box-shadow: var(--pex-shadow-sm);
}
.pex-article-cover img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2.4 / 1;
	object-fit: cover;
	object-position: center;
}
@media (max-width: 640px) {
	.pex-article-cover img { aspect-ratio: 16 / 10; }
}

.pex-article {
	display: grid;
	gap: 42px;
	grid-template-columns: 1fr;
	padding: 44px 0 64px;
	align-items: start;
}
@media (min-width: 1000px) {
	.pex-article { grid-template-columns: minmax(0, 1fr) 330px; gap: 56px; }
}

.pex-article__main { min-width: 0; }

/* Mismo cuerpo que la ficha de producto (1rem), ocupando todo el ancho de
   la columna para alinear con el título y la portada. */
.pex-prose--article { max-width: none; font-size: 1rem; line-height: 1.75; }
.pex-prose--article p { margin: 0 0 1.15em; text-wrap: pretty; }

/* Capitular en el primer párrafo. Se apaga si el artículo abre con un
   subtítulo o una imagen, donde quedaría descolgada. */
.pex-prose--article > p:first-child::first-letter {
	float: left;
	margin: 0.04em 0.09em 0 0;
	font-size: 3.4em;
	line-height: 0.82;
	font-weight: 800;
	color: var(--pex-primary);
}

.pex-prose--article h2 {
	position: relative;
	margin-top: 1.9em;
	margin-bottom: 0.55em;
	padding-top: 0.7em;
	border-top: 1px solid var(--pex-line);
	font-size: 1.5rem;
	letter-spacing: -0.01em;
	text-wrap: balance;
}
.pex-prose--article h3 {
	margin-top: 1.6em;
	margin-bottom: 0.4em;
	font-size: 1.14rem;
	color: var(--pex-primary-dark);
}

/* Viñetas con marca propia en vez del punto del navegador. */
.pex-prose--article ul { list-style: none; margin: 1.1em 0; padding: 0; }
.pex-prose--article ul li {
	position: relative;
	padding: 0 0 0 26px;
	margin-bottom: 0.6em;
}
.pex-prose--article ul li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 0.62em;
	width: 7px;
	height: 7px;
	border: 2px solid var(--pex-primary);
	border-radius: 50%;
}

.pex-prose--article ol { margin: 1.1em 0; padding-left: 4px; list-style: none; counter-reset: pex-ol; }
.pex-prose--article ol li {
	position: relative;
	padding-left: 34px;
	margin-bottom: 0.6em;
	counter-increment: pex-ol;
}
.pex-prose--article ol li::before {
	content: counter(pex-ol);
	position: absolute;
	left: 0;
	top: 0.1em;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 23px;
	height: 23px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary-dark);
	font-size: 0.78rem;
	font-weight: 800;
	border-radius: 50%;
}

.pex-prose--article strong { color: var(--pex-ink); font-weight: 800; }
.pex-prose--article a { color: var(--pex-primary-dark); text-decoration: underline; text-underline-offset: 3px; }
.pex-prose--article a:hover { text-decoration-thickness: 2px; }
.pex-prose--article img { border-radius: var(--pex-radius-lg); margin: 1.6em 0; }
.pex-prose--article hr { margin: 2.2em 0; border: 0; border-top: 1px solid var(--pex-line); }

/* Columna lateral fija: acompaña la lectura sin volver a pedir scroll. */
.pex-article__aside { min-width: 0; }
@media (min-width: 1000px) {
	.pex-article__aside { position: sticky; top: calc(var(--pex-header-h) + 20px); }
}

.pex-article-widget {
	padding: 20px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-sm);
}
.pex-article-widget__title {
	margin: 0 0 4px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--pex-line);
	font-size: 0.8rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--pex-gray);
}
.pex-article-widget__list { display: grid; }
.pex-article-widget .pex-btn { margin-top: 14px; }

/* Card compacta de tour */
.pex-tour-mini {
	display: flex;
	gap: 13px;
	padding: 14px 0;
	border-bottom: 1px solid var(--pex-line);
	color: var(--pex-ink);
}
.pex-tour-mini:last-child { border-bottom: 0; }
.pex-tour-mini:hover .pex-tour-mini__title { color: var(--pex-primary); }

.pex-tour-mini__media {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 74px;
	height: 74px;
	overflow: hidden;
	border-radius: var(--pex-radius-sm);
	background: var(--pex-primary-soft);
	color: var(--pex-primary);
}
.pex-tour-mini__media img { width: 100%; height: 100%; object-fit: cover; }

.pex-tour-mini__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pex-tour-mini__title {
	font-size: 0.92rem;
	font-weight: 800;
	line-height: 1.3;
	transition: color 0.2s;
}
.pex-tour-mini__meta {
	display: flex;
	gap: 10px;
	font-size: 0.76rem;
	color: var(--pex-ink-soft);
}
.pex-tour-mini__meta span { display: inline-flex; align-items: center; gap: 5px; }
.pex-tour-mini__meta .pex-icon { color: var(--pex-primary); }
.pex-tour-mini__price { font-size: 0.78rem; color: var(--pex-gray); }
.pex-tour-mini__price .pex-price__current { font-size: 0.95rem; }

/* -------------------------------------------------------------- Nosotros */

.pex-about-hero {
	padding: calc(var(--pex-header-h) + 44px) 0 48px;
	background: var(--pex-off-white);
}
.pex-about-hero__grid {
	display: grid;
	gap: 32px;
	grid-template-columns: 1fr;
	align-items: center;
}
@media (min-width: 900px) {
	.pex-about-hero--media .pex-about-hero__grid { grid-template-columns: 1.05fr 0.95fr; gap: 52px; }
}
.pex-about-hero__text { max-width: 680px; }
.pex-about-hero .pex-breadcrumbs { margin-bottom: 14px; }
.pex-about-hero .pex-highlight__pill { margin-bottom: 16px; }

.pex-about-hero h1 {
	margin: 0;
	font-size: clamp(1.9rem, 4.2vw, 2.9rem);
	line-height: 1.13;
	letter-spacing: -0.02em;
	text-wrap: balance;
}
.pex-about-hero__lead {
	margin: 18px 0 0;
	max-width: 60ch;
	font-size: 1.08rem;
	line-height: 1.65;
	color: var(--pex-ink-soft);
	text-wrap: pretty;
}

.pex-about-hero__media {
	margin: 0;
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	box-shadow: var(--pex-shadow-sm);
}
.pex-about-hero__media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }

/* Cifras: cabalgan el borde del hero para unir las dos zonas. */
.pex-about-stats { margin-top: -30px; }
.pex-about-stats__grid {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(2, 1fr);
	margin: 0;
	padding: 0;
	background: var(--pex-line);
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	box-shadow: var(--pex-shadow-sm);
}
@media (min-width: 760px) { .pex-about-stats__grid { grid-template-columns: repeat(4, 1fr); } }

.pex-about-stat { padding: 24px 18px; background: #fff; text-align: center; }
.pex-about-stat__value {
	font-size: clamp(1.6rem, 3.4vw, 2.2rem);
	font-weight: 800;
	line-height: 1;
	color: var(--pex-primary);
	font-variant-numeric: tabular-nums;
}
.pex-about-stat__label {
	margin: 8px 0 0;
	font-size: 0.82rem;
	line-height: 1.35;
	color: var(--pex-ink-soft);
	text-wrap: balance;
}

.pex-about-story__grid {
	display: grid;
	gap: 34px;
	grid-template-columns: 1fr;
	align-items: center;
}
@media (min-width: 900px) {
	.pex-about-story__grid { grid-template-columns: 1.15fr 0.85fr; gap: 56px; }
}
.pex-about-story__text h2 { margin: 0 0 16px; font-size: clamp(1.5rem, 2.8vw, 2rem); text-wrap: balance; }
.pex-prose--about { font-size: 1rem; line-height: 1.75; color: var(--pex-ink-soft); }
.pex-prose--about p { margin: 0 0 1.05em; text-wrap: pretty; }
.pex-prose--about p:last-child { margin-bottom: 0; }

.pex-about-story__media {
	margin: 0;
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	box-shadow: var(--pex-shadow-sm);
}
.pex-about-story__media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }

.pex-about-values {
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
}
@media (min-width: 640px) { .pex-about-values { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pex-about-values { grid-template-columns: repeat(4, 1fr); } }

.pex-about-value {
	padding: 24px 22px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-sm);
}
.pex-about-value__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	margin-bottom: 14px;
	border-radius: 14px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary);
}
.pex-about-value__title { margin: 0 0 7px; font-size: 1.02rem; }
.pex-about-value__text { margin: 0; font-size: 0.9rem; line-height: 1.55; color: var(--pex-ink-soft); }

.pex-about-office__grid {
	display: grid;
	gap: 34px;
	grid-template-columns: 1fr;
	align-items: center;
}
@media (min-width: 900px) {
	.pex-about-office__grid { grid-template-columns: 0.9fr 1.1fr; gap: 52px; }
}
.pex-about-office h2 { margin: 0 0 14px; font-size: clamp(1.5rem, 2.8vw, 2rem); text-wrap: balance; }
.pex-about-office__desc { margin: 0 0 20px; color: var(--pex-ink-soft); line-height: 1.65; max-width: 52ch; }

.pex-about-office__data { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 12px; }
.pex-about-office__data li { display: flex; align-items: flex-start; gap: 11px; font-size: 0.95rem; }
.pex-about-office__data .pex-icon { color: var(--pex-primary); flex: none; margin-top: 2px; }
.pex-about-office__data a { color: var(--pex-ink); }
.pex-about-office__data a:hover { color: var(--pex-primary); }

.pex-about-office__map {
	border-radius: var(--pex-radius-lg);
	overflow: hidden;
	box-shadow: var(--pex-shadow-sm);
	line-height: 0;
}
.pex-about-office__map iframe { width: 100%; height: 380px; border: 0; }

/* ----------------------------------------------------------- Páginas legales */

.pex-legal-hero {
	padding: calc(var(--pex-header-h) + 40px) 0 32px;
	background: var(--pex-off-white);
	border-bottom: 1px solid var(--pex-line);
}
.pex-legal-hero__inner { max-width: 800px; }
.pex-legal-hero .pex-breadcrumbs { margin-bottom: 14px; }
.pex-legal-hero h1 {
	margin: 0;
	font-size: clamp(1.7rem, 3.6vw, 2.5rem);
	line-height: 1.15;
	letter-spacing: -0.015em;
	text-wrap: balance;
}
.pex-legal-hero__meta {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 14px 0 0;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--pex-gray);
}
.pex-legal-hero__meta .pex-icon { color: var(--pex-primary); }

.pex-legal {
	display: grid;
	gap: 40px;
	grid-template-columns: 1fr;
	padding: 44px 0 64px;
	align-items: start;
}
@media (min-width: 1000px) {
	.pex-legal { grid-template-columns: 250px minmax(0, 1fr); gap: 56px; }
	.pex-legal__nav { position: sticky; top: calc(var(--pex-header-h) + 20px); }
}

.pex-legal-toc {
	padding: 18px 20px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
}
.pex-legal-toc__title {
	margin: 0 0 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--pex-line);
	font-size: 0.74rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--pex-gray);
}
.pex-legal-toc ol { margin: 0; padding: 0 0 0 18px; display: grid; gap: 8px; }
.pex-legal-toc li { font-size: 0.86rem; }
.pex-legal-toc li::marker { color: var(--pex-primary); font-weight: 700; }
.pex-legal-toc a { color: var(--pex-ink-soft); }
.pex-legal-toc a:hover { color: var(--pex-primary); }

/* Anclas: el header fijo taparía el título al saltar. */
.pex-prose--legal h2 { scroll-margin-top: calc(var(--pex-header-h) + 20px); }

.pex-prose--legal { max-width: 72ch; font-size: 0.98rem; line-height: 1.75; color: var(--pex-ink-soft); }
.pex-prose--legal p { margin: 0 0 1.1em; text-wrap: pretty; }
.pex-prose--legal h2 {
	margin: 2em 0 0.6em;
	padding-top: 0.8em;
	border-top: 1px solid var(--pex-line);
	font-size: 1.28rem;
	color: var(--pex-ink);
	text-wrap: balance;
}
.pex-prose--legal h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.pex-prose--legal h3 { margin: 1.5em 0 0.4em; font-size: 1.04rem; color: var(--pex-primary-dark); }
.pex-prose--legal ul { list-style: none; margin: 1em 0; padding: 0; }
.pex-prose--legal ul li { position: relative; padding-left: 22px; margin-bottom: 0.55em; }
.pex-prose--legal ul li::before {
	content: "";
	position: absolute;
	left: 3px;
	top: 0.62em;
	width: 6px;
	height: 6px;
	border: 2px solid var(--pex-primary);
	border-radius: 50%;
}
.pex-prose--legal ol { margin: 1em 0; padding-left: 20px; }
.pex-prose--legal ol li { margin-bottom: 0.55em; }
.pex-prose--legal ol li::marker { color: var(--pex-primary); font-weight: 700; }
.pex-prose--legal strong { color: var(--pex-ink); font-weight: 800; }
.pex-prose--legal a { color: var(--pex-primary-dark); text-decoration: underline; text-underline-offset: 3px; }

/* Aviso destacado dentro de un documento legal. */
.pex-legal-note {
	margin: 1.6em 0;
	padding: 16px 20px;
	background: var(--pex-primary-tint);
	border: 1px solid var(--pex-primary-soft);
	border-radius: var(--pex-radius);
	font-size: 0.94rem;
}
.pex-legal-note p:last-child { margin-bottom: 0; }

/* ------------------------------------------------ Libro de Reclamaciones */

.pex-reclamo { margin: 1.6em 0; display: grid; gap: 20px; }
.pex-reclamo__hp { position: absolute; left: -9999px; }

.pex-reclamo__group {
	margin: 0;
	padding: 20px 22px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	background: #fff;
	display: grid;
	gap: 14px;
}
.pex-reclamo__group legend {
	padding: 0 8px;
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	color: var(--pex-primary);
}

.pex-reclamo__row { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pex-reclamo__row { grid-template-columns: 1fr 1fr; } }

.pex-reclamo label { display: grid; gap: 6px; font-size: 0.88rem; }
.pex-reclamo label > span { font-weight: 700; color: var(--pex-ink); }
.pex-reclamo input[type="text"],
.pex-reclamo input[type="email"],
.pex-reclamo input[type="tel"],
.pex-reclamo select,
.pex-reclamo textarea {
	width: 100%;
	padding: 11px 13px;
	font: inherit;
	font-size: 0.92rem;
	color: var(--pex-ink);
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
}
.pex-reclamo textarea { resize: vertical; }
.pex-reclamo :is(input, select, textarea):focus-visible {
	outline: 2px solid var(--pex-primary);
	outline-offset: 1px;
	border-color: var(--pex-primary);
}

.pex-reclamo__check { grid-template-columns: auto 1fr; align-items: start; gap: 10px; font-size: 0.88rem; }
.pex-reclamo__check input { margin-top: 3px; }
.pex-reclamo__check span { font-weight: 400; color: var(--pex-ink-soft); }

.pex-reclamo__tipos { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 560px) { .pex-reclamo__tipos { grid-template-columns: 1fr 1fr; } }
.pex-reclamo__radio {
	grid-template-columns: auto 1fr;
	align-items: start;
	gap: 11px;
	padding: 14px 16px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius);
	cursor: pointer;
}
.pex-reclamo__radio:has(input:checked) { border-color: var(--pex-primary); background: var(--pex-primary-tint); }
.pex-reclamo__radio strong { display: block; font-size: 0.92rem; }
.pex-reclamo__radio small { color: var(--pex-ink-soft); font-size: 0.8rem; }

.pex-reclamo__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.pex-reclamo__note { margin: 0; font-size: 0.88rem; color: var(--pex-ink-soft); }
.pex-reclamo__note--ok { color: var(--pex-primary-dark); font-weight: 700; }
.pex-reclamo__note--error { color: #b3261e; font-weight: 700; }

/* ------------------------------------------------- Registros y medios de pago */

/* Fondo oscuro: los logos oficiales se distribuyen en versión blanca, y
   uno lleva un detalle en rojo. Sobre claro no se veían. El tono es un
   punto más claro que el footer, para que se lean como franjas distintas
   y no como un bloque negro continuo. */
.pex-trust {
	padding: 32px 0 36px;
	background: #16202a;
	border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.pex-trust__title {
	margin: 0 0 22px;
	text-align: center;
	font-size: 0.76rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(255, 255, 255, 0.55);
}
.pex-trust__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 26px 48px;
	margin: 0;
	padding: 0;
	list-style: none;
}
/* Sin escala de grises: los archivos ya vienen en blanco y uno tiene un
   detalle en rojo que hay que respetar. Solo una leve atenuación para que
   no compitan con el logo de la marca. */
.pex-trust__item img {
	display: block;
	/* Los SVG sin width/height propios colapsan a cero: hay que darles
	   una altura de referencia, no solo un máximo. */
	height: 55px;
	width: auto;
	max-width: 228px;
	opacity: 0.85;
	transition: opacity 0.25s;
}
.pex-trust__item:hover img { opacity: 1; }

@media (max-width: 640px) {
	.pex-trust__list { gap: 22px 30px; }
	.pex-trust__item img { height: 43px; max-width: 156px; }
}

/* Centrado en todos los anchos: es un cierre del footer, no una columna
   más, y alineado a la izquierda quedaba descolgado del copyright. */
.pex-footer__pay {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px 18px;
	margin-top: 30px;
	padding-top: 22px;
	padding-bottom: 26px;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.pex-footer__pay-title {
	font-size: 0.74rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	opacity: 0.7;
}
.pex-footer__pay-list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
/* Sin pastilla blanca: los SVG de tarjeta ya traen su propio lienzo con
   fondo claro y esquinas redondeadas, así que el contenedor solo agregaba
   un segundo marco alrededor de cada uno y obligaba a achicarlos. */
.pex-footer__pay-list li {
	display: flex;
	align-items: center;
	justify-content: center;
}
/* Altura explícita, no solo un máximo: los SVG de tarjeta traen viewBox pero
   no width/height propios, y con el `height: auto` global el navegador los
   colapsa a cero. Mismo caso ya resuelto en .pex-trust__item img. */
.pex-footer__pay-list img { display: block; height: 30px; width: auto; max-width: 120px; }

/* ------------------------------------------ Ticket de pago del pedido */

.pex-ticket {
	max-width: 620px;
	margin: 0 auto 30px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-sm);
	overflow: hidden;
}

.pex-ticket__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	padding: 16px 22px;
	background: var(--pex-primary-dark);
	color: #fff;
}
.pex-ticket__brand {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.09em;
}
.pex-ticket__order { font-size: 0.86rem; opacity: 0.92; }
.pex-ticket__order strong { font-variant-numeric: tabular-nums; }

/* Perforación horizontal con muescas a los costados, como un boleto. */
.pex-ticket__perf {
	position: relative;
	height: 18px;
	background:
		radial-gradient(circle at 0 50%, var(--pex-off-white) 9px, transparent 9.5px),
		radial-gradient(circle at 100% 50%, var(--pex-off-white) 9px, transparent 9.5px);
	background-repeat: no-repeat;
}
.pex-ticket__perf::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 14px;
	right: 14px;
	border-top: 2px dotted var(--pex-line);
}

.pex-ticket__body { padding: 8px 22px 20px; }

.pex-ticket__tour { padding-bottom: 16px; }
.pex-ticket__tour-name { margin: 0 0 12px; font-size: 1.12rem; }
.pex-ticket__qty { color: var(--pex-gray); font-weight: 700; }

.pex-ticket__meta {
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px 24px;
	margin: 0;
}
@media (min-width: 480px) { .pex-ticket__meta { grid-template-columns: 1fr 1fr; } }
.pex-ticket__meta div {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding-bottom: 7px;
	border-bottom: 1px dotted var(--pex-line);
	font-size: 0.88rem;
}
.pex-ticket__meta dt { color: var(--pex-ink-soft); margin: 0; }
.pex-ticket__meta dd { margin: 0; font-weight: 700; text-align: right; }

.pex-ticket__pax,
.pex-ticket__contact { padding-top: 16px; border-top: 1px solid var(--pex-line); }
.pex-ticket__pax h4,
.pex-ticket__contact h4 {
	margin: 0 0 10px;
	font-size: 0.74rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--pex-gray);
}
.pex-ticket__pax ol { margin: 0; padding-left: 20px; display: grid; gap: 9px; }
.pex-ticket__pax li { font-size: 0.9rem; }
.pex-ticket__pax li::marker { color: var(--pex-primary); font-weight: 700; }
.pex-ticket__pax-name { display: block; font-weight: 700; }
.pex-ticket__pax-name em {
	font-style: normal;
	margin-left: 6px;
	padding: 2px 8px;
	background: var(--pex-primary-soft);
	color: var(--pex-primary-dark);
	font-size: 0.68rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	border-radius: var(--pex-radius-pill);
}
.pex-ticket__pax-doc { font-size: 0.82rem; color: var(--pex-ink-soft); }
.pex-ticket__contact p { margin: 0; font-size: 0.9rem; color: var(--pex-ink-soft); line-height: 1.55; }

.pex-ticket__totals { margin-top: 18px; padding-top: 14px; border-top: 2px solid var(--pex-ink); }
.pex-ticket__total-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 5px 0;
	font-size: 0.92rem;
}
.pex-ticket__total-row:last-child { font-size: 1.15rem; font-weight: 800; color: var(--pex-ink); }

.pex-ticket__edit {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 16px 0 0;
	font-size: 0.84rem;
	color: var(--pex-ink-soft);
}
.pex-ticket__edit .pex-icon { color: var(--pex-primary); flex: none; }
.pex-ticket__edit a { color: var(--pex-primary-dark); font-weight: 700; text-decoration: underline; }

/* Zona del gateway. El botón del plugin se estira al ancho del talón. */
.pex-ticket__pay { padding: 20px 22px 24px; background: var(--pex-off-white); }
.pex-ticket__pay p { margin: 0 0 14px; font-size: 0.9rem; color: var(--pex-ink-soft); }
.pex-ticket__pay .button,
.pex-ticket__pay input[type="submit"],
.pex-ticket__pay button {
	width: 100%;
	justify-content: center;
}

/* La página de pago no necesita el listado por defecto de WooCommerce. */
.woocommerce-order-pay ul.order_details { display: none; }

/* ------------------------------------------------- Validación de voucher */

/* Pensada para el muelle: pantalla chica, sol de frente y una decisión
   binaria que hay que tomar en dos segundos. */
.pex-validar { max-width: 560px; padding: calc(var(--pex-header-h) + 24px) 20px 60px; }

.pex-validar__result {
	padding: 26px 22px;
	border-radius: var(--pex-radius-lg);
	text-align: center;
	color: #fff;
	margin-bottom: 18px;
}
.pex-validar__result--ok { background: #0a7a3d; }
.pex-validar__result--warn { background: #b26a00; }
.pex-validar__result--bad { background: #b3261e; }

.pex-validar__icon { display: block; margin-bottom: 8px; }
.pex-validar__result h1 { margin: 0; color: #fff; font-size: clamp(1.6rem, 6vw, 2.1rem); }
.pex-validar__result p { margin: 8px 0 0; color: rgba(255, 255, 255, 0.92); font-size: 0.95rem; }
.pex-validar__code {
	font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
	font-size: 1.15rem !important;
	font-weight: 800;
	letter-spacing: 0.06em;
}

.pex-validar__card {
	padding: 18px 20px;
	margin-bottom: 14px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
	box-shadow: var(--pex-shadow-sm);
}
.pex-validar__card h2 { margin: 0 0 14px; font-size: 1.2rem; }
.pex-validar__card h3 {
	margin: 18px 0 8px;
	font-size: 0.74rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--pex-gray);
}
.pex-validar__card h3:first-child { margin-top: 0; }

.pex-validar__keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0; }
.pex-validar__keys dt {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--pex-gray);
	margin: 0;
}
/* El dato se lee de lejos: es lo que se compara con el pasajero. */
.pex-validar__keys dd { margin: 2px 0 0; font-size: 1.25rem; font-weight: 800; }

.pex-validar__holder { margin: 0; font-size: 1.05rem; font-weight: 800; }
.pex-validar__contact { margin: 2px 0 0; color: var(--pex-ink-soft); font-size: 0.9rem; }

.pex-validar__pax { margin: 0; padding-left: 20px; display: grid; gap: 10px; }
.pex-validar__pax li { font-size: 0.95rem; }
.pex-validar__pax li::marker { color: var(--pex-primary); font-weight: 800; }
.pex-validar__pax span { display: block; color: var(--pex-ink-soft); font-size: 0.85rem; }

.pex-validar__intro h1 { margin: 0 0 8px; }
.pex-validar__form { display: grid; gap: 6px; margin-top: 20px; }
.pex-validar__form label { font-size: 0.85rem; font-weight: 700; margin-top: 8px; }
.pex-validar__form input {
	width: 100%;
	padding: 13px 14px;
	font: inherit;
	font-size: 16px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
}
.pex-validar__form .pex-btn { margin-top: 14px; }

.pex-validar__again { text-align: center; margin-top: 20px; }
.pex-validar__again a { color: var(--pex-primary-dark); font-weight: 700; text-decoration: underline; }

/* Avisos de la pantalla de validación */
.pex-validar__alert {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 16px;
	margin-bottom: 14px;
	border-radius: var(--pex-radius);
	border: 1px solid;
}
.pex-validar__alert .pex-icon { flex: none; margin-top: 1px; }
.pex-validar__alert strong { display: block; font-size: 0.98rem; line-height: 1.3; }
.pex-validar__alert span { display: block; margin-top: 3px; font-size: 0.88rem; }

.pex-validar__alert--warn { background: #fff6e5; border-color: #f0c67a; color: #7a4b00; }
.pex-validar__alert--warn .pex-icon { color: #b26a00; }
.pex-validar__alert--bad { background: #fdeceb; border-color: #f0b3ae; color: #8c1d16; }
.pex-validar__alert--bad .pex-icon { color: #b3261e; }

.pex-validar__mark { margin-top: 18px; }
.pex-validar__marked {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	margin-top: 18px;
	padding: 14px;
	background: var(--pex-primary-soft);
	border: 1px solid var(--pex-primary);
	border-radius: var(--pex-radius);
	font-weight: 800;
	color: var(--pex-primary-dark);
}
.pex-validar__login {
	margin-top: 18px;
	padding: 12px 14px;
	background: var(--pex-off-white);
	border-radius: var(--pex-radius);
	font-size: 0.9rem;
	color: var(--pex-ink-soft);
	text-align: center;
}
.pex-validar__login a { display: block; margin-top: 4px; color: var(--pex-primary-dark); font-weight: 700; text-decoration: underline; }

/* Página autónoma de validación: sin header ni footer del sitio. */
body.pex-validar-page {
	background: var(--pex-off-white);
	padding-top: 0;
}
body.pex-validar-page .pex-validar {
	padding-top: 18px;
	padding-bottom: 40px;
}

.pex-validar__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 18px;
	padding-top: max(12px, env(safe-area-inset-top));
	background: var(--pex-primary-dark);
	color: #fff;
}
.pex-validar__bar-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.82rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.09em;
}
.pex-validar__bar-user { font-size: 0.82rem; opacity: 0.85; }

.pex-validar__auth {
	margin-top: 18px;
	padding: 16px 18px;
	background: #fff;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-lg);
}
.pex-validar__auth > p { margin: 0 0 12px; font-size: 0.9rem; color: var(--pex-ink-soft); }
.pex-validar__auth label { display: block; font-size: 0.85rem; font-weight: 700; margin-bottom: 4px; }
.pex-validar__auth input[type="text"],
.pex-validar__auth input[type="password"] {
	width: 100%;
	padding: 13px 14px;
	margin-bottom: 12px;
	font: inherit;
	font-size: 16px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
}
.pex-validar__auth .login-remember { font-weight: 400; font-size: 0.85rem; }
.pex-validar__auth input[type="submit"] {
	width: 100%;
	padding: 13px;
	margin-top: 8px;
	font: inherit;
	font-weight: 800;
	color: #fff;
	background: var(--pex-primary);
	border: 0;
	border-radius: var(--pex-radius-pill);
	cursor: pointer;
}

/* Modal de inicio de sesión de la pantalla de validación */
.pex-validar__bar-login {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: rgba(255, 255, 255, 0.16);
	border: 0;
	border-radius: var(--pex-radius-pill);
	color: #fff;
	font: inherit;
	font-size: 0.8rem;
	font-weight: 700;
	cursor: pointer;
}

.pex-login-modal { position: fixed; inset: 0; z-index: 1300; }
.pex-login-modal[hidden] { display: none; }
.pex-login-modal__backdrop { position: absolute; inset: 0; background: rgba(12, 24, 18, 0.55); }

.pex-login-modal__panel {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 32px);
	max-width: 380px;
	background: #fff;
	border-radius: var(--pex-radius-lg);
	box-shadow: 0 20px 50px rgba(12, 24, 18, 0.3);
	overflow: hidden;
}

.pex-login-modal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--pex-line);
}
.pex-login-modal__head h2 { margin: 0; font-size: 1.05rem; }
.pex-login-modal__close {
	display: flex;
	padding: 6px;
	background: none;
	border: 0;
	color: var(--pex-ink-soft);
	cursor: pointer;
}

.pex-login-modal__body { padding: 18px; }
.pex-login-modal__body label { display: block; font-size: 0.85rem; font-weight: 700; margin-bottom: 4px; }
.pex-login-modal__body input[type="text"],
.pex-login-modal__body input[type="password"] {
	width: 100%;
	padding: 13px 14px;
	margin-bottom: 12px;
	font: inherit;
	font-size: 16px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-sm);
}
.pex-login-modal__body .login-remember { font-weight: 400; font-size: 0.85rem; }
.pex-login-modal__body input[type="submit"] {
	width: 100%;
	padding: 13px;
	margin-top: 10px;
	font: inherit;
	font-weight: 800;
	color: #fff;
	background: var(--pex-primary);
	border: 0;
	border-radius: var(--pex-radius-pill);
	cursor: pointer;
}

.pex-validar__login button {
	display: block;
	margin: 6px auto 0;
	padding: 0;
	background: none;
	border: 0;
	font: inherit;
	font-weight: 700;
	color: var(--pex-primary-dark);
	text-decoration: underline;
	cursor: pointer;
}

/* -------------------------------- Pantallas vacías: carrito y 404 */

.pex-empty {
	max-width: 560px;
	margin: 0 auto;
	padding: 34px 20px 10px;
	text-align: center;
}
.pex-empty__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	margin-bottom: 18px;
	border-radius: 50%;
	background: var(--pex-primary-soft);
	color: var(--pex-primary);
}
.pex-empty__title { margin: 0 0 10px; font-size: clamp(1.4rem, 3.4vw, 1.9rem); text-wrap: balance; }
.pex-empty__text {
	margin: 0 auto 22px;
	max-width: 46ch;
	color: var(--pex-ink-soft);
	line-height: 1.6;
	text-wrap: pretty;
}
.pex-empty__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 22px;
}
@media (max-width: 520px) {
	.pex-empty__actions { flex-direction: column; }
	.pex-empty__actions .pex-btn { width: 100%; justify-content: center; }
}

/* Sugerencias de tours */
.pex-suggest {
	margin-top: 44px;
	padding-top: 32px;
	border-top: 1px solid var(--pex-line);
}
.pex-suggest__title {
	margin: 0 0 22px;
	text-align: center;
	font-size: 1.2rem;
	text-wrap: balance;
}

/* 404 */
.pex-error-404 {
	padding: calc(var(--pex-header-h) + 40px) 20px 64px;
	text-align: center;
}
.pex-error-404 h1 { margin: 0 0 10px; font-size: clamp(1.6rem, 4vw, 2.4rem); text-wrap: balance; }
.pex-error-404 .pex-section__subtitle { max-width: 52ch; margin: 0 auto; }

.pex-404-search {
	display: flex;
	gap: 8px;
	max-width: 460px;
	margin: 26px auto 0;
}
.pex-404-search input {
	flex: 1;
	min-width: 0;
	padding: 13px 16px;
	font: inherit;
	font-size: 16px;
	border: 1px solid var(--pex-line);
	border-radius: var(--pex-radius-pill);
	background: #fff;
}
.pex-404-search input:focus-visible {
	outline: 0;
	border-color: var(--pex-primary);
	box-shadow: 0 0 0 3px var(--pex-primary-soft);
}
@media (max-width: 520px) {
	.pex-404-search { flex-direction: column; }
	.pex-404-search .pex-btn { justify-content: center; }
}

/* La grilla de sugerencias no hereda el centrado de estas pantallas. */
.pex-error-404 .pex-suggest,
.pex-empty + .pex-suggest { text-align: left; }
.pex-error-404 .pex-suggest__title { text-align: center; }