/**
 * Rumkata Store
 *
 * Estructura general del sitio y distribución de páginas.
 */


/* =========================================================
   1. GLOBAL
   ========================================================= */


/* =========================================================
   1.1 CONTENEDOR PRINCIPAL
   ========================================================= */

.rumkata-container {
	width: min(100% - 40px, 1200px);

	margin-inline: auto;
}


/* =========================================================
   1.2 ESTRUCTURA GENERAL
   ========================================================= */

.site {
	min-height: 100vh;

	display: flex;
	flex-direction: column;
}

.site-main {
	flex: 1;
}

.site-content {
	width: 100%;
}


/* =========================================================
   1.3 HEADER
   ========================================================= */

.site-header {
	position: fixed;

	top: 0;
	left: 0;

	width: 100%;
	height: 86px;

	z-index: 1000;
}


.site-header__inner {
	width: min(100% - 40px, 1400px);
	height: 86px;

	margin-inline: auto;

	display: grid;

	grid-template-columns:
		auto
		1fr
		auto;

	align-items: center;

	column-gap: 32px;
}


/* =========================================================
   LOGO
   ========================================================= */

.site-header__branding {
	display: flex;
	align-items: center;

	flex-shrink: 0;
}


.site-header .custom-logo-link {
	display: flex;
	align-items: center;
}


.site-header .custom-logo {
	display: block;

	width: 82.61px;
	height: 67.7px;
	max-width: none;

	object-fit: contain;
}


/* =========================================================
   NAVEGACIÓN
   ========================================================= */

.site-header__navigation {
	display: flex;
	align-items: center;
	justify-content: center;

	min-width: 0;
}


.rumkata-primary-menu {
	display: flex;
	align-items: center;

	gap: 32px;

	margin: 0;
	padding: 0;
}


.rumkata-primary-menu li {
	margin: 0;
}


.rumkata-primary-menu a {
	display: inline-flex;
	align-items: center;

	min-height: 44px;
}


/* =========================================================
   ACCIONES
   ========================================================= */

.site-header__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;

	gap: 18px;

	min-width: max-content;
}


/* =========================================================
   SELECTOR DE IDIOMA
   ========================================================= */

.site-header__language {
	display: inline-flex;
	align-items: center;

	gap: 7px;

	flex-shrink: 0;
}


.site-header__language-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 34px;
}


.site-header__language-separator {
	flex-shrink: 0;
}


/* =========================================================
   RESERVA
   ========================================================= */

.site-header__reserve {
	flex-shrink: 0;
}


/* =========================================================
   CARRITO
   ========================================================= */

.site-header__cart {
	flex-shrink: 0;
}



/* =========================================================
   1.4 FOOTER
   ========================================================= */

.site-footer {
	width: 100%;

	margin-top: auto;
}

.site-footer__grid {
	min-height: 190px;

	display: grid;

	grid-template-columns:
		minmax(160px, 1fr)
		minmax(180px, 1fr)
		minmax(300px, 1.4fr);

	align-items: center;

	column-gap: 48px;
}

.site-footer__branding,
.site-footer__navigation,
.site-footer__contact {
	min-width: 0;
}


/* Logo */

.site-footer .custom-logo-link {
	display: inline-flex;
	align-items: center;
}

.site-footer .custom-logo {
	display: block;

	width: 82.61px;
	height: 67.7px;
	max-width: none;

	object-fit: contain;
}


/* Navegación */

.site-footer__navigation {
	padding-left: 48px;
}

.site-footer .site-footer__navigation {
	display: block;
}

.site-footer .site-footer__menu {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;

	gap: 8px;

	margin: 0;
	padding: 0;

}

.site-footer .site-footer__menu > li {
	display: block;

	width: auto;

	margin: 0;
	padding: 0;
}

.site-footer .site-footer__menu > li > a {
	display: block;

	min-height: 0;

	margin: 0;
	padding: 0;
}


/* Contacto */

.site-footer__contact {
	position: relative;

	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 40px;

	padding-left: 48px;
}

.site-footer__contact::before {
	position: absolute;

	left: 0;
	top: 50%;

	width: 1px;
	height: 116px;

	transform: translateY(-50%);
}


/* Teléfono */

.site-footer__phone {
	display: inline-flex;
	align-items: center;

	gap: 10px;

	white-space: nowrap;
}

.site-footer__phone-icon {
	display: block;

	width: 24px;
	height: 24px;

	flex: 0 0 24px;
}


/* Redes sociales */

.site-footer__social {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.site-footer__social-title {
	margin: 0 0 10px;
}

.site-footer__social-links {
	display: flex;
	align-items: center;

	gap: 16px;
}

.site-footer__social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	margin: 0;
	padding: 0;
}

.site-footer__social-icon {
	display: block;

	width: 30px;
	height: 30px;

	object-fit: contain;
}


/* Footer inferior */

.site-footer__bottom {
	min-height: 62.26px;

	display: flex;
	align-items: center;
}

.site-footer__bottom .rumkata-container {
	width: min(100% - 40px, 1200px);

	margin-inline: auto;
}


/* Copyright */

.site-footer__copyright {
	margin: 0;

	padding: 14px 0;
}

/* =========================================================
   FOOTER — FRANJA LEGAL
   ========================================================= */

.site-footer__bottom-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: clamp(20px, 3vw, 40px);
}

.site-footer__legal {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 8px 18px;
}


/* =========================================================
   2. PÁGINA CONTACTO
   ========================================================= */


/* =========================================================
   2.1 INTRO
   ========================================================= */

.contact-intro {
	min-height: 100vh;
	min-height: 100dvh;

	padding-top: calc(86px + 120px);
	padding-bottom: 60px;
}

.contact-intro__title span {
	display: block;
}

.contact-intro__text {
	max-width: 720px;

	margin: 52px 0 0;
}


/* =========================================================
   2.2 MÉTODOS DE CONTACTO
   ========================================================= */

.contact-methods {
	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	padding: 40px 0 120px;
}

.contact-methods__title {
	margin-bottom: 130px;
}

.contact-methods__list {
	width: 100%;
	max-width: 1120px;

	margin-left: auto;
	margin-right: 0;
}


/* Cada método */

.contact-method {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		auto;

	grid-template-rows:
		auto
		auto
		auto;

	column-gap: 80px;
	row-gap: 8px;

	align-items: center;

	min-height: 190px;

	padding: 34px 0;
}


/* Icono + título */

.contact-method__heading {
	grid-column: 1;
	grid-row: 1;

	display: flex;
	align-items: center;

	gap: 16px;
}


/* Icono */

.contact-method__icon {
	display: block;

	width: 28px;
	height: 28px;

	flex: 0 0 28px;

	object-fit: contain;
}


/* Nombre */

.contact-method__title {
	margin: 0;
}


/* Valor */

.contact-method__value {
	grid-column: 1;
	grid-row: 2;

	margin: 0;

}


/* Descripción */

.contact-method__description {
	grid-column: 1;
	grid-row: 3;

	margin: 0;
}


/* Acción */

.contact-method__action {
	grid-column: 2;
	grid-row: 1 / 4;

	align-self: center;
	justify-self: end;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 148px;
	min-height: 58px;

	padding: 0 22px;

	white-space: nowrap;
}


/* =========================================================
   2.3 UBICACIÓN Y DISPONIBILIDAD
   ========================================================= */

.contact-info {
	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	padding: 100px 0 110px;
}

.contact-info__grid {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		minmax(0, 1fr);

	gap: 100px;

	align-items: start;
}


/* Ubicación */

.contact-info__heading {
	display: flex;
	align-items: center;

	gap: 12px;

	margin-bottom: 38px;
}

.contact-info__title {
	margin: 0;
}

.contact-info__country {
	margin-bottom: 4px;
}

.contact-info__place {
	margin-bottom: 36px;
}

.contact-info__map {
	width: min(100%, 380px);

	margin-bottom: 36px;
}

.contact-info__map-image {
	display: block;

	width: 100%;
	height: auto;
}

.contact-info__note {
	max-width: 440px;

	margin-bottom: 0;
}

/* Disponibilidad */

.contact-info__title--availability {
	position: relative;

	display: flex;
	align-items: center;

	gap: 12px;
}

.contact-info__title--availability::before {
	display: block;

	width: 10px;
	height: 10px;

	flex: 0 0 10px;
}

.contact-info__schedule {
	margin: 0;
}

.contact-info__schedule-row {
	display: grid;

	grid-template-columns:
		1fr
		auto;

	gap: 30px;

	padding: 18px 0;
}

.contact-info__schedule-row dt,
.contact-info__schedule-row dd {
	margin: 0;
}


/* =========================================================
   2.4 FRASE FINAL
   ========================================================= */

.contact-quote {
	position: relative;

	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	display: flex;
	align-items: center;

	overflow: hidden;
}
.contact-quote__background,
.contact-quote__overlay {
	position: absolute;

	inset: 0;
}


/* Overlay */

.contact-quote__overlay {
	z-index: 0;
}


/* Imagen */

.contact-quote__background {
	z-index: 1;
}


/* Contenido */

.contact-quote__inner {
	position: relative;

	z-index: 2;

	width: 100%;

	display: flex;
	justify-content: center;
}

.contact-quote__text {
	width: min(100%, 1000px);

	margin: 0 auto;
}

.contact-quote__line {
	margin: 0;
}


/* Separador */

.contact-quote__divider {
	width: min(100%, 874px);

	margin: 72px auto 0;

	display: flex;
	align-items: center;
	justify-content: center;

	gap: 24px;
}

.contact-quote__divider-line {
	flex: 1;

	height: 1px;
}

.contact-quote__divider-diamonds {
	display: flex;
	align-items: center;

	gap: 14px;

	flex-shrink: 0;
}

.contact-quote__diamond {
	display: block;

	width: 7px;
	height: 7px;
}


/* Autor */

.contact-quote__author {
	margin-top: 40px;
}


/* =========================================================
   3. PÁGINA NOSOTROS
   ========================================================= */

.about-page {
	width: 100%;
}

/* =========================================================
   3.1 HERO
   ========================================================= */

.about-hero {
	position: relative;

	min-height: 100vh;
	min-height: 100dvh;

	display: flex;
	align-items: center;

	overflow: hidden;
}

.about-hero__background,
.about-hero__overlay {
	position: absolute;

	inset: 0;
}

.about-hero__inner {
	position: relative;

	z-index: 2;

	width: min(100% - 80px, 1400px);

	margin-inline: auto;

}

.about-hero__title {
	width: min(100%, 760px);

	margin: 0;
}

.about-hero__title-line {
	display: block;
}

/* =========================================================
   3.2 EL ORIGEN
   ========================================================= */

.about-story--origin {
	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	padding:
		clamp(70px, 6vw, 90px)
		0;

	display: flex;
	align-items: center;
}

.about-story--origin .about-story__grid {
	display: grid;

	grid-template-columns:
		minmax(0, 0.9fr)
		minmax(0, 1.1fr);

	align-items: center;

	gap: clamp(60px, 7vw, 110px);
}

.about-story--origin .about-story__media {
	position: relative;

	min-width: 0;
}

.about-story--origin .about-story__media--origin {
	width: min(100%, 470px);

	justify-self: start;
	align-self: center;
}

.about-story--origin .about-story__image--origin {
	display: block;

	width: 100%;
	height: auto;

	aspect-ratio: 4 / 5;

	object-fit: cover;
}

.about-story--origin .about-story__content {
	width: 100%;

	min-width: 0;

	align-self: center;
}

.about-story--origin .about-story__eyebrow {
	display: flex;
	align-items: center;

	gap: 14px;

	margin-bottom: clamp(34px, 4vw, 56px);
}

.about-story--origin .about-story__title {
	width: 100%;
	max-width: 700px;

	margin:
		0
		0
		clamp(34px, 4vw, 52px);
}

.about-story--origin .about-story__title > span {
	display: block;
	white-space: nowrap;
}

.about-story--origin .about-story__title-accent {
	display: inline;
}

.about-story--origin .about-story__body {
	width: min(100%, 620px);
}

.about-story--origin .about-story__body p {
	margin: 0;
}

.about-story--origin .about-story__body p + p {
	margin-top: 24px;
}

.about-story--origin .about-story__meta {
	margin:
		clamp(52px, 6vw, 86px)
		0
		0;
}

/* =========================================================
   3.3 EL OFICIO
   ========================================================= */

.about-story--craft {
	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	padding:
		clamp(70px, 6vw, 90px)
		0;

	display: flex;
	align-items: center;
}

.about-story--craft .about-story__grid--reverse {
	display: grid;

	grid-template-columns:
		minmax(0, 1.3fr)
		minmax(0, 0.7fr);

	align-items: center;

	gap: clamp(60px, 6vw, 100px);
}


/* Contenido */

.about-story--craft .about-story__content {
	width: 100%;
	max-width: 680px;

	min-width: 0;

	justify-self: start;
	align-self: center;

	display: flex;
	flex-direction: column;
	justify-content: center;
}

.about-story--craft .about-story__eyebrow {
	width: 100%;

	display: flex;
	align-items: center;

	gap: 14px;

	margin-bottom: clamp(34px, 4vw, 56px);
}

.about-story--craft .about-story__title {
	width: 100%;
	max-width: 680px;

	margin:
		0
		0
		clamp(34px, 4vw, 52px);
}

.about-story--craft .about-story__title > span {
	display: block;
	white-space: nowrap;
}

.about-story--craft .about-story__title-accent--craft {
	display: inline;
}

.about-story--craft .about-story__body {
	width: 100%;
	max-width: 580px;
}

.about-story--craft .about-story__body p {
	width: 100%;

	margin: 0;
}

.about-story--craft .about-story__body p + p {
	margin-top: 24px;
}

/* =========================================================
   3.4 EL EQUIPO
   ========================================================= */

.about-team {
	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	padding:
		clamp(70px, 6vw, 90px)
		0
		clamp(60px, 5vw, 80px);

	overflow: hidden;
}

.about-team__eyebrow {
	display: flex;
	align-items: center;

	gap: 14px;

	margin-bottom: clamp(28px, 3vw, 42px);
}

.about-team__intro {
	width: min(100%, 900px);

	margin-inline: auto;
}

.about-team__title {
	margin: 0;
}

.about-team__title span {
	display: block;
}

.about-team__description {
	width: min(100%, 620px);

	margin:
		clamp(20px, 2vw, 28px)
		auto
		0;
}


/* Tarjetas */

.about-team__cards {
	position: relative;

	width: min(92%, 1040px);

	margin:
		clamp(36px, 3.5vw, 52px)
		auto
		0;

	display: grid;

	grid-template-columns: 1fr;
	grid-template-rows: 1fr;

	align-items: center;
	justify-items: center;
}

.about-team__card {
	position: relative;

	grid-column: 1;
	grid-row: 1;

	width: 38%;

	min-width: 0;


	will-change:
		transform,
		opacity;
}

.about-team__card.is-left {
	z-index: 1;
}

.about-team__card.is-active {
	z-index: 3;
}

.about-team__card.is-right {
	z-index: 1;
}

.about-team__card-image {
	display: block;

	width: 100%;
	height: auto;

	object-fit: contain;
}

/* =========================================================
   3.5 NUESTROS VALORES
   ========================================================= */

.about-values {
	position: relative;

	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	display: flex;
	align-items: center;

	overflow: hidden;
}

.about-values__background,
.about-values__overlay {
	position: absolute;

	inset: 0;
}

.about-values__grid {
	position: relative;

	z-index: 2;

	display: grid;

	grid-template-columns:
		minmax(0, 0.9fr)
		minmax(0, 1.1fr);

	align-items: start;

	gap: clamp(70px, 8vw, 130px);

	padding-top: clamp(70px, 6vw, 90px);
	padding-bottom: clamp(70px, 6vw, 90px);
}

.about-values__heading {
	align-self: start;
}

.about-values__eyebrow {
	display: flex;
	align-items: center;

	gap: 14px;

	margin-bottom: clamp(24px, 2.5vw, 34px);
}

.about-values__title {
	margin: 0;
}

.about-values__title span {
	display: block;
}

.about-values__list {
	width: 100%;

	align-self: start;

	display: flex;
	flex-direction: column;

	gap: clamp(46px, 4vw, 62px);
}

.about-value {
	padding: 0;
}

.about-value__title,
.about-value__text {
	margin: 0;
}

.about-value__text {
	width: min(100%, 540px);

	margin-top: 14px;
}


/* =========================================================
   4. PÁGINA SABÍAS QUE
   ========================================================= */


/* =========================================================
   4.1 CONTENEDOR GENERAL
   ========================================================= */

.knowledge-page {
	width: 100%;
}


/* =========================================================
   4.2 INTRO
   ========================================================= */

.knowledge-intro {
	min-height: 100vh;
	min-height: 100dvh;

	padding:
		calc(86px + clamp(90px, 8vw, 130px))
		0
		clamp(70px, 6vw, 100px);

	display: flex;
	align-items: center;
}



.knowledge-intro__eyebrow {
	display: flex;
	align-items: center;

	gap: 18px;

	margin-bottom: 36px;
}

.knowledge-intro__eyebrow-line {
	display: block;

	width: 48px;
	height: 1px;

	flex: 0 0 48px;
}

.knowledge-intro__title {
	width: 100%;

	margin: 0;
}

.knowledge-intro__title span {
	display: inline;
}

.knowledge-intro__description {
	width: min(100%, 760px);

	margin:
		clamp(42px, 5vw, 70px)
		0
		0;
}

/* =========================================================
   4.3 NAVEGACIÓN INTERNA
   ========================================================= */

.knowledge-nav {
	position: sticky;

	top: 86px;

	z-index: 900;

	width: 100%;
}

.knowledge-nav__inner {
	display: grid;

	grid-template-columns:
		repeat(5, minmax(0, 1fr));

	align-items: stretch;
}

.knowledge-nav__link {
	position: relative;

	display: flex;
	align-items: center;
	justify-content: center;

	gap: 10px;

	min-width: 0;
	min-height: 68px;

	padding:
		0
		clamp(12px, 1.5vw, 24px);
}

.knowledge-nav__number,
.knowledge-nav__label {
	display: block;
}

.knowledge-nav__label {
	min-width: 0;
}


/* =========================================================
   4.4 CONFIGURACIÓN GENERAL DE TEMAS
   ========================================================= */

.knowledge-topic {
	position: relative;

	width: 100%;

	scroll-margin-top: 154px;
}

.knowledge-topic > .rumkata-container {
	width: min(100% - 40px, 1200px);

	margin-inline: auto;
}


/* =========================================================
   4.5 PRESENTACIÓN PRINCIPAL DE CADA TEMA
   ========================================================= */

.knowledge-topic__overview {
	min-height: calc(100vh - 154px);
	min-height: calc(100dvh - 154px);

	display: flex;
	flex-direction: column;
	justify-content: center;

	padding:
		clamp(70px, 6vw, 100px)
		0;
}


/* Cabecera */

.knowledge-topic__header {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.knowledge-topic__index {
	display: flex;
	align-items: center;

	gap: 16px;

	margin-bottom: 28px;
}

.knowledge-topic__index-line {
	display: block;

	width: 34px;
	height: 1px;

	flex: 0 0 34px;
}

.knowledge-topic__title {
	width: min(100%, 900px);

	margin: 0;
}


/* Contenido principal */

.knowledge-topic__feature {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		minmax(360px, 0.75fr);

	align-items: center;

	gap:
		clamp(70px, 8vw, 130px);

	flex: 1;

	padding-top:
		clamp(60px, 6vw, 90px);
}

.knowledge-topic__key-fact {
	width: min(100%, 700px);

	padding-left:
		clamp(24px, 2.5vw, 34px);
}

.knowledge-topic__key-label {
	display: block;

	margin-bottom: 24px;
}

.knowledge-topic__key-text {
	margin: 0;
}

.knowledge-topic__media {
	position: relative;

	width: min(100%, 470px);

	justify-self: end;

	overflow: hidden;
}

.knowledge-topic__image {
	display: block;

	width: 100%;
	height: auto;

	object-fit: contain;
}


/* =========================================================
   4.6 DETALLE INTERNO
   ========================================================= */

.knowledge-detail {
	padding:
		clamp(70px, 6vw, 100px)
		0
		clamp(80px, 7vw, 120px);
}

.knowledge-detail__heading {
	display: flex;
	align-items: center;

	gap: 20px;

	margin-bottom: 42px;
}

.knowledge-detail__heading::after {
	content: "";

	flex: 1;

	height: 1px;
}


/* =========================================================
   4.7 LÍNEA DE TIEMPO — RON
   ========================================================= */

.knowledge-timeline {
	width: 100%;
}

.knowledge-timeline__item {
	display: grid;

	grid-template-columns:
		minmax(90px, 120px)
		minmax(0, 1fr);

	align-items: start;

	gap: 28px;

	padding: 24px 0;
}

.knowledge-timeline__year {
	display: block;
}

.knowledge-timeline__text {
	margin: 0;
}


/* =========================================================
   4.8 TARJETAS
   ========================================================= */

.knowledge-cards {
	display: grid;

	width: 100%;
}

.knowledge-cards--two {
	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	gap: 24px;
}

.knowledge-cards--three {
	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap: 24px;
}

.knowledge-card {
	min-width: 0;

	padding:
		clamp(28px, 3vw, 40px);
}

.knowledge-card__eyebrow,
.knowledge-card__number {
	display: block;

	margin-bottom: 12px;
}

.knowledge-card__title {
	margin: 0;
}

.knowledge-card__text {
	margin:
		18px
		0
		0;
}


/* =========================================================
   4.9 DATOS / ¿SABÍAS QUE?
   ========================================================= */

.knowledge-facts {
	padding-bottom:
		clamp(90px, 8vw, 130px);
}

.knowledge-facts__heading {
	display: flex;
	align-items: center;

	gap: 20px;

	margin-bottom: 28px;
}

.knowledge-facts__heading::after {
	content: "";

	flex: 1;

	height: 1px;
}

.knowledge-fact {
	display: grid;

	grid-template-columns:
		minmax(220px, 0.75fr)
		minmax(0, 1.25fr);

	align-items: start;

	gap:
		clamp(40px, 5vw, 80px);

	padding:
		clamp(28px, 3vw, 42px)
		0;
}

.knowledge-fact__title {
	margin: 0;
}

.knowledge-fact__text {
	margin: 0;
}


/* =========================================================
   4.10 ANATOMÍA DEL CIGARRO
   ========================================================= */

.knowledge-anatomy {
	width: 100%;
}

.knowledge-anatomy__item {
	display: grid;

	grid-template-columns:
		44px
		minmax(0, 1fr);

	align-items: start;

	gap: 18px;

	padding: 28px 0;
}

.knowledge-anatomy__number {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 34px;
	height: 34px;
}

.knowledge-anatomy__content {
	min-width: 0;

	display: grid;

	grid-template-columns:
		minmax(220px, 0.75fr)
		minmax(0, 1.25fr);

	align-items: start;

	gap:
		clamp(40px, 5vw, 80px);
}

.knowledge-anatomy__title {
	margin: 0;
}

.knowledge-anatomy__text {
	margin: 0;
}

/* =========================================================
   4.11 AJUSTES ESPECÍFICOS POR TEMA
   ========================================================= */


/* Ron */

.knowledge-topic--rum .knowledge-topic__feature {
	grid-template-columns:
		minmax(0, 1.1fr)
		minmax(360px, 0.7fr);
}


/* Cacao */

.knowledge-topic--cacao .knowledge-topic__feature {
	grid-template-columns:
		minmax(0, 1fr)
		minmax(360px, 0.8fr);
}


/* Mamajuana */

.knowledge-topic--mamajuana .knowledge-topic__feature {
	grid-template-columns:
		minmax(0, 1.1fr)
		minmax(360px, 0.7fr);
}


/* Café */

.knowledge-topic--coffee .knowledge-topic__feature {
	grid-template-columns:
		minmax(0, 1fr)
		minmax(360px, 0.8fr);
}


/* Cigarro */

.knowledge-topic--cigar .knowledge-topic__feature {
	grid-template-columns:
		minmax(0, 1.1fr)
		minmax(360px, 0.7fr);
}


/* =========================================================
   4.12 CIERRE
   ========================================================= */

.knowledge-closing {
	position: relative;

	min-height:
		clamp(420px, 36vw, 560px);

	display: flex;
	align-items: center;
	justify-content: center;

	padding:
		clamp(80px, 8vw, 120px)
		0;

	overflow: hidden;
}

.knowledge-closing__inner {
	position: relative;

	z-index: 2;

	display: flex;
	align-items: center;
	justify-content: center;
}

.knowledge-closing__title {
	width: min(100%, 1200px);

	margin: 0;

	text-align: center;
}

.knowledge-closing__title span {
	display: block;
}

/* =========================================================
   5. PÁGINA HOME
   ========================================================= */


/* =========================================================
   5.1 HERO
   ========================================================= */

.home-hero {
	position: relative;

	min-height: 100vh;
	min-height: 100dvh;

	display: flex;
	align-items: center;
	justify-content: center;

	overflow: hidden;
}

.home-hero__media {
	position: absolute;
	inset: 0;

	width: 100%;
	height: 100%;
}

.home-hero__video {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;
}




/* =========================================================
   5.2 EXPERTOS EN EXPERIENCIAS SENSORIALES
   ========================================================= */

.home-moments {
	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	display: flex;
	align-items: center;

	padding:
		clamp(90px, 8vw, 130px)
		0;
}

.home-moments > .rumkata-container {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.home-moments__header {
	width: min(100%, 920px);

	text-align: center;
}

.home-moments__divider {
	width: min(100%, 480px);

	margin:
		24px
		auto
		0;
}

.home-moments__intro {
	width: min(100%, 720px);

	margin:
		clamp(36px, 4vw, 52px)
		auto
		0;
}

.home-moments__gallery {
	width: min(100%, 760px);

	margin-top:
		clamp(54px, 6vw, 80px);

	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	align-items: end;

	gap:
		clamp(24px, 4vw, 48px);
}

.home-moments__item {
	margin: 0;
}

.home-moments__image {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}


.home-moments__item:nth-child(2) .home-moments__image {
	aspect-ratio: 0.86 / 1;
}

.home-moments__image img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;
}


/* =========================================================
   5.3 RITUAL
   ========================================================= */

.home-ritual {
	position: relative;

	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	display: flex;
	align-items: center;

	overflow: hidden;
}

.home-ritual__background,
.home-ritual__overlay {
	position: absolute;
	inset: 0;
}

.home-ritual__background {
	z-index: 0;
}

.home-ritual__overlay {
	z-index: 1;
}

.home-ritual__inner {
	position: relative;
	z-index: 2;

	display: grid;
	grid-template-columns:
		minmax(340px, 0.9fr)
		minmax(0, 1.1fr);

	align-items: center;

	gap: clamp(70px, 7vw, 120px);

	padding: clamp(80px, 7vw, 110px) 0;
}


/* Categorías */

.home-ritual__categories {
	min-width: 0;
}

.home-ritual__title {
	width: min(100%, 650px);

	margin: 0;
}

.home-ritual__list {
	width: min(100%, 520px);

	margin: clamp(46px, 5vw, 68px) 0 0;
	padding: 0;

	list-style: none;
}

.home-ritual__list-item {
	width: 100%;
}

.home-ritual__item {
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 24px;

	padding: 28px 0;

	border: 0;

	text-align: left;

	cursor: pointer;
}

.home-ritual__item-arrow {
	flex: 0 0 auto;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 38px;
	height: 38px;
}


/* Visor */

.home-ritual__viewer {
	min-width: 0;
}

.home-ritual__panel {
	width: 100%;
}

.home-ritual__panel[hidden] {
	display: none;
}

.home-ritual__media {
	width: min(100%, 570px);
}

.home-ritual__slides {
	position: relative;

	width: 100%;
}

.home-ritual__slide {
	width: 100%;

	margin: 0;

	aspect-ratio: 1.65 / 1;

	overflow: hidden;
}

.home-ritual__slide[hidden] {
	display: none;
}

.home-ritual__slide img {
	display: block;

	width: 100%;
	height: 100%;

	aspect-ratio: inherit;

	object-fit: cover;
}

.home-ritual__pagination {
	display: flex;
	align-items: center;
	justify-content: center;

	gap: 10px;

	width: 100%;

	margin-top: 20px;
}

.home-ritual__dot {
	display: block;

	width: 10px;
	height: 10px;

	padding: 0;
	border: 0;

	cursor: pointer;
}


/* Contenido */

.home-ritual__content {
	width: min(100%, 620px);

	margin-top: 28px;
}

.home-ritual__description {
	margin: 0;
}

.home-ritual__explore {
	display: inline-flex;
	align-items: center;

	gap: 10px;

	margin-top: 20px;
}


/* =========================================================
   5.4 CREA TU EXPERIENCIA
   ========================================================= */

.home-contact {
	min-height:
		clamp(360px, 32vw, 480px);

	display: flex;
	align-items: center;
	justify-content: center;

	padding:
		clamp(80px, 8vw, 120px)
		0;
}

.home-contact__inner {
	display: flex;
	flex-direction: column;
	align-items: center;

	text-align: center;
}

.home-contact__title {
	margin: 0;
}

.home-contact__text {
	width: min(100%, 720px);

	margin:
		18px
		auto
		0;
}

.home-contact__whatsapp {
	margin-top: 30px;
}


/* =========================================================
   6. EXPERIENCIAS
   ========================================================= */


/* =========================================================
   6.1 SELECTOR DE EXPERIENCIAS
   ========================================================= */

.experiences-selector {
	position: relative;
	height: 100vh;
	min-height: 680px;
	padding:
		clamp(104px, 11vh, 118px)
		0
		clamp(28px, 3vh, 38px);
	display: flex;
	align-items: stretch;
}


.experiences-selector > .rumkata-container {
	width: min(100% - 120px, 1420px);
	height: 100%;
	display: flex;
	flex-direction: column;
}


.experiences-selector__intro {
	max-width: 610px;
	flex: 0 0 auto;
	margin-bottom: clamp(24px, 2.8vh, 34px);
}


.experiences-selector__title {
	margin: 0;
}


.experiences-selector__title > span {
	display: block;
}


.experiences-selector__description {
	max-width: 560px;
	margin:
		clamp(18px, 2vh, 24px)
		0
		0;
}


/* =========================================================
   INTERFAZ PRINCIPAL
   ========================================================= */

.experiences-selector__interface {
	flex: 1;
	min-height: 0;
	display: grid;
	grid-template-columns:
		minmax(300px, 410px)
		minmax(480px, 620px);
	gap: clamp(64px, 6vw, 100px);
	align-items: center;
	justify-content: space-between;
}


/*
 * Desplazamiento leve de la columna izquierda hacia
 * el interior del viewport.
 */
.experiences-selector__navigation {
	min-width: 0;
	padding-top: 0;
	padding-left: clamp(12px, 1.5vw, 22px);
}


.experiences-selector__list {
	margin: 0;
	padding: 0;
	list-style: none;
}


.experiences-selector__list-item {
	margin: 0;
	padding: 0;
}


/* =========================================================
   OPCIONES DEL SELECTOR
   ========================================================= */

.experiences-selector__option {
	position: relative;
	width: 100%;
	min-height: 70px;
	display: grid;
	grid-template-columns:
		3px
		58px
		minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	padding: 6px 0;
	text-align: left;
}


.experiences-selector__option-marker {
	width: 3px;
	height: 100%;
	min-height: 56px;
}


.experiences-selector__option-image {
	width: 58px;
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 50%;
	padding: 10px;
}


.experiences-selector__option-img {
	width: 74%;
	height: 74%;
	max-width: 74%;
	max-height: 74%;
	display: block;
	margin: auto;
	object-fit: contain;
	object-position: center;
}


.experiences-selector__option-content {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}


/* =========================================================
   VISOR
   ========================================================= */

.experiences-selector__viewer {
	min-width: 0;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}


/* =========================================================
   PANEL / PERGAMINO
   ========================================================= */

.experiences-selector__panel {
	position: relative;
	width: 100%;
	max-width: 620px;
	height: clamp(350px, 43vh, 425px);
	margin-left: auto;
	overflow: hidden;

	clip-path:
		polygon(
			1.5% 4%,
			5% 2.4%,
			10% 3%,
			16% 1.8%,
			23% 2.6%,
			30% 1.7%,
			38% 2.5%,
			47% 1.8%,
			56% 2.5%,
			65% 1.7%,
			74% 2.6%,
			83% 1.8%,
			91% 2.7%,
			97.5% 2%,
			99% 6%,
			98.2% 14%,
			99% 22%,
			98.2% 32%,
			99% 42%,
			98.2% 52%,
			99% 63%,
			98.2% 73%,
			99% 83%,
			98% 94%,
			95% 98%,
			87% 97.3%,
			79% 98.3%,
			69% 97.4%,
			60% 98.2%,
			50% 97.4%,
			40% 98.2%,
			30% 97.3%,
			20% 98.2%,
			11% 97.3%,
			4% 98%,
			1.5% 94%,
			2.3% 84%,
			1.4% 74%,
			2.2% 64%,
			1.4% 54%,
			2.2% 44%,
			1.4% 34%,
			2.3% 24%,
			1.4% 14%
		);
}


.experiences-selector__panel[hidden] {
	display: none;
}


/* =========================================================
   INTERIOR DEL PERGAMINO
   ========================================================= */

.experiences-selector__panel-media {
	position: absolute;
	inset: 17px;
	overflow: hidden;

	clip-path:
		polygon(
			1% 4%,
			5% 2%,
			12% 3%,
			20% 2%,
			30% 3%,
			40% 2%,
			51% 3%,
			62% 2%,
			73% 3%,
			84% 2%,
			96% 3%,
			99% 7%,
			98% 18%,
			99% 30%,
			98% 42%,
			99% 55%,
			98% 68%,
			99% 82%,
			97% 96%,
			92% 98%,
			80% 97%,
			68% 98%,
			56% 97%,
			44% 98%,
			32% 97%,
			20% 98%,
			7% 97%,
			2% 94%,
			3% 82%,
			2% 68%,
			3% 54%,
			2% 40%,
			3% 26%,
			2% 14%
		);
}


.experiences-selector__panel-media img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: contain;
	object-position: center;
	padding: 20px;
}


.experiences-selector__panel-overlay {
	position: absolute;
	z-index: 1;
	inset: 17px;
	overflow: hidden;

	clip-path:
		polygon(
			1% 4%,
			5% 2%,
			12% 3%,
			20% 2%,
			30% 3%,
			40% 2%,
			51% 3%,
			62% 2%,
			73% 3%,
			84% 2%,
			96% 3%,
			99% 7%,
			98% 18%,
			99% 30%,
			98% 42%,
			99% 55%,
			98% 68%,
			99% 82%,
			97% 96%,
			92% 98%,
			80% 97%,
			68% 98%,
			56% 97%,
			44% 98%,
			32% 97%,
			20% 98%,
			7% 97%,
			2% 94%,
			3% 82%,
			2% 68%,
			3% 54%,
			2% 40%,
			3% 26%,
			2% 14%
		);
}


.experiences-selector__panel-content {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding:
		clamp(28px, 3.2vh, 38px)
		clamp(32px, 3vw, 44px)
		clamp(26px, 3vh, 34px);
}


.experiences-selector__panel-title {
	margin: 0 0 14px;
}


/* =========================================================
   COMPRA / CONFIGURACIÓN
   ========================================================= */

.experiences-selector__panel-purchase {
	width: 100%;
	flex: 1;
	display: flex;
	flex-direction: column;
	min-height: 0;
}


.experiences-selector__panel-purchase
form.cart {
	width: 100%;
	flex: 1;
	display: flex;
	flex-direction: column;
}


.experiences-selector__panel-purchase
.variations_form {
	width: 100%;
	flex: 1;
	display: flex;
	flex-direction: column;
}


/* =========================================================
   TIPO DE EXPERIENCIA
   ========================================================= */

.experiences-selector__panel-purchase
.variations {
	width: 100%;
	max-width: 360px;
	margin: 0;
}


.experiences-selector__panel-purchase
.variations tbody {
	display: block;
	width: 100%;
}


.experiences-selector__panel-purchase
.variations tr {
	display: grid;
	grid-template-columns:
		126px
		minmax(150px, 180px);
	gap: 10px;
	align-items: center;
	justify-content: start;
	width: 100%;
}


.experiences-selector__panel-purchase
.variations th,
.experiences-selector__panel-purchase
.variations td {
	width: auto;
	min-width: 0;
}


.experiences-selector__panel-purchase
.variations td.value {
	display: flex;
	align-items: center;
	gap: 7px;
	min-width: 0;
}


.experiences-selector__panel-purchase
.variations select {
	flex: 1 1 auto;
	min-width: 0;
}


/* =========================================================
   SABER MÁS
   ========================================================= */

.experiences-selector__panel-details {
	flex: 0 0 auto;
	width: 100%;
	margin-top: 11px;
}


.experiences-selector__panel-more {
	display: inline-flex;
	align-items: center;
	margin: 0;
}


.experiences-selector__panel-description {
	width: 100%;
	max-width: none;
	max-height: 112px;
	margin-top: 8px;
	margin-bottom: 24px;
	padding-right: 6px;
	overflow-y: auto;
}


.experiences-selector__panel-description[hidden] {
	display: none;
}


/* =========================================================
   VARIACIÓN SELECCIONADA
   ========================================================= */

.experiences-selector__panel-purchase
.single_variation_wrap {
	width: 100%;
	flex: 1;
	display: flex;
	flex-direction: column;
	min-height: 0;
	margin-top: 8px;
	padding-top: 0;
}


.experiences-selector__panel-purchase
.single_variation {
	flex: 0 0 auto;
	width: 100%;
}


.experiences-selector__panel-purchase
.woocommerce-variation-price {
	display: none;
}


/* =========================================================
   PERSONAS + PRECIO + RESERVA
   ========================================================= */

.experiences-selector__panel-purchase
.woocommerce-variation-add-to-cart {
	display: grid;
	grid-template-columns:
		minmax(174px, 198px)
		minmax(116px, 138px)
		minmax(165px, 188px);
	gap: 10px;
	align-items: center;
	width: 100%;
	margin-top: auto;
	margin-bottom: 18px;
}


.experiences-selector__panel-purchase
.rumkata-experience-quantity {
	display: flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
}


.rumkata-experience-quantity-controls {
	flex: 0 0 auto;
	display: grid;
	grid-template-columns:
		32px
		38px
		32px;
	align-items: stretch;
}


.rumkata-experience-price-summary {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: 3px;
	min-width: 0;
}


.experiences-selector__panel-purchase
.single_add_to_cart_button {
	width: 100%;
}


/* =========================================================
   ESTADOS AUXILIARES
   ========================================================= */

.experiences-selector__panel-purchase
.woocommerce-variation-availability {
	width: 100%;
	margin-bottom: 6px;
}


.experiences-selector__panel-purchase
.woocommerce-variation-description {
	width: 100%;
}


/* =========================================================
   6.2 HEADER — CARRITO EN EXPERIENCIAS
   ========================================================= */

.site-header__cart {
	position: relative;
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 18px;
}


.site-header__cart-icon {
	display: block;
	width: 21px;
	height: 21px;
}


.site-header__cart-count {
	position: absolute;
	top: -3px;
	right: -4px;
	min-width: 17px;
	height: 17px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
}


/* =========================================================
   6.3 TALLERES
   ========================================================= */

.experiences-academy {
	position: relative;

	min-height: 100svh;

	display: flex;
	align-items: center;

	padding:
		clamp(108px, 11vh, 124px)
		0
		clamp(48px, 5vh, 64px);
}


.experiences-academy__inner {
	width: min(100% - 120px, 1420px);

	display: flex;
	flex-direction: column;
}


/* =========================================================
   CABECERA
   ========================================================= */

.experiences-academy__intro {
	display: grid;

	grid-template-columns:
		minmax(320px, 0.88fr)
		minmax(440px, 1.12fr);

	gap:
		clamp(80px, 8vw, 140px);

	align-items: center;

	margin-bottom:
		clamp(34px, 4vh, 48px);
}


.experiences-academy__title {
	margin: 0;
}


.experiences-academy__title > span {
	display: block;
}


.experiences-academy__description {
	max-width: 560px;

	margin: 0;

	align-self: center;
}

/* =========================================================
   LISTADO
   ========================================================= */

.experiences-academy__products {
	width: 100%;

	min-width: 0;

	display: flex;
	flex-direction: column;
}


.experiences-academy__product {
	display: grid;

	grid-template-columns:
		minmax(260px, 0.9fr)
		minmax(560px, 1.6fr);

	gap:
		clamp(42px, 4.5vw, 70px);

	align-items: center;

	min-height: 116px;

	padding:
		clamp(18px, 2vh, 24px)
		0;
}


.experiences-academy__product-copy,
.experiences-academy__product-purchase {
	min-width: 0;
}


.experiences-academy__product-title,
.experiences-academy__product-description {
	margin: 0;
}


.experiences-academy__product-description {
	max-width: 400px;

	margin-top: 7px;
}


/* =========================================================
   FORMULARIO
   ========================================================= */

.experiences-academy__product-purchase
form.cart,
.experiences-academy__product-purchase
.variations_form {
	width: 100%;

	display: grid;

	/*
	 * Primera columna:
	 * Tipo de Taller + Plazas.
	 *
	 * Segunda:
	 * Precio.
	 *
	 * Tercera:
	 * Añadir al carrito.
	 *
	 * Se eliminan los espacios muertos que estaban
	 * quedando entre el selector y el precio.
	 */
	grid-template-columns:
		190px
		155px
		170px;

	grid-template-rows:
		auto
		auto;

	column-gap:
		clamp(16px, 1.7vw, 24px);

	row-gap: 10px;

	align-items: center;

	justify-content: start;
}


/* =========================================================
   TIPO DE TALLER
   ========================================================= */

.experiences-academy__product-purchase
.variations {
	grid-column: 1;
	grid-row: 1;

	width: 190px;
	max-width: 190px;

	margin: 0;
}


.experiences-academy__product-purchase
.variations tbody,
.experiences-academy__product-purchase
.variations tr {
	display: block;

	width: 100%;
}


.experiences-academy__product-purchase
.variations tr {
	display: grid;

	grid-template-columns: 1fr;

	gap: 6px;
}


.experiences-academy__product-purchase
.variations th,
.experiences-academy__product-purchase
.variations td {
	width: 100%;
}


/* =========================================================
   WRAPPER WOOCOMMERCE
   ========================================================= */

.experiences-academy__product-purchase
.single_variation_wrap {
	display: contents;
}


.experiences-academy__product-purchase
.single_variation {
	display: none;
}


.experiences-academy__product-purchase
.woocommerce-variation-price {
	display: none;
}


.experiences-academy__product-purchase
.woocommerce-variation-add-to-cart {
	display: contents;
}


/* =========================================================
   PLAZAS — DEBAJO DEL SELECTOR
   ========================================================= */

.rumkata-workshop-quantity {
	grid-column: 1;
	grid-row: 2;

	display: flex;
	align-items: center;
	justify-content: flex-start;

	gap: 10px;

	min-width: 0;
}


.rumkata-workshop-quantity-controls {
	display: grid;

	grid-template-columns:
		32px
		38px
		32px;

	align-items: stretch;
}


/* =========================================================
   PRECIO
   ========================================================= */

.rumkata-workshop-price-summary {
	grid-column: 2;
	grid-row: 1 / 3;

	min-width: 0;

	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;

	gap: 5px;
}


/* =========================================================
   CTA
   ========================================================= */

.experiences-academy__product-purchase
.single_add_to_cart_button {
	grid-column: 3;
	grid-row: 1 / 3;

	width: 170px;
	max-width: 170px;

	justify-self: start;
	align-self: center;
}


/* =========================================================
   DETALLES
   ========================================================= */

.experiences-academy__product__details {
	grid-column: 1 / -1;
	grid-row: 3;

	margin-top: 4px;
}


.experiences-academy__product__description {
	max-width: 560px;

	max-height: 74px;

	margin-top: 7px;

	padding-right: 6px;

	overflow-y: auto;
}


.experiences-academy__product__description[hidden] {
	display: none;
}

/* =========================================================
   6.4 KITS DE CATADO
   ========================================================= */

.experiences-collection {
	position: relative;
	min-height: 100svh;

	display: flex;
	align-items: center;

	padding:
		clamp(104px, 10.5vh, 120px)
		0
		clamp(48px, 5vh, 64px);
}


.experiences-collection__inner {
	position: relative;

	width: min(100% - 120px, 1420px);

	display: grid;

	grid-template-columns:
		minmax(520px, 0.94fr)
		minmax(430px, 1.06fr);

	grid-template-rows:
		auto
		auto
		auto
		1fr;

	column-gap:
		clamp(74px, 7vw, 118px);

	align-items: start;
}


/* =========================================================
   LA COLECCIÓN
   ========================================================= */

.experiences-collection__intro {
	display: contents;
}


.experiences-collection__eyebrow {
	grid-column: 1 / -1;
	grid-row: 1;

	display: flex;
	align-items: center;
	justify-content: center;

	gap: 16px;

	/*
	 * Conservamos exactamente su espacio original dentro
	 * del grid para que el resto de la composición NO se mueva.
	 *
	 * Solo desplazamos visualmente "La colección" hacia arriba.
	 */
	margin-bottom:
		clamp(34px, 4vh, 48px);

	transform:
		translateY(
			clamp(-92px, -8vh, -72px)
		);
}


.experiences-collection__line {
	flex: 1;

	max-width: 430px;
	height: 1px;
}


/* =========================================================
   CABECERA DERECHA
   ========================================================= */

.experiences-collection__title {
	grid-column: 2;
	grid-row: 2;

	margin: 0;
}


.experiences-collection__title > span {
	display: block;
}


.experiences-collection__description {
	grid-column: 2;
	grid-row: 3;

	max-width: 560px;

	margin:
		clamp(18px, 2vh, 24px)
		0
		clamp(34px, 4vh, 48px);
}


/* =========================================================
   INTERFAZ
   ========================================================= */

.experiences-collection__interface {
	display: contents;
}


/* =========================================================
   TARJETA DEL KIT ACTIVO — IZQUIERDA
   ========================================================= */

.experiences-collection__viewer {
	grid-column: 1;
	grid-row: 2 / 5;

	min-width: 0;

	display: flex;
	align-items: center;
	justify-content: flex-start;
}


.experiences-collection__panel {
	position: relative;

	width: min(100%, 625px);

	height:
		clamp(450px, 56vh, 540px);

	min-height: 450px;

	overflow: hidden;

	border-radius:
		clamp(38px, 4vw, 60px);
}


.experiences-collection__panel[hidden] {
	display: none;
}


/* =========================================================
   IMAGEN — FILL VISUAL 30 %
   ========================================================= */

.experiences-collection__panel-media {
	position: absolute;
	inset: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	overflow: hidden;
}


.experiences-collection__panel-image {
	width: 100%;
	height: 100%;

	max-width: none;
	max-height: none;

	display: block;

	object-fit: cover;
	object-position: center;

	opacity: 0.30;
}


/* =========================================================
   CONTENIDO SOBRE LA IMAGEN
   ========================================================= */

.experiences-collection__panel-content {
	position: absolute;
	z-index: 2;

	left:
		clamp(32px, 3vw, 46px);

	right:
		clamp(32px, 3vw, 46px);

	bottom:
		clamp(24px, 2.8vh, 34px);

	min-width: 0;
}


.experiences-collection__panel-title {
	max-width: 440px;

	margin: 0;
}


.experiences-collection__panel-description {
	max-width: 455px;

	/*
	 * En desktop el contenido crece naturalmente.
	 * Si cabe, no aparece ningún scrollbar.
	 */
	max-height: none;

	margin-top: 10px;

	padding-right: 0;

	overflow: visible;
}


.experiences-collection__panel-description p {
	margin: 0;
}


.experiences-collection__panel-description p + p {
	margin-top: 6px;
}


/* =========================================================
   COMPRA
   ========================================================= */

.experiences-collection__panel-purchase {
	margin-top:
		clamp(16px, 2vh, 22px);
}


.experiences-collection__panel-purchase
form.cart {
	display: grid;

	grid-template-columns:
		minmax(150px, 160px)
		minmax(125px, 145px)
		minmax(145px, 165px);

	gap: 14px;

	align-items: center;
	justify-content: start;
}


.rumkata-kit-quantity {
	display: flex;
	align-items: center;
	justify-content: flex-start;

	gap: 10px;

	min-width: 0;
}


.rumkata-kit-quantity-controls {
	display: grid;

	grid-template-columns:
		32px
		38px
		32px;

	align-items: stretch;
}


.rumkata-kit-price-summary {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;

	gap: 4px;

	min-width: 0;
}


/* =========================================================
   BOTÓN — EVITAR ESTIRAMIENTO
   ========================================================= */

.experiences-collection__panel-purchase
.single_add_to_cart_button {
	width: 100%;
	max-width: 165px;

	justify-self: start;
}


/* =========================================================
   LISTA DE KITS — DERECHA
   ========================================================= */

.experiences-collection__navigation {
	grid-column: 2;
	grid-row: 4;

	min-width: 0;

	align-self: start;
}


.experiences-collection__list {
	margin: 0;
	padding: 0;

	list-style: none;
}


.experiences-collection__list-item {
	margin: 0;
	padding: 0;
}


.experiences-collection__option {
	width: 100%;

	display: grid;

	grid-template-columns:
		44px
		minmax(0, 1fr);

	gap: 16px;

	align-items: center;

	padding:
		clamp(18px, 2.2vh, 24px)
		0;

	text-align: left;
}


.experiences-collection__option-copy {
	min-width: 0;

	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

/* =========================================================
   7. CHECKOUT RUMKATA
   ========================================================= */


/* =========================================================
   7.1 PANTALLA Y CONTENEDOR
   ========================================================= */

.rumkata-checkout-screen {
	width: 100%;

	min-height: calc(100vh - 86px);
	min-height: calc(100dvh - 86px);

	margin-top: 86px;

	display: flex;
}

.rumkata-checkout {
	width: min(100% - 80px, 1180px);

	flex: 1;

	margin-inline: auto;

	padding:
		clamp(36px, 3.5vw, 52px)
		0
		clamp(52px, 5vw, 76px);

	display: flex;
	flex-direction: column;
}


/* =========================================================
   7.2 INDICADOR DE PASOS
   ========================================================= */

.rumkata-checkout__steps {
	width: min(100%, 780px);

	margin:
		0
		auto
		clamp(42px, 4vw, 58px);
}

.rumkata-checkout__steps-list {
	position: relative;

	display: grid;

	grid-template-columns:
		repeat(4, minmax(0, 1fr));

	margin: 0;
	padding: 0;

	list-style: none;
}

.rumkata-checkout__steps-list::before {
	content: "";

	position: absolute;

	top: 17px;
	left: 12.5%;
	right: 12.5%;

	height: 1px;
}

.rumkata-checkout__step {
	position: relative;

	z-index: 1;

	display: flex;
	flex-direction: column;
	align-items: center;

	gap: 9px;

	min-width: 0;
}

.rumkata-checkout__step-number {
	width: 34px;
	height: 34px;

	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 34px;
}


/* =========================================================
   7.3 FORMULARIO Y PANELES
   ========================================================= */

.rumkata-checkout__form {
	width: 100%;

	flex: 1;

	margin: 0;
}

.rumkata-checkout__panel {
	width: 100%;
}

.rumkata-checkout__panel[hidden] {
	display: none;
}

.rumkata-checkout__panel-header {
	width: min(100%, 900px);

	margin:
		0
		auto
		clamp(34px, 3.5vw, 48px);

	text-align: center;
}

.rumkata-checkout__panel-title,
.rumkata-checkout__panel-intro {
	margin: 0;
}

.rumkata-checkout__panel-intro {
	max-width: 560px;

	margin:
		16px
		auto
		0;
}


/* =========================================================
   7.4 PASO 1 — CARRITO
   ========================================================= */

.rumkata-cart {
	width: min(100%, 1180px);

	flex: 1;

	margin-inline: auto;
}

.rumkata-cart__header {
	width: 100%;

	margin-bottom:
		clamp(32px, 3vw, 44px);

	text-align: center;
}

.rumkata-cart__title {
	margin: 0;
}

.rumkata-cart__content {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		minmax(300px, 340px);

	align-items: start;

	column-gap:
		clamp(110px, 9vw, 160px);

	row-gap: 48px;
}

.rumkata-cart__summary {
	position: sticky;

	top: 130px;
}

.rumkata-cart__form {
	min-width: 0;

	margin: 0;
}

.rumkata-cart__items {
	display: grid;

	gap: 18px;
}

.rumkata-cart__item {
	display: grid;

	grid-template-columns:
		24px
		64px
		minmax(0, 1fr)
		auto;

	align-items: center;

	column-gap: 18px;

	min-width: 0;

	padding:
		22px
		0;
}

.rumkata-cart__remove-wrap {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.rumkata-cart__media {
	width: 64px;
	height: 64px;

	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 64px;
}

.rumkata-cart__image-link {
	width: 100%;
	height: 100%;

	display: flex;
	align-items: center;
	justify-content: center;
}

.rumkata-cart__media img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: contain;
}

.rumkata-cart__product {
	min-width: 0;
}

.rumkata-cart__product-name {
	margin:
		0
		0
		9px;
}

.rumkata-cart__meta {
	min-width: 0;
}

.rumkata-cart__meta dl {
	margin: 0;
}

.rumkata-cart__meta dt,
.rumkata-cart__meta dd {
	margin: 0;
}

.rumkata-cart__item-subtotal {
	display: flex;
	flex-direction: column;
	align-items: flex-end;

	gap: 5px;

	min-width: 100px;
}

.rumkata-cart__summary {
	width: 100%;

	min-width: 0;

	padding-top: 4px;
}

.rumkata-cart__summary-title {
	margin:
		0
		0
		24px;
}

.rumkata-cart__summary-lines {
	width: 100%;
}

.rumkata-cart__summary-row {
	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 24px;

	padding:
		13px
		0;
}

.rumkata-cart__summary-row--total {
	margin-top: 6px;

	padding-top: 18px;
}

.rumkata-cart__summary-total-value {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.rumkata-cart__summary-actions {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;

	gap: 14px;

	margin-top: 30px;
}

.rumkata-cart__continue,
.rumkata-cart__back-experiences {
	width: auto;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 auto;

	min-height: 50px;

	padding:
		0
		24px;
}


/* =========================================================
   7.5 DATOS DE LA RESERVA
   ========================================================= */

.rumkata-checkout__customer-details {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		minmax(0, 1fr);

	gap:
		clamp(56px, 7vw, 100px);

	align-items: stretch;

	width: min(100%, 1040px);

	margin-inline: auto;
}

.rumkata-checkout__billing,
.rumkata-checkout__reservation {
	min-width: 0;
}

.rumkata-checkout__billing {
	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	column-gap:
		clamp(24px, 3vw, 38px);

	row-gap: 22px;
}

.rumkata-checkout__reservation {
	display: grid;

	grid-template-rows:
		minmax(0, 1fr)
		auto;

	gap: 22px;

	height: 100%;
}

.rumkata-checkout__field--first-name {
	grid-column: 1;
}

.rumkata-checkout__field--last-name {
	grid-column: 2;
}

.rumkata-checkout__field--age,
.rumkata-checkout__field--email,
.rumkata-checkout__field--phone,
.rumkata-checkout__field--location {
	grid-column: 1 / -1;
}

.rumkata-checkout__field--date {
	min-height: 0;

	display: flex;
	flex-direction: column;
}

.rumkata-checkout__field--date
	.woocommerce-input-wrapper {
	display: flex;
	flex-direction: column;

	flex: 1;
}

.rumkata-checkout .form-row {
	float: none;

	width: 100%;

	margin: 0;
	padding: 0;
}

.rumkata-checkout .form-row-first,
.rumkata-checkout .form-row-last {
	width: 100%;
}

.rumkata-checkout .form-row label,
.rumkata-checkout__calendar-label {
	display: block;

	margin-bottom: 9px;
}

.rumkata-checkout .woocommerce-input-wrapper {
	width: 100%;
}

.rumkata-checkout .input-text,
.rumkata-checkout select,
.rumkata-checkout textarea {
	width: 100%;
}

.rumkata-checkout textarea {
	min-height: 110px;

	resize: vertical;
}


/* =========================================================
   7.6 CALENDARIO
   ========================================================= */

.rumkata-checkout .rumkata-calendar {
	width: 100%;
	max-width: none;

	flex: 1;

	display: flex;
	flex-direction: column;

	margin:
		8px
		0
		0;
}

.rumkata-checkout
	.rumkata-calendar__header {
	display: grid;

	grid-template-columns:
		44px
		minmax(0, 1fr)
		44px;

	align-items: center;

	min-height: 64px;

	padding:
		0
		12px;
}

.rumkata-checkout
	.rumkata-calendar__nav {
	width: 44px;
	height: 44px;

	display: flex;
	align-items: center;
	justify-content: center;

	margin: 0;
	padding: 0;
}

.rumkata-checkout
	.rumkata-calendar__title {
	margin: 0;

	text-align: center;
}

.rumkata-checkout
	.rumkata-calendar__weekdays,
.rumkata-checkout
	.rumkata-calendar__grid {
	display: grid;

	grid-template-columns:
		repeat(7, minmax(0, 1fr));
}

.rumkata-checkout
	.rumkata-calendar__weekdays {
	padding:
		18px
		18px
		8px;
}

.rumkata-checkout
	.rumkata-calendar__weekday {
	text-align: center;
}

.rumkata-checkout
	.rumkata-calendar__grid {
	flex: 1;

	align-content: space-evenly;

	row-gap: 4px;

	padding:
		8px
		18px
		20px;
}

.rumkata-checkout
	.rumkata-calendar__day {
	aspect-ratio: 1;

	width: min(100%, 46px);

	display: flex;
	align-items: center;
	justify-content: center;

	justify-self: center;

	margin: 0;
	padding: 0;
}

.rumkata-checkout
	.rumkata-calendar__legend {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;

	gap:
		12px
		24px;

	padding:
		16px
		20px;
}

.rumkata-checkout
	.rumkata-calendar__legend-item {
	display: inline-flex;
	align-items: center;

	gap: 8px;
}

.rumkata-checkout
	.rumkata-calendar__legend-dot {
	width: 10px;
	height: 10px;

	flex: 0 0 10px;
}


/* =========================================================
   7.7 ACCIONES
   ========================================================= */

.rumkata-checkout__actions {
	width: min(100%, 1040px);

	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;

	gap: 14px;

	margin:
		clamp(44px, 5vw, 64px)
		auto
		0;
}

.rumkata-checkout__back,
.rumkata-checkout__continue {
	width: auto;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 auto;

	min-height: 50px;

	margin: 0;

	padding:
		0
		24px;
}


/* =========================================================
   7.8 PASO DE PAGO
   ========================================================= */

.rumkata-checkout__review-title {
	width: min(100%, 1040px);

	margin:
		0
		auto
		24px;
}

.rumkata-checkout__order-review {
	width: min(100%, 1040px);

	margin-inline: auto;
}

.rumkata-checkout__order-review table {
	width: 100%;

	margin:
		0
		0
		40px;

	border-collapse: collapse;
}

.rumkata-checkout__order-review th,
.rumkata-checkout__order-review td {
	padding:
		16px
		0;

	vertical-align: top;
}

.rumkata-checkout__order-review th:last-child,
.rumkata-checkout__order-review td:last-child {
	text-align: right;
}

.rumkata-checkout__order-review
	#payment {
	width: 100%;
}

.rumkata-checkout__order-review
	.wc_payment_methods {
	margin: 0;
	padding: 0;

	list-style: none;
}

.rumkata-checkout__order-review
	.wc_payment_method {
	margin: 0;

	padding:
		22px
		0;
}

.rumkata-checkout__order-review
	.wc_payment_method > label {
	display: inline-flex;
	align-items: center;

	gap: 10px;
}

.rumkata-checkout__order-review
	.payment_box {
	margin-top: 18px;

	padding:
		22px
		24px;
}

.rumkata-checkout__order-review
	.form-row {
	width: 100%;
}

.rumkata-checkout__order-review
	.place-order {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;

	gap: 14px;
}

.rumkata-checkout__order-review
	#place_order {
	width: auto;

	min-height: 50px;

	margin: 0;

	padding:
		0
		26px;
}



/* ---------------------------------------------------------
   PASO DE PAGO — SELECCIÓN DEL MÉTODO
   --------------------------------------------------------- */

.rumkata-checkout__payment-choice,
.rumkata-checkout__payment-detail {
	width: min(100%, 1040px);

	margin-inline: auto;
}

.rumkata-checkout__payment-choice[hidden],
.rumkata-checkout__payment-detail[hidden] {
	display: none;
}

.rumkata-checkout__payment-choice {
	display: flex;
	flex-direction: column;
	justify-content: center;

	min-height:
		clamp(
			280px,
			42vh,
			440px
		);
}

.rumkata-checkout__payment-options {
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;

	gap:
		clamp(
			16px,
			2.5vw,
			24px
		);

	margin:
		0
		auto
		clamp(
			38px,
			5vw,
			56px
		);
}


.rumkata-checkout__payment-choice
	> .rumkata-checkout__actions {
	justify-content: center;
}

.rumkata-checkout__payment-option {
	width: auto;
	min-width: 0;
	min-height: 54px;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	padding:
		14px
		clamp(
			28px,
			3vw,
			42px
		);
}

.rumkata-checkout__panel-intro[hidden] {
	display: none;
}

.rumkata-checkout__payment-detail
	.rumkata-checkout__review-title {
	margin-top: 0;
}



/* =========================================================
   7.9 CARRITO VACÍO
   ========================================================= */

.rumkata-checkout--empty {
	justify-content: flex-start;
}

.rumkata-checkout-empty {
	width: min(100%, 720px);

	flex: 1;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-inline: auto;
}

.rumkata-checkout-empty__content {
	width: min(100%, 520px);

	display: flex;
	flex-direction: column;
	align-items: center;

	text-align: center;
}

.rumkata-checkout-empty__icon {
	width: 72px;
	height: 72px;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-bottom: 28px;
}

.rumkata-checkout-empty__title {
	margin:
		0
		0
		16px;
}

.rumkata-checkout-empty__text {
	max-width: 440px;

	margin:
		0
		0
		30px;
}

.rumkata-checkout-empty__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 50px;

	padding:
		0
		26px;
}


/* =========================================================
   7.10 CONFIRMACIÓN
   ========================================================= */

.rumkata-checkout--complete {
	justify-content: flex-start;
}

.rumkata-checkout-complete {
	width: min(100%, 1040px);

	flex: 1;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-inline: auto;
}

.rumkata-checkout-complete__content {
	width: 100%;

	display: flex;
	flex-direction: column;
	align-items: center;

	text-align: center;
}

.rumkata-checkout-complete__status-icon {
	width: 72px;
	height: 72px;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-bottom: 28px;
}

.rumkata-checkout-complete__title {
	margin:
		0
		0
		16px;
}

.rumkata-checkout-complete__text {
	max-width: 540px;

	margin:
		0
		0
		32px;
}

.rumkata-checkout-complete__summary {
	width: min(100%, 520px);

	margin-bottom: 32px;
}

.rumkata-checkout-complete__summary-item {
	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 24px;

	padding:
		14px
		0;
}

.rumkata-checkout-complete__primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 50px;

	padding:
		0
		26px;
}

.rumkata-checkout-complete__order-details
	+ a.rumkata-checkout-complete__primary {
	margin-top:
		clamp(40px, 5vw, 64px);
}


/* =========================================================
   CHECKOUT — CONSENTIMIENTOS LEGALES
   ========================================================= */

.rumkata-checkout__legal {
	width: min(100%, 1040px);

	margin:
		clamp(34px, 4vw, 48px)
		auto
		0;

	display: flex;
	flex-direction: column;

	gap: 16px;
}

.rumkata-checkout__legal
	.rumkata-checkout__field--consent {
	width: 100%;

	display: flex;
	align-items: flex-start;
}

.rumkata-checkout__legal
	.woocommerce-form__label-for-checkbox {
	display: inline-flex;
	align-items: flex-start;

	gap: 12px;

	margin: 0;
}

.rumkata-checkout__legal
	input[type="checkbox"] {
	flex: 0 0 auto;

	margin-top: 3px;
}

/* =========================================================
   PÁGINAS LEGALES
   ========================================================= */

.rumkata-legal-page {
	width: 100%;

	min-height:
		calc(100vh - 86px);
	min-height:
		calc(100dvh - 86px);

	margin-top: 86px;

	padding:
		clamp(64px, 7vw, 100px)
		0
		clamp(80px, 8vw, 120px);
}

.rumkata-legal-page__inner {
	width:
		min(
			calc(100% - 40px),
			900px
		);

	margin-inline: auto;
}

.rumkata-legal-page__header {
	width: 100%;

	margin-bottom:
		clamp(42px, 5vw, 64px);
}

.rumkata-legal-page__content {
	width: 100%;
}


/* =========================================================
   404 — ALTURA DE PÁGINA
   ========================================================= */

body.error404 {
	min-height: 100vh;

	display: flex;
	flex-direction: column;
}

body.error404 .site-main {
	flex: 1 0 auto;
}

body.error404 .site-footer {
	flex: 0 0 auto;
}