/*
 * Marketing Digital Core — Landing "Método Creativo" (portada de la colección).
 * Depende de base.css (fuentes locales y componentes). Aquí se redefine la paleta solo para la landing.
 */

/* ---------- Paleta de la landing ---------- */
:root {
	--mdc-bg: #F8F6F2;          /* fondo general: blanco cálido */
	--mdc-card: #EEE4DA;        /* tarjetas y secciones destacadas */
	--mdc-accent: #D8C4AC;      /* acentos suaves, bordes de tarjetas */
	--mdc-wine: #4D0E13;        /* titulares y botones primarios */
	--mdc-wine-soft: #7A3A3F;   /* hover y etiquetas */
	--mdc-nude: #C8A49F;        /* pills y badges */
	--mdc-ink: #2A2421;         /* texto de lectura */
	--mdc-muted: #5F5751;       /* texto secundario (AA sobre #EEE4DA) */
	--mdc-line: #E6DCD1;
	--mdc-line-strong: #D8C4AC;

	/* Tokens de base.css reasignados a la nueva paleta. */
	--mdc-surface: var(--mdc-card);
	--mdc-surface-alt: var(--mdc-card);
	--mdc-terra-deep: var(--mdc-wine);
	--mdc-terra: var(--mdc-nude);
	--mdc-forest: var(--mdc-wine-soft);

	--mdc-read: 800px;
	--mdc-section-y: 50px;
}
@media (min-width: 768px) {
	:root { --mdc-section-y: clamp(80px, 9vw, 120px); }
}

/* ---------- Página ---------- */
html { scroll-behavior: smooth; }
body.mdc-landing {
	margin: 0;
	background: var(--mdc-bg);
	color: var(--mdc-ink);
	font: 400 1.0625rem/1.7 var(--mdc-font-body);
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
	interpolate-size: allow-keywords;
}
.mdc-landing * { font-variant-numeric: lining-nums; }
.mdc-landing a { color: inherit; }
.mdc-landing :where(h1, h2, h3) { color: var(--mdc-wine); font-weight: 400; }
.mdc-landing :where(h1, h2) { font-weight: 300; }
.mdc-landing :where(h1, h2, h3) em { font-style: italic; }
.mdc-landing strong { font-weight: 600; color: var(--mdc-wine); }
.mdc-skip { position: absolute; left: -9999px; }
.mdc-skip:focus { left: 1rem; top: 1rem; z-index: 100; background: var(--mdc-wine); color: #fff; padding: .6rem 1rem; }

.mdc-wrap--read { max-width: calc(var(--mdc-read) + 2 * var(--mdc-gutter)); }
.mdc-section { padding: var(--mdc-section-y) 0; }
.mdc-section--tint { background: var(--mdc-card); }
/* Dentro de secciones destacadas, las tarjetas vuelven al fondo claro para separarse. */
.mdc-section--tint .mdc-card, .mdc-section--tint .mdc-volume { background: var(--mdc-bg); }
.mdc-head { max-width: var(--mdc-read); margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.mdc-head__text { margin-top: 1rem !important; max-width: 36rem; color: var(--mdc-muted); }
.mdc-eyebrow { color: var(--mdc-wine-soft); }
.mdc-h2 { font-size: clamp(2.25rem, 4.6vw, 3.25rem); line-height: 1.05; margin-top: .75rem; }

/* ---------- Botones, pills ---------- */
.mdc-btn { border-radius: 0; text-transform: none; letter-spacing: .04em; font-size: .95rem; background: var(--mdc-wine); box-shadow: none; }
.mdc-btn:hover { background: var(--mdc-wine-soft); box-shadow: none; }
.mdc-btn--outline { background: transparent; color: var(--mdc-wine) !important; box-shadow: inset 0 0 0 1px var(--mdc-wine); }
.mdc-btn--outline:hover { background: var(--mdc-wine); color: #fff !important; }
.mdc-btn--sm { min-height: 2.75rem; padding: 0 1.1rem; font-size: .875rem; letter-spacing: .02em; }
.mdc-btn--block { display: flex; width: 100%; }
.mdc-textlink { font-size: .95rem; color: var(--mdc-wine) !important; text-underline-offset: .3em; text-decoration-thickness: 1px; }
.mdc-textlink:hover { color: var(--mdc-wine-soft) !important; }
.mdc-pill {
	display: inline-block; padding: .35rem .8rem; border-radius: 999px; white-space: nowrap;
	background: var(--mdc-nude); color: var(--mdc-wine);
	font: 500 .75rem/1.2 var(--mdc-font-body); letter-spacing: .08em;
}

/* ---------- Tarjeta genérica ---------- */
.mdc-card { background: var(--mdc-card); border: 1px solid var(--mdc-accent); padding: clamp(1.5rem, 3.5vw, 2rem); }

/* ---------- Anuncio + header ---------- */
.mdc-announce {
	margin: 0; padding: .7rem 1rem; text-align: center;
	background: var(--mdc-wine); color: var(--mdc-card);
	font: 500 .75rem/1.4 var(--mdc-font-body); letter-spacing: .15em;
}
.mdc-topbar { border-bottom: 1px solid var(--mdc-line); }
.mdc-topbar__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2.5rem; padding-top: 1.35rem; padding-bottom: 1.35rem; }
.mdc-brand { display: flex; align-items: center; gap: .85rem; line-height: 1; text-decoration: none; color: var(--mdc-wine) !important; }
.mdc-brand__logo { flex: none; width: 56px; height: 56px; border-radius: 50%; }
.mdc-brand__text { display: flex; flex-direction: column; }
.mdc-brand__name { font: 400 1.9rem/1 var(--mdc-font-display); letter-spacing: .03em; }
.mdc-brand__tagline { margin-top: .4rem; font: 500 .625rem/1 var(--mdc-font-body); letter-spacing: .26em; color: var(--mdc-wine-soft); }
.mdc-nav { display: flex; flex-wrap: wrap; gap: .25rem 1.75rem; font-size: .875rem; letter-spacing: .03em; }
.mdc-nav a { padding: .5rem 0; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 calc(100% - .35rem) / 0 1px no-repeat; transition: background-size .35s var(--mdc-ease); }
.mdc-nav a:hover { background-size: 100% 1px; }
.mdc-cart {
	position: relative; display: inline-flex; align-items: center; gap: .5rem;
	min-height: 2.75rem; padding: 0 1rem; border: 1px solid var(--mdc-wine); border-radius: 999px;
	color: var(--mdc-wine) !important; font-size: .875rem; text-decoration: none;
	transition: background-color .25s var(--mdc-ease), color .25s;
}
.mdc-cart:hover { background: var(--mdc-wine); color: #fff !important; }
.mdc-cart .mdc-icon { width: 1.1rem; height: 1.1rem; }
.mdc-cart__count { min-width: 1.25rem; height: 1.25rem; padding: 0 .3rem; border-radius: 999px; display: inline-grid; place-items: center; background: var(--mdc-nude); color: var(--mdc-wine); font: 600 .7rem/1 var(--mdc-font-body); }

/* ---------- Hero ---------- */
.mdc-hero { padding: var(--mdc-section-y) 0; }
.mdc-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: center; }
.mdc-hero__title { margin-top: 1.1rem; font-size: clamp(2.9rem, 6.5vw, 4.75rem); line-height: 1; letter-spacing: -.01em; }
.mdc-hero__sub { margin-top: 1.25rem !important; max-width: 26rem; font-size: 1.15rem; line-height: 1.55; color: var(--mdc-muted); }
.mdc-hero__price { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: 2rem; }
.mdc-hero__amount { font: 400 2.75rem/1 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-hero__was { font-size: 1rem; color: var(--mdc-muted); }
.mdc-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; margin-top: 1.5rem; }

/* Portadas apiladas (proporciones del diseño original: lienzo 560×460, portadas 220×300). */
.mdc-stack { position: relative; width: 100%; max-width: 560px; aspect-ratio: 560 / 460; margin: 0 auto; }
.mdc-stack .mdc-cover { position: absolute; width: 39.3%; }
.mdc-stack .mdc-cover--01 { left: 5.4%;  top: 8.7%;  transform: rotate(-9deg); }
.mdc-stack .mdc-cover--02 { left: 25%;   top: 4.3%;  transform: rotate(-3deg); }
.mdc-stack .mdc-cover--03 { left: 44.6%; top: 8.7%;  transform: rotate(4deg); }
.mdc-stack .mdc-cover--04 { left: 60.7%; top: 23.9%; transform: rotate(10deg); }

/* ---------- Portada (componente) ---------- */
.mdc-cover {
	container-type: inline-size;
	aspect-ratio: 220 / 300;
	background: var(--mdc-bg);
	border: 1px solid var(--mdc-accent);
	box-shadow: 0 1px 2px rgba(77, 14, 19, .06), 0 24px 50px -12px rgba(77, 14, 19, .25);
	color: var(--mdc-wine);
}
/* Unidades cqi relativas al ancho de la portada (el contenedor es .mdc-cover, sin relleno). */
.mdc-cover__in { display: flex; flex-direction: column; height: 100%; padding: 8.2cqi; }
.mdc-cover__brand { font: 500 3.6cqi/1 var(--mdc-font-body); letter-spacing: .25em; }
.mdc-cover__arch {
	display: flex; align-items: center; justify-content: center;
	width: 47cqi; aspect-ratio: 104 / 128; margin: 10cqi auto 0;
	border-radius: 999px 999px 0 0;
	font: 300 24.5cqi/1 var(--mdc-font-display);
}
.mdc-cover__title { margin-top: auto; font: 400 10.9cqi/1 var(--mdc-font-display); }
.mdc-cover--01 .mdc-cover__arch { background: var(--mdc-accent); }
.mdc-cover--02 { background: var(--mdc-accent); border-color: transparent; }
.mdc-cover--02 .mdc-cover__arch { background: var(--mdc-card); }
.mdc-cover--03 { background: var(--mdc-nude); border-color: transparent; }
.mdc-cover--03 .mdc-cover__arch { background: var(--mdc-card); }
.mdc-cover--04 { background: var(--mdc-wine); border-color: transparent; color: var(--mdc-card); }
.mdc-cover--04 .mdc-cover__arch { background: var(--mdc-nude); color: var(--mdc-wine); }

/* ---------- Intro (detalle del método + beneficios) ---------- */
.mdc-intro { border-top: 1px solid var(--mdc-line); text-align: center; }
.mdc-intro__lead { font: italic 400 clamp(1.6rem, 3.6vw, 2.35rem)/1.25 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-pills { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 1.75rem !important; }
.mdc-benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: 1.25rem; margin-top: clamp(2.5rem, 5vw, 3.5rem); text-align: left; }
.mdc-benefit .mdc-icon { width: 2rem; height: 2rem; color: var(--mdc-wine); }
.mdc-benefit__title { margin-top: 1rem !important; font: 400 1.4rem/1.2 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-benefit__text { margin-top: .35rem !important; font-size: .9rem; line-height: 1.55; color: var(--mdc-muted); }

/* ---------- Colección ---------- */
.mdc-volumes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr)); gap: 1.5rem; }
.mdc-volume { display: flex; flex-direction: column; background: var(--mdc-bg); border: 1px solid var(--mdc-accent); }
.mdc-volume__band { display: flex; justify-content: center; padding: 1.75rem 0; background: var(--mdc-card); border-bottom: 1px solid var(--mdc-accent); overflow: hidden; }
.mdc-volume__band .mdc-cover { width: 150px; transition: transform .6s var(--mdc-ease); }
.mdc-volume:hover .mdc-volume__band .mdc-cover { transform: translateY(-4px) scale(1.03); }
.mdc-volume__body { display: flex; flex-direction: column; flex: 1; padding: 1.4rem 1.4rem 1.5rem; }
.mdc-volume__label { font: 500 .6875rem/1.4 var(--mdc-font-body); letter-spacing: .18em; color: var(--mdc-wine-soft); }
.mdc-volume__title { margin-top: .5rem !important; font-size: 1.5rem; line-height: 1.12; }
.mdc-volume__text { margin-top: .6rem !important; font-size: .9rem; line-height: 1.6; color: var(--mdc-muted); }
.mdc-volume__foot { margin-top: auto; padding-top: 1.25rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.mdc-volume__foot .mdc-btn { white-space: nowrap; }
.mdc-volume__price { font: 400 1.75rem/1 var(--mdc-font-display); color: var(--mdc-wine); }

/* ---------- Pack ---------- */
.mdc-pack { display: flex; flex-wrap: wrap; align-items: center; gap: 2.5rem 4rem; padding: clamp(2rem, 5vw, 4rem); background: var(--mdc-wine); color: var(--mdc-card); }
.mdc-pack__copy { flex: 1 1 24rem; min-width: 0; max-width: 34rem; }
.mdc-pack .mdc-eyebrow { color: var(--mdc-nude); }
.mdc-pack .mdc-h2 { color: var(--mdc-card); font-size: clamp(2.4rem, 5vw, 3.6rem); line-height: 1; }
.mdc-pack__text { margin-top: 1.25rem !important; line-height: 1.65; color: #E6D6CC; }
.mdc-pack__list { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1.5rem; margin: 1.5rem 0 0; font-size: .875rem; }
.mdc-pack__list li { padding: .6rem 0; border-top: 1px solid rgba(238, 228, 218, .25); }
.mdc-pack__box { flex: 0 1 21rem; min-width: 0; padding: 2rem; background: var(--mdc-card); color: var(--mdc-ink); }
.mdc-pack__was { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; }
.mdc-pack__was del { font-size: 1.125rem; color: var(--mdc-muted); }
.mdc-pack__price { margin-top: .5rem !important; font: 400 4rem/1 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-pack__meta { margin-top: .4rem !important; font-size: .8125rem; color: var(--mdc-muted); }
.mdc-pack__box .mdc-btn { margin-top: 1.5rem; min-height: 3.25rem; }
.mdc-pack__note { margin-top: .9rem !important; font-size: .8125rem; line-height: 1.5; text-align: center; color: var(--mdc-muted); }

/* ---------- Pasos ---------- */
.mdc-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: 1.25rem; }
.mdc-step { background: var(--mdc-bg); }
.mdc-step__num { display: block; font: italic 400 2rem/1 var(--mdc-font-display); color: var(--mdc-wine-soft); }
.mdc-step__title { margin-top: .9rem !important; font-size: 1.45rem; line-height: 1.15; }
.mdc-step__text { margin-top: .6rem !important; font-size: .95rem; line-height: 1.6; color: var(--mdc-muted); }

/* ---------- Para vos / cifras ---------- */
.mdc-fit__title { margin: 0 0 1.25rem !important; font: 500 .75rem/1.4 var(--mdc-font-body) !important; letter-spacing: .2em; color: var(--mdc-wine-soft) !important; text-align: center; }
.mdc-fit__title--stats { margin-top: clamp(3rem, 6vw, 4rem) !important; }
.mdc-fit { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 1rem; }
.mdc-fit__item { line-height: 1.6; }
.mdc-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; margin: 0; text-align: center; }
.mdc-stat { margin: 0; padding: 1.25rem .5rem; border-top: 1px solid var(--mdc-wine); }
.mdc-stat__num { font: 300 3.5rem/1 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-stat__label { margin: .4rem 0 0; font-size: .875rem; line-height: 1.4; color: var(--mdc-muted); }

/* ---------- Autora (opcional) ---------- */
.mdc-about { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; align-items: center; padding: clamp(1.75rem, 4vw, 2.5rem); background: var(--mdc-card); border: 1px solid var(--mdc-accent); }
.mdc-about__media { max-width: 280px; width: 100%; }
.mdc-about__photo { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border: 6px solid var(--mdc-accent); }
.mdc-about__photo--placeholder { display: grid; place-items: center; background: var(--mdc-wine); color: var(--mdc-card); font: 300 clamp(5rem, 14vw, 7rem)/1 var(--mdc-font-display); }
.mdc-about__bio { margin-top: 1rem; color: var(--mdc-muted); }
.mdc-about__bio p + p { margin-top: 1rem; }
.mdc-quote { margin-top: 1.75rem !important; padding-left: 1.25rem; border-left: 2px solid var(--mdc-nude); }
.mdc-quote blockquote p { font: italic 400 clamp(1.35rem, 3vw, 1.7rem)/1.3 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-signature { margin-top: .9rem; font: italic 500 1.25rem/1 var(--mdc-font-display); color: var(--mdc-wine-soft); }
.mdc-signature::before { content: "— "; }

/* ---------- Preguntas (details/summary) ---------- */
.mdc-modules { border-top: 1px solid var(--mdc-wine); }
.mdc-mod { border-bottom: 1px solid var(--mdc-accent); }
.mdc-mod summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr) auto; align-items: center; gap: .75rem; padding: 1.2rem 0; }
.mdc-mod summary::-webkit-details-marker { display: none; }
.mdc-mod__num { font: 500 .78rem/1 var(--mdc-font-body); letter-spacing: .14em; color: var(--mdc-wine-soft); }
.mdc-mod__title { font: 400 1.375rem/1.25 var(--mdc-font-display); color: var(--mdc-wine); transition: transform .3s var(--mdc-ease); }
.mdc-mod summary:hover .mdc-mod__title { transform: translateX(3px); }
.mdc-mod__icon { position: relative; width: 1.9rem; height: 1.9rem; border: 1px solid var(--mdc-accent); border-radius: 50%; transition: background-color .3s var(--mdc-ease), border-color .3s; }
.mdc-mod__icon::before, .mdc-mod__icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: .65rem; height: 1.5px; margin: -.75px 0 0 -.325rem; background: var(--mdc-wine); transition: transform .35s var(--mdc-ease); }
.mdc-mod__icon::after { transform: rotate(90deg); }
.mdc-mod[open] .mdc-mod__icon { background: var(--mdc-wine); border-color: var(--mdc-wine); }
.mdc-mod[open] .mdc-mod__icon::before, .mdc-mod[open] .mdc-mod__icon::after { background: var(--mdc-card); }
.mdc-mod[open] .mdc-mod__icon::after { transform: rotate(0); }
.mdc-mod::details-content { block-size: 0; overflow: hidden; transition: block-size .45s var(--mdc-ease), content-visibility .45s allow-discrete; }
.mdc-mod[open]::details-content { block-size: auto; }
.mdc-mod__body { padding: 0 2.75rem 1.4rem 3.5rem; font-size: .975rem; line-height: 1.65; color: var(--mdc-muted); }
.mdc-mod[open] .mdc-mod__body { animation: mdc-reveal .45s var(--mdc-ease) both; }
@keyframes mdc-reveal { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- Footer ---------- */
.mdc-footer { background: var(--mdc-wine); color: var(--mdc-card); }
.mdc-footer__grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2rem 4rem; padding-top: 4rem; padding-bottom: 2rem; }
.mdc-footer__brand { flex: 1 1 17rem; }
.mdc-footer__name { font: 400 1.9rem/1 var(--mdc-font-display); }
.mdc-footer__text { margin-top: .65rem !important; max-width: 21rem; font-size: .875rem; line-height: 1.6; color: var(--mdc-accent); }
.mdc-footer__col { flex: 0 1 14rem; font-size: .875rem; line-height: 2; }
.mdc-footer__col a { display: block; text-decoration: none; color: var(--mdc-card); }
.mdc-footer__col a:hover { text-decoration: underline; }
.mdc-footer__head { font: 500 .6875rem/2 var(--mdc-font-body); letter-spacing: .2em; color: var(--mdc-nude); }
.mdc-footer__legal { padding: 1.1rem 0 1.75rem; border-top: 1px solid rgba(238, 228, 218, .2); font-size: .75rem; letter-spacing: .1em; color: var(--mdc-accent); }

/* ---------- Sticky bar (solo móvil) ---------- */
.mdc-sticky {
	position: fixed; z-index: 60; left: 0; right: 0; bottom: 0;
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: .75rem var(--mdc-gutter) calc(.75rem + env(safe-area-inset-bottom));
	background: rgba(248, 246, 242, .95);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	border-top: 1px solid var(--mdc-accent);
	transform: translateY(110%); visibility: hidden;
	transition: transform .4s var(--mdc-ease), visibility 0s linear .4s;
}
.mdc-sticky.is-visible { transform: none; visibility: visible; transition: transform .4s var(--mdc-ease), visibility 0s; }
.mdc-sticky__price { font: 400 1.6rem/1 var(--mdc-font-display); color: var(--mdc-wine); }
.mdc-sticky .mdc-btn { flex: 1 1 auto; max-width: 14rem; }

/* ---------- Responsive ---------- */
@media (min-width: 768px) {
	.mdc-sticky { display: none; }
	.mdc-about { grid-template-columns: 240px minmax(0, 1fr); }
}
@media (min-width: 960px) {
	.mdc-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 767px) {
	.mdc-nav { order: 3; width: 100%; gap: .1rem 1.25rem; }
	.mdc-footer { padding-bottom: 5rem; }
	.mdc-pack__list { grid-template-columns: minmax(0, 1fr); }
	.mdc-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mdc-mod__body { padding-right: 0; }
}