/* ==========================================================================
   Christmas Edition — neve, lucine, rosso/oro, brina
   Family museum · ice + crimson + evergreen + gold
   ========================================================================== */

:root {
	--color-bg: #e4f1ff;
	--color-bg-elevated: #ffffff;
	--color-surface: #d4ecff;
	--color-surface-warm: #ffe4e8;
	--color-surface-mint: #e8f8ef;
	--color-surface-sky: #c0e4ff;
	--color-ink: #061f45;
	--color-text: #163558;
	--color-text-muted: #3a5f86;
	--color-text-dark: #061f45;

	--color-accent: #d4001a;
	--color-accent-hover: #b00016;
	--color-accent-text: #9a0014;
	--color-accent-soft: rgba(212, 0, 26, 0.14);
	--color-coral: #d4001a;
	--color-coral-strong: #b00016;
	--color-sun: #ffc933;
	--color-mint: #1f8a4c;
	--color-sky: #6ec4ff;
	--color-lilac: #0b4faf;
	--color-lilac-strong: #083d88;
	--color-magenta: #d4001a;

	--color-link: #083d88;
	--color-link-hover: #d4001a;

	--color-frost: rgba(255, 255, 255, 0.78);
	--color-ice: #9ad4ff;
	--color-snow: #ffffff;
	--color-pine: #0f6b3c;
	--color-berry: #d4001a;
	--color-gold: #ffc933;

	--gradient-brand: linear-gradient(125deg, #083d88 0%, #0b4faf 35%, #d4001a 78%, #ffc933 120%);
	--gradient-brand-btn: linear-gradient(125deg, #083d88 0%, #b00016 52%, #d4001a 100%);
	--gradient-text: linear-gradient(125deg, #083d88 0%, #0a4a9c 40%, #b00016 100%);
	--gradient-wash: linear-gradient(
		180deg,
		#cfe8ff 0%,
		#e8f4ff 22%,
		#fff5f6 55%,
		#eef8f1 78%,
		#e4f1ff 100%
	);
	--gradient-frost: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100%);
	--shadow-playful: 0 12px 0 rgba(255, 201, 51, 0.4);
}

body.museo-xmas {
	background: var(--gradient-wash);
}

/* --------------------------------------------------------------------------
   Ambient blobs — cold ice + warm berry
   -------------------------------------------------------------------------- */

body.museo-xmas .museo-ambient__blob--1 {
	background: rgba(8, 61, 136, 0.42);
	filter: blur(72px);
}

body.museo-xmas .museo-ambient__blob--2 {
	background: rgba(212, 0, 26, 0.28);
	filter: blur(68px);
}

body.museo-xmas .museo-ambient__blob--3 {
	background: rgba(154, 212, 255, 0.6);
	filter: blur(84px);
}

/* Top frost veil — starts below the header */
.museo-xmas-frost {
	position: fixed;
	top: calc(var(--header-height, 4rem) + env(safe-area-inset-top, 0px));
	left: 0;
	right: 0;
	height: min(28vh, 12rem);
	z-index: 50;
	pointer-events: none;
	background:
		radial-gradient(110% 90% at 8% 0%, rgba(255, 255, 255, 0.45), transparent 52%),
		radial-gradient(95% 75% at 92% 0%, rgba(255, 255, 255, 0.3), transparent 48%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.28) 0%, transparent 100%);
	opacity: 0.75;
}

/* Soft snow bank at bottom of viewport */
.museo-xmas-drift {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	height: min(12vh, 5.5rem);
	z-index: 55;
	pointer-events: none;
	background:
		radial-gradient(120% 100% at 15% 120%, rgba(255, 255, 255, 0.85), transparent 55%),
		radial-gradient(100% 100% at 70% 130%, rgba(255, 255, 255, 0.7), transparent 50%),
		linear-gradient(0deg, rgba(255, 255, 255, 0.55) 0%, transparent 100%);
	opacity: 0.55;
	mask-image: linear-gradient(0deg, #000 20%, transparent 95%);
}

/* --------------------------------------------------------------------------
   Fairy lights under header
   -------------------------------------------------------------------------- */

.museo-xmas-lights {
	position: fixed;
	/* Header is border-box (safe-area already inside --header-height); tuck wire into bottom edge */
	top: calc(var(--header-height, 4rem) - 2px);
	left: 0;
	right: 0;
	/* Above .site-header (100), below mobile nav (200) */
	z-index: 110;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	height: 1.5rem;
	padding: 0 var(--container-pad, 1.25rem);
	pointer-events: none;
	overflow: visible;
}

.museo-xmas-lights__wire {
	position: absolute;
	left: var(--container-pad, 1.25rem);
	right: var(--container-pad, 1.25rem);
	top: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(6, 31, 69, 0.4) 4%, rgba(6, 31, 69, 0.4) 96%, transparent);
}

.museo-xmas-lights__bulb {
	position: relative;
	flex: 0 0 auto;
	width: 0.55rem;
	height: 0.7rem;
	margin-top: 0.1rem;
	border-radius: 40% 40% 45% 45%;
	background: var(--bulb, #d4001a);
	box-shadow:
		0 0 6px var(--bulb, #d4001a),
		0 0 14px color-mix(in srgb, var(--bulb, #d4001a) 55%, transparent);
	animation: museo-xmas-bulb 1.8s ease-in-out var(--d, 0s) infinite;
	opacity: 0.92;
}

.museo-xmas-lights__bulb::before {
	content: "";
	position: absolute;
	left: 18%;
	right: 18%;
	top: -0.14rem;
	height: 0.18rem;
	background: #4a5a6a;
	border-radius: 1px;
}

@keyframes museo-xmas-bulb {
	0%, 100% { filter: brightness(0.85); transform: translateY(0); }
	50% { filter: brightness(1.35); transform: translateY(1px); }
}

/* --------------------------------------------------------------------------
   Snowfall
   -------------------------------------------------------------------------- */

.museo-xmas-snow {
	position: fixed;
	inset: 0;
	z-index: 60;
	pointer-events: none;
	overflow: hidden;
}

.museo-xmas-snow__flake {
	position: absolute;
	top: -2rem;
	left: var(--x, 50%);
	width: var(--size, 0.5rem);
	height: var(--size, 0.5rem);
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, #fff 0%, #e8f6ff 50%, rgba(255, 255, 255, 0.25) 100%);
	box-shadow: 0 0 8px rgba(255, 255, 255, 0.95);
	opacity: var(--o, 0.8);
	animation: museo-xmas-fall var(--dur, 12s) linear var(--delay, 0s) infinite;
	will-change: transform;
}

.museo-xmas-snow__flake--crystal {
	border-radius: 0;
	background: transparent;
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.15),
		0 0 10px rgba(255, 255, 255, 0.55);
	opacity: var(--o, 0.65);
}

.museo-xmas-snow__flake--crystal::before,
.museo-xmas-snow__flake--crystal::after {
	content: "";
	position: absolute;
	inset: 40% 0;
	background: linear-gradient(90deg, transparent, #fff 30%, #fff 70%, transparent);
	border-radius: 1px;
}

.museo-xmas-snow__flake--crystal::after {
	transform: rotate(90deg);
}

.museo-xmas-snow__flake--crystal {
	background-image:
		linear-gradient(30deg, transparent 46%, #fff 46%, #fff 54%, transparent 54%),
		linear-gradient(-30deg, transparent 46%, #fff 46%, #fff 54%, transparent 54%);
}

@keyframes museo-xmas-fall {
	0% {
		transform: translate3d(0, -5vh, 0) rotate(0deg);
		opacity: 0;
	}
	6% {
		opacity: var(--o, 0.85);
	}
	100% {
		transform: translate3d(var(--drift, 40px), 108vh, 0) rotate(420deg);
		opacity: 0.12;
	}
}

/* --------------------------------------------------------------------------
   Header: clean bar (no ice / frost tint)
   -------------------------------------------------------------------------- */

body.museo-xmas .site-header {
	background: rgba(255, 255, 255, 0.94);
	border-bottom: 1px solid rgba(6, 31, 69, 0.1);
	backdrop-filter: blur(14px);
	box-shadow: 0 8px 24px rgba(6, 31, 69, 0.06);
	overflow: visible;
}

body.museo-xmas .site-header::before,
body.museo-xmas .site-header::after {
	content: none;
	display: none;
}

body.museo-xmas .site-header.is-scrolled {
	background: rgba(255, 255, 255, 0.98);
}

.btn--primary,
.site-header__cta.btn {
	background: var(--gradient-brand-btn);
	border-color: #061f45;
	box-shadow: 3px 3px 0 #ffc933;
}

body.museo-xmas .site-header__cta.btn:hover {
	box-shadow: 4px 4px 0 #d4001a;
	transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.section-hero__badge--anniversary,
.section-hero__badge {
	background: linear-gradient(135deg, #d4001a 0%, #9a0014 100%);
	border-color: #061f45;
	color: #fff;
	box-shadow: 4px 4px 0 #ffc933;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	animation: museo-xmas-badge-glow 2.6s ease-in-out infinite;
}

@keyframes museo-xmas-badge-glow {
	0%, 100% {
		box-shadow: 4px 4px 0 #ffc933, 0 0 0 0 rgba(212, 0, 26, 0.35);
	}
	50% {
		box-shadow: 4px 4px 0 #0f6b3c, 0 0 18px 2px rgba(255, 201, 51, 0.45);
	}
}

.section-hero__overlay {
	background:
		radial-gradient(ellipse 70% 45% at 78% 12%, rgba(255, 255, 255, 0.35), transparent 55%),
		radial-gradient(ellipse 40% 30% at 20% 8%, rgba(212, 0, 26, 0.18), transparent 60%),
		linear-gradient(
			180deg,
			rgba(6, 31, 69, 0.84) 0%,
			rgba(6, 31, 69, 0.58) 20%,
			rgba(228, 241, 255, 0.88) 46%,
			rgba(228, 241, 255, 0.98) 68%,
			rgba(228, 241, 255, 1) 100%
		);
}

body.museo-xmas .section-hero__shapes span {
	border-color: rgba(255, 255, 255, 0.5);
	box-shadow:
		inset 0 0 20px rgba(154, 212, 255, 0.4),
		0 0 16px rgba(255, 201, 51, 0.2);
	background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.4), transparent 60%);
}

.section-hero__countdown {
	border-color: #083d88;
	box-shadow: 6px 6px 0 #d4001a;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.97), #fff),
		#fff;
}

.section-hero__countdown::before,
.section-hero__countdown::after {
	content: none;
	display: none;
}

.section-hero__countdown-label {
	background: #d4001a;
	color: #fff;
	border-color: #061f45;
	box-shadow: 2px 2px 0 #ffc933;
}

.section-hero__schedule-card--dates {
	border-color: #d4001a;
	box-shadow: 4px 4px 0 #d4001a;
}

.section-hero__schedule-card--hours {
	border-color: #083d88;
	box-shadow: 4px 4px 0 #083d88;
}

.section-hero__schedule-card--location {
	border-color: #ffc933;
	box-shadow: 4px 4px 0 #ffc933;
}

body.museo-xmas .section-header__title::after {
	content: none;
	display: none;
}

/* --------------------------------------------------------------------------
   Cards / tickets / sticky
   -------------------------------------------------------------------------- */

body.museo-xmas .ticket-card,
body.museo-xmas .section-hero__schedule-card {
	background: linear-gradient(180deg, #fff 0%, #f5faff 100%);
}

body.museo-xmas .ticket-card::before {
	content: none;
	display: none;
}

body.museo-xmas .ticket-card__badge {
	box-shadow: 2px 2px 0 rgba(6, 31, 69, 0.2);
}

body.museo-xmas .museo-sticky-bar__inner {
	background: linear-gradient(90deg, rgba(212, 0, 26, 0.96), rgba(8, 61, 136, 0.94));
	border-top: 3px solid #ffc933;
	box-shadow: 0 -10px 28px rgba(6, 31, 69, 0.22);
}

body.museo-xmas .museo-sticky-bar__cta {
	box-shadow: 2px 2px 0 #ffc933 !important;
}

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */

body.museo-xmas .error-404--xmas {
	padding-block: clamp(3rem, 8vw, 5rem);
}

body.museo-xmas .error-404__badge {
	display: inline-block;
	margin-bottom: 0.75rem;
	padding: 0.35rem 0.75rem;
	background: #d4001a;
	color: #fff;
	border: 2px solid #061f45;
	box-shadow: 3px 3px 0 #ffc933;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body.museo-xmas .error-404__code {
	margin: 0 0 0.35rem;
	font-size: clamp(3.5rem, 12vw, 6rem);
	line-height: 0.95;
	font-weight: 800;
	letter-spacing: -0.04em;
	color: rgba(8, 61, 136, 0.18);
}

body.museo-xmas .error-404__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
}

/* --------------------------------------------------------------------------
   FAQ — icicles at section end (into final CTA)
   -------------------------------------------------------------------------- */

body.museo-xmas .section-faq {
	position: relative;
	z-index: 1;
}

body.museo-xmas .section-faq::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -12px;
	height: 14px;
	z-index: 2;
	pointer-events: none;
	/* Same jagged edge as footer, flipped so tips hang down over the next section */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath fill='%23e4f1ff' d='M0 14h120v-2c-3 0-5-10-9-10S104 12 100 12s-5-10-9-10S84 12 80 12s-5-10-9-10S64 12 60 12s-5-10-9-10S44 12 40 12s-5-10-9-10S24 12 20 12s-5-10-9-10S4 12 0 12v2z'/%3E%3C/svg%3E");
	background-repeat: repeat-x;
	background-size: 88px 14px;
	transform: scaleY(-1);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

body.museo-xmas .site-footer {
	background: linear-gradient(180deg, #061f45 0%, #041530 55%, #031022 100%);
	color: #e4f1ff;
	border-top: none;
	position: relative;
}

/* Icicle edge — no candy stripe */
body.museo-xmas .site-footer::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -12px;
	height: 14px;
	pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath fill='%23061f45' d='M0 14h120v-2c-3 0-5-10-9-10S104 12 100 12s-5-10-9-10S84 12 80 12s-5-10-9-10S64 12 60 12s-5-10-9-10S44 12 40 12s-5-10-9-10S24 12 20 12s-5-10-9-10S4 12 0 12v2z'/%3E%3C/svg%3E");
	background-repeat: repeat-x;
	background-size: 88px 14px;
}

body.museo-xmas .site-footer::after {
	content: none;
	display: none;
}

body.museo-xmas .site-footer a {
	color: #ffc933;
}

body.museo-xmas .site-footer a:hover {
	color: #fff;
}

/* Twinkle ornaments on hero shapes */
body.museo-xmas .section-hero__shapes span:nth-child(1) {
	animation: museo-xmas-twinkle 3.2s ease-in-out infinite;
}

body.museo-xmas .section-hero__shapes span:nth-child(2) {
	animation: museo-xmas-twinkle 4s ease-in-out 0.6s infinite;
}

body.museo-xmas .section-hero__shapes span:nth-child(3) {
	animation: museo-xmas-twinkle 3.6s ease-in-out 1.1s infinite;
}

@keyframes museo-xmas-twinkle {
	0%, 100% { opacity: 0.4; transform: scale(1); }
	50% { opacity: 0.85; transform: scale(1.08); }
}

/* Cookie accept button stays festive */
body.museo-xmas .cookie-consent .btn--primary {
	box-shadow: 2px 2px 0 #ffc933;
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.museo-xmas-snow__flake,
	.museo-xmas-lights__bulb,
	.section-hero__badge--anniversary,
	.section-hero__badge,
	body.museo-xmas .section-hero__shapes span {
		animation: none !important;
	}

	.museo-xmas-snow {
		opacity: 0.4;
	}

	.museo-xmas-snow__flake {
		top: 8%;
		opacity: 0.45;
	}

	.museo-xmas-lights__bulb {
		opacity: 0.85;
		filter: brightness(1.1);
	}
}

@media (max-width: 640px) {
	.museo-xmas-snow__flake:nth-child(n + 28) {
		display: none;
	}

	.museo-xmas-frost {
		height: 20vh;
		opacity: 0.7;
	}

	.museo-xmas-lights__bulb:nth-child(n + 18) {
		display: none;
	}

	.museo-xmas-drift {
		opacity: 0.4;
		height: 8vh;
	}
}
