/**
 * Home — composición y tipografía de la maqueta de la Home aprobada
 * (maison-akari-editorial-v3, medidas a 1440px; reglas ≤650px de la propia
 * maqueta para móvil).
 *
 * La maqueta de la Home usa Georgia (títulos) y Arial (lectura); el resto de
 * la web usa Cormorant Garamond y DM Sans. Aquí, solo en la Home, las dos
 * variables de familia vuelven a las de su maqueta: así header, pie y
 * tarjetas reutilizadas cambian de familia dentro de la Home sin tocar otras
 * páginas. La marca (wordmark) es Georgia en todo el sitio.
 *
 * Se conserva (decisiones posteriores): Favoritos como carrusel infinito con
 * pausa y flechas; fotografías y categorías elegidas; orden acordado de Sets
 * (Esmeralda, Zafiro, Topacio, Tanzanita, Granate); textos aprobados.
 *
 * Se carga después de front-page.css y tipografia.css.
 */

body.home {
	--mka-font-display: Georgia, 'Times New Roman', serif;
	--mka-font-body: Arial, Helvetica, sans-serif;
	--mka-color-crema: #F5F0E8;
	--home-tinta: #352924;
	--home-suave: #67574C;
	--home-linea: #D8CCC0;
	font-size: 13px;
	line-height: 1.5;
	font-weight: 400;
}

/* ---------- Franja de envío ---------- */
body.home .mka-banner-envio {
	padding: 9px 4%;
	font-size: 11px;
	line-height: 1.5;
	letter-spacing: 1.4px;
}

/* ---------- Encabezado ---------- */
body.home .site-header {
	height: 71px;
	background-color: var(--mka-color-crema);
	border-bottom-color: var(--home-linea);
}

body.home .site-header__logo {
	font-size: 21px;
	letter-spacing: 3px;
	color: var(--mka-color-burdeos);
}

body.home .site-header__menu-list {
	gap: 26px;
}

body.home .site-header__menu-list a,
body.home .site-header__bolsa-texto {
	font-family: var(--mka-font-body);
	font-size: 11px;
	letter-spacing: 1px;
	text-transform: uppercase;
	line-height: 1.5;
}

/* ---------- Hero ---------- */
body.home .mka-hero {
	display: grid;
	grid-template-columns: 45% 55%;
	height: auto;
	min-height: 0;
	overflow: visible;
	background-color: var(--mka-color-beige-profundo);
}

body.home .mka-hero--sin-producto {
	grid-template-columns: 1fr;
}

body.home .mka-hero__panel {
	flex: none;
	height: auto;
	overflow: visible;
}

body.home .mka-hero__panel--editorial {
	align-self: center;
}

body.home .mka-hero__panel--editorial::before {
	display: none;
}

body.home .mka-hero__contenido {
	position: static;
	inset: auto;
	display: block;
	margin: 0;
	padding: 72px 9%;
}

body.home .mka-hero__panel--tipografico .mka-hero__contenido::before {
	display: none;
}

body.home .mka-hero__eyebrow {
	margin: 0 0 18px 0;
	font-family: var(--mka-font-body);
	font-size: 11px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 2px;
	color: var(--home-tinta);
}

body.home .mka-hero__titulo,
body.home .mka-hero__panel--tipografico .mka-hero__titulo {
	max-width: none;
	margin: 0 0 22px 0;
	font-family: var(--mka-font-display);
	font-size: clamp(34px, 4.2vw, 58px);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -1.2px;
	color: var(--mka-color-burdeos);
}

/* El CTA pasa de botón con contorno a enlace subrayado, como en la maqueta. */
body.home .mka-hero__cta {
	display: inline-block;
	margin: 25px 0 0 0;
	padding: 8px 0;
	font-family: var(--mka-font-body);
	font-size: 11px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--home-tinta);
	border: 0;
	border-bottom: 1px solid currentColor;
	background: transparent;
}

body.home .mka-hero__cta::after {
	content: '\00a0\00a0\2192';
}

body.home .mka-hero__cta:hover,
body.home .mka-hero__cta:focus-visible {
	background: transparent;
	color: var(--mka-color-burdeos);
}

body.home .mka-hero__panel--producto {
	height: clamp(520px, 44vw, 650px);
}

body.home .mka-hero__img {
	width: 100%;
	height: clamp(520px, 44vw, 650px);
	object-fit: cover;
	object-position: 50% 55%;
}

/* ---------- Categorías (nombre sobre la fotografía) ---------- */
/* Separación beige: aire sobre la sección, márgenes laterales y pequeños espacios entre las tres fotografías. */
body.home .mka-categorias {
	padding: 44px 5% 0 5%;
}

body.home .mka-categorias__list {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}

body.home .mka-categorias__item:last-child:nth-child(3n + 1) {
	grid-column: auto;
	justify-self: stretch;
	width: auto;
}

body.home .mka-categorias__link {
	position: relative;
	overflow: hidden;
}

body.home .mka-categorias__img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: 50% 50%;
}

/* Encuadres completos y centrados: Collares (Colgante Nébula) con margen; Aretes y Pulseras al centro. */
body.home .mka-categorias__item:nth-child(1) .mka-categorias__img {
	object-position: 50% 48%;
}

body.home .mka-categorias__item:nth-child(2) .mka-categorias__img {
	object-position: 50% 74%;
}

body.home .mka-categorias__nombre {
	position: absolute;
	inset: auto 0 0 0;
	margin: 0;
	padding: 36px 24px 20px 24px;
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	font-family: var(--mka-font-display);
	font-size: 25px;
	font-weight: 400;
	line-height: 1.5;
	color: #fffaf1;
	background: linear-gradient(transparent, #251914a8);
}

body.home .mka-categorias__link:hover .mka-categorias__nombre,
body.home .mka-categorias__link:focus-visible .mka-categorias__nombre {
	color: #fffaf1;
}

body.home .mka-categorias__descubrir {
	display: block;
	margin-top: 5px;
	font-family: var(--mka-font-body);
	font-size: 10px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}

/* ---------- Títulos de sección (izquierda) y filas de encabezado ---------- */
body.home .mka-favoritos__titulo,
body.home .mka-sets__titulo {
	margin: 0;
	font-family: var(--mka-font-display);
	font-size: 31px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: 0;
	color: var(--home-tinta);
	text-align: left;
}

/* ---------- Nuestros favoritos (carrusel infinito con pausa y flechas) ---------- */
body.home .mka-favoritos {
	padding: 45px 0;
}

body.home .mka-favoritos__intro {
	max-width: none;
	margin: 0 0 22px 0;
	padding: 0 4%;
	justify-content: space-between;
}

body.home .mka-favoritos__rail {
	gap: 15px;
	padding: 0 4%;
}

body.home .mka-favoritos__item {
	width: calc((100vw - 8% - 45px) / 4);
	max-width: none;
}

body.home .mka-favoritos .mka-producto-card img {
	aspect-ratio: 1 / 1.1;
}

body.home .mka-favoritos .mka-producto-card__nombre,
body.home .mka-sets .mka-producto-card__nombre {
	margin-top: 12px;
	font-family: var(--mka-font-display);
	font-size: 17px;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--home-tinta);
}

body.home .mka-sets .mka-producto-card__nombre {
	font-size: 18px;
	margin-top: 10px;
}

body.home .mka-favoritos .mka-producto-card__precio,
body.home .mka-sets .mka-producto-card__precio {
	margin-top: 4px;
	font-family: var(--mka-font-body);
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: 0;
	color: var(--home-suave);
}

/* ---------- Nuestra esencia ---------- */
body.home .mka-esencia {
	padding: 0;
}

body.home .mka-esencia__grid {
	max-width: none;
	margin: 0;
	grid-template-columns: 40% 60%;
	gap: 0;
	align-items: center;
}

body.home .mka-esencia__texto {
	max-width: none;
	padding: 46px 10%;
}

body.home .mka-esencia__titulo {
	margin: 0 0 18px 0;
	font-family: var(--mka-font-display);
	font-size: 39px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: 0;
	color: var(--mka-color-crema);
}

body.home .mka-esencia__parrafo {
	font-family: var(--mka-font-body);
	font-size: 13px;
	line-height: 1.5;
	color: var(--mka-color-crema);
}

body.home .mka-esencia__media {
	align-self: stretch;
}

body.home .mka-esencia__img {
	width: 100%;
	height: clamp(440px, 38vw, 580px);
	aspect-ratio: auto;
	object-fit: cover;
	object-position: center 45%;
}

/* ---------- Sets (tres tarjetas visibles, collage completo) ---------- */
body.home .mka-sets {
	padding: 45px 4%;
	background-color: #EDE5DA;
}

body.home .mka-sets__intro {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 14px;
	margin: 0 0 22px 0;
	padding: 0;
	text-align: left;
}

body.home .mka-sets__enlace {
	font-family: var(--mka-font-body);
	font-size: 11px;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--home-tinta);
}

body.home .mka-sets__enlace::after {
	content: '\00a0\2192';
}

/* Tres tarjetas completas; las flechas viven en el margen lateral del riel, fuera de las fotografías. */
body.home .mka-sets .mka-rail-wrap {
	max-width: none;
	margin: 0;
	padding: 0 56px;
}

body.home .mka-sets .mka-rail-flecha--prev {
	left: 8px;
}

body.home .mka-sets .mka-rail-flecha--next {
	right: 8px;
}

body.home .mka-sets__rail {
	gap: 24px;
	padding: 0;
}

body.home .mka-sets__item {
	width: calc((100% - 48px) / 3);
}

body.home .mka-sets .mka-producto-card img {
	aspect-ratio: 1;
	object-fit: contain;
}

/* ---------- Descubre nuestras gemas ---------- */
body.home .mka-guia-gemas {
	padding: 45px 4%;
}

body.home .mka-guia-gemas__layout {
	max-width: none;
	margin: 0;
	grid-template-columns: 24% 1fr;
	gap: 25px;
}

body.home .mka-guia-gemas__titulo {
	margin: 0 0 15px 0;
	font-family: var(--mka-font-display);
	font-size: 32px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: 0;
	color: var(--home-tinta);
}

body.home .mka-guia-gemas__texto {
	font-family: var(--mka-font-body);
	font-size: 13px;
	line-height: 1.5;
	color: var(--home-tinta);
}

body.home .mka-guia-gemas__grid {
	gap: 20px 12px;
}

body.home .mka-guia-gemas__nombre {
	margin-top: 8px;
	font-family: var(--mka-font-display);
	font-size: 19px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
}

body.home .mka-guia-gemas__descripcion {
	font-family: var(--mka-font-body);
	font-size: 12px;
	color: var(--home-suave);
}

/* ---------- Pie de página ---------- */
body.home .site-footer {
	padding: 42px 4% 20px;
}

body.home .site-footer__wordmark {
	font-size: 21px;
	letter-spacing: 3px;
}

body.home .site-footer__titulo {
	font-family: var(--mka-font-body);
	font-size: 11px;
	letter-spacing: 2px;
}

body.home .site-footer__columna a {
	font-size: 12px;
	margin: 9px 0;
}

body.home .site-footer__tagline {
	font-family: var(--mka-font-display);
}

/* ---------- Móvil (≤650px, reglas de la maqueta) ---------- */
@media (max-width: 650px) {
	body.home .site-header {
		height: auto;
	}

	body.home .site-header__logo {
		font-size: 16px;
		letter-spacing: 1.5px;
	}

	body.home .mka-hero {
		grid-template-columns: 1fr;
	}

	body.home .mka-hero__contenido {
		padding: 38px 7%;
	}

	body.home .mka-hero__titulo,
	body.home .mka-hero__panel--tipografico .mka-hero__titulo {
		max-width: 350px;
		font-size: 45px;
	}

	body.home .mka-hero__panel--producto,
	body.home .mka-hero__img {
		height: 400px;
	}

	body.home .mka-categorias {
		padding: 28px 6% 0 6%;
	}

	/* Una columna: cada fotografía se ve completa, con aire entre ellas. */
	body.home .mka-categorias__list {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	body.home .mka-categorias__img {
		height: auto;
		aspect-ratio: 4 / 3;
	}

	body.home .mka-categorias__item:nth-child(1) .mka-categorias__img {
		object-position: 50% 48%;
	}

	body.home .mka-categorias__item:nth-child(2) .mka-categorias__img {
		object-position: 50% 74%;
	}

	body.home .mka-categorias__nombre {
		padding: 34px 16px 14px 16px;
		font-size: 22px;
	}

	body.home .mka-categorias__descubrir {
		font-size: 10px;
		letter-spacing: 1.5px;
	}

	body.home .mka-favoritos {
		padding: 33px 0;
	}

	body.home .mka-favoritos__intro {
		padding: 0 6%;
	}

	body.home .mka-favoritos__titulo,
	body.home .mka-sets__titulo {
		font-size: 27px;
	}

	body.home .mka-favoritos__rail {
		gap: 12px;
		padding: 0 6%;
	}

	body.home .mka-favoritos__item {
		width: calc((100vw - 12% - 12px) / 2);
		max-width: none;
	}

	body.home .mka-esencia__grid {
		grid-template-columns: 1fr;
	}

	body.home .mka-esencia__texto {
		padding: 35px 7%;
	}

	body.home .mka-esencia__img {
		height: 400px;
	}

	body.home .mka-sets {
		padding: 33px 6%;
	}

	/* Móvil: la tarjeta ocupa todo el ancho útil (con márgenes laterales) y las flechas van debajo, fuera de la fotografía. */
	body.home .mka-sets .mka-rail-wrap {
		max-width: 340px;
		margin: 0 auto;
		padding: 0 0 56px 0;
	}

	body.home .mka-sets .mka-rail-flecha {
		top: auto;
		bottom: 0;
		transform: none;
		width: 44px;
		height: 44px;
	}

	body.home .mka-sets .mka-rail-flecha--prev {
		left: calc(50% - 52px);
	}

	body.home .mka-sets .mka-rail-flecha--next {
		left: auto;
		right: calc(50% - 52px);
	}

	body.home .mka-sets__rail {
		gap: 12px;
	}

	body.home .mka-sets__item {
		width: 100%;
	}

	body.home .mka-guia-gemas {
		padding: 33px 6%;
	}

	body.home .mka-guia-gemas__layout {
		grid-template-columns: 1fr;
	}

	body.home .mka-guia-gemas__intro {
		text-align: left;
	}

	body.home .mka-guia-gemas__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
