/* ══════════════════════════════════════════════════════════════════════
   LibeRté — les thèmes de saison (28/09/2026). Posés par saisons.js
   seulement quand le salon active un thème : sans la classe sur <html>,
   aucune de ces règles ne s'applique.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Halloween : la nuit sur l'accueil, l'orange de la citrouille ────── */
html.saison-halloween {
    --accent-theme: #ff7518;
    --saison-nuit: #1a0f2e;
    --saison-nuit-2: #2e1a4a;
    --saison-citrouille: #ff7518;
    --saison-os: #f3ead7;
}
html.saison-halloween .navbar { border-bottom-color: rgba(255, 117, 24, .45); }
html.saison-halloween .hero {
    background:
        radial-gradient(ellipse at 78% 18%, rgba(255, 214, 140, .18) 0%, rgba(255, 214, 140, 0) 38%),
        radial-gradient(ellipse at 50% 120%, #4a2a6e 0%, var(--saison-nuit-2) 45%, var(--saison-nuit) 100%);
}

.saison-decor { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 1; }
/* Le « R » de LibeRté est en bleu-vert foncé : lisible sur le turquoise
   d'origine, invisible sur la nuit. Il prend l'orange de la citrouille. */
html.saison-halloween .hero .logo-text .rte { color: var(--saison-citrouille); }

/* La lune dans l'espace libre AU-DESSUS du texte : à droite, elle passait
   derrière la photo du camion. */
.saison-lune {
    position: absolute; top: 92px; left: 40%; width: clamp(56px, 7vw, 96px); aspect-ratio: 1;
    filter: drop-shadow(0 0 28px rgba(255, 226, 150, .55));
    animation: saison-lueur 6s ease-in-out infinite alternate;
}
.saison-lune svg { width: 100%; height: 100%; display: block; }
@media (max-width: 900px) { .saison-lune { left: auto; right: 6%; top: 88px; width: 58px; } }
.saison-toile { position: absolute; top: 80px; width: clamp(80px, 12vw, 160px); aspect-ratio: 1; color: rgba(243, 234, 215, .28); }
.saison-toile svg { width: 100%; height: 100%; display: block; }
.saison-toile-g { left: 0; }
.saison-toile-d { right: 0; transform: scaleX(-1); }

.saison-chauve-souris { position: absolute; left: -80px; width: 54px; color: #0d0718; opacity: .85; animation: saison-vol 18s linear infinite; }
.saison-chauve-souris svg { width: 100%; display: block; animation: saison-battement .35s ease-in-out infinite alternate; transform-origin: 50% 40%; }
.saison-chauve-souris.cs-0 { top: 22%; animation-delay: 0s; }
.saison-chauve-souris.cs-1 { top: 34%; width: 38px; animation-duration: 23s; animation-delay: -6s; }
.saison-chauve-souris.cs-2 { top: 16%; width: 30px; animation-duration: 27s; animation-delay: -13s; opacity: .6; }
.saison-chauve-souris.cs-3 { top: 48%; width: 44px; animation-duration: 21s; animation-delay: -3s; }
.saison-chauve-souris.cs-4 { top: 28%; width: 26px; animation-duration: 31s; animation-delay: -19s; opacity: .5; }

@keyframes saison-vol {
    0%   { transform: translate(0, 0); }
    25%  { transform: translate(28vw, -30px); }
    50%  { transform: translate(56vw, 18px); }
    75%  { transform: translate(84vw, -22px); }
    100% { transform: translate(115vw, 0); }
}
@keyframes saison-battement { from { transform: scaleY(1); } to { transform: scaleY(.55); } }
@keyframes saison-lueur { from { filter: drop-shadow(0 0 18px rgba(255, 226, 150, .4)); } to { filter: drop-shadow(0 0 34px rgba(255, 226, 150, .7)); } }

/* ── la citrouille cachée ─────────────────────────────────────────────── */
.saison-cachette { position: relative; }
.saison-citrouille {
    position: absolute; right: clamp(10px, 4vw, 40px); bottom: 18px; z-index: 5;
    width: 58px; height: 58px; padding: 0; border: 0; background: none; cursor: pointer;
    filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .25));
    animation: saison-balancier 3.2s ease-in-out infinite;
    transform-origin: 50% 90%;
}
.saison-citrouille svg { width: 100%; height: 100%; display: block; }
.saison-citrouille:hover, .saison-citrouille:focus-visible { animation-duration: .8s; }
.saison-citrouille:focus-visible { outline: 3px solid var(--saison-citrouille); outline-offset: 4px; border-radius: 50%; }
.saison-citrouille:disabled { opacity: .6; cursor: progress; }
@keyframes saison-balancier { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }

/* ── le bandeau ───────────────────────────────────────────────────────── */
/* Centré par left/right + margin auto, PAS par left:50% + translate : un
   élément fixe à left:50% ne peut pas dépasser la moitié de l'écran — sur
   téléphone, le bandeau s'étirait en une colonne étroite. */
/* EN HAUT, sous la barre de navigation : en bas, les boutons flottants du
   site (annonces, panier) recouvraient sa croix de fermeture. */
.saison-bandeau {
    position: fixed; left: 0; right: 0; top: 92px; margin: 0 auto; width: fit-content; z-index: 999;
    display: flex; align-items: center; gap: 12px; max-width: min(640px, calc(100vw - 24px));
    padding: 10px 12px 10px 14px; border-radius: 999px;
    background: var(--saison-nuit, #1a0f2e); color: var(--saison-os, #f3ead7);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .28); font-size: 14.5px; line-height: 1.35;
}
.saison-bandeau-icone { flex: 0 0 30px; width: 30px; height: 30px; }
.saison-bandeau-icone svg { width: 100%; height: 100%; display: block; }
.saison-bandeau-texte { flex: 1 1 auto; min-width: 0; }
.saison-bandeau-lien {
    flex: 0 0 auto; padding: 7px 14px; border-radius: 999px; font-weight: 600; text-decoration: none;
    background: var(--saison-citrouille, #ff7518); color: #1a0f2e; white-space: nowrap;
}
.saison-bandeau-fermer {
    flex: 0 0 auto; width: 32px; height: 32px; border: 0; border-radius: 50%; cursor: pointer;
    background: rgba(255, 255, 255, .1); color: inherit; font-size: 20px; line-height: 1;
}
@media (max-width: 560px) {
    .saison-bandeau { width: auto; border-radius: 18px; top: 80px; margin: 0 12px; flex-wrap: wrap; row-gap: 8px; }
    .saison-bandeau-texte { flex: 1 1 calc(100% - 90px); }
}

/* ── la fenêtre du cadeau ─────────────────────────────────────────────── */
.saison-voile {
    position: fixed; inset: 0; z-index: 2000; display: flex; align-items: center; justify-content: center;
    padding: 16px; background: rgba(13, 7, 24, .6);
}
.saison-carte {
    width: min(420px, 100%); padding: 26px 22px 18px; border-radius: 22px; text-align: center;
    background: linear-gradient(180deg, #2e1a4a 0%, #1a0f2e 100%); color: #f3ead7;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
.saison-carte-icone { width: 72px; height: 72px; margin: -58px auto 8px; }
.saison-carte-icone svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .35)); }
.saison-carte-titre { margin: 0 0 10px; font-size: 22px; }
.saison-carte-texte { margin: 0 0 10px; line-height: 1.55; }
.saison-carte-recompense { margin: 0 0 10px; font-weight: 600; color: #ffb27a; }
.saison-carte-note { margin: 4px 0 12px; font-size: 13px; opacity: .8; }
.saison-code {
    display: inline-block; margin: 4px 0 12px; padding: 10px 18px; border-radius: 12px;
    font: 700 24px/1.2 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; letter-spacing: 3px;
    background: rgba(255, 117, 24, .15); border: 1px dashed rgba(255, 117, 24, .7); color: #ffd2ad;
}
.saison-carte-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 6px; }
.saison-bouton {
    min-height: 44px; padding: 0 18px; border: 0; border-radius: 12px; cursor: pointer; font: inherit; font-weight: 600;
    background: #ff7518; color: #1a0f2e;
}
.saison-bouton-discret { background: rgba(255, 255, 255, .12); color: #f3ead7; }

/* ── le cadeau dans l'espace de la cliente ────────────────────────────── */
.saison-espace {
    display: flex; align-items: center; gap: 12px; margin: 14px 0; padding: 14px 16px; border-radius: 16px;
    background: linear-gradient(135deg, #2e1a4a 0%, #1a0f2e 100%); color: #f3ead7; line-height: 1.5;
}
.saison-espace-icone { flex: 0 0 40px; width: 40px; height: 40px; }
.saison-espace-icone svg { width: 100%; height: 100%; display: block; }
.saison-code-petit { font: 700 16px ui-monospace, Menlo, Consolas, monospace; letter-spacing: 2px; color: #ffd2ad; }
.saison-espace-utilise { font-size: 13px; opacity: .8; }

/* ── moins de mouvement : tout s'arrête ───────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .saison-lune, .saison-chauve-souris, .saison-chauve-souris svg, .saison-citrouille { animation: none !important; }
    .saison-chauve-souris { display: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   OCTOBRE ROSE À VANNES (28/09/2026) : l'aube rose sur l'accueil, le ruban,
   la silhouette de Vannes au pied de l'accueil, de petits rubans qui montent.
   Le bandeau reprend les variables : fond framboise, bouton rose pâle.
   ══════════════════════════════════════════════════════════════════════ */
html.saison-octobre-rose {
    --accent-theme: #e0457b;
    --saison-nuit: #7a1846;
    --saison-os: #fff1f6;
    --saison-citrouille: #ffc9dc;
}
html.saison-octobre-rose .navbar { border-bottom-color: rgba(224, 69, 123, .45); }
html.saison-octobre-rose .hero {
    background:
        radial-gradient(ellipse at 18% 8%, rgba(255, 226, 237, .42) 0%, rgba(255, 226, 237, 0) 42%),
        radial-gradient(ellipse at 86% 92%, rgba(255, 158, 192, .34) 0%, rgba(255, 158, 192, 0) 46%),
        linear-gradient(160deg, #db5a90 0%, #b8336c 50%, #7a1846 100%);
}
/* Le « R » bleu-vert disparaissait sur le framboise : il prend un rose très pâle, lumineux. */
html.saison-octobre-rose .hero .logo-text .rte { color: #ffe6ef; text-shadow: 0 0 18px rgba(255, 255, 255, .45); }

/* Le calque commun des sections (.parallax-bg::before, turquoise à 15 %)
   voilait le rose d'un gris mauve : il passe au rose. */
html.saison-octobre-rose .hero.parallax-bg::before { background: radial-gradient(circle, #ffd3e2 0%, #e0457b 100%); }

/* Le ruban, au bout du titre « LibeRté By Suzanne. » (dans le flux du texte). */
.saison-ruban {
    display: inline-block; vertical-align: middle; position: relative; top: -.1em;
    width: clamp(30px, 3.2vw, 46px); aspect-ratio: 100 / 140; margin-left: .35em;
    filter: drop-shadow(0 6px 14px rgba(122, 24, 70, .45)) drop-shadow(0 0 18px rgba(255, 205, 224, .6));
    animation: saison-flotte 7s ease-in-out infinite; transform-origin: 50% 18%;
}
.saison-ruban svg, .saison-petale svg, .saison-vannes svg { width: 100%; height: 100%; display: block; }

.saison-vannes { position: absolute; left: 0; right: 0; bottom: 0; height: clamp(92px, 13vw, 200px); color: #fff0f6; }

.saison-petale { position: absolute; bottom: -40px; width: 15px; aspect-ratio: 100 / 140; opacity: 0; animation: saison-montee 26s linear infinite; }
.saison-petale.sp-0 { left: 6%; }
.saison-petale.sp-1 { left: 19%; width: 11px; animation-duration: 31s; animation-delay: -9s; }
.saison-petale.sp-2 { left: 33%; animation-duration: 28s; animation-delay: -17s; }
.saison-petale.sp-3 { left: 58%; width: 12px; animation-duration: 34s; animation-delay: -4s; }
.saison-petale.sp-4 { left: 74%; animation-duration: 29s; animation-delay: -21s; }
.saison-petale.sp-5 { left: 90%; width: 10px; animation-duration: 36s; animation-delay: -12s; }

.saison-bulle {
    position: absolute; bottom: -80px; width: 90px; aspect-ratio: 1; border-radius: 50%; opacity: 0;
    background: radial-gradient(circle, rgba(255, 230, 239, .5) 0%, rgba(255, 230, 239, 0) 70%);
    animation: saison-montee 38s linear infinite;
}
.saison-bulle.sb-0 { left: 12%; }
.saison-bulle.sb-1 { left: 36%; width: 60px; animation-duration: 44s; animation-delay: -15s; }
.saison-bulle.sb-2 { left: 55%; width: 120px; animation-duration: 50s; animation-delay: -30s; }
.saison-bulle.sb-3 { left: 78%; width: 70px; animation-duration: 41s; animation-delay: -8s; }
.saison-bulle.sb-4 { left: 92%; width: 50px; animation-duration: 46s; animation-delay: -24s; }

@keyframes saison-flotte { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-8px) rotate(3deg); } }
@keyframes saison-montee {
    0%   { transform: translate(0, 0) rotate(0deg); opacity: 0; }
    12%  { opacity: .55; }
    50%  { transform: translate(22px, -55vh) rotate(12deg); }
    88%  { opacity: .45; }
    100% { transform: translate(-12px, -112vh) rotate(-8deg); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .saison-ruban, .saison-petale, .saison-bulle { animation: none !important; }
    .saison-petale, .saison-bulle { display: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   NOËL À VANNES (28/09/2026) : la nuit d'hiver bleu-vert (la famille de
   couleurs de la marque), la guirlande, la neige, l'étoile, Vannes sous la
   neige. Le jeu devient « le cadeau caché » : fenêtres et codes en or.
   ══════════════════════════════════════════════════════════════════════ */
html.saison-noel {
    --saison-nuit: #0c3242;
    --saison-os: #fdf6e3;
    --saison-citrouille: #f2c14e;
}
html.saison-noel .navbar { border-bottom-color: rgba(242, 193, 78, .5); }
html.saison-noel .hero {
    background:
        radial-gradient(ellipse at 82% 12%, rgba(255, 214, 140, .20) 0%, rgba(255, 214, 140, 0) 36%),
        radial-gradient(ellipse at 20% 100%, rgba(120, 200, 210, .18) 0%, rgba(120, 200, 210, 0) 50%),
        linear-gradient(170deg, #0f4a5c 0%, #0a3344 50%, #05202c 100%);
}
html.saison-noel .hero .logo-text .rte { color: #f2c14e; text-shadow: 0 0 16px rgba(242, 193, 78, .45); }

.saison-etoile {
    display: inline-block; vertical-align: middle; position: relative; top: -.15em;
    width: clamp(30px, 3.2vw, 46px); aspect-ratio: 1; margin-left: .35em;
    filter: drop-shadow(0 0 12px rgba(247, 212, 114, .75));
    animation: saison-scintille 3.6s ease-in-out infinite;
}
.saison-etoile svg { width: 100%; height: 100%; display: block; }

.saison-guirlande { position: absolute; left: 0; right: 0; top: 70px; height: 44px; }
.saison-guirlande svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.saison-ampoule {
    position: absolute; width: 9px; height: 13px; margin-left: -4.5px; border-radius: 50% 50% 45% 45%;
    animation: saison-ampoule 2.4s ease-in-out infinite alternate;
}
.saison-ampoule::before { content: ""; position: absolute; left: 2px; top: -3px; width: 5px; height: 4px; border-radius: 1px; background: #3b4a42; }
.saison-ampoule.or    { background: #ffd35c; box-shadow: 0 0 10px 2px rgba(255, 211, 92, .75); }
.saison-ampoule.rouge { background: #ff4d5e; box-shadow: 0 0 10px 2px rgba(255, 77, 94, .7); }
.saison-ampoule.vert  { background: #5fe0a0; box-shadow: 0 0 10px 2px rgba(95, 224, 160, .65); }
.saison-ampoule.blanc { background: #e9f7ff; box-shadow: 0 0 10px 2px rgba(233, 247, 255, .75); }

.saison-flocon {
    position: absolute; top: -24px; width: 6px; height: 6px; border-radius: 50%;
    background: rgba(255, 255, 255, .85); box-shadow: 0 0 6px rgba(255, 255, 255, .6);
    animation: saison-chute 14s linear infinite; color: rgba(255, 255, 255, .9); font-size: 16px; line-height: 1;
}
.saison-flocon:not(:empty) { width: auto; height: auto; background: none; box-shadow: none; }
.saison-flocon.sf-0  { left: 3%;  animation-duration: 12s; }
.saison-flocon.sf-1  { left: 9%;  width: 4px; height: 4px; animation-duration: 16s; animation-delay: -5s; }
.saison-flocon.sf-2  { left: 15%; animation-duration: 13s; animation-delay: -9s; }
.saison-flocon.sf-3  { left: 22%; width: 3px; height: 3px; animation-duration: 18s; animation-delay: -2s; }
.saison-flocon.sf-4  { left: 28%; font-size: 13px; animation-duration: 15s; animation-delay: -11s; }
.saison-flocon.sf-5  { left: 35%; animation-duration: 11s; animation-delay: -7s; }
.saison-flocon.sf-6  { left: 42%; width: 4px; height: 4px; animation-duration: 17s; animation-delay: -13s; }
.saison-flocon.sf-7  { left: 48%; animation-duration: 14s; animation-delay: -3s; }
.saison-flocon.sf-8  { left: 55%; font-size: 18px; animation-duration: 16s; animation-delay: -8s; }
.saison-flocon.sf-9  { left: 61%; width: 5px; height: 5px; animation-duration: 12s; animation-delay: -12s; }
.saison-flocon.sf-10 { left: 67%; animation-duration: 19s; animation-delay: -6s; }
.saison-flocon.sf-11 { left: 73%; width: 3px; height: 3px; animation-duration: 13s; animation-delay: -1s; }
.saison-flocon.sf-12 { left: 79%; font-size: 12px; animation-duration: 15s; animation-delay: -10s; }
.saison-flocon.sf-13 { left: 85%; animation-duration: 11s; animation-delay: -4s; }
.saison-flocon.sf-14 { left: 91%; width: 4px; height: 4px; animation-duration: 17s; animation-delay: -14s; }
.saison-flocon.sf-15 { left: 97%; animation-duration: 14s; animation-delay: -9s; }
html.saison-noel .saison-vannes { color: #e6f4f7; }

/* Le cadeau caché : fenêtres et codes aux couleurs de Noël. */
html.saison-noel .saison-voile { background: rgba(3, 20, 28, .62); }
html.saison-noel .saison-carte { background: linear-gradient(180deg, #0f4a5c 0%, #07283a 100%); color: #fdf6e3; }
html.saison-noel .saison-carte-recompense { color: #f7d472; }
html.saison-noel .saison-code { background: rgba(242, 193, 78, .14); border-color: rgba(242, 193, 78, .75); color: #ffe6a3; }
html.saison-noel .saison-bouton { background: #f2c14e; color: #0c3242; }
html.saison-noel .saison-bouton-discret { background: rgba(255, 255, 255, .12); color: #fdf6e3; }
html.saison-noel .saison-espace { background: linear-gradient(135deg, #0f4a5c 0%, #07283a 100%); color: #fdf6e3; }
html.saison-noel .saison-code-petit { color: #ffe6a3; }

@keyframes saison-scintille { 0%, 100% { transform: scale(1) rotate(0deg); opacity: 1; } 50% { transform: scale(1.12) rotate(8deg); opacity: .85; } }
@keyframes saison-ampoule { from { opacity: 1; filter: brightness(1.15); } to { opacity: .45; filter: brightness(.8); } }
@keyframes saison-chute {
    0%   { transform: translate(0, 0); opacity: 0; }
    8%   { opacity: .9; }
    50%  { transform: translate(24px, 55vh); }
    92%  { opacity: .8; }
    100% { transform: translate(-10px, 112vh); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .saison-etoile, .saison-ampoule, .saison-flocon { animation: none !important; }
    .saison-flocon { display: none; }
}

/* ══════════════════════════════════════════════════════════════════════
   HALLOWEEN ET NOËL, DES SCÈNES COMPLÈTES (11/10/2026).
   Les deux thèmes n'étaient qu'un fond teinté et quelques motifs dans le
   haut de l'accueil. Ce bloc en fait deux tableaux (voir poserDecor dans
   saisons.js) et leur donne un rappel au bas de la page. Il VIENT APRÈS les
   règles d'origine et les complète : à poids égal, c'est lui qui l'emporte.
   ══════════════════════════════════════════════════════════════════════ */

/* ── HALLOWEEN : le couchant derrière Vannes ─────────────────────────── */
html.saison-halloween .hero {
    background:
        radial-gradient(ellipse 130% 44% at 50% 103%, rgba(255, 150, 50, .92) 0%, rgba(255, 117, 24, .46) 32%, rgba(255, 117, 24, 0) 72%),
        linear-gradient(180deg, #130a2a 0%, #27134e 36%, #47206a 68%, #6d2a5c 100%);
    /* La place de la ville : sans elle, la photo de l'accueil la recouvrait sur téléphone. */
    padding-bottom: clamp(150px, 21vw, 280px);
}
/* Le calque commun des sections (turquoise à 15 %) grisait la nuit : il prend ses couleurs. */
html.saison-halloween .hero.parallax-bg::before { background: radial-gradient(circle, #5b2a8a 0%, #130a2a 100%); }

.saison-ciel { position: absolute; inset: 0 0 34% 0; }
.saison-astre {
    position: absolute; width: 2px; height: 2px; border-radius: 50%; background: #fff5d6;
    box-shadow: 0 0 4px rgba(255, 245, 214, .9); animation: saison-clignote 4.6s ease-in-out infinite;
}
.saison-astre.grand { width: 3px; height: 3px; box-shadow: 0 0 7px rgba(255, 245, 214, 1); }

/* La lune : grande, avec son halo. Sur ordinateur au-dessus du texte (à droite elle passerait derrière la photo) ;
   sur téléphone en haut à droite, sous la barre. */
html.saison-halloween .saison-lune {
    top: 88px; left: 37%; width: clamp(96px, 10vw, 160px);
    filter: drop-shadow(0 0 30px rgba(255, 226, 150, .6)) drop-shadow(0 0 80px rgba(255, 190, 110, .35));
}
@media (max-width: 900px) { html.saison-halloween .saison-lune { left: auto; right: -26px; top: 74px; width: 128px; } }

.saison-nuage { position: absolute; left: -340px; color: rgba(132, 100, 184, .42); width: clamp(160px, 22vw, 320px); animation: saison-derive 80s linear infinite; }
.saison-nuage svg { width: 100%; display: block; }
.saison-nuage.sn-0 { top: 112px; animation-delay: -22s; }
.saison-nuage.sn-1 { top: 196px; width: clamp(120px, 16vw, 240px); animation-duration: 110s; animation-delay: -70s; opacity: .7; }

/* La sorcière traverse le ciel en une vingtaine de secondes, puis se fait attendre. */
.saison-sorciere { position: absolute; top: 150px; left: -150px; width: clamp(70px, 8vw, 116px); color: #07030f; animation: saison-sorciere 42s linear infinite; animation-delay: -3s; }
.saison-sorciere svg { width: 100%; display: block; }

/* Les toiles, retissées (voir SVG.toile) : plus grandes, en fils fins d'un pixel quelle que soit la taille. */
html.saison-halloween .saison-toile { color: rgba(243, 234, 215, .58); top: 71px; width: clamp(128px, 15vw, 210px); }
.saison-araignee { position: absolute; top: 0; right: 15%; width: 22px; color: rgba(243, 234, 215, .6); animation: saison-fil 7s ease-in-out infinite alternate; }
.saison-araignee svg { width: 100%; display: block; }
@media (max-width: 900px) { .saison-araignee { right: auto; left: 9%; width: 18px; } }

/* LES CHAUVES-SOURIS : trois mouvements superposés — la traversée (le bloc, à vitesse constante), l'ondulation
   (le dessin, de haut en bas) et le battement (chaque aile pivote à l'épaule). L'ancien battement écrasait tout le
   dessin : à cette taille, on ne voyait qu'un tiret qui clignotait. */
html.saison-halloween .saison-chauve-souris { color: #07030f; left: -90px; animation-name: saison-traverse; }
html.saison-halloween .saison-chauve-souris svg { overflow: visible; animation: saison-ondule 3.4s ease-in-out infinite alternate; transform-origin: 50% 50%; }
.saison-chauve-souris .aile { animation: saison-aile-g .24s ease-in-out infinite alternate; }
.saison-chauve-souris .aile-g { transform-origin: 47px 29px; }
.saison-chauve-souris .aile-d { transform-origin: 53px 29px; animation-name: saison-aile-d; }
.saison-chauve-souris.cs-0 { width: 66px; opacity: .95; }
.saison-chauve-souris.cs-1 { width: 48px; opacity: .9; }
.saison-chauve-souris.cs-2 { width: 40px; opacity: .7; }
.saison-chauve-souris.cs-3 { width: 56px; opacity: .92; }
.saison-chauve-souris.cs-4 { width: 36px; opacity: .6; }
.saison-chauve-souris.cs-5 { top: 9%; width: 44px; opacity: .85; animation-duration: 25s; animation-delay: -9s; }
.saison-chauve-souris.cs-6 { top: 62%; width: 38px; opacity: .6; animation-duration: 29s; animation-delay: -16s; }
html.saison-halloween .saison-chauve-souris.cs-1 svg, html.saison-halloween .saison-chauve-souris.cs-4 svg { animation-duration: 2.7s; animation-delay: -1.2s; }
html.saison-halloween .saison-chauve-souris.cs-2 svg, html.saison-halloween .saison-chauve-souris.cs-5 svg { animation-duration: 4.1s; animation-delay: -2.3s; }
.saison-chauve-souris.cs-1 .aile, .saison-chauve-souris.cs-5 .aile { animation-duration: .2s; }
.saison-chauve-souris.cs-3 .aile, .saison-chauve-souris.cs-6 .aile { animation-duration: .28s; }

.saison-brume {
    position: absolute; left: -20%; width: 140%; height: 96px; bottom: clamp(70px, 10vw, 150px);
    background: radial-gradient(ellipse at 50% 50%, rgba(214, 190, 255, .22) 0%, rgba(214, 190, 255, 0) 70%);
    filter: blur(6px); animation: saison-brume 26s ease-in-out infinite alternate;
}
.saison-brume.br-b {
    bottom: clamp(18px, 3vw, 54px); height: 70px; animation-duration: 33s; animation-direction: alternate-reverse;
    background: radial-gradient(ellipse at 50% 50%, rgba(255, 196, 140, .2) 0%, rgba(255, 196, 140, 0) 70%);
}

html.saison-halloween .saison-vannes { color: #0b0616; height: clamp(150px, 21vw, 290px); }
.sv-fenetres { animation: saison-bougie 3.4s ease-in-out infinite; }
.sv-lueur { animation: saison-bougie 2.3s ease-in-out infinite; }

/* Le rappel au bas de la page : des citrouilles posées avant le pied. */
html.saison-halloween #contact::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 34px; pointer-events: none; z-index: 1;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20240%2034%27%3E%3Cg%20transform%3D%27translate%2834%207.3%29%20scale%28.46%29%27%3E%3Cpath%20d%3D%27M31%2017c-1-5%201-8%205-9%27%20stroke%3D%27%233f6b2c%27%20stroke-width%3D%274%27%20fill%3D%27none%27%20stroke-linecap%3D%27round%27%2F%3E%3Cellipse%20cx%3D%2720%27%20cy%3D%2738%27%20rx%3D%2714%27%20ry%3D%2718%27%20fill%3D%27%23c94d06%27%2F%3E%3Cellipse%20cx%3D%2744%27%20cy%3D%2738%27%20rx%3D%2714%27%20ry%3D%2718%27%20fill%3D%27%23c94d06%27%2F%3E%3Cellipse%20cx%3D%2732%27%20cy%3D%2738%27%20rx%3D%2713.5%27%20ry%3D%2720%27%20fill%3D%27%23f06a10%27%2F%3E%3Cpath%20d%3D%27M21%2031l7%205.5h-9.5zM43%2031l-7%205.5h9.5zM20%2045q12%209%2024%200l-4.5%201-2.5-3-3%203.2-2-3.2-3%203.2-2.5-3.2z%27%20fill%3D%27%23ffe08a%27%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%27translate%28168%2014.3%29%20scale%28.34%29%27%3E%3Cpath%20d%3D%27M31%2017c-1-5%201-8%205-9%27%20stroke%3D%27%233f6b2c%27%20stroke-width%3D%274%27%20fill%3D%27none%27%20stroke-linecap%3D%27round%27%2F%3E%3Cellipse%20cx%3D%2720%27%20cy%3D%2738%27%20rx%3D%2714%27%20ry%3D%2718%27%20fill%3D%27%23c94d06%27%2F%3E%3Cellipse%20cx%3D%2744%27%20cy%3D%2738%27%20rx%3D%2714%27%20ry%3D%2718%27%20fill%3D%27%23c94d06%27%2F%3E%3Cellipse%20cx%3D%2732%27%20cy%3D%2738%27%20rx%3D%2713.5%27%20ry%3D%2720%27%20fill%3D%27%23f06a10%27%2F%3E%3Cpath%20d%3D%27M21%2031l7%205.5h-9.5zM43%2031l-7%205.5h9.5zM20%2045q12%209%2024%200l-4.5%201-2.5-3-3%203.2-2-3.2-3%203.2-2.5-3.2z%27%20fill%3D%27%23ffe08a%27%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%27translate%28104%2018.9%29%20scale%28.26%29%27%3E%3Cpath%20d%3D%27M31%2017c-1-5%201-8%205-9%27%20stroke%3D%27%233f6b2c%27%20stroke-width%3D%274%27%20fill%3D%27none%27%20stroke-linecap%3D%27round%27%2F%3E%3Cellipse%20cx%3D%2720%27%20cy%3D%2738%27%20rx%3D%2714%27%20ry%3D%2718%27%20fill%3D%27%23c94d06%27%2F%3E%3Cellipse%20cx%3D%2744%27%20cy%3D%2738%27%20rx%3D%2714%27%20ry%3D%2718%27%20fill%3D%27%23c94d06%27%2F%3E%3Cellipse%20cx%3D%2732%27%20cy%3D%2738%27%20rx%3D%2713.5%27%20ry%3D%2720%27%20fill%3D%27%23f06a10%27%2F%3E%3Cpath%20d%3D%27M21%2031l7%205.5h-9.5zM43%2031l-7%205.5h9.5zM20%2045q12%209%2024%200l-4.5%201-2.5-3-3%203.2-2-3.2-3%203.2-2.5-3.2z%27%20fill%3D%27%23ffe08a%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") repeat-x 50% 100% / 240px 34px;
}

@keyframes saison-traverse { from { transform: translateX(0); } to { transform: translateX(calc(100vw + 200px)); } }
@keyframes saison-ondule { from { transform: translateY(-26px) rotate(-7deg); } to { transform: translateY(26px) rotate(7deg); } }
/* L'aile gauche a sa pointe à gauche de l'épaule : tourner dans le sens des aiguilles la LÈVE. La droite, l'inverse. */
@keyframes saison-aile-g { from { transform: rotate(20deg); } to { transform: rotate(-26deg) scaleX(.8); } }
@keyframes saison-aile-d { from { transform: rotate(-20deg); } to { transform: rotate(26deg) scaleX(.8); } }
@keyframes saison-clignote { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
@keyframes saison-derive { from { transform: translateX(0); } to { transform: translateX(calc(100vw + 700px)); } }
@keyframes saison-sorciere {
    0%        { transform: translate(0, 36px) rotate(-5deg); }
    46%       { transform: translate(calc(100vw + 320px), -60px) rotate(-11deg); }
    100%      { transform: translate(calc(100vw + 320px), -60px) rotate(-11deg); }
}
@keyframes saison-fil { from { transform: translateY(-58px); } to { transform: translateY(-6px); } }
@keyframes saison-brume { from { transform: translateX(-6%); } to { transform: translateX(6%); } }
@keyframes saison-bougie { 0%, 100% { opacity: .96; } 38% { opacity: .62; } 66% { opacity: .88; } 80% { opacity: .7; } }

/* ── NOËL : la nuit de neige sur Vannes ──────────────────────────────── */
html.saison-noel .hero {
    background:
        radial-gradient(ellipse 120% 40% at 50% 104%, rgba(196, 238, 247, .5) 0%, rgba(196, 238, 247, 0) 70%),
        radial-gradient(ellipse at 82% 10%, rgba(255, 214, 140, .22) 0%, rgba(255, 214, 140, 0) 36%),
        linear-gradient(175deg, #0e4557 0%, #0a3344 46%, #062431 100%);
    /* La place de la ville ET de la forêt de sapins. */
    padding-bottom: clamp(178px, 22vw, 300px);
}
html.saison-noel .hero.parallax-bg::before { background: radial-gradient(circle, #1c6a80 0%, #05202c 100%); }
/* LE « R » DE LibeRté NE PASSE PLUS EN DORÉ (retour du salon, 11/10/2026) : il reste dans le turquoise de la marque,
   en clair pour se lire sur la nuit. L'étoile au bout du titre porte seule l'or. */
html.saison-noel .hero .logo-text .rte { color: #4dd0e1; text-shadow: none; }
.saison-sapins { position: absolute; left: 0; right: 0; bottom: 0; height: clamp(178px, 22vw, 300px); }
.saison-sapins svg { width: 100%; height: 100%; display: block; }

.saison-aurore {
    position: absolute; left: -10%; right: -10%; top: 60px; height: 44%;
    background:
        radial-gradient(ellipse at 28% 30%, rgba(120, 230, 200, .18) 0%, rgba(120, 230, 200, 0) 60%),
        radial-gradient(ellipse at 74% 22%, rgba(150, 190, 255, .16) 0%, rgba(150, 190, 255, 0) 55%);
    filter: blur(8px); animation: saison-aurore 16s ease-in-out infinite alternate;
}
.saison-lueur-or {
    position: absolute; aspect-ratio: 1; border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 214, 120, .32) 0%, rgba(255, 214, 120, 0) 68%);
    animation: saison-ampoule 5s ease-in-out infinite alternate;
}
/* La neige sur trois plans ; elle tombe sur toute la hauteur de l'accueil (--saison-chute, mesurée par le script). */
.saison-flocon-v2 { animation-name: saison-chute-v2; }
.saison-flocon-v2.loin   { width: 3px; height: 3px; opacity: .6; box-shadow: none; }
.saison-flocon-v2.milieu { width: 5px; height: 5px; }
.saison-flocon-v2.pres   { width: 9px; height: 9px; filter: blur(.5px); font-size: 20px; }
.saison-etoile-filante {
    position: absolute; top: 15%; left: 8%; width: 130px; height: 2px; border-radius: 2px; opacity: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff6d6); animation: saison-filante 21s ease-in infinite; animation-delay: 5s;
}
html.saison-noel .saison-vannes { height: clamp(150px, 21vw, 290px); bottom: clamp(10px, 1.6vw, 22px); }
.saison-congere { position: absolute; left: 0; right: 0; bottom: 0; height: clamp(34px, 5vw, 66px); }
.saison-congere svg { width: 100%; height: 100%; display: block; }
.sv-loupiote { animation: saison-ampoule 2.2s ease-in-out infinite alternate; }
.sv-loupiote:nth-child(odd) { animation-delay: -1.1s; }
.sv-loupiote:nth-child(3n) { animation-delay: -.5s; }

/* Le rappel au bas de la page : la neige posée sur le pied. */
html.saison-noel .lc-footer { position: relative; }
html.saison-noel .lc-footer::before {
    content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 24px; pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20180%2024%27%3E%3Cpath%20d%3D%27M0%200H180V8C172%2020%20158%2021%20150%209C141%2022%20122%2023%20113%208C105%2019%2088%2020%2080%208C70%2023%2052%2022%2044%209C36%2019%2018%2020%2010%208C7%2012%203%2012%200%208Z%27%20fill%3D%27%23ffffff%27%20opacity%3D%27.96%27%2F%3E%3C%2Fsvg%3E") repeat-x 50% 0 / 180px 24px;
}

@keyframes saison-aurore { from { transform: translateX(-3%) scaleY(1); opacity: .7; } to { transform: translateX(3%) scaleY(1.15); opacity: 1; } }
@keyframes saison-chute-v2 {
    0%   { transform: translate(0, 0); opacity: 0; }
    6%   { opacity: .9; }
    50%  { transform: translate(26px, calc(var(--saison-chute, 110vh) * .5)); }
    94%  { opacity: .85; }
    100% { transform: translate(-12px, var(--saison-chute, 110vh)); opacity: 0; }
}
@keyframes saison-filante {
    0%, 91% { opacity: 0; transform: translate(0, 0) rotate(17deg); }
    93%     { opacity: 1; }
    100%    { opacity: 0; transform: translate(44vw, 14vw) rotate(17deg); }
}

/* ── LE SON D'AMBIANCE : le bouton de la visiteuse, en bas à gauche ──── */
.saison-son {
    position: fixed; left: 16px; bottom: 16px; z-index: 998; height: 46px; padding: 0 16px 0 12px; border: 0; border-radius: 999px; cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 8px; font: 600 14px/1 inherit; white-space: nowrap;
    background: var(--saison-nuit, #1a0f2e); color: var(--saison-os, #f3ead7); box-shadow: 0 8px 22px rgba(0, 0, 0, .3);
}
.saison-son svg { flex: 0 0 24px; width: 24px; height: 24px; display: block; }
.saison-son.muet { opacity: .78; }
.saison-son.attend { animation: saison-appel 2.2s ease-in-out infinite; }
.saison-son:focus-visible { outline: 3px solid var(--saison-citrouille, #ff7518); outline-offset: 3px; }
@keyframes saison-appel { 0%, 100% { box-shadow: 0 8px 22px rgba(0, 0, 0, .3), 0 0 0 0 rgba(255, 255, 255, .45); } 50% { box-shadow: 0 8px 22px rgba(0, 0, 0, .3), 0 0 0 10px rgba(255, 255, 255, 0); } }

/* ── moins de mouvement : les scènes restent, plus rien ne bouge ─────── */
@media (prefers-reduced-motion: reduce) {
    .saison-chauve-souris .aile, .saison-astre, .saison-nuage, .saison-sorciere, .saison-araignee, .saison-brume, .sv-fenetres, .sv-lueur,
    .saison-aurore, .saison-lueur-or, .saison-flocon-v2, .saison-etoile-filante, .sv-loupiote { animation: none !important; }
    .saison-sorciere, .saison-flocon-v2, .saison-etoile-filante { display: none; }
    .saison-son.attend { animation: none !important; }
    .saison-nuage { left: 12%; }
    .saison-nuage.sn-1 { left: 58%; }
}