/*
 * Footer du site (`[nirmata_site_footer]`, 0.167.0) — maquette B « Rosaces »
 * (`reference/footer-et-confidentialite.md`, F1-F2). Rendez-vous de la soirée,
 * quatre colonnes, ligne légale ; rosace de la soirée aux deux bords (variables
 * `--nirmata-site-header-rosace*`, posées par `SiteHeader::rosace_style`), ou
 * mandalas de l'association en fondu circulaire.
 */

.nirmata-site-footer {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	color: var( --nirmata-text );
	background: #0e0f15;
	border-top: 1px solid rgba( 216, 183, 163, 0.12 );
	font-size: 15px;
}

.nirmata-site-footer a {
	color: inherit;
	text-decoration: none;
}

.nirmata-site-footer a:hover,
.nirmata-site-footer a:focus-visible {
	color: var( --nirmata-rose );
	text-decoration: underline;
	text-underline-offset: 4px;
}

.nirmata-site-footer__inner {
	position: relative;
	z-index: 2;
	max-width: 1180px;
	margin: 0 auto;
	padding: 48px 24px 0;
}

.nirmata-site-footer__cols {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 32px;
}

.nirmata-site-footer__brand {
	display: flex;
	gap: 14px;
	align-items: center;
}

.nirmata-site-footer__brand img {
	width: 56px;
	height: 56px;
}

.nirmata-site-footer__name {
	font-family: var( --nirmata-font-display );
	font-weight: 700;
	font-size: 22px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var( --nirmata-rose );
}

.nirmata-site-footer__tag {
	margin: 12px 0 0;
	color: var( --nirmata-text-muted );
	font-size: 14px;
	line-height: 1.5;
	max-width: 30ch;
}

.nirmata-site-footer__kicker {
	margin: 4px 0 12px;
	font-family: var( --nirmata-font-display );
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var( --nirmata-primary );
}

.nirmata-site-footer__list,
.nirmata-site-footer__socials {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nirmata-site-footer__list {
	display: grid;
	gap: 8px;
}

.nirmata-site-footer__list a {
	white-space: nowrap;
}

.nirmata-site-footer__socials {
	display: flex;
	gap: 10px;
}

.nirmata-site-footer .nirmata-site-footer__socials a {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid rgba( 201, 153, 70, 0.35 );
	color: var( --nirmata-secondary );
	text-decoration: none;
}

.nirmata-site-footer .nirmata-site-footer__socials a:hover,
.nirmata-site-footer .nirmata-site-footer__socials a:focus-visible {
	background: var( --nirmata-secondary-soft );
}

.nirmata-site-footer__socials svg {
	width: 18px;
	height: 18px;
}

.nirmata-site-footer__legal {
	position: relative;
	z-index: 2;
	margin-top: 40px;
	padding: 16px 24px 22px;
	border-top: 1px solid rgba( 216, 183, 163, 0.1 );
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 18px;
	font-size: 13px;
	color: var( --nirmata-text-muted );
}

.nirmata-site-footer__legal span + span::before {
	content: "·";
	margin-right: 18px;
	color: rgba( 216, 183, 163, 0.35 );
}

/* Rendez-vous : la soirée mise en avant. */
.nirmata-site-footer__rdv {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px 32px;
	margin-bottom: 44px;
	padding: 22px 28px;
	border: 1px solid rgba( 201, 153, 70, 0.28 );
	border-radius: 14px;
	background: linear-gradient( 90deg, rgba( 201, 153, 70, 0.1 ), rgba( 77, 171, 162, 0.06 ) );
	backdrop-filter: blur( 2px );
}

.nirmata-site-footer__rdv-kicker {
	font-family: var( --nirmata-font-display );
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var( --nirmata-primary );
}

.nirmata-site-footer__rdv-name {
	display: block;
	margin: 6px 0 4px;
	font-family: var( --nirmata-font-display );
	font-weight: 700;
	font-size: 26px;
	text-transform: uppercase;
	color: var( --nirmata-rose );
}

.nirmata-site-footer__rdv-when {
	color: var( --nirmata-text-muted );
}

.nirmata-site-footer__btns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.nirmata-site-footer .nirmata-site-footer__btn {
	display: inline-block;
	padding: 10px 18px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 14px;
	border: 1px solid var( --nirmata-secondary );
	color: var( --nirmata-secondary );
	text-decoration: none;
}

.nirmata-site-footer .nirmata-site-footer__btn--fill {
	background: var( --nirmata-primary );
	border-color: var( --nirmata-primary );
	color: var( --nirmata-primary-ink );
}

.nirmata-site-footer .nirmata-site-footer__btn:hover,
.nirmata-site-footer .nirmata-site-footer__btn:focus-visible {
	text-decoration: none;
	filter: brightness( 1.12 );
}

.nirmata-site-footer .nirmata-site-footer__btn--fill:hover,
.nirmata-site-footer .nirmata-site-footer__btn--fill:focus-visible {
	color: var( --nirmata-primary-ink );
}

/* Décor : rosace de la soirée (deux calques, le dessus tourne si la soirée le demande). */
.nirmata-site-footer__decor {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.nirmata-site-footer__rosace {
	position: absolute;
	top: 50%;
	height: 560px;
	aspect-ratio: 1;
	translate: 0 -50%;
}

.nirmata-site-footer__rosace--start {
	left: -200px;
}

.nirmata-site-footer__rosace--end {
	right: -200px;
}

.nirmata-site-footer__layer {
	position: absolute;
	inset: 0;
	background: center / contain no-repeat;
}

.nirmata-site-footer__layer--under {
	background-image: var( --nirmata-site-header-rosace );
	opacity: 0.26;
}

.nirmata-site-footer__layer--top {
	background-image: var( --nirmata-site-header-rosace-top );
	opacity: 0.18;
}

.nirmata-site-footer--spin .nirmata-site-footer__layer--top {
	animation: nirmata-site-footer-spin 240s linear infinite;
}

@keyframes nirmata-site-footer-spin {
	to {
		transform: rotate( 1turn );
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.nirmata-site-footer--spin .nirmata-site-footer__layer--top {
		animation: none;
	}
}

/* Sans soirée (ou soirée sans fond) : les mandalas prennent la place de la
 * rosace, même géométrie, fondu circulaire — une image rectangulaire laissait
 * des bords francs et des bandes nues sur téléphone. */
.nirmata-site-footer--mandalas .nirmata-site-footer__rosace {
	-webkit-mask-image: radial-gradient( closest-side, #000 55%, transparent );
	mask-image: radial-gradient( closest-side, #000 55%, transparent );
}

.nirmata-site-footer--mandalas .nirmata-site-footer__layer--under {
	background-size: cover;
	opacity: 0.32;
}

.nirmata-site-footer--mandalas .nirmata-site-footer__rosace--start .nirmata-site-footer__layer--under {
	background-image: image-set( url( ../img/site-header/mandala-start.webp ) 1x, url( ../img/site-header/mandala-start-2x.webp ) 2x );
}

.nirmata-site-footer--mandalas .nirmata-site-footer__rosace--end .nirmata-site-footer__layer--under {
	background-image: image-set( url( ../img/site-header/mandala-end.webp ) 1x, url( ../img/site-header/mandala-end-2x.webp ) 2x );
}

@media ( max-width: 782px ) {
	.nirmata-site-footer__cols {
		grid-template-columns: 1fr 1fr;
		gap: 28px 20px;
	}

	.nirmata-site-footer__cols > :first-child {
		grid-column: 1 / -1;
	}

	.nirmata-site-footer__rdv {
		padding: 18px;
	}

	.nirmata-site-footer__rdv-name {
		font-size: 21px;
	}

	.nirmata-site-footer__rosace {
		height: 340px;
	}

	.nirmata-site-footer__rosace--start {
		left: -170px;
	}

	.nirmata-site-footer__rosace--end {
		right: -170px;
	}

	.nirmata-site-footer__legal {
		flex-direction: column;
		align-items: center;
		gap: 4px;
	}

	.nirmata-site-footer__legal span + span::before {
		content: none;
	}
}