/* ================================================================
   AMBIANCE INSPIRÉE DE L'INTRANET (validée le 2026-10-24)
   Même structure, mêmes polices, mêmes couleurs de marque.
   Trois calques fixes derrière la page, composés une fois par la carte graphique :
   body::before = le dégradé, .ac::before = le halo doré qui dérive, .ac::after = la trame de points.
   Les cartes deviennent du verre léger avec une ombre chaude.
================================================================ */
.ac {
	--amb-fond: radial-gradient(120% 90% at 100% 0%, #FBF8F2 0%, #F5F1EA 50%, #EFE9DE 100%);
	--amb-lumiere: rgba(217, 194, 154, .40);
	--amb-points: rgba(120, 95, 50, .14);
	--ac-carte: linear-gradient(160deg, rgba(255, 255, 255, .72) 0%, rgba(255, 255, 255, .38) 100%);
	--amb-ombre: 0 22px 50px rgba(90, 70, 30, .16), 0 2px 8px rgba(90, 70, 30, .06);
	isolation: isolate;
	background: transparent;
}
html.dark .ac {
	--amb-fond: radial-gradient(120% 90% at 100% 0%, #213B5E 0%, #14263F 45%, #0A1525 100%);
	--amb-lumiere: rgba(217, 194, 154, .16);
	--amb-points: rgba(255, 255, 255, .12);
	--ac-creme: #14263F;
	--ac-carte: rgba(255, 255, 255, .07);
	--amb-ombre: 0 24px 60px rgba(0, 0, 0, .35);
	--ac-ligne: rgba(245, 241, 234, .12);
	--ac-doux: rgba(245, 241, 234, .72);
}
body:has(.ac) { background: #F5F1EA; }
html.dark body:has(.ac) { background: #14263F; }

/* 1. Le dégradé */
body:has(.ac)::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(120% 90% at 100% 0%, #FBF8F2 0%, #F5F1EA 50%, #EFE9DE 100%); }
html.dark body:has(.ac)::before { background: radial-gradient(120% 90% at 100% 0%, #213B5E 0%, #14263F 45%, #0A1525 100%); }
/* 2. Le halo doré qui dérive (28 s, immobile si l'utilisateur réduit les animations) */
.ac::before {
	--d: max(62vw, 95vh);
	content: ""; position: fixed; z-index: -2; pointer-events: none; width: var(--d); aspect-ratio: 1; left: calc(53vw - var(--d) / 2); top: 14vh; border-radius: 50%;
	background: radial-gradient(closest-side, var(--amb-lumiere), transparent 100%); will-change: transform;
	animation: amb-lumiere 28s ease-in-out infinite alternate;
}
@keyframes amb-lumiere { 0% { transform: translate(0, 0); } 50% { transform: translate(28%, -22%); } 100% { transform: translate(-18%, 14%) scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .ac::before { animation: none; } }
/* 3. La trame de points, plus dense au centre, effacée sur les bords */
.ac::after {
	content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
	background-image: radial-gradient(var(--amb-points) 1px, transparent 1.2px); background-size: 22px 22px;
	opacity: .9;
	-webkit-mask: radial-gradient(90% 80% at 62% 58%, #000, transparent); mask: radial-gradient(90% 80% at 62% 58%, #000, transparent);
}

/* Sections qui avaient un aplat : on laisse voir le fond */
.ac-devis { background: transparent; }

/* Cartes en verre */
.ac-tarif, .ac-aide, .av-carte, .sv-presta article, .sv-tarifs article, .sv-fiches article, .qs-repere, .qs-modes article, .lg-fiche, .ct-formulaire {
	border: 0; /* aucune bordure fine (demande du client) : le verre tient au fond et à l'ombre */
	box-shadow: var(--amb-ombre);
	-webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4);
}
.av-fleche { border: 0; box-shadow: 0 6px 18px rgba(90, 70, 30, .12); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.ac-zones li { background: var(--ac-carte); border: 0; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }

/* Avis : la piste défile, ce qui rognait les ombres en un rectangle net.
   On lui donne de la place pour ses ombres, compensée par des marges négatives (alignement inchangé). */
.av-grille { padding: 24px 28px 64px; margin: -24px -28px -64px; scroll-padding-inline: 28px; }
/* Bords latéraux en fondu : pas de coupure nette, et la carte suivante n'apparaît pas dans la marge d'ombre */
@media (min-width: 761px) {
	.av-grille {
		-webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 12px, #000 28px, #000 calc(100% - 28px), transparent calc(100% - 12px));
		mask-image: linear-gradient(90deg, transparent 0, transparent 12px, #000 28px, #000 calc(100% - 28px), transparent calc(100% - 12px));
	}
}
@media (max-width: 760px) {
	.av-grille { padding-inline: 20px; margin-inline: -20px; scroll-padding-inline: 20px; }
}

/* Petites capitales grises pour les sous-titres, comme les titres de cartes de l'intranet */
.ac .ac-sous-titre { text-transform: uppercase; letter-spacing: .08em; font-size: 12.5px !important; }
html.dark .av-fleche { box-shadow: 0 8px 22px rgba(0, 0, 0, .3); }

/* Autres blocs qui avaient leur propre bordure fine : carte de calcul (bandeau bleu), carte « voir plus » des fiches, sommaire des articles */
.ac .sv-calcul { border: 0; box-shadow: 0 24px 60px rgba(0, 0, 0, .28); -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4); }
.ac .sv-fiches .sv-fiche-plus { border: 0; background: var(--ac-carte); box-shadow: var(--amb-ombre); -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4); }
@media (max-width: 960px) { .ac .ar-sommaire { border: 0; background: var(--ac-carte); box-shadow: var(--amb-ombre); } }