/* ==========================================================================
   Naipes Artesanos — cartas, abanicos, efectos de aparición y cabeceras oscuras
   ========================================================================== */

:root {
	--na-velvet: #3f033f;
	--na-ease-out: cubic-bezier(.16, 1, .3, 1);
	--na-ease-io: cubic-bezier(.7, 0, .2, 1);
	--na-card-radius: 14px;
	--na-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

/* --- Fondo terciopelo reutilizable -------------------------------------- */
.na-velvet,
.na-hero,
.na-product-hero,
.na-dark-top .na-page-hero,
.na-band--dark {
	position: relative;
	isolation: isolate;
	background:
		radial-gradient(ellipse 60% 70% at 78% 40%, rgba(122, 22, 120, .55), transparent 70%),
		radial-gradient(ellipse 50% 60% at 10% 90%, rgba(95, 0, 93, .45), transparent 70%),
		radial-gradient(ellipse 40% 40% at 50% 0%, rgba(235, 183, 0, .08), transparent 70%),
		var(--na-velvet);
	color: rgba(241, 241, 238, .8);
}
.na-hero::after,
.na-product-hero::after,
.na-dark-top .na-page-hero::after,
.na-band--dark::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var(--na-grain);
	opacity: .09;
	mix-blend-mode: overlay;
	pointer-events: none;
}

/* ==========================================================================
   Carta de tarot
   ========================================================================== */
.na-tarot {
	--rx: 0deg;
	--ry: 0deg;
	--mx: 50%;
	--my: 50%;
	--lift: 0px;
	--flip: 0deg;
	position: relative;
	display: block;
	aspect-ratio: 3 / 5;
	perspective: 1100px;
	color: inherit;
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}
.na-tarot__inner {
	position: absolute;
	inset: 0;
	border-radius: var(--na-card-radius);
	transform-style: preserve-3d;
	transform: translateY(var(--lift)) rotateX(var(--rx)) rotateY(calc(var(--ry) + var(--flip)));
	transition: transform 1s var(--na-ease-out), box-shadow .5s var(--na-ease-out);
	box-shadow:
		0 1px 2px rgba(0, 0, 0, .18),
		0 24px 40px -22px rgba(63, 3, 63, .65);
	will-change: transform;
}
.na-tarot.is-tilting .na-tarot__inner { transition: transform .18s ease-out, box-shadow .4s var(--na-ease-out); }
.na-tarot:hover .na-tarot__inner,
.na-tarot:focus-visible .na-tarot__inner {
	box-shadow:
		0 2px 4px rgba(0, 0, 0, .2),
		0 50px 70px -30px rgba(63, 3, 63, .75),
		0 0 0 1px rgba(235, 183, 0, .6);
}
.na-tarot__face {
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: inherit;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.na-tarot__front { background: #f3ead7; }
.na-tarot__front img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.02);
	transition: transform 1.2s var(--na-ease-out);
	user-select: none;
}
.na-tarot:hover .na-tarot__front img { transform: scale(1.07); }
.na-tarot__frame {
	position: absolute;
	inset: 7px;
	border: 1px solid rgba(235, 183, 0, .75);
	border-radius: calc(var(--na-card-radius) - 6px);
	pointer-events: none;
	box-shadow: inset 0 0 0 3px rgba(241, 241, 238, .35);
}
.na-tarot__num,
.na-tarot__plate {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(63, 3, 63, .88);
	color: var(--na-gold-soft);
	font-family: var(--na-serif);
	font-weight: 400;
	line-height: 1;
	white-space: nowrap;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	box-shadow: 0 0 0 1px rgba(235, 183, 0, .55);
	pointer-events: none;
}
.na-tarot__num { top: 14px; min-width: 38px; padding: 6px 10px 5px; border-radius: 999px; font-size: .95rem; letter-spacing: .08em; text-align: center; }
.na-tarot__plate {
	bottom: 14px;
	max-width: calc(100% - 28px);
	padding: 8px 14px 7px;
	border-radius: 4px;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: clamp(.82rem, 1.1vw, 1rem);
	letter-spacing: .14em;
	text-transform: uppercase;
}
.na-tarot__glare {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background:
		radial-gradient(circle at var(--mx) var(--my), rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 42%),
		linear-gradient(115deg, transparent 35%, rgba(235, 183, 0, .35) 48%, rgba(255, 255, 255, .25) 52%, transparent 65%);
	background-size: 100% 100%, 250% 250%;
	background-position: center, calc(var(--mx) * 1.2) calc(var(--my) * 1.2);
	mix-blend-mode: soft-light;
	opacity: 0;
	transition: opacity .4s var(--na-ease-out);
	pointer-events: none;
}
.na-tarot:hover .na-tarot__glare,
.na-tarot.is-tilting .na-tarot__glare { opacity: 1; }
.na-tarot__back {
	transform: rotateY(180deg);
	background: #3f033f url("../img/card-back.svg") center / cover no-repeat;
	box-shadow: inset 0 0 0 1px rgba(235, 183, 0, .5);
}

/* Reparto: las cartas empiezan boca abajo y se voltean al aparecer. */
.na-js .na-tarot--flip:not(.is-dealt) { --flip: 180deg; }
.na-js .na-tarot--flip:not(.is-dealt) .na-tarot__inner { transform: translateY(40px) rotateX(8deg) rotateY(180deg); }
.na-tarot--flip .na-tarot__inner { transition-delay: calc(var(--deal-delay, 0) * 1ms); }
.na-tarot--flip.is-dealt.is-settled .na-tarot__inner { transition-delay: 0ms; }

/* ==========================================================================
   Abanico de cartas
   ========================================================================== */
.na-fan {
	--w: clamp(150px, 15vw, 230px);
	--gap: .52;      /* separación entre cartas (en anchos de carta) */
	--step: 6deg;    /* giro entre cartas */
	position: relative;
	height: calc(var(--w) * 5 / 3 + 90px);
	margin-inline: auto;
	max-width: 100%;
}
.na-fan__card.na-tarot {
	--spread: calc(var(--w) * var(--gap) * (var(--n) - 1) / 2);
	--angle: calc(var(--step) * (var(--n) - 1) / 2);
	position: absolute;
	left: 50%;
	bottom: 20px;
	width: var(--w);
	margin-left: calc(var(--w) / -2);
	transform-origin: 50% 120%;
	transform:
		translateX(calc(var(--p) * var(--spread)))
		translateY(calc(var(--a, 0) * var(--a, 0) * 26px))
		rotate(calc(var(--p) * var(--angle)));
	transition: transform 1.1s var(--na-ease-out), filter .5s var(--na-ease-out);
	transition-delay: calc(var(--deal-delay, 0) * 1ms);
	z-index: calc(10 + var(--i));
}
/* Antes de repartir: mazo apilado en el centro */
.na-fan .na-fan__card { --deal-delay: calc(var(--i) * 120 + 250); }
.na-js .na-fan:not(.is-dealt) .na-fan__card {
	transform: translateY(30px) rotate(calc(var(--i) * 1.5deg - 3deg));
}
.na-fan.is-dealt .na-fan__card:hover,
.na-fan.is-dealt .na-fan__card:focus-visible {
	transform:
		translateX(calc(var(--p) * var(--spread) * 1.08))
		translateY(-34px)
		rotate(calc(var(--p) * var(--angle) * .55))
		scale(1.06);
	z-index: 40;
	transition-delay: 0ms;
}
.na-fan.is-dealt:hover .na-fan__card:not(:hover) { filter: brightness(.72) saturate(.85); transition-delay: 0ms; }
.na-fan.is-settled .na-fan__card { transition-delay: 0ms; }
.na-fan .na-tarot__plate { opacity: 0; transform: translate(-50%, 8px); transition: opacity .35s, transform .35s var(--na-ease-out); }
.na-fan .na-fan__card:hover .na-tarot__plate { opacity: 1; transform: translate(-50%, 0); }

/* Variante extendida (ficha de mazo) */
.na-fan--spread { --w: clamp(130px, 14vw, 200px); --gap: .55; --step: 4deg; height: calc(var(--w) * 5 / 3 + 120px); margin-bottom: 8px; }
.na-fan--spread.is-dealt:hover .na-fan__card { --gap: 1.02; --step: 1.5deg; }

@media (max-width: 700px) {
	.na-fan { --w: clamp(110px, 30vw, 150px); --gap: .34; --step: 5deg; }
	.na-fan--spread, .na-fan--spread.is-dealt:hover .na-fan__card { --gap: .3; --step: 3deg; }
}

/* Carta suelta decorativa [naipes_carta] */
.na-single-card { width: var(--w, 200px); transform: rotate(var(--rot, 0deg)); transition: transform 1s var(--na-ease-out); }
.na-single-card:hover { transform: rotate(0deg) translateY(-6px); }

/* ==========================================================================
   Colección de mazos (portada y tienda)
   ========================================================================== */
.na-decks {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(48px, 6vw, 88px) clamp(24px, 4vw, 64px);
	max-width: 1080px;
	margin: 3.5rem auto 0;
	padding-bottom: clamp(48px, 8vw, 120px); /* deja sitio a la carta central desplazada */
}
.na-decks .na-deck:nth-child(3n + 2),
.woocommerce ul.products li.product:nth-child(3n + 2) { transform: translateY(clamp(0px, 5vw, 72px)); }
.na-deck { text-align: center; }
.na-deck__card { max-width: 300px; margin: 0 auto; }
.na-deck__card .na-tarot__plate { display: none; }
.na-deck__body { position: relative; padding-top: 1.6rem; }
.na-deck__cat {
	margin: 0 0 .35rem;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--na-gold-text);
}
.na-deck__title,
.woocommerce ul.products li.product .na-deck__title {
	margin: 0 0 .35rem !important;
	padding: 0 !important;
	font-family: var(--na-serif) !important;
	font-size: clamp(1.45rem, 2vw, 1.8rem) !important;
	font-weight: 400;
	line-height: 1.12;
}
.na-deck__title a { color: var(--na-plum-deep); text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--na-ease-out); }
.na-deck:hover .na-deck__title a { background-size: 100% 1px; }
.na-deck__price, .woocommerce ul.products li.product .price { margin: 0 0 .8rem; font-size: 1.05rem; font-weight: 500; color: var(--na-plum); }
.na-deck__badge,
.na-deck .na-badges { display: inline-flex; justify-content: center; margin-bottom: .7rem; }
.na-deck__badge { padding: 5px 12px; border-radius: 999px; background: var(--na-plum); color: var(--na-gold-soft); font-size: 0.78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.na-deck .na-badges { position: static; }
.na-deck .na-product-card__cta { justify-content: center; }

/* Las cartas de la colección se reparten en cascada */
.na-decks .na-tarot--flip, .woocommerce ul.products .na-tarot--flip { --deal-delay: calc(var(--i, 0) * 140); }

@media (max-width: 860px) {
	.na-decks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 18px; }
	.na-decks .na-deck:nth-child(3n + 2),
	.woocommerce ul.products li.product:nth-child(3n + 2) { transform: none; }
	.na-decks .na-deck:nth-child(2n),
	.woocommerce ul.products li.product:nth-child(2n) { transform: translateY(40px); }
	.na-tarot__num { top: 10px; font-size: 0.84rem; min-width: 30px; padding: 5px 8px 4px; }
}

/* ==========================================================================
   Héroe de portada
   ========================================================================== */
.na-content--full > .na-hero {
	min-height: min(860px, calc(100svh - 110px));
	display: flex;
	align-items: center;
	padding: clamp(48px, 6vw, 96px) var(--na-gutter) !important;
	overflow: hidden;
}
.na-hero > .wp-block-columns { width: 100%; }
.na-hero::before {
	content: '';
	position: absolute;
	z-index: -1;
	top: 50%;
	right: max(-160px, calc(50% - 760px));
	width: min(860px, 110vw);
	aspect-ratio: 1;
	background: url("../img/zodiac.svg") center / contain no-repeat;
	opacity: .55;
	transform: translateY(-50%);
	animation: na-spin 160s linear infinite;
	pointer-events: none;
}
@keyframes na-spin { to { transform: translateY(-50%) rotate(360deg); } }
.na-hero h1, .na-hero h2 { color: var(--na-cream); }

.na-hero .na-eyebrow { color: var(--na-gold-soft); }
.na-hero .na-lead { color: rgba(241, 241, 238, .72); }
.na-hero .na-display { font-size: clamp(3rem, 6.6vw, 5.6rem); letter-spacing: -.015em; }
.na-hero__media { position: relative; }
.na-hero__media .na-fan { --w: clamp(150px, 14.5vw, 236px); --gap: .46; }

/* Botones sobre fondos oscuros */
.na-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.na-band--dark .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.na-product-hero .single_add_to_cart_button {
	background: var(--na-gold-soft) !important;
	border-color: var(--na-gold-soft) !important;
	color: var(--na-velvet) !important;
}
.na-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.na-band--dark .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.na-product-hero .single_add_to_cart_button:hover { background: #fff !important; border-color: #fff !important; }
.na-hero .is-style-outline .wp-block-button__link,
.na-band--dark .is-style-outline .wp-block-button__link { color: var(--na-cream); border-color: rgba(241, 241, 238, .45); }
.na-hero .is-style-outline .wp-block-button__link:hover,
.na-band--dark .is-style-outline .wp-block-button__link:hover { background: var(--na-cream); color: var(--na-velvet); border-color: var(--na-cream); }

/* Indicador de scroll */
.na-scroll-cue {
	position: absolute;
	left: 50%;
	bottom: 22px;
	width: 1px;
	height: 56px;
	background: linear-gradient(rgba(235, 183, 0, 0), rgba(235, 183, 0, .8));
	overflow: hidden;
}
.na-scroll-cue::after { content: ''; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--na-cream); animation: na-cue 2.2s var(--na-ease-io) infinite; }
@keyframes na-cue { to { top: 110%; } }

@media (max-width: 781px) {
	.na-content--full > .na-hero { min-height: 0; padding-top: 32px !important; }
	.na-hero > .wp-block-columns { flex-direction: column-reverse !important; }
	.na-hero::before { right: -40%; top: 26%; width: 140vw; }
	.na-scroll-cue { display: none; }
}

/* ==========================================================================
   Marquesina
   ========================================================================== */
.na-content--full > .na-strip-marquee { padding: 0 !important; }
.na-marquee {
	position: relative;
	overflow: hidden;
	padding: 22px 0;
	background: var(--na-plum);
	color: var(--na-gold-soft);
	border-block: 1px solid rgba(235, 183, 0, .25);
}
.na-marquee__track {
	display: flex;
	width: max-content;
	align-items: center;
	gap: 0 34px;
	padding-left: 34px;
	animation: na-marquee 46s linear infinite;
	font-family: var(--na-serif);
	font-size: clamp(1.35rem, 2.4vw, 2rem);
	font-style: normal;
	font-weight: 400;
	white-space: nowrap;
}
.na-marquee__track i { font-style: normal; font-size: .6em; color: var(--na-yellow); }
.na-marquee:hover .na-marquee__track { animation-play-state: paused; }
@keyframes na-marquee { to { transform: translateX(-50%); } }

/* ==========================================================================
   Cabecera sobre fondos oscuros
   ========================================================================== */
.na-dark-top .na-header:not(.is-scrolled) {
	background: rgba(63, 3, 63, .92);
	border-bottom-color: rgba(235, 183, 0, .14);
}
.na-dark-top .na-header:not(.is-scrolled) .na-menu > li > a,
.na-dark-top .na-header:not(.is-scrolled) .na-header__icon,
.na-dark-top .na-header:not(.is-scrolled) .na-header__toggle,
.na-dark-top .na-header:not(.is-scrolled) .na-lang a { color: var(--na-cream); }
.na-dark-top .na-header:not(.is-scrolled) .na-logo__name { color: var(--na-cream); }
.na-dark-top .na-header:not(.is-scrolled) .na-logo__sub { color: var(--na-gold-soft); }
.na-dark-top .na-header:not(.is-scrolled) .na-header__icon:hover,
.na-dark-top .na-header:not(.is-scrolled) .na-header__toggle:hover { background: rgba(235, 183, 0, .12); }
.na-dark-top .na-header:not(.is-scrolled) .na-cart-count { background: var(--na-gold-soft); color: var(--na-velvet); }
.na-header, .na-header .na-menu a, .na-logo__name, .na-header__icon { transition: background-color .4s var(--na-ease-out), color .4s var(--na-ease-out), border-color .4s; }

/* Cabecera de página oscura (tienda) */
.na-dark-top .na-page-hero { border-bottom: 0; padding: clamp(64px, 9vw, 128px) 0 clamp(56px, 8vw, 112px); overflow: hidden; }
.na-dark-top .na-page-hero::before {
	content: '';
	position: absolute;
	z-index: -1;
	left: 50%;
	top: 50%;
	width: min(760px, 120vw);
	aspect-ratio: 1;
	background: url("../img/zodiac.svg") center / contain no-repeat;
	opacity: .35;
	transform: translate(-50%, -50%);
	animation: na-spin-center 200s linear infinite;
	pointer-events: none;
}
@keyframes na-spin-center { to { transform: translate(-50%, -50%) rotate(360deg); } }
.na-dark-top .na-page-hero .na-page-hero__title { color: var(--na-cream); }
.na-dark-top .na-page-hero .na-eyebrow { color: var(--na-gold-soft); }
.na-dark-top .na-page-hero .na-page-hero__sub { color: rgba(241, 241, 238, .72); }
.na-dark-top .na-page-hero time { color: var(--na-gold-soft); }
.na-shop-hero__text { text-align: left; }
.na-shop-hero__text .na-eyebrow { justify-content: flex-start; }
.na-shop-hero__text .na-page-hero__title { margin: 0; max-width: none; }
.na-shop-hero__text .na-page-hero__sub { margin-left: 0; }
.na-dark-top .na-page-hero:has(.na-shop-hero)::before { left: 75%; }
.na-page-hero--post + .na-article__cover { position: relative; z-index: 2; margin-top: clamp(-80px, -6vw, -40px); }
.na-page-hero--post { padding-bottom: clamp(100px, 10vw, 150px) !important; }
.na-shop-hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: 32px; align-items: center; }
.na-shop-hero .na-fan { --w: clamp(110px, 11vw, 170px); height: calc(var(--w) * 5 / 3 + 60px); }
@media (max-width: 781px) { .na-shop-hero { grid-template-columns: 1fr; } }

/* ==========================================================================
   Ficha de mazo: cabecera terciopelo
   ========================================================================== */
.na-product-hero { padding-bottom: clamp(56px, 7vw, 104px); margin-bottom: 0; }
.na-product-hero .na-crumbs, .na-product-hero .na-crumbs a { color: rgba(241, 241, 238, .55); }
.na-product-hero .na-crumbs a:hover { color: var(--na-gold-soft); }
.na-product-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 32px clamp(32px, 5vw, 88px);
	align-items: start;
	margin-top: 12px;
}
.na-product-hero .woocommerce-product-gallery .flex-viewport,
.na-product-hero .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:first-child {
	border-radius: var(--na-radius);
	box-shadow: 0 0 0 1px rgba(235, 183, 0, .35), 0 40px 80px -40px rgba(0, 0, 0, .8);
}
.na-product-hero .flex-control-thumbs li img { border-radius: 6px; }
.na-product-hero .summary { color: rgba(241, 241, 238, .78); }
.na-product-hero .product_title { color: var(--na-cream) !important; }
.na-product-hero .woocommerce-product-details__short-description { color: var(--na-gold-soft) !important; }
.na-product-hero .na-eyebrow { color: var(--na-gold-soft); }
.na-product-hero .na-facts { border-color: rgba(235, 183, 0, .2); }
.na-product-hero .na-facts > div + div { border-left-color: rgba(235, 183, 0, .2); }
.na-product-hero .na-facts dt { color: var(--na-gold-soft); opacity: .8; }
.na-product-hero .na-facts dd { color: var(--na-cream); }
.na-product-hero p.price, .na-product-hero span.price { color: var(--na-cream) !important; }
.na-product-hero p.price .woocommerce-price-suffix, .na-product-hero .na-price-note { color: rgba(241, 241, 238, .6) !important; }
.na-product-hero .quantity { background: transparent; border-color: rgba(235, 183, 0, .4); }
.na-product-hero .quantity .qty, .na-product-hero .na-qty__btn { color: var(--na-cream); }
.na-product-hero .na-qty__btn:hover { background: rgba(235, 183, 0, .12); color: var(--na-gold-soft); }
.na-product-hero .naipes-aviso-envio { background: rgba(235, 183, 0, .08) !important; color: rgba(241, 241, 238, .85); }
.na-product-hero .na-assurance { border-top-color: rgba(235, 183, 0, .2); }
.na-product-hero .na-assurance li { color: rgba(241, 241, 238, .7); }
.na-product-hero .na-assurance .na-icon { color: var(--na-gold-soft); }
.na-product-hero .stock { color: var(--na-gold-soft) !important; }
.na-product-hero .na-badge--limited { background: var(--na-gold-soft); color: var(--na-velvet); }
.na-product-hero .woocommerce-product-gallery__trigger { background: var(--na-cream) !important; }
@media (max-width: 960px) {
	.na-product-hero__grid { grid-template-columns: minmax(0, 1fr); }
}

/* Abanico de cartas de un mazo */
.na-deck-spread { text-align: center; padding: clamp(56px, 8vw, 104px) 0 clamp(24px, 3vw, 40px); }
.na-deck-spread h2 { margin-bottom: 1.5rem; }
.na-deck-spread .na-eyebrow { justify-content: center; }
.na-deck-spread__hint { margin: 0; font-size: 0.84rem; letter-spacing: .16em; text-transform: uppercase; color: var(--na-muted); }
@media (hover: none) { .na-deck-spread__hint { display: none; } }

/* ==========================================================================
   Aparición al hacer scroll
   ========================================================================== */
.na-js [data-reveal] {
	opacity: 0;
	transform: translateY(32px);
	transition: opacity 1.1s var(--na-ease-out), transform 1.2s var(--na-ease-out);
	transition-delay: calc(var(--d, 0) * 1ms);
}
.na-js [data-reveal].is-in { opacity: 1; transform: none; }
.na-js [data-reveal="fade"] { transform: none; }
.na-js [data-reveal="clip"] { opacity: 1; transform: none; overflow: hidden; border-radius: var(--na-radius); }
/* La cortina va en la imagen (un contenedor recortado no cuenta como visible para el navegador). */
.na-js [data-reveal="clip"] > img,

.na-js [data-reveal="clip"] > .wp-block-embed__wrapper,
.na-js [data-reveal="clip"] > .na-yt__btn {
	clip-path: inset(0 0 100% 0);
	transform: scale(1.22);
	transition: clip-path 1.5s var(--na-ease-io), transform 2s var(--na-ease-out);
	transition-delay: calc(var(--d, 0) * 1ms);
}
.na-js [data-reveal="clip"].is-in > img,

.na-js [data-reveal="clip"].is-in > .wp-block-embed__wrapper,
.na-js [data-reveal="clip"].is-in > .na-yt__btn { clip-path: inset(0 0 0 0); transform: none; }

/* Titulares palabra a palabra */
.na-words .na-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.na-words .na-w > span { display: inline-block; transform: translateY(105%); transition: transform 1.1s var(--na-ease-out); transition-delay: calc(var(--d, 0) * 1ms + var(--wi) * 55ms); }
.na-words.is-in .na-w > span { transform: none; }

/* Cita que se ilumina con el scroll */
.na-quote__text .na-qw { opacity: .2; transition: opacity .4s ease, color .4s ease; }
.na-quote__text .na-qw.on { opacity: 1; }

/* Imágenes con zoom suave al pasar */
.na-steps .wp-block-image, .na-framed { overflow: hidden; border-radius: var(--na-radius); }
.na-steps .wp-block-image img, .na-framed img { transition: transform 1.4s var(--na-ease-out), filter .8s; }
.na-steps .wp-block-column:hover .wp-block-image img, .na-framed:hover img { transform: scale(1.06); }

/* Paso del proceso: número grande */
.na-steps .wp-block-column { position: relative; }
.na-steps .wp-block-column h3 .na-step {
	position: absolute;
	top: -0.1em;
	right: 8px;
	font-family: var(--na-serif);
	font-size: clamp(4rem, 8vw, 7rem);
	font-weight: 400;
	font-style: normal;
	line-height: 1;
	letter-spacing: 0;
	color: transparent;
	-webkit-text-stroke: 1px rgba(235, 183, 0, .55);
	pointer-events: none;
	z-index: 2;
}

/* Vídeo vertical enmarcado como una carta */
.na-video--vertical { position: relative; padding: 10px; border-radius: 22px; background: linear-gradient(145deg, rgba(235, 183, 0, .55), rgba(235, 183, 0, .1)); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .7); }
.na-video--vertical iframe { border-radius: 14px; }

/* Cartas que asoman en la banda dorada */
.na-band--gold { position: relative; overflow: hidden; }
.na-peek { position: absolute; z-index: 0; pointer-events: none; opacity: .95; }
.na-peek .na-tarot { width: clamp(110px, 13vw, 190px); }
.na-peek--left { left: clamp(-60px, -2vw, -20px); bottom: -40px; transform: rotate(-16deg); }
.na-peek--right { right: clamp(-60px, -2vw, -20px); top: -30px; transform: rotate(14deg); }
.na-band--gold > *:not(.na-peek):not(.wp-block-shortcode) { position: relative; z-index: 1; }
@media (max-width: 700px) { .na-peek { opacity: .35; } }

/* Novedad: foto + carta flotante */
.na-collage { position: relative; }
.na-collage .na-floating-card { position: absolute; right: clamp(-24px, -2vw, -8px); bottom: clamp(-60px, -5vw, -30px); z-index: 2; }
.na-collage .na-floating-card .na-tarot { width: clamp(120px, 14vw, 190px); transform: rotate(8deg); }
@media (max-width: 781px) { .na-collage { margin-bottom: 40px; } .na-collage .na-floating-card { right: 4px; } }

/* ==========================================================================
   Cursor personalizado (solo ratón)
   ========================================================================== */
.na-cursor {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 34px;
	height: 34px;
	margin: -17px 0 0 -17px;
	border: 1px solid rgba(235, 183, 0, .9);
	border-radius: 50%;
	pointer-events: none;
	display: grid;
	place-items: center;
	transition: width .35s var(--na-ease-out), height .35s var(--na-ease-out), margin .35s var(--na-ease-out), background .35s, border-color .35s, opacity .3s;
	opacity: 0;
}
.na-cursor.is-visible { opacity: 1; }
.na-cursor span { font-size: 0.78rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--na-velvet); opacity: 0; transition: opacity .2s; }
.na-cursor.is-card { width: 84px; height: 84px; margin: -42px 0 0 -42px; background: var(--na-gold-soft); border-color: var(--na-gold-soft); }
.na-cursor.is-card span { opacity: 1; }
.na-cursor.is-link { width: 54px; height: 54px; margin: -27px 0 0 -27px; background: rgba(235, 183, 0, .12); }
@media (hover: none), (pointer: coarse) { .na-cursor { display: none; } }

/* ==========================================================================
   Movimiento reducido: todo visible y quieto
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
	.na-dark-top .na-page-hero::before { animation: none; }
	.na-js [data-reveal], .na-js [data-reveal="clip"], .na-js [data-reveal="clip"] img, .na-words .na-w > span { opacity: 1 !important; transform: none !important; clip-path: none !important; }
	.na-js .na-tarot--flip:not(.is-dealt) { --flip: 0deg; }
	.na-js .na-tarot--flip:not(.is-dealt) .na-tarot__inner { transform: none; }
	.na-hero::before, .na-marquee__track { animation: none; }
	.na-quote__text .na-qw { opacity: 1; }
	.na-cursor { display: none; }
}

/* ==========================================================================
   Vídeos de YouTube ligeros
   ========================================================================== */
.na-yt { position: relative; margin: 2em 0; }
.na-yt__btn, .na-yt__frame {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: var(--na-radius);
	background: var(--na-velvet);
	overflow: hidden;
}
.na-yt--vertical .na-yt__btn, .na-yt--vertical .na-yt__frame { aspect-ratio: 9 / 16; }
.na-yt--vertical { max-width: 340px; margin-inline: auto; }
.na-yt__btn { position: relative; padding: 0; cursor: pointer; }
.na-yt__btn img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.78) saturate(.95); transition: transform 1.2s var(--na-ease-out), filter .6s; }
.na-yt__btn:hover img { transform: scale(1.04); filter: brightness(.92); }
.na-yt__play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 78px;
	height: 78px;
	margin: -39px 0 0 -39px;
	border-radius: 50%;
	background: var(--na-gold-soft);
	box-shadow: 0 10px 40px -10px rgba(0, 0, 0, .6);
	transition: transform .5s var(--na-ease-out);
}
.na-yt__play::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 54%;
	border-style: solid;
	border-width: 12px 0 12px 19px;
	border-color: transparent transparent transparent var(--na-velvet);
	transform: translate(-50%, -50%);
}
.na-yt__play::after {
	content: '';
	position: absolute;
	inset: -10px;
	border: 1px solid rgba(235, 183, 0, .7);
	border-radius: 50%;
	animation: na-pulse 2.4s var(--na-ease-out) infinite;
}
.na-yt__btn:hover .na-yt__play { transform: scale(1.1); }
@keyframes na-pulse { from { transform: scale(.85); opacity: 1; } to { transform: scale(1.5); opacity: 0; } }
.na-yt figcaption { margin-top: .7em; font-size: 0.89rem; color: var(--na-muted); text-align: center; }
.na-band--dark .na-yt figcaption { color: rgba(241, 241, 238, .6); }
.na-video--vertical.na-yt { padding: 10px; }

/* Abanicos en móvil (al final para ganar a los tamaños de escritorio) */
@media (max-width: 700px) {
	.na-hero__media .na-fan, .na-shop-hero .na-fan { --w: clamp(96px, 27vw, 128px); --gap: .36; --step: 5deg; }
}

/* Contacto: formulario + carta */
.page .na-content:has(.na-contact-cols) { max-width: calc(var(--na-wide) + 2 * var(--na-gutter)); }
.na-contact-cols { gap: clamp(32px, 6vw, 96px) !important; align-items: flex-start; }
.na-contact-aside { text-align: center; padding: 40px 32px; border-radius: var(--na-radius); background: var(--na-paper); }
.na-contact-card .na-tarot { width: min(220px, 70%); margin: 0 auto 28px; transform: rotate(-4deg); }
.na-contact-aside .na-eyebrow { display: block; margin-bottom: .4rem; }

/* ==========================================================================
   Logotipo Burgensis (SVG): ciruela sobre claro, oro sobre oscuro
   ========================================================================== */
.na-logo--svg { display: inline-flex; color: var(--na-plum); line-height: 0; }
.na-logo--svg svg { display: block; height: 68px; width: auto; }
.na-header .na-logo--svg svg { transition: height .4s var(--na-ease-out); }
.na-header.is-scrolled .na-logo--svg svg { height: 56px; }
.na-dark-top .na-header:not(.is-scrolled) .na-logo--svg,
.na-footer .na-logo--svg { color: var(--na-gold); }
.na-footer .na-logo--svg svg { height: 76px; }
.na-drawer .na-logo--svg svg { height: 50px; }
@media (max-width: 960px) {
	.na-header .na-logo--svg svg, .na-header.is-scrolled .na-logo--svg svg { height: 46px; }
}

/* Subrayado del menú: ciruela sobre la cabecera clara, oro sobre la oscura */
.na-header .na-menu a::after { background: var(--na-plum); }
.na-dark-top .na-header:not(.is-scrolled) .na-menu a::after { background: var(--na-gold); }
/* Precios sobre fondo oscuro en oro (guía de marca) */
.na-product-hero p.price, .na-product-hero span.price, .na-product-hero p.price .amount { color: var(--na-gold) !important; }