/*
 * FIZZE Dots - grille de points interactive (LAUNCH-MOTION-004).
 *
 * Styles du prototype LAUNCH-MOTION-003 (PASS artistique du 24/10/2026),
 * généralisés à tout conteneur portant `data-fizze-dots`. Chargée seulement
 * quand une instance est rendue (fizze_dots_enqueue(), functions.php).
 * Le fond de l'instance est posé côté serveur (style du conteneur) : sans
 * JavaScript ou sans Canvas, le conteneur garde ce fond, simplement sans points.
 */

/* Le calque reste sous le contenu du conteneur, sans en sortir. */
[data-fizze-dots] {
	position: relative;
	isolation: isolate;
}

.fz-dots {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	border-radius: inherit;
	overflow: hidden;
}

/*
 * Dans un groupe « constrained », WordPress donne à chaque enfant la colonne de
 * contenu (max-width, marges auto en !important) et une marge de bloc. Le
 * calque, lui, couvre tout le conteneur : on neutralise les deux.
 */
[data-fizze-dots] > .fz-dots { max-width: none; margin: 0 !important; }

/* Masque "radial" du moteur d'origine. */
.fz-dots--radial {
	-webkit-mask-image: radial-gradient(ellipse 70% 65% at 50% 50%, #000 25%, transparent 100%);
	mask-image: radial-gradient(ellipse 70% 65% at 50% 50%, #000 25%, transparent 100%);
}

.fz-dots__canvas { display: block; width: 100%; height: 100%; }

/* Hero : sa lueur bleue s'efface sous la grille, comme dans le prototype 003. */
.fizze-hero[data-fizze-dots]::before,
.fizze-hero[data-fizze-dots]::after { content: none; }