/* ==========================================================================
   SORTEO CLÍNICA — main.css (v2)
   Editorial premium, minimalista. Base marfil/crema, gris azulado de marca,
   negro suave para texto. Serif editorial para títulos, sans limpia para
   texto y navegación. Desktop-first con adaptación móvil completa.
   ========================================================================== */

/* ---------- 1. TOKENS ---------- */
:root {
	--color-bg: #FAF7F1;
	--color-bg-alt: #F3EFE6;
	--color-white: #FFFFFF;
	--color-ink: #21201D;
	--color-ink-soft: #56534C;
	--color-line: #DBD4C4;
	--color-accent: #7AA8CD;
	--color-accent-deep: #617074;
	--color-accent-mist: #A8D2D3;

	--font-display: 'Cormorant Garamond', 'Times New Roman', serif;
	--font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	--container-w: 1180px;
	--container-w-narrow: 720px;

	--space-xs: 0.5rem;
	--space-s: 1rem;
	--space-m: 2rem;
	--space-l: 4rem;
	--space-xl: 6rem;

	--radius: 2px;
	--transition: 320ms ease;
}

/* ---------- 2. RESET / BASE ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-ink);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4 { margin: 0; font-family: var(--font-display); font-weight: 500; }
p { margin: 0; }
.sr-only {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
:focus-visible { outline: 2px solid var(--color-accent-deep); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	* { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

.sorteo-container { max-width: var(--container-w); margin: 0 auto; padding: 0 var(--space-m); }
.sorteo-container--narrow { max-width: var(--container-w-narrow); }

.sorteo-section { padding: var(--space-xl) 0; }
.sorteo-section__eyebrow {
	font-size: 0.78rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-accent-deep);
	margin-bottom: var(--space-xs);
}
.sorteo-section__title {
	font-size: clamp(1.9rem, 3.4vw, 2.7rem);
	font-weight: 500;
	letter-spacing: 0.01em;
	margin-bottom: var(--space-m);
	color: var(--color-ink);
}

/* ---------- 3. BOTONES ---------- */
.sorteo-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--font-sans);
	font-size: 0.85rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.95rem 2.1rem;
	border: 1px solid var(--color-ink);
	border-radius: var(--radius);
	transition: background var(--transition), color var(--transition), border-color var(--transition);
	cursor: pointer;
	background: transparent;
}
.sorteo-btn--primary { background: var(--color-accent-deep); color: var(--color-white); border-color: var(--color-accent-deep); }
.sorteo-btn--primary:hover { background: var(--color-ink); border-color: var(--color-ink); }
.sorteo-btn--outline { border-color: var(--color-accent-deep); color: var(--color-accent-deep); }
.sorteo-btn--outline:hover { background: var(--color-accent-deep); color: var(--color-white); }
.sorteo-pack__cta { width: 100%; justify-content: center; margin-top: auto; }
.sorteo-btn--nav { background: var(--color-accent-deep); border-color: var(--color-accent-deep); color: var(--color-white); font-size: 0.75rem; padding: 0.7rem 1.5rem; }
.sorteo-btn--nav:hover { background: var(--color-ink); border-color: var(--color-ink); color: var(--color-white); }
.sorteo-btn--large { padding: 1.3rem 3rem; font-size: 0.95rem; }
.sorteo-btn--whatsapp { background: var(--color-accent-deep); color: var(--color-white); border-color: var(--color-accent-deep); }
.sorteo-btn--whatsapp:hover { background: var(--color-ink); border-color: var(--color-ink); }

/* ---------- 4. HEADER ---------- */
.sorteo-header {
	position: fixed; top: 0; left: 0; right: 0; z-index: 100;
	padding: 1.4rem 0;
	transition: background var(--transition), padding var(--transition), box-shadow var(--transition);
}
.sorteo-header.is-scrolled {
	background: rgba(250, 247, 241, 0.96);
	backdrop-filter: blur(6px);
	padding: 0.85rem 0;
	box-shadow: 0 1px 0 var(--color-line);
}
.sorteo-header__inner {
	max-width: var(--container-w); margin: 0 auto; padding: 0 var(--space-m);
	display: flex; align-items: center; justify-content: space-between;
}
.sorteo-header__logo { display: inline-flex; align-items: center; }
.sorteo-header__logo img,
.sorteo-header__logo-img {
	width: auto;
	height: auto;
	max-height: 100px;
	max-width: 220px;
	object-fit: contain;
}
.sorteo-header__nav { display: flex; align-items: center; gap: var(--space-l); }
.sorteo-header__menu { display: flex; align-items: center; gap: var(--space-m); }
.sorteo-header__menu a {
	font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--color-ink); padding-bottom: 4px; border-bottom: 1px solid transparent;
	transition: border-color var(--transition), color var(--transition);
}
.sorteo-header__menu a:hover { border-color: currentColor; }

.sorteo-header__toggle {
	display: none; flex-direction: column; justify-content: center; gap: 5px;
	width: 34px; height: 34px; background: none; border: none; cursor: pointer; padding: 0;
	position: relative; z-index: 210;
}
.sorteo-header__toggle span { display: block; height: 1px; width: 100%; background: var(--color-ink); transition: transform var(--transition), opacity var(--transition), background var(--transition); }
.sorteo-header__toggle.is-active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.sorteo-header__toggle.is-active span:nth-child(2) { opacity: 0; }
.sorteo-header__toggle.is-active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- 5. HERO ---------- */
.sorteo-hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.sorteo-hero__media { position: absolute; inset: 0; z-index: 0; }
.sorteo-hero__img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.sorteo-hero__scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(250,247,241,0.35) 0%, rgba(250,247,241,0.55) 100%); }
.sorteo-hero__content {
	position: relative; z-index: 2; text-align: center; color: var(--color-ink);
	max-width: 640px; padding: 0 var(--space-m);
	display: flex; flex-direction: column; align-items: center;
	margin-top: 14vh;
}
.sorteo-hero__logo { margin-bottom: var(--space-m); }
.sorteo-hero__logo img { max-height: 96px; width: auto; margin: 0 auto; }
.sorteo-hero__eyebrow {
	font-family: var(--font-display); font-size: clamp(2.2rem, 5vw, 3.8rem);
	letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 0.2rem; color: var(--color-ink); font-weight: 500;
}
.sorteo-hero__title { font-size: clamp(3.2rem, 8vw, 5.6rem); line-height: 0.95; font-weight: 500; letter-spacing: 0.02em; color: #4A7FA8; }
.sorteo-hero__subtitle {
	font-family: var(--font-display); font-size: clamp(1.3rem, 2.4vw, 1.7rem); font-style: italic;
	margin-top: 0.4rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-accent-deep);
}
.sorteo-hero__secondary { margin-top: var(--space-s); font-size: 0.95rem; color: var(--color-ink-soft); }
.sorteo-hero__badge {
	margin-top: var(--space-m); border: 1.5px solid #2E4A63; color: #2E4A63;
	padding: 1rem 2.4rem; font-size: 1.15rem; letter-spacing: 0.06em; text-transform: uppercase;
	font-family: var(--font-sans); font-weight: 700; border-radius: 999px;
}
.sorteo-hero__content .sorteo-btn { margin-top: var(--space-m); }
.sorteo-hero__fineprint { margin-top: var(--space-s); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-soft); }

/* Entrada del hero: único momento animado orquestado */
.sorteo-hero__content > * { opacity: 0; animation: sorteoHeroIn 900ms ease forwards; }
.sorteo-hero__logo      { animation-delay: 60ms; }
.sorteo-hero__eyebrow   { animation-delay: 180ms; }
.sorteo-hero__title     { animation-delay: 260ms; }
.sorteo-hero__subtitle  { animation-delay: 360ms; }
.sorteo-hero__secondary { animation-delay: 440ms; }
.sorteo-hero__badge     { animation-delay: 520ms; }
.sorteo-hero__content .sorteo-btn { animation-delay: 600ms; }
.sorteo-hero__fineprint { animation-delay: 680ms; }
@keyframes sorteoHeroIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .sorteo-hero__content > * { animation: none; opacity: 1; } }

/* ---------- 6. INFOBAR / CONCURSO (info + números disponibles) ---------- */
.sorteo-infobar { background: var(--color-bg-alt); color: var(--color-ink); padding: var(--space-m) 0; border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); }
.sorteo-infobar__inner {
	max-width: var(--container-w); margin: 0 auto; padding: 0 var(--space-m);
	display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-m) var(--space-s);
	margin-bottom: var(--space-m);
}
.sorteo-infobar__item { display: flex; align-items: flex-start; gap: 0.6rem; text-align: left; border-left: 1px solid var(--color-line); padding-left: var(--space-s); flex: 1 1 180px; }
.sorteo-infobar__item:first-child { border-left: none; padding-left: 0; }
.sorteo-infobar__icon { color: var(--color-accent-deep); flex-shrink: 0; margin-top: 1px; }
.sorteo-infobar__icon svg { width: 20px; height: 20px; display: block; }
.sorteo-infobar__text { display: flex; flex-direction: column; gap: 0.15rem; }
.sorteo-infobar__label { font-family: var(--font-sans); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ink-soft); font-weight: 600; }
.sorteo-infobar__value { font-family: var(--font-sans); font-size: 0.85rem; font-weight: 600; color: var(--color-ink); }
.sorteo-infobar__value a { border-bottom: 1px solid var(--color-line); }
.sorteo-infobar__sitio-link { text-transform: none !important; }
.sorteo-numeros-disponibles {
	display: inline-flex; flex-direction: column; align-items: center;
	border: 1px solid var(--color-accent-deep); padding: var(--space-s) var(--space-m);
}
.sorteo-numeros-disponibles__label { font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ink-soft); }
.sorteo-numeros-disponibles__valor { font-family: var(--font-display); font-size: 2.1rem; color: var(--color-ink); }

/* ---------- 7. PACKS / COMPRA ---------- */
.sorteo-compra { text-align: center; }
.sorteo-compra__foto { max-width: 640px; margin: 0 auto var(--space-l); }
.sorteo-packs { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-m); text-align: left; }
.sorteo-pack {
	position: relative; background: var(--color-white); border: 1px solid var(--color-line);
	padding: var(--space-m) var(--space-s) var(--space-s);
	display: flex; flex-direction: column; gap: var(--space-xs);
	transition: border-color var(--transition);
}
.sorteo-pack:hover { border-color: var(--color-accent-deep); }
.sorteo-pack--destacado { border-color: var(--color-accent-deep); border-width: 1.5px; }
.sorteo-pack__tag {
	position: absolute; top: -12px; left: var(--space-s);
	background: var(--color-accent-deep); color: var(--color-white);
	font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.3rem 0.7rem;
}
.sorteo-pack__icon { color: var(--color-accent-deep); margin-bottom: 0.4rem; }
.sorteo-pack__icon img { width: 100%; height: 90px; object-fit: contain; }
.sorteo-pack__cantidad { font-family: var(--font-display); font-size: 1.5rem; }
.sorteo-pack__precio { margin: 0.2rem 0 0.8rem; display: flex; align-items: baseline; gap: 0.6rem; }
.sorteo-pack__precio-anterior { text-decoration: line-through; color: var(--color-ink-soft); font-size: 0.85rem; }
.sorteo-pack__precio-actual { font-family: var(--font-display); font-size: 1.4rem; }
.sorteo-pack__admin-note { font-size: 0.68rem; color: #A15C4A; margin-top: 0.5rem; line-height: 1.4; }

/* ---------- 8. PREMIO ---------- */
.sorteo-premio__texto { text-align: left; color: var(--color-ink-soft); }
.sorteo-premio__texto p { margin-bottom: var(--space-s); }
.sorteo-premio__subtitulo { font-size: 1.4rem; color: var(--color-ink); margin: var(--space-m) 0 var(--space-s); }

/* ---------- 9. CÓMO PARTICIPAR (pasos) ---------- */
.sorteo-pasos { background: var(--color-bg); text-align: center; }
.sorteo-pasos__eyebrow-center, .sorteo-pasos__titulo-center { text-align: center; }
.sorteo-pasos__grid {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-m);
	margin: var(--space-m) 0 var(--space-l); text-align: left;
}
.sorteo-paso-item {
	border-left: 1px solid var(--color-line); padding-left: var(--space-s);
	display: flex; flex-direction: column; gap: 0.4rem;
}
.sorteo-paso-item:first-child { border-left: none; padding-left: 0; }
.sorteo-paso-item__num {
	width: 30px; height: 30px; border: 1px solid var(--color-accent-deep); border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-family: var(--font-display); font-size: 0.95rem; color: var(--color-accent-deep);
	margin-bottom: 0.2rem;
}
.sorteo-paso-item__icon { color: var(--color-ink); }
.sorteo-paso-item__icon svg { width: 26px; height: 26px; }
.sorteo-paso-item__titulo {
	font-family: var(--font-sans); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase;
	font-weight: 600; color: var(--color-ink); padding-bottom: 0.4rem; border-bottom: 1px solid var(--color-line);
	margin-bottom: 0.3rem; max-width: fit-content;
}
.sorteo-paso-item__texto { color: var(--color-ink-soft); font-size: 0.85rem; }
.sorteo-paso-item__texto a { border-bottom: 1px solid var(--color-line); }
.sorteo-pasos__limite { font-family: var(--font-display); font-size: 1.3rem; margin: var(--space-m) 0 var(--space-s); }
.sorteo-pasos__fineprint p { color: var(--color-ink-soft); font-size: 0.82rem; margin-bottom: var(--space-xs); }
.sorteo-pasos__cta { margin-top: var(--space-m); }

/* ---------- 10. COUNTDOWN (cierre de compra) ---------- */
.sorteo-countdown-section { text-align: center; }
.sorteo-countdown-box { border: 1px solid var(--color-line); padding: var(--space-l) var(--space-m); margin-bottom: var(--space-m); }
.sorteo-countdown__grid { display: flex; justify-content: center; gap: var(--space-m); margin-bottom: var(--space-m); }
.sorteo-countdown__item { display: flex; flex-direction: column; min-width: 64px; }
.sorteo-countdown__item span { font-family: var(--font-display); font-size: 2.4rem; color: var(--color-ink); }
.sorteo-countdown__item small { font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ink-soft); }
.sorteo-countdown__nota { color: var(--color-ink-soft); font-size: 0.88rem; max-width: 42ch; margin: 0 auto; }

/* ---------- 11. BASES / CONDICIONES ---------- */
.sorteo-bases__lista { display: flex; flex-direction: column; gap: var(--space-s); margin-bottom: var(--space-m); }
.sorteo-bases__lista li { padding-left: var(--space-s); border-left: 2px solid var(--color-accent-deep); color: var(--color-ink-soft); font-size: 0.95rem; }
.sorteo-bases__enlaces { display: flex; gap: var(--space-s); flex-wrap: wrap; }
.sorteo-bases__admin-note { margin-top: var(--space-s); font-size: 0.7rem; color: #A15C4A; }

/* ---------- 12. CONTACTO ---------- */
.sorteo-contacto { background: var(--color-ink); color: var(--color-white); }
.sorteo-contacto .sorteo-section__title, .sorteo-contacto .sorteo-section__eyebrow { color: var(--color-white); }
.sorteo-contacto__intro p { color: rgba(255,255,255,0.75); max-width: 56ch; margin-bottom: var(--space-m); }
.sorteo-contacto__lista { display: flex; flex-direction: column; gap: var(--space-s); margin-bottom: var(--space-m); }
.sorteo-contacto__lista li { display: flex; flex-direction: column; gap: 0.15rem; }
.sorteo-contacto__label { font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.6; }
.sorteo-contacto__lista a { border-bottom: 1px solid rgba(255,255,255,0.3); }
.sorteo-contacto__notas p { color: rgba(255,255,255,0.7); font-size: 0.88rem; margin-bottom: var(--space-xs); max-width: 56ch; }

/* ---------- 13. GANADOR / RESULTADO ---------- */
.sorteo-ganador { text-align: center; }
.sorteo-ganador__nota { color: var(--color-ink-soft); max-width: 46ch; margin: 0 auto var(--space-m); }
.sorteo-ganador__placeholder {
	border: 1px dashed var(--color-line); padding: var(--space-l) var(--space-m);
	color: var(--color-ink-soft); font-size: 0.85rem;
}

/* ---------- 14. FOOTER ---------- */
.sorteo-footer { background: var(--color-bg-alt); border-top: 1px solid var(--color-line); }
.sorteo-footer__inner {
	max-width: var(--container-w); margin: 0 auto; padding: var(--space-l) var(--space-m);
	display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--space-m); align-items: start;
}
.sorteo-footer__logo-img,
.sorteo-footer__brand img { max-height: 52px; margin-bottom: var(--space-s); width: auto; }
.sorteo-footer__tagline { color: var(--color-ink-soft); font-size: 0.85rem; margin-top: 0.4rem; }
.sorteo-footer__links { display: flex; flex-direction: column; gap: 0.5rem; }
.sorteo-footer__links a, .sorteo-footer__direccion { font-size: 0.85rem; border-bottom: 1px solid transparent; }
.sorteo-footer__links a:hover { border-color: var(--color-ink); }
.sorteo-footer__direccion { color: var(--color-ink-soft); }
.sorteo-footer__meta { text-align: right; font-size: 0.8rem; color: var(--color-ink-soft); }
.sorteo-footer__creado-por {
	text-align: center; padding: var(--space-s) var(--space-m);
	border-top: 1px solid var(--color-line);
	font-size: 0.75rem; color: var(--color-ink-soft);
}
.sorteo-footer__creado-por a { border-bottom: 1px solid var(--color-line); }

/* ---------- 15. LEGAL / FALLBACK ---------- */
.sorteo-legal, .sorteo-fallback { padding: calc(var(--space-xl) + 3rem) 0 var(--space-xl); }
.sorteo-legal__title { font-size: 2.2rem; margin-bottom: var(--space-m); }
.sorteo-legal__content { color: var(--color-ink-soft); }
.sorteo-legal__content p { margin-bottom: var(--space-s); }

/* ---------- 16. WOOCOMMERCE: CHECKBOX BASES + THANK YOU ---------- */
.sorteo-checkbox-bases label { font-size: 0.85rem; color: var(--color-ink-soft); }
.sorteo-checkbox-bases a { text-decoration: underline; color: var(--color-accent-deep); }
.sorteo-thankyou {
	text-align: center; border: 1px solid var(--color-line); padding: var(--space-l) var(--space-m);
	margin: var(--space-m) 0; background: var(--color-white);
}
.sorteo-thankyou__title { font-size: 1.9rem; margin-bottom: var(--space-s); }
.sorteo-thankyou__label { font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-soft); margin-bottom: 0.4rem; }
.sorteo-thankyou__numeros { font-family: var(--font-display); font-size: 1.8rem; margin-bottom: var(--space-m); }
.sorteo-thankyou__nota { color: var(--color-ink-soft); font-size: 0.85rem; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1024px) {
	.sorteo-packs { grid-template-columns: repeat(2, 1fr); }
	.sorteo-footer__inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
	:root { --space-xl: 4rem; --space-l: 2.5rem; }

	.sorteo-header__toggle { display: flex; }
	.sorteo-header__nav {
		position: fixed; top: 0; right: 0; height: 100vh; width: min(78vw, 320px);
		background: var(--color-bg); flex-direction: column; align-items: flex-start;
		justify-content: center; gap: var(--space-m); padding: var(--space-l) var(--space-m);
		transform: translateX(100%); transition: transform var(--transition);
		box-shadow: -8px 0 24px rgba(0,0,0,0.08);
	}
	.sorteo-header__nav.is-open { transform: translateX(0); }
	.sorteo-header__menu { flex-direction: column; align-items: flex-start; gap: var(--space-s); }
	.sorteo-header__menu a { color: var(--color-ink); }
	.sorteo-btn--nav { background: var(--color-accent-deep); border-color: var(--color-accent-deep); color: var(--color-white); }
	.sorteo-header__toggle span { background: var(--color-ink); }
	.sorteo-header__logo img,
	.sorteo-header__logo-img { max-height: 72px; max-width: 150px; }

	.sorteo-hero { padding-top: 140px; }
	.sorteo-hero__content { max-width: 90%; margin-top: 0; }

	.sorteo-infobar__inner { flex-direction: column; gap: var(--space-s); }
	.sorteo-infobar__item { border-left: none; padding-left: 0; flex: 1 1 auto; }

	.sorteo-packs { grid-template-columns: 1fr; }
	.sorteo-pasos__grid { grid-template-columns: 1fr; gap: var(--space-m); }
	.sorteo-paso-item { border-left: none; padding-left: 0; border-top: 1px solid var(--color-line); padding-top: var(--space-s); }
	.sorteo-paso-item:first-child { border-top: none; padding-top: 0; }

	.sorteo-footer__inner { grid-template-columns: 1fr; text-align: left; gap: var(--space-m); }
	.sorteo-footer__meta { text-align: left; }

	.sorteo-countdown__grid { gap: var(--space-s); }
	.sorteo-countdown__item { min-width: 52px; }
	.sorteo-countdown__item span { font-size: 1.8rem; }

	.sorteo-bases__enlaces { flex-direction: column; }
	.sorteo-bases__enlaces .sorteo-btn { width: 100%; justify-content: center; }
}

@media (max-width: 480px) {
	.sorteo-hero { padding-top: 120px; }
	.sorteo-hero__eyebrow { font-size: 1.9rem; }
	.sorteo-hero__title { font-size: 3rem; }
	.sorteo-hero__badge { padding: 0.75rem 1.5rem; font-size: 0.85rem; }
	.sorteo-btn { padding: 0.85rem 1.6rem; font-size: 0.78rem; }
	.sorteo-btn--large { padding: 0.85rem 1.8rem; font-size: 0.8rem; }
}

/* ==========================================================================
   17. CARRITO CLÁSICO DE WOOCOMMERCE ([woocommerce_cart])
   Una sola tarjeta continua: producto + subtotal + botón "Finalizar
   compra", todo junto, sin una segunda caja separada ni título de
   relleno. Solo aplica dentro de la página de carrito.
   ========================================================================== */
.woocommerce-cart .entry-content {
	max-width: 880px;
	margin: 0 auto;
	padding: 0 var(--space-m) var(--space-xl);
}

/* La tarjeta única: todo el contenido del carrito vive adentro de este
   wrapper nativo de WooCommerce — se convierte él mismo en la tarjeta
   blanca con borde redondeado y sombra, en vez de tener una tarjeta para
   la tabla y otra distinta para el total. */
.woocommerce-cart .woocommerce {
	font-family: var(--font-sans);
	background: #FFFFFF;
	border: 1px solid var(--color-line);
	border-radius: 20px;
	box-shadow: 0 10px 28px rgba(33,32,29,0.07);
	overflow: hidden;
	margin-top: var(--space-m);
}

/* Avisos de WooCommerce (ej. errores de validación) */
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error {
	list-style: none;
	background: var(--color-bg-alt);
	border-left: 3px solid var(--color-accent-deep);
	padding: 1rem 1.8rem;
	margin: 0;
	font-size: 0.9rem;
	color: var(--color-ink);
}
.woocommerce-cart .woocommerce-message a,
.woocommerce-cart .woocommerce-info a {
	color: var(--color-accent-deep);
	text-decoration: underline;
}

/* Tabla del producto: sin su propio borde/sombra — ahora es parte de la
   tarjeta única de arriba. */
.woocommerce-cart table.cart,
.woocommerce-cart table.shop_table {
	width: 100%;
	border-collapse: collapse;
	background: transparent;
	border: none;
	box-shadow: none;
	margin: 0;
}
.woocommerce-cart table.cart thead { display: none; }
.woocommerce-cart table.cart tr { border-bottom: 1px solid var(--color-line); }
.woocommerce-cart table.cart td {
	padding: 1.3rem 1.8rem;
	font-size: 0.95rem;
	color: var(--color-ink);
	vertical-align: middle;
	line-height: 1.5;
}
.woocommerce-cart table.cart td.product-name { font-weight: 600; font-size: 1.05rem; }
.woocommerce-cart table.cart td.product-name a { color: var(--color-ink); }
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal { font-family: var(--font-sans); font-weight: 700; font-size: 1.05rem; color: var(--color-accent-deep); }

/* Ícono de eliminar */
.woocommerce-cart table.cart td.product-remove { padding: 1.1rem 1.8rem 0.4rem; }
.woocommerce-cart table.cart td.product-remove a.remove {
	display: inline-flex; align-items: center; justify-content: center;
	width: 30px; height: 30px; border-radius: 50%;
	background: rgba(209,67,67,0.1); color: #D14343 !important;
	font-size: 1.15rem; line-height: 1; text-decoration: none;
	transition: background 160ms ease;
}
.woocommerce-cart table.cart td.product-remove a.remove:hover { background: rgba(209,67,67,0.2); }

/* En mobile: label arriba, valor abajo (más aire, nada apretado) */
@media (max-width: 768px) {
	.woocommerce-cart table.cart td {
		display: block; text-align: left; padding: 1rem 1.4rem;
	}
	.woocommerce-cart table.cart td::before {
		content: attr(data-title) ":";
		display: block; margin-bottom: 0.3rem;
		font-weight: 700; color: var(--color-ink-soft);
		font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase;
	}
	.woocommerce-cart table.cart td.product-remove { text-align: right; padding: 1rem 1.4rem 0; }
	.woocommerce-cart table.cart td.product-remove::before { display: none; }
}

/* Oculta el botón "Actualizar carrito" y su fila entera. */
.woocommerce-cart .actions { display: none !important; }

/* El bloque de totales sigue INMEDIATAMENTE después de la tabla, dentro
   de la misma tarjeta — sin caja propia, sin sombra propia, solo una
   línea divisoria (igual que entre las filas de arriba) y sin título
   "Total del carrito" (se oculta, es redundante). */
.woocommerce-cart .cart-collaterals { margin: 0; }
.woocommerce-cart .cart_totals {
	background: transparent; border: none; box-shadow: none; border-radius: 0;
	margin: 0; padding: 1.3rem 1.8rem 1.8rem;
	border-top: 1px solid var(--color-line);
}
.woocommerce-cart .cart_totals h2 { display: none; }
/* Solo se muestra la fila de Total — cualquier otra fila del resumen
   (Subtotal, envío, impuestos, etc.) se oculta, sea cual sea su clase
   exacta, para no repetir el subtotal que ya se ve en la fila del
   producto de arriba. */
.woocommerce-cart .cart_totals table tr:not(.order-total) { display: none; }
.woocommerce-cart .cart_totals table tr.order-total { border-top: none; }
.woocommerce-cart .cart_totals table { width: 100%; border-collapse: collapse; }
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
	padding: 0.7rem 0; border-top: 1px solid var(--color-line);
	font-family: var(--font-sans); font-size: 0.95rem; color: var(--color-ink);
}
.woocommerce-cart .cart_totals table tr:first-child th,
.woocommerce-cart .cart_totals table tr:first-child td { border-top: none; }
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td { font-weight: 800; font-size: 1.25rem; color: var(--color-accent-deep); }

/* Botón "Finalizar compra" — pegado justo debajo del total, dentro de la
   misma tarjeta, sin scroll de más para verlo. */
.woocommerce-cart .wc-proceed-to-checkout { margin-top: 1.2rem; padding: 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	display: block; width: 100%; text-align: center; text-decoration: none;
	background: linear-gradient(135deg, #617074, #7AA8CD); color: #FFFFFF;
	border-radius: 999px; padding: 1.1rem 1.6rem;
	font-family: var(--font-sans); font-size: 0.9rem; letter-spacing: 0.06em; text-transform: uppercase;
	font-weight: 700; transition: opacity 160ms ease, transform 160ms ease;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { opacity: 0.88; transform: translateY(-1px); }

@media (max-width: 600px) {
	.woocommerce-cart .cart_totals { padding: 1.1rem 1.4rem 1.4rem; }
}

/* ==========================================================================
   18. CHECKOUT CLÁSICO DE WOOCOMMERCE ([woocommerce_checkout])
   Mismo lenguaje visual del resto del sitio: fondo marfil, Cormorant
   Garamond en títulos, DM Sans en formularios, colores de marca, campos
   redondeados, mucho aire, botones en píldora. Nada de esto toca lógica,
   precios, packs ni pagos — es solo apariencia sobre los mismos campos
   que WooCommerce ya procesa. Cuidado especial en mobile.
   ========================================================================== */
.woocommerce-checkout .entry-content {
	max-width: 1040px;
	margin: 0 auto;
	padding: var(--space-m) var(--space-m) var(--space-xl);
	font-family: var(--font-sans);
}

/* Títulos de sección ("Detalles de facturación", "Tu pedido") */
.woocommerce-checkout h3 {
	font-family: var(--font-display); font-size: 1.5rem; font-weight: 500;
	color: var(--color-ink); margin: 0 0 1.4rem;
}

/* Las dos columnas del checkout (datos del cliente / resumen del pedido)
   se convierten cada una en su propia tarjeta clara y espaciosa. */
.woocommerce-checkout .col2-set { display: flex; flex-wrap: wrap; gap: var(--space-m); }
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { flex: 1 1 380px; min-width: 0; }

.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
	background: #FFFFFF;
	border: 1px solid var(--color-line);
	border-radius: 20px;
	box-shadow: 0 10px 28px rgba(33,32,29,0.06);
	padding: 1.8rem 1.8rem 2rem;
}
.woocommerce-checkout #order_review_heading { padding-bottom: 0; border-bottom: none; margin-bottom: -1px; border-radius: 20px 20px 0 0; box-shadow: none; }
.woocommerce-checkout #order_review { border-radius: 0 0 20px 20px; margin-top: 0; }

/* Campos del formulario */
.woocommerce-checkout .form-row { margin: 0 0 1.3rem; }
.woocommerce-checkout .form-row label {
	display: block; margin-bottom: 0.45rem;
	font-family: var(--font-sans) !important; font-size: 0.76rem; letter-spacing: 0.06em; text-transform: uppercase;
	color: var(--color-ink-soft) !important; font-weight: 700;
}
.woocommerce-checkout .form-row label.woocommerce-invalid-required-field { color: var(--color-ink-soft) !important; }
.woocommerce-checkout .form-row .required { color: #D14343 !important; text-decoration: none; }
.woocommerce-checkout .form-row.woocommerce-invalid input.input-text { border-color: #D14343 !important; }
.woocommerce-checkout input.input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
	width: 100% !important; padding: 0.95rem 1.15rem !important;
	border: 1.5px solid var(--color-line) !important; border-radius: 14px !important;
	background: #FFFFFF !important;
	font-family: var(--font-sans) !important; font-size: 0.98rem !important; color: var(--color-ink) !important;
	box-shadow: 0 2px 6px rgba(33,32,29,0.03);
	transition: border-color 180ms ease, box-shadow 180ms ease;
	-webkit-appearance: none; appearance: none;
}
.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
	outline: none !important; border-color: var(--color-accent) !important;
	box-shadow: 0 0 0 4px rgba(122,168,205,0.18) !important;
}
.woocommerce-checkout ::placeholder { color: #b7b1a4; }

/* Respaldo: oculta cualquier checkbox de opt-in de marketing/newsletter
   que no venga de WooCommerce core (ej. lo agrega el plugin "Creative
   Mail for WooCommerce"), sin depender de saber su nombre exacto de
   campo — se detecta por contener "marketing" en el name/id del input. */
.woocommerce-checkout .form-row:has(input[name*="marketing" i]),
.woocommerce-checkout .form-row:has(input[id*="marketing" i]),
.woocommerce-checkout .form-row:has(input[name*="newsletter" i]),
.woocommerce-checkout .form-row:has(input[id*="newsletter" i]) {
	display: none !important;
}

/* Checkbox de Bases y Política de Privacidad (sorteo_checkout_bases_checkbox) */
.woocommerce-checkout .sorteo-checkbox-bases {
	margin: 1.6rem 0 0; padding: 1.1rem 1.2rem;
	background: var(--color-bg-alt); border-radius: 14px;
	font-family: var(--font-sans);
}
.woocommerce-checkout .sorteo-checkbox-bases label { font-size: 0.85rem; color: var(--color-ink); display: flex; gap: 0.6rem; align-items: flex-start; }
.woocommerce-checkout .sorteo-checkbox-bases input[type="checkbox"] { margin-top: 0.2rem; accent-color: var(--color-accent-deep); }
.woocommerce-checkout .sorteo-checkbox-bases a { color: var(--color-accent-deep); text-decoration: underline; }

/* Resumen del pedido (pack, cantidad, precio total) */
.woocommerce-checkout table.shop_table {
	width: 100%; border-collapse: collapse; margin: 0 0 1.4rem;
}
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
	padding: 0.9rem 0; border-top: 1px solid var(--color-line);
	font-family: var(--font-sans); font-size: 0.92rem; color: var(--color-ink);
	text-align: left;
}
.woocommerce-checkout table.shop_table thead th { border-top: none; font-size: 0.7rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-soft); }
.woocommerce-checkout table.shop_table .product-name { font-weight: 600; }
.woocommerce-checkout table.shop_table .product-total,
.woocommerce-checkout table.shop_table .amount { font-weight: 700; color: var(--color-accent-deep); }
.woocommerce-checkout table.shop_table tfoot .order-total .amount { font-size: 1.2rem; font-weight: 800; }

/* Métodos de pago (aún sin configurar — solo se prepara el contenedor) */
.woocommerce-checkout #payment { background: var(--color-bg-alt) !important; border-radius: 14px !important; padding: 1.2rem !important; margin-top: 1rem; }
.woocommerce-checkout #payment ul.payment_methods { margin: 0; padding: 0; }
.woocommerce-checkout #payment .woocommerce-info,
.woocommerce-checkout .woocommerce-info {
	background: transparent !important; border: none !important; margin: 0 !important; padding: 0.4rem 0 !important;
	font-family: var(--font-sans) !important; font-size: 0.88rem !important; color: var(--color-ink-soft) !important;
	list-style: none;
}
/* Oculta el ícono decorativo que a veces no carga bien y deja un cuadrito
   vacío antes del texto del aviso. */
.woocommerce-checkout .woocommerce-info::before { content: none !important; display: none !important; }

/* Botón "Realizar el pedido" — mismo degradado azul-gris de marca, nunca
   el morado por defecto de WooCommerce. */
.woocommerce-checkout #place_order,
.woocommerce-checkout button#place_order,
.woocommerce-checkout .woocommerce-checkout #place_order {
	display: block !important; width: 100% !important; margin-top: 1.4rem !important;
	background: linear-gradient(135deg, #617074, #7AA8CD) !important; color: #FFFFFF !important;
	border: none !important; border-radius: 999px !important; padding: 1.15rem 1.6rem !important;
	font-family: var(--font-sans) !important; font-size: 0.92rem !important; letter-spacing: 0.07em !important; text-transform: uppercase !important;
	font-weight: 700 !important; cursor: pointer; box-shadow: 0 10px 24px rgba(97,112,116,0.28);
	transition: opacity 160ms ease, transform 160ms ease;
}
.woocommerce-checkout #place_order:hover { opacity: 0.9; transform: translateY(-1px); }

/* Avisos/errores de validación */
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-message {
	list-style: none; background: var(--color-bg-alt);
	border-left: 3px solid var(--color-accent-deep); border-radius: 12px;
	padding: 1rem 1.2rem; margin: 0 0 1.4rem;
	font-family: var(--font-sans); font-size: 0.9rem; color: var(--color-ink);
}

/* Mobile: una sola columna, campos y tarjetas a todo el ancho, con aire */
@media (max-width: 900px) {
	.woocommerce-checkout .col2-set .col-1,
	.woocommerce-checkout .col2-set .col-2 { flex: 1 1 100%; }
}
@media (max-width: 600px) {
	.woocommerce-checkout .entry-content { padding: var(--space-s) var(--space-s) var(--space-l); }
	.woocommerce-checkout #customer_details,
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review { padding: 1.4rem 1.2rem 1.6rem; }
	.woocommerce-checkout h3 { font-size: 1.3rem; }
}
/* ==========================================================================
   19. SECCIÓN #ganador — ANUNCIO DEL SORTEO EN VIVO + CTA A WINNER REVEAL
   Puramente informativa: no hay ninguna ruleta ni lógica de sorteo aquí.
   El botón lleva a la página oficial "Winner Reveal" que controla
   WinRocket (template-parts/ganador.php la busca por título y arma la
   URL — este archivo solo la viste).
   ========================================================================== */
.gn-eyebrow-center, .gn-titulo-center { text-align: center; }

.sorteo-ganador .gn-card {
	position: relative; overflow: hidden;
	max-width: 760px; margin: 0 auto; padding: 3rem 2.4rem;
	border-radius: 24px; text-align: center;
	background: linear-gradient(150deg, #21201D 0%, #33393b 55%, #3c4b52 100%);
	box-shadow: 0 20px 44px rgba(33,32,29,0.22);
	opacity: 0; transform: translateY(16px); animation: gnFadeUp 650ms ease forwards;
}
.sorteo-ganador .gn-card::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(115deg, transparent 30%, rgba(122,168,205,0.16) 45%, transparent 62%);
	transform: translateX(-140%); animation: gnShine 3400ms ease-in-out 1000ms infinite;
}
@keyframes gnShine { 0%, 60% { transform: translateX(-140%); } 100% { transform: translateX(140%); } }
@keyframes gnFadeUp { to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
	.sorteo-ganador .gn-card { animation: none; opacity: 1; transform: none; }
	.sorteo-ganador .gn-card::after { display: none; }
}

.sorteo-ganador .gn-badge {
	position: relative; z-index: 1;
	display: inline-flex; align-items: center; gap: 0.5rem; margin: 0 auto 1.4rem;
	padding: 0.45rem 1.1rem; border-radius: 999px;
	background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.3); color: #FFFFFF;
	font-family: var(--font-sans); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
}
.sorteo-ganador .gn-badge-dot {
	width: 8px; height: 8px; border-radius: 50%; background: var(--color-accent);
	box-shadow: 0 0 10px rgba(122,168,205,0.9);
	animation: gnPulse 1600ms ease-in-out infinite;
}
@keyframes gnPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { .sorteo-ganador .gn-badge-dot { animation: none; } }

.sorteo-ganador .gn-icon { position: relative; z-index: 1; margin: 0 auto 1.2rem; width: 64px; height: 64px; }
.sorteo-ganador .gn-icon svg { width: 100%; height: 100%; display: block; }

.sorteo-ganador .gn-card__titulo {
	position: relative; z-index: 1;
	font-family: var(--font-sans); font-weight: 800; font-size: clamp(1.6rem, 3vw, 2.1rem);
	margin: 0 0 0.9rem;
	background: linear-gradient(135deg, #FFFFFF, var(--color-accent-mist));
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.sorteo-ganador .gn-card__texto {
	position: relative; z-index: 1;
	font-family: var(--font-sans); font-size: 0.98rem; line-height: 1.7; color: rgba(255,255,255,0.85);
	max-width: 46ch; margin: 0 auto 2rem;
}

.sorteo-ganador .gn-cta {
	position: relative; z-index: 1;
	display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none;
	background: #FFFFFF; color: var(--color-ink);
	font-family: var(--font-sans); font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase;
	font-weight: 700; padding: 1.05rem 2.2rem; border-radius: 999px;
	transition: opacity 200ms ease, transform 200ms ease;
}
.sorteo-ganador .gn-cta:hover { opacity: 0.88; transform: translateY(-2px); }

/* Cajita de regalo: la tapa se "abre" en un loop suave */
.sorteo-ganador .gn-gift-lid {
	transform-origin: 14px 32px;
	animation: gnGiftOpen 2600ms ease-in-out infinite;
}
@keyframes gnGiftOpen {
	0%, 20% { transform: rotate(0deg); }
	50% { transform: rotate(-18deg) translate(-1px, -2px); }
	80%, 100% { transform: rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) { .sorteo-ganador .gn-gift-lid { animation: none; } }

.sorteo-ganador .gn-admin-note {
	position: relative; z-index: 1; margin-top: 1.4rem;
	font-family: var(--font-sans); font-size: 0.72rem; color: #E8B4A6; line-height: 1.5;
}

/* Mobile: tarjeta más compacta, botón a todo el ancho */
@media (max-width: 600px) {
	.sorteo-ganador .gn-card { padding: 2.4rem 1.6rem; border-radius: 20px; }
	.sorteo-ganador .gn-cta { width: 100%; justify-content: center; padding: 1.05rem 1.4rem; }
}