:root{
  --paper:#F6F0E8; --paper-2:#EFE6DA; --card:#FFFBF6; --ink:#1B1115; --ink-2:rgba(27,17,21,.8); --mute:rgba(27,17,21,.66);
  --line:rgba(27,17,21,.12); --red:#B3122E; --red-2:#8E0E24; --violet:#35197E; --violet-2:#1E0E4A;
  --coral:#FF6B84; --mint:#63D6B8; --butter:#F7C948; --lilac:#A98DF5; --pink:#F59AC4;
  --copper:#C07A3F; --brass:#B08A4A;
  --serif:"Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --sans:"Manrope", "Segoe UI", system-ui, sans-serif;
  --img-kid:url(img/kid.webp);
  --img-loge:url(img/loge.webp);
  --img-pastel:url(img/pastel.webp);
  --img-deco:url(img/deco.webp);
  --img-jeux:url(img/jeux.webp);
  --img-closeup:url(img/closeup.webp);
  --img-ecole:url(img/ecole.webp);
  --img-barbe:url(img/barbe.webp);
  --img-maquillage:url(img/maquillage.webp);
  --img-noel:url(img/noel.webp);
  --img-mariage:url(img/mariage.webp);
  --img-location:url(img/location.webp);
  --img-pro:url(img/pro.webp);
  --img-anniv:url(img/anniv.webp);
  --img-annivh:url(img/annivh.webp);
  --img-mariageh:url(img/mariageh.webp);
  --img-noelh:url(img/noelh.webp);
  --img-placeh:url(img/placeh.webp);
  --img-magietable:url(img/magietable.webp);
  --img-decoh:url(img/decoh.webp);
  --img-jeuxh:url(img/jeuxh.webp);
  --img-barbeh:url(img/barbeh.webp);
  --img-fete:url(img/fete.webp);
  --img-hc0:url(img/hc0.webp);
  --img-hc1:url(img/hc1.webp);
  --img-hc2:url(img/hc2.webp);
  --img-bullesbig:url(img/bullesbig.webp);
  --img-bchateau:url(img/bchateau.webp);
  --img-bmariage:url(img/bmariage.webp);
  color-scheme:light;
}
*{box-sizing:border-box}
html{background:var(--paper);scroll-padding-top:70px}  /* un lien vers une section la laisse sous la barre de navigation, même sans défilement doux */
html.calm{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
/* Lisibilité : le Bodoni n'affine plus ses traits avec la taille ; sans réglage précis, il prend sa version « texte », aux traits solides */
:where(*){font-variation-settings:"opsz" 11!important}      /* les réglages précis (titres en 24, petits textes en 9) passent devant */
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip}
main > section,.passage{overflow-x:clip}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,figure{margin:0}
h2,h3{font-family:var(--serif);font-weight:500;text-wrap:balance;letter-spacing:-.01em}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(20px,5vw,56px)}
.label{font:700 12.5px/1.2 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
:focus-visible{outline:2px solid var(--red);outline-offset:4px;border-radius:4px}
.on-dark :focus-visible{outline-color:var(--butter)}
.skip{position:fixed;left:16px;top:-80px;z-index:100;padding:12px 18px;border-radius:999px;background:var(--ink);color:var(--card);font:700 14px/1 var(--sans);transition:top .2s}
.skip:focus{top:16px}
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.arrow{width:20px;height:10px;flex:none;transition:transform .3s}
a:hover .arrow{transform:translateX(5px)}
section{padding-block:clamp(96px,12vw,170px);position:relative}
.head{display:grid;gap:18px;justify-items:start;margin-bottom:clamp(40px,5vw,64px)}
.head h2{font-size:clamp(40px,5.4vw,78px);line-height:1}
.head h2 em{color:var(--red)}
.head p{font-size:18px;color:var(--ink-2);max-width:36em}
.head.center{justify-items:center;text-align:center}

/* Une seule façon de présenter les photos : cadre crème, coins arrondis, ombre douce */
.photo{border-radius:22px;aspect-ratio:4/5;background:var(--bg) center/cover;border:6px solid var(--card);box-shadow:0 30px 46px -30px rgba(27,17,21,.45)}

/* Scène 3D : un seul canevas fixe, au-dessus du décor, qui laisse passer les clics */
#stage3d{position:fixed;top:0;left:0;width:100%;height:100vh;height:100lvh;z-index:30;pointer-events:none;display:block}   /* 100lvh : la hauteur ne bouge pas quand la barre d’adresse du téléphone apparaît */
.no3d #stage3d{display:none}

/* Petit lever de rideau à l'arrivée : deux pans légers qui s'ouvrent et s'effacent */
.intro-curtain{position:fixed;top:0;bottom:0;width:50.5%;z-index:60;pointer-events:none;
  background:linear-gradient(180deg,rgba(60,4,14,.16),rgba(60,4,14,0) 22%,rgba(60,4,14,0) 80%,rgba(60,4,14,.2)),
    repeating-linear-gradient(90deg,#8f1a2f 0,#a3223a 3%,#b53046 4.6%,#a0213a 6.4%,#8f1a2f 8%)}
.intro-curtain.l{left:0}.intro-curtain.r{right:0}
.intro-curtain::after{content:"";position:absolute;top:0;bottom:0;width:30%}
.intro-curtain.l::after{right:0;background:linear-gradient(90deg,rgba(60,4,14,0),rgba(60,4,14,.2))}
.intro-curtain.r::after{left:0;background:linear-gradient(270deg,rgba(60,4,14,0),rgba(60,4,14,.2))}
.motion .intro-curtain.l{animation:ic-l 1.5s cubic-bezier(.65,0,.35,1) .25s forwards}
.motion .intro-curtain.r{animation:ic-r 1.5s cubic-bezier(.65,0,.35,1) .25s forwards}
@keyframes ic-l{65%{opacity:1}to{transform:translateX(-100%);opacity:0;visibility:hidden}}
@keyframes ic-r{65%{opacity:1}to{transform:translateX(100%);opacity:0;visibility:hidden}}
.calm .intro-curtain{display:none}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* D'une page à l'autre : le rideau se ferme sur le nom de la page suivante, puis s'ouvre sur elle.
   Sur les pages prestations, pas de lever de rideau à la première visite ; s'il ne s'ouvre pas à temps, il s'ouvre quand même au bout de 3 s. */
.pp .intro-curtain{display:none}
html.pt-in .intro-curtain,html.pt-out .intro-curtain{display:block;visibility:visible;opacity:1}
html.pt-in .intro-curtain.l{animation:ic-l .9s cubic-bezier(.65,0,.35,1) 3s forwards}
html.pt-in .intro-curtain.r{animation:ic-r .9s cubic-bezier(.65,0,.35,1) 3s forwards}
html.pt-in.pt-go .intro-curtain.l{animation:pt-open-l .95s cubic-bezier(.65,0,.35,1) .08s forwards}
html.pt-in.pt-go .intro-curtain.r{animation:pt-open-r .95s cubic-bezier(.65,0,.35,1) .08s forwards}
html.pt-out .intro-curtain.l{animation:pt-close-l .58s cubic-bezier(.65,0,.35,1) forwards}
html.pt-out .intro-curtain.r{animation:pt-close-r .58s cubic-bezier(.65,0,.35,1) forwards}
@keyframes pt-close-l{from{transform:translateX(-100%)}to{transform:none}}
@keyframes pt-close-r{from{transform:translateX(100%)}to{transform:none}}
@keyframes pt-open-l{60%{opacity:1}to{transform:translateX(-100%);opacity:0;visibility:hidden}}
@keyframes pt-open-r{60%{opacity:1}to{transform:translateX(100%);opacity:0;visibility:hidden}}
/* le nom de la page, écrit sur le rideau fermé */
html.pt-in::after,html.pt-out::after{content:"✦ " attr(data-pt) " ✦";position:fixed;left:50%;top:50%;z-index:61;transform:translate(-50%,-50%);pointer-events:none;width:max-content;max-width:86vw;text-align:center;text-wrap:balance;
  font:italic 400 clamp(30px,4.6vw,60px)/1.1 var(--serif);color:#FBF6EE;text-shadow:0 2px 24px rgba(60,4,14,.55)}
html.pt-out::after{animation:pt-t-in .4s cubic-bezier(.2,.8,.2,1) .36s backwards}
html.pt-in::after{animation:pt-t-out .3s ease 3s forwards}
html.pt-in.pt-go::after{animation:pt-t-out .4s cubic-bezier(.4,0,1,1) forwards}
@keyframes pt-t-in{from{opacity:0;transform:translate(-50%,-30%)}}
@keyframes pt-t-out{to{opacity:0;visibility:hidden;transform:translate(-50%,-75%)}}

/* Boutons */
.btn{display:inline-flex;align-items:center;gap:12px;padding:17px 26px;border-radius:999px;font:800 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;transition:transform .3s,background .3s,color .3s,box-shadow .3s}
.btn.sm{padding:14px 20px;font-size:11px;letter-spacing:.18em}
.btn.red{background:var(--red);color:var(--card);box-shadow:0 14px 30px -14px rgba(179,18,46,.7)}
.btn.red:hover{background:var(--red-2);transform:translateY(-2px)}
.btn.line{background:var(--ink);color:var(--paper);border:1px solid var(--ink)}
.btn.line:hover{background:var(--red);border-color:var(--red);transform:translateY(-2px)}
.btn.ghost{color:var(--ink);border:1px solid rgba(27,17,21,.32)}
.btn.ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.more{display:inline-flex;align-items:center;gap:12px;font:700 14px/1.2 var(--sans);color:var(--red)}

/* ---------- Nav ---------- */
.nav{position:fixed;left:0;right:0;top:0;z-index:40;padding-top:env(safe-area-inset-top,0px);transition:background .4s,box-shadow .4s}
.nav.scrolled{background:rgba(246,240,232,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:80px}
.nav-l{display:flex;align-items:center;gap:22px;min-width:0}
.brand{display:flex;align-items:center;gap:12px}
.brand .mono{width:44px;flex:none;color:var(--ink);margin-top:-4px}
/* dans le menu, le logo est sobre ; au survol, il devient festif et soulève son chapeau */
.brand .m-fete>*{opacity:0;transform:scale(.3)}
.motion .brand .m-fete>*{transition:opacity .25s,transform .45s cubic-bezier(.3,1.5,.5,1)}
.motion .brand .m-hat{transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.motion .brand:hover .m-fete>*,.motion .brand:focus-visible .m-fete>*{opacity:1;transform:none}
.motion .brand:hover .m-hat,.motion .brand:focus-visible .m-hat{transform:translate(10px,-90px) rotate(15deg)}
.brand-t{display:grid;gap:3px}
.brand-t b{font:600 19px/1 var(--serif);letter-spacing:-.01em}
.brand-t small{font:700 9.5px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--mute)}
.links{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.links a,.lk-evt{display:flex;align-items:center;gap:8px;padding:11px 14px;border:0;border-radius:999px;background:none;color:inherit;cursor:pointer;font:700 14px/1 var(--sans);transition:background .25s,color .25s}
.links a:hover,.links a:focus-visible,.lk-evt:hover,.lk-evt:focus-visible,.lk-evt[aria-expanded="true"]{background:rgba(27,17,21,.07);color:var(--red)}
.links a{position:relative}.lk-evt{position:relative}
/* un seul repère « vous êtes ici » : un trait rouge sous l'entrée en cours */
.links a[aria-current="page"],.links a.spy,.lk-evt.cur{color:var(--red)}
.links a[aria-current="page"]::after,.links a.spy::after,.lk-evt.cur::after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2px;border-radius:2px;background:var(--red)}
.lk-evt[aria-expanded="true"] .chev{transform:rotate(180deg)}
.lk-evt .chev{width:11px;height:8px;transition:transform .3s}
.lk-evt:hover .chev{transform:translateY(2px)}
/* le fil rouge avance avec la lecture */
.nav-prog{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform-origin:0 50%;transform:scaleX(var(--p,0));opacity:0;transition:opacity .4s;pointer-events:none}
.nav.scrolled .nav-prog{opacity:.9}
body.menu-open .nav-prog{opacity:0}
.nav-r{display:flex;align-items:center;gap:14px}
.pill{display:inline-flex;align-items:center;gap:12px;padding:13px 20px;border-radius:999px;background:var(--red);color:var(--card);box-shadow:0 12px 24px -14px rgba(179,18,46,.7);font:800 11.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;transition:transform .3s,background .3s}
.pill:hover{transform:translateY(-2px);background:var(--red-2)}
.menu-btn{display:none;height:46px;padding:0 16px 0 13px;border-radius:999px;border:1px solid var(--line);background:none;color:var(--ink);align-items:center;cursor:pointer;font:800 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase}
.menu-btn i{display:grid;gap:5px;width:18px;margin-right:10px}
.menu-btn i::before,.menu-btn i::after{content:"";height:1.5px;background:currentColor;display:block}
.menu-btn i::after{width:62%}
.links a,.links button{white-space:nowrap}
@media (max-width:1099px){.links{display:none}.menu-btn{display:flex}}
@media (max-width:520px){.brand-t small{display:none}.pill{padding:12px 16px;letter-spacing:.14em}}
@media (max-width:560px){.nav .pill{display:none}}
/* ---------- Le menu : l'éventail des événements, et les autres pages ---------- */
.menu{position:fixed;inset:0;z-index:80;display:grid;grid-template-rows:auto minmax(0,1fr);opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s;overflow:hidden;
  background:radial-gradient(70% 60% at 40% 78%,#FFF6EA 0%,var(--paper) 58%,#EFE4D6 100%)}
body.menu-open .menu{opacity:1;visibility:visible}
.menu-top{display:flex;align-items:center;justify-content:space-between;height:80px;width:100%}
.menu .close{display:inline-flex;align-items:center;gap:10px;background:none;border:1px solid var(--line);color:var(--ink);border-radius:999px;padding:12px 18px;font:800 11px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s}
.menu .close:hover{background:var(--ink);color:var(--paper)}
.menu-body{display:grid;grid-template-columns:minmax(0,1fr);align-content:center;gap:clamp(16px,3vh,34px);width:100%;min-height:0;padding-bottom:clamp(20px,5vh,56px)}
.menu-deck{display:grid;gap:10px;align-content:end}
.deck-t{margin:0;text-align:center;font:800 12.5px/1 var(--sans);letter-spacing:.19em;text-transform:uppercase;color:var(--mute)}
.menu-side{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px clamp(18px,2.4vw,34px);padding-top:clamp(14px,2.4vh,24px);border-top:1px solid var(--line)}
.menu-side .k{display:none}
.menu-side a:not(.btn){font:italic 400 clamp(22px,1.9vw,28px)/1.2 var(--serif);transition:color .3s,transform .4s}
.menu-side a:not(.btn):hover{color:var(--red);transform:translateY(-3px)}
.menu-side a em{color:var(--red)}
.menu-side .tel{margin:0;font-size:14px;color:var(--mute)}
.motion .menu-side > *{opacity:0;transform:translateY(12px);transition:opacity .4s,transform .5s cubic-bezier(.2,.8,.2,1)}
.motion body.menu-open .menu-side > *{opacity:1;transform:none;transition-delay:calc(.25s + var(--i,0) * 40ms)}
.menu-side > :nth-child(2){--i:1}.menu-side > :nth-child(3){--i:2}.menu-side > :nth-child(4){--i:3}.menu-side > :nth-child(5){--i:4}.menu-side > :nth-child(6){--i:5}.menu-side > :nth-child(7){--i:6}.menu-side > :nth-child(8){--i:7}
@media (max-width:899px){
  .menu{display:block;overflow-y:auto;overscroll-behavior:contain}
  .menu-top{position:sticky;top:0;z-index:2;height:72px;background:rgba(246,240,232,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .menu-body{grid-template-columns:1fr;padding-top:10px}
  .deck-t{text-align:left}
  .menu-side{display:grid;grid-template-columns:1fr 1fr;justify-content:stretch;gap:2px 16px;padding:24px 0 0}
  .menu-side .k{display:block;grid-column:1/-1;margin:0 0 8px;font:800 12px/1 var(--sans);letter-spacing:.19em;text-transform:uppercase;color:var(--mute)}
  .menu-side a:not(.btn){justify-self:start;font-size:26px}
  .menu-side .btn,.menu-side .tel{grid-column:1/-1}
  .menu-side .btn{justify-self:stretch;justify-content:center;margin-top:18px}
}

/* ---------- L'éventail : 9 cartes en 3 familles ; en arc sur grand écran, en liste sur téléphone ---------- */
.deck{--cw:clamp(84px,calc((100vw - 64px) / (var(--span,9) + .8)),140px);--ch:calc(var(--cw) * 1.45);--R:calc(var(--cw) * 8.5);--step:6.3deg;--b:calc(var(--cw) * 1.02);position:relative;height:calc(var(--b) + var(--ch) + 54px)}
.deck-g{position:absolute;inset:0;pointer-events:none}
.deck-g ul{list-style:none;margin:0;padding:0}
.deck-gt{position:absolute;left:50%;bottom:var(--b);width:260px;margin:0 0 0 -130px;text-align:center;white-space:nowrap;transform-origin:50% calc(100% + var(--R));
  transform:rotate(calc(var(--go) * var(--step))) translateY(calc(-1 * var(--ch) - 24px));font:800 10px/1 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--mute);transition:opacity .5s .3s,color .3s}
.deck-gt span{margin-right:5px;color:var(--red);letter-spacing:0;font-size:12px}
.deck-g.flash .deck-gt{color:var(--red)}
.dcard{position:absolute;left:calc(50% - var(--cw) / 2);bottom:var(--b);width:var(--cw);height:var(--ch);pointer-events:auto;display:grid;justify-items:center;align-content:center;gap:5px;padding:14px 8px;
  text-align:center;border-radius:12px;background:var(--card);color:var(--ink);transform-origin:50% calc(100% + var(--R));transform:rotate(calc(var(--o) * var(--step))) translateY(var(--lift,0px));
  box-shadow:inset 0 0 0 6px var(--card),inset 0 0 0 7px rgba(179,18,46,.3),0 16px 26px -16px rgba(40,20,10,.5),0 2px 4px rgba(40,20,10,.1);
  transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .3s,opacity .45s}
.dcard:hover,.dcard:focus-visible{--lift:-26px;z-index:3;box-shadow:inset 0 0 0 6px var(--card),inset 0 0 0 7px rgba(179,18,46,.65),0 30px 40px -18px rgba(40,20,10,.55)}
.dcard.is-cur{--lift:-14px;box-shadow:inset 0 0 0 6px var(--card),inset 0 0 0 8px var(--red),0 22px 30px -16px rgba(40,20,10,.5)}
.dcard svg{width:calc(var(--cw) * .62);height:auto}
.dcard b{font:italic 400 calc(var(--cw) * .135)/1.08 var(--serif)}
.dcard .dc-sub{margin-top:-2px;font:600 calc(var(--cw) * .085)/1.2 var(--sans);color:var(--mute)}
.dcard small{margin-top:2px;font:800 calc(var(--cw) * .078)/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.dc-s{position:absolute;left:10px;top:8px;font:500 13px/1 var(--serif);color:var(--red)}
.dc-s.k{color:var(--ink)}
.dc-s.b{left:auto;top:auto;right:10px;bottom:8px;transform:rotate(180deg)}
/* la donne : les cartes partent du paquet et s'ouvrent en éventail, l'une après l'autre */
.motion .deck:not(.dealt) .dcard{opacity:0;transform:rotate(0deg) translateY(46px) scale(.9)}
.motion .deck:not(.dealt) .deck-gt{opacity:0;transition-delay:0s}
.motion .deck.dealt:not(.ready) .dcard{transition-delay:calc(var(--k) * 45ms)}
@media (max-width:899px){
  .deck{height:auto;display:grid;gap:18px}
  .deck-g{position:static;pointer-events:auto}
  .deck-gt{position:static;width:auto;margin:0 0 8px;transform:none;text-align:left}
  .deck-g ul{display:grid;gap:8px}
  .dcard{position:relative;left:auto;bottom:auto;width:auto;height:auto;display:grid;grid-template-columns:58px 1fr auto;align-items:center;justify-items:start;text-align:left;
    gap:3px 14px;padding:13px 16px;transform:translateX(var(--nudge,0px))}
  .dcard:hover,.dcard:focus-visible{--nudge:4px}
  .dcard svg{grid-row:1 / span 3;width:56px}
  .dcard b{font-size:21px}
  .dcard .dc-sub{font-size:11.5px}
  .dcard small{font-size:9.5px}
  .dc-s{display:none}
  .dcard::after{content:"\2192";grid-column:3;grid-row:1 / span 3;color:var(--red)}
  .motion .deck:not(.dealt) .dcard{transform:translateY(18px)}
}

/* ---------- Accueil : c'est pour quel événement ? ---------- */
.choix{padding-top:clamp(40px,6vw,90px)}
.choix .deck{margin-top:clamp(0px,1vw,14px)}
.choix-else{margin:clamp(16px,2.4vw,30px) 0 0;text-align:center;font:italic 400 clamp(18px,1.6vw,21px)/1.4 var(--serif);color:var(--ink-2)}
.choix-else .more{margin-left:8px;font-style:normal}
/* chaque acte dit où on le retrouve */
.act-ou{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;font:800 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.act-ou span{margin-right:4px}
.act-ou a{padding:8px 11px;border-radius:999px;border:1px solid rgba(179,18,46,.28);color:var(--red);font:700 12.5px/1 var(--sans);letter-spacing:.02em;text-transform:none;transition:background .25s,color .25s}
.act-ou a:hover{background:var(--red);color:var(--card)}

/* ---------- Accueil ---------- */
.hero{position:relative;min-height:min(max(700px,100svh),940px);overflow:hidden;display:grid}
.halo{position:absolute;left:50%;top:6%;width:min(900px,120vw);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(255,214,196,.9) 0%,rgba(255,226,212,.45) 35%,rgba(246,240,232,0) 68%)}
.rings{position:absolute;left:50%;top:14%;width:min(620px,92vw);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;border:1px solid rgba(179,18,46,.12);pointer-events:none}
.title{position:relative;align-self:center;text-align:center;padding-top:clamp(250px,37vh,380px);padding-bottom:clamp(48px,8vh,96px);display:grid;justify-items:center;padding-inline:20px}
.wordmark{font:600 clamp(56px,11.4vw,188px)/.84 var(--serif);letter-spacing:-.025em;color:var(--ink);display:flex}
.wordmark span{display:inline-block;animation:letter 1.1s cubic-bezier(.2,.8,.2,1) backwards}
.wordmark span:nth-of-type(4){color:var(--red)}
@keyframes letter{from{transform:translateY(.2em);opacity:0}}
.sub{font:italic 400 clamp(22px,2.2vw,32px)/1.2 var(--serif);color:var(--ink);margin-top:clamp(14px,1.6vw,22px)}
.sub em{color:inherit;font-style:inherit}
/* « À l'affiche » (rendez-vous de saison, rempli par le thème) : une étiquette sous l'accroche, un bloc avant les événements.
   Chaque ambiance (.af-classique, .af-halloween, .af-noel, .af-fete, .af-valentin) a ses couleurs et ses décors dessinés. */
.af-classique{--af-photo:#fff;--af-bg:var(--card);--af-ink:var(--ink);--af-ink2:var(--ink-2);--af-acc:var(--red);--af-btn:var(--red);--af-btn-ink:#fff;--af-cadre:rgba(179,18,46,.32)}
.af-halloween{--af-photo:#46293C;--af-bg:#24131F;--af-ink:#F6E9DA;--af-ink2:rgba(246,233,218,.82);--af-acc:#F2A65A;--af-btn:#E8742B;--af-btn-ink:#24131F;--af-cadre:#3A2232}
.af-noel{--af-photo:#2C5643;--af-bg:#173528;--af-ink:#F4EEDC;--af-ink2:rgba(244,238,220,.84);--af-acc:#F4C95D;--af-btn:#F4C95D;--af-btn-ink:#173528;--af-cadre:#24483A}
.af-fete{--af-bg:#FFF7EC;--af-ink:var(--ink);--af-ink2:var(--ink-2);--af-acc:var(--red);--af-btn:var(--red);--af-btn-ink:#fff;--af-cadre:#fff}
.af-valentin{--af-bg:#FBE6EC;--af-ink:#3A0F1E;--af-ink2:rgba(58,15,30,.8);--af-acc:#C2185B;--af-btn:#C2185B;--af-btn-ink:#fff;--af-cadre:#fff}
.affiche-pill{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:8px 16px 8px 10px;border-radius:99px;background:var(--af-bg);color:var(--af-ink);border:1px solid var(--af-cadre);font:600 14.5px/1.3 var(--sans);box-shadow:0 12px 26px -18px rgba(27,17,21,.6);transition:transform .3s,box-shadow .3s}
.affiche-pill svg:first-child{width:22px;height:22px}
.affiche-pill .af-p-l{font:800 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--af-acc)}
.affiche-pill:hover,.affiche-pill:focus-visible{transform:translateY(-2px);box-shadow:0 16px 30px -18px rgba(27,17,21,.7)}
.affiche{padding-block:clamp(56px,7vw,96px) 0}
.affiche-c{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;
  max-width:1040px;margin:0 auto;padding:clamp(34px,4.6vw,60px) clamp(22px,4.6vw,60px);border-radius:28px;background:var(--af-bg);color:var(--af-ink);box-shadow:0 40px 70px -50px rgba(27,17,21,.55)}
.af-classique .affiche-c{border-radius:6px;box-shadow:inset 0 0 0 1px var(--af-cadre),inset 0 0 0 7px var(--af-bg),inset 0 0 0 8px rgba(179,18,46,.14),0 40px 70px -50px rgba(27,17,21,.4)}
.affiche-c.sans-photo{grid-template-columns:1fr;max-width:820px;text-align:center}
.affiche-ph{position:relative;z-index:1;margin:0}
.affiche-ph::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:22px;background:var(--af-acc);opacity:.16;transform:rotate(-3.5deg) scale(1.02)}   /* une carte de couleur glissée derrière */
.affiche-ph img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:20px;border:5px solid var(--af-photo,var(--af-cadre));box-shadow:0 26px 40px -28px rgba(0,0,0,.55)}
.affiche-t{position:relative;z-index:1;display:grid;gap:14px;justify-items:start}
.affiche-c.sans-photo .affiche-t{justify-items:center}
.affiche-k{margin:0;font:800 12px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--af-acc)}
.affiche-t h2{margin:0;font-size:clamp(38px,4.6vw,62px);line-height:1.02;color:var(--af-ink);text-wrap:balance}
.affiche-t h2 em{color:var(--af-acc)}
.affiche-txt{margin:0;font-size:17px;line-height:1.65;color:var(--af-ink2);max-width:34em}
.affiche-note{margin:0;font:700 15.5px/1.5 var(--sans);color:var(--af-ink)}
.affiche-act{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin:6px 0 0}
.affiche-b{background:var(--af-btn);color:var(--af-btn-ink);box-shadow:0 14px 30px -16px rgba(0,0,0,.5)}
.affiche-b:hover{transform:translateY(-2px)}
.affiche-l2{font:700 15px/1.3 var(--sans);color:var(--af-acc);text-decoration:underline;text-underline-offset:4px}
/* les décors (dessinés dans affiche.php) : une frise en haut ou une lune dans le coin, un motif en bas à droite ; toujours sous le texte */
.af-d{position:absolute;z-index:0;pointer-events:none}
.af-nuit{top:12px;right:14px;width:clamp(220px,26vw,310px);filter:drop-shadow(0 0 18px rgba(246,216,143,.35))}
.af-toile{top:0;left:0;width:clamp(90px,11vw,140px)}
.af-citrouilles{right:22px;bottom:8px;width:clamp(124px,14vw,180px);filter:drop-shadow(0 0 22px rgba(232,116,43,.3))}
.af-guirlande,.af-fanions,.af-coeurs{top:0;left:0;width:100%;height:clamp(54px,6.2vw,80px)}
.af-congere{left:0;bottom:0;width:100%;height:clamp(44px,6vw,72px)}
.af-houx{right:22px;bottom:16px;width:clamp(96px,11vw,136px)}
.af-confettis{top:clamp(50px,5.8vw,74px);left:0;width:100%;height:clamp(34px,4vw,50px)}
.af-ballons{right:-4px;bottom:-34px;width:clamp(112px,13vw,150px)}
.af-baguette{top:26px;right:30px;width:clamp(70px,8vw,100px)}
.af-noel .affiche-c,.af-fete .affiche-c,.af-valentin .affiche-c{padding-top:clamp(76px,8.6vw,112px)}
.af-neige{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;container-type:size}
.af-neige span{position:absolute;top:-8%;width:5px;height:5px;border-radius:50%;background:rgba(244,238,220,.7)}
.af-neige .af-flocon{width:15px;height:15px;border-radius:0;background:none}
.af-flocon svg{display:block;width:100%;height:100%;fill:none;stroke:rgba(244,238,220,.8);stroke-width:1.5;stroke-linecap:round}
@media (prefers-reduced-motion: no-preference){.af-neige span{animation:af-neige 11s linear infinite}}
@media (prefers-reduced-motion: reduce){.af-neige span{top:var(--y)}}     /* sans animation : des flocons posés à des hauteurs différentes */
@keyframes af-neige{to{transform:translateY(560px) rotate(160deg);transform:translateY(calc(100cqh + 40px)) rotate(160deg)}}
@media (max-width:760px){
  .affiche-c{grid-template-columns:1fr}
  .affiche-ph img{aspect-ratio:4/3}
  .af-halloween .affiche-c{padding-top:104px;padding-bottom:96px}     /* les décors au-dessus de la photo et sous le bouton */
  .af-noel .affiche-c,.af-fete .affiche-c,.af-valentin .affiche-c{padding-bottom:96px}
  .af-nuit{width:220px;top:6px;right:6px}
  .af-toile{width:84px}
  .af-citrouilles{width:126px;right:12px;bottom:6px}
  .af-houx{width:92px;right:12px;bottom:10px}
  .af-ballons{width:104px;bottom:-30px}
  .af-baguette{display:none}
}
.pitch{max-width:36em;margin-top:clamp(18px,2vw,28px);font-size:clamp(16px,1.35vw,18.5px);line-height:1.6;color:var(--ink-2);text-wrap:balance}
.cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(22px,2.6vw,32px)}
.hat-fallback{display:none;width:clamp(150px,20vw,220px);margin-bottom:22px}
.no3d .hat-fallback{display:block}
.no3d .title{padding-top:clamp(120px,18vh,180px)}
@media (max-width:760px){.title{padding-top:clamp(210px,31vh,270px)}.pitch{font-size:15.5px}}

/* ---------- Le spectacle : les prestations en trois actes ---------- */
.show{padding:0;position:relative}
.show-stage{position:relative;padding-block:clamp(80px,10vw,140px)}
.show-word,.show-floor,.show-spot,.act-nav,.scroll-cue,.act-thumb,.stage-fallback{display:none}
.show-intro{display:grid;justify-items:center;text-align:center;gap:18px;padding-inline:20px}
.show-intro h2{font-size:clamp(52px,8vw,128px);line-height:.92;letter-spacing:-.03em}
.show-intro h2 em{font-weight:400;color:var(--red)}
.show-intro p{font-size:18px;color:var(--ink-2);max-width:28em}
.act{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,90px);align-items:center;max-width:1240px;margin-inline:auto;padding:clamp(60px,9vw,120px) clamp(20px,5vw,56px) 0}
.act-text{display:grid;gap:14px;justify-items:start}
.act-num{display:flex;align-items:center;gap:12px;font:800 12.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.act-num::after{content:"";width:48px;height:1px;background:currentColor;opacity:.5}
.act h3{font-size:clamp(48px,5.2vw,86px);line-height:.9;letter-spacing:-.03em}
.act-lead{font:italic 400 clamp(18px,1.5vw,21px)/1.4 var(--serif);color:var(--ink);max-width:24em}
.formats{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:0;width:100%;max-width:27em;border-top:1px solid var(--line)}
.formats li{display:grid;gap:2px;padding:10px 0;border-bottom:1px solid var(--line)}
.formats b{font:700 14.5px/1.3 var(--sans)}
.formats span{font-size:14px;line-height:1.45;color:var(--ink-2)}
.act-links{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:6px}
.act-photo{margin:0;position:relative}
.act-photo .ph{border-radius:22px;aspect-ratio:4/5;background:var(--bg) center/cover;border:6px solid var(--card);transform:rotate(2.5deg);box-shadow:0 30px 46px -30px rgba(27,17,21,.45)}
@media (max-width:899px){.act{grid-template-columns:1fr}}

/* Mode spectacle : la scène reste à l'écran, le défilement fait passer les actes */
.js .show-track{height:280vh}
.js .show-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;padding:0;--hp:clamp(120px,21vh,200px);--floor:82%}
.js .show-word,.js .show-floor,.js .show-spot,.js .act-nav{display:block}
.js .show-spot{position:absolute;left:50%;top:-12%;width:min(760px,86vw);height:104%;transform:translateX(-50%);pointer-events:none;
  background:linear-gradient(180deg,rgba(255,219,192,.75),rgba(255,226,208,0) 88%);clip-path:polygon(41% 0,59% 0,88% 100%,12% 100%);filter:blur(20px);opacity:.35;transition:opacity 1.2s ease}
.js .show-stage:not([data-act="-1"]) .show-spot{opacity:1}
.js .show-floor{position:absolute;left:50%;top:var(--floor);width:calc(var(--hp) * 2.8);aspect-ratio:4/1;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse at 50% 50%,rgba(27,17,21,.3) 0,rgba(27,17,21,.12) 16%,rgba(27,17,21,0) 34%),radial-gradient(ellipse at 50% 50%,rgba(255,210,190,.95),rgba(255,226,212,.4) 55%,rgba(246,240,232,0) 72%)}
.js .show-floor::after{content:"";position:absolute;inset:6%;border-radius:50%;border:1px solid rgba(179,18,46,.18)}
.js .show-word{position:absolute;inset:0;pointer-events:none}
.js .show-word span{position:absolute;left:50%;top:40%;font:italic 400 clamp(120px,19vw,320px)/1 var(--serif);color:rgba(179,18,46,.035);white-space:nowrap;
  opacity:var(--in,0);letter-spacing:calc(.12em - var(--in,0) * .14em);transform:translate(calc(-50% + var(--wx,0px)),-50%)}
.js .show-intro{position:absolute;left:50%;top:34%;width:min(920px,92vw);opacity:var(--in,1);transform:translate(-50%,calc(-50% - (1 - var(--in,1)) * 60px))}
.js .show-intro:not(.on){pointer-events:none}
.js .scroll-cue{display:inline-flex;flex-direction:column;align-items:center;gap:10px;margin-top:clamp(40px,7vh,80px);font:700 12px/1 var(--sans);letter-spacing:.19em;text-transform:uppercase;color:var(--mute)}
.js .scroll-cue::after{content:"";width:1px;height:44px;background:linear-gradient(var(--red),rgba(179,18,46,0));transform-origin:top;animation:cue 2.2s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(0);opacity:1}55%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
.js .act{position:absolute;inset:0;display:block;padding:0;max-width:none;pointer-events:none}
.js .act.on{pointer-events:auto}
.js .act-text{position:absolute;left:clamp(20px,5.5vw,96px);top:50%;transform:translateY(calc(-50% + var(--sl,0) * -60px));width:min(440px,31vw)}
.js .act-photo{position:absolute;right:clamp(20px,5.5vw,96px);top:50%;width:min(330px,22vw);transform:translateY(calc(-54% + var(--sl,0) * -120px))}
.js .act{--in:0}
.js .act-text > *{--v:clamp(0,calc(var(--in) * 1.9 - .25 - var(--d,0) * .12),1);opacity:var(--v);transform:translateY(calc((1 - var(--v)) * 24px))}
.js .act-text > :nth-child(2){--d:1}.js .act-text > :nth-child(3){--d:2}.js .act-text > :nth-child(4){--d:3}.js .act-text > :nth-child(5){--d:4}
.js .act .act-text > h3{clip-path:inset(-20% -10% calc((1 - var(--v)) * 125% - 25%) -10%)}
.js .act-photo .ph{opacity:clamp(0,calc(var(--in) * 2.2 - .3),1);clip-path:circle(calc(var(--in) * 150%) at 12% 100%);transform:rotate(calc(2.5deg + (1 - var(--in)) * 7deg)) scale(calc(.9 + var(--in) * .1))}
.js .act-nav{position:absolute;left:50%;transform:translateX(-50%);bottom:clamp(20px,4.5vh,44px);display:flex;gap:26px;transition:opacity .6s ease}
.show-rail{display:none}
.js .show-rail{position:absolute;right:clamp(10px,1.6vw,26px);top:50%;transform:translateY(-50%);display:grid;justify-items:center;gap:14px;transition:opacity .6s ease}
.js .show-stage[data-act="-1"] .show-rail{opacity:0}
.rail-num{font:italic 400 15px/1 var(--serif);color:var(--mute);white-space:nowrap}
.rail-num b{font-weight:500;font-size:22px;color:var(--red)}
.rail-line{position:relative;width:2px;height:clamp(120px,24vh,220px);border-radius:2px;background:var(--line);overflow:hidden}
.rail-line i{position:absolute;inset:0;background:var(--red);transform-origin:top;transform:scaleY(var(--tp,0))}
@media (max-width:899px){.js .show-rail{display:none}}
.js .show-stage[data-act="-1"] .act-nav{opacity:0;pointer-events:none}
.act-nav button{position:relative;background:none;border:0;padding:0 0 10px;font:700 12.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);cursor:pointer;transition:color .4s}
.act-nav button b{font:italic 500 17px/1 var(--serif);letter-spacing:0;margin-right:8px;color:inherit}
.act-nav button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--line)}
.act-nav button i{position:absolute;left:0;bottom:0;height:2px;width:calc(var(--lp,0) * 100%);border-radius:2px;background:var(--red);z-index:1}
.act-nav button[aria-current="step"]{color:var(--ink)}
.act-nav button[aria-current="step"] b{color:var(--red)}
.no3d.js .stage-fallback{display:block;position:absolute;left:50%;top:var(--floor);width:var(--hp);transform:translate(-50%,-92%)}
.calm .act-text > *{transform:none!important}
.calm .act-photo .ph{transform:rotate(2.5deg)!important}
@media (min-width:900px) and (max-height:760px){.js .act-lead{font-size:17px}.js .formats li{padding:7px 0}.js .formats span{font-size:13px}}
@media (min-width:900px) and (max-height:660px){.js .formats span{display:none}}
@media (max-width:899px){
  .js .show-stage{--hp:clamp(66px,10vh,90px);--floor:47%}
  .js .show-intro{top:26%}
  .js .show-word span{top:26%;font-size:30vw}
  .js .act-text{left:20px;right:20px;width:auto;top:auto;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translateY(calc(var(--sl,0) * -30px));gap:9px}
  .js .act h3{font-size:clamp(38px,10.5vw,54px)}
  .js .act-lead{font-size:16px}
  .js .formats{display:flex;flex-wrap:wrap;gap:6px;border:0;margin:0}
  .js .formats li{padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--card)}
  .js .formats b{font-size:12.5px}
  .js .formats span{display:none}
  .js .act-links{gap:10px 18px;margin-top:2px}
  .js .act-photo{display:none}
  .js .act-thumb{display:inline-block;width:36px;height:36px;border-radius:50%;background:var(--bg) center/cover;border:2px solid var(--card);box-shadow:0 6px 14px -6px rgba(27,17,21,.5)}
  .js .act-nav{top:92px;bottom:auto;gap:18px}
  .act-nav button{font-size:11.5px;letter-spacing:.16em}
}
@media (max-width:899px) and (max-height:760px){.js .act-lead{display:none}}

/* ---------- Bulles géantes : une grande photo réelle, quelques vraies bulles qui en sortent ---------- */
.passage{position:relative;padding-top:clamp(48px,6vw,88px)}
/* l'accueil respire un peu moins entre les sections : les cartes des événements arrivent plus tôt */
.about,.chapeaux{padding-block:clamp(72px,8.5vw,124px)}
.passage{padding-bottom:clamp(56px,7vw,104px)}
.p-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,96px);align-items:center}
.passage .txt{display:grid;gap:22px;justify-items:start;max-width:520px}
.passage .label{color:var(--red)}
.passage .big-line{font:italic 400 clamp(44px,5.4vw,84px)/1.02 var(--serif);letter-spacing:-.01em;text-wrap:balance;color:var(--ink)}
.passage .big-line em{color:var(--red)}
.passage p{font-size:17.5px;line-height:1.65;color:var(--ink-2);max-width:30em}
.p-facts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.p-facts li{padding:9px 15px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-size:13.5px;color:var(--ink)}
/* bulles dessinées : contour irisé, reflets nets, légère ombre bleutée pour le volume */
.bubs{position:absolute;inset:0;pointer-events:none;z-index:0}
.passage .p-grid{position:relative;z-index:2}
.bub{position:absolute;left:0;top:0;border-radius:50%;pointer-events:auto;cursor:pointer;will-change:transform,opacity;
  background:radial-gradient(circle at 70% 76%,rgba(255,255,255,.85) 0 3.5%,rgba(255,255,255,0) 7%),radial-gradient(circle at 50% 52%,rgba(255,255,255,0) 58%,rgba(255,255,255,.14) 78%,rgba(255,255,255,.4) 95%,rgba(255,255,255,0) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55),inset -5px -9px 16px rgba(60,110,170,.2),inset 4px 5px 12px rgba(255,190,230,.18),0 8px 18px -12px rgba(27,17,21,.25)}
.bub::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from var(--h,0deg),#ff4fa8,#ffd24a,#4de3b8,#4f8dff,#c35cff,#ff4fa8);
  -webkit-mask:radial-gradient(closest-side,transparent 80%,#000 93%,#000 98%,transparent 100%);mask:radial-gradient(closest-side,transparent 80%,#000 93%,#000 98%,transparent 100%);opacity:.6}
.bub::after{content:"";position:absolute;left:15%;top:11%;width:36%;height:24%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,255,.95),rgba(255,255,255,0) 70%);transform:rotate(-32deg)}
.bub.pop{transition:transform .14s ease-out,opacity .14s;opacity:0!important}
.p-big{height:min(72vh,700px);border-radius:28px;background:var(--bg) 50% 30%/cover;box-shadow:0 40px 70px -46px rgba(27,17,21,.5)}
@media (max-width:899px){
  .p-grid{grid-template-columns:1fr}
  .p-big{height:auto;aspect-ratio:4/5}
}

/* ---------- Et aussi : les autres animations ---------- */
.aussi{padding-top:clamp(40px,6vw,80px)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px);list-style:none;margin:0;padding:0}
.cards li{display:flex;flex-direction:column;gap:12px}
.cards li p{flex:1}
.cards .photo{margin-bottom:6px;border-width:3px;border-radius:18px;box-shadow:0 12px 22px -18px rgba(27,17,21,.28)}
.cards h3{font-size:clamp(24px,2.1vw,30px);line-height:1.05}
.cards p{font-size:15px;color:var(--ink-2)}
.cards .price{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;padding-top:4px;font:800 12.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){
  .cards{grid-template-columns:1fr;gap:22px}
  .cards li{display:grid;grid-template-columns:112px 1fr;column-gap:16px;row-gap:6px;align-content:start}
  .cards .photo{grid-row:span 3;margin:0;border-width:2px;border-radius:14px}
  .cards h3{font-size:24px}
}

/* ---------- Formules & tarifs : un programme de spectacle, sobre et lisible d'un coup d'œil ---------- */
.tarifs{background:var(--paper-2)}
.pg{max-width:1200px;margin:0 auto;padding:clamp(40px,6vw,84px) clamp(22px,6vw,84px);background:var(--card);border-radius:6px;position:relative;
  box-shadow:0 40px 70px -50px rgba(27,17,21,.45)}
.pg::before{content:"";position:absolute;inset:12px;border:1px solid rgba(179,18,46,.28);border-radius:3px;pointer-events:none}
.pg::after{content:"";position:absolute;inset:17px;border:1px solid rgba(179,18,46,.12);border-radius:2px;pointer-events:none}
.pg-h,.pg-end{display:grid;justify-items:center;text-align:center;gap:14px}
.pg-orn{color:var(--red);font-size:14px;letter-spacing:.5em}
.pg-h h2{font-size:clamp(44px,5.6vw,80px);line-height:1}
.pg-h h2 em{color:var(--red);font-weight:400}
.pg-h p{max-width:34em;font-size:16px;color:var(--ink-2)}
.pg-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:clamp(26px,3vw,36px) auto 0;max-width:900px}
.pg-nav a{display:inline-flex;align-items:center;gap:6px;padding:6px 14px 6px 8px;border:1px solid var(--line);border-radius:99px;background:var(--paper);font:600 14px/1.2 var(--sans);color:var(--ink);transition:border-color .3s}
.pg-nav a:hover,.pg-nav a:focus-visible{border-color:var(--red)}.pg-nav svg{width:34px;height:21px}
.pg-sects{margin-top:clamp(36px,4.6vw,60px);display:grid;gap:clamp(40px,5vw,64px)}
.pg-g{display:grid;gap:clamp(26px,3vw,40px) clamp(32px,4vw,56px);padding:0}
@media (min-width:1000px){.pg-g{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.pg-g .pg-gt{grid-column:1/-1}}
.pg-g .pg-gt{margin:0}
.pg-bh{display:flex;align-items:center;gap:16px;padding-bottom:12px;border-bottom:1px solid rgba(27,17,21,.5)}
.pg-bh .pg-ico{flex:none;width:64px;height:40px;margin:0}
.pg-bh div{flex:1;min-width:0}
.pg-b h3{margin:0;font:500 clamp(24px,2.2vw,30px)/1.1 var(--serif)}
.pg-bh .pg-s{margin:4px 0 0;text-align:left;font-size:14.5px}
.pg-bh .pg-more{flex:none;display:inline-flex;align-items:center;gap:10px;margin:0;font:800 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.pg-r{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(78px,auto);gap:6px 18px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--line)}
.pg-r .pg-n span{font:500 18px/1.3 var(--serif)}
.pg-r .pg-n small{margin-left:8px;font:600 14px var(--sans);color:var(--mute)}
.pg-r .pg-n em{margin-left:8px;font:700 12.5px var(--sans);color:var(--red);font-style:normal}
.pg-r .pg-d{margin:3px 0 0;font-family:var(--sans);font-size:14.5px;line-height:1.5;color:var(--ink-2);max-width:40em}
.pg-du{font:600 15px/1.3 var(--sans);white-space:nowrap}
.pg-r .pg-p{font:800 18px/1.2 var(--sans);text-align:right;white-space:nowrap}
.pg-r .pg-p small{display:block;margin-top:3px;font:600 13px/1.2 var(--sans);color:var(--mute)}
.pg-b .pg-f{margin-top:10px;text-align:left}
@media (max-width:640px){
  .pg-bh{flex-wrap:wrap}.pg-bh .pg-more{width:100%;padding-left:80px}
  .pg-nav{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;margin-inline:-10px;padding:2px 10px 6px}
  .pg-nav::-webkit-scrollbar{display:none}.pg-nav a{flex:none}
  .pg-r{grid-template-columns:auto auto minmax(0,1fr);gap:4px 10px}
  .pg-r .pg-n span{font-size:17px}.pg-du{font-size:13.5px;color:var(--mute)}
}
.pg-cols{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(32px,4vw,60px);align-items:start}
.pg-ico{display:block;width:96px;height:60px;margin:0 auto 12px}
.pg-b:hover .pg-ico{animation:pg-wiggle .9s ease-in-out}
@keyframes pg-wiggle{30%{transform:rotate(-6deg) translateY(-2px)}65%{transform:rotate(5deg)}}
.calm .pg-b:hover .pg-ico{animation:none}
.pg-gt{display:flex;align-items:center;gap:12px;margin:0 0 26px;font:800 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--red);white-space:nowrap}
.pg-gt::before,.pg-gt::after{content:"";flex:1;height:1px;background:rgba(179,18,46,.25)}
.pg-b{margin:0 0 clamp(30px,3.5vw,42px);scroll-margin-top:110px}
.pg-b h2{font:italic 400 clamp(26px,2.4vw,32px)/1.05 var(--serif);text-align:center}
.pg-s{margin-top:6px;text-align:center;font-size:13.5px;color:var(--mute)}
.pg-list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.pg-l{display:flex;align-items:baseline;gap:8px}
.pg-n{font:500 15.5px/1.35 var(--serif)}
.pg-n small,.pg-n em{font:400 13.5px var(--sans);color:var(--mute);font-style:normal}
.pg-n em{color:var(--red)}
.pg-dots{flex:1;min-width:18px;border-bottom:1.5px dotted rgba(27,17,21,.28);transform:translateY(-4px)}
.pg-p{font:500 16.5px/1.2 var(--serif);white-space:nowrap}
.pg-d{margin-top:2px;font-size:13px;line-height:1.5;color:var(--mute);max-width:36em}
.pg-f{margin-top:12px;text-align:center;font:italic 400 13px/1.5 var(--serif);color:var(--mute)}
.pg-more{display:flex;justify-content:center;margin-top:14px}
.pg-more a{display:inline-flex;align-items:center;gap:10px;font:800 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.pg-end{margin-top:clamp(20px,3vw,36px)}
.pg-end p{font:italic 400 clamp(19px,1.8vw,23px)/1.35 var(--serif);max-width:28em}
@media (max-width:1000px){.pg-cols{grid-template-columns:minmax(0,560px);justify-content:center}}
@media (max-width:560px){.pg{padding:44px 24px}.pg::before{inset:8px}.pg::after{inset:12px}}

/* ---------- Rigadin ---------- */
.about .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(40px,7vw,110px);align-items:center}
/* la loge : un mur tendu de rayures bordeaux, un miroir en arche doré, une coiffeuse ; les ampoules s'allument une à une */
@property --lit{syntax:"<number>";inherits:true;initial-value:1}
.loge{--pad:clamp(24px,4.2vw,46px);--lit:1;position:relative;isolation:isolate;justify-self:center;overflow:hidden;
  width:min(100%,520px,calc((100svh - 230px) * .8 + 96px));padding:clamp(26px,3.6vw,42px) var(--pad) 0;border-radius:28px;
  background:
    radial-gradient(75% 55% at 50% 40%,rgba(255,178,96,calc(var(--lit) * .3)),rgba(255,178,96,0) 72%),
    repeating-linear-gradient(90deg,rgba(255,236,220,.045) 0 21px,rgba(0,0,0,.14) 21px 22px,rgba(255,236,220,0) 22px 44px),
    linear-gradient(#53182a,#3a101d 62%,#2b0b15);
  box-shadow:0 44px 70px -46px rgba(27,17,21,.7);transition:--lit .7s ease}
.loge::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:#0d0305;opacity:calc((1 - var(--lit)) * .55)}
.frame{position:relative}
.mirror{position:relative;aspect-ratio:4/5;padding:16px;border-radius:50% 50% 12px 12px/40% 40% 12px 12px;
  background:linear-gradient(145deg,#f3dca0 0%,#c79a4c 17%,#8d6428 36%,#e8c77e 54%,#a87a34 71%,#f0d69a 87%,#8a6127 100%);
  box-shadow:inset 0 0 0 1.5px rgba(255,244,210,.85),inset 0 0 0 4.5px rgba(110,74,28,.5),inset 0 0 0 6px rgba(255,236,190,.45),0 26px 40px -22px rgba(0,0,0,.75)}
.mirror-ph{position:relative;isolation:isolate;height:100%;overflow:hidden;border-radius:50% 50% 6px 6px/39.3% 39.3% 6px 6px;
  background:var(--img-loge) 50% 0/cover;box-shadow:0 0 0 2px #5e3f16}
.mirror-ph::after{content:"";position:absolute;inset:0;z-index:1;background:#170c0a;opacity:calc(.88 - var(--lit) * .88)}
.mirror-ph::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(115% 85% at 50% 42%,rgba(0,0,0,0) 58%,rgba(44,26,12,.42) 100%),
    linear-gradient(118deg,rgba(255,255,255,0) 20%,rgba(255,255,255,.13) 29%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 57%,rgba(255,255,255,.07) 62%,rgba(255,255,255,0) 67%)}
.sheen{position:absolute;inset:-10% -60%;z-index:3;pointer-events:none;opacity:0;transform:translateX(-70%);
  background:linear-gradient(100deg,rgba(255,255,255,0) 42%,rgba(255,246,226,.42) 50%,rgba(255,255,255,0) 58%)}
.motion .loge.lit .sheen{animation:sheen 1.5s .15s cubic-bezier(.3,.1,.3,1) both}
@keyframes sheen{from{opacity:1;transform:translateX(-70%)}to{opacity:1;transform:translateX(70%)}}
/* ampoules : culot doré, verre laiteux éteint, cœur blanc et halo chaud allumé */
.bulbs{position:absolute;inset:8px;z-index:3;pointer-events:none}
.bulbs i{position:absolute;width:clamp(15px,5.4%,23px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);
  background:radial-gradient(circle,#2a1d10 0 55%,#b38a45 60%,#f1d596 71%,#8a6127 87%,#5a3d15 100%);box-shadow:0 2px 3px rgba(0,0,0,.45)}
.bulbs i::before{content:"";position:absolute;inset:15%;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.55) 0 9%,rgba(255,255,255,0) 24%),radial-gradient(circle at 50% 58%,#a89a84,#7c6f5b 70%,#51473a)}
.bulbs i.on::before{background:radial-gradient(circle at 35% 30%,#fff 0 10%,rgba(255,255,255,0) 26%),radial-gradient(circle at 50% 55%,#fffdf6 0 32%,#ffefc6 56%,#ffcf7a 84%,#f2a94a);
  box-shadow:0 0 5px 1px rgba(255,238,196,.95),0 0 14px 4px rgba(255,196,110,.5)}
.bulbs i::after{content:"";position:absolute;left:50%;top:50%;width:520%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);opacity:0;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(255,210,140,.4),rgba(255,190,110,.13) 34%,rgba(255,190,110,0) 66%)}
.bulbs i.on::after{opacity:1}
.motion .bulbs i.on::before,.motion .bulbs i.on::after{animation:flick .6s linear both}
@keyframes flick{0%{opacity:.1}9%{opacity:1}17%{opacity:.2}27%{opacity:.95}38%{opacity:.45}52%,100%{opacity:1}}
/* la coiffeuse : plateau en bois éclairé par le miroir, baguette et balles en mousse */
.vanity{position:relative;z-index:1;height:clamp(54px,7vw,70px);margin:0 calc(-1 * var(--pad))}
.vanity::before{content:"";position:absolute;inset:0 0 56% 0;
  background:radial-gradient(46% 160% at 50% 0%,rgba(255,206,140,calc(var(--lit) * .5)),rgba(255,206,140,0) 72%),linear-gradient(#4f2c1a,#7c4a2c);box-shadow:inset 0 7px 8px -5px rgba(0,0,0,.55)}
.vanity::after{content:"";position:absolute;inset:44% 0 0 0;background:linear-gradient(#472616,#2a160c);box-shadow:inset 0 1px 0 rgba(255,214,160,.4)}
.props{position:absolute;z-index:1;left:7%;bottom:26%;width:47%;overflow:visible;transform:scaleX(-1)}
.loge-hat{display:none;position:absolute;z-index:1;right:4%;bottom:49%;width:28%}
.no3d .loge-hat{display:block}
.about .txt{display:grid;gap:24px}
/* le logo de Rigadin : sobre par défaut (R, chapeau, ruban) ; il devient festif (ballon, accents, étoiles) quand la loge s'allume */
.mono{display:block;height:auto;overflow:visible}
.mono .m-hat,.mono .m-fete>*{transform-box:fill-box}
.mono .m-hat{transform-origin:20% 95%}
.mono .m-star{transform-origin:50% 50%}
.mono .m-balloon,.mono .m-accent{transform-origin:0 100%}   /* le ballon sort du R, gonflé depuis le bout de sa ficelle */
.mono .m-swash{transform-origin:0 10%}
.about .mono-wrap{justify-self:start;margin-bottom:-4px}
.about .mono{width:clamp(104px,9vw,134px);color:var(--ink)}
@keyframes m-twinkle{from{opacity:0;transform:scale(.2) rotate(-60deg)}60%{opacity:1;transform:scale(1.3) rotate(8deg)}to{opacity:1;transform:none}}
@keyframes m-inflate{from{opacity:0;transform:scale(.06) rotate(-30deg)}35%{opacity:1}to{opacity:1;transform:none}}
@keyframes m-float{from{opacity:1;transform:none}to{opacity:1;transform:rotate(-3deg) translate(4px,-10px)}}
@keyframes m-swoosh{from{opacity:0;transform:scale(.1) rotate(25deg)}to{opacity:1;transform:none}}
@keyframes m-tip{0%,100%{transform:none}30%,62%{transform:translate(10px,-90px) rotate(15deg)}}
footer.site .mono{width:92px;color:var(--card);margin-bottom:16px}
.about h2{font-size:clamp(40px,5.2vw,76px);line-height:1}
.about h2 em{color:var(--red)}
.about .lead{font-size:18px;color:var(--ink-2);max-width:34em}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,34px);border-top:1px solid var(--line);padding-top:24px}
.facts>div{display:grid;gap:8px;align-content:start}
/* les trois colonnes partagent les mêmes lignes : chiffres, titres et textes restent alignés (le 7 de Bodoni descend sous la ligne) */
@media (min-width:561px){.facts{grid-template-rows:auto auto}.facts>div{grid-row:span 2;grid-template-rows:subgrid;row-gap:8px}.fn{align-self:end}}
.fn{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px}
.fn small{flex-basis:100%;font:700 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}
.fn span{font:400 clamp(56px,5.4vw,78px)/.9 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.fn i{font:italic 400 clamp(19px,1.7vw,24px)/1 var(--serif);color:var(--red)}
.facts b{font:italic 400 clamp(19px,1.6vw,22px)/1.15 var(--serif)}
.facts .fd{margin:0;font-size:14px;color:var(--ink-2);line-height:1.5}
.vivre{margin-top:clamp(44px,5.5vw,76px);padding-top:32px;border-top:1px solid var(--line);display:grid;gap:22px}
.vivre ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;counter-reset:v}
.vivre li{counter-increment:v;display:grid;gap:10px;align-content:start;font:italic 400 clamp(18px,1.55vw,22px)/1.25 var(--serif)}
.vivre li::before{content:counter(v,upper-roman);font:800 12.5px/1 var(--sans);letter-spacing:.14em;color:var(--red)}
@media (max-width:900px){.about .grid{grid-template-columns:1fr}.loge{width:min(100%,440px)}.vivre ol{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.facts{grid-template-columns:1fr;gap:20px}.facts>div{grid-template-columns:88px 1fr;column-gap:16px;row-gap:4px}.fn{grid-row:span 2;align-self:start}.fn small{margin-bottom:4px}}

/* ---------- Les chapeaux de Rigadin : une patère au mur, trois chapeaux ; celui qu'on choisit s'envole se poser sur la photo ---------- */
.chapeaux{position:relative;color:var(--ink);border-radius:40px;margin-inline:clamp(8px,1.5vw,20px);overflow:clip;
  background:radial-gradient(85% 70% at 70% 42%,rgba(255,251,244,.95),rgba(255,251,244,0) 64%),
    repeating-linear-gradient(90deg,rgba(120,80,40,.05) 0 1px,transparent 1px 36px,rgba(255,255,255,.28) 36px 37px,transparent 37px 72px),#ECE0CE}
/* le mur prend la couleur du chapeau choisi : cuivre et engrenages, bleu marine et vagues, rose et bulles */
.hc-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hc-bg i{position:absolute;inset:0;opacity:0;transition:opacity 1.3s ease;-webkit-mask-image:linear-gradient(90deg,transparent 40%,#000 74%);mask-image:linear-gradient(90deg,transparent 40%,#000 74%)}
@media (max-width:899px){.hc-bg i{-webkit-mask-image:linear-gradient(180deg,transparent 42%,#000 70%);mask-image:linear-gradient(180deg,transparent 42%,#000 70%)}}
.hc-bg i:nth-child(1){background:radial-gradient(55% 70% at 72% 46%,rgba(205,140,62,.28),rgba(205,140,62,0) 72%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280'%3E%3Cg fill='none' stroke='%237a4f22' stroke-opacity='.08' stroke-width='1.6'%3E%3Ccircle cx='72' cy='82' r='34'/%3E%3Ccircle cx='72' cy='82' r='12'/%3E%3Cpath d='M72 40v-10M72 124v10M30 82H20M114 82h10M42 52l-7-7M102 112l7 7M102 52l7-7M42 112l-7 7'/%3E%3Ccircle cx='200' cy='198' r='22'/%3E%3Ccircle cx='200' cy='198' r='7'/%3E%3Cpath d='M200 170v-7M200 226v7M172 198h-7M228 198h7M180 178l-5-5M220 218l5 5M220 178l5-5M180 218l-5 5'/%3E%3C/g%3E%3C/svg%3E") 0 0/280px 280px,linear-gradient(rgba(170,105,40,.045),rgba(170,105,40,.045))}
.hc-bg i:nth-child(2){background:radial-gradient(55% 70% at 72% 46%,rgba(70,120,175,.24),rgba(70,120,175,0) 72%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='70'%3E%3Cpath d='M0 35c25-16 50-16 75 0s50 16 75 0 38-12 50-6' fill='none' stroke='%23284a6e' stroke-opacity='.08' stroke-width='1.6'/%3E%3C/svg%3E") 0 0/200px 70px,linear-gradient(rgba(40,85,135,.055),rgba(40,85,135,.055))}
.hc-bg i:nth-child(3){background:radial-gradient(55% 70% at 72% 46%,rgba(235,120,160,.24),rgba(235,120,160,0) 72%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cg fill='none' stroke='%23b3122e' stroke-opacity='.07' stroke-width='1.5'%3E%3Ccircle cx='54' cy='62' r='28'/%3E%3Ccircle cx='172' cy='40' r='13'/%3E%3Ccircle cx='160' cy='160' r='36'/%3E%3Ccircle cx='42' cy='186' r='10'/%3E%3C/g%3E%3C/svg%3E") 0 0/240px 240px,linear-gradient(rgba(215,70,115,.04),rgba(215,70,115,.04))}
.chapeaux[data-hat="0"] .hc-bg i:nth-child(1),.chapeaux[data-hat="1"] .hc-bg i:nth-child(2),.chapeaux[data-hat="2"] .hc-bg i:nth-child(3){opacity:1}
.chapeaux>.wrap{position:relative;z-index:1}
.hc-grid{display:grid;gap:clamp(36px,5vw,72px) clamp(40px,6vw,96px);align-items:center}
.hc-left{display:grid;gap:18px;justify-items:start}
.hc-left h2{font-size:clamp(40px,5vw,72px);line-height:1}
.hc-left h2 em{color:var(--red)}
.hc-left .lead{margin:0;font-size:18px;line-height:1.6;color:var(--ink-2);max-width:30em}
/* la patère : planche de noyer vissée au mur, crochets de laiton */
.rack{position:relative;width:100%;max-width:640px;height:clamp(150px,13vw,172px);margin-top:14px}
.plank{position:absolute;left:0;right:0;top:0;height:36px;border-radius:8px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='40' preserveAspectRatio='none'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.004 .3' numOctaves='3' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .16  0 0 0 0 .08  0 0 0 0 .03  0 0 0 .32 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)'/%3E%3C/svg%3E") 0 0/100% 100%,linear-gradient(180deg,rgba(255,225,190,.1),rgba(0,0,0,.1)),#724A2F;
  box-shadow:0 14px 20px -16px rgba(40,20,8,.42),0 2px 3px rgba(40,20,8,.18)}
.plank::before,.plank::after{content:"";position:absolute;top:50%;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;
  background:linear-gradient(135deg,transparent 44%,rgba(70,45,15,.55) 45% 55%,transparent 56%),#B08A4A}
.plank::before{left:16px}.plank::after{right:16px}
.peg{position:absolute;top:20px;bottom:0;width:26%;margin-left:-13%;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.peg0{position:absolute;top:20px;bottom:0;left:9%;width:18%;margin-left:-9%;pointer-events:none}
.peg0 .hook{margin-left:-13px}
.peg0 .peg-hat{top:30px;width:86%}
.peg[data-hat="0"]{left:36%;--ac:#A8733F}.peg[data-hat="1"]{left:63%;--ac:#7E1A16}.peg[data-hat="2"]{left:89%;--ac:var(--red)}
.peg::before,.peg0::before{content:"";position:absolute;left:55%;top:46px;width:70%;height:78px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(60,35,15,.1),rgba(60,35,15,0));pointer-events:none}
.peg::before,.peg0::before{transition:opacity .5s}
.chapeaux:not(.worn) .peg0::before{opacity:0}
.chapeaux.worn .peg[aria-pressed="true"]::before{opacity:0}
.hook{position:absolute;left:50%;top:10px;width:26px;margin-left:-13px;filter:drop-shadow(0 2px 1.5px rgba(60,35,10,.28))}
.peg-ghost{position:absolute;left:50%;top:33px;width:92%;transform:translate(-50%,calc(var(--gt) * -1%));fill:rgba(27,17,21,.035);stroke:rgba(27,17,21,.28);stroke-width:1.5;stroke-dasharray:5 5;opacity:0;transition:opacity .5s;pointer-events:none}
.peg-ghost *{vector-effect:non-scaling-stroke}
.chapeaux.worn .peg[aria-pressed="true"] .peg-ghost{opacity:1;transition-delay:.45s}
.no3d .peg-ghost{display:none}
.peg-hat{display:none;position:absolute;left:50%;top:30px;width:78%;max-width:132px;transform:translateX(-50%);transition:transform .4s}
.no3d .peg-hat{display:block}
.no3d .peg[aria-pressed="true"] .peg-hat{transform:translate(-50%,10px) scale(1.08)}
.peg-t{position:absolute;left:0;right:0;bottom:0;display:grid;gap:5px;justify-items:center}
.peg-t b{font:800 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);transition:color .3s}
.peg-t small{font:italic 400 15px/1 var(--serif);color:var(--mute);font-variation-settings:"opsz" 24}
.peg .peg-t small::before{content:"pour "}
.peg-t::after{content:"";width:30px;height:2px;margin-top:3px;background:var(--ac);transform:scaleX(0);transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.peg:hover .peg-t b,.peg[aria-pressed="true"] .peg-t b{color:var(--ink)}
.peg[aria-pressed="true"] .peg-t::after{transform:scaleX(1)}
.peg:focus-visible{outline:none}
.peg:focus-visible .peg-t b{outline:2px solid var(--red);outline-offset:5px;border-radius:2px}
.hc-hint{margin:0;font:600 13px/1.4 var(--sans);color:var(--mute)}
.hc-hint .tc{display:none}
@media (hover:none){.hc-hint .hv{display:none}.hc-hint .tc{display:inline}}
@media (max-width:560px){.peg{width:27%;margin-left:-13.5%}.peg-t small{display:none}.peg-t b{font-size:11px;letter-spacing:.14em}}
/* la carte : la photo du style choisi */
.hc-card{--ac:#A8733F;justify-self:center;width:min(100%,400px,calc((100svh - 360px) / 1.2));min-width:min(100%,300px);background:var(--card);border-radius:26px;padding:14px;
  box-shadow:0 44px 80px -44px rgba(40,20,8,.6),0 0 0 1px rgba(27,17,21,.06)}
.hc-card[data-hat="1"]{--ac:#7E1A16}.hc-card[data-hat="2"]{--ac:var(--red)}
.hc-ph{position:relative;aspect-ratio:5/6;border-radius:16px;overflow:hidden;background:#2a1d16}
.hc-ph .ph{position:absolute;inset:0;background:var(--bg) 50% 28%/cover;opacity:0;transform:scale(1.07);transition:opacity .8s ease,transform 1.7s cubic-bezier(.2,.7,.2,1)}
.hc-ph .ph.on{opacity:1;transform:none}
.hc-ph::after{content:"";position:absolute;z-index:1;inset:11px;border-radius:9px;border:1px solid rgba(255,240,210,.55);pointer-events:none}
.hc-txt{display:grid;padding:22px 12px 0}
.hc-txt .t{grid-area:1/1;pointer-events:none}
.hc-txt .t.on{pointer-events:auto}
.hc-txt .t>*{opacity:0;transform:translateY(-6px);transition:opacity .28s,transform .35s}
.hc-txt .t.on>*{opacity:1;transform:none;transition:opacity .6s .22s,transform .8s .22s cubic-bezier(.2,.8,.2,1)}
.hc-txt .t.on>:nth-child(2){transition-delay:.3s}.hc-txt .t.on>:nth-child(3){transition-delay:.38s}
.hc-txt .t:not(.on)>*{transform:translateY(-6px)}
.hc-txt .k{margin:0;font:800 12.5px/1 var(--sans);letter-spacing:.17em;text-transform:uppercase;color:var(--ac)}
.hc-txt h3{margin:10px 0 0;font:italic 400 clamp(28px,2.5vw,36px)/1.05 var(--serif)}
.hc-txt .t>p:last-child{margin:10px 0 0;font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.hc-wink{grid-column:1/-1;margin:0;padding-top:28px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between}
.hc-wink span{font:italic 400 clamp(19px,1.8vw,24px)/1.3 var(--serif);font-variation-settings:"opsz" 24}
.calm .hc-ph .ph,.calm .hc-txt .t>*,.calm .peg-t::after,.calm .hc-bg i{transition:none}
@media (min-width:900px){.hc-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}}

/* ---------- Avis : sur le fond crème, un avis à la fois, de petites cartes pour passer de l'un à l'autre ---------- */
.pp .avis,.avis{padding-block:clamp(72px,9vw,128px)}
.av-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(32px,6vw,96px);align-items:start}
.avis h2{font-size:clamp(36px,4.2vw,60px);line-height:1.02;margin-top:14px}
.avis h2 em{color:var(--red);font-weight:400}
.quote{margin:clamp(30px,3.4vw,44px) 0 0;min-height:clamp(190px,17vw,230px);display:grid;align-content:start;gap:18px;transition:opacity .3s,filter .3s}
.quote.swap{opacity:0;filter:blur(8px)}
.quote p{margin:0;font:italic 400 clamp(20px,2vw,27px)/1.38 var(--serif);text-wrap:pretty}
.quote.long p{font-size:clamp(17px,1.55vw,21px);line-height:1.45}
.quote footer{display:flex;flex-wrap:wrap;gap:6px 16px;font:800 12.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.quote footer b{color:var(--ink)}
.fan{--cw:clamp(42px,3.8vw,54px);display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.fan-c{position:relative;flex:none;width:var(--cw);height:calc(var(--cw)*1.4);padding:0;border:0;background:none;cursor:pointer;perspective:700px;
  transform:translateY(var(--lift,0px));transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.fan-c:hover,.fan-c:focus-visible{--lift:-6px}
.fan-c[aria-pressed="true"]{--lift:-10px}
.c-in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,1.35,.4,1)}
.fan-c[aria-pressed="true"] .c-in{transform:rotateY(180deg)}
.c-back,.c-face{position:absolute;inset:0;border-radius:6px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 10px 16px -10px rgba(27,17,21,.45)}
.c-back{background:repeating-linear-gradient(45deg,rgba(255,215,195,.13) 0 1.5px,transparent 1.5px 7px),repeating-linear-gradient(-45deg,rgba(255,215,195,.13) 0 1.5px,transparent 1.5px 7px),#9E1028;border:3px solid var(--card)}
.c-back::after{content:"";position:absolute;left:50%;top:50%;width:66%;aspect-ratio:.8;transform:translate(-50%,-50%);border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%2274 0 697 676%22 fill=%22%23FBF6EE%22%3E%3Cg class=%22m-r%22 fill-rule=%22evenodd%22%3E%3Cpath d=%22M 155.000 654.142 L 155.000 646.283 165.750 645.700 C 171.662 645.379 178.570 644.457 181.099 643.651 C 198.245 638.190 211.930 624.309 216.167 608.081 C 217.755 601.999 217.889 589.507 217.942 443.246 L 218.000 284.992 226.250 278.867 C 246.500 263.833 284.731 240.555 316.254 224.065 L 332.000 215.828 332.017 406.664 C 332.036 616.579 331.693 604.769 338.168 618.000 C 341.943 625.711 351.145 635.261 358.675 639.281 C 365.829 643.100 377.909 646.000 386.660 646.000 L 394.000 646.000 394.000 654.000 L 394.000 662.000 274.500 662.000 L 155.000 662.000 155.000 654.142 Z M 638.000 661.639 C 576.892 654.495 525.181 621.900 487.331 566.668 C 476.936 551.500 472.442 543.915 450.201 504.012 C 423.547 456.191 412.177 440.616 395.673 429.319 C 382.095 420.024 370.160 415.859 353.750 414.687 L 345.000 414.063 345.000 407.999 L 345.000 401.273 362.250 400.737 C 377.060 400.278 381.126 399.780 391.000 397.218 C 423.404 388.811 448.073 371.074 463.107 345.375 C 475.881 323.538 481.854 297.671 480.735 269.025 C 479.661 241.515 472.266 220.532 458.120 204.859 C 430.211 173.937 382.515 177.121 304.000 215.146 C 255.179 238.790 216.964 264.112 189.691 290.888 C 167.904 312.279 159.978 326.923 159.360 346.931 C 159.182 352.669 158.691 357.695 158.269 358.101 C 155.225 361.022 129.500 361.913 119.087 359.459 C 90.873 352.808 80.001 326.433 94.981 300.978 C 116.707 264.058 200.916 213.820 289.134 185.148 C 383.908 154.346 466.083 151.631 520.750 177.497 C 554.979 193.692 578.576 223.475 584.047 257.389 C 585.987 269.415 584.814 291.357 581.588 303.384 C 571.317 341.676 540.471 372.528 493.500 391.487 C 473.811 399.434 440.679 406.965 425.178 407.015 C 422.605 407.024 419.825 407.467 419.000 408.000 C 417.873 408.656 418.371 408.878 421.000 408.891 C 435.229 408.962 461.210 415.634 480.500 424.171 C 506.215 435.551 525.970 451.360 542.304 473.629 C 553.656 489.107 557.228 495.041 582.831 540.974 C 594.992 562.791 607.929 584.937 611.581 590.187 C 628.970 615.185 648.365 631.041 669.500 637.537 C 679.635 640.651 695.820 641.066 705.500 638.459 C 722.455 633.893 735.006 622.992 737.527 610.641 C 738.692 604.937 736.399 598.913 730.914 593.262 C 725.226 587.402 724.901 585.551 728.923 581.924 C 733.834 577.497 741.402 578.512 748.335 584.527 C 755.145 590.435 756.500 593.754 756.500 604.532 C 756.500 613.612 756.350 614.273 752.820 620.759 C 742.323 640.045 720.051 653.949 690.000 659.976 C 682.618 661.457 646.359 662.616 638.000 661.639 Z%22/%3E%3C/g%3E%3Cg class=%22m-hat%22%3E%3Cpath d=%22M 173.978 212.750 C 159.931 183.748 137.212 156.793 112.239 139.500 C 97.289 129.148 96.764 126.212 107.809 114.724 C 147.592 73.346 230.178 33.339 308.586 17.463 C 321.996 14.748 343.094 14.065 350.453 16.109 C 356.451 17.774 360.690 22.577 361.441 28.560 C 362.530 37.233 368.079 60.094 372.229 73.000 C 378.365 92.083 383.787 105.501 394.988 129.329 C 400.619 141.307 405.063 151.229 404.863 151.378 C 404.664 151.527 399.100 152.205 392.500 152.885 C 324.650 159.873 249.863 184.683 186.000 221.389 C 183.525 222.812 181.034 223.981 180.464 223.988 C 179.894 223.995 176.975 218.938 173.978 212.750 Z%22/%3E%3Cpath class=%22m-band%22 fill=%22%23B2122E%22 d=%22M 174.228 213.488 C 171.353 207.706 169.004 202.419 169.008 201.738 C 169.012 201.057 170.025 199.993 171.258 199.373 C 172.491 198.753 183.625 193.046 196.000 186.691 C 236.505 165.890 270.404 152.210 316.824 137.932 C 342.448 130.051 382.791 120.000 388.803 120.000 C 390.195 120.000 392.408 123.772 397.931 135.556 C 401.940 144.112 405.059 151.233 404.860 151.381 C 404.662 151.528 399.100 152.205 392.500 152.885 C 324.650 159.873 249.863 184.683 186.000 221.389 C 183.525 222.812 181.040 223.981 180.478 223.988 C 179.916 223.995 177.103 219.270 174.228 213.488 Z%22/%3E%3C/g%3E%3C/svg%3E") 50% 52%/78% auto no-repeat,#9E1028}
.c-face{transform:rotateY(180deg);background:var(--card);border:1px solid var(--line);color:var(--ink);display:grid;place-items:center;font:500 calc(var(--cw)*.5)/1 var(--serif)}
.c-face.red{color:var(--red)}
.c-face small{display:none}
.fan{align-items:flex-start}
.fan-c::after{content:"";position:absolute;left:3px;right:3px;bottom:-9px;height:2px;border-radius:2px;background:var(--red);transform:scaleX(0);transform-origin:left;opacity:0}
.fan.run .fan-c[aria-pressed="true"]::after{opacity:1;animation:av-run var(--d,8s) linear forwards}
.fan.hold .fan-c[aria-pressed="true"]::after{animation-play-state:paused}
@keyframes av-run{to{transform:scaleX(1)}}
.fan-p{flex:none;align-self:center;width:34px;height:34px;margin-left:6px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:border-color .25s,color .25s}
.fan-p:hover,.fan-p:focus-visible{border-color:var(--red);color:var(--red)}
.fan-p svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:599px){.fan{--cw:min(38px,calc((100vw - 80px) / 9));gap:5px;flex-wrap:nowrap}.fan-p{width:32px;height:32px;margin-left:4px}}
.fan-p .i-play{display:none;fill:currentColor;stroke-width:1.4}
.fan-p.off .i-pause{display:none}.fan-p.off .i-play{display:block}
.refs{display:grid;gap:14px;align-content:start;margin-top:clamp(8px,4vw,64px);padding:clamp(22px,2.6vw,32px);border-radius:22px;background:var(--card);border:1px solid var(--line)}
.refs ul{list-style:none;margin:0;padding:0;display:grid}
.refs li{padding:11px 0;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.refs li:first-child{border-top:0;padding-top:4px}
/* la rangée des références : des noms posés comme des marques, tous à la même hauteur visuelle */
.trust{margin-top:clamp(56px,7vw,96px);padding-top:clamp(34px,4vw,48px);border-top:1px solid var(--line);display:grid;gap:clamp(22px,2.6vw,30px)}
.trust-t{margin:0;font:italic 400 clamp(22px,2.1vw,28px)/1.2 var(--serif);text-align:center}
.trust-g{display:grid;gap:14px;justify-items:center}
.marks{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px clamp(28px,4vw,56px)}
.marks li{font:500 clamp(17px,1.5vw,20px)/1.2 var(--serif);letter-spacing:.01em;color:rgba(27,17,21,.62)}
.marks img{display:block;height:var(--h,40px);width:auto;filter:grayscale(1) contrast(1.05);mix-blend-mode:multiply;opacity:.62;transition:opacity .25s,filter .25s}
.marks li:hover img{opacity:1;filter:none}
@media (max-width:899px){.av-grid{grid-template-columns:1fr}.quote{min-height:0}.refs{margin-top:0}.refs li{padding:8px 0;font-size:14px}}

/* ---------- Contact ---------- */
.contact .grid{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(40px,6vw,96px);align-items:start}
.info{display:grid;gap:28px;align-content:start}
.info .lead{color:var(--ink-2);font-size:17px;max-width:30em}
.contact h2{font-size:clamp(46px,6.6vw,100px);line-height:.94;letter-spacing:-.03em}
.contact h2 em{color:var(--red);font-weight:400}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:s}
.steps li{counter-increment:s;display:flex;gap:14px;align-items:baseline;font-size:15.5px}
.steps li::before{content:counter(s);flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:1px solid var(--line);font:italic 500 15px/1 var(--serif);color:var(--red);transform:translateY(-2px)}
.phone{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.phone .num{font:italic 500 clamp(32px,4vw,50px)/1 var(--serif)}
.copy-btn{background:none;border:1px solid var(--line);color:var(--ink);border-radius:999px;padding:10px 16px;font:800 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s}
.copy-btn:hover{background:var(--ink);color:var(--paper)}
.meta{display:grid;gap:6px;color:var(--ink-2);font-size:15px;font-style:normal}
.meta b{color:var(--ink);font-weight:700}
/* Le formulaire : court par défaut (nom, moyen de répondre, message) ; le reste s'ouvre si l'on choisit un événement */
.dv{display:grid;gap:22px;align-content:start;padding:clamp(26px,3.2vw,42px);border-radius:24px;background:var(--card);border:1px solid var(--line);box-shadow:0 40px 70px -46px rgba(27,17,21,.5)}
.dv .form-t{margin:0;font:italic 600 26px/1.1 var(--serif)}
.dv fieldset{border:0;margin:0;padding:0;min-width:0}
.dv label:not(.dv-evt):not(.dv-o):not(.dv-ok){display:grid;gap:8px;font:800 12px/1.2 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--mute)}
.dv label small{font:500 12px/1.3 var(--sans);letter-spacing:0;text-transform:none}
.dv input:not([type=radio]):not([type=checkbox]),.dv textarea{font:400 17px/1.4 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink);background:transparent;border:0;border-bottom:1px solid rgba(27,17,21,.25);padding:8px 0 11px;width:100%;border-radius:0;transition:border-color .3s}
.dv input::placeholder,.dv textarea::placeholder{color:rgba(27,17,21,.34)}
.dv input:focus,.dv textarea:focus{outline:none;border-bottom-color:var(--red)}
.dv input:focus-visible,.dv textarea:focus-visible{box-shadow:0 2px 0 var(--red)}
.dv [aria-invalid="true"]{border-bottom-color:var(--red)}
.dv textarea{min-height:110px;resize:vertical}
.dv-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.dv-grid .full{grid-column:1/-1}
.dv-hint{margin:-12px 0 0;font-size:13px;color:var(--mute)}
.dv-evt-f > legend,.dv-q > legend{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:0;margin-bottom:12px;font:800 12px/1.2 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--mute)}
.dv-evt-f small,.dv-q small,.dv-more-t small{font:500 12px/1.2 var(--sans);letter-spacing:0;text-transform:none;color:var(--mute)}
/* « C'est pour… » : des pastilles, une seule à la fois, qui se décoche d'un second clic */
.dv-chips{display:flex;flex-wrap:wrap;gap:8px}
/* la demande choisie reste seule, avec « Changer » */
.dv-evt-f.choisi .dv-evt:not(:has(input:checked)){display:none}
.dv-evt-f{position:relative}
.dv-change{display:inline-flex;align-items:center;margin:10px 0 0;padding:0;border:0;background:none;font:700 14px/1.2 var(--sans);color:var(--red);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dv-change[hidden]{display:none}
.dv-evt,.dv-o{position:relative;display:block;cursor:pointer;font:inherit;letter-spacing:0;text-transform:none;color:var(--ink)}
.dv-evt input,.dv-o input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.dv-c{display:inline-flex;align-items:center;gap:8px;padding:6px 15px 6px 9px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font:400 15px/1.2 var(--sans);transition:border-color .25s,background .25s,color .25s,transform .3s}
.dv-c svg{flex:none;width:34px;height:22px;transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.dv-evt:hover .dv-c svg{transform:scale(1.12) rotate(-4deg)}
.dv-evt:hover .dv-c{border-color:rgba(27,17,21,.3)}
.dv-evt input:checked + .dv-c{background:#fff;border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red),0 10px 18px -12px rgba(179,18,46,.5);font-weight:600}
.dv-evt input:focus-visible + .dv-c,.dv-o input:focus-visible + span{outline:2px solid var(--red);outline-offset:3px}
/* Le bloc facultatif */
.dv-more{display:grid;gap:20px;padding:20px;border-radius:18px;background:var(--paper)}
.dv-more.in{animation:dv-in .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes dv-in{from{opacity:0;transform:translateY(-6px)}}
.calm .dv-more.in{animation:none}
.dv-more-t{margin:0;font:italic 600 19px/1.2 var(--serif)}
.dv-qs{display:grid;gap:18px}
.dv-qs:empty{display:none}
.dv-opts{display:flex;flex-wrap:wrap;gap:8px}
.dv-o span{display:grid;gap:1px;padding:9px 34px 9px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line);transition:border-color .25s,background .25s}
.dv-opts.chips .dv-o span{border-radius:999px}
.dv-o span::after{content:"";position:absolute;right:12px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;border:1.5px solid rgba(27,17,21,.3);transition:background .2s,border-color .2s,box-shadow .2s}
.dv-o input[type=checkbox] + span::after{border-radius:4px}
.dv-o b{font:600 15px/1.3 var(--sans)}
.dv-o em{font:700 12.5px/1.3 var(--sans);font-style:normal;color:var(--red)}
.dv-o:hover span{border-color:rgba(27,17,21,.3)}
.dv-o input:checked + span{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.dv-o input:checked + span::after{background:var(--red);border-color:var(--red);box-shadow:inset 0 0 0 3px #fff}
.dv-o input[type=checkbox]:checked + span::after{box-shadow:none;background:var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.6 2.6L12 5.6' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.dv-more .dv-grid input:not([type=radio]):not([type=checkbox]){background:transparent}
/* Le résumé en une ligne, puis l'envoi */
.dv-sum{margin:-6px 0 0;padding:12px 16px;border-radius:14px;border:1px dashed rgba(27,17,21,.22);font:500 15px/1.5 var(--sans)}
.dv-sum span{display:block;font:800 11.5px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:3px}
.dv-ok{display:flex;align-items:flex-start;gap:12px;font:400 14px/1.5 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink-2);cursor:pointer}
.dv-ok input{flex:none;width:19px;height:19px;margin:2px 0 0;accent-color:var(--red)}
.dv-ok input[aria-invalid="true"]{outline:2px solid var(--red);outline-offset:2px}
.dv-ok a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.dv-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.dv [hidden]{display:none!important}
.form-err{margin:0;color:var(--red);font-size:14.5px}
.send{justify-self:start;display:inline-flex;align-items:center;gap:14px;padding:18px 28px;border-radius:999px;border:0;background:var(--red);color:var(--card);font:800 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;cursor:pointer;transition:transform .3s,background .3s,opacity .3s}
.send:hover{transform:translateY(-2px);background:var(--red-2)}
.send.wait{opacity:.6;pointer-events:none}
.sent{display:grid;align-content:start;gap:12px;padding:20px;border-radius:16px;background:var(--paper);font-size:15px}
.sent b{font:italic 600 21px/1.2 var(--serif)}
.sent .btn{justify-self:start}
.dv.done > :not(.form-t):not(.sent):not(script){display:none!important}
.form-note{margin:0;font-size:13px;color:var(--mute)}
.dv-next{display:grid;gap:8px;font-size:15px;color:var(--ink-2)}
.dv-next b{font:italic 600 19px/1.2 var(--serif);color:var(--ink)}
.dv-next ol{margin:0;padding-left:20px;display:grid;gap:4px}
@media (max-width:900px){.contact .grid{grid-template-columns:1fr}}
@media (max-width:560px){.dv-grid{grid-template-columns:1fr}.dv-more{padding:16px}}
@media (max-width:520px){form{grid-template-columns:1fr}}

/* ---------- Pied de page ---------- */
footer.site{position:relative;overflow:hidden;padding-top:72px;background:var(--ink);color:rgba(255,251,246,.66)}
footer.site .row{display:grid;grid-template-columns:1.3fr repeat(5,minmax(0,1fr));gap:30px 32px;font-size:14.5px}
footer.site .row > div{display:grid;gap:6px;align-content:start}
footer.site b{color:var(--card);font-weight:700}
footer.site a:hover{color:var(--card)}
footer.site .f-social{display:flex;gap:10px;margin-top:10px}
footer.site .f-social a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,251,246,.28);color:rgba(255,251,246,.85);transition:background .3s,border-color .3s,color .3s}
footer.site .f-social a:hover,footer.site .f-social a:focus-visible{background:var(--card);border-color:var(--card);color:var(--ink)}
footer.site .f-social svg{width:19px;height:19px;fill:currentColor}
footer.site nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.big{font:600 clamp(90px,24vw,380px)/.78 var(--serif);letter-spacing:-.05em;text-align:center;margin-top:48px;margin-bottom:-.14em;color:rgba(255,251,246,.08);user-select:none}
.big::before{content:attr(data-mot)}
.mockup{justify-self:start;display:inline-block;font:800 10px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;padding:7px 10px;border-radius:999px;background:var(--butter);color:var(--ink)}
footer.site .f-col{display:grid;gap:7px;align-content:start}
.f-credit{position:relative;z-index:1;margin-top:40px;margin-bottom:0;font-size:12.5px;color:rgba(255,251,246,.56)}
.f-credit a{color:rgba(255,251,246,.75);text-decoration:underline;text-underline-offset:3px}
footer.site .f-col b{margin-bottom:6px;font:800 12px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:rgba(255,251,246,.5)}
footer.site .f-col b span{margin-right:5px;color:var(--butter);letter-spacing:0}
footer.site .f-col a{color:rgba(255,251,246,.82)}
footer.site .f-col .mockup{margin-top:6px}
@media (max-width:980px){footer.site .row{grid-template-columns:1fr 1fr}footer.site .f-id{grid-column:1/-1}}
.callbar{display:none}
@media (max-width:760px){
  .callbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(246,240,232,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .callbar a{flex:1;text-align:center;padding:15px;border-radius:999px;font:800 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;border:1px solid rgba(27,17,21,.3)}
  .callbar a + a{background:var(--red);color:var(--card);border-color:var(--red)}
  footer.site{padding-bottom:84px}
}
@media (max-width:430px){.callbar a{padding:15px 8px;font-size:11px;letter-spacing:.1em}}

/* ---------- Apparitions au défilement (liées à la position, sans masquer le contenu si non pris en charge) ---------- */
@supports (animation-timeline: view()) {
  html.motion .rv-title{animation:rv-title auto linear both;animation-timeline:view();animation-range:entry 10% cover 32%}
  /* le fondu finit au moment où l'élément est entièrement à l'écran : rien ne reste pâle pendant qu'on le lit */
  html.motion .rv-up{animation:rv-up auto linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
  html.motion .rv-soft{animation:rv-soft auto linear both;animation-timeline:view();animation-range:entry 10% entry 100%}
  html.motion .rv-photo{animation:rv-photo auto linear both;animation-timeline:view();animation-range:entry 0% cover 42%}
  html.motion .rv-left{animation:rv-left auto linear both;animation-timeline:view();animation-range:entry 5% cover 38%}
  html.motion .rv-right{animation:rv-right auto linear both;animation-timeline:view();animation-range:entry 5% cover 38%}
  html.motion .rv-stagger > *{animation:rv-chip auto linear both;animation-timeline:view();animation-range:entry calc(20% + var(--i,0) * 8%) cover calc(30% + var(--i,0) * 4%)}
  html.calm :is(.rv-title,.rv-up,.rv-soft,.rv-photo,.rv-left,.rv-right,.rv-stagger > *){animation:rv-soft auto linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
}
.rv-stagger > :nth-child(2){--i:1}.rv-stagger > :nth-child(3){--i:2}.rv-stagger > :nth-child(4){--i:3}.rv-stagger > :nth-child(5){--i:4}
/* pendant un défilement demandé par un lien, ce qu'on survole est déjà en place */
html.glide :is(.rv-title,.rv-up,.rv-soft,.rv-photo,.rv-left,.rv-right,.rv-stagger > *){animation:none!important}
@keyframes rv-title{from{opacity:0;transform:translateY(.3em);clip-path:inset(-20% -10% 100% -10%)}to{opacity:1;transform:none;clip-path:inset(-20% -10% -20% -10%)}}
@keyframes rv-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes rv-soft{from{opacity:0}to{opacity:1}}
@keyframes rv-photo{from{opacity:.3;clip-path:inset(8% 6% 8% 6% round 28px);transform:scale(1.04)}to{opacity:1;clip-path:inset(0 round 28px);transform:none}}
@keyframes rv-left{from{opacity:0;transform:translateX(-40px) rotate(-2deg)}to{opacity:1;transform:none}}
@keyframes rv-right{from{opacity:0;transform:translateX(40px) rotate(2deg)}to{opacity:1;transform:none}}
@keyframes rv-chip{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
html.calm .wordmark span{animation:none}

/* Bodoni en grand : une taille optique intermédiaire épaissit un peu les traits fins.
   (en fin de fichier : la propriété « font » des titres la remettrait sinon à zéro) */
h1,h1 span,h2,h3,h4,.wordmark,.wordmark span,.big-line,.menu a,.big,.quote p,.act-lead,.show-word span,.pg-b h2,.u-text h3,.act h3,.pt h3,.cards h3,.moments b,.facts b,.fn span,.vivre li,.ticket h4,.passage .big-line,.contact h2,.pg-h h2,.show-intro h2{font-variation-settings:"opsz" 24!important}

/* ---------- Grand écran : l'éventail se déroule sous la barre, qui reste visible ---------- */
.menu-dim{display:none}
@media (min-width:1100px){
  .menu{inset:80px max(16px,calc((100% - 1320px) / 2)) auto;z-index:39;display:block;border-radius:0 0 28px 28px;box-shadow:0 40px 70px -34px rgba(27,17,21,.55);
    transform:translateY(-14px);transition:opacity .35s,visibility .35s,transform .45s cubic-bezier(.2,.8,.2,1)}
  body.menu-open .menu{transform:none}
  .menu-top,.menu-side{display:none}
  .menu-body{padding:clamp(18px,2.6vh,28px) clamp(20px,3vw,40px) clamp(22px,3vh,34px)}
  .menu-dim{display:block;position:fixed;inset:0;z-index:38;background:rgba(27,17,21,.3);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
  body.menu-open .menu-dim{opacity:1;visibility:visible}
  body.menu-open .nav{background:rgba(246,240,232,.97);box-shadow:none}
  /* une colonne par famille, des cartes couchées : on lit tout d'un coup d'œil */
  .menu .deck-t{display:none}
  .menu .deck{height:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 22px;max-width:1240px;margin:0 auto;width:100%}
  .menu .deck-g{position:static;pointer-events:auto}
  .menu .deck-gt{position:static;width:auto;margin:0 0 10px;transform:none;text-align:left;opacity:1}
  .menu .deck-g ul{display:grid;gap:8px}
  .menu .dcard{position:relative;left:auto;bottom:auto;width:auto;height:76px;display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;align-content:center;justify-items:start;text-align:left;
    gap:1px 12px;padding:10px 14px;transform:translateX(var(--nudge,0px));opacity:1;transition:transform .3s,box-shadow .3s,opacity .3s}
  .menu .dcard:hover,.menu .dcard:focus-visible{--nudge:4px}
  .menu .dcard svg{grid-row:1 / span 3;width:44px}
  .menu .dcard b{font-size:18px;line-height:1.1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .menu .dcard .dc-sub{font-size:11px}
  .menu .dcard small{font-size:9.5px}
  .menu .dc-s{display:none}
  .menu .dcard::after{content:"\2192";grid-column:3;grid-row:1 / span 3;color:var(--red)}
  .motion .menu .deck:not(.dealt) .dcard{opacity:0;transform:translateY(-8px)}
  .motion .menu .deck.dealt:not(.ready) .dcard{transition-delay:calc(var(--k) * 25ms)}
  .menu-else{max-width:1240px;margin:16px auto 0;padding-top:14px;border-top:1px solid var(--line)}
}
.menu-else{margin:18px 0 0;font:italic 400 18px/1.4 var(--serif);color:var(--ink-2)}
.menu-else .more{margin-left:8px;font-style:normal}

/* Bodoni en taille moyenne ou petite : une taille optique basse épaissit les traits fins, pour une lecture confortable
   (les grands titres gardent leur contraste). */
.p-keys b,.how-line b,.pr-c b,.tk-n b,.tk-p,.faq-list summary,.box h3,.dcard b,.pcard b,.mo-c b,.ac b,.at b,.lc-p b,.bb-h b,.gr-h,
.pg-n,.pg-p,.pg-b h2,.pg-b h3,.num-l h3,.num-p,.num-gp,.p-lien b,.fx-a li b,.pg-f,.pg-end p,.cards h3,.formats b,.refs .clients li,.menu-side a,.menu-else,.choix-else,.bl-note,.tk-f,.fx-foot p,
.pq p,.quote p,.dv-more-t,.dv-next b,.dv .form-t,.marks li,.trust-t,.sent b,form .form-t,.crumb b,.deck-t,.facts b,.fn span,.hc-txt h3,.peg-t b,.steps li::before,.how-line li::before,.pr-n,.at .num,
.p-sur,.tk-d,.sub,.act-lead,.p-hero-ph figcaption,.mo-c .n,.ol-c h3{font-variation-settings:"opsz" 9!important}
.p-keys b,.how-line b,.pr-c b,.tk-n b,.faq-list summary,.box h3,.dcard b,.pcard b,.mo-c b,.ac b,.at b,.lc-p b,.bb-h b,.gr-h,.pg-b h2,.cards h3,.menu-side a{font-weight:500!important}

/* la citation que Rigadin a choisie pour son site, sous le miroir, comme une plaque */
.loge-col{display:grid;justify-items:center}
.motto{margin:clamp(22px,2.6vw,32px) auto 0;max-width:430px;text-align:center}
.motto p{margin:0;font:italic 400 clamp(17px,1.4vw,19px)/1.45 var(--serif);font-variation-settings:"opsz" 9;color:var(--ink-2);text-wrap:balance}
.motto footer{margin-top:8px;font:700 11.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}

/* Les photos en vraies images (thème WordPress) : elles remplissent leur cadre comme les fonds de la maquette */
.act-photo .ph,.p-big{position:relative;overflow:hidden}
:is(.act-photo .ph,.p-big,.hc-ph .ph,.mirror-ph) > img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.p-big > img{object-position:50% 30%}.hc-ph .ph > img{object-position:50% 28%}.mirror-ph > img{object-position:50% 0;z-index:0}
:is(.ph,.p-big,.mirror-ph):has(> img){background-image:none}

/* ---------- Écrans tactiles : les effets qui coûtent cher à chaque image du défilement ----------
   Le grain fondu sur tout l'écran (mix-blend-mode) et les verres dépolis (backdrop-filter) obligent Safari
   à tout recomposer à chaque image, 3D comprise. Sur téléphone, le grain est quasi invisible : on l'enlève,
   et les deux barres deviennent pleines, de la même couleur. */
@media (pointer:coarse){
  .grain{display:none}
  .nav.scrolled{background:rgb(246,240,232);backdrop-filter:none;-webkit-backdrop-filter:none}
  .callbar{background:rgb(246,240,232);backdrop-filter:none;-webkit-backdrop-filter:none}
  .menu-top{background:rgb(246,240,232);backdrop-filter:none;-webkit-backdrop-filter:none}
  .bulbs i::after{mix-blend-mode:normal}   /* le halo des ampoules sans mode de fusion, moins coûteux à composer */
}

/* Au doigt, sur l'accueil : libre jusqu'à « Ce qu'il fait », un arrêt par acte, puis libre après les jeux (voir home.js).
   Suspendu pendant un trajet lancé par un lien (classe glide). */
@media (pointer:coarse){
  .js .show-track{position:relative}
  .act-snap{position:absolute;left:0;width:1px;height:1px;pointer-events:none;scroll-snap-align:start;scroll-snap-stop:always}
  .snap-libre{position:absolute;left:0;right:0;pointer-events:none;scroll-snap-align:start}
  html.snap-show:not(.glide){scroll-snap-type:y mandatory}
}