/* ==========================================================================
   1. Variables del sistema visual
   ========================================================================== */

   :root {
   	/* Marca */
   	--csw-color-primary: #ed2d88;
   	--csw-color-primary-hover: #d92378;
   	--csw-color-primary-active: #bd1c68;

   	--csw-color-danger: #d33438;
   	--csw-color-danger-hover: #bb292d;

   	--csw-color-accent: #23ace2;
   	--csw-color-accent-hover: #1597ca;

   	--csw-color-success: #05cd0f;
   	--csw-color-success-hover: #04ad0c;

   	--csw-color-warning: #fddd00;
   	--csw-color-warning-hover: #e5ca00;

   	/* Neutros */
   	--csw-color-white: #ffffff;
   	--csw-color-bg: #ffffff;
   	--csw-color-bg-light: #f8f6f4;
   	--csw-color-border: #e6dfda;
   	--csw-color-text: #302b2d;
   	--csw-color-text-muted: #746d70;
   	--csw-color-dark: #211d1f;

   	/* Tipografía */
   	--csw-font-heading: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
   	--csw-font-body: "Amaranth", "Trebuchet MS", Arial, sans-serif;

   	--csw-font-size-xs: 0.8125rem;
   	--csw-font-size-sm: 0.9375rem;
   	--csw-font-size-base: 1rem;
   	--csw-font-size-lg: 1.125rem;

   	--csw-line-height-heading: 1.08;
   	--csw-line-height-body: 1.7;

   	/* Espaciado */
   	--csw-space-1: 0.25rem;
   	--csw-space-2: 0.5rem;
   	--csw-space-3: 0.75rem;
   	--csw-space-4: 1rem;
   	--csw-space-5: 1.5rem;
   	--csw-space-6: 2rem;
   	--csw-space-7: 3rem;
   	--csw-space-8: 4.5rem;

   	/* Contenedores */
   	--csw-container-wide: 90rem;
   	--csw-container: 75rem;
   	--csw-container-narrow: 48rem;
   	--csw-gutter: clamp(1rem, 3vw, 2rem);

   	/* Bordes y sombras */
   	--csw-radius-sm: 0.5rem;
   	--csw-radius-md: 0.875rem;
   	--csw-radius-lg: 1.25rem;
   	--csw-radius-pill: 1.875rem;

   	--csw-shadow-sm: 0 0.375rem 1rem rgba(33, 29, 31, 0.08);
   	--csw-shadow-md: 0 1rem 2.5rem rgba(33, 29, 31, 0.12);

   	/* Transiciones */
   	--csw-transition: 180ms ease;
   	--csw-motion-fast: 240ms;
   	--csw-motion-medium: 640ms;
   	--csw-motion-slow: 780ms;
   	--csw-ease-out: cubic-bezier(.22, 1, .36, 1);
   	--csw-ease-standard: cubic-bezier(.4, 0, .2, 1);
   }

/* ==========================================================================
   2. Reset básico y seguro
   ========================================================================== */

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

   html {
   	scroll-behavior: smooth;
   	text-size-adjust: 100%;
   }

   body {
   	margin: 0;
   	min-width: 20rem;
   	overflow-x: hidden;
   	background: var(--csw-color-bg);
   	color: var(--csw-color-text);
   	font-family: var(--csw-font-body);
   	font-size: var(--csw-font-size-base);
   	line-height: var(--csw-line-height-body);
   	-webkit-font-smoothing: antialiased;
   	text-rendering: optimizeLegibility;
   }

   img,
   picture,
   svg {
   	display: block;
   	max-width: 100%;
   }

   img {
   	height: auto;
   }

   button,
   input,
   select,
   textarea {
   	font: inherit;
   }

   button,
   select {
   	cursor: pointer;
   }

   figure,
   blockquote,
   p,
   h1,
   h2,
   h3,
   h4,
   h5,
   h6 {
   	margin-top: 0;
   }

   :focus-visible {
   	outline: 0.1875rem solid rgba(237, 45, 136, 0.35);
   	outline-offset: 0.1875rem;
   }

/* ==========================================================================
   3. Tipografía y contenido
   ========================================================================== */

   h1,
   h2,
   h3,
   h4,
   h5,
   h6 {
   	margin-bottom: var(--csw-space-4);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	letter-spacing: 0.015em;
   	line-height: var(--csw-line-height-heading);
   	text-wrap: balance;
   }

   h1 {
   	font-size: clamp(2.75rem, 7vw, 5.5rem);
   }

   h2 {
   	font-size: clamp(2.1rem, 4.5vw, 3.75rem);
   }

   h3 {
   	font-size: clamp(1.65rem, 3vw, 2.5rem);
   }

   h4 {
   	font-size: clamp(1.35rem, 2.2vw, 1.875rem);
   }

   h5 {
   	font-size: 1.25rem;
   }

   h6 {
   	font-size: 1.0625rem;
   }

   p {
   	margin-bottom: var(--csw-space-4);
   }

   p:last-child {
   	margin-bottom: 0;
   }

   a {
   	color: var(--csw-color-primary);
   	text-decoration-thickness: 0.1em;
   	text-underline-offset: 0.18em;
   	transition: color var(--csw-transition);
   }

   a:hover {
   	color: var(--csw-color-primary-hover);
   }

   a:active {
   	color: var(--csw-color-primary-active);
   }

/* ==========================================================================
   4. Contenedores y secciones
   ========================================================================== */

   .csw-container,
   .csw-container-wide,
   .csw-container-narrow {
   	width: min(100% - (var(--csw-gutter) * 2), var(--csw-container));
   	margin-inline: auto;
   }

   .csw-container-wide {
   	max-width: var(--csw-container-wide);
   }

   .csw-container-narrow {
   	max-width: var(--csw-container-narrow);
   }

   .csw-section {
   	padding-block: clamp(4rem, 8vw, 7rem);
   }

   .csw-section-header {
   	max-width: 52rem;
   	margin-bottom: clamp(2rem, 5vw, 3.5rem);
   }

   .csw-section-header-left {
   	margin-inline: 0;
   }

   .csw-section-label,
   .csw-card-label {
   	margin-bottom: var(--csw-space-2);
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-sm);
   	font-weight: 700;
   	letter-spacing: 0.14em;
   	line-height: 1.2;
   	text-transform: uppercase;
   }

   .csw-section-title {
   	margin-bottom: var(--csw-space-4);
   }

   .csw-section-subtitle {
   	max-width: 46rem;
   	color: var(--csw-color-text-muted);
   	font-size: clamp(1.05rem, 2vw, 1.25rem);
   }

/* ==========================================================================
   5. Botones
   ========================================================================== */

   .csw-btn {
   	display: inline-flex;
   	min-height: 3rem;
   	align-items: center;
   	justify-content: center;
   	gap: var(--csw-space-2);
   	padding: 0.75rem 1.5rem;
   	border: 0.125rem solid transparent;
   	border-radius: var(--csw-radius-pill);
   	font-family: var(--csw-font-heading);
   	font-size: 1rem;
   	font-weight: 700;
   	letter-spacing: 0.04em;
   	line-height: 1;
   	text-align: center;
   	text-decoration: none;
   	transition:
   	background-color var(--csw-transition),
   	border-color var(--csw-transition),
   	color var(--csw-transition),
   	transform var(--csw-transition),
   	box-shadow var(--csw-transition);
   }

   .csw-btn:hover {
   	transform: translateY(-0.125rem);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-btn:active {
   	transform: translateY(0);
   	box-shadow: none;
   }

   .csw-btn-primary {
   	background: var(--csw-color-primary);
   	border-color: var(--csw-color-primary);
   	color: var(--csw-color-white);
   }

   .csw-btn-primary:hover {
   	background: var(--csw-color-primary-hover);
   	border-color: var(--csw-color-primary-hover);
   	color: var(--csw-color-white);
   }

   .csw-btn-outline-primary {
   	background: transparent;
   	border-color: var(--csw-color-primary);
   	color: var(--csw-color-primary);
   }

   .csw-btn-outline-primary:hover {
   	background: var(--csw-color-primary);
   	color: var(--csw-color-white);
   }

   .csw-btn-light {
   	background: var(--csw-color-white);
   	border-color: var(--csw-color-white);
   	color: var(--csw-color-dark);
   }

   .csw-btn-light:hover {
   	background: var(--csw-color-bg-light);
   	border-color: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   }

   .csw-btn-whatsapp {
   	background: var(--csw-color-success);
   	border-color: var(--csw-color-success);
   	color: var(--csw-color-white);
   }

   .csw-btn-whatsapp:hover {
   	background: var(--csw-color-success-hover);
   	border-color: var(--csw-color-success-hover);
   	color: var(--csw-color-white);
   }

   .csw-actions {
   	display: flex;
   	flex-wrap: wrap;
   	gap: var(--csw-space-3);
   }

/* ==========================================================================
   6. Tarjetas
   ========================================================================== */

   .csw-card {
   	overflow: hidden;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-card-image {
   	margin: 0;
   	aspect-ratio: 16 / 9;
   	overflow: hidden;
   	background: var(--csw-color-bg-light);
   }

   .csw-card-image img {
   	width: 100%;
   	height: 100%;
   	object-fit: contain;
   	padding: var(--csw-space-5);
   }

   .csw-card-body {
   	padding: clamp(1.5rem, 4vw, 2.25rem);
   }

   .csw-card-title {
   	margin-bottom: var(--csw-space-3);
   	font-size: clamp(1.75rem, 3vw, 2.5rem);
   }

/* ==========================================================================
   7. Formularios
   ========================================================================== */

   .csw-form-shell {
   	padding: clamp(1.5rem, 5vw, 3rem);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-form {
   	display: grid;
   	gap: var(--csw-space-5);
   }

   .csw-form-group {
   	display: grid;
   	gap: var(--csw-space-2);
   }

   .csw-form-label {
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	letter-spacing: 0.025em;
   }

   .csw-input-field,
   .csw-select-field {
   	width: 100%;
   	min-height: 3.25rem;
   	padding: 0.75rem 1rem;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-sm);
   	background: var(--csw-color-white);
   	color: var(--csw-color-text);
   	transition:
   	border-color var(--csw-transition),
   	box-shadow var(--csw-transition),
   	background-color var(--csw-transition);
   }

   .csw-input-field:hover,
   .csw-select-field:hover {
   	border-color: #c9bdc2;
   }

   .csw-input-field:focus,
   .csw-select-field:focus {
   	border-color: var(--csw-color-primary);
   	outline: 0;
   	box-shadow: 0 0 0 0.25rem rgba(237, 45, 136, 0.12);
   }

   .csw-textarea-field {
   	min-height: 8rem;
   	resize: vertical;
   }

   .csw-form-help,
   .csw-form-error {
   	margin: 0;
   	font-size: var(--csw-font-size-sm);
   }

   .csw-form-help {
   	color: var(--csw-color-text-muted);
   }

   .csw-form-error {
   	color: var(--csw-color-danger);
   }

/* ==========================================================================
   8. Imágenes
   ========================================================================== */

   .csw-image-frame {
   	margin: 0;
   	overflow: hidden;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-image-frame img {
   	width: 100%;
   	aspect-ratio: 16 / 9;
   	object-fit: contain;
   	padding: clamp(1rem, 4vw, 2.5rem);
   	background: var(--csw-color-bg-light);
   }

   .csw-image-caption {
   	padding: var(--csw-space-4) var(--csw-space-5);
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   }

/* ==========================================================================
   9. Paleta de muestra
   ========================================================================== */

   .csw-color-grid {
   	display: grid;
   	grid-template-columns: repeat(3, minmax(0, 1fr));
   	gap: var(--csw-space-4);
   }

   .csw-color-swatch {
   	display: flex;
   	min-height: 7rem;
   	align-items: flex-end;
   	padding: var(--csw-space-4);
   	border-radius: var(--csw-radius-md);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	letter-spacing: 0.04em;
   	box-shadow: var(--csw-shadow-sm);
   }

/* ==========================================================================
   10. Fondos, texto y utilidades mínimas
   ========================================================================== */

   .csw-bg-primary {
   	background: var(--csw-color-primary);
   }

   .csw-bg-danger {
   	background: var(--csw-color-danger);
   }

   .csw-bg-accent {
   	background: var(--csw-color-accent);
   }

   .csw-bg-success {
   	background: var(--csw-color-success);
   }

   .csw-bg-warning {
   	background: var(--csw-color-warning);
   	color: var(--csw-color-dark);
   }

   .csw-bg-light {
   	background: var(--csw-color-bg-light);
   }

   .csw-text-primary {
   	color: var(--csw-color-primary);
   }

   .csw-text-muted {
   	color: var(--csw-color-text-muted);
   }

   .csw-text-dark {
   	color: var(--csw-color-dark);
   }

   .csw-text-center {
   	text-align: center;
   }

   .csw-text-center .csw-section-header,
   .csw-text-center .csw-section-subtitle {
   	margin-inline: auto;
   }

   .csw-stack-md > * + * {
   	margin-top: var(--csw-space-5);
   }

   .csw-stack-lg > * + * {
   	margin-top: var(--csw-space-7);
   }

/* ==========================================================================
   11. Responsive
   ========================================================================== */

   @media (max-width: 61.999rem) {
   	:root {
   		--csw-gutter: 1.5rem;
   	}

   	.csw-color-grid {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}
   }

   @media (max-width: 47.999rem) {
   	:root {
   		--csw-gutter: 1rem;
   	}

   	.csw-section {
   		padding-block: 3.75rem;
   	}

   	.csw-actions {
   		align-items: stretch;
   		flex-direction: column;
   	}

   	.csw-btn {
   		width: 100%;
   	}

   	.csw-color-grid {
   		grid-template-columns: 1fr;
   	}

   	.csw-card-body,
   	.csw-form-shell {
   		padding: 1.25rem;
   	}
   }

   @media (max-width: 29.999rem) {
   	h1 {
   		font-size: 2.5rem;
   	}

   	h2 {
   		font-size: 2rem;
   	}

   	.csw-section {
   		padding-block: 3rem;
   	}

   	.csw-color-swatch {
   		min-height: 5.5rem;
   	}
   }

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

   	*,
   	*::before,
   	*::after {
   		transition-duration: 0.01ms !important;
   		animation-duration: 0.01ms !important;
   		animation-iteration-count: 1 !important;
   	}
   }

/* ==========================================================
   FASE HTML/CSS 2 — CABECERA, NAVEGACIÓN Y PIE DE PÁGINA
   ========================================================== */

/* ----------------------------------------------------------
   1. Accesibilidad y utilidades de la fase
   ---------------------------------------------------------- */

   .csw-visually-hidden {
   	position: absolute;
   	width: 0.0625rem;
   	height: 0.0625rem;
   	padding: 0;
   	margin: -0.0625rem;
   	overflow: hidden;
   	clip: rect(0, 0, 0, 0);
   	white-space: nowrap;
   	border: 0;
   }

   .csw-skip-link {
   	position: fixed;
   	top: 0.75rem;
   	left: 0.75rem;
   	z-index: 1400;
   	padding: 0.75rem 1rem;
   	border-radius: var(--csw-radius-pill);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-md);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	text-decoration: none;
   	transform: translateY(-180%);
   	transition: transform var(--csw-transition);
   }

   .csw-skip-link:focus {
   	transform: translateY(0);
   }

   .csw-icon {
   	width: 1.15rem;
   	height: 1.15rem;
   	flex: 0 0 1.15rem;
   	fill: none;
   	stroke: currentColor;
   	stroke-width: 1.8;
   	stroke-linecap: round;
   	stroke-linejoin: round;
   }

   body.csw-menu-open {
   	position: fixed;
   	right: 0;
   	left: 0;
   	width: 100%;
   	overflow: hidden;
   	padding-right: var(--csw-scrollbar-compensation, 0);
   }

/* ----------------------------------------------------------
   2. Cabecera general
   ---------------------------------------------------------- */

   .csw-site-header {
   	position: fixed;
   	top: 0;
   	right: 0;
   	left: 0;
   	z-index: 1000;
   	transition:
   	background-color var(--csw-transition),
   	box-shadow var(--csw-transition),
   	transform var(--csw-transition);
   }

   .csw-topbar,
   .csw-mainbar,
   .csw-site-logo,
   .csw-menu-link,
   .csw-mobile-toggle {
   	transition:
   	background-color var(--csw-transition),
   	border-color var(--csw-transition),
   	color var(--csw-transition),
   	box-shadow var(--csw-transition),
   	height var(--csw-transition),
   	width var(--csw-transition),
   	padding var(--csw-transition);
   }

/* ----------------------------------------------------------
   3. Barra superior
   ---------------------------------------------------------- */

   .csw-topbar {
   	border-bottom: 0.0625rem solid rgba(255, 255, 255, 0.32);
   	background: rgba(255, 255, 255, 0.82);
   	-webkit-backdrop-filter: blur(0.75rem);
   	backdrop-filter: blur(0.75rem);
   	color: var(--csw-color-dark);
   }

   .csw-topbar-inner {
   	display: flex;
   	min-height: 2.625rem;
   	align-items: center;
   	justify-content: space-between;
   	gap: var(--csw-space-4);
   	font-size: var(--csw-font-size-sm);
   }

   .csw-topbar-contact,
   .csw-topbar-tools,
   .csw-topbar-item,
   .csw-language-switcher {
   	display: flex;
   	align-items: center;
   }

   .csw-topbar-contact {
   	gap: clamp(0.75rem, 2vw, 1.5rem);
   	min-width: 0;
   }

   .csw-topbar-tools {
   	margin-left: auto;
   }

   .csw-topbar-item {
   	gap: var(--csw-space-2);
   	color: inherit;
   	text-decoration: none;
   	white-space: nowrap;
   }

   .csw-topbar-item:hover {
   	color: var(--csw-color-primary-hover);
   }

   .csw-language-switcher {
   	gap: var(--csw-space-2);
   }

   .csw-language-select {
   	min-height: 2rem;
   	padding: 0.15rem 1.75rem 0.15rem 0.5rem;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-pill);
   	background-color: var(--csw-color-white);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   }

   .csw-language-select:focus {
   	border-color: var(--csw-color-primary);
   	outline: 0;
   	box-shadow: 0 0 0 0.2rem rgba(237, 45, 136, 0.13);
   }

/* ----------------------------------------------------------
   4. Barra principal, logo y navegación de escritorio
   ---------------------------------------------------------- */

   .csw-mainbar {
   	background: linear-gradient(to bottom, rgba(33, 29, 31, 0.34), rgba(33, 29, 31, 0));
   }

   .csw-mainbar-inner {
   	display: grid;
   	grid-template-columns: auto minmax(0, 1fr) auto;
   	min-height: 6.5rem;
   	align-items: center;
   	gap: clamp(1rem, 3vw, 2.5rem);
   }

   .csw-site-logo,
   .csw-footer-logo {
   	display: inline-flex;
   	align-items: center;
   	justify-content: center;
   	overflow: hidden;
   	border: 0.0625rem solid rgba(255, 255, 255, 0.76);
   	border-radius: var(--csw-radius-md);
   	background: rgba(255, 255, 255, 0.94);
   	box-shadow: var(--csw-shadow-sm);
   	text-decoration: none;
   }

   .csw-site-logo {
   	width: 7rem;
   	height: 5rem;
   	padding: 0.4rem;
   }

   .csw-site-logo img,
   .csw-footer-logo img {
   	width: 100%;
   	height: 100%;
   	object-fit: contain;
   }

   .csw-primary-nav {
   	justify-self: end;
   }

   .csw-primary-menu {
   	display: flex;
   	align-items: center;
   	gap: clamp(1rem, 2vw, 2rem);
   	margin: 0;
   	padding: 0;
   	list-style: none;
   }

   .csw-menu-link {
   	position: relative;
   	display: inline-flex;
   	min-height: 2.75rem;
   	align-items: center;
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-size: 1.0625rem;
   	font-weight: 700;
   	letter-spacing: 0.025em;
   	text-decoration: none;
   	white-space: nowrap;
   }

   .csw-menu-link::after {
   	content: "";
   	position: absolute;
   	right: 0;
   	bottom: 0.25rem;
   	left: 0;
   	height: 0.125rem;
   	border-radius: 999px;
   	background: var(--csw-color-primary);
   	transform: scaleX(0);
   	transform-origin: center;
   	transition: transform var(--csw-transition);
   }

   .csw-menu-link:hover,
   .csw-menu-link:focus-visible,
   .csw-menu-link-active {
   	color: var(--csw-color-white);
   }

   .csw-menu-link:hover::after,
   .csw-menu-link:focus-visible::after,
   .csw-menu-link-active::after {
   	transform: scaleX(1);
   }

   .csw-header-actions {
   	display: flex;
   	align-items: center;
   	gap: var(--csw-space-3);
   }

   .csw-header-reserve {
   	white-space: nowrap;
   }

/* ----------------------------------------------------------
   5. Estado de cabecera al desplazarse
   ---------------------------------------------------------- */

   .csw-header-scrolled {
   	background: var(--csw-color-white);
   	box-shadow: 0 0.35rem 1.5rem rgba(33, 29, 31, 0.1);
   }

   .csw-header-scrolled .csw-topbar {
      position: relative;
      z-index: 999;
   	border-bottom-color: var(--csw-color-border);
   	background: rgba(255, 255, 255, 0.97);
   }

   .csw-header-scrolled .csw-mainbar {
   	background: var(--csw-color-white);
   }

   .csw-header-scrolled .csw-mainbar-inner {
   	min-height: 5rem;
   }

   .csw-header-scrolled .csw-site-logo {
   	width: 5.75rem;
   	height: 4.125rem;
   	padding: 0.3rem;
   	border-color: var(--csw-color-border);
   }

   .csw-header-scrolled .csw-menu-link {
   	color: var(--csw-color-dark);
   }

   .csw-header-scrolled .csw-menu-link:hover,
   .csw-header-scrolled .csw-menu-link:focus-visible,
   .csw-header-scrolled .csw-menu-link-active {
   	color: var(--csw-color-primary);
   }

/* ----------------------------------------------------------
   6. Navegación móvil
   ---------------------------------------------------------- */

   .csw-mobile-toggle {
   	display: none;
   	min-height: 3rem;
   	align-items: center;
   	justify-content: center;
   	gap: var(--csw-space-2);
   	padding: 0.65rem 0.95rem;
   	border: 0.0625rem solid rgba(255, 255, 255, 0.7);
   	border-radius: var(--csw-radius-pill);
   	background: rgba(255, 255, 255, 0.12);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	letter-spacing: 0.03em;
   }

   .csw-mobile-toggle-lines {
   	display: grid;
   	width: 1.2rem;
   	gap: 0.23rem;
   }

   .csw-mobile-toggle-lines span {
   	display: block;
   	width: 100%;
   	height: 0.125rem;
   	border-radius: 999px;
   	background: currentColor;
   	transition:
   	transform var(--csw-transition),
   	opacity var(--csw-transition);
   }

   .csw-mobile-toggle[aria-expanded="true"] .csw-mobile-toggle-lines span:nth-child(1) {
   	transform: translateY(0.355rem) rotate(45deg);
   }

   .csw-mobile-toggle[aria-expanded="true"] .csw-mobile-toggle-lines span:nth-child(2) {
   	opacity: 0;
   }

   .csw-mobile-toggle[aria-expanded="true"] .csw-mobile-toggle-lines span:nth-child(3) {
   	transform: translateY(-0.355rem) rotate(-45deg);
   }

   .csw-header-scrolled .csw-mobile-toggle {
   	border-color: var(--csw-color-border);
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   }

   .csw-mobile-layer {
   	position: fixed;
   	inset: 0;
   	z-index: 1200;
   	display: grid;
   	grid-template-columns: minmax(0, 1fr) minmax(18rem, 26rem);
   	visibility: hidden;
   	opacity: 0;
   	transition:
   	opacity var(--csw-transition),
   	visibility var(--csw-transition);
   }

   .csw-mobile-layer[hidden] {
   	display: none;
   }

   .csw-mobile-layer.csw-mobile-layer-open {
   	visibility: visible;
   	opacity: 1;
   }

   .csw-mobile-backdrop {
   	width: 100%;
   	height: 100%;
   	border: 0;
   	background: rgba(33, 29, 31, 0.58);
   	-webkit-backdrop-filter: blur(0.2rem);
   	backdrop-filter: blur(0.2rem);
   	cursor: pointer;
   }

   .csw-mobile-panel {
   	position: relative;
   	display: flex;
   	height: 100vh;
   	height: 100dvh;
   	min-width: 0;
   	flex-direction: column;
   	overflow-y: auto;
   	overscroll-behavior: contain;
   	padding: clamp(1.25rem, 4vw, 2rem);
   	background: var(--csw-color-white);
   	box-shadow: -1rem 0 2.5rem rgba(33, 29, 31, 0.15);
   	color: var(--csw-color-dark);
   	transform: translateX(100%);
   	transition: transform 220ms ease;
   }

   .csw-mobile-layer-open .csw-mobile-panel {
   	transform: translateX(0);
   }

   .csw-mobile-panel-header {
   	display: flex;
   	align-items: flex-start;
   	justify-content: space-between;
   	gap: var(--csw-space-4);
   	padding-bottom: var(--csw-space-5);
   	border-bottom: 0.0625rem solid var(--csw-color-border);
   }

   .csw-mobile-panel-kicker {
   	margin-bottom: var(--csw-space-1);
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-sm);
   	font-weight: 700;
   	letter-spacing: 0.12em;
   	text-transform: uppercase;
   }

   .csw-mobile-panel-title {
   	margin: 0;
   	font-size: 2rem;
   }

   .csw-mobile-close {
   	display: inline-flex;
   	width: 3rem;
   	height: 3rem;
   	align-items: center;
   	justify-content: center;
   	flex: 0 0 3rem;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: 50%;
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   }

   .csw-mobile-close:hover {
   	border-color: var(--csw-color-primary);
   	color: var(--csw-color-primary);
   }

   .csw-mobile-menu {
   	display: grid;
   	margin: var(--csw-space-4) 0 var(--csw-space-5);
   	padding: 0;
   	list-style: none;
   }

   .csw-mobile-menu a {
   	display: flex;
   	min-height: 3.5rem;
   	align-items: center;
   	border-bottom: 0.0625rem solid var(--csw-color-border);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-size: 1.3rem;
   	font-weight: 700;
   	text-decoration: none;
   }

   .csw-mobile-menu a:hover,
   .csw-mobile-menu a:focus-visible,
   .csw-mobile-menu a[aria-current="page"] {
   	color: var(--csw-color-primary);
   }

   .csw-mobile-panel-actions {
   	display: grid;
   	grid-template-columns: 1fr;
   	gap: var(--csw-space-3);
   }

   .csw-mobile-panel-actions .csw-btn {
   	width: 100%;
   }

   .csw-mobile-panel-meta {
   	display: grid;
   	gap: var(--csw-space-2);
   	margin-top: auto;
   	padding-top: var(--csw-space-6);
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   }

   .csw-mobile-panel-meta a {
   	overflow-wrap: anywhere;
   }

/* ==========================================================
   FASE HTML/CSS 3 — PÁGINA INICIO COMPLETA
   ========================================================== */

/* ----------------------------------------------------------
   1. Base de la página y animación de entrada
   ---------------------------------------------------------- */

   .csw-home-main {
   	overflow: clip;
   }

   .csw-media-image {
   	display: block;
   	width: 100%;
   	height: 100%;
   	object-fit: cover;
   }

/* Revelado real y perceptible al entrar en el viewport.
   Se usan las propiedades individuales translate/scale para no interferir
   con transforms propios de tarjetas, paneles, mapas o estados hover. */
   html.csw-js [data-csw-reveal].csw-reveal-ready {
   	--csw-reveal-x: 0;
   	--csw-reveal-y: 0;
   	--csw-reveal-scale: 1;
   	opacity: 0.04;
   	translate: var(--csw-reveal-x) var(--csw-reveal-y);
   	scale: var(--csw-reveal-scale);
   	transition-property: opacity, translate, scale;
   	transition-duration: 760ms, 820ms, 820ms;
   	transition-timing-function: cubic-bezier(.22, 1, .36, 1);
   	transition-delay: var(--csw-reveal-delay, 0ms);
   	will-change: opacity, translate, scale;
   }

   html.csw-js [data-csw-reveal="up"].csw-reveal-ready {
   	--csw-reveal-y: 4rem;
   }

   html.csw-js [data-csw-reveal="left"].csw-reveal-ready {
   	--csw-reveal-x: -4.5rem;
   }

   html.csw-js [data-csw-reveal="right"].csw-reveal-ready {
   	--csw-reveal-x: 4.5rem;
   }

   html.csw-js [data-csw-reveal="scale"].csw-reveal-ready {
   	--csw-reveal-y: 1.75rem;
   	--csw-reveal-scale: 0.9;
   }

   html.csw-js [data-csw-reveal].csw-reveal-ready.csw-reveal-visible,
   html.csw-js [data-csw-reveal].csw-reveal-ready.csw-reveal-complete {
   	opacity: 1;
   	translate: 0 0;
   	scale: 1;
   }

   html.csw-js [data-csw-reveal].csw-reveal-complete {
   	will-change: auto;
   }

   html.csw-js.csw-reveal-preparing [data-csw-reveal].csw-reveal-ready {
   	transition: none !important;
   }

   .csw-text-link {
   	display: inline-flex;
   	align-items: center;
   	gap: var(--csw-space-2);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	letter-spacing: 0.025em;
   	text-decoration: none;
   }

   .csw-text-link span {
   	transition: transform var(--csw-transition);
   }

   .csw-text-link:hover span,
   .csw-text-link:focus-visible span {
   	transform: translateX(0.25rem);
   }

/* ----------------------------------------------------------
   2. Hero principal
   ---------------------------------------------------------- */

   .csw-home-hero {
   	position: relative;
   	display: grid;
   	min-height: max(44rem, 100svh);
   	align-items: end;
   	overflow: hidden;
   	background: var(--csw-color-dark);
   	color: var(--csw-color-white);
   }

   .csw-hero-image,
   .csw-hero-overlay {
   	position: absolute;
   	inset: 0;
   	width: 100%;
   	height: 100%;
   }

   .csw-hero-overlay {
   	background:
   	linear-gradient(to bottom, rgba(33, 29, 31, 0.1), rgba(33, 29, 31, 0.18) 42%, rgba(33, 29, 31, 0.78)),
   	linear-gradient(to right, rgba(33, 29, 31, 0.58), transparent 68%);
   }

   .csw-hero-inner {
   	position: relative;
   	z-index: 1;
   	display: grid;
   	min-height: max(44rem, 100svh);
   	align-content: end;
   	gap: clamp(2rem, 5vw, 4rem);
   	padding-top: clamp(10rem, 18vw, 13rem);
   	padding-bottom: clamp(3.5rem, 8vw, 6rem);
   }

   .csw-hero-content {
   	max-width: 48rem;
   }

   .csw-hero-eyebrow {
   	margin-bottom: var(--csw-space-3);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-sm);
   	font-weight: 700;
   	letter-spacing: 0.14em;
   	text-transform: uppercase;
   }

   .csw-hero-title {
   	margin-bottom: var(--csw-space-4);
   	color: var(--csw-color-white);
   	font-size: clamp(4rem, 10vw, 5rem);
   	line-height: 0.92;
   	text-shadow: 0 0.25rem 1.5rem rgba(33, 29, 31, 0.28);
   }

   .csw-hero-subtitle {
   	max-width: 42rem;
   	margin-bottom: var(--csw-space-6);
   	color: rgba(255, 255, 255, 0.94);
   	font-size: clamp(1.2rem, 2.4vw, 1.65rem);
   	line-height: 1.5;
   }

   .csw-hero-actions .csw-btn-light {
   	background: rgba(255, 255, 255, 0.94);
   	border-color: rgba(255, 255, 255, 0.94);
   }

   .csw-hero-facts {
   	display: flex;
   	flex-wrap: wrap;
   	gap: var(--csw-space-3);
   	padding-top: var(--csw-space-5);
   	border-top: 0.0625rem solid rgba(255, 255, 255, 0.35);
   }

   .csw-hero-facts span {
   	display: inline-flex;
   	min-height: 2.35rem;
   	align-items: center;
   	padding: 0.35rem 0.8rem;
   	border: 0.0625rem solid rgba(255, 255, 255, 0.34);
   	border-radius: var(--csw-radius-pill);
   	background: rgba(33, 29, 31, 0.28);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	-webkit-backdrop-filter: blur(0.35rem);
   	backdrop-filter: blur(0.35rem);
   }

   .csw-hero-scroll {
   	position: absolute;
   	right: max(var(--csw-gutter), calc((100vw - var(--csw-container)) / 2));
   	bottom: clamp(3.5rem, 8vw, 6rem);
   	z-index: 2;
   	display: inline-flex;
   	align-items: center;
   	gap: var(--csw-space-2);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-sm);
   	font-weight: 700;
   	letter-spacing: 0.08em;
   	text-decoration: none;
   	text-transform: uppercase;
   }

   .csw-hero-scroll:hover {
   	color: var(--csw-color-white);
   }

   .csw-hero-scroll .csw-icon {
   	animation: csw-scroll-hint 1.8s ease-in-out 2;
   }

   @keyframes csw-scroll-hint {
   	0%, 100% { transform: translateY(0); }
   	50% { transform: translateY(0.3rem); }
   }

/* ----------------------------------------------------------
   3. Presentación
   ---------------------------------------------------------- */

   .csw-home-intro {
   	position: relative;
   }

   .csw-intro-grid,
   .csw-community-grid {
   	display: grid;
   	grid-template-columns: minmax(0, 1.08fr) minmax(20rem, 0.92fr);
   	align-items: center;
   	gap: clamp(2rem, 7vw, 6rem);
   }

   .csw-home-media {
   	position: relative;
   	margin: 0;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-bg-light);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-home-media::after {
   	content: "";
   	position: absolute;
   	inset: auto 0 0;
   	height: 35%;
   	background: linear-gradient(to top, rgba(33, 29, 31, 0.18), transparent);
   	pointer-events: none;
   }

   .csw-intro-media {
   	aspect-ratio: 4 / 3;
   }

   .csw-intro-copy {
   	position: relative;
   	padding-block: var(--csw-space-5);
   }

   .csw-intro-copy::before {
   	content: "";
   	position: absolute;
   	top: 0;
   	left: -2.25rem;
   	width: 0.25rem;
   	height: 5rem;
   	border-radius: 999px;
   	background: var(--csw-color-primary);
   }

   .csw-home-quote {
   	margin: var(--csw-space-6) 0 0;
   	padding: var(--csw-space-5) 0 0;
   	border-top: 0.0625rem solid var(--csw-color-border);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-size: clamp(1.55rem, 3vw, 2.25rem);
   	font-weight: 700;
   	line-height: 1.2;
   }

/* ----------------------------------------------------------
   4. Características principales
   ---------------------------------------------------------- */

   .csw-home-features {
   	padding-block: clamp(2rem, 5vw, 3.5rem);
   	background: var(--csw-color-accent);
   	color: var(--csw-color-white);
   }

   .csw-feature-grid {
   	display: grid;
   	grid-template-columns: repeat(4, minmax(0, 1fr));
   	gap: 0;
   }

   .csw-feature-item {
   	display: grid;
   	grid-template-columns: auto minmax(0, 1fr);
   	gap: var(--csw-space-4);
   	padding: var(--csw-space-4) clamp(1rem, 2.5vw, 2rem);
   	border-right: 0.0625rem solid rgba(255, 255, 255, 0.28);
   }

   .csw-feature-item:first-child {
   	padding-left: 0;
   }

   .csw-feature-item:last-child {
   	padding-right: 0;
   	border-right: 0;
   }

   .csw-feature-icon {
   	display: inline-flex;
   	width: 3rem;
   	height: 3rem;
   	align-items: center;
   	justify-content: center;
   	border: 0.0625rem solid rgba(255, 255, 255, 0.5);
   	border-radius: 50%;
   	background: rgba(255, 255, 255, 0.12);
   }

   .csw-feature-icon .csw-icon {
   	width: 1.5rem;
   	height: 1.5rem;
   	flex-basis: 1.5rem;
   }

   .csw-feature-item h2 {
   	margin-bottom: var(--csw-space-1);
   	color: var(--csw-color-white);
   	font-size: 1.35rem;
   }

   .csw-feature-item p {
   	margin: 0;
   	color: rgba(255, 255, 255, 0.86);
   	font-size: var(--csw-font-size-sm);
   	line-height: 1.5;
   }

/* ----------------------------------------------------------
   5. Habitaciones editoriales
   ---------------------------------------------------------- */

   .csw-room-editorial {
   	display: grid;
   	grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.65fr);
   	gap: clamp(1.25rem, 3vw, 2rem);
   }

   .csw-room-featured {
   	position: relative;
   	min-height: 42rem;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-dark);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-room-media,
   .csw-room-media .csw-media-image {
   	position: absolute;
   	inset: 0;
   	width: 100%;
   	height: 100%;
   	margin: 0;
   }

   .csw-room-featured::after {
   	content: "";
   	position: absolute;
   	inset: 0;
   	background: linear-gradient(to top, rgba(33, 29, 31, 0.82), rgba(33, 29, 31, 0.04) 65%);
   }

   .csw-room-featured-panel {
   	position: absolute;
   	right: clamp(1rem, 3vw, 2rem);
   	bottom: clamp(1rem, 3vw, 2rem);
   	left: clamp(1rem, 3vw, 2rem);
   	z-index: 1;
   	max-width: 38rem;
   	padding: clamp(1.25rem, 3vw, 2rem);
   	border: 0.0625rem solid rgba(255, 255, 255, 0.4);
   	border-radius: var(--csw-radius-md);
   	background: rgba(255, 255, 255, 0.94);
   	box-shadow: var(--csw-shadow-sm);
   	-webkit-backdrop-filter: blur(0.6rem);
   	backdrop-filter: blur(0.6rem);
   }

   .csw-room-featured-panel h3 {
   	font-size: clamp(1.8rem, 4vw, 2.7rem);
   }

   .csw-room-list {
   	display: grid;
   	gap: var(--csw-space-4);
   }

   .csw-room-compact {
   	display: grid;
   	grid-template-columns: minmax(8rem, 0.42fr) minmax(0, 0.58fr);
   	min-height: 0;
   	overflow: hidden;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-room-compact figure {
   	min-height: 12rem;
   	margin: 0;
   	overflow: hidden;
   }

   .csw-room-compact > div {
   	display: flex;
   	flex-direction: column;
   	justify-content: center;
   	padding: clamp(1rem, 2vw, 1.5rem);
   }

   .csw-room-compact h3 {
   	margin-bottom: var(--csw-space-2);
   	font-size: clamp(1.3rem, 2.1vw, 1.75rem);
   }

   .csw-room-compact p {
   	margin: 0;
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   	line-height: 1.55;
   }

/* ----------------------------------------------------------
   6. Luquina Cultural protagonista
   ---------------------------------------------------------- */

   .csw-cultural-section {
   	background: var(--csw-color-white);
   }

   .csw-cultural-stage {
   	position: relative;
   	min-height: 43rem;
   }

   .csw-cultural-media {
   	position: absolute;
   	inset: 0 9% 0 0;
   	margin: 0;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-dark);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-cultural-media::after {
   	content: "";
   	position: absolute;
   	inset: 0;
   	background: linear-gradient(to right, rgba(33, 29, 31, 0.18), transparent 62%);
   }

   .csw-cultural-panel {
   	position: absolute;
   	top: 50%;
   	right: 0;
   	z-index: 2;
   	width: min(36rem, 48%);
   	padding: clamp(1.75rem, 4vw, 3.25rem);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: rgba(255, 255, 255, 0.97);
   	box-shadow: var(--csw-shadow-md);
   	transform: translateY(-50%);
   	-webkit-backdrop-filter: blur(0.65rem);
   	backdrop-filter: blur(0.65rem);
   }


   .csw-cultural-panel h2 {
   	font-size: clamp(2.5rem, 5vw, 3rem);
   }

   .csw-cultural-facts {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: var(--csw-space-3);
   	margin-block: var(--csw-space-5);
   }

   .csw-cultural-facts div {
   	padding: var(--csw-space-4);
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-bg-light);
   }

   .csw-cultural-facts strong,
   .csw-cultural-facts span {
   	display: block;
   }

   .csw-cultural-facts strong {
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: 1.55rem;
   	line-height: 1.1;
   }

   .csw-cultural-facts span {
   	margin-top: var(--csw-space-1);
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-xs);
   	line-height: 1.35;
   }

   .csw-check-list {
   	display: grid;
   	gap: var(--csw-space-2);
   	margin: 0 0 var(--csw-space-6);
   	padding: 0;
   	list-style: none;
   }

   .csw-check-list li {
   	position: relative;
   	padding-left: 1.75rem;
   }

   .csw-check-list li::before {
   	content: "✓";
   	position: absolute;
   	top: 0;
   	left: 0;
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   }

/* ----------------------------------------------------------
   7. Ruta Puno–Uros–Taquile–Luquina
   ---------------------------------------------------------- */

   .csw-route-section {
   	background: linear-gradient(180deg, var(--csw-color-bg-light), var(--csw-color-white));
   }

   .csw-route-list {
   	position: relative;
   	display: grid;
   	grid-template-columns: repeat(4, minmax(0, 1fr));
   	gap: clamp(1rem, 3vw, 2rem);
   	margin: 0;
   	padding: 0;
   	list-style: none;
   }

   .csw-route-list::before {
   	content: "";
   	position: absolute;
   	top: 2rem;
   	right: 12.5%;
   	left: 12.5%;
   	height: 0.125rem;
   	background: linear-gradient(to right, var(--csw-color-primary), var(--csw-color-accent));
   }

   .csw-route-step {
   	position: relative;
   	z-index: 1;
   	padding: 0 var(--csw-space-3);
   	text-align: center;
   }

   .csw-route-number {
   	display: inline-flex;
   	width: 4rem;
   	height: 4rem;
   	align-items: center;
   	justify-content: center;
   	margin-bottom: var(--csw-space-4);
   	border: 0.25rem solid var(--csw-color-white);
   	border-radius: 50%;
   	background: var(--csw-color-primary);
   	box-shadow: var(--csw-shadow-sm);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-size: 1.15rem;
   	font-weight: 700;
   }

   .csw-route-step:nth-child(even) .csw-route-number {
   	background: var(--csw-color-accent);
   }

   .csw-route-step h3 {
   	margin-bottom: var(--csw-space-2);
   	font-size: 1.75rem;
   }

   .csw-route-step p {
   	margin: 0;
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   	line-height: 1.55;
   }

/* ----------------------------------------------------------
   8. Experiencias complementarias
   ---------------------------------------------------------- */

   .csw-experience-grid {
   	display: grid;
   	grid-template-columns: repeat(4, minmax(0, 1fr));
   	gap: clamp(1rem, 2.5vw, 1.75rem);
   }

   .csw-experience-card {
   	display: flex;
   	min-width: 0;
   	flex-direction: column;
   	overflow: hidden;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   	transition:
   	transform var(--csw-transition),
   	box-shadow var(--csw-transition);
   }

   .csw-experience-card:hover {
   	transform: translateY(-0.25rem);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-experience-card figure {
   	aspect-ratio: 4 / 3;
   	margin: 0;
   	overflow: hidden;
   }

   .csw-experience-body {
   	display: flex;
   	flex: 1;
   	flex-direction: column;
   	padding: clamp(1.25rem, 2.5vw, 1.75rem);
   }

   .csw-experience-body h3 {
   	font-size: clamp(1.45rem, 2.5vw, 2rem);
   }

   .csw-experience-body p:not(.csw-card-label) {
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   	line-height: 1.55;
   }

   .csw-experience-body .csw-text-link {
   	margin-top: auto;
   }

/* ----------------------------------------------------------
   9. Comunidad de Luquina Chico
   ---------------------------------------------------------- */

   .csw-community-section {
   	position: relative;
   }

   .csw-community-grid {
   	grid-template-columns: minmax(20rem, 0.88fr) minmax(0, 1.12fr);
   }

   .csw-community-copy {
   	position: relative;
   	z-index: 2;
   	padding: clamp(1.5rem, 4vw, 3rem);
   	border-left: 0.25rem solid var(--csw-color-primary);
   	background: var(--csw-color-white);
   }

   .csw-community-media {
   	aspect-ratio: 16 / 11;
   }

   .csw-community-note {
   	margin-top: var(--csw-space-5);
   	padding: var(--csw-space-4) var(--csw-space-5);
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: 1.25rem;
   	font-weight: 700;
   }

/* ----------------------------------------------------------
   10. Cómo llegar
   ---------------------------------------------------------- */

   .csw-arrival-section {
   	background:
   	radial-gradient(circle at 88% 14%, rgba(35, 172, 226, 0.14), transparent 30%),
   	var(--csw-color-bg-light);
   }

   .csw-arrival-layout {
   	display: grid;
   	grid-template-columns: minmax(0, 0.9fr) minmax(22rem, 1.1fr);
   	align-items: stretch;
   	gap: clamp(2rem, 6vw, 5rem);
   }

   .csw-arrival-intro {
   	align-self: center;
   }

   .csw-arrival-time {
   	display: grid;
   	gap: var(--csw-space-1);
   	margin: var(--csw-space-5) 0 var(--csw-space-6);
   	padding: var(--csw-space-4) var(--csw-space-5);
   	border-left: 0.25rem solid var(--csw-color-accent);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-arrival-time strong {
   	color: var(--csw-color-accent);
   	font-family: var(--csw-font-heading);
   	font-size: clamp(1.7rem, 3vw, 2.4rem);
   	line-height: 1.1;
   }

   .csw-arrival-time span {
   	color: var(--csw-color-text-muted);
   }

   .csw-arrival-options {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: var(--csw-space-4);
   }

   .csw-arrival-card {
   	padding: clamp(1.5rem, 4vw, 2.5rem);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-arrival-icon {
   	display: inline-flex;
   	width: 3.75rem;
   	height: 3.75rem;
   	align-items: center;
   	justify-content: center;
   	margin-bottom: var(--csw-space-5);
   	border-radius: 50%;
   	background: rgba(35, 172, 226, 0.12);
   	color: var(--csw-color-accent);
   }

   .csw-arrival-icon .csw-icon {
   	width: 1.8rem;
   	height: 1.8rem;
   	flex-basis: 1.8rem;
   }

   .csw-arrival-card h3 {
   	font-size: 1.8rem;
   }

   .csw-arrival-card p {
   	margin: 0;
   	color: var(--csw-color-text-muted);
   }

/* ----------------------------------------------------------
   11. Reserva directa
   ---------------------------------------------------------- */

   .csw-direct-booking {
   	background: var(--csw-color-white);
   }

   .csw-booking-grid {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: clamp(1rem, 3vw, 2rem);
   	max-width: 62rem;
   	margin-inline: auto;
   }

   .csw-booking-card {
   	display: flex;
   	min-height: 22rem;
   	flex-direction: column;
   	align-items: flex-start;
   	padding: clamp(1.75rem, 4vw, 3rem);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-booking-card h3 {
   	font-size: clamp(1.9rem, 4vw, 3rem);
   }

   .csw-booking-card p:not(.csw-card-label) {
   	color: var(--csw-color-text-muted);
   }

   .csw-booking-card .csw-btn {
   	margin-top: auto;
   }

   .csw-booking-card-primary {
   	border-color: transparent;
   	background: var(--csw-color-primary);
   	color: var(--csw-color-white);
   }

   .csw-booking-card-primary .csw-card-label,
   .csw-booking-card-primary h3,
   .csw-booking-card-primary p:not(.csw-card-label) {
   	color: var(--csw-color-white);
   }

   .csw-booking-contact {
   	display: flex;
   	flex-wrap: wrap;
   	align-items: center;
   	justify-content: center;
   	gap: var(--csw-space-4) var(--csw-space-6);
   	max-width: 62rem;
   	margin: var(--csw-space-6) auto 0;
   	padding-top: var(--csw-space-5);
   	border-top: 0.0625rem solid var(--csw-color-border);
   }

   .csw-booking-contact a {
   	display: inline-flex;
   	align-items: center;
   	gap: var(--csw-space-2);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	text-decoration: none;
   }

   .csw-booking-contact a:hover {
   	color: var(--csw-color-primary);
   }

/* ----------------------------------------------------------
   12. Responsive de Inicio
   ---------------------------------------------------------- */

   @media (max-width: 74.999rem) {
   	.csw-feature-grid {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}

   	.csw-feature-item:nth-child(2) {
   		border-right: 0;
   	}

   	.csw-feature-item:nth-child(n + 3) {
   		border-top: 0.0625rem solid rgba(255, 255, 255, 0.28);
   	}

   	.csw-feature-item:nth-child(3) {
   		padding-left: 0;
   	}

   	.csw-room-editorial {
   		grid-template-columns: minmax(0, 1.15fr) minmax(18rem, 0.85fr);
   	}

   	.csw-room-compact {
   		grid-template-columns: 1fr;
   	}

   	.csw-room-compact figure {
   		min-height: 9rem;
   		aspect-ratio: 16 / 7;
   	}

   	.csw-experience-grid {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}
   }

   @media (max-width: 61.999rem) {
   	.csw-hero-scroll {
   		display: none;
   	}

   	.csw-intro-grid,
   	.csw-community-grid,
   	.csw-arrival-layout {
   		grid-template-columns: 1fr;
   	}

   	.csw-intro-copy::before {
   		left: 0;
   	}

   	.csw-intro-copy {
   		padding-left: var(--csw-space-5);
   	}

   	.csw-room-editorial {
   		grid-template-columns: 1fr;
   	}

   	.csw-room-featured {
   		min-height: 36rem;
   	}

   	.csw-room-list {
   		grid-template-columns: repeat(3, minmax(0, 1fr));
   	}

   	.csw-cultural-stage {
   		display: grid;
   		min-height: 0;
   	}

   	.csw-cultural-media {
   		position: relative;
   		inset: auto;
   		aspect-ratio: 16 / 9;
   	}

   	.csw-cultural-panel {
   		position: relative;
   		top: auto;
   		right: auto;
   		width: min(100% - 2rem, 42rem);
   		margin: -4rem auto 0;
   		transform: none;
   	}


   	.csw-route-list {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   		gap: var(--csw-space-7) var(--csw-space-5);
   	}

   	.csw-route-list::before {
   		display: none;
   	}

   	.csw-community-copy {
   		order: 2;
   	}

   	.csw-community-media {
   		order: 1;
   	}
   }

   @media (max-width: 47.999rem) {
   	.csw-home-hero,
   	.csw-hero-inner {
   		min-height: max(42rem, 100svh);
   	}

   	.csw-hero-inner {
   		padding-top: 9rem;
   		padding-bottom: 2.5rem;
   	}

   	.csw-hero-title {
   		font-size: clamp(3.4rem, 18vw, 5.25rem);
   	}

   	.csw-hero-actions {
   		align-items: stretch;
   		flex-direction: column;
   	}

   	.csw-hero-actions .csw-btn {
   		width: 100%;
   	}

   	.csw-hero-facts {
   		gap: var(--csw-space-2);
   	}

   	.csw-hero-facts span {
   		font-size: var(--csw-font-size-xs);
   	}

   	.csw-feature-grid,
   	.csw-room-list,
   	.csw-experience-grid,
   	.csw-arrival-options,
   	.csw-booking-grid {
   		grid-template-columns: 1fr;
   	}

   	.csw-feature-item,
   	.csw-feature-item:first-child,
   	.csw-feature-item:nth-child(3),
   	.csw-feature-item:last-child {
   		padding: var(--csw-space-4) 0;
   		border-top: 0.0625rem solid rgba(255, 255, 255, 0.28);
   		border-right: 0;
   	}

   	.csw-feature-item:first-child {
   		border-top: 0;
   	}

   	.csw-room-featured {
   		min-height: 31rem;
   	}

   	.csw-room-featured-panel {
   		padding: var(--csw-space-5);
   	}

   	.csw-room-compact {
   		grid-template-columns: minmax(7rem, 0.38fr) minmax(0, 0.62fr);
   	}

   	.csw-room-compact figure {
   		min-height: 11rem;
   		aspect-ratio: auto;
   	}

   	.csw-cultural-panel {
   		width: calc(100% - 1rem);
   		margin-top: -2rem;
   		padding: var(--csw-space-5);
   	}

   	.csw-cultural-facts {
   		grid-template-columns: 1fr;
   	}

   	.csw-cultural-panel .csw-actions {
   		align-items: stretch;
   		flex-direction: column;
   	}

   	.csw-cultural-panel .csw-btn {
   		width: 100%;
   	}

   	.csw-route-list {
   		grid-template-columns: 1fr;
   		gap: var(--csw-space-5);
   	}

   	.csw-route-step {
   		display: grid;
   		grid-template-columns: auto minmax(0, 1fr);
   		gap: 0 var(--csw-space-4);
   		padding: 0;
   		text-align: left;
   	}

   	.csw-route-number {
   		grid-row: 1 / span 2;
   		margin: 0;
   	}

   	.csw-route-step h3 {
   		margin-bottom: var(--csw-space-1);
   	}

   	.csw-community-copy {
   		padding: var(--csw-space-5);
   	}

   	.csw-booking-card {
   		min-height: 0;
   	}

   	.csw-booking-card .csw-btn {
   		width: 100%;
   	}

   	.csw-booking-contact {
   		align-items: flex-start;
   		flex-direction: column;
   	}
   }

   @media (max-width: 29.999rem) {
   	.csw-room-compact {
   		grid-template-columns: 1fr;
   	}

   	.csw-room-compact figure {
   		aspect-ratio: 16 / 8;
   	}

   	.csw-route-step {
   		grid-template-columns: 3.5rem minmax(0, 1fr);
   	}

   	.csw-route-number {
   		width: 3.5rem;
   		height: 3.5rem;
   	}
   }

   @media (prefers-reduced-motion: reduce) {
   	.csw-hero-scroll .csw-icon {
   		animation: none;
   	}

   	html.csw-js [data-csw-reveal],
   	html.csw-js [data-csw-reveal].csw-reveal-visible {
   		opacity: 1;
   		transform: none;
   		transition: none;
   	}

   	.csw-experience-card:hover,
   	.csw-text-link:hover span,
   	.csw-text-link:focus-visible span {
   		transform: none;
   	}
   }

/* ----------------------------------------------------------
   7. Nivel emocional del pie de página
   ---------------------------------------------------------- */

   .csw-footer-cta {
   	position: relative;
   	overflow: hidden;
   	background: var(--csw-color-primary);
   	color: var(--csw-color-white);
   }

   .csw-footer-cta-image,
   .csw-footer-cta-overlay {
   	position: absolute;
   	inset: 0;
   	width: 100%;
   	height: 100%;
   }

   .csw-footer-cta-image {
   	object-fit: cover;
   }

   .csw-footer-cta-overlay {
   	background:
   	linear-gradient(rgba(237, 45, 136, 0.9), rgba(189, 28, 104, 0.94)),
   	radial-gradient(circle at 15% 20%, rgba(255, 255, 255, 0.15), transparent 30%);
   }

   .csw-footer-cta-inner {
   	position: relative;
   	z-index: 1;
   	padding-block: clamp(4rem, 8vw, 6.5rem);
   	text-align: center;
   }

   .csw-footer-kicker {
   	margin-bottom: var(--csw-space-3);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-sm);
   	font-weight: 700;
   	letter-spacing: 0.16em;
   	text-transform: uppercase;
   }

   .csw-footer-cta-title {
   	margin-bottom: var(--csw-space-6);
   	color: var(--csw-color-white);
   	font-size: clamp(2.25rem, 5vw, 4.5rem);
   }

   .csw-footer-cta-actions {
   	justify-content: center;
   }

/* ----------------------------------------------------------
   8. Nivel informativo del pie de página
   ---------------------------------------------------------- */

   .csw-footer-main {
   	background: var(--csw-color-white);
   	color: var(--csw-color-text);
   }

   .csw-footer-grid {
   	display: grid;
   	grid-template-columns: minmax(14rem, 1.35fr) repeat(3, minmax(10rem, 1fr));
   	gap: clamp(2rem, 5vw, 4rem);
   	padding-block: clamp(3rem, 7vw, 5rem);
   }

   .csw-footer-brand {
   	max-width: 20rem;
   }

   .csw-footer-logo {
   	width: 9rem;
   	height: 7rem;
   	margin-bottom: var(--csw-space-5);
   	padding: 0.5rem;
   	border-color: var(--csw-color-border);
   }

   .csw-footer-brand p {
   	color: var(--csw-color-text-muted);
   }

   .csw-footer-title {
   	margin-bottom: var(--csw-space-4);
   	font-size: 1.5rem;
   }

   .csw-footer-contact {
   	display: grid;
   	gap: var(--csw-space-3);
   	font-style: normal;
   }

   .csw-footer-contact > span,
   .csw-footer-contact a {
   	display: flex;
   	align-items: center;
   	gap: var(--csw-space-2);
   	color: var(--csw-color-text-muted);
   	text-decoration: none;
   }

   .csw-footer-contact a:hover {
   	color: var(--csw-color-primary);
   }

   .csw-footer-nav {
   	display: grid;
   	gap: var(--csw-space-2);
   	margin: 0;
   	padding: 0;
   	list-style: none;
   }

   .csw-footer-nav a {
   	display: inline-flex;
   	min-height: 2.25rem;
   	align-items: center;
   	color: var(--csw-color-text-muted);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	text-decoration: none;
   }

   .csw-footer-nav a:hover,
   .csw-footer-nav a:focus-visible {
   	color: var(--csw-color-primary);
   }

   .csw-footer-language {
   	display: grid;
   	gap: var(--csw-space-2);
   	max-width: 12rem;
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   }

   .csw-footer-bottom {
   	padding-block: var(--csw-space-5);
   	border-top: 0.0625rem solid var(--csw-color-border);
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   }

   .csw-footer-bottom p {
   	margin: 0;
   }

   .csw-footer-bottom a {
      color: inherit;
   }

   .csw-footer-bottom a:hover {
      color: var(--csw-color-primary);
   }

/* ----------------------------------------------------------
   9. Responsive de cabecera y pie de página
   ---------------------------------------------------------- */

   @media (max-width: 74.999rem) {
   	.csw-mainbar-inner {
   		gap: 1rem;
   	}

   	.csw-primary-menu {
   		gap: 1rem;
   	}

   	.csw-menu-link {
   		font-size: 1rem;
   	}
   }

   @media (max-width: 61.999rem) {
   	.csw-mainbar-inner {
   		min-height: 5.5rem;
   	}

   	.csw-site-logo {
   		width: 6rem;
   		height: 4.5rem;
   	}

   	.csw-primary-nav {
   		display: none;
   	}

   	.csw-mobile-toggle {
   		display: inline-flex;
   	}

   	.csw-header-scrolled .csw-site-logo {
   		width: 5.25rem;
   		height: 3.875rem;
   	}

   	.csw-footer-grid {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}

   	.csw-footer-brand {
   		max-width: none;
   	}
   }

   @media (max-width: 47.999rem) {
   	.csw-topbar-inner {
   		min-height: 2.5rem;
   	}

   	.csw-topbar-address {
   		display: none;
   	}

   	.csw-topbar-item {
   		font-size: 0.875rem;
   	}

   	.csw-mainbar-inner {
   		min-height: 5rem;
   		gap: var(--csw-space-2);
   	}

   	.csw-site-logo {
   		width: 5rem;
   		height: 3.875rem;
   	}

   	.csw-header-reserve {
   		padding-inline: 1rem;
   		font-size: 0.875rem;
   	}

   	.csw-mainbar .csw-btn,
   	.csw-footer-cta .csw-btn {
   		width: auto;
   	}

   	.csw-mobile-layer {
   		grid-template-columns: minmax(0, 1fr) minmax(18rem, 23rem);
   	}

   	.csw-footer-grid {
   		grid-template-columns: 1fr;
   	}

   	.csw-footer-brand {
   		max-width: 22rem;
   	}

   	.csw-footer-cta-actions {
   		align-items: stretch;
   		flex-direction: column;
   	}

   	.csw-footer-cta-actions .csw-btn {
   		width: 100%;
   	}
   }

   @media (max-width: 29.999rem) {
   	.csw-language-switcher .csw-icon {
   		display: none;
   	}

   	.csw-language-select {
   		padding-right: 1.4rem;
   	}

   	.csw-mainbar-inner {
   		min-height: 4.75rem;
   	}

   	.csw-site-logo {
   		width: 4.5rem;
   		height: 3.5rem;
   	}

   	.csw-header-reserve {
   		display: none;
   	}

   	.csw-mobile-toggle {
   		padding-inline: 0.75rem;
   	}

   	.csw-mobile-layer {
   		grid-template-columns: 1fr;
   	}

   	.csw-mobile-backdrop {
   		display: none;
   	}

   	.csw-mobile-panel {
   		width: 100%;
   	}

   	.csw-footer-logo {
   		width: 8rem;
   		height: 6.25rem;
   	}
   }

   @media (prefers-reduced-motion: reduce) {
   	.csw-mobile-layer,
   	.csw-mobile-panel,
   	.csw-site-header,
   	.csw-topbar,
   	.csw-mainbar,
   	.csw-site-logo,
   	.csw-menu-link,
   	.csw-mobile-toggle,
   	.csw-mobile-toggle-lines span {
   		transition: none;
   	}
   }


/* ==========================================================
   FASE HTML/CSS 4 — HABITACIONES Y EXPERIENCIAS
   ========================================================== */

/* ----------------------------------------------------------
   1. Base común de páginas internas
   ---------------------------------------------------------- */

   .csw-inner-main {
   	overflow: clip;
   }

   .csw-inner-hero {
   	position: relative;
   	display: grid;
   	min-height: clamp(34rem, 72svh, 48rem);
   	align-items: end;
   	overflow: hidden;
   	background: var(--csw-color-dark);
   	color: var(--csw-color-white);
   }

   .csw-inner-hero-image,
   .csw-inner-hero-overlay {
   	position: absolute;
   	inset: 0;
   	width: 100%;
   	height: 100%;
   }

   .csw-inner-hero-overlay {
   	background:
   	linear-gradient(to bottom, rgba(33, 29, 31, 0.12), rgba(33, 29, 31, 0.28) 45%, rgba(33, 29, 31, 0.82)),
   	linear-gradient(to right, rgba(33, 29, 31, 0.62), transparent 72%);
   }

   .csw-inner-hero-content {
   	position: relative;
   	z-index: 1;
   	padding-top: clamp(10rem, 18vw, 13rem);
   	padding-bottom: clamp(3rem, 7vw, 5rem);
   }

   .csw-inner-hero-title {
   	max-width: 58rem;
   	margin-bottom: var(--csw-space-4);
   	color: var(--csw-color-white);
   	font-size: clamp(3.25rem, 8vw, 4.5rem);
   	line-height: 0.96;
   	text-shadow: 0 0.25rem 1.5rem rgba(33, 29, 31, 0.3);
   }

   .csw-inner-hero-subtitle {
   	max-width: 44rem;
   	margin-bottom: var(--csw-space-6);
   	color: rgba(255, 255, 255, 0.94);
   	font-size: clamp(1.15rem, 2.3vw, 1.55rem);
   	line-height: 1.5;
   }

   .csw-inner-intro-grid {
   	display: grid;
   	grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr);
   	align-items: center;
   	gap: clamp(2rem, 7vw, 6rem);
   }

   .csw-inner-intro-grid-reverse {
   	grid-template-columns: minmax(20rem, 0.95fr) minmax(0, 1.05fr);
   }

   .csw-inner-media {
   	position: relative;
   	margin: 0;
   	aspect-ratio: 4 / 3;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-bg-light);
   	box-shadow: var(--csw-shadow-md);
   }

/* ----------------------------------------------------------
   2. Características y catálogo de habitaciones
   ---------------------------------------------------------- */

   .csw-amenity-grid {
   	display: grid;
   	grid-template-columns: repeat(4, minmax(0, 1fr));
   	gap: var(--csw-space-4);
   	margin: 0;
   	padding: 0;
   	list-style: none;
   }

   .csw-amenity-grid li {
   	position: relative;
   	display: flex;
   	min-height: 7.5rem;
   	align-items: flex-end;
   	padding: var(--csw-space-5);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-size: 1.15rem;
   	font-weight: 700;
   	line-height: 1.25;
   }

   .csw-amenity-grid li::before {
   	content: "";
   	position: absolute;
   	top: var(--csw-space-5);
   	left: var(--csw-space-5);
   	width: 2rem;
   	height: 0.25rem;
   	border-radius: 999px;
   	background: var(--csw-color-primary);
   	box-shadow: 0 0.55rem 0 var(--csw-color-accent);
   }

   .csw-room-showcase-list {
   	display: grid;
   	gap: clamp(3rem, 7vw, 6rem);
   }

   .csw-room-showcase {
   	display: grid;
   	grid-template-columns: minmax(0, 1.12fr) minmax(20rem, 0.88fr);
   	align-items: center;
   	gap: clamp(2rem, 6vw, 5rem);
   }

   .csw-room-showcase-reverse .csw-room-showcase-media {
   	order: 2;
   }

   .csw-room-showcase-media {
   	margin: 0;
   	aspect-ratio: 4 / 3;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-bg-light);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-room-showcase-copy {
   	padding-block: var(--csw-space-5);
   }

   .csw-room-showcase-copy h3 {
   	font-size: clamp(2rem, 4.5vw, 3.4rem);
   }

   .csw-room-detail-list {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: var(--csw-space-2) var(--csw-space-4);
   	margin: var(--csw-space-5) 0 var(--csw-space-6);
   	padding: 0;
   	list-style: none;
   }

   .csw-room-detail-list li {
   	position: relative;
   	padding-left: 1.25rem;
   	color: var(--csw-color-text-muted);
   }

   .csw-room-detail-list li::before {
   	content: "";
   	position: absolute;
   	top: 0.7em;
   	left: 0;
   	width: 0.45rem;
   	height: 0.45rem;
   	border-radius: 50%;
   	background: var(--csw-color-primary);
   }

/* ----------------------------------------------------------
   3. Galería accesible de habitaciones
   ---------------------------------------------------------- */

   .csw-room-gallery {
   	display: grid;
   	gap: var(--csw-space-4);
   }

   .csw-gallery-stage {
   	position: relative;
   	margin: 0;
   	aspect-ratio: 16 / 9;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-dark);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-gallery-main-image {
   	transition: opacity var(--csw-transition), transform var(--csw-transition);
   }

   .csw-gallery-main-image.csw-gallery-image-changing {
   	opacity: 0.65;
   	transform: scale(1.01);
   }

   .csw-gallery-caption {
   	position: absolute;
   	right: var(--csw-space-4);
   	bottom: var(--csw-space-4);
   	left: var(--csw-space-4);
   	padding: var(--csw-space-3) var(--csw-space-4);
   	border: 0.0625rem solid rgba(255, 255, 255, 0.35);
   	border-radius: var(--csw-radius-md);
   	background: rgba(33, 29, 31, 0.72);
   	color: var(--csw-color-white);
   	-webkit-backdrop-filter: blur(0.45rem);
   	backdrop-filter: blur(0.45rem);
   }

   .csw-gallery-thumbnails {
   	display: grid;
   	grid-template-columns: repeat(4, minmax(0, 1fr));
   	gap: var(--csw-space-3);
   }

   .csw-gallery-thumb {
   	position: relative;
   	display: grid;
   	min-width: 0;
   	padding: 0;
   	overflow: hidden;
   	border: 0.125rem solid transparent;
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   	color: var(--csw-color-dark);
   	text-align: left;
   	transition: border-color var(--csw-transition), transform var(--csw-transition);
   }

   .csw-gallery-thumb:hover {
   	transform: translateY(-0.125rem);
   }

   .csw-gallery-thumb[aria-pressed="true"] {
   	border-color: var(--csw-color-primary);
   }

   .csw-gallery-thumb img {
   	aspect-ratio: 4 / 3;
   }

   .csw-gallery-thumb span {
   	padding: 0.65rem 0.8rem;
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   }

   .csw-room-experience-link {
   	border-top: 0.0625rem solid var(--csw-color-border);
   }

   .csw-room-experience-grid {
   	display: grid;
   	grid-template-columns: minmax(0, 1fr) auto;
   	align-items: center;
   	gap: var(--csw-space-7);
   }

   .csw-room-experience-actions {
   	display: grid;
   	gap: var(--csw-space-3);
   }

/* ----------------------------------------------------------
   4. Experiencia principal y colección
   ---------------------------------------------------------- */

   .csw-cultural-feature-section {
   	background: var(--csw-color-white);
   }

   .csw-cultural-feature {
   	position: relative;
   	min-height: 44rem;
   }

   .csw-cultural-feature-media {
   	position: absolute;
   	inset: 0 15% 0 0;
   	margin: 0;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-bg-light);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-cultural-feature-panel {
   	position: relative;
   	z-index: 1;
   	width: min(42rem, 54%);
   	margin-left: auto;
   	padding: clamp(2rem, 5vw, 4rem);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: rgba(255, 255, 255, 0.96);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-cultural-feature-panel h2 {
   	font-size: clamp(2.5rem, 5vw, 4.5rem);
   }

   .csw-cultural-feature-facts {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: var(--csw-space-3);
   	margin-block: var(--csw-space-5);
   }

   .csw-cultural-feature-facts div {
   	padding: var(--csw-space-4);
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-bg-light);
   }

   .csw-cultural-feature-facts strong,
   .csw-cultural-feature-facts span {
   	display: block;
   }

   .csw-cultural-feature-facts strong {
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: 1.5rem;
   }

   .csw-cultural-feature-facts span {
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   }

   .csw-cultural-places {
   	display: flex;
   	flex-wrap: wrap;
   	gap: var(--csw-space-2);
   	margin: 0 0 var(--csw-space-6);
   	padding: 0;
   	list-style: none;
   }

   .csw-cultural-places li {
   	padding: 0.35rem 0.8rem;
   	border: 0.0625rem solid var(--csw-color-accent);
   	border-radius: var(--csw-radius-pill);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   }

   .csw-experience-collection {
   	display: grid;
   	grid-template-columns: repeat(2, minmax(0, 1fr));
   	gap: clamp(1.25rem, 3vw, 2rem);
   }

   .csw-experience-detail-card {
   	display: grid;
   	grid-template-columns: minmax(10rem, 0.42fr) minmax(0, 0.58fr);
   	overflow: hidden;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   }

   .csw-experience-detail-card figure {
   	min-height: 21rem;
   	margin: 0;
   	overflow: hidden;
   }

   .csw-experience-detail-card-wide {
   	grid-column: 1 / -1;
   	grid-template-columns: minmax(0, 1.12fr) minmax(20rem, 0.88fr);
   }

   .csw-experience-detail-body {
   	display: flex;
   	min-width: 0;
   	flex-direction: column;
   	align-items: flex-start;
   	padding: clamp(1.35rem, 3vw, 2.25rem);
   }

   .csw-experience-detail-body h3 {
   	font-size: clamp(1.75rem, 3vw, 2.4rem);
   }

   .csw-experience-detail-body .csw-text-link {
   	margin-top: auto;
   }

   .csw-experience-price {
   	display: flex;
   	align-items: baseline;
   	gap: var(--csw-space-2);
   	margin: 0 0 var(--csw-space-4);
   }

   .csw-experience-price strong {
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: 2rem;
   }

   .csw-experience-price span {
   	color: var(--csw-color-text-muted);
   }

/* ----------------------------------------------------------
   5. Comunidad y CTA compartido
   ---------------------------------------------------------- */

   .csw-experience-community-stage {
   	position: relative;
   	min-height: 39rem;
   	display: flex;
   }
   .csw-experience-community-panel.csw-reveal-ready.csw-reveal-visible.csw-reveal-complete{
   	margin: auto 0;
   	height: min-content;
   }
   .csw-experience-community-media {
   	position: absolute;
   	inset: 0 0 0 22%;
   	margin: 0;
   	overflow: hidden;
   	border-radius: var(--csw-radius-lg);
   	background: var(--csw-color-bg-light);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-experience-community-panel {
   	position: relative;
   	z-index: 1;
   	width: min(38rem, 48%);
   	padding: clamp(2rem, 5vw, 4rem);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-lg);
   	background: rgba(255, 255, 255, 0.96);
   	box-shadow: var(--csw-shadow-md);
   }

   .csw-experience-community-panel h2 {
   	font-size: clamp(2.25rem, 4.5vw, 3.75rem);
   }

   .csw-page-cta {
   	position: relative;
   	display: grid;
   	min-height: clamp(30rem, 60vw, 42rem);
   	align-items: center;
   	overflow: hidden;
   	background: var(--csw-color-dark);
   	color: var(--csw-color-white);
   }

   .csw-page-cta-image,
   .csw-page-cta-overlay {
   	position: absolute;
   	inset: 0;
   	width: 100%;
   	height: 100%;
   }

   .csw-page-cta-overlay {
   	background: linear-gradient(rgba(33, 29, 31, 0.3), rgba(33, 29, 31, 0.78));
   }

   .csw-page-cta-inner {
   	position: relative;
   	z-index: 1;
   	padding-block: var(--csw-space-8);
   	text-align: center;
   }

   .csw-page-cta-inner .csw-section-label,
   .csw-page-cta-inner h2,
   .csw-page-cta-inner p {
   	color: var(--csw-color-white);
   }

   .csw-page-cta-inner h2 {
   	font-size: clamp(2.75rem, 6vw, 5rem);
   }

   .csw-page-cta-inner .csw-actions {
   	justify-content: center;
   }

/* ----------------------------------------------------------
   6. Responsive de páginas internas
   ---------------------------------------------------------- */

   @media (max-width: 74.999rem) {
   	.csw-amenity-grid {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}

   	.csw-experience-detail-card {
   		grid-template-columns: 1fr;
   	}

   	.csw-experience-detail-card figure {
   		min-height: 18rem;
   		aspect-ratio: 16 / 9;
   	}

   	.csw-experience-detail-card-wide {
   		grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr);
   	}
   }

   @media (max-width: 61.999rem) {
   	.csw-inner-intro-grid,
   	.csw-inner-intro-grid-reverse,
   	.csw-room-showcase,
   	.csw-room-experience-grid {
   		grid-template-columns: 1fr;
   	}

   	.csw-inner-intro-grid-reverse .csw-inner-media {
   		order: -1;
   	}

   	.csw-room-showcase-reverse .csw-room-showcase-media {
   		order: 0;
   	}

   	.csw-room-experience-actions {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}

   	.csw-cultural-feature,
   	.csw-experience-community-stage {
   		display: grid;
   		min-height: 0;
   		gap: var(--csw-space-5);
   	}

   	.csw-cultural-feature-media,
   	.csw-experience-community-media {
   		position: relative;
   		inset: auto;
   		aspect-ratio: 16 / 10;
   	}

   	.csw-cultural-feature-panel,
   	.csw-experience-community-panel {
   		width: calc(100% - (var(--csw-gutter) * 2));
   		margin: -6rem auto 0;
   	}

   	.csw-experience-collection {
   		grid-template-columns: 1fr;
   	}

   	.csw-experience-detail-card-wide {
   		grid-column: auto;
   		grid-template-columns: 1fr;
   	}
   }

   @media (max-width: 47.999rem) {
   	.csw-inner-hero {
   		min-height: 34rem;
   	}

   	.csw-inner-hero-content {
   		padding-top: 10rem;
   	}

   	.csw-amenity-grid,
   	.csw-room-detail-list,
   	.csw-cultural-feature-facts,
   	.csw-gallery-thumbnails,
   	.csw-room-experience-actions {
   		grid-template-columns: 1fr;
   	}

   	.csw-gallery-thumbnails {
   		grid-template-columns: repeat(2, minmax(0, 1fr));
   	}

   	.csw-cultural-feature-panel,
   	.csw-experience-community-panel {
   		width: calc(100% - 2rem);
   		margin-top: -3rem;
   		padding: 1.5rem;
   	}

   	.csw-page-cta-inner .csw-actions {
   		align-items: stretch;
   		flex-direction: column;
   	}

   	.csw-page-cta-inner .csw-btn {
   		width: 100%;
   	}
   }

   @media (max-width: 29.999rem) {
   	.csw-gallery-thumbnails {
   		grid-template-columns: 1fr;
   	}

   	.csw-gallery-caption {
   		position: relative;
   		right: auto;
   		bottom: auto;
   		left: auto;
   		border: 0;
   		border-radius: 0;
   		background: var(--csw-color-dark);
   	}
   }

   @media (prefers-reduced-motion: reduce) {
   	.csw-gallery-main-image,
   	.csw-gallery-thumb {
   		transition: none;
   	}
   }


/* ==========================================================
   FASE HTML/CSS 5 — LUQUINA CULTURAL 2D/1N Y CÓMO LLEGAR
   ========================================================== */

/* Luquina Cultural: hero y presentación */
.csw-cultural-hero-facts {
	display: flex;
	flex-wrap: wrap;
	gap: var(--csw-space-4);
	margin: var(--csw-space-5) 0;
}

.csw-cultural-hero-facts span {
	display: grid;
	min-width: 11rem;
	gap: var(--csw-space-1);
	padding: var(--csw-space-3) var(--csw-space-4);
	border: 0.0625rem solid rgba(255, 255, 255, 0.36);
	border-radius: var(--csw-radius-md);
	background: rgba(255, 255, 255, 0.12);
	-webkit-backdrop-filter: blur(0.5rem);
	backdrop-filter: blur(0.5rem);
}

.csw-cultural-hero-facts strong,
.csw-cultural-hero-facts small {
	color: var(--csw-color-white);
}

.csw-cultural-hero-facts strong {
	font-family: var(--csw-font-heading);
	font-size: 1.3rem;
}

.csw-cultural-hero-facts small {
	font-size: var(--csw-font-size-sm);
}

.csw-cultural-intro-grid,
.csw-location-grid,
.csw-cultural-community-grid,
.csw-arrival-practical-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: center;
	gap: clamp(2rem, 6vw, 5rem);
}

.csw-cultural-quote {
	margin: var(--csw-space-6) 0 0;
	padding: var(--csw-space-5);
	border-left: 0.25rem solid var(--csw-color-primary);
	background: var(--csw-color-bg-light);
	color: var(--csw-color-dark);
	font-family: var(--csw-font-heading);
	font-size: clamp(1.4rem, 2.5vw, 2rem);
	font-weight: 700;
	line-height: 1.2;
}

.csw-program-highlights,
.csw-inclusion-card,
.csw-transport-card,
.csw-arrival-contact-card {
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-program-highlights h3,
.csw-inclusion-card h3,
.csw-transport-card h3,
.csw-arrival-contact-card h3 {
	font-size: clamp(1.75rem, 3vw, 2.35rem);
}

.csw-check-list,
.csw-minus-list {
	display: grid;
	gap: var(--csw-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.csw-check-list li,
.csw-minus-list li {
	position: relative;
	padding-left: 1.75rem;
}

.csw-check-list li::before,
.csw-minus-list li::before {
	position: absolute;
	top: 0;
	left: 0;
	font-family: var(--csw-font-heading);
	font-weight: 700;
}

.csw-check-list li::before {
	content: "✓";
	color: var(--csw-color-success);
}

.csw-minus-list li::before {
	content: "—";
	color: var(--csw-color-danger);
}

/* Ruta del programa */
.csw-cultural-route {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--csw-space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.csw-cultural-route::before {
	content: "";
	position: absolute;
	top: 2rem;
	right: 8%;
	left: 8%;
	height: 0.125rem;
	background: linear-gradient(90deg, var(--csw-color-accent), var(--csw-color-primary));
}

.csw-cultural-route li {
	position: relative;
	z-index: 1;
	padding: var(--csw-space-5);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
	text-align: center;
}

.csw-cultural-route-number {
	display: inline-flex;
	width: 4rem;
	height: 4rem;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--csw-space-4);
	border-radius: 50%;
	background: var(--csw-color-primary);
	color: var(--csw-color-white);
	font-family: var(--csw-font-heading);
	font-size: 1.3rem;
	font-weight: 700;
}

.csw-cultural-route li:nth-child(even) .csw-cultural-route-number {
	background: var(--csw-color-accent);
}

.csw-cultural-route h3 {
	font-size: 1.65rem;
}

.csw-cultural-route p {
	margin: 0;
	color: var(--csw-color-text-muted);
}

/* Itinerario vertical */
.csw-itinerary-section {
	overflow: hidden;
}

.csw-timeline {
	display: grid;
	gap: var(--csw-space-7);
}

.csw-timeline-day {
	position: relative;
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-timeline-day-heading {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: var(--csw-space-4);
	margin-bottom: var(--csw-space-6);
}

.csw-timeline-day-heading > span {
	display: inline-flex;
	min-width: 4.5rem;
	min-height: 4.5rem;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--csw-color-primary);
	color: var(--csw-color-white);
	font-family: var(--csw-font-heading);
	font-weight: 700;
}

.csw-timeline-day:nth-child(even) .csw-timeline-day-heading > span {
	background: var(--csw-color-accent);
}

.csw-timeline-day-heading h3 {
	margin: 0;
	font-size: clamp(1.65rem, 3vw, 2.3rem);
}

.csw-timeline-list {
	position: relative;
	display: grid;
	gap: var(--csw-space-5);
	margin: 0;
	padding: 0 0 0 1rem;
	list-style: none;
}

.csw-timeline-list::before {
	content: "";
	position: absolute;
	top: 0.75rem;
	bottom: 0.75rem;
	left: 5.5rem;
	width: 0.125rem;
	background: var(--csw-color-border);
}

.csw-timeline-list li {
	position: relative;
	display: grid;
	grid-template-columns: 5.5rem 1fr;
	gap: var(--csw-space-4);
}

.csw-timeline-list li::before {
	content: "";
	position: absolute;
	top: 0.55rem;
	left: 4rem;
	width: 1rem;
	height: 1rem;
	border: 0.2rem solid var(--csw-color-white);
	border-radius: 50%;
	background: var(--csw-color-primary);
	box-shadow: 0 0 0 0.0625rem var(--csw-color-primary);
}

.csw-timeline-day:nth-child(even) .csw-timeline-list li::before {
	background: var(--csw-color-accent);
	box-shadow: 0 0 0 0.0625rem var(--csw-color-accent);
}

.csw-timeline-list time,
.csw-timeline-time-text {
	padding-right: var(--csw-space-7);
	color: var(--csw-color-primary);
	font-family: var(--csw-font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	text-align: right;
}

.csw-timeline-list h4 {
	margin-bottom: var(--csw-space-2);
	font-size: 1.3rem;
}

.csw-timeline-list p {
	margin: 0;
	color: var(--csw-color-text-muted);
}

/* Incluye y comunidad */
.csw-inclusions-grid,
.csw-transport-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--csw-space-5);
}

.csw-inclusion-card-muted {
	background: var(--csw-color-bg-light);
}

.csw-inclusion-price {
	display: grid;
	margin-top: var(--csw-space-7);
	padding-top: var(--csw-space-5);
	border-top: 0.0625rem solid var(--csw-color-border);
}

.csw-inclusion-price span,
.csw-inclusion-price small {
	color: var(--csw-color-text-muted);
}

.csw-inclusion-price strong {
	color: var(--csw-color-primary);
	font-family: var(--csw-font-heading);
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	line-height: 1;
}

.csw-cultural-community {
	background: linear-gradient(135deg, var(--csw-color-bg-light), var(--csw-color-white));
}

.csw-cultural-community-panel {
	padding: clamp(1.5rem, 5vw, 3.5rem);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-md);
}

/* Cómo llegar: ubicación y mapa de referencia */
.csw-location-facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--csw-space-3);
	margin-top: var(--csw-space-6);
}

.csw-location-facts div {
	display: grid;
	gap: var(--csw-space-1);
	padding: var(--csw-space-4);
	border-left: 0.2rem solid var(--csw-color-primary);
	background: var(--csw-color-bg-light);
}

.csw-location-facts strong {
	font-family: var(--csw-font-heading);
	font-size: 1.35rem;
}

.csw-location-facts span {
	color: var(--csw-color-text-muted);
	font-size: var(--csw-font-size-sm);
}

.csw-route-map {
	position: relative;
	min-height: 32rem;
	overflow: hidden;
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background:
	linear-gradient(135deg, rgba(35, 172, 226, 0.08), transparent 45%),
	var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-route-map-lake {
	position: absolute;
	top: -12%;
	right: -8%;
	width: 48%;
	height: 125%;
	border-radius: 50% 0 0 50%;
	background: linear-gradient(180deg, rgba(35, 172, 226, 0.78), rgba(35, 172, 226, 0.35));
}

.csw-route-map-lake span {
	position: absolute;
	top: 50%;
	right: 18%;
	color: var(--csw-color-white);
	font-family: var(--csw-font-heading);
	font-size: clamp(1.5rem, 3vw, 2.5rem);
	font-weight: 700;
	transform: rotate(90deg);
}

.csw-route-map-path {
	position: absolute;
  top: 49%;
  left: 14%;
  width: 58%;
  height: 0.3rem;
  border-radius: var(--csw-radius-pill);
  background: linear-gradient(90deg, var(--csw-color-primary), var(--csw-color-warning), var(--csw-color-accent));
  box-shadow: 0 0.35rem 1rem rgba(33, 29, 31, 0.16);
  transform: rotate(-8deg);
  transform-origin: left center;
}
.csw-route-map-path::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -0.15rem;
  width: 1rem;
  height: 1rem;
  border-top: 0.3rem solid var(--csw-color-accent);
  border-right: 0.3rem solid var(--csw-color-accent);
  transform: translateY(-50%) rotate(45deg);
}
.csw-route-map-stop {
	position: absolute;
	display: grid;
	min-width: 10rem;
	gap: var(--csw-space-1);
	padding: var(--csw-space-4);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-route-map-stop span {
	display: inline-flex;
	width: 2rem;
	height: 2rem;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--csw-color-primary);
	color: var(--csw-color-white);
	font-family: var(--csw-font-heading);
	font-weight: 700;
}

.csw-route-map-stop strong {
	font-family: var(--csw-font-heading);
	font-size: 1.4rem;
}

.csw-route-map-stop small {
	color: var(--csw-color-text-muted);
}

.csw-route-map-stop-puno {
	top: 63%;
	left: 7%;
}

.csw-route-map-stop-chucuito {
	top: 28%;
	left: 36%;
}

.csw-route-map-stop-luquina {
	top: 57%;
	right: 17%;
}

/* Cómo llegar: transporte y coordinación */
.csw-transport-card {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
}

.csw-transport-card-featured {
	border-top: 0.25rem solid var(--csw-color-primary);
}

.csw-transport-card-icon {
	display: inline-flex;
	width: 3.5rem;
	height: 3.5rem;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--csw-space-4);
	border-radius: 50%;
	background: rgba(35, 172, 226, 0.12);
	color: var(--csw-color-accent);
}

.csw-transport-card-icon .csw-icon {
	width: 1.75rem;
	height: 1.75rem;
}

.csw-transport-facts {
	display: grid;
	width: 100%;
	gap: var(--csw-space-3);
	margin: var(--csw-space-5) 0;
}

.csw-transport-facts div {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--csw-space-4);
	padding-bottom: var(--csw-space-3);
	border-bottom: 0.0625rem solid var(--csw-color-border);
}

.csw-transport-facts dt {
	color: var(--csw-color-text-muted);
}

.csw-transport-facts dd {
	margin: 0;
	font-family: var(--csw-font-heading);
	font-weight: 700;
	text-align: right;
}

.csw-transport-card .csw-btn {
	margin-top: auto;
}

.csw-arrival-practical {
	background: linear-gradient(135deg, rgba(237, 45, 136, 0.08), rgba(35, 172, 226, 0.1));
}

.csw-arrival-contact-card address {
	display: grid;
	gap: var(--csw-space-3);
	font-style: normal;
}

.csw-arrival-contact-card address span,
.csw-arrival-contact-card address a {
	color: var(--csw-color-text-muted);
	text-decoration: none;
}

.csw-arrival-contact-card address a:hover {
	color: var(--csw-color-primary);
}

@media (max-width: 61.999rem) {
	.csw-cultural-route {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.csw-cultural-route::before {
		display: none;
	}

	.csw-route-map-stop-luquina {
		right: 10%;
	}
}

@media (max-width: 47.999rem) {
	.csw-cultural-intro-grid,
	.csw-location-grid,
	.csw-cultural-community-grid,
	.csw-arrival-practical-grid,
	.csw-inclusions-grid,
	.csw-transport-grid {
		grid-template-columns: 1fr;
	}

	.csw-cultural-hero-facts {
		display: grid;
		grid-template-columns: 1fr;
	}

	.csw-cultural-route {
		grid-template-columns: 1fr;
	}

	.csw-timeline-day-heading {
		grid-template-columns: 1fr;
	}

	.csw-timeline-list {
		padding-left: 0;
	}

	.csw-timeline-list::before {
		left: 3.1rem;
	}

	.csw-timeline-list li {
		grid-template-columns: 4rem 1fr;
		gap: var(--csw-space-3);
	}

	.csw-timeline-list li::before {
		left: 2.65rem;
	}

	.csw-timeline-list time,
	.csw-timeline-time-text {
		padding-right: var(--csw-space-4);
		font-size: 1rem;
	}

	.csw-location-facts {
		grid-template-columns: 1fr;
	}

	.csw-route-map {
		display: grid;
		min-height: auto;
		gap: var(--csw-space-4);
		padding: var(--csw-space-5);
	}

	.csw-route-map-lake,
	.csw-route-map-path {
		display: none;
	}

	.csw-route-map-stop {
		position: relative;
		top: auto;
		right: auto;
		left: auto;
		min-width: 0;
	}

	.csw-transport-facts div {
		align-items: flex-start;
		flex-direction: column;
		gap: var(--csw-space-1);
	}

	.csw-transport-facts dd {
		text-align: left;
	}
}

@media (max-width: 29.999rem) {
	.csw-timeline-day,
	.csw-program-highlights,
	.csw-inclusion-card,
	.csw-transport-card,
	.csw-arrival-contact-card,
	.csw-cultural-community-panel {
		padding: 1.25rem;
	}

	.csw-timeline-list::before,
	.csw-timeline-list li::before {
		display: none;
	}

	.csw-timeline-list li {
		grid-template-columns: 1fr;
	}

	.csw-timeline-list time,
	.csw-timeline-time-text {
		padding-right: 0;
		text-align: left;
	}
}

/* ==========================================================
   FASE HTML/CSS 6 — AGENCIAS Y RESERVAR
   ========================================================== */

/* Agencias: beneficios y proceso */
.csw-agency-benefit-grid,
.csw-agency-process-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--csw-space-4);
}

.csw-agency-benefit-card,
.csw-agency-process-grid li {
	padding: clamp(1.5rem, 3vw, 2rem);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-agency-benefit-card h3,
.csw-agency-process-grid h3 {
	font-size: 1.55rem;
}

.csw-agency-benefit-card p,
.csw-agency-process-grid p {
	margin: 0;
	color: var(--csw-color-text-muted);
}

.csw-agency-benefit-icon,
.csw-booking-route-icon,
.csw-confirmation-icon,
.csw-dossier-icon,
.csw-reservation-summary-icon {
	display: inline-flex;
	width: 3.5rem;
	height: 3.5rem;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--csw-space-4);
	border-radius: 50%;
	background: rgba(237, 45, 136, 0.1);
	color: var(--csw-color-primary);
}

.csw-agency-benefit-icon .csw-icon,
.csw-booking-route-icon .csw-icon,
.csw-confirmation-icon .csw-icon,
.csw-dossier-icon .csw-icon,
.csw-reservation-summary-icon .csw-icon {
	width: 1.7rem;
	height: 1.7rem;
}

.csw-agency-process {
	background: linear-gradient(135deg, rgba(35, 172, 226, 0.07), rgba(237, 45, 136, 0.06));
}

.csw-agency-process-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	counter-reset: none;
	list-style: none;
}

.csw-agency-process-grid li {
	position: relative;
}

.csw-agency-process-grid li > span {
	display: inline-flex;
	min-width: 2.75rem;
	height: 2.75rem;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--csw-space-4);
	border-radius: var(--csw-radius-pill);
	background: var(--csw-color-primary);
	color: var(--csw-color-white);
	font-family: var(--csw-font-heading);
	font-weight: 700;
}

/* Agencias: formulario dinámico */
.csw-agency-form-layout,
.csw-reservation-layout,
.csw-direct-booking-grid {
	display: grid;
	grid-template-columns: minmax(17rem, 0.75fr) minmax(0, 1.25fr);
	align-items: start;
	gap: clamp(2rem, 6vw, 5rem);
}

.csw-agency-form-aside {
	position: sticky;
	top: 8rem;
}

.csw-agency-audience-list,
.csw-direct-booking-list {
	display: grid;
	gap: var(--csw-space-2);
	margin: var(--csw-space-5) 0;
	padding: 0;
	list-style: none;
}

.csw-agency-audience-list li,
.csw-direct-booking-list li {
	position: relative;
	padding-left: 1.4rem;
	color: var(--csw-color-text-muted);
}

.csw-agency-audience-list li::before,
.csw-direct-booking-list li::before {
	content: "";
	position: absolute;
	top: 0.7em;
	left: 0;
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--csw-color-primary);
}

.csw-agency-direct-contact {
	display: grid;
	gap: var(--csw-space-2);
	font-style: normal;
}

.csw-agency-direct-contact a {
	color: var(--csw-color-dark);
	font-family: var(--csw-font-heading);
	font-weight: 700;
	text-decoration: none;
}

.csw-agency-direct-contact a:hover {
	color: var(--csw-color-primary);
}

.csw-form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--csw-space-5);
}

.csw-form-group-full {
	grid-column: 1 / -1;
}

.csw-dynamic-form-group {
	padding: var(--csw-space-5);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: var(--csw-color-bg-light);
}

.csw-dynamic-form-group[hidden] {
	display: none;
}

.csw-optional-label {
	color: var(--csw-color-text-muted);
	font-family: var(--csw-font-body);
	font-size: var(--csw-font-size-xs);
	font-weight: 400;
}

.csw-consent-field {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: start;
	gap: var(--csw-space-3);
	padding: var(--csw-space-4);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: var(--csw-color-bg-light);
	cursor: pointer;
}

.csw-consent-field input {
	width: 1.2rem;
	height: 1.2rem;
	margin-top: 0.2rem;
	accent-color: var(--csw-color-primary);
}

.csw-form-status {
	min-height: 1.5rem;
	margin: 0;
	color: var(--csw-color-text-muted);
	font-size: var(--csw-font-size-sm);
}

.csw-agency-confirmation {
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border: 0.0625rem solid rgba(5, 205, 15, 0.25);
	border-radius: var(--csw-radius-lg);
	background: rgba(5, 205, 15, 0.055);
}

.csw-agency-confirmation[hidden],
.csw-dossier-demo[hidden] {
	display: none;
}

.csw-agency-confirmation h3 {
	font-size: clamp(2rem, 4vw, 3rem);
}

.csw-confirmation-icon {
	background: rgba(5, 205, 15, 0.12);
	color: var(--csw-color-success);
}

.csw-dossier-demo {
	background: linear-gradient(135deg, rgba(237, 45, 136, 0.08), rgba(35, 172, 226, 0.08));
}

.csw-dossier-card {
	padding: clamp(2rem, 6vw, 4rem);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-md);
	text-align: center;
}

.csw-dossier-icon {
	margin-inline: auto;
}

.csw-dossier-status {
	margin: var(--csw-space-4) 0 0;
	color: var(--csw-color-text-muted);
	font-size: var(--csw-font-size-sm);
}

/* Reservar: rutas y contacto */
.csw-reserve-hero {
	min-height: clamp(31rem, 64svh, 42rem);
}

.csw-header-reserve-active {
	box-shadow: 0 0 0 0.1875rem rgba(255, 255, 255, 0.45);
}

.csw-header-scrolled .csw-header-reserve-active {
	box-shadow: 0 0 0 0.1875rem rgba(237, 45, 136, 0.22);
}

.csw-booking-route-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 4vw, 2.5rem);
}

.csw-booking-route-card {
	display: flex;
	overflow: hidden;
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
	flex-direction: column;
}

.csw-booking-route-card-featured {
	border-top: 0.25rem solid var(--csw-color-primary);
}

.csw-booking-route-card figure {
	margin: 0;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--csw-color-bg-light);
}

.csw-booking-route-body {
	display: flex;
	align-items: flex-start;
	flex: 1;
	flex-direction: column;
	padding: clamp(1.5rem, 4vw, 2.25rem);
}

.csw-booking-route-body h3 {
	font-size: clamp(2rem, 4vw, 3rem);
}

.csw-booking-route-body .csw-actions {
	margin-top: auto;
	padding-top: var(--csw-space-5);
}

.csw-direct-booking-grid {
	grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.9fr);
	align-items: center;
}

.csw-booking-contact-grid {
	display: grid;
	gap: var(--csw-space-3);
}

.csw-booking-contact-card {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0 var(--csw-space-4);
	padding: var(--csw-space-5);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
	color: var(--csw-color-dark);
	text-decoration: none;
	transition: transform var(--csw-transition), box-shadow var(--csw-transition), border-color var(--csw-transition);
}

.csw-booking-contact-card[href]:hover {
	border-color: rgba(237, 45, 136, 0.4);
	box-shadow: var(--csw-shadow-md);
	color: var(--csw-color-primary);
	transform: translateY(-0.125rem);
}

.csw-booking-contact-card > span {
	grid-row: 1 / 3;
	display: inline-flex;
	width: 3rem;
	height: 3rem;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(35, 172, 226, 0.1);
	color: var(--csw-color-accent);
}

.csw-booking-contact-card .csw-icon {
	width: 1.45rem;
	height: 1.45rem;
}

.csw-booking-contact-card small {
	color: var(--csw-color-text-muted);
}

.csw-booking-contact-card strong {
	min-width: 0;
	font-family: var(--csw-font-heading);
	font-size: 1.2rem;
	overflow-wrap: anywhere;
}

.csw-reservation-section {
	background: linear-gradient(135deg, rgba(35, 172, 226, 0.07), rgba(237, 45, 136, 0.07));
}

.csw-reservation-summary {
	display: flex;
	align-items: flex-start;
	gap: var(--csw-space-4);
	margin-top: var(--csw-space-6);
	padding: var(--csw-space-5);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-reservation-summary-icon {
	flex: 0 0 3.5rem;
	margin: 0;
}

.csw-reservation-summary strong {
	font-family: var(--csw-font-heading);
	font-size: 1.25rem;
}

.csw-reservation-summary p {
	margin: var(--csw-space-1) 0 0;
	color: var(--csw-color-text-muted);
}

@media (max-width: 61.999rem) {
	.csw-agency-benefit-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.csw-agency-form-aside {
		position: static;
	}
}

@media (max-width: 47.999rem) {
	.csw-agency-benefit-grid,
	.csw-agency-process-grid,
	.csw-booking-route-grid,
	.csw-agency-form-layout,
	.csw-reservation-layout,
	.csw-direct-booking-grid,
	.csw-form-grid {
		grid-template-columns: 1fr;
	}

	.csw-form-group-full {
		grid-column: auto;
	}

	.csw-booking-route-body .csw-actions,
	.csw-agency-confirmation .csw-actions {
		width: 100%;
	}

	.csw-booking-route-body .csw-btn,
	.csw-agency-confirmation .csw-btn {
		width: 100%;
	}
}

@media (max-width: 29.999rem) {
	.csw-agency-benefit-card,
	.csw-agency-process-grid li,
	.csw-dynamic-form-group,
	.csw-booking-contact-card,
	.csw-reservation-summary {
		padding: 1.25rem;
	}
}

/* ==========================================================
   FASE HTML/CSS 6.1 — ANIMACIONES Y MICROINTERACCIONES GLOBALES
   ========================================================== */

/* Entrada del hero y medios principales */
html.csw-js .csw-hero-image,
html.csw-js .csw-inner-hero .csw-media-image {
	animation: csw-media-settle 900ms var(--csw-ease-out) both;
}

@keyframes csw-media-settle {
	from {
		opacity: 0.88;
		transform: scale(1.025);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

/* Aparición escalonada y paneles flotantes */
html.csw-js .csw-cultural-panel[data-csw-reveal],
html.csw-js .csw-cultural-feature-panel[data-csw-reveal],
html.csw-js .csw-experience-community-panel[data-csw-reveal],
html.csw-js .csw-cultural-community-panel[data-csw-reveal] {
	transition-duration: var(--csw-motion-slow);
	transition-timing-function: var(--csw-ease-out);
}

.csw-cultural-panel,
.csw-cultural-feature-panel,
.csw-experience-community-panel,
.csw-cultural-community-panel,
.csw-room-featured-panel {
	transition:
	box-shadow var(--csw-motion-fast) var(--csw-ease-standard),
	border-color var(--csw-motion-fast) var(--csw-ease-standard);
}

/* Movimiento sutil de imágenes */
.csw-home-media .csw-media-image,
.csw-room-featured .csw-media-image,
.csw-room-compact .csw-media-image,
.csw-cultural-media .csw-media-image,
.csw-experience-card .csw-media-image,
.csw-community-media .csw-media-image,
.csw-inner-media .csw-media-image,
.csw-room-showcase .csw-media-image,
.csw-cultural-feature-media .csw-media-image,
.csw-experience-detail-card .csw-media-image,
.csw-experience-community-media .csw-media-image,
.csw-gallery-main-image,
.csw-gallery-thumb .csw-media-image,
.csw-transport-card .csw-media-image,
.csw-booking-route-card .csw-media-image,
.csw-page-cta .csw-media-image {
	transform: scale(1);
	transition:
	transform var(--csw-motion-slow) var(--csw-ease-out),
	filter var(--csw-motion-fast) var(--csw-ease-standard);
}

/* Tarjetas y superficies interactivas */
.csw-room-compact,
.csw-experience-card,
.csw-arrival-card,
.csw-booking-card,
.csw-room-showcase,
.csw-experience-detail-card,
.csw-transport-card,
.csw-inclusion-card,
.csw-agency-benefit-card,
.csw-agency-process-grid li,
.csw-booking-route-card,
.csw-booking-contact-card,
.csw-arrival-contact-card,
.csw-dossier-card,
.csw-gallery-thumb {
	transition:
	transform var(--csw-motion-fast) var(--csw-ease-out),
	box-shadow var(--csw-motion-fast) var(--csw-ease-standard),
	border-color var(--csw-motion-fast) var(--csw-ease-standard),
	background-color var(--csw-motion-fast) var(--csw-ease-standard);
}

.csw-feature-icon,
.csw-agency-benefit-icon,
.csw-booking-route-icon,
.csw-confirmation-icon,
.csw-dossier-icon,
.csw-reservation-summary-icon,
.csw-route-number,
.csw-cultural-route-number {
	transition:
	transform var(--csw-motion-fast) var(--csw-ease-out),
	box-shadow var(--csw-motion-fast) var(--csw-ease-standard),
	background-color var(--csw-motion-fast) var(--csw-ease-standard);
}

/* Logo */
.csw-site-logo img,
.csw-footer-logo img {
	transition: transform var(--csw-motion-fast) var(--csw-ease-out);
}

/* Botones */
.csw-btn {
	transition:
	background-color var(--csw-motion-fast) var(--csw-ease-standard),
	border-color var(--csw-motion-fast) var(--csw-ease-standard),
	color var(--csw-motion-fast) var(--csw-ease-standard),
	transform var(--csw-motion-fast) var(--csw-ease-out),
	box-shadow var(--csw-motion-fast) var(--csw-ease-standard);
}

.csw-btn:active {
	transform: translateY(0) scale(0.985);
}

.csw-btn:focus-visible {
	box-shadow:
	0 0 0 0.25rem rgba(237, 45, 136, 0.16),
	var(--csw-shadow-sm);
}

/* Enlaces */
.csw-text-link {
	position: relative;
}

.csw-text-link::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -0.15rem;
	left: 0;
	height: 0.125rem;
	border-radius: 999px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--csw-motion-fast) var(--csw-ease-out);
}

.csw-text-link:hover::after,
.csw-text-link:focus-visible::after {
	transform: scaleX(1);
}

.csw-footer-nav a,
.csw-footer-contact a,
.csw-agency-direct-contact a,
.csw-arrival-contact-card address a,
.csw-booking-contact a {
	transition:
	color var(--csw-motion-fast) var(--csw-ease-standard),
	transform var(--csw-motion-fast) var(--csw-ease-out);
}

/* Líneas y detalles decorativos observados por JavaScript */
.csw-motion-line::before {
	opacity: 0;
	transition:
	opacity var(--csw-motion-medium) var(--csw-ease-standard),
	clip-path var(--csw-motion-slow) var(--csw-ease-out);
}

.csw-motion-line-horizontal::before {
	clip-path: inset(0 100% 0 0);
}

.csw-motion-line-vertical::before,
.csw-motion-accent::before {
	clip-path: inset(0 0 100% 0);
}

.csw-motion-line.csw-motion-visible::before,
.csw-motion-accent.csw-motion-visible::before {
	opacity: 1;
	clip-path: inset(0);
}

.csw-route-map-path {
	transform: rotate(-8deg) scaleX(0);
	transform-origin: left center;
	transition: transform var(--csw-motion-slow) var(--csw-ease-out);
}

.csw-route-map.csw-motion-visible .csw-route-map-path {
	transform: rotate(-8deg) scaleX(1);
}

.csw-route-map-stop {
	opacity: 0;
	transform: translateY(0.6rem);
	transition:
	opacity var(--csw-motion-medium) var(--csw-ease-out),
	transform var(--csw-motion-medium) var(--csw-ease-out);
}

.csw-route-map.csw-motion-visible .csw-route-map-stop {
	opacity: 1;
	transform: translateY(0);
}

.csw-route-map.csw-motion-visible .csw-route-map-stop-puno {
	transition-delay: 120ms;
}

.csw-route-map.csw-motion-visible .csw-route-map-stop-chucuito {
	transition-delay: 220ms;
}

.csw-route-map.csw-motion-visible .csw-route-map-stop-luquina {
	transition-delay: 320ms;
}

/* Formularios y estados */
.csw-form-label {
	transition:
	color var(--csw-motion-fast) var(--csw-ease-standard),
	transform var(--csw-motion-fast) var(--csw-ease-out);
}

.csw-form-group:focus-within .csw-form-label {
	color: var(--csw-color-primary);
	transform: translateY(-0.08rem);
}

.csw-input-field,
.csw-select-field {
	transition:
	border-color var(--csw-motion-fast) var(--csw-ease-standard),
	box-shadow var(--csw-motion-fast) var(--csw-ease-standard),
	background-color var(--csw-motion-fast) var(--csw-ease-standard),
	transform var(--csw-motion-fast) var(--csw-ease-out);
}

.csw-input-field:focus,
.csw-select-field:focus {
	transform: translateY(-0.08rem);
}

.csw-consent-field {
	transition:
	border-color var(--csw-motion-fast) var(--csw-ease-standard),
	background-color var(--csw-motion-fast) var(--csw-ease-standard),
	box-shadow var(--csw-motion-fast) var(--csw-ease-standard);
}

.csw-consent-field:focus-within,
.csw-consent-field:has(input:checked) {
	border-color: rgba(237, 45, 136, 0.42);
	background: rgba(237, 45, 136, 0.045);
	box-shadow: 0 0 0 0.2rem rgba(237, 45, 136, 0.08);
}

.csw-dynamic-form-group:not([hidden]),
.csw-agency-confirmation:not([hidden]),
.csw-dossier-demo:not([hidden]) {
	animation: csw-state-enter 460ms var(--csw-ease-out) both;
}

.csw-form-status:not(:empty),
.csw-dossier-status:not(:empty) {
	animation: csw-status-enter 300ms var(--csw-ease-out) both;
}

@keyframes csw-state-enter {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes csw-status-enter {
	from {
		opacity: 0;
		transform: translateY(0.25rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Estados activos y seleccionados */
.csw-gallery-thumb[aria-pressed="true"] {
	box-shadow: var(--csw-shadow-md);
	transform: translateY(-0.18rem);
}

.csw-gallery-thumb[aria-pressed="true"] .csw-media-image {
	transform: scale(1.025);
}

.csw-menu-link[aria-current="page"]::after,
.csw-mobile-menu a[aria-current="page"]::after {
	transform: scaleX(1);
}

/* Interacciones solo donde existe puntero preciso */
@media (hover: hover) and (pointer: fine) {
	.csw-home-media:hover .csw-media-image,
	.csw-room-featured:hover .csw-media-image,
	.csw-room-compact:hover .csw-media-image,
	.csw-cultural-media:hover .csw-media-image,
	.csw-experience-card:hover .csw-media-image,
	.csw-community-media:hover .csw-media-image,
	.csw-inner-media:hover .csw-media-image,
	.csw-room-showcase:hover .csw-media-image,
	.csw-cultural-feature-media:hover .csw-media-image,
	.csw-experience-detail-card:hover .csw-media-image,
	.csw-experience-community-media:hover .csw-media-image,
	.csw-gallery-main:hover .csw-gallery-main-image,
	.csw-gallery-thumb:hover .csw-media-image,
	.csw-transport-card:hover .csw-media-image,
	.csw-booking-route-card:hover .csw-media-image,
	.csw-page-cta:hover .csw-media-image {
		transform: scale(1.035);
	}

	.csw-room-compact:hover,
	.csw-experience-card:hover,
	.csw-arrival-card:hover,
	.csw-booking-card:hover,
	.csw-room-showcase:hover,
	.csw-experience-detail-card:hover,
	.csw-transport-card:hover,
	.csw-inclusion-card:hover,
	.csw-agency-benefit-card:hover,
	.csw-agency-process-grid li:hover,
	.csw-booking-route-card:hover,
	.csw-arrival-contact-card:hover,
	.csw-dossier-card:hover {
		border-color: rgba(237, 45, 136, 0.28);
		box-shadow: var(--csw-shadow-md);
		transform: translateY(-0.3rem);
	}

	.csw-booking-contact-card[href]:hover,
	.csw-gallery-thumb:hover {
		transform: translateY(-0.22rem);
	}

	.csw-cultural-panel:hover,
	.csw-cultural-feature-panel:hover,
	.csw-experience-community-panel:hover,
	.csw-cultural-community-panel:hover,
	.csw-room-featured-panel:hover {
		border-color: rgba(237, 45, 136, 0.24);
		box-shadow: var(--csw-shadow-md);
	}

	.csw-btn:hover {
		transform: translateY(-0.18rem);
		box-shadow: 0 0.75rem 1.6rem rgba(33, 29, 31, 0.15);
	}

	.csw-footer-nav a:hover,
	.csw-footer-contact a:hover,
	.csw-agency-direct-contact a:hover,
	.csw-arrival-contact-card address a:hover,
	.csw-booking-contact a:hover {
		transform: translateX(0.18rem);
	}

	.csw-site-logo:hover img,
	.csw-footer-logo:hover img {
		transform: scale(1.025);
	}

	.csw-feature-item:hover .csw-feature-icon,
	.csw-agency-benefit-card:hover .csw-agency-benefit-icon,
	.csw-booking-route-card:hover .csw-booking-route-icon,
	.csw-route-step:hover .csw-route-number,
	.csw-cultural-route li:hover .csw-cultural-route-number {
		transform: translateY(-0.15rem) scale(1.035);
		box-shadow: 0 0.5rem 1.2rem rgba(33, 29, 31, 0.12);
	}
}

@media (max-width: 61.999rem) {
	.csw-motion-line-horizontal::before {
		clip-path: inset(0 0 100% 0);
	}
}

@media (max-width: 47.999rem) {
	html.csw-js [data-csw-reveal="up"].csw-reveal-ready {
		--csw-reveal-y: 3.25rem;
	}

	html.csw-js [data-csw-reveal="left"].csw-reveal-ready {
		--csw-reveal-x: -3.25rem;
	}

	html.csw-js [data-csw-reveal="right"].csw-reveal-ready {
		--csw-reveal-x: 3.25rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	html.csw-js .csw-hero-image,
	html.csw-js .csw-inner-hero .csw-media-image,
	.csw-dynamic-form-group:not([hidden]),
	.csw-agency-confirmation:not([hidden]),
	.csw-dossier-demo:not([hidden]),
	.csw-form-status:not(:empty),
	.csw-dossier-status:not(:empty) {
		animation: none;
	}

	html.csw-js [data-csw-reveal],
	html.csw-js [data-csw-reveal].csw-reveal-ready,
	html.csw-js [data-csw-reveal].csw-reveal-visible,
	html.csw-js [data-csw-reveal].csw-reveal-complete {
		opacity: 1;
		translate: none;
		scale: 1;
		transition: none;
	}

	.csw-motion-line::before,
	.csw-motion-accent::before {
		opacity: 1;
		clip-path: inset(0);
		transition: none;
	}

	.csw-route-map-path,
	.csw-route-map.csw-motion-visible .csw-route-map-path {
		transform: rotate(-8deg) scaleX(1);
		transition: none;
	}

	.csw-route-map-stop,
	.csw-route-map.csw-motion-visible .csw-route-map-stop {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.csw-btn:hover,
	.csw-room-compact:hover,
	.csw-experience-card:hover,
	.csw-arrival-card:hover,
	.csw-booking-card:hover,
	.csw-room-showcase:hover,
	.csw-experience-detail-card:hover,
	.csw-transport-card:hover,
	.csw-inclusion-card:hover,
	.csw-agency-benefit-card:hover,
	.csw-agency-process-grid li:hover,
	.csw-booking-route-card:hover,
	.csw-booking-contact-card[href]:hover,
	.csw-arrival-contact-card:hover,
	.csw-dossier-card:hover,
	.csw-gallery-thumb:hover,
	.csw-gallery-thumb[aria-pressed="true"],
	.csw-form-group:focus-within .csw-form-label,
	.csw-input-field:focus,
	.csw-select-field:focus,
	.csw-footer-nav a:hover,
	.csw-footer-contact a:hover,
	.csw-agency-direct-contact a:hover,
	.csw-arrival-contact-card address a:hover,
	.csw-booking-contact a:hover,
	.csw-site-logo:hover img,
	.csw-footer-logo:hover img,
	.csw-feature-item:hover .csw-feature-icon,
	.csw-agency-benefit-card:hover .csw-agency-benefit-icon,
	.csw-booking-route-card:hover .csw-booking-route-icon,
	.csw-route-step:hover .csw-route-number,
	.csw-cultural-route li:hover .csw-cultural-route-number {
		transform: none;
	}

	.csw-home-media:hover .csw-media-image,
	.csw-room-featured:hover .csw-media-image,
	.csw-room-compact:hover .csw-media-image,
	.csw-cultural-media:hover .csw-media-image,
	.csw-experience-card:hover .csw-media-image,
	.csw-community-media:hover .csw-media-image,
	.csw-inner-media:hover .csw-media-image,
	.csw-room-showcase:hover .csw-media-image,
	.csw-cultural-feature-media:hover .csw-media-image,
	.csw-experience-detail-card:hover .csw-media-image,
	.csw-experience-community-media:hover .csw-media-image,
	.csw-gallery-main:hover .csw-gallery-main-image,
	.csw-gallery-thumb:hover .csw-media-image,
	.csw-gallery-thumb[aria-pressed="true"] .csw-media-image,
	.csw-transport-card:hover .csw-media-image,
	.csw-booking-route-card:hover .csw-media-image,
	.csw-page-cta:hover .csw-media-image {
		transform: none;
	}
}


/* ==========================================================
   CARRITO FRONTEND — DEMOSTRACIÓN FUNCIONAL
   ========================================================== */

   body.csw-cart-open {
   	position: fixed;
   	right: 0;
   	left: 0;
   	width: 100%;
   	overflow: hidden;
   	padding-right: var(--csw-cart-scrollbar-compensation, 0);
   }

   .csw-cart-toggle {
   	position: relative;
   	display: inline-flex;
   	min-height: 2.75rem;
   	align-items: center;
   	justify-content: center;
   	gap: 0.45rem;
   	padding: 0.55rem 0.8rem;
   	border: 0.0625rem solid rgba(255, 255, 255, 0.58);
   	border-radius: var(--csw-radius-pill);
   	background: rgba(33, 29, 31, 0.22);
   	color: var(--csw-color-white);
   	font-family: var(--csw-font-heading);
   	font-size: 0.95rem;
   	font-weight: 700;
   	line-height: 1;
   	cursor: pointer;
   	transition: background var(--csw-transition), border-color var(--csw-transition), color var(--csw-transition), transform var(--csw-transition), box-shadow var(--csw-transition);
   }

   .csw-cart-toggle:hover {
   	background: rgba(33, 29, 31, 0.38);
   	transform: translateY(-0.125rem);
   }

   .csw-cart-toggle:focus-visible,
   .csw-cart-close:focus-visible,
   .csw-cart-quantity-button:focus-visible,
   .csw-cart-remove:focus-visible {
   	outline: 0.1875rem solid var(--csw-color-warning);
   	outline-offset: 0.1875rem;
   }

   .csw-cart-toggle-icon,
   .csw-cart-toggle-icon .csw-cart-icon {
   	width: 1.25rem;
   	height: 1.25rem;
   	flex: 0 0 1.25rem;
   }

   .csw-cart-icon {
   	fill: none;
   	stroke: currentColor;
   	stroke-width: 1.8;
   	stroke-linecap: round;
   	stroke-linejoin: round;
   }

   .csw-cart-count {
   	display: inline-flex;
   	min-width: 1.35rem;
   	height: 1.35rem;
   	align-items: center;
   	justify-content: center;
   	padding-inline: 0.25rem;
   	border-radius: 999px;
   	background: var(--csw-color-warning);
   	color: var(--csw-color-dark);
   	font-family: var(--csw-font-heading);
   	font-size: 0.75rem;
   	font-weight: 800;
   	line-height: 1;
   }

   .csw-cart-count[data-csw-cart-empty-count="true"] {
   	display: none;
   }

   .csw-header-scrolled .csw-cart-toggle {
   	border-color: var(--csw-color-border);
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   }

   .csw-cart-toggle-mobile {
   	width: 100%;
   	border-color: var(--csw-color-border);
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   }

   .csw-cart-layer {
   	position: fixed;
   	inset: 0;
   	z-index: 1600;
   	display: grid;
   	grid-template-columns: minmax(0, 1fr) minmax(22rem, 32rem);
   	visibility: hidden;
   	opacity: 0;
   	overflow-y: auto;
   	transition: visibility var(--csw-motion-fast), opacity var(--csw-motion-fast) ease;
   }

   .csw-cart-layer[hidden] {
   	display: none;
   }

   .csw-cart-layer.csw-cart-layer-open {
   	visibility: visible;
   	opacity: 1;
   }

   .csw-cart-backdrop {
   	border: 0;
   	background: rgba(33, 29, 31, 0.62);
   	-webkit-backdrop-filter: blur(0.2rem);
   	backdrop-filter: blur(0.2rem);
   	cursor: pointer;
   }

   .csw-cart-drawer {
   	display: flex;
   	width: min(100%, 32rem);
   	height: 100%;
   	min-width: 0;
   	flex-direction: column;
   	justify-self: end;
   	background: var(--csw-color-white);
   	box-shadow: -1rem 0 3rem rgba(33, 29, 31, 0.2);
   	transform: translateX(100%);
   	transition: transform var(--csw-motion-fast) var(--csw-ease-out);
   }

   .csw-cart-layer-open .csw-cart-drawer {
   	transform: translateX(0);
   }

   .csw-cart-header {
   	display: flex;
   	align-items: flex-start;
   	justify-content: space-between;
   	gap: var(--csw-space-4);
   	padding: clamp(1.25rem, 4vw, 2rem);
   	border-bottom: 0.0625rem solid var(--csw-color-border);
   }

   .csw-cart-kicker {
   	margin: 0 0 var(--csw-space-1);
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-xs);
   	font-weight: 700;
   	letter-spacing: 0.12em;
   	text-transform: uppercase;
   }

   .csw-cart-title {
   	margin: 0;
   	font-size: clamp(2rem, 6vw, 2.75rem);
   }

   .csw-cart-close {
   	display: inline-flex;
   	width: 2.75rem;
   	height: 2.75rem;
   	flex: 0 0 2.75rem;
   	align-items: center;
   	justify-content: center;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: 50%;
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   	cursor: pointer;
   }

   .csw-cart-close .csw-icon {
   	width: 1.3rem;
   	height: 1.3rem;
   }

   .csw-cart-content {
   	display: flex;
   	min-height: 0;
   	flex: 1;
   	flex-direction: column;
   	overflow-y: auto;
   }

   .csw-cart-empty {
   	display: grid;
   	place-items: center;
   	min-height: 100%;
   	padding: clamp(2rem, 7vw, 4rem) clamp(1.25rem, 5vw, 2rem);
   	text-align: center;
   }

   .csw-cart-empty[hidden] {
   	display: none;
   }

   .csw-cart-empty-icon {
   	display: inline-flex;
   	width: 4.5rem;
   	height: 4.5rem;
   	align-items: center;
   	justify-content: center;
   	margin-bottom: var(--csw-space-4);
   	border-radius: 50%;
   	background: rgba(237, 45, 136, 0.1);
   	color: var(--csw-color-primary);
   }

   .csw-cart-empty-icon .csw-cart-icon {
   	width: 2.2rem;
   	height: 2.2rem;
   }

   .csw-cart-empty h3 {
   	margin-bottom: var(--csw-space-2);
   	font-size: 1.9rem;
   }

   .csw-cart-empty p {
   	max-width: 25rem;
   	margin: 0 0 var(--csw-space-5);
   	color: var(--csw-color-text-muted);
   }

   .csw-cart-items {
   	display: grid;
   	gap: var(--csw-space-4);
   	padding: clamp(1rem, 4vw, 1.5rem);
   }

   .csw-cart-item {
   	display: grid;
   	grid-template-columns: 5rem minmax(0, 1fr);
   	gap: var(--csw-space-4);
   	padding: var(--csw-space-4);
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-white);
   	box-shadow: var(--csw-shadow-sm);
   	transition: border-color var(--csw-transition), box-shadow var(--csw-transition), opacity var(--csw-transition), transform var(--csw-transition);
   }

   .csw-cart-item.csw-cart-item-updated {
   	border-color: rgba(237, 45, 136, 0.55);
   	box-shadow: 0 0 0 0.1875rem rgba(237, 45, 136, 0.1), var(--csw-shadow-sm);
   }

   .csw-cart-item-image {
   	width: 5rem;
   	height: 5rem;
   	border-radius: var(--csw-radius-sm);
   	object-fit: cover;
   }

   .csw-cart-item-body {
   	min-width: 0;
   }

   .csw-cart-item-type {
   	margin: 0 0 0.15rem;
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: var(--csw-font-size-xs);
   	font-weight: 700;
   	letter-spacing: 0.08em;
   	text-transform: uppercase;
   }

   .csw-cart-item-name {
   	margin: 0;
   	font-size: 1.35rem;
   	overflow-wrap: anywhere;
   }

   .csw-cart-item-price {
   	margin: 0.3rem 0 0;
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   }

   .csw-cart-item-controls {
   	grid-column: 1 / -1;
   	display: flex;
   	align-items: center;
   	justify-content: space-between;
   	gap: var(--csw-space-3);
   	padding-top: var(--csw-space-3);
   	border-top: 0.0625rem solid var(--csw-color-border);
   }

   .csw-cart-quantity-wrap {
   	display: flex;
   	min-width: 0;
   	align-items: center;
   	gap: var(--csw-space-2);
   }

   .csw-cart-quantity-label {
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-xs);
   }

   .csw-cart-quantity-control {
   	display: inline-flex;
   	align-items: center;
   	border: 0.0625rem solid var(--csw-color-border);
   	border-radius: var(--csw-radius-pill);
   	overflow: hidden;
   }

   .csw-cart-quantity-button {
   	display: inline-flex;
   	width: 2.4rem;
   	height: 2.4rem;
   	align-items: center;
   	justify-content: center;
   	border: 0;
   	background: var(--csw-color-bg-light);
   	color: var(--csw-color-dark);
   	font-size: 1.25rem;
   	font-weight: 700;
   	cursor: pointer;
   }

   .csw-cart-quantity-button:disabled {
   	cursor: not-allowed;
   	opacity: 0.4;
   }

   .csw-cart-quantity-value {
   	display: inline-flex;
   	min-width: 2.2rem;
   	align-items: center;
   	justify-content: center;
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   }

   .csw-cart-remove {
   	border: 0;
   	background: transparent;
   	color: var(--csw-color-danger);
   	font-family: var(--csw-font-heading);
   	font-weight: 700;
   	cursor: pointer;
   	text-decoration: underline;
   	text-underline-offset: 0.18rem;
   }

   .csw-cart-summary {
   	margin-top: auto;
   	padding: clamp(1.25rem, 4vw, 2rem);
   	border-top: 0.0625rem solid var(--csw-color-border);
   	background: var(--csw-color-bg-light);
   }

   .csw-cart-summary h3 {
   	margin-bottom: var(--csw-space-3);
   	font-size: 1.5rem;
   }

   .csw-cart-total-row,
   .csw-booking-cart-total {
   	display: flex;
   	align-items: baseline;
   	justify-content: space-between;
   	gap: var(--csw-space-4);
   }

   .csw-cart-total-row strong,
   .csw-booking-cart-total strong {
   	color: var(--csw-color-primary);
   	font-family: var(--csw-font-heading);
   	font-size: 1.65rem;
   }

   .csw-cart-quote-note {
   	margin: var(--csw-space-2) 0 0;
   	color: var(--csw-color-text-muted);
   	font-size: var(--csw-font-size-sm);
   }

   .csw-cart-actions {
   	display: grid;
   	gap: var(--csw-space-3);
   	margin-top: var(--csw-space-5);
   }

   .csw-cart-actions .csw-btn {
   	width: 100%;
   }

   .csw-cart-whatsapp-disabled {
   	pointer-events: none;
   	opacity: 0.5;
   }

   .csw-cart-toast {
   	position: fixed;
   	right: var(--csw-gutter);
   	bottom: var(--csw-gutter);
   	z-index: 1700;
   	max-width: min(24rem, calc(100vw - 2rem));
   	padding: 0.85rem 1.1rem;
   	border-radius: var(--csw-radius-md);
   	background: var(--csw-color-dark);
   	box-shadow: var(--csw-shadow-md);
   	color: var(--csw-color-white);
   	opacity: 0;
   	pointer-events: none;
   	transform: translateY(0.75rem);
   	transition: opacity var(--csw-transition), transform var(--csw-transition);
   }

   .csw-cart-toast:not(:empty) {
   	opacity: 1;
   	transform: translateY(0);
   }

   .csw-cart-inline-actions {
   	margin-top: var(--csw-space-4);
   }

   .csw-cart-add {
   	white-space: normal;
   }

/* Resumen del carrito en Reservar */
.csw-booking-cart-section {
	background: linear-gradient(135deg, rgba(35, 172, 226, 0.06), rgba(237, 45, 136, 0.06));
}

.csw-booking-cart-shell {
	padding: clamp(1.25rem, 4vw, 2rem);
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-lg);
	background: var(--csw-color-white);
	box-shadow: var(--csw-shadow-sm);
}

.csw-booking-cart-empty {
	padding: var(--csw-space-5);
	text-align: center;
}

.csw-booking-cart-empty[hidden] {
	display: none;
}

.csw-booking-cart-empty h3 {
	margin-bottom: var(--csw-space-2);
}

.csw-booking-cart-empty p {
	margin: 0 0 var(--csw-space-4);
	color: var(--csw-color-text-muted);
}

.csw-booking-cart-items {
	display: grid;
	gap: var(--csw-space-3);
}

.csw-booking-cart-line {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--csw-space-3);
	padding: var(--csw-space-4);
	border-bottom: 0.0625rem solid var(--csw-color-border);
}

.csw-booking-cart-line:last-child {
	border-bottom: 0;
}

.csw-booking-cart-line strong,
.csw-booking-cart-line span {
	overflow-wrap: anywhere;
}

.csw-booking-cart-line small {
	grid-column: 1 / -1;
	color: var(--csw-color-text-muted);
}

.csw-booking-cart-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--csw-space-5);
	margin-top: var(--csw-space-5);
	padding-top: var(--csw-space-5);
	border-top: 0.0625rem solid var(--csw-color-border);
}

.csw-booking-cart-footer .csw-actions {
	margin: 0;
}

@media (max-width: 74rem) {
	.csw-primary-menu {
		gap: 0.85rem;
	}

	.csw-cart-toggle-label {
		display: none;
	}
}

@media (max-width: 61.999rem) {
	.csw-cart-toggle:not(.csw-cart-toggle-mobile) {
		display: inline-flex;
	}
}

@media (max-width: 47.999rem) {
	.csw-header-actions {
		gap: var(--csw-space-2);
	}

	.csw-cart-toggle:not(.csw-cart-toggle-mobile) {
		width: 2.9rem;
		padding-inline: 0.55rem;
	}

	.csw-cart-layer {
		grid-template-columns: minmax(0, 1fr) minmax(19rem, calc(100% - 1rem));
	}

	.csw-cart-item {
		grid-template-columns: 4.25rem minmax(0, 1fr);
	}

	.csw-cart-item-image {
		width: 4.25rem;
		height: 4.25rem;
	}

	.csw-booking-cart-footer {
		align-items: stretch;
		flex-direction: column;
	}

	.csw-booking-cart-footer .csw-actions,
	.csw-booking-cart-footer .csw-btn {
		width: 100%;
	}
}

@media (max-width: 29.999rem) {
	.csw-cart-drawer {
		width: 100%;
	}

	.csw-cart-layer {
		grid-template-columns: 1fr;
	}

	.csw-cart-backdrop {
		display: none;
	}

	.csw-cart-item-controls {
		align-items: flex-start;
		flex-direction: column;
	}

	.csw-cart-remove {
		min-height: 2.5rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.csw-cart-layer,
	.csw-cart-drawer,
	.csw-cart-item,
	.csw-cart-toast,
	.csw-cart-toggle {
		transition: none;
	}

	.csw-cart-drawer,
	.csw-cart-layer-open .csw-cart-drawer,
	.csw-cart-toast,
	.csw-cart-toast:not(:empty) {
		transform: none;
	}
}

/* Correcciones de contenedor para el prototipo estático. */
.csw-container {
	width: min(calc(100% - (var(--csw-gutter) * 2)), var(--csw-container));
}

.csw-container-wide {
	width: min(calc(100% - (var(--csw-gutter) * 2)), var(--csw-container-wide));
}

.csw-container-narrow {
	width: min(calc(100% - (var(--csw-gutter) * 2)), var(--csw-container-narrow));
}

.csw-footer-logo {
	display: inline-flex;
}

.csw-footer-grid > *,
.csw-hero-inner > *,
.csw-mainbar-inner > * {
	min-width: 0;
}

.csw-cart-toggle-mobile .csw-cart-toggle-label {
	display: inline;
}

.csw-cart-empty-icon img {
	width: 2.2rem;
	height: 2.2rem;
}

/* ==========================================================
   SOCIAL NETWORKS — TOPBAR DROPDOWN AND FOOTER ICONS
   ========================================================== */

.csw-topbar-tools {
	gap: var(--csw-space-2);
}

.csw-social-dropdown {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
}

.csw-social-toggle {
	display: inline-flex;
	width: 2.5rem;
	height: 2.5rem;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: 50%;
	background: var(--csw-color-white);
	color: var(--csw-color-dark);
	box-shadow: none;
	transition:
		background-color var(--csw-transition),
		border-color var(--csw-transition),
		color var(--csw-transition),
		box-shadow var(--csw-transition);
}

.csw-social-toggle:hover,
.csw-social-toggle:focus-visible,
.csw-social-dropdown-open .csw-social-toggle {
	border-color: var(--csw-color-primary);
	background: var(--csw-color-bg-light);
	color: var(--csw-color-primary);
}

.csw-social-dropdown-open .csw-social-toggle {
	box-shadow: 0 0 0 0.2rem rgba(237, 45, 136, 0.12);
}

.csw-social-toggle-icon,
.csw-social-network-icon {
	display: block;
	width: 1.2rem;
	height: 1.2rem;
}

.csw-social-network-icon,
.csw-social-icon {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.csw-social-network-icon {
	stroke-width: 1.75;
}

.csw-social-menu {
	position: absolute;
	top: calc(100% + 0.5rem);
	right: 0;
	z-index: 20;
	width: min(14rem, calc(100vw - (var(--csw-gutter) * 2)));
	padding: 0.45rem;
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: var(--csw-radius-md);
	background: rgba(255, 255, 255, 0.98);
	box-shadow: var(--csw-shadow-md);
	-webkit-backdrop-filter: blur(0.75rem);
	backdrop-filter: blur(0.75rem);
}

html.csw-js .csw-social-menu {
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transform: translateY(-0.35rem);
	transition:
		opacity var(--csw-transition),
		transform var(--csw-transition),
		visibility var(--csw-transition);
}

html.csw-js .csw-social-dropdown-open .csw-social-menu {
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.csw-social-menu-list,
.csw-footer-socials-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.csw-social-menu-list {
	display: grid;
	gap: 0.15rem;
}

.csw-social-menu-link {
	display: flex;
	min-height: 2.75rem;
	align-items: center;
	gap: 0.75rem;
	padding: 0.55rem 0.75rem;
	border-radius: var(--csw-radius-sm);
	color: var(--csw-color-dark);
	font-family: var(--csw-font-heading);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition:
		background-color var(--csw-transition),
		color var(--csw-transition);
}

.csw-social-menu-link:hover,
.csw-social-menu-link:focus-visible {
	background: var(--csw-color-bg-light);
	color: var(--csw-color-primary);
}

.csw-social-icon {
	width: 1.25rem;
	height: 1.25rem;
	flex: 0 0 1.25rem;
	stroke-width: 1.7;
}

.csw-social-icon-dot {
	fill: currentColor;
	stroke: none;
}

.csw-footer-socials {
	margin-top: var(--csw-space-5);
	padding-top: var(--csw-space-4);
	border-top: 0.0625rem solid var(--csw-color-border);
}

.csw-footer-socials-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--csw-space-2);
}

.csw-footer-social-link {
	display: inline-flex;
	width: 2.625rem;
	height: 2.625rem;
	align-items: center;
	justify-content: center;
	border: 0.0625rem solid var(--csw-color-border);
	border-radius: 50%;
	background: var(--csw-color-white);
	color: var(--csw-color-text-muted);
	text-decoration: none;
	transition:
		background-color var(--csw-transition),
		border-color var(--csw-transition),
		color var(--csw-transition),
		transform var(--csw-transition);
}

.csw-footer-social-link:hover,
.csw-footer-social-link:focus-visible {
	border-color: var(--csw-color-primary);
	background: var(--csw-color-bg-light);
	color: var(--csw-color-primary);
	transform: translateY(-0.125rem);
}

.csw-no-js .csw-social-toggle {
	display: none;
}

.csw-no-js .csw-social-dropdown,
.csw-no-js .csw-social-menu {
	position: static;
}

.csw-no-js .csw-social-menu {
	width: auto;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.csw-no-js .csw-social-menu-list {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.csw-no-js .csw-social-menu-link {
	min-height: 2.25rem;
	padding: 0.4rem;
}

.csw-no-js .csw-social-menu-link span {
	display: none;
}

@media (max-width: 47.999rem) {
	.csw-topbar-tools {
		gap: 0.375rem;
	}

	.csw-social-toggle {
		width: 2.25rem;
		height: 2.25rem;
	}

	html.csw-js .csw-social-menu {
		position: fixed;
		top: 3rem;
		right: var(--csw-gutter);
		left: auto;
		width: 220px;
		max-height: calc(100dvh - 4rem);
		overflow-y: auto;
	}

	.csw-social-menu-link {
		min-height: 3rem;
	}
}

@media (max-width: 29.999rem) {
	.csw-footer-socials-list {
		gap: 0.375rem;
	}

	.csw-footer-social-link {
		width: 2.5rem;
		height: 2.5rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	html.csw-js .csw-social-menu,
	.csw-social-toggle,
	.csw-social-menu-link,
	.csw-footer-social-link {
		transition: none;
	}

	.csw-footer-social-link:hover,
	.csw-footer-social-link:focus-visible {
		transform: none;
	}
}