/*
 * Micro-interactions et décors — tout ce qui ne tient pas dans theme.json.
 * Pas de couleurs de marque ici : elles vivent dans theme.json.
 */

/* Sélecteur de langue (shortcode Polylang) */
.cardarium-lang-switcher {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
	white-space: nowrap;
}
.cardarium-lang-switcher a {
	color: var(--wp--preset--color--text-muted);
	text-decoration: none;
	transition: color 0.35s ease;
}
.cardarium-lang-switcher a:hover {
	color: var(--wp--preset--color--copper-soft);
}
.cardarium-lang-current {
	color: var(--wp--preset--color--copper);
}

/* Logo néon officiel : le noir du fichier se fond dans le bleu nuit (le néon reste visible) */
.cardarium-logo img {
	mix-blend-mode: lighten;
}

/* Panneau booster (cards univers) : halo cuivre discret + hauteur constante */
.cardarium-booster-stage {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 220px;
	border-radius: 6px;
	background: radial-gradient(ellipse at 50% 45%, rgba(184, 131, 90, 0.14) 0%, transparent 62%);
}

.cardarium-booster-stage img {
	filter: drop-shadow(0 12px 22px rgba(0, 0, 0, 0.5));
	transition: transform 0.35s ease;
}

.cardarium-booster-stage:hover img {
	transform: translateY(-4px) rotate(-1deg);
}

/* Titre de page conservé pour le SEO/l'accessibilité mais masqué visuellement */
.cardarium-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Décor Dragonéo (mascotte + boosters) dans le hero, côté gauche */
.cardarium-hero {
	position: relative;
	overflow: hidden;
	/* Remplit l'écran sous le header (~6rem) → la section suivante n'apparaît qu'au scroll.
	   Plancher à 560px pour les écrans courts ; svh pour éviter le saut de barre d'URL mobile. */
	min-height: max(560px, calc(100vh - 6rem)) !important;
	min-height: max(560px, calc(100svh - 6rem)) !important;
}

/* Décor gauche : mascotte + boosters (discret) */
.cardarium-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: url(../img/dragoneo-cards.webp) no-repeat left -7rem center / auto 62%;
	opacity: 0.11;
	pointer-events: none;
}

/* Décor droit : photo réelle (main + booster), fondue dans le fond de tous les côtés */
.cardarium-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url(../img/machine-booster.jpg) no-repeat right -1rem center / auto 66%;
	-webkit-mask-image: radial-gradient(68% 88% at 100% 50%, #000 44%, transparent 78%);
	mask-image: radial-gradient(68% 88% at 100% 50%, #000 44%, transparent 78%);
	opacity: 0.85;
	pointer-events: none;
}

@media (max-width: 1100px) {
	.cardarium-hero::before,
	.cardarium-hero::after {
		display: none;
	}
}

/* Apparition en fondu + légère translation (brief : animations lentes) */
@media (prefers-reduced-motion: no-preference) {
	.cardarium-hero .wp-block-cover__inner-container {
		animation: cardarium-rise 0.9s ease both;
	}

	@keyframes cardarium-rise {
		from {
			opacity: 0;
			transform: translateY(16px);
		}
		to {
			opacity: 1;
			transform: none;
		}
	}
}

/* --- Presse : grille de cartes (shortcode [cardarium_press]) --- */
.cardarium-press-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--30);
}

.cardarium-press-card {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	padding: var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 6px;
	transition: border-color 0.35s ease, transform 0.3s ease;
}

.cardarium-press-card:hover {
	border-color: var(--wp--preset--color--copper);
	transform: translateY(-2px);
}

.cardarium-press-source {
	margin: 0;
	font-size: var(--wp--preset--font-size--xs);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	font-weight: 600;
	color: var(--wp--preset--color--copper);
}

.cardarium-press-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.2;
}

.cardarium-press-excerpt {
	margin: 0;
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--sm);
}

.cardarium-press-link {
	margin: 0.2rem 0 0;
	font-size: var(--wp--preset--font-size--sm);
}

.cardarium-press-link a {
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 600;
}

/* --- Accessibilité : focus clavier visible (indispensable sur fond sombre) --- */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--copper-soft);
	outline-offset: 3px;
	border-radius: 2px;
}
/* Boutons cuivre : anneau clair pour rester visible sur le fond cuivre */
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--text);
	outline-offset: 3px;
}

/* --- Header collant (reste en haut au scroll) --- */
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}

/* --- Page courante : entrée de menu en cuivre (comme la langue active) --- */
.wp-block-navigation a[aria-current="page"],
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"],
.wp-block-navigation .current-menu-item > a {
	color: var(--wp--preset--color--copper) !important;
}

/* --- Pages de contenu (hors accueil) : plus d'air entre les sections ---
   Ciblé sur le contenu de page (post-content) → n'affecte pas l'accueil (front-page).
   On espace les blocs « section » sans écarter le cluster d'intro (kicker/h1/lede). */
.wp-block-post-content > h2,
.wp-block-post-content > .wp-block-group,
.wp-block-post-content > .wp-block-columns,
.wp-block-post-content > .wp-block-image,
.wp-block-post-content > .wp-block-buttons,
.wp-block-post-content > .wp-block-media-text {
	/* Valeur directe : le preset spacing-50 vaut 1.5rem sur ce site (échelle WP
	   par défaut), trop petit. !important bat le gap logique de WP. */
	margin-block-start: clamp(3rem, 5vw, 4.5rem) !important;
}

/* --- FAQ : accordéon natif <details> (sans JS) --- */
.cardarium-faq {
	max-width: 760px;
	margin-inline: auto;
}
.cardarium-faq__title {
	/* Aligné sur les titres de section (2xl). Valeur directe : la variable
	   --wp--preset--font-size--2xl ne se résout pas sur ce site. */
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.5rem, 1.8rem + 3vw, 4rem);
	line-height: 1.1;
	font-weight: 600;
	text-align: center;
	margin-bottom: 2.5rem;
}
.cardarium-faq__item {
	border-top: 1px solid var(--wp--preset--color--border);
	padding: var(--wp--preset--spacing--20) 0;
}
.cardarium-faq__item:last-child {
	border-bottom: 1px solid var(--wp--preset--color--border);
}
.cardarium-faq__item summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--lg);
	color: var(--wp--preset--color--text);
	transition: color 0.3s ease;
}
.cardarium-faq__item summary::-webkit-details-marker {
	display: none;
}
.cardarium-faq__item summary::after {
	content: "+";
	color: var(--wp--preset--color--copper);
	font-size: 1.4em;
	line-height: 1;
	flex: 0 0 auto;
}
.cardarium-faq__item[open] summary::after {
	content: "\2212"; /* − */
}
.cardarium-faq__item summary:hover {
	color: var(--wp--preset--color--copper-soft);
}
.cardarium-faq__answer {
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.7;
	padding-top: var(--wp--preset--spacing--10);
	max-width: 68ch;
}