/**
 * Asmon — page Univers (hub + explorer le portail)
 */

body.asmon-page-template--univers {
	overflow-x: clip;
	background-color: #0a0907;
}

body.asmon-page-template--univers::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 80% 55% at 50% -10%, rgba(201, 168, 76, 0.09), transparent 55%),
		radial-gradient(ellipse 60% 40% at 100% 60%, rgba(58, 42, 28, 0.45), transparent 50%),
		linear-gradient(165deg, #0a0907 0%, #110e0a 45%, #0c0a08 100%);
	background-size: 100% 100%, 100% 100%, 100% 100%;
	animation: asmon-univers-breathe 22s ease-in-out infinite alternate;
}

@keyframes asmon-univers-breathe {
	0% { filter: brightness(1); }
	100% { filter: brightness(1.06); }
}

body.asmon-page-template--univers::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: 0.04;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	background-size: 180px 180px;
}

body.asmon-page-template--univers #main-container,
body.asmon-page-template--univers .site-main,
body.asmon-page-template--univers main {
	position: relative;
	z-index: 1;
}

.asmon-univers {
	--bg: #0e0b08;
	--bg-elevated: #16120d;
	--text: #7a6a52;
	--text-bright: #e8dec8;
	--accent: #c9a84c;
	--line: #1a1208;
	--font-display: "Cinzel", Georgia, serif;
	--font-body: "Crimson Pro", Georgia, serif;
	--motion-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--motion-dur: 1s;
	--univers-gutter: clamp(1rem, 4vw, 4rem);
	--univers-gap: clamp(0.75rem, 2vw, 1.25rem);
	--univers-max: 72rem;
	--univers-card-min: min(100%, 16.5rem);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	color: var(--text);
	font-family: var(--font-body);
	font-size: clamp(1rem, 2.5vw, 1.125rem);
	line-height: 1.65;
}

/* —— Hero —— */
.univers-hero {
	position: relative;
	/*min-height: clamp(22rem, 62vh, 36rem);*/
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}

.univers-hero__bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	background-size: cover;
	background-position: center 30%;
}

.univers-hero__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 30%;
	filter: sepia(0.35) brightness(0.42);
	transform: scale(1.06);
	transition: transform 8s ease-out;
}

.univers-hero__bg--fallback {
	filter: sepia(0.35) brightness(0.42);
	transform: scale(1.06);
	transition: transform 8s ease-out;
}

.univers-hero:hover .univers-hero__img,
.univers-hero:hover .univers-hero__bg--fallback {
	transform: scale(1.1);
}

.univers-hero__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		var(--bg) 0%,
		rgba(14, 11, 8, 0.88) 38%,
		rgba(14, 11, 8, 0.35) 100%
	);
}

.univers-hero__grain {
	position: absolute;
	inset: 0;
	opacity: 0.12;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	mix-blend-mode: soft-light;
	pointer-events: none;
}

.univers-hero__dust {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
}

.univers-mote {
	position: absolute;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--accent);
	opacity: 0;
	box-shadow: 0 0 6px rgba(201, 168, 76, 0.6);
	animation: univers-mote-rise linear forwards;
}

.univers-mote--lg {
	width: 5px;
	height: 5px;
}

@keyframes univers-mote-rise {
	0% {
		opacity: 0;
		transform: translateY(0) translateX(0);
	}
	12% { opacity: 0.85; }
	100% {
		opacity: 0;
		transform: translateY(-120px) translateX(var(--mote-drift, 0));
	}
}

.univers-hero__inner {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 0.5rem;
	width: 100%;
	max-width: 52rem;
	margin: 0 auto;
	padding: clamp(3rem, 8vh, 5rem) var(--univers-gutter) clamp(2.5rem, 6vh, 4rem);
	box-sizing: border-box;
}

.univers-kicker {
	font-family: var(--font-display);
	font-size: 0.625rem;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--accent);
	margin: 0 0 0.75rem;
}

.univers-hero__title {
	font-family: var(--font-display);
	font-size: clamp(2rem, 6vw, 3.25rem);
	font-weight: 400;
	color: var(--text-bright);
	margin: 0 0 1rem;
	line-height: 1.15;
}

.univers-hero__lead {
	max-width: 36rem;
	width: 100%;
	margin: 0;
	font-size: clamp(1.05rem, 2.8vw, 1.2rem);
	color: var(--text);
}

.univers-hero__scroll {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
	margin-top: 0.8rem;
	font-family: var(--font-display);
	font-size: 0.5625rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--accent);
}

.univers-hero__scroll-line {
	display: block;
	width: 1px;
	height: 2.5rem;
	background: linear-gradient(to bottom, var(--accent), transparent);
	animation: univers-scroll-pulse 2.2s ease-in-out infinite;
}

@keyframes univers-scroll-pulse {
	0%, 100% { opacity: 0.35; transform: scaleY(0.7); }
	50% { opacity: 1; transform: scaleY(1); }
}

/* —— Reveals —— */
.asmon-univers .reveal {
	opacity: 0;
	transform: translateY(36px);
	filter: blur(5px);
	transition:
		opacity var(--motion-dur) var(--motion-ease),
		transform var(--motion-dur) var(--motion-ease),
		filter var(--motion-dur) var(--motion-ease);
}

.asmon-univers .reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
	filter: blur(0);
}

/* Hero univers : fondu sur place + défloutage (pas de slide vertical) */
.asmon-univers .univers-hero {
	--univers-hero-fade-dur: 2.1s;
}

.asmon-univers .univers-hero .reveal {
	transform: none;
	filter: blur(8px);
	transition:
		opacity var(--univers-hero-fade-dur) var(--motion-ease),
		filter var(--univers-hero-fade-dur) var(--motion-ease);
}

.asmon-univers .univers-hero .reveal.is-visible {
	transform: none;
	filter: blur(0);
}

.asmon-univers .univers-hero .reveal--delay-1 { transition-delay: 0.45s; }
.asmon-univers .univers-hero .reveal--delay-2 { transition-delay: 0.9s; }
.asmon-univers .univers-hero .reveal--delay-3 { transition-delay: 1.35s; }

.asmon-univers .reveal--delay-1 { transition-delay: 0.16s; }
.asmon-univers .reveal--delay-2 { transition-delay: 0.32s; }
.asmon-univers .reveal--delay-3 { transition-delay: 0.48s; }

.univers-prose {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	padding: clamp(2rem, 6vh, 3.5rem) var(--univers-gutter);
	box-sizing: border-box;
	border-bottom: 1px solid var(--line);
}

.univers-prose .asmon-prose {
	width: 100%;
	max-width: 42rem;
	margin-inline: auto;
}

/* —— Index enfants (sigils) —— */
.univers-index--category + .univers-index--category {
	margin-top: clamp(2.5rem, 6vh, 4rem);
}

.univers-index--category .univers-index__head {
	margin-bottom: clamp(1.25rem, 3vh, 2rem);
}

.asmon-univers-categories-stage {
	position: relative;
}

.univers-index {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	/*padding: clamp(4rem, 12vh, 7rem) var(--univers-gutter);*/
	box-sizing: border-box;
}

.univers-index__glow {
	position: absolute;
	left: 50%;
	top: 20%;
	width: min(90vw, 42rem);
	height: 20rem;
	transform: translateX(-50%);
	background: radial-gradient(ellipse, rgba(201, 168, 76, 0.12), transparent 70%);
	pointer-events: none;
	animation: univers-glow-pulse 6s ease-in-out infinite alternate;
}

@keyframes univers-glow-pulse {
	0% { opacity: 0.5; transform: translateX(-50%) scale(0.95); }
	100% { opacity: 1; transform: translateX(-50%) scale(1.05); }
}

.univers-index__head {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 36rem;
	margin: 0 auto 3rem;
	text-align: center;
}

.univers-index__title {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 4vw, 2rem);
	font-weight: 400;
	color: var(--text-bright);
	margin: 0 0 0.75rem;
}

.univers-index__lead {
	margin: 0;
	color: var(--text);
}

.univers-sigils {
	position: relative;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 16.5rem), 1fr));
	align-items: stretch;
	gap: var(--univers-gap);
	width: 100%;
	max-width: var(--univers-max);
	margin: 0 auto;
}

/* 3 voies : colonnes égales, titres sur la même ligne */
.univers-sigils:has(.univers-sigil:nth-child(3):last-child) {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.univers-sigil {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	min-width: 0;
	min-height: 14rem;
	height: 100%;
	padding: 1.75rem 1.5rem 1.5rem;
	text-decoration: none !important;
	color: var(--text) !important;
	background: var(--bg-elevated);
	border: 1px solid var(--line);
	overflow: hidden;
	box-sizing: border-box;
	transition:
		border-color 0.4s ease,
		transform 0.55s var(--motion-ease),
		box-shadow 0.55s ease;
}

.univers-sigil::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--sigil-bg, none);
	background-size: cover;
	background-position: center;
	opacity: 0.22;
	filter: sepia(0.5) brightness(0.45);
	transition: opacity 0.5s ease, transform 0.7s ease;
}

.univers-sigil:hover::before {
	opacity: 0.45;
	transform: scale(1.08);
}

.univers-sigil:hover {
	border-color: rgba(201, 168, 76, 0.4);
	transform: translateY(-8px);
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
}

.univers-sigil__halo {
	position: absolute;
	inset: -40%;
	background: conic-gradient(from 0deg, transparent, rgba(201, 168, 76, 0.15), transparent 40%);
	opacity: 0;
	animation: univers-halo-spin 12s linear infinite;
	transition: opacity 0.4s ease;
}

.univers-sigil:hover .univers-sigil__halo {
	opacity: 1;
}

@keyframes univers-halo-spin {
	to { transform: rotate(360deg); }
}

.univers-sigil__frame {
	position: absolute;
	inset: 0.65rem;
	border: 1px solid rgba(201, 168, 76, 0.15);
	pointer-events: none;
	transition: border-color 0.4s ease;
}

.univers-sigil:hover .univers-sigil__frame {
	border-color: rgba(201, 168, 76, 0.35);
}

.univers-sigil__num {
	position: relative;
	z-index: 1;
	font-family: var(--font-display);
	font-size: 0.75rem;
	letter-spacing: 0.15em;
	color: var(--accent);
}

.univers-sigil__body {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
	margin-top: 0.75rem;
	padding-top: 0.5rem;
}

.univers-sigil__head {
	display: flex;
	align-items: flex-end;
	width: 100%;
}

.univers-sigil__title {
	font-family: var(--font-display) !important;
	font-size: 1.15rem !important;
	font-weight: 400 !important;
	line-height: 1.25 !important;
	color: var(--text-bright) !important;
	margin: 0 !important;
}

.univers-sigil__excerpt {
	flex: 1 1 auto;
	margin: 0.75rem 0;
	font-size: 1rem;
	line-height: 1.55;
}

.univers-sigil__excerpt--empty {
	margin: 0;
	padding: 0;
	min-height: 0;
	visibility: hidden;
}

.univers-sigil__cta {
	flex: 0 0 auto;
	margin-top: auto;
	font-family: var(--font-display);
	font-size: 0.625rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--accent);
	transition: letter-spacing 0.35s ease;
}

.univers-sigil:hover .univers-sigil__cta {
	letter-spacing: 0.28em;
}

/* —— Présentation (image fixe + scroll) —— */
.univers-story {
	display: grid;
	grid-template-columns: 1fr;
	width: 100%;
	background: var(--bg);
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

@media (min-width: 900px) {
	.univers-story {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.univers-story__visual {
		position: sticky;
		top: 0;
		align-self: start;
		height: 100vh;
	}

	.univers-story__visual-inner {
		height: 100%;
		min-height: 100vh;
	}
}

.univers-story__visual-inner {
	position: relative;
	min-height: clamp(16rem, 45vh, 28rem);
	overflow: hidden;
}

.univers-story__visual-inner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: sepia(0.35) brightness(0.5);
}

.univers-story__panels {
	padding: clamp(2rem, 6vh, 4rem) var(--univers-gutter);
}

.univers-story__intro {
	margin-bottom: 1rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--line);
}

.univers-story__heading {
	font-family: var(--font-display);
	font-size: clamp(1.35rem, 3.5vw, 1.85rem);
	font-weight: 400;
	color: var(--text-bright);
	margin: 0 0 0.75rem;
}

.univers-story__lead {
	margin: 0;
	max-width: 36rem;
}

.univers-story__panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: clamp(18rem, 42vh, 28rem);
	padding: 2rem 0;
	border-bottom: 1px solid var(--line);
	transition:
		transform var(--motion-dur) var(--motion-ease),
		opacity var(--motion-dur) ease;
}

.univers-story__panel:last-child {
	border-bottom: none;
}

.univers-story__panel.reveal.is-visible:hover {
	transform: translateX(6px);
}

.univers-story__label {
	font-family: var(--font-display);
	font-size: 0.625rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--accent);
	margin: 0 0 0.5rem;
}

.univers-story__title {
	font-family: var(--font-display);
	font-size: clamp(1.15rem, 2.5vw, 1.35rem);
	font-weight: 400;
	color: var(--text-bright);
	margin: 0 0 0.85rem;
}

.univers-story__panel p {
	margin: 0;
	max-width: 32rem;
}

/* —— Responsive : alignements & colonnes —— */
@media (max-width: 639px) {
	.univers-hero__inner {
		align-items: center;
		text-align: center;
	}

	.univers-hero__scroll {
		align-items: center;
	}

	.univers-kicker {
		text-align: center;
	}

	.univers-sigils,
	.univers-sigils:has(.univers-sigil:nth-child(3):last-child) {
		grid-template-columns: 1fr;
	}

	.univers-story__panel.reveal.is-visible:hover {
		transform: none;
	}
}

@media (min-width: 640px) and (max-width: 899px) {
	.univers-sigils:has(.univers-sigil:nth-child(3):last-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px), (hover: none) and (pointer: coarse) {
	body.asmon-page-template--univers::before {
		animation-duration: 32s;
	}

	.univers-hero__img,
	.univers-hero__bg--fallback {
		filter: none;
		transform: none;
		transition: none;
	}

	.asmon-univers .reveal:not(.is-visible) {
		filter: blur(4px);
	}

	.asmon-univers .reveal.is-visible {
		filter: blur(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.asmon-page-template--univers::before,
	.univers-index__glow,
	.univers-hero__scroll-line,
	.univers-sigil__halo,
	.univers-hero__img,
	.univers-hero__bg--fallback {
		animation: none;
	}
	.asmon-univers .reveal,
	.univers-story__panel {
		opacity: 1;
		transform: none;
		filter: none;
	}
}