/**
 * Awen Diffusion — Design System
 * ADN visuel : éditorial, sombre, cinématographique (lignée « Theatre Artist »).
 * Toutes les valeurs sont centralisées ici pour rester ajustables d'un endroit.
 */

:root {
	/* Couleurs — base bleu nuit, en écho à la photo d'Éloïse */
	--awen-bg:        #0b0d16;
	--awen-surface:   #12141f;
	--awen-surface-2: #1c1f2e;
	--awen-text:      #f3efe6;
	--awen-muted:     #9b968a;
	--awen-line:      #272b3b;
	--awen-accent:    #c9a86a;
	--awen-accent-2:  #e4c98f;

	/* Typographie */
	--awen-font-display: 'Cinzel', Georgia, 'Times New Roman', serif;
	--awen-font-body:    'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	/* Échelle typographique (ratio ~1.25) */
	--awen-step-0: 1rem;
	--awen-step-1: 1.25rem;
	--awen-step-2: 1.563rem;
	--awen-step-3: 1.953rem;
	--awen-step-4: 2.441rem;
	--awen-step-5: 3.052rem;
	--awen-step-6: clamp(3rem, 6vw, 4.77rem);

	/* Espacement (échelle 8) */
	--awen-space-xs: 0.5rem;
	--awen-space-sm: 1rem;
	--awen-space-md: 2rem;
	--awen-space-lg: 4rem;
	--awen-space-xl: 8rem;

	/* Divers */
	--awen-maxw: 1200px;
	--awen-radius: 2px;
	--awen-transition: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

body {
	background-color: var(--awen-bg);
	color: var(--awen-text);
	font-family: var(--awen-font-body);
	font-weight: 300;
	line-height: 1.7;
	letter-spacing: 0.01em;
}

h1, h2, h3, h4, h5, h6,
.site-title {
	font-family: var(--awen-font-display);
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.2;
	color: var(--awen-text);
}

a {
	color: var(--awen-accent);
	transition: color var(--awen-transition);
}

a:hover,
a:focus {
	color: var(--awen-accent-2);
}

/* Sur-titre éditorial */
.awen-eyebrow {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--awen-accent);
}

/* Bouton */
.awen-btn {
	display: inline-block;
	font-family: var(--awen-font-body);
	font-weight: 500;
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 1rem 2.25rem;
	border: 1px solid var(--awen-accent);
	border-radius: var(--awen-radius);
	color: var(--awen-accent);
	background: transparent;
	transition: all var(--awen-transition);
}

.awen-btn:hover,
.awen-btn:focus {
	background: var(--awen-accent);
	color: var(--awen-bg);
}

/* Conteneur éditorial */
.awen-container {
	max-width: var(--awen-maxw);
	margin-inline: auto;
	padding-inline: var(--awen-space-md);
}

/* Apparition au défilement (amélioration progressive) */
.awen-reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.awen-reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.awen-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}