/* Polices auto-hébergées (aucune requête vers un tiers, CSP « self » seul). */
@font-face{font-family:"Nunito Sans";src:url("fonts/nunito-sans.woff2") format("woff2");font-weight:200 1000;font-style:normal;font-display:swap}
@font-face{font-family:"Bricolage Grotesque";src:url("fonts/bricolage-grotesque.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("fonts/fraunces.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Baloo 2";src:url("fonts/baloo-2.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/ibm-plex-mono-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/ibm-plex-mono-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --body:"Nunito Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --display:"Bricolage Grotesque","Nunito Sans",sans-serif;
  --emoji:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
  --r-md:14px; --r-lg:26px;

  /* HIVER (défaut) */
  --l-bg:#f3f7fb; --l-surface:#ffffff; --l-ink:#14213a; --l-muted:#5e6c82; --l-line:#d6e0ec;
  --l-accent:#1e5fb0; --l-accent-ink:#ffffff; --l-accent-soft:#dde9f8; --l-second:#7fb6e8;
  --l-hero-a:#173f78; --l-hero-b:#2f78c4; --l-hero-ink:#ffffff;
  --d-bg:#0d1526; --d-surface:#141f33; --d-ink:#e6edf7; --d-muted:#95a5bd; --d-line:#243550;
  --d-accent:#7fb3ff; --d-accent-ink:#0b1a33; --d-accent-soft:#1b2d4d; --d-second:#3c6fb0;
  --d-hero-a:#0f2a52; --d-hero-b:#1d4d8a; --d-hero-ink:#eef4ff;
  --hero-deco:
    radial-gradient(circle at 12% 18%, color-mix(in srgb,#fff 85%,transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 28% 62%, color-mix(in srgb,#fff 70%,transparent) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 44% 28%, color-mix(in srgb,#fff 80%,transparent) 0 2.5px, transparent 3.5px),
    radial-gradient(circle at 61% 72%, color-mix(in srgb,#fff 65%,transparent) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 73% 14%, color-mix(in srgb,#fff 85%,transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 88% 48%, color-mix(in srgb,#fff 75%,transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 52% 90%, color-mix(in srgb,#fff 60%,transparent) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 93% 85%, color-mix(in srgb,#fff 70%,transparent) 0 2px, transparent 3px);

  --bg:var(--l-bg); --surface:var(--l-surface); --ink:var(--l-ink); --muted:var(--l-muted); --line:var(--l-line);
  --accent:var(--l-accent); --accent-ink:var(--l-accent-ink); --accent-soft:var(--l-accent-soft); --second:var(--l-second);
  --hero-a:var(--l-hero-a); --hero-b:var(--l-hero-b); --hero-ink:var(--l-hero-ink);
}
:root[data-ambiance="noel"]{
  --display:"Fraunces","Nunito Sans",serif;
  --l-bg:#fbf5ec; --l-surface:#fffdf8; --l-ink:#2a1a14; --l-muted:#7a6457; --l-line:#eadcc9;
  --l-accent:#b3122b; --l-accent-ink:#ffffff; --l-accent-soft:#f8e0dd; --l-second:#1f6b4a;
  --l-hero-a:#7a0c1f; --l-hero-b:#1f5a3f; --l-hero-ink:#fff8ec;
  --d-bg:#17100f; --d-surface:#221816; --d-ink:#f3e9dc; --d-muted:#b19c8c; --d-line:#3a2a26;
  --d-accent:#ff6b7d; --d-accent-ink:#2a0a10; --d-accent-soft:#42202a; --d-second:#5ec28f;
  --d-hero-a:#3d0912; --d-hero-b:#0f3a28; --d-hero-ink:#fff3e0;
  --hero-deco:
    radial-gradient(circle, #e3c05a 0 4px, transparent 5px) 0 10px / 48px 40px repeat-x,
    radial-gradient(circle, #ff8a9a 0 4px, transparent 5px) 24px 22px / 48px 40px repeat-x,
    radial-gradient(circle, #9fe0b9 0 3px, transparent 4px) 12px 30px / 48px 40px repeat-x;
}
:root[data-ambiance="carnaval"]{
  --display:"Baloo 2","Nunito Sans",sans-serif;
  --l-bg:#fff9f0; --l-surface:#ffffff; --l-ink:#2a1540; --l-muted:#6f5a86; --l-line:#eedfd2;
  --l-accent:#7b3fe4; --l-accent-ink:#ffffff; --l-accent-soft:#eee3ff; --l-second:#ffb703;
  --l-hero-a:#5a2bd0; --l-hero-b:#ff6f3c; --l-hero-ink:#ffffff;
  --d-bg:#15112a; --d-surface:#1f1838; --d-ink:#f1eaff; --d-muted:#a99bc4; --d-line:#33294f;
  --d-accent:#c59bff; --d-accent-ink:#1b0f33; --d-accent-soft:#2f2152; --d-second:#ffc63a;
  --d-hero-a:#2b1a66; --d-hero-b:#8a2a4a; --d-hero-ink:#fff4ea;
  --hero-deco:
    radial-gradient(circle at 8% 22%, #ffd60a 0 5px, transparent 6px),
    radial-gradient(circle at 19% 78%, #06d6a0 0 4px, transparent 5px),
    radial-gradient(circle at 33% 12%, #ff4d8d 0 4px, transparent 5px),
    radial-gradient(circle at 47% 66%, #ffd60a 0 3px, transparent 4px),
    radial-gradient(circle at 58% 20%, #4cc9f0 0 5px, transparent 6px),
    radial-gradient(circle at 69% 84%, #ff4d8d 0 4px, transparent 5px),
    radial-gradient(circle at 81% 36%, #06d6a0 0 5px, transparent 6px),
    radial-gradient(circle at 92% 70%, #ffd60a 0 4px, transparent 5px),
    radial-gradient(circle at 40% 92%, #4cc9f0 0 3px, transparent 4px),
    radial-gradient(circle at 96% 10%, #ff4d8d 0 3px, transparent 4px);
}
:root[data-ambiance="printemps"]{
  --display:"Baloo 2","Nunito Sans",sans-serif;
  --l-bg:#f6faf2;
  --l-surface:#ffffff;
  --l-ink:#1b2a1c;
  --l-muted:#566a55;
  --l-line:#d8e6d0;
  --l-accent:#2b7a30;
  --l-accent-ink:#ffffff;
  --l-accent-soft:#e1f1da;
  --l-second:#f2b705;
  --l-hero-a:#1d5e27;
  --l-hero-b:#388030;
  --l-hero-ink:#ffffff;
  --d-bg:#0f1a10;
  --d-surface:#172416;
  --d-ink:#e8f3e4;
  --d-muted:#9db79a;
  --d-line:#26391f;
  --d-accent:#8fd36f;
  --d-accent-ink:#0c1c0b;
  --d-accent-soft:#1f3a1c;
  --d-second:#f2c94c;
  --d-hero-a:#10381a;
  --d-hero-b:#2a6a28;
  --d-hero-ink:#f1fbea;
  --hero-deco:radial-gradient(circle at 9% 24%, #ffc6d5 0 5px, transparent 6px),
    radial-gradient(circle at 21% 70%, #ffffff 0 3px, transparent 4px),
    radial-gradient(circle at 36% 14%, #ffe27a 0 4px, transparent 5px),
    radial-gradient(circle at 52% 76%, #ffc6d5 0 4px, transparent 5px),
    radial-gradient(circle at 67% 20%, #ffffff 0 3px, transparent 4px),
    radial-gradient(circle at 80% 58%, #ffe27a 0 4px, transparent 5px),
    radial-gradient(circle at 93% 28%, #ffc6d5 0 5px, transparent 6px),
    radial-gradient(circle at 46% 92%, #ffffff 0 3px, transparent 4px);
}
:root[data-ambiance="automne"]{
  --display:"Fraunces","Nunito Sans",serif;
  --l-bg:#fbf4ea;
  --l-surface:#fffdf8;
  --l-ink:#2b1c11;
  --l-muted:#755f4b;
  --l-line:#ecdcc6;
  --l-accent:#9f470a;
  --l-accent-ink:#ffffff;
  --l-accent-soft:#fbe3cc;
  --l-second:#6d7a2a;
  --l-hero-a:#6e2c0a;
  --l-hero-b:#a8470b;
  --l-hero-ink:#fff8ee;
  --d-bg:#16100b;
  --d-surface:#211812;
  --d-ink:#f4e8da;
  --d-muted:#b79d86;
  --d-line:#3a2a1d;
  --d-accent:#ffa65c;
  --d-accent-ink:#2a1305;
  --d-accent-soft:#42270f;
  --d-second:#b5c75a;
  --d-hero-a:#3b1706;
  --d-hero-b:#7a3a0c;
  --d-hero-ink:#fff3e3;
  --hero-deco:radial-gradient(circle at 10% 20%, #f2a21c 0 6px, transparent 7px),
    radial-gradient(circle at 24% 74%, #e8731a 0 5px, transparent 6px),
    radial-gradient(circle at 39% 16%, #ffd9a0 0 4px, transparent 5px),
    radial-gradient(circle at 55% 80%, #c8451a 0 5px, transparent 6px),
    radial-gradient(circle at 71% 22%, #f2a21c 0 5px, transparent 6px),
    radial-gradient(circle at 84% 62%, #ffd9a0 0 4px, transparent 5px),
    radial-gradient(circle at 95% 18%, #e8731a 0 5px, transparent 6px);
}
:root[data-ambiance="ete"]{
  --display:"Bricolage Grotesque","Nunito Sans",sans-serif;
  --l-bg:#f1f8f8;
  --l-surface:#ffffff;
  --l-ink:#102a2e;
  --l-muted:#4d6a6e;
  --l-line:#d0e4e4;
  --l-accent:#00727a;
  --l-accent-ink:#ffffff;
  --l-accent-soft:#d8f0ee;
  --l-second:#ffc23d;
  --l-hero-a:#07555f;
  --l-hero-b:#0a7685;
  --l-hero-ink:#ffffff;
  --d-bg:#0b1618;
  --d-surface:#122326;
  --d-ink:#e3f3f2;
  --d-muted:#93b5b6;
  --d-line:#1f3a3d;
  --d-accent:#5fd6d0;
  --d-accent-ink:#06221f;
  --d-accent-soft:#17403f;
  --d-second:#ffd166;
  --d-hero-a:#063c42;
  --d-hero-b:#0a5c68;
  --d-hero-ink:#effcfb;
  --hero-deco:radial-gradient(circle at 88% 16%, color-mix(in srgb,#ffd166 20%,transparent) 0 110px, transparent 111px),
    radial-gradient(circle at 6% 88%, color-mix(in srgb,#ffffff 14%,transparent) 0 90px, transparent 91px),
    radial-gradient(circle at 30% 20%, #ffffff 0 3px, transparent 4px),
    radial-gradient(circle at 62% 70%, #ffd166 0 4px, transparent 5px),
    radial-gradient(circle at 76% 34%, #ffffff 0 3px, transparent 4px);
}
:root[data-ambiance="neutre"]{
  --display:"Bricolage Grotesque","Nunito Sans",sans-serif;
  --l-bg:#f7f5f7; --l-surface:#ffffff; --l-ink:#1b222c; --l-muted:#6c7680; --l-line:#e2dde2;
  --l-accent:#e00e7c; --l-accent-ink:#ffffff; --l-accent-soft:#fbe3f0; --l-second:#a80960;
  --l-hero-a:#a80960; --l-hero-b:#e71d73; --l-hero-ink:#ffffff;
  --d-bg:#13141a; --d-surface:#1b1d25; --d-ink:#eceaf0; --d-muted:#9a97a6; --d-line:#2d2f3a;
  --d-accent:#f0499b; --d-accent-ink:#1a0712; --d-accent-soft:#3a1a2c; --d-second:#ff8fc7;
  --d-hero-a:#4a0a30; --d-hero-b:#8a1050; --d-hero-ink:#fff0f7;
  --hero-deco:radial-gradient(circle at 85% 20%, color-mix(in srgb,#fff 18%,transparent) 0 120px, transparent 121px),
              radial-gradient(circle at 10% 90%, color-mix(in srgb,#fff 12%,transparent) 0 90px, transparent 91px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:var(--d-bg); --surface:var(--d-surface); --ink:var(--d-ink); --muted:var(--d-muted); --line:var(--d-line);
    --accent:var(--d-accent); --accent-ink:var(--d-accent-ink); --accent-soft:var(--d-accent-soft); --second:var(--d-second);
    --hero-a:var(--d-hero-a); --hero-b:var(--d-hero-b); --hero-ink:var(--d-hero-ink);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:var(--d-bg); --surface:var(--d-surface); --ink:var(--d-ink); --muted:var(--d-muted); --line:var(--d-line);
  --accent:var(--d-accent); --accent-ink:var(--d-accent-ink); --accent-soft:var(--d-accent-soft); --second:var(--d-second);
  --hero-a:var(--d-hero-a); --hero-b:var(--d-hero-b); --hero-ink:var(--d-hero-ink);
  color-scheme:dark;
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);line-height:1.55;font-size:16px;transition:background .35s}
@keyframes floaty{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-7px) rotate(2deg)}}
@keyframes snowfall{0%{transform:translateY(-18px);opacity:0}15%{opacity:.9}100%{transform:translateY(40px);opacity:0}}
@keyframes sway{from{transform:rotate(-1.4deg)}to{transform:rotate(1.4deg)}}
@keyframes twinkle{from{opacity:.45}to{opacity:1}}
@keyframes drift{from{transform:translateX(-22px)}to{transform:translateX(22px)}}
@keyframes balloon{from{transform:rotate(-2.5deg) translateY(0)}to{transform:rotate(2.5deg) translateY(-9px)}}
@keyframes slide{from{transform:translateX(-340px)}to{transform:translateX(920px)}}
@keyframes walk{from{transform:translateX(-160px)}to{transform:translateX(1360px)}}
@keyframes bob{from{transform:translateY(0)}to{transform:translateY(-2.5px)}}
@keyframes confettifall{0%{transform:translateY(-30px) rotate(0deg);opacity:0}10%{opacity:1}100%{transform:translateY(130px) rotate(400deg);opacity:0}}
@keyframes flutter{from{transform:skewX(-2.5deg)}to{transform:skewX(2.5deg)}}
@keyframes beefly{0%{transform:translate(0,0)}25%{transform:translate(46px,-14px)}50%{transform:translate(92px,2px)}75%{transform:translate(46px,12px)}100%{transform:translate(0,0)}}
@keyframes wings{from{transform:scaleY(1)}to{transform:scaleY(.4)}}
@keyframes rays{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion: reduce){ *{transition:none !important;animation:none !important} }
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
h1,h2,h3{text-wrap:balance;margin:0}
h2{font-family:var(--display);font-size:clamp(1.55rem,3.2vw,2.2rem);line-height:1.1}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:8px}
.em{font-family:var(--emoji);font-style:normal;line-height:1}
.eyebrow .em{font-size:1.1rem}

/* ---- En-tête ---- */
.site-head{display:flex;align-items:center;gap:14px;padding-block:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{height:52px;width:auto}
.brand b{font-family:var(--display);font-size:1.15rem;line-height:1.1;display:block}
.brand small{display:block;font-family:var(--mono);font-size:.66rem;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;margin-top:2px}
nav.main{margin-left:auto;display:flex;gap:2px;flex-wrap:wrap}
nav.main a{padding:.45rem .75rem;border-radius:999px;text-decoration:none;font-weight:600;font-size:.9rem;display:inline-flex;align-items:center;gap:6px}
nav.main a:hover{background:var(--accent-soft)}
nav.main a.cta{background:var(--accent);color:var(--accent-ink)}

/* ---- Hero : prochain évènement ---- */
.hero{position:relative;overflow:hidden;border-radius:var(--r-lg);background:linear-gradient(135deg,var(--hero-a),var(--hero-b));color:var(--hero-ink);padding:clamp(26px,5vw,56px);padding-bottom:clamp(150px,20vw,210px);display:grid;grid-template-columns:1.25fr .9fr;gap:32px;isolation:isolate;box-shadow:0 30px 60px -40px var(--hero-a)}
.hero::before{content:"";position:absolute;inset:0;background:var(--hero-deco);pointer-events:none;z-index:0;opacity:.95}
.hero > *{position:relative;z-index:1}
.floaters{position:absolute;inset:0;pointer-events:none;z-index:0}
.floaters span{position:absolute;font-family:var(--emoji);font-size:clamp(1.6rem,4vw,3.2rem);opacity:.85;animation:floaty 7s ease-in-out infinite alternate;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}
.floaters span:nth-child(2){animation-duration:6.5s;animation-delay:-2s}
.floaters span:nth-child(3){animation-duration:7s;animation-delay:-1s}
.floaters span:nth-child(4){animation-duration:5.5s;animation-delay:-3s}
.floaters span:nth-child(5){animation-duration:8s;animation-delay:-4s}
.floaters span:nth-child(6){animation-duration:6s;animation-delay:-2.5s}
.scene{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:clamp(150px,20vw,230px);display:none;z-index:0;opacity:.9}
/* Mouvements legers, seulement sur ce qui bouge dans la vraie vie : les
   montagnes, l'ecole, le chapiteau, les sapins de Noel decores ne bougent pas. */
.scene .sway{transform-box:fill-box;transform-origin:50% 100%;animation:sway 6s ease-in-out infinite alternate}
.scene .sway2{transform-box:fill-box;transform-origin:50% 100%;animation:sway 7.5s ease-in-out -3s infinite alternate}
.scene .snow circle{animation:snowfall 9s linear infinite}
.scene .snow circle:nth-child(2){animation-delay:-3s;animation-duration:11s}.scene .snow circle:nth-child(3){animation-delay:-6s}.scene .snow circle:nth-child(4){animation-delay:-1.5s;animation-duration:10s}.scene .snow circle:nth-child(5){animation-delay:-7s;animation-duration:12s}.scene .snow circle:nth-child(6){animation-delay:-4.5s}.scene .snow circle:nth-child(7){animation-delay:-2s;animation-duration:13s}.scene .snow circle:nth-child(8){animation-delay:-8s}.scene .snow circle:nth-child(9){animation-delay:-5.5s;animation-duration:10.5s}.scene .snow circle:nth-child(10){animation-delay:-0.5s;animation-duration:12.5s}.scene .snow circle:nth-child(11){animation-delay:-9.5s}.scene .snow circle:nth-child(12){animation-delay:-4s;animation-duration:11.5s}
.scene .slide{animation:slide 38s linear infinite}
.scene .walk{animation:walk 48s linear infinite}.scene .walk .bob{animation:bob .55s ease-in-out infinite alternate}
.scene .confetti rect{animation:confettifall 8s linear infinite}.scene .confetti rect:nth-child(2){animation-delay:-2s;animation-duration:10s}.scene .confetti rect:nth-child(3){animation-delay:-4s}.scene .confetti rect:nth-child(4){animation-delay:-1s;animation-duration:9s}.scene .confetti rect:nth-child(5){animation-delay:-6s;animation-duration:11s}.scene .confetti rect:nth-child(6){animation-delay:-3s}.scene .confetti rect:nth-child(7){animation-delay:-5s;animation-duration:9.5s}.scene .confetti rect:nth-child(8){animation-delay:-7s}.scene .confetti rect:nth-child(9){animation-delay:-2.5s;animation-duration:10.5s}.scene .confetti rect:nth-child(10){animation-delay:-8s}
.scene .flags{transform-box:fill-box;transform-origin:50% 0;animation:flutter 3.2s ease-in-out infinite alternate}
.scene .bee{animation:beefly 11s ease-in-out infinite}.scene .bee .wing{transform-box:fill-box;transform-origin:50% 100%;animation:wings .18s linear infinite alternate}
.scene .rays{transform-box:fill-box;transform-origin:50% 50%;animation:rays 90s linear infinite}
.scene .twinkle polygon{animation:twinkle 2.6s ease-in-out infinite alternate}.scene .twinkle polygon:nth-child(2){animation-delay:-1s}.scene .twinkle polygon:nth-child(3){animation-delay:-1.8s}
.scene .drift{animation:drift 14s ease-in-out infinite alternate}.scene .drift2{animation:drift 18s ease-in-out -6s infinite alternate}
.scene .balloon{transform-box:fill-box;transform-origin:50% 100%;animation:balloon 5s ease-in-out infinite alternate}.scene .balloon2{transform-box:fill-box;transform-origin:50% 100%;animation:balloon 6.5s ease-in-out -2.5s infinite alternate}
:root[data-ambiance="hiver"] .s-hiver,:root[data-ambiance="noel"] .s-noel,:root[data-ambiance="carnaval"] .s-carnaval,:root[data-ambiance="printemps"] .s-printemps,:root[data-ambiance="ete"] .s-ete,:root[data-ambiance="automne"] .s-automne,:root[data-ambiance="neutre"] .s-neutre{display:block}
.hero .eyebrow{color:inherit;opacity:.9}
.hero-top{display:flex;align-items:flex-start;gap:18px}
.hero-emoji{font-family:var(--emoji);font-size:clamp(3.4rem,8vw,6rem);line-height:1;flex:none;animation:pop .5s cubic-bezier(.2,1.4,.4,1);filter:drop-shadow(0 10px 18px rgba(0,0,0,.3))}
.hero h1{font-family:var(--display);font-size:clamp(2.2rem,5.6vw,4.2rem);line-height:.98;margin:.45rem 0 .7rem;letter-spacing:-.01em}
.hero .when{font-size:1.12rem;font-weight:700;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.hero .pitch{max-width:56ch;font-size:1.05rem;margin:14px 0 20px;opacity:.95}
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:.18rem .65rem;font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.03em;background:color-mix(in srgb,var(--hero-ink) 16%,transparent);border:1px solid color-mix(in srgb,var(--hero-ink) 40%,transparent)}
.badge .em{font-size:.95rem}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;padding:.62rem 1.05rem;border-radius:999px;font-weight:700;text-decoration:none;font-size:.92rem;border:2px solid transparent;cursor:pointer;font-family:inherit;line-height:1.2}
.btn .em{font-size:1.05rem}
.btn.light{background:var(--hero-ink);color:var(--hero-a)}
.btn.ghost{border-color:currentColor;background:transparent;color:inherit}
.btn.primary{background:var(--accent);color:var(--accent-ink)}
.hero-card{background:var(--surface);color:var(--ink);border-radius:var(--r-md);padding:20px;box-shadow:0 18px 44px -22px rgba(0,0,0,.45);align-self:start;display:grid;gap:14px;z-index:2}
.hero-card h3{font-family:var(--display);font-size:1.05rem;display:flex;align-items:center;gap:8px}
.slots{display:grid;gap:4px;margin:0;padding:0;list-style:none;font-size:.9rem}
.slots li{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:baseline}
.slots .d{font-family:var(--mono);font-size:.78rem;color:var(--muted);white-space:nowrap}
.slots b{font-weight:700}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;font-size:.92rem;margin:0}
.kv dt{font-family:var(--emoji);font-size:1.15rem;line-height:1.3;text-align:center;min-width:1.6rem}
.kv dd{margin:0}
.kv dd small{display:block;font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.docs{display:flex;gap:8px;flex-wrap:wrap}
.doc{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;padding:.35rem .7rem;border-radius:8px;border:1px solid var(--line);text-decoration:none;background:var(--bg)}
.doc .ext{font-family:var(--mono);font-size:.62rem;color:var(--muted);text-transform:uppercase}
.help{border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:0 8px 8px 0;padding:10px 12px;font-size:.9rem;display:flex;gap:10px;align-items:flex-start}
.help .em{font-size:1.5rem;flex:none}
.help b{display:block;font-family:var(--display)}
.help .btn{margin-top:8px}
@media (max-width:800px){.hero{grid-template-columns:1fr;padding-bottom:150px}.scene{opacity:.8}}

/* ---- Frise ---- */
section{margin-block:56px}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.sec-head p{margin:.3rem 0 0;color:var(--muted);max-width:60ch}
.frise ol{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:12px;position:relative}
.frise ol:last-child{margin-bottom:0}
.frise ol::before{content:"";position:absolute;left:0;right:0;top:22px;height:3px;border-radius:2px;background:var(--line)}
.frise li{position:relative;padding-top:60px;min-width:0}
.frise .bub{position:absolute;top:0;left:0;width:46px;height:46px;border-radius:50%;background:var(--surface);border:3px solid var(--line);display:grid;place-items:center;font-family:var(--emoji);font-size:1.4rem;line-height:1;box-shadow:0 6px 14px -8px rgba(0,0,0,.4)}
.frise .bub.initial{font-family:var(--display);font-size:1.1rem;color:#fff}
.frise li.past .bub{filter:grayscale(.6);opacity:.75}
.frise li.next .bub{border-color:var(--accent);box-shadow:0 0 0 6px var(--accent-soft),0 8px 20px -8px var(--accent);transform:scale(1.18);transform-origin:center}
.frise li.draft .bub{border-style:dashed;opacity:.6}
.frise .month{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
.frise .card{display:block;margin-top:6px;padding:12px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);text-decoration:none;min-height:150px}
.frise li.next .card{border-color:var(--accent);box-shadow:0 12px 26px -16px var(--accent);background:linear-gradient(180deg,var(--accent-soft),var(--surface) 60%)}
.frise li.past .card{opacity:.74}
.frise li.draft .card{border-style:dashed;background:transparent;color:var(--muted)}
.frise .card b{font-family:var(--display);font-size:1rem;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:6px}
.frise .card .d{display:block;font-family:var(--mono);font-size:.72rem;color:var(--muted);margin-top:4px}
.frise .card .s{margin-top:8px;font-size:.8rem}
.state{display:inline-block;font-family:var(--mono);font-size:.62rem;padding:.12rem .45rem;border-radius:4px;text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.state.past{background:var(--line);color:var(--ink)}
.state.next{background:var(--accent);color:var(--accent-ink)}
.state.soon{background:var(--accent-soft);color:var(--ink)}
.state.draft{border:1px dashed var(--line);color:var(--muted)}
.aud{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;color:var(--muted);margin-top:6px}
.year-sep{display:flex;align-items:center;gap:12px;margin:8px 0 22px;font-family:var(--mono);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:600}
.year-sep::before,.year-sep::after{content:"";flex:1;height:1px;background:var(--line)}
.frise-empty{border:1.5px dashed var(--line);border-radius:var(--r-lg);padding:28px;text-align:center;color:var(--muted);display:grid;gap:10px;justify-items:center}
.frise-empty .em{font-size:2.4rem}
@media (max-width:900px){
  .frise ol{grid-template-columns:1fr !important;padding-left:62px;gap:14px}
  .frise ol::before{left:21px;right:auto;top:0;bottom:0;width:3px;height:auto}
  .frise li{padding-top:0}
  .frise .bub{left:-62px;top:10px}
  .frise .card{min-height:0}
}

/* ---- Rétro ---- */
.retro{display:grid;grid-template-columns:1fr 1.1fr;gap:28px;align-items:start}
.retro .txt p{margin:.5rem 0 0}
.retro .num{font-family:var(--display);font-size:2.1rem;line-height:1;color:var(--accent)}
.retro .nums{display:flex;gap:16px;margin-top:16px;flex-wrap:wrap}
.retro .nums > div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 16px;display:flex;gap:12px;align-items:center}
.retro .nums .em{font-size:1.8rem}
.retro .nums small{display:block;color:var(--muted);font-size:.8rem}
.photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:800px){.retro{grid-template-columns:1fr}}

/* ---- Le Sou en bref ---- */
.tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tri article{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;display:grid;gap:10px;align-content:start;position:relative;overflow:hidden}
.tri article::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:var(--accent-soft);z-index:0}
.tri article > *{position:relative;z-index:1}
.tri .ico{font-family:var(--emoji);font-size:2.4rem;line-height:1}
.tri h3{font-family:var(--display);font-size:1.15rem}
.tri p{margin:0;font-size:.95rem}
.tri .big{font-family:var(--display);font-size:1.9rem;color:var(--accent);line-height:1}
.tri a.more{font-weight:700;text-decoration:none;color:var(--accent)}
@media (max-width:800px){.tri{grid-template-columns:1fr}}

/* ---- Partenaires ---- */

/* ---- Newsletter + pied ---- */
.news{background:linear-gradient(135deg,var(--accent-soft),var(--surface));border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(20px,4vw,36px);display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center;position:relative;overflow:hidden}
.news .bigem{font-family:var(--emoji);font-size:3rem;line-height:1;margin-bottom:6px}
.news form{display:flex;gap:8px;flex-wrap:wrap}
.news input{flex:1 1 220px;min-width:0;padding:.65rem .9rem;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit}
.news small{color:var(--muted);display:block;margin-top:8px;font-size:.78rem;flex-basis:100%}
@media (max-width:800px){.news{grid-template-columns:1fr}}
footer{border-top:1px solid var(--line);margin-top:48px;padding-block:28px 40px;color:var(--muted);font-size:.86rem}
footer .cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
footer b{color:var(--ink);display:block;margin-bottom:6px}
footer a{text-decoration:none}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mail{font-family:var(--mono);user-select:all;color:var(--ink)}
@media (max-width:800px){footer .cols{grid-template-columns:1fr}}
/* Téléphone : la barre de maquette ne reste pas collée en haut (elle mangerait
   l'écran) ; la navigation du site tient sur une ligne qui défile. */
@media (max-width:700px){
  nav.main{margin-left:0;flex-basis:100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  nav.main::-webkit-scrollbar{display:none}
  nav.main a{flex:none}
}


/* ---- Fiche évènement : page dédiée, mobile d'abord ---- */
.crumbs{display:flex;gap:6px;flex-wrap:wrap;font-size:.82rem;color:var(--muted);margin:4px 0 14px}
.crumbs a{text-decoration:none}
.crumbs span{opacity:.6}
.hero.fiche{grid-template-columns:1fr;padding-bottom:clamp(140px,18vw,190px)}
.hero.fiche .hero-top{align-items:center}
.hero.fiche h1{font-size:clamp(2rem,6vw,3.6rem)}
.fiche-grid{display:grid;gap:22px;margin-top:22px}
.fiche-main{min-width:0}
.aside{display:grid;gap:14px;align-content:start}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:18px;display:grid;gap:12px}
.card h3{font-family:var(--display);font-size:1.05rem;display:flex;align-items:center;gap:8px}
.card .lieu{display:grid;gap:4px}
.card .lieu a{font-weight:700;color:var(--accent);text-decoration:none}
.card.muted-state{opacity:.85}
.prose{font-size:1.02rem;line-height:1.65;max-width:68ch}
.prose h2{font-family:var(--display);font-size:1.5rem;margin:26px 0 8px}
.prose h2:first-child{margin-top:0}
.prose p{margin:0 0 14px}
.prose ul{margin:0 0 14px;padding-left:1.2rem}
.prose li{margin:4px 0}
.share{border:1px dashed var(--line);border-radius:var(--r-md);padding:16px;display:grid;gap:12px;margin-top:28px}
.share .row{display:flex;gap:8px;flex-wrap:wrap}
.share .btn{font-size:.85rem;padding:.5rem .9rem}
.neigh{display:grid;gap:12px;margin-top:28px}
.neigh a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;text-decoration:none;background:var(--surface)}
.neigh .em{font-size:1.6rem}
.neigh small{display:block;font-family:var(--mono);font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.neigh b{font-family:var(--display)}
.retro-box{border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(180deg,var(--accent-soft),var(--surface) 70%);padding:clamp(18px,3vw,28px);display:grid;gap:14px;margin-bottom:26px}
.retro-box h2{font-family:var(--display);font-size:clamp(1.4rem,3vw,2rem);margin:0}
.retro-box .nums{display:flex;gap:12px;flex-wrap:wrap}
.retro-box .nums > div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;display:flex;gap:10px;align-items:center}
.retro-box .num{font-family:var(--display);font-size:1.8rem;line-height:1;color:var(--accent)}
.retro-box .nums small{display:block;color:var(--muted);font-size:.78rem}
.retro-box .nums .em{font-size:1.6rem}
.retro-box .was{border-top:1px solid var(--line);margin-top:26px;padding-top:18px}
.was summary{cursor:pointer;font-weight:700;font-family:var(--display);list-style:none;display:flex;align-items:center;gap:8px}
.was summary::before{content:"▸";color:var(--muted);transition:transform .15s}
.was[open] summary::before{transform:rotate(90deg)}
.done-note{border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:0 8px 8px 0;padding:10px 12px;font-size:.9rem}
[hidden]{display:none !important}
.sticky-cta{display:none}
@media (min-width:900px){
  .fiche-grid{grid-template-columns:minmax(0,1.3fr) 360px;gap:32px}
  .aside{position:sticky;top:16px;grid-column:2;grid-row:1}
  .fiche-main{grid-column:1;grid-row:1}
  .hero.fiche{grid-template-columns:1fr}
}
@media (max-width:899px){
  /* Téléphone : bouton d'action collé en bas tant que la fiche est à venir. */
  .sticky-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;gap:8px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(8px);border-top:1px solid var(--line)}
    body{padding-bottom:70px}
  body.is-past{padding-bottom:0}
  body.is-past .sticky-cta{display:none}
}


.hero.page{grid-template-columns:1fr;padding-bottom:clamp(120px,16vw,170px)}
.hero.page h1{font-size:clamp(1.9rem,5.4vw,3.2rem);margin:.4rem 0 .6rem;max-width:22ch}
.block{margin-block:44px}
.block > h2{margin-bottom:14px}
.prose p{margin:0 0 14px}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}
.person{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:16px;display:grid;justify-items:center;gap:4px;text-align:center}
.avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:1.4rem;font-weight:800;color:var(--accent-ink);background:var(--accent);margin-bottom:4px}
.person small{color:var(--muted)}
.big-num{font-family:var(--display);font-size:clamp(2.4rem,7vw,3.6rem);color:var(--accent);line-height:1}
.funded{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;list-style:none;padding:0;margin:16px 0 0}
.funded li{display:flex;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px}
.funded .em{font-size:1.5rem}
.steps{list-style:none;padding:0;margin:0;display:grid;gap:12px;counter-reset:st}
.steps li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px}
.steps li::before{counter-increment:st;content:counter(st);width:36px;height:36px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--display);font-weight:800}
.steps b{display:block;font-family:var(--display)}
.cta-band{background:linear-gradient(135deg,var(--hero-a),var(--hero-b));color:var(--hero-ink);border-radius:var(--r-lg);padding:clamp(20px,4vw,32px);display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta-band p{margin:.3rem 0 0;opacity:.9}
.levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.level{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:20px;display:grid;gap:10px;align-content:start}
.level .ico{font-family:var(--emoji);font-size:2.4rem;line-height:1}
.level h3{font-family:var(--display);font-size:1.15rem}
.level p{margin:0}
.level .time{font-family:var(--mono);font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
@media (max-width:800px){.levels{grid-template-columns:1fr}}
.needs{display:grid;gap:10px}
.need{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--r-md);padding:14px;text-decoration:none}
.need .em{font-size:1.8rem}
.need small{font-family:var(--mono);font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;display:block}
.need b{font-family:var(--display);display:block}
.need .go{color:var(--accent);font-weight:700;font-size:.88rem}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;margin-bottom:8px}
.faq summary{cursor:pointer;font-weight:700}
.faq p{margin:.5rem 0 0}
.partners{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.partner{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px;display:grid;gap:8px;justify-items:center;text-align:center;text-decoration:none}
.partner .logo{width:88px;aspect-ratio:1/1;max-width:100%;border-radius:14px;display:grid;place-items:center;font-family:var(--display);font-size:1.5rem;font-weight:800;color:#fff}
.partner b{font-size:.92rem;line-height:1.25}
.partner small{color:var(--accent);font-weight:700}
.offer{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:8px}
.offer li{display:flex;gap:10px;align-items:flex-start}
.offer .em{font-size:1.2rem}
.empty{border:1.5px dashed var(--line);border-radius:var(--r-lg);padding:24px;text-align:center;color:var(--muted)}
.two{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:800px){.two{grid-template-columns:1fr}}

/* ---- Ajouts du générateur (CSP : aucun attribut style dans les pages) ---- */
.floaters .f1{left:6%;top:10%}
.floaters .f2{left:86%;top:8%}
.floaters .f3{left:62%;top:78%}
.floaters .f4{left:30%;top:84%}
.floaters .f5{left:92%;top:60%}
.floaters .f6{left:48%;top:6%}
.frise ol.cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.frise ol.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.frise ol.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.frise ol.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.frise ol.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.frise ol.cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.frise ol.cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}
.frise ol.cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}
.frise ol.cols-1{grid-template-columns:minmax(0,320px)}
.lc-0{background:#b0630f}
.lc-1{background:#1e5fb0}
.lc-2{background:#1f6f78}
.lc-3{background:#2e8a63}
.lc-4{background:#7a4fb0}
.lc-5{background:#b23a3a}
.lc-6{background:#5c6b7a}
.lc-7{background:#a80960}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--surface);color:var(--ink);padding:.6rem 1rem;z-index:100}
.skip:focus{left:8px;top:8px}
a:focus-visible,summary:focus-visible,.btn:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.photos img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-md)}
.photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
.photos figure{margin:0}
.photos figure:first-child{grid-column:span 2}
.photos figure:first-child img{aspect-ratio:8/3}
.partner img.logo{width:88px;height:88px;object-fit:contain;border-radius:14px;background:#fff}
.share a.btn{border-color:var(--line);color:var(--ink)}
.prose a{color:var(--accent);font-weight:600}
.prose h3{font-family:var(--display);font-size:1.2rem;margin:20px 0 6px}
.prose blockquote{margin:0 0 14px;padding:4px 14px;border-left:4px solid var(--accent-soft);color:var(--ink)}
.prose hr{border:0;border-top:1px solid var(--line);margin:22px 0}
.prose ol{margin:0 0 14px;padding-left:1.4rem}
.news-hero{text-align:center}
.no-js-note{display:none}
@media print{.scene,.floaters,.sticky-cta,nav.main,.news,.share{display:none !important}.hero{background:none !important;color:#000;box-shadow:none}}

/* ---- Gabarits du générateur ---- */
.plain{color:inherit;text-decoration:none}
.plain:hover{text-decoration:underline}
.muted{color:var(--muted)}
.note{font-size:.8rem;color:var(--muted);margin:10px 0 0}
.card-title{font-family:var(--display);font-size:1.05rem;display:flex;align-items:center;gap:8px;margin:0}
.hero-card .place{margin:0}
.scene-img{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:auto;z-index:0;object-fit:cover;object-position:bottom}
.news-cta{display:flex;justify-content:flex-start}
.news p{margin:.4rem 0 0;color:var(--muted)}
.logos a{text-decoration:none;color:inherit}
.notice{text-align:center;padding-block:48px}
.notice-title{font-family:var(--display);font-size:clamp(1.8rem,5vw,2.8rem);margin:.4rem 0 .8rem}
.hero .when a,.hero a.plain{color:inherit}
.hero h1{overflow-wrap:anywhere}

/* ---------- page Contact : un bouton par motif ---------- */
.topics{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px}

/* ---------- affiche d'une fiche : dans le hero, à la place de la scène (lot 3) ---------- */
.poster{margin:0;min-width:0}
.poster img{display:block;max-width:100%;width:100%;height:auto;border-radius:14px;box-shadow:0 18px 40px -18px rgba(0,0,0,.55);border:4px solid rgba(255,255,255,.92)}
.poster.portrait img{max-height:460px;width:auto;margin-inline:auto}
.hero:is(.has-poster,.has-pcard) .scene,.hero:is(.has-poster,.has-pcard) .floaters{display:none !important}
.hero.fiche.has-poster{grid-template-columns:minmax(0,1fr) minmax(0,330px);align-items:center;gap:36px;padding-bottom:clamp(26px,5vw,56px)}
.hero.fiche.has-poster>*{min-width:0}
.hero.has-pcard{padding-bottom:clamp(26px,5vw,56px)}
.hero-card .poster img{border-width:3px;box-shadow:none;border-radius:10px}
@media (max-width:899px){
  .hero.fiche.has-poster{grid-template-columns:1fr;gap:22px}
  .poster{max-width:min(340px,100%)}
  .poster.portrait img{max-height:420px;margin-inline:0}
}
