/* =========================================================
   DOMAINE DU TRUSQUIN — feuille de style principale
   Palette : encre / ivoire — typographie serif haute couture
   ========================================================= */

/* ---------- Tokens ---------- */
:root{
  --ink:#14161a;
  --ink-2:#3b3e44;
  --ink-3:#6d7076;
  --paper:#faf8f3;
  --paper-2:#f2eee6;
  --paper-3:#e8e3d8;
  --line:rgba(20,22,26,.13);
  --line-2:rgba(20,22,26,.28);
  --accent:#7c7663;           /* olive-taupe, très discret */
  --white:#fff;

  --serif:"Cormorant Garamond",Cormorant,Georgia,"Times New Roman",serif;
  --sans:"Jost","Helvetica Neue",Helvetica,Arial,sans-serif;

  --pad:clamp(1.25rem,5vw,5.5rem);
  --maxw:1320px;
  --rhythm:clamp(5rem,11vw,10rem);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:16px;font-weight:300;line-height:1.72;
  letter-spacing:.005em;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

/* ---------- Typographie ---------- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;margin:0;line-height:1.08;letter-spacing:.005em}
h1,h2,h3{text-wrap:balance}
.display{font-size:clamp(2.9rem,8.5vw,7.5rem);line-height:.96;letter-spacing:-.012em}
h1{font-size:clamp(2.4rem,6vw,4.9rem)}
h2{font-size:clamp(2rem,4.6vw,3.75rem)}
h3{font-size:clamp(1.45rem,2.4vw,2.1rem)}
p{margin:0 0 1.15em}
.lead{font-family:var(--serif);font-size:clamp(1.25rem,2.1vw,1.7rem);line-height:1.5;color:var(--ink-2);font-weight:300}

.eyebrow{
  font-family:var(--sans);font-size:.66rem;font-weight:400;
  letter-spacing:.34em;text-transform:uppercase;color:var(--ink-3);
  display:flex;align-items:center;gap:1rem;margin:0 0 1.6rem;
}
.eyebrow::before{content:"";width:2.2rem;height:1px;background:var(--line-2);flex:none}
.eyebrow.is-center{justify-content:center}
.eyebrow.is-center::after{content:"";width:2.2rem;height:1px;background:var(--line-2);flex:none}

.muted{color:var(--ink-3)}
.serif{font-family:var(--serif)}

/* ---------- Layout ---------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.wrap-narrow{max-width:820px;margin-inline:auto;padding-inline:var(--pad)}
section{padding-block:var(--rhythm)}
.rule{height:1px;background:var(--line);border:0;margin:0}
.center{text-align:center}
.grid{display:grid;gap:clamp(2rem,4vw,4rem)}
@media(min-width:820px){
  .g-2{grid-template-columns:repeat(2,1fr)}
  .g-3{grid-template-columns:repeat(3,1fr)}
  .g-split{grid-template-columns:.85fr 1.15fr;align-items:center}
  .g-split-rev{grid-template-columns:1.15fr .85fr;align-items:center}
}

/* ---------- Boutons ---------- */
.btn{
  --c:var(--ink);
  display:inline-flex;align-items:center;gap:.85rem;
  font-family:var(--sans);font-size:.7rem;font-weight:400;
  letter-spacing:.26em;text-transform:uppercase;
  padding:1.05rem 2.1rem;border:1px solid var(--c);color:var(--c);
  position:relative;overflow:hidden;transition:color .5s var(--ease);
  background:transparent;
}
.btn span{position:relative;z-index:1}
.btn::after{
  content:"";position:absolute;inset:0;background:var(--c);
  transform:translateY(101%);transition:transform .55s var(--ease);z-index:0;
}
.btn:hover::after{transform:translateY(0)}
.btn:hover{color:var(--paper)}
.btn.is-light{--c:#fff}
.btn.is-light:hover{color:var(--ink)}
.btn.is-solid{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.is-solid::after{background:var(--paper)}
.btn.is-solid:hover{color:var(--ink)}

.link-u{
  display:inline-flex;align-items:center;gap:.7rem;
  font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;
  padding-bottom:.45rem;border-bottom:1px solid var(--line-2);
  transition:border-color .4s var(--ease),gap .4s var(--ease);
}
.link-u:hover{border-color:currentColor;gap:1.1rem}
.link-u .arw{transition:transform .4s var(--ease)}
.link-u:hover .arw{transform:translateX(4px)}

/* ---------- Trusquin animé ---------- */
.tmark{display:block;color:currentColor}
/* overflow visible : le trusquin peut tourner sans être rogné */
.tmark svg{display:block;width:100%;height:auto;fill:currentColor;overflow:visible}
.tmark--spin svg{animation:spin 26s linear infinite;transform-origin:53.6% 46.5%}
@keyframes spin{to{transform:rotate(360deg)}}

/* séparateur : filet — trusquin — filet */
.divider{display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);justify-content:center;color:var(--ink)}
.divider::before,.divider::after{content:"";height:1px;flex:1;max-width:200px;background:var(--line-2)}
.divider .tmark{width:64px;flex:none;opacity:.85}

/* ---------- Écran de chargement ----------
   Fond encre et logo ivoire, à chaque ouverture de page. Toutes les pages
   commencent sur une image sombre : le voile se dissout donc dans le décor,
   sans rupture de couleur. */
.loader{
  position:fixed;inset:0;z-index:200;background:var(--ink);
  display:grid;place-items:center;
  transition:opacity .55s var(--ease),visibility .55s var(--ease);
}
.loader.is-off{opacity:0;visibility:hidden}
/* à la disparition du voile, le logo s'efface un peu avant lui, sans quoi il
   flotterait une fraction de seconde par-dessus le rideau qui s'ouvre */
.loader.is-off .loader__logo{opacity:0;transform:none;transition:opacity .3s var(--ease)}
/* au départ vers une autre page, le voile revient vite pour masquer la page
   en cours, puis le logo réapparaît : le fond noir et le logo restent alors
   à l'écran pendant toute la bascule vers la page suivante */
.loader.is-back{transition:opacity .3s var(--ease),visibility .3s var(--ease)}
.loader__logo{
  width:min(54vw,300px);
  opacity:0;transform:translateY(12px);
  transition:opacity .85s var(--ease),transform .85s var(--ease);
}
.loader.is-lit .loader__logo{opacity:1;transform:none}
.loader__logo img{width:100%;height:auto}
@media(prefers-reduced-motion:reduce){
  .loader{display:none}
  .hero__bg{clip-path:none;transition:none}
  .hero__logo,.hero__scroll{opacity:1;transform:none;transition:none}
}

/* ---------- En-tête ---------- */
.hdr{
  position:fixed;inset:0 0 auto;z-index:60;
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding:1.5rem var(--pad);color:#fff;
  transition:background .5s var(--ease),color .5s var(--ease),padding .5s var(--ease),box-shadow .5s var(--ease);
}
.hdr.is-solid{background:var(--paper);color:var(--ink);padding-block:.95rem;box-shadow:0 1px 0 var(--line)}
.hdr__brand{display:flex;align-items:center;gap:.9rem;flex:none}
.hdr__brand .tmark{width:40px}
.hdr__name{font-family:var(--serif);font-size:1.02rem;letter-spacing:.24em;text-transform:uppercase;line-height:1;white-space:nowrap}
.hdr__name small{display:block;font-size:.52rem;letter-spacing:.34em;opacity:.7;margin-bottom:.32rem;font-family:var(--sans)}

.nav{display:none;align-items:center;gap:clamp(1.4rem,2.6vw,2.6rem)}
@media(min-width:1080px){.nav{display:flex}}
.nav a{
  font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  position:relative;padding-block:.4rem;opacity:.9;
}
.nav a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:currentColor;transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--ease);
}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav a[aria-current="page"]{opacity:1}

.hdr__side{display:flex;align-items:center;gap:clamp(1rem,2vw,1.8rem);flex:none}
.hdr__ig{display:grid;place-items:center;padding:.35rem;opacity:.85;
  transition:opacity .35s var(--ease),transform .35s var(--ease)}
.hdr__ig:hover{opacity:1;transform:translateY(-1px)}
.hdr__ig .ico{width:1.32rem;height:1.32rem}
body.is-open .hdr__ig{opacity:0;pointer-events:none;transition:opacity .3s}

.burger{display:grid;gap:6px;padding:.6rem;margin-right:-.6rem}
@media(min-width:1080px){.burger{display:none}}
.burger i{display:block;width:26px;height:1px;background:currentColor;transition:transform .4s var(--ease),opacity .3s,background .3s}
/* menu ouvert : le fond passe en ivoire, la croix doit repasser en encre */
body.is-open .hdr{color:var(--ink)}
body.is-open .hdr__brand{opacity:0;pointer-events:none;transition:opacity .3s}
body.is-open .burger{padding:.7rem;margin-right:-.7rem}
body.is-open .burger i{background:var(--ink);width:30px;height:2px}
.is-open .burger i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.is-open .burger i:nth-child(2){opacity:0}
.is-open .burger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* menu plein écran */
.menu{
  position:fixed;inset:0;z-index:55;background:var(--paper);color:var(--ink);
  display:flex;flex-direction:column;justify-content:center;gap:.2rem;
  padding:6rem var(--pad) 3rem;
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease);
  overflow-y:auto;
}
.menu.is-open{clip-path:inset(0 0 0 0)}
.menu a{
  font-family:var(--serif);font-size:clamp(2rem,7vw,3.4rem);line-height:1.35;
  opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease),color .3s;
}
.menu.is-open a{opacity:1;transform:none}
.menu a:hover{color:var(--accent)}
.menu__meta{margin-top:2.5rem;color:var(--ink-3);display:grid;gap:.5rem}
.menu__meta a{
  font-family:var(--sans);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;
  line-height:1.8;opacity:0;transform:translateY(12px);word-break:break-word;
}
.menu.is-open .menu__meta a{opacity:1;transform:none}
.menu__meta a:hover{color:var(--ink)}

/* ---------- Hero ---------- */
.hero{position:relative;padding-block:0;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:#0b0c0e;isolation:isolate}
.hero__bg{
  position:absolute;inset:0;z-index:0;overflow:hidden;background:#0b0c0e;container-type:size;
  /* ouverture cinéma : l'image naît d'une fente au centre et s'ouvre vers
     le haut et le bas, comme un rideau de projection */
  clip-path:inset(50% 0 50% 0);will-change:clip-path;
  /* durée du rideau : c'est ici qu'on règle la lenteur de l'ouverture */
  transition:clip-path 2.8s cubic-bezier(.5,.04,.18,1);
}
.hero.is-revealed .hero__bg{clip-path:inset(0 0 0 0)}
/* pour rejouer l'ouverture, le rideau doit d'abord se refermer d'un seul coup,
   à l'abri du voile noir : sans quoi il repartirait de mi-course */
.hero.is-instant .hero__bg,
.hero.is-instant .hero__logo,
.hero.is-instant .hero__scroll{transition:none}

/* média de fond : fichier vidéo (cas normal) ou lecteur externe (secours),
   recadré en plein écran quelle que soit la taille de l'écran */
.hero__media{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:100%;height:100%;object-fit:cover;border:0;pointer-events:none;
  opacity:0;transition:opacity 1.4s var(--ease);
}
/* le film actif porte .is-on : c'est lui qui apparaît en fondu par-dessus
   celui qui s'achève */
.hero__media.is-on{opacity:1}
.hero.is-playing .hero__media--embed{opacity:1}

/* le lecteur externe garde un ratio 16/9 : on le recadre et on l'agrandit
   légèrement pour ne laisser apparaître aucun élément d'habillage */
.hero__media--embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hero__media--embed{
  width:100vw;height:56.25vw;min-height:100svh;min-width:177.78svh;
  object-fit:unset;transform:translate(-50%,-50%) scale(1.08);
}
@supports (width:100cqw){
  .hero__media--embed{width:100cqw;height:56.25cqw;min-width:177.78cqh;min-height:100cqh}
}

/* première image : tient la place, et reste seule si la lecture échoue */
.hero__poster{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:100%;height:100%;object-fit:cover;
}

/* voile : lisibilité du logo, et léger renforcement au défilement */
.hero__bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(105% 80% at 50% 46%,rgba(8,9,11,.10),rgba(8,9,11,.42) 62%,rgba(8,9,11,.66)),
    linear-gradient(180deg,rgba(8,9,11,.42),transparent 26%),
    linear-gradient(0deg,rgba(8,9,11,.34),transparent 22%);
  transition:opacity .9s var(--ease);
}
.hero.is-past .hero__bg::after{opacity:1}

.hero__inner{
  position:relative;z-index:2;text-align:center;color:#fff;
  padding:6rem var(--pad) 7rem;max-width:1000px;
}
.hero__logo{
  width:min(66vw,500px);margin:0 auto;color:#fff;
  filter:drop-shadow(0 2px 26px rgba(8,9,11,.55));
  opacity:0;transform:translateY(16px);
  transition:opacity 1.5s var(--ease) 1.2s,transform 1.5s var(--ease) 1.2s;
}
.hero.is-revealed .hero__logo{opacity:1;transform:none}
.hero__logo img{width:100%;height:auto}
.hero__tag{
  font-family:var(--serif);font-size:clamp(1.15rem,2.4vw,1.8rem);
  font-style:italic;font-weight:300;color:rgba(255,255,255,.88);
  margin:0 auto 2.4rem;max-width:30ch;text-wrap:balance;
  animation:heroIn 1.4s var(--ease) both .75s;
}
.hero__cta{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;
  animation:heroIn 1.4s var(--ease) both 1s}
@keyframes heroIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

.hero__scroll{
  /* centrage par la boîte, pas par transform : l'animation heroIn utilise
     transform et écraserait un translateX(-50%) */
  position:absolute;left:0;right:0;bottom:1.6rem;z-index:3;
  width:100%;padding:0;cursor:pointer;transition:color .4s var(--ease);
  color:rgba(255,255,255,.7);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;
  display:grid;justify-items:center;gap:.9rem;
  opacity:0;transition:opacity 1.2s var(--ease) 2.6s;
}
.hero.is-revealed .hero__scroll{opacity:1}
.hero__scroll:hover{color:#fff}
.hero__scroll i{display:block;margin-inline:auto;width:1px;height:38px;background:linear-gradient(rgba(255,255,255,.7),transparent);animation:drop 2.4s var(--ease) infinite}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* commande du son, discrète */
.hero__sound{
  position:absolute;z-index:3;right:var(--pad);bottom:2.4rem;
  color:rgba(255,255,255,.62);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:.7rem;padding:.6rem 0;
  border-bottom:1px solid rgba(255,255,255,.28);transition:color .4s var(--ease),border-color .4s var(--ease);
  animation:heroIn 1.2s var(--ease) both 1.4s;
}
.hero__sound:hover{color:#fff;border-color:#fff}
.hero__sound::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
@media(max-width:640px){.hero__sound{display:none}}

/* hero secondaire (pages intérieures) */
.phero{position:relative;padding-block:0;min-height:78svh;display:grid;place-items:end start;overflow:hidden;background:var(--ink);color:#fff}
.phero__img{position:absolute;inset:0}
.phero__img img{width:100%;height:100%;object-fit:cover;opacity:.72}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.15) 45%,rgba(0,0,0,.7))}
.phero__inner{position:relative;z-index:2;padding:0 var(--pad) clamp(3rem,7vw,6rem);max-width:var(--maxw);width:100%;margin-inline:auto}
.phero .eyebrow{color:rgba(255,255,255,.75)}
.phero .eyebrow::before,.phero .eyebrow::after{background:rgba(255,255,255,.45)}

/* ---------- Media / cadres photo ---------- */
.frame{position:relative;overflow:hidden;background:var(--paper-2)}
.frame img,.frame video{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s var(--ease)}
.frame:hover video{transform:scale(1.03)}
/* la vidéo se superpose à la photo : celle-ci reste visible tant que rien ne joue */
.frame video{position:absolute;inset:0;opacity:0;transition:opacity .8s var(--ease)}
.frame.is-playing video{opacity:1}
.frame:hover img{transform:scale(1.045)}
.frame::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(20,22,26,.06);pointer-events:none}
.frame img[src*="brasero"]{object-position:50% 68%}
.r-43{aspect-ratio:4/3}.r-32{aspect-ratio:3/2}.r-11{aspect-ratio:1/1}.r-34{aspect-ratio:3/4}.r-169{aspect-ratio:16/9}.r-23{aspect-ratio:2/3}

/* substitut élégant si la photo n'est pas disponible */
.frame.is-empty{background:
  linear-gradient(135deg,var(--paper-2),var(--paper-3));
  display:grid;place-items:center;}
.frame.is-empty img,.univers.is-empty img,.phero__img.is-empty img{display:none}
.frame.is-empty::before{
  content:attr(data-label);
  font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--ink-3);
  text-align:center;padding:1.5rem;max-width:22ch;line-height:1.4;
}

/* ---------- Le credo : le proverbe du menuisier ---------- */
.creed{background:var(--paper-2);text-align:center}
.creed__in{max-width:900px;margin-inline:auto;padding-inline:var(--pad)}
.creed__a,.creed__b{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.55rem,3.4vw,2.85rem);line-height:1.24;
  text-wrap:balance;margin:0;
}
.creed__a{color:var(--ink-3)}
.creed__b{color:var(--ink)}
.creed__eb{justify-content:center;white-space:nowrap;margin:0 0 clamp(1.6rem,3.4vw,2.4rem)}
/* la partie haute : l'histoire du lieu */
.creed h2{margin-bottom:clamp(1.6rem,3vw,2.2rem)}
.creed__lead{max-width:62ch;margin:0 auto;color:var(--ink-2)}
/* le trusquin fait la charnière entre l'histoire et le proverbe */
.creed__pivot{margin-block:clamp(3.2rem,7vw,5.2rem)}
.creed__pivot .tmark{width:clamp(58px,7vw,86px)}
.creed__b{margin-top:clamp(1.1rem,2.2vw,1.7rem)}
/* le nom du domaine termine la phrase : même corps, à peine détaché */
.creed__name{
  font-family:var(--serif);font-weight:300;color:var(--ink);
  font-size:clamp(1.55rem,3.4vw,2.85rem);line-height:1.24;
  margin:.38em 0 0;text-wrap:balance;
}
.creed .divider{margin-block:clamp(1.6rem,3.4vw,2.6rem)}
.creed .divider .tmark{width:clamp(48px,6vw,72px)}
.creed__sig{
  font-family:var(--sans);font-size:.63rem;
  letter-spacing:.34em;text-transform:uppercase;color:var(--ink-3);
  margin:clamp(2.2rem,5vw,3.4rem) 0 0;
}

/* la même idée, en petit, sous le logo du pied de page */
.ftr__creed{
  font-family:var(--serif);font-style:italic;font-size:clamp(.98rem,1.5vw,1.18rem);
  line-height:1.65;text-align:center;color:rgba(250,248,243,.6);
  max-width:min(56ch,100%);margin:-.6rem auto clamp(3rem,6vw,4.5rem);text-wrap:balance;
}

/* ---------- Cartes univers ---------- */
.univers{position:relative;display:block;overflow:hidden;color:#fff;min-height:clamp(380px,55vh,620px)}
.univers img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease)}
.univers::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.72));transition:background .6s}
.univers:hover img{transform:scale(1.06)}
.univers:hover::after{background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.8))}
.univers__c{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(1.8rem,3.5vw,3rem)}
.univers__c h3{font-size:clamp(1.9rem,3.6vw,3rem);margin-bottom:.5rem}
.univers__c p{color:rgba(255,255,255,.82);max-width:34ch;font-size:.95rem}
.univers.is-empty{background:linear-gradient(150deg,#20232a,#0f1114)}

/* ---------- Les trois espaces, en bandes cinématographiques ----------
   Chaque espace occupe toute la largeur et presque toute la hauteur de
   l'écran. Le film joue en fond, le texte se pose dessus, et le chiffre
   romain déborde du cadre en très grand, presque effacé. */
.spaces{padding-block:0}
.space{
  position:relative;min-height:86svh;display:flex;align-items:flex-end;
  overflow:hidden;background:var(--ink);color:#fff;isolation:isolate;
}
.space__media{position:absolute;inset:0;z-index:0}
.space__media img,.space__media video{width:100%;height:100%;object-fit:cover;display:block}
.space__media video{position:absolute;inset:0;opacity:0;transition:opacity 1.4s var(--ease)}
.space.is-playing .space__media video{opacity:1}
.space::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(8,9,11,.80),rgba(8,9,11,.46) 44%,rgba(8,9,11,.06) 74%),
    linear-gradient(0deg,rgba(8,9,11,.62),transparent 46%);
}
.space--right::after{
  background:
    linear-gradient(270deg,rgba(8,9,11,.80),rgba(8,9,11,.46) 44%,rgba(8,9,11,.06) 74%),
    linear-gradient(0deg,rgba(8,9,11,.62),transparent 46%);
}
/* le trusquin, immense et presque effacé, déborde du cadre et tourne
   lentement derrière le texte : la signature du domaine en filigrane */
.space__mark{
  position:absolute;z-index:2;pointer-events:none;
  width:clamp(17rem,40vw,44rem);left:-7%;bottom:-9%;
  color:#fff;opacity:.11;
}
.space--right .space__mark{left:auto;right:-7%}
.space__mark svg{
  display:block;width:100%;height:auto;fill:currentColor;overflow:visible;
  animation:spin 64s linear infinite;transform-origin:53.6% 46.5%;
}
/* le numéro de l'espace, en petites capitales au-dessus du nom */
.space__num{
  font-family:var(--sans);font-size:.64rem;font-weight:400;
  letter-spacing:.34em;text-transform:uppercase;color:rgba(255,255,255,.66);
  display:flex;align-items:center;gap:1rem;margin:0 0 1.2rem;
}
.space__num::before{content:"";width:2.2rem;height:1px;background:rgba(255,255,255,.42);flex:none}

.space__c{
  position:relative;z-index:3;display:flex;width:100%;
  max-width:var(--maxw);margin-inline:auto;
  padding:clamp(3rem,8vw,6.5rem) var(--pad);
}
.space--right .space__c{justify-content:flex-end}
.space__box{max-width:min(44rem,100%)}
.space__box h3{font-size:clamp(2.3rem,5.4vw,4.2rem);margin-bottom:1.1rem;line-height:1}
.space__box p{
  font-family:var(--serif);font-size:clamp(1.08rem,1.8vw,1.42rem);line-height:1.5;
  color:rgba(255,255,255,.86);max-width:46ch;margin:0;
}
.space__list{
  display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.5rem;
  list-style:none;padding:0;margin:clamp(1.8rem,3.4vw,2.6rem) 0 0;
}
.space__list li{
  display:flex;align-items:center;gap:1.5rem;
  font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(255,255,255,.82);
}
.space__list li:not(:first-child)::before{
  content:"";width:1px;height:13px;background:rgba(255,255,255,.34);flex:none;
}
.space__more{margin-top:clamp(1.8rem,3vw,2.4rem)}
@media(max-width:700px){
  .space{min-height:78svh}
  /* sur un écran étroit le dégradé latéral ne protège plus rien :
     on passe à un voile qui monte du bas */
  .space::after,.space--right::after{
    background:linear-gradient(0deg,rgba(8,9,11,.90),rgba(8,9,11,.58) 46%,rgba(8,9,11,.22));
  }
  .space__mark{width:70vw;left:-14%;bottom:-6%}
  .space--right .space__mark{left:auto;right:-14%}
  .space__list{flex-direction:column;align-items:flex-start;gap:.55rem}
  .space__list li:not(:first-child)::before{display:none}
}

/* ---------- Espaces (liste chiffrée) ---------- */
.espace{display:grid;gap:1.6rem;padding-block:clamp(2.5rem,5vw,4rem);border-top:1px solid var(--line)}
@media(min-width:900px){.espace{grid-template-columns:5.5rem 1fr 1.15fr;gap:clamp(2rem,4vw,4rem);align-items:start}}
.espace__n{font-family:var(--serif);font-size:2.2rem;color:var(--ink-3);line-height:1}
.espace h3{margin-bottom:.9rem}
.espace ul{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;gap:.55rem}
.espace li{font-size:.83rem;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-2);display:flex;gap:.85rem;align-items:baseline}
.espace li::before{content:"";width:14px;height:1px;background:var(--line-2);flex:none;transform:translateY(-4px)}
/* Liste de faits, en dehors d'un bloc « espace » */
.tick-list{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:.6rem}
.tick-list li{font-size:.83rem;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-2);
  display:flex;gap:.85rem;align-items:baseline;line-height:1.6}
.tick-list li::before{content:"";width:14px;height:1px;background:var(--line-2);flex:none;transform:translateY(-5px)}

/* ---------- Accompagnement : deux colonnes de filets ---------- */
.steps{display:grid;gap:0}
@media(min-width:760px){.steps{grid-template-columns:repeat(2,1fr);column-gap:clamp(2.5rem,6vw,6rem)}}
.step{padding-block:clamp(1.5rem,3vw,2.1rem);border-top:1px solid var(--line)}
.step h4{font-family:var(--serif);font-weight:300;font-size:clamp(1.15rem,1.9vw,1.45rem);margin:0 0 .5rem;line-height:1.2}
.step p{margin:0;color:var(--ink-2);font-size:.95rem;line-height:1.65}
.dark .step{border-color:rgba(250,248,243,.16)}
.dark .step p{color:rgba(250,248,243,.72)}

/* ---------- Chiffres ---------- */
.stats{display:grid;gap:clamp(2rem,4vw,3rem);grid-template-columns:repeat(2,1fr);text-align:center}
@media(min-width:820px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat b{display:block;font-family:var(--serif);font-weight:300;font-size:clamp(2.4rem,4.4vw,3.6rem);line-height:1;white-space:nowrap}
/* le « à » d'une fourchette reste discret : ce sont les chiffres qui parlent */
.stat b em{font-size:.42em;font-style:italic;opacity:.55;padding:0 .3em;vertical-align:.18em}
.stat span{display:block;margin-top:.7rem;font-size:.64rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-3)}

/* ---------- Timeline journée ---------- */
.tl{display:grid;gap:0;counter-reset:tl}
.tl__i{display:grid;gap:.6rem;padding:clamp(1.6rem,3vw,2.4rem) 0 clamp(1.6rem,3vw,2.4rem) clamp(3rem,6vw,6rem);border-top:1px solid var(--line);position:relative}
@media(min-width:820px){.tl__i{grid-template-columns:10rem 1fr;gap:clamp(2rem,4vw,4rem);align-items:baseline}}
.tl__i::before{
  counter-increment:tl;content:counter(tl,decimal-leading-zero);
  position:absolute;left:0;top:clamp(1.6rem,3vw,2.4rem);
  font-family:var(--serif);font-size:1.1rem;color:var(--ink-3);letter-spacing:.1em;
}
.tl__t{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--accent)}
.tl__i h4{font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.75rem);margin-bottom:.45rem}
.tl__i p{margin:0;color:var(--ink-2);max-width:62ch}

/* ---------- Galerie ---------- */
.gal{columns:2;column-gap:clamp(.7rem,1.6vw,1.4rem)}
@media(min-width:900px){.gal{columns:3}}
.gal .frame{break-inside:avoid;margin-bottom:clamp(.7rem,1.6vw,1.4rem)}

/* ---------- Témoignages ---------- */
.quote{max-width:900px;margin-inline:auto;text-align:center}
.quote blockquote{
  font-family:var(--serif);font-size:clamp(1.4rem,3vw,2.35rem);line-height:1.35;
  font-style:italic;font-weight:300;margin:0 0 1.8rem;
}
.quote figcaption{font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3)}
.quotes{display:grid;gap:0}
.quotes .quote{padding-block:clamp(2.5rem,6vw,4.5rem);border-top:1px solid var(--line)}

/* ---------- Bandeau sombre ---------- */
.dark{background:var(--ink);color:var(--paper)}
.dark .eyebrow{color:rgba(250,248,243,.6)}
.dark .eyebrow::before,.dark .eyebrow::after{background:rgba(250,248,243,.35)}
.dark .lead,.dark p{color:rgba(250,248,243,.78)}
.dark .rule{background:rgba(250,248,243,.16)}
.dark .btn{--c:var(--paper)}
.dark .btn:hover{color:var(--ink)}

/* ---------- Barre d'appel, sur téléphone ---------- */
.callbar{
  position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;
  grid-template-columns:repeat(3,1fr);background:var(--ink);color:var(--paper);
  box-shadow:0 -10px 34px rgba(12,13,16,.28);
  padding-bottom:env(safe-area-inset-bottom);
  transition:transform .45s var(--ease),opacity .3s var(--ease);
}
@media(max-width:899px){
  .callbar{display:grid}
  body{padding-bottom:68px}
}
.callbar a{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;
  padding:.9rem .4rem;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  border-left:1px solid rgba(250,248,243,.16);color:rgba(250,248,243,.9);
}
.callbar a:first-child{border-left:0}
.callbar a:active{background:rgba(250,248,243,.08)}
.callbar svg{width:19px;height:19px;display:block}
body.is-open .callbar,body.has-modal .callbar{transform:translateY(105%);opacity:0}

/* icônes en ligne */
.ico{width:1em;height:1em;fill:currentColor;flex:none}
.btn .ico{width:1.25em;height:1.25em;margin-right:-.2rem}

/* ---------- Brochure : bandeau + couverture maquettée ---------- */
.broch{background:var(--ink);color:var(--paper)}
.broch .eyebrow{color:rgba(250,248,243,.6)}
.broch .eyebrow::before{background:rgba(250,248,243,.35)}
.broch .lead,.broch p{color:rgba(250,248,243,.78)}
.broch__note{font-size:.82rem;color:rgba(250,248,243,.5)}
.broch .btn{--c:var(--paper)}
.broch .btn:hover{color:var(--ink)}
.broch .btn.is-solid{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.broch .btn.is-solid::after{background:var(--ink)}
.broch .btn.is-solid:hover{color:var(--paper)}

.cover{
  aspect-ratio:1/1.414;background:var(--paper);color:var(--ink);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1.4rem;padding:clamp(1.5rem,4vw,3rem);text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.45);
  transform:rotate(-1.6deg);transition:transform .8s var(--ease);
  max-width:340px;margin-inline:auto;
}
.cover:hover{transform:rotate(0deg) translateY(-6px)}
.cover img{width:68%;height:auto}
/* la couverture est un carton ivoire posé sur le bandeau sombre :
   son texte reprend l'encre, sans hériter de la couleur du bandeau */
.broch .cover .cover__t{font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-3)}
.broch .cover .cover__y{font-family:var(--serif);font-size:1.6rem;line-height:1;color:var(--ink)}
.cover__rule{width:44px;height:1px;background:var(--line-2);margin:0 auto 1.1rem}

/* ---------- Fenêtre de demande ---------- */
.modal{
  position:fixed;inset:0;z-index:90;display:grid;place-items:center;
  padding:var(--pad);opacity:0;pointer-events:none;transition:opacity .4s var(--ease);
}
.modal.is-open{opacity:1;pointer-events:auto}
.modal__veil{position:absolute;inset:0;background:rgba(12,13,16,.74)}
.modal__panel{
  position:relative;z-index:1;background:var(--paper);color:var(--ink);
  width:min(560px,100%);max-height:88svh;overflow-y:auto;
  padding:clamp(2rem,5vw,3.2rem);
  box-shadow:0 30px 90px rgba(12,13,16,.4);
  transform:translateY(20px) scale(.985);transition:transform .55s var(--ease);
}
.modal.is-open .modal__panel{transform:none}
.modal__x{
  position:absolute;top:.9rem;right:1rem;z-index:2;line-height:1;
  font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);
  padding:.6rem;transition:color .3s;
}
.modal__x:hover{color:var(--ink)}
.modal .tmark{width:52px;margin:0 auto 1.5rem;opacity:.85}
.modal h3{text-align:center;margin-bottom:.9rem}
.modal__intro{text-align:center;color:var(--ink-3);font-size:.95rem;margin-bottom:2rem}
.form--modal{display:grid;gap:1.4rem;grid-template-columns:1fr 1fr}
.form--modal .full{grid-column:1/-1}
@media(max-width:520px){.form--modal{grid-template-columns:1fr}}
.field.is-req label::after{content:" *";color:var(--accent)}
.field input:user-invalid{border-color:#a8443a}
.modal__done{text-align:center;display:none}
.modal.is-done .modal__form,.modal.is-done .modal__head{display:none}
.modal.is-done .modal__done{display:block}

/* ---------- Formulaire ---------- */
.form{display:grid;gap:1.6rem}
@media(min-width:760px){.form .half{grid-column:span 1}.form{grid-template-columns:1fr 1fr}.form .full{grid-column:1/-1}}
.field{position:relative;display:grid;gap:.5rem}
.field label{font-size:.63rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-3)}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:1rem;font-weight:300;color:var(--ink);
  background:transparent;border:0;border-bottom:1px solid var(--line-2);
  padding:.7rem 0;transition:border-color .4s var(--ease);border-radius:0;
}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--ink)}
.form__note{font-size:.78rem;color:var(--ink-3)}

/* ---------- Coordonnées ---------- */
.contact-list{display:grid;gap:2rem;list-style:none;padding:0;margin:0}
.contact-list dt{font-size:.63rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.5rem}
.contact-list dd{margin:0;font-family:var(--serif);font-size:clamp(1.1rem,1.8vw,1.4rem)}
.contact-list a:hover{color:var(--accent)}

/* ---------- Pied de page ---------- */
.ftr{background:var(--ink);color:rgba(250,248,243,.72);padding-block:clamp(4rem,8vw,7rem) 2.5rem}
.ftr__logo{width:min(80vw,430px);color:var(--paper);margin:0 auto clamp(2.2rem,5vw,3.6rem)}
.ftr__logo svg{width:100%;height:auto}
.ftr__cols{display:grid;gap:2.5rem}
@media(min-width:820px){.ftr__cols{grid-template-columns:repeat(4,1fr)}}
.ftr h5{font-family:var(--sans);font-size:.62rem;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:rgba(250,248,243,.5);margin:0 0 1.2rem}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.ftr a:hover{color:var(--paper)}
.ftr__bar{margin-top:clamp(3rem,6vw,4.5rem);padding-top:1.8rem;border-top:1px solid rgba(250,248,243,.14);
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(250,248,243,.45)}

/* ---------- Révélation au scroll ---------- */
[data-rv]{opacity:0;transform:translateY(22px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
[data-rv].is-in{opacity:1;transform:none}
[data-rv-d="1"]{transition-delay:.09s}
[data-rv-d="2"]{transition-delay:.18s}
[data-rv-d="3"]{transition-delay:.27s}
[data-rv-d="4"]{transition-delay:.36s}

/* ---------- Lightbox ---------- */
.lb{position:fixed;inset:0;z-index:80;background:rgba(12,13,16,.94);display:grid;place-items:center;
  opacity:0;pointer-events:none;transition:opacity .45s var(--ease);padding:var(--pad)}
.lb.is-open{opacity:1;pointer-events:auto}
.lb img{max-width:min(1200px,92vw);max-height:86vh;object-fit:contain}
.lb__x{position:absolute;top:1.5rem;right:var(--pad);color:#fff;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  [data-rv]{opacity:1;transform:none}
}

/* =========================================================
   VARIANTE ÉPURÉE DE LA PAGE D'ACCUEIL  (accueil-epure.html)
   Registre de la brochure : ivoire, colonnes justifiées,
   titres en petites capitales encadrées d'un filet.
   N'affecte aucune autre page : tout est préfixé .ep
   ========================================================= */
.ep{background:var(--paper)}
.ep .ep-s{padding-block:clamp(4.2rem,9vw,8rem)}
.ep .ep-s--tight{padding-block:clamp(2.6rem,5vw,4.5rem)}
.ep .ep-s--alt{background:var(--paper-2)}
.ep-wrap{max-width:1180px;margin-inline:auto;padding-inline:var(--pad)}
.ep-narrow{max-width:760px;margin-inline:auto;padding-inline:var(--pad)}

/* ---- Titre encadré (signature de la brochure) ---- */
.ep-h{display:flex;align-items:center;justify-content:center;
  gap:clamp(.7rem,2vw,1.4rem);margin:0 0 clamp(1.4rem,3vw,2.2rem)}
.ep-h::before,.ep-h::after{content:"";height:1px;flex:1;max-width:120px;background:var(--line-2);opacity:.7}
.ep-h i{width:5px;height:5px;flex:none;border:1px solid var(--line-2);transform:rotate(45deg)}
.ep-h h1,.ep-h h2{font-family:var(--serif);font-weight:400;
  font-size:clamp(.98rem,1.8vw,1.34rem);line-height:1.5;text-align:center;
  text-transform:uppercase;letter-spacing:.26em;color:var(--ink);text-wrap:balance}
.ep-sub{text-align:center;font-family:var(--sans);font-size:.64rem;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3);
  margin:0 0 clamp(2.2rem,4.5vw,3.4rem)}

/* ---- Colonne de texte, justifiée comme la brochure ---- */
.ep-col{max-width:62ch;margin-inline:auto;text-align:justify;hyphens:auto;
  font-size:1.015rem;line-height:1.95;color:var(--ink-2)}
.ep-col p{margin:0 0 1.35em}
.ep-col p:last-child{margin-bottom:0}
.ep-col--l{text-align:left}
@media(max-width:600px){.ep-col{text-align:left;font-size:.98rem;line-height:1.85}}

/* ---- Image calme, pleine largeur de la colonne ---- */
.ep-img{margin:clamp(2.6rem,5vw,4rem) 0 0}
.ep-img figcaption{font-family:var(--sans);font-size:.6rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--ink-3);text-align:center;margin-top:1rem}

/* ---- Le rideau : les images s'ouvrent comme la page d'accueil ---- */
.ep-curtain{position:relative;--veil:var(--paper)}
.ep-s--alt .ep-curtain{--veil:var(--paper-2)}
.ep-curtain::before{content:"";position:absolute;inset:-1px;z-index:4;
  background:var(--veil);transform-origin:50% 100%;transform:scaleY(1);
  transition:transform 1.35s cubic-bezier(.5,.04,.18,1);pointer-events:none}
.ep-curtain.is-open::before{transform:scaleY(0)}
/* le léger recadrage qui se pose après le rideau ; il ne s'applique pas aux
   diaporamas, dont les images ont leur propre transition d'opacité */
.ep-curtain:not([data-para]):not(.ep-diapo) img{transform:scale(1.08);transition:transform 2.4s var(--ease)}
.ep-curtain.is-open:not([data-para]):not(.ep-diapo) img{transform:none}

/* ---- Bandes photographiques pleine largeur ---- */
.ep-band-s{padding:0!important}
.ep-band{position:relative;overflow:hidden;margin:0;background:var(--ink);
  height:clamp(320px,58vh,600px)}
.ep-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  will-change:transform}
.ep-band--plein{height:clamp(340px,70vh,720px)}
.ep-band--dark::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,11,13,.5),rgba(10,11,13,.2) 45%,rgba(10,11,13,.6))}
.ep-band__mot{position:absolute;inset:0;z-index:2;display:grid;place-items:center;
  padding:var(--pad);text-align:center}
/* la phrase descend au pied de l'image pour ne pas couvrir les visages */
.ep-band__mot--bas{place-items:end center;padding-bottom:clamp(2.2rem,5vw,4rem)}
.ep-band--dark:has(.ep-band__mot--bas)::after{
  background:linear-gradient(180deg,rgba(10,11,13,.28),rgba(10,11,13,.12) 40%,rgba(10,11,13,.72))}
.ep-band__mot p{font-family:var(--serif);font-weight:300;color:#fff;margin:0;
  font-size:clamp(1.6rem,3.6vw,3.1rem);line-height:1.25;max-width:20ch;
  text-wrap:balance;text-shadow:0 2px 30px rgba(8,9,11,.45)}
.ep-band__lg{font-family:var(--sans);font-size:.6rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--ink-3);text-align:center;
  margin:1.1rem 0 0;padding-inline:var(--pad)}

/* ---- Le fil de lecture ---- */
.ep-fil{position:fixed;top:0;left:0;right:0;height:2px;z-index:95;
  background:var(--ink);transform:scaleX(0);transform-origin:0 50%;
  transition:transform .12s linear;pointer-events:none;opacity:.85}

/* ---- Les deux lieux, en quinconce ---- */
.ep-quinconce{display:grid;gap:clamp(3.4rem,8vw,7rem)}
.ep-rang{display:grid;gap:clamp(2rem,4.5vw,3.8rem);align-items:center}
@media(min-width:900px){
  .ep-rang{grid-template-columns:1.02fr .98fr}
  .ep-rang--inv .ep-rang__img{order:2}
}
.ep-rang__img{margin:0;overflow:hidden;background:var(--paper-3);aspect-ratio:4/5}
.ep-rang__img img{width:100%;height:100%;object-fit:cover;display:block}
/* Cadre film : le montage tourne dans le même cadre que les photographies,
   l'image d'attente reste dessous tant que la lecture n'a pas commencé */
.ep-film img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ep-film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  display:block;opacity:0;transition:opacity 1.1s var(--ease);z-index:2}
.ep-film.is-playing video{opacity:1}

/* Diaporama : les vues se succèdent en fondu dans le même cadre */
/* Fondu enchaîné : la nouvelle vue apparaît PAR-DESSUS l'ancienne, qui reste
   opaque en dessous et ne s'efface qu'une fois le fondu terminé. Sans cela,
   les deux s'estompent ensemble et le fond transparaît au milieu du passage. */
.ep-diapo img{position:absolute;inset:0;opacity:0;z-index:1;
  transition:opacity 1ms linear 1.8s}
.ep-diapo img.is-on{opacity:1;z-index:2;transition:opacity 1.8s var(--ease)}
.ep-diapo__n{position:absolute;left:0;right:0;bottom:0;z-index:3;
  display:flex;gap:6px;justify-content:center;padding:1.1rem;pointer-events:none}
.ep-diapo__n i{display:block;width:5px;height:5px;border-radius:50%;
  background:rgba(255,255,255,.45);transition:background .5s var(--ease)}
.ep-diapo__n i.is-on{background:rgba(255,255,255,.95)}
.ep-rang__c h3{font-family:var(--serif);font-weight:400;
  font-size:clamp(1.15rem,2.1vw,1.55rem);letter-spacing:.26em;text-transform:uppercase;
  margin:0 0 1.3rem}
.ep-rang__c .ep-col{max-width:52ch}
@media(min-width:900px){.ep-rang__c .ep-col{margin-inline:0}}
.ep-rang__c .ep-lieu__list{justify-content:start;text-align:left;margin-top:2rem}

/* ---- Les deux lieux, côte à côte ---- */
.ep-duo{display:grid;gap:clamp(2.8rem,5vw,4.5rem)}
@media(min-width:860px){.ep-duo{grid-template-columns:1fr 1fr}}
.ep-lieu h3{font-family:var(--serif);font-weight:400;text-align:center;
  font-size:clamp(1.05rem,1.9vw,1.4rem);letter-spacing:.26em;text-transform:uppercase;
  margin:clamp(1.5rem,3vw,2.1rem) 0 1.2rem}
.ep-lieu .ep-col{max-width:46ch}
.ep-lieu__list{list-style:none;margin:1.8rem 0 0;padding:0;
  display:grid;gap:.55rem;justify-content:center;text-align:center}
.ep-lieu__list li{font-family:var(--sans);font-size:.66rem;font-weight:400;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3)}
.ep-lieu__list li::before{content:"";display:inline-block;width:4px;height:4px;
  border:1px solid var(--line-2);transform:rotate(45deg);margin-right:.7rem;
  vertical-align:middle;position:relative;top:-1px}

/* ---- Rappel de l'ensemble du domaine ---- */
.ep-ens{text-align:center;max-width:56ch;margin-inline:auto}
.ep-ens p{font-family:var(--serif);font-size:clamp(1.15rem,2vw,1.5rem);
  line-height:1.55;color:var(--ink-2);margin:0}

/* ---- Le modèle en une phrase ---- */
.ep-modele{max-width:62ch;margin:0 auto clamp(2.6rem,5vw,3.8rem);text-align:center}
.ep-modele p{margin:0;font-family:var(--serif);font-size:clamp(1.18rem,2.1vw,1.55rem);
  line-height:1.5;color:var(--ink-2)}
.ep-modele b{font-weight:400;color:var(--ink);box-shadow:inset 0 -1px 0 var(--line-2)}

/* ---- Le plan : deux lieux, un domaine ---- */
.ep-plan{margin:0 auto clamp(3rem,6vw,4.5rem);max-width:860px}
.ep-plan svg{display:block;width:100%;height:auto}
.ep-plan svg.ep-plan__m{display:none}
@media(max-width:720px){
  .ep-plan svg.ep-plan__d{display:none}
  .ep-plan svg.ep-plan__m{display:block;max-width:420px;margin-inline:auto}
}
.ep-plan__m .ep-plan__n{font-size:25px;letter-spacing:3.4px}
.ep-plan__m .ep-plan__s{font-size:14px;letter-spacing:1.6px}
.ep-plan__m .ep-plan__a{font-size:14px;letter-spacing:3.4px}
.ep-plan__all{fill:none;stroke:var(--line-2);stroke-width:1;stroke-dasharray:5 6}
.ep-plan__box{fill:var(--paper);stroke:var(--line-2);stroke-width:1}
.ep-s--alt .ep-plan__box{fill:var(--paper)}
.ep-plan__ico{color:var(--accent)}
.ep-plan__ico use{fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.ep-plan__n{font-family:var(--serif);font-size:27px;letter-spacing:5px;
  fill:var(--ink);text-anchor:middle}
.ep-plan__s{font-family:var(--sans);font-size:14px;letter-spacing:2px;
  fill:var(--ink-3);text-anchor:middle}
.ep-plan__a{font-family:var(--sans);font-size:15px;letter-spacing:5px;
  fill:var(--ink-3);text-anchor:middle}
.ep-plan figcaption{font-family:var(--sans);font-size:.64rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);text-align:center;margin-top:1.4rem}

/* ---- Le domaine entier ---- */
.ep-tout{display:grid;gap:clamp(2.4rem,5vw,4rem)}
@media(min-width:940px){.ep-tout{grid-template-columns:1.05fr .95fr;align-items:start}}
.ep-tout__c .ep-col{max-width:58ch}
/* en deux colonnes le texte se cale à gauche ; sur une colonne il reste centré */
@media(min-width:940px){.ep-tout__c .ep-col{margin-inline:0}}
.ep-tout__l{list-style:none;margin:0;padding:0;display:grid;gap:0;
  border-top:1px solid var(--line)}
.ep-tout__l li{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.4rem;
  align-items:center;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.ep-tout__l .ep-line{grid-row:span 2;width:38px;margin:0}
.ep-tout__l b{font-family:var(--sans);font-size:.66rem;font-weight:400;
  letter-spacing:.24em;text-transform:uppercase;color:var(--ink);align-self:end}
.ep-tout__l span{font-size:.92rem;line-height:1.7;color:var(--ink-3);align-self:start}

/* ---- Le tableau récapitulatif ---- */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ep-tabwrap{max-width:1000px;margin-inline:auto}
.ep-tab{width:100%;border-collapse:collapse;font-family:var(--sans);text-align:left}
.ep-tab th,.ep-tab td{padding:1.05rem 1.1rem;vertical-align:top;
  border-bottom:1px solid var(--line)}
.ep-tab thead th{font-family:var(--serif);font-weight:400;font-size:clamp(.95rem,1.5vw,1.15rem);
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink);
  border-bottom:1px solid var(--line-2);padding-bottom:1.2rem;white-space:nowrap}
.ep-tab tbody th{font-size:.63rem;font-weight:400;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap;padding-left:0}
.ep-tab td{font-size:.94rem;line-height:1.6;color:var(--ink-2)}
.ep-tab tbody tr:last-child th,.ep-tab tbody tr:last-child td{border-bottom:0}
.ep-tab col{width:auto}
.ep-tab thead th:first-child{padding-left:0}
@media(max-width:820px){
  .ep-tab,.ep-tab tbody,.ep-tab tr,.ep-tab th,.ep-tab td{display:block}
  .ep-tab thead{display:none}
  .ep-tab tbody tr{padding:1.4rem 0;border-bottom:1px solid var(--line)}
  .ep-tab tbody tr:last-child{border-bottom:0}
  .ep-tab tbody th{padding:0 0 .7rem;border:0}
  .ep-tab td{padding:.28rem 0;border:0;display:flex;gap:.9rem;align-items:baseline}
  .ep-tab td::before{content:attr(data-c);flex:none;width:9.8em;
    font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
}
@media(min-width:821px){
  .ep-tab thead th:last-child,.ep-tab td:last-child{background:rgba(20,22,26,.03)}
  .ep-tab thead th:last-child{box-shadow:inset 0 0 0 0 transparent}
}
.ep-tabnote{text-align:center;font-family:var(--sans);font-size:.66rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);
  margin:clamp(1.8rem,3.5vw,2.6rem) 0 0;line-height:2}

/* ---- Prestations : icônes au trait ---- */
.ep-inc{display:grid;gap:clamp(2.4rem,4.5vw,3.4rem)}
@media(min-width:660px){.ep-inc{grid-template-columns:1fr 1fr}}
@media(min-width:1020px){.ep-inc{grid-template-columns:repeat(4,1fr)}}
.ep-item{text-align:center}
.ep-line{display:block;width:clamp(38px,4.5vw,50px);height:auto;margin:0 auto 1.4rem;
  color:var(--accent)}
.ep-line svg{display:block;width:100%;height:auto;fill:none;stroke:currentColor;
  stroke-width:1;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ep-item h4{font-family:var(--sans);font-size:.63rem;font-weight:400;
  letter-spacing:.26em;text-transform:uppercase;color:var(--ink);margin:0 0 .9rem;line-height:1.7}
.ep-item p{font-size:.92rem;line-height:1.8;color:var(--ink-3);margin:0;max-width:30ch;margin-inline:auto}

/* ---- La Table : texte à gauche, pastilles à droite ---- */
.ep-table{display:grid;gap:clamp(2.6rem,5vw,4.5rem);align-items:center}
@media(min-width:900px){.ep-table{grid-template-columns:1.25fr .75fr}}
.ep-pastilles{display:grid;gap:clamp(1.6rem,3vw,2.4rem)}
.ep-pastille{display:flex;align-items:center;gap:1.3rem}
.ep-pastille .ep-round{flex:none;width:60px;height:60px;border-radius:50%;
  border:1px solid var(--line);display:grid;place-items:center;color:var(--accent)}
.ep-pastille .ep-round svg{width:28px;height:28px;fill:none;stroke:currentColor;
  stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.ep-pastille span{font-family:var(--sans);font-size:.63rem;font-weight:400;
  letter-spacing:.24em;text-transform:uppercase;color:var(--ink-2);line-height:1.8}

/* ---- La Table : le Chef, une image et des lignes calmes ---- */
.ep-chef{display:grid;gap:clamp(2.4rem,5vw,4.4rem);align-items:center}
@media(min-width:900px){.ep-chef{grid-template-columns:1fr 1.08fr}}
.ep-chef__img{margin:0;overflow:hidden;background:var(--paper-3);aspect-ratio:4/5}
.ep-chef__img img{width:100%;height:100%;object-fit:cover;object-position:58% 42%;display:block}
.ep-chef__c .ep-col{max-width:58ch}
@media(min-width:900px){.ep-chef__c .ep-col{margin-inline:0}}
.ep-vertus{list-style:none;margin:clamp(2rem,4vw,2.8rem) 0 0;padding:0;border-top:1px solid var(--line)}
.ep-vertus li{font-family:var(--sans);font-size:.63rem;font-weight:400;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-2);padding:1rem 0;border-bottom:1px solid var(--line)}
.ep-chef__more{margin:clamp(1.9rem,3.5vw,2.5rem) 0 0}

/* ---- Deux portes : mariages / séminaires ---- */
.ep-portes{display:grid;gap:clamp(1.4rem,3vw,2rem)}
@media(min-width:760px){.ep-portes{grid-template-columns:1fr 1fr}}
.ep-porte{display:block;border:1px solid var(--line);padding:clamp(2rem,4vw,3rem);
  text-align:center;transition:background .5s var(--ease),border-color .5s var(--ease)}
.ep-porte:hover{background:var(--paper-2);border-color:var(--line-2)}
.ep-porte b{display:block;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.3rem,2.4vw,1.8rem);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.9rem}
.ep-porte span{font-size:.92rem;color:var(--ink-3)}

/* ---- Clôture ---- */
.ep-end{text-align:center}
.ep-end .ep-mark{width:52px;margin:0 auto clamp(1.6rem,3vw,2.4rem);opacity:.8}
.ep-end h2{font-family:var(--serif);font-weight:300;text-transform:none;letter-spacing:.005em;
  font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.15;margin-bottom:1.4rem}
.ep-end .ep-col{margin-bottom:clamp(2.2rem,4vw,3rem)}
.ep-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
.ep-adr{margin:clamp(2.4rem,4vw,3.2rem) 0 0;font-family:var(--sans);font-size:.66rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);line-height:2.2}

/* ---- La Table : le Chef, une image et des lignes calmes ---- */
.ep-chef{display:grid;gap:clamp(2.4rem,5vw,4.4rem);align-items:center}
@media(min-width:900px){.ep-chef{grid-template-columns:1fr 1.08fr}}
.ep-chef__img{margin:0;overflow:hidden;background:var(--paper-3);aspect-ratio:4/5}
.ep-chef__img img{width:100%;height:100%;object-fit:cover;object-position:58% 42%;display:block}
.ep-chef__c .ep-col{max-width:58ch}
@media(min-width:900px){.ep-chef__c .ep-col{margin-inline:0}}
.ep-vertus{list-style:none;margin:clamp(2rem,4vw,2.8rem) 0 0;padding:0;border-top:1px solid var(--line)}
.ep-vertus li{font-family:var(--sans);font-size:.63rem;font-weight:400;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-2);padding:1rem 0;border-bottom:1px solid var(--line)}
.ep-chef__more{margin:clamp(1.9rem,3.5vw,2.5rem) 0 0}

/* ---- Deux portes : mariages / séminaires ---- */
.ep-portes{display:grid;gap:clamp(1.4rem,3vw,2rem)}
@media(min-width:760px){.ep-portes{grid-template-columns:1fr 1fr}}
.ep-porte{display:block;border:1px solid var(--line);padding:clamp(2rem,4vw,3rem);
  text-align:center;transition:background .5s var(--ease),border-color .5s var(--ease)}
.ep-porte:hover{background:var(--paper-2);border-color:var(--line-2)}
.ep-porte b{display:block;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.3rem,2.4vw,1.8rem);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.9rem}
.ep-porte span{font-size:.92rem;color:var(--ink-3)}

/* ---- Clôture ---- */
.ep-end{text-align:center}
.ep-end .ep-mark{width:52px;margin:0 auto clamp(1.6rem,3vw,2.4rem);opacity:.8}
.ep-end h2{font-family:var(--serif);font-weight:300;text-transform:none;letter-spacing:.005em;
  font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.15;margin-bottom:1.4rem}
.ep-end .ep-col{margin-bottom:clamp(2.2rem,4vw,3rem)}
.ep-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
.ep-adr{margin:clamp(2.4rem,4vw,3.2rem) 0 0;font-family:var(--sans);font-size:.66rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);line-height:2.2}

/* ---- Bandeau de comparaison (aperçu uniquement) ---- */
.ep-switch{position:fixed;left:50%;transform:translateX(-50%);top:clamp(4.6rem,7vw,5.6rem);z-index:90;
  display:flex;align-items:center;gap:.35rem;border-radius:999px;
  background:rgba(255,255,255,.96);border:1px solid var(--line-2);padding:.34rem;
  backdrop-filter:blur(10px);box-shadow:0 12px 44px rgba(20,22,26,.26)}
.ep-switch b{font-family:var(--sans);font-size:.55rem;font-weight:400;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-3);padding:0 .5rem 0 1rem;white-space:nowrap}
.ep-switch a{font-family:var(--sans);font-size:.63rem;letter-spacing:.2em;text-transform:uppercase;
  padding:.78rem 1.25rem;border-radius:999px;color:var(--ink-3);white-space:nowrap;
  transition:background .3s var(--ease),color .3s var(--ease)}
.ep-switch a:hover{color:var(--ink);background:var(--paper-2)}
.ep-switch a.is-on{background:var(--ink);color:var(--paper)}
@media(max-width:900px){
  .ep-switch{top:auto;bottom:5rem;left:.5rem;right:.5rem;transform:none;justify-content:center;
    border-radius:6px;padding:.3rem}
  .ep-switch b{display:none}
  .ep-switch a{flex:1;text-align:center;padding:.8rem .6rem;border-radius:4px;font-size:.58rem}
}

/* =========================================================
   LA TABLE — simulateur de devis traiteur
   ========================================================= */
.dv{display:grid;gap:clamp(2.5rem,5vw,4rem);position:relative}
@media(min-width:1000px){.dv{grid-template-columns:minmax(0,1fr) 380px;align-items:start}}

/* effectifs */
.dv-head{display:grid;gap:1.2rem;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line);padding:clamp(1.4rem,2.5vw,2rem) 0;margin-bottom:clamp(2rem,4vw,3rem)}
@media(min-width:640px){.dv-head{grid-template-columns:repeat(3,1fr)}}
.dv-head__f{display:grid;gap:.7rem}
.dv-head__f label{font-family:var(--sans);font-size:.63rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-3)}
.dv-head__f small{font-size:.78rem;color:var(--ink-3);line-height:1.5}

/* compteur − n + */
.dv-qty{display:inline-flex;align-items:stretch;border:1px solid var(--line-2);height:40px;flex:none}
.dv-qty button{width:38px;font-size:1.1rem;font-weight:300;color:var(--ink-2);transition:background .3s var(--ease),color .3s}
.dv-qty button:hover{background:var(--ink);color:var(--paper)}
.dv-qty input{width:52px;text-align:center;border:0;border-inline:1px solid var(--line);background:transparent;font-family:var(--sans);font-size:1rem;font-weight:300;color:var(--ink);-moz-appearance:textfield}
.dv-qty input::-webkit-outer-spin-button,.dv-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.dv-qty input:focus{outline:0;background:var(--paper-2)}
.dv-head .dv-qty{height:44px}
.dv-head .dv-qty input{width:64px;font-size:1.15rem}

/* un temps de la journée */
.dv-g{padding-top:clamp(2.2rem,4vw,3rem)}
.dv-g:first-child{padding-top:0}
.dv-g__h{display:grid;gap:.5rem;margin-bottom:clamp(1.2rem,2vw,1.6rem)}
.dv-g__num{font-family:var(--serif);font-size:.95rem;letter-spacing:.3em;color:var(--accent);margin:0}
.dv-g__h h3{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.dv-g__note{margin:.3rem 0 0;font-size:.92rem;color:var(--ink-3);max-width:62ch;line-height:1.7}
.dv-sous{font-family:var(--sans);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-3);margin:clamp(1.6rem,3vw,2.2rem) 0 .3rem;padding-bottom:.6rem;border-bottom:1px solid var(--line-2)}
.dv-choix{margin-top:clamp(1.4rem,2.5vw,2rem)}
.dv-choix__t{font-family:var(--sans);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-3);margin:0 0 .3rem;padding-bottom:.6rem;border-bottom:1px solid var(--line-2)}
.dv-choix__t small{display:block;letter-spacing:.01em;text-transform:none;font-size:.82rem;margin-top:.5rem;line-height:1.6}

/* une ligne de la carte */
.dv-row{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem 1.1rem;align-items:start;padding:.95rem 0;border-bottom:1px solid var(--line);cursor:pointer;transition:background .3s var(--ease)}
.dv-row--unit{grid-template-columns:minmax(0,1fr) auto auto;cursor:default;align-items:center}
.dv-row input[type=checkbox],.dv-row input[type=radio]{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.dv-box,.dv-dot{width:16px;height:16px;border:1px solid var(--line-2);margin-top:.32rem;position:relative;flex:none;transition:background .3s var(--ease),border-color .3s var(--ease)}
.dv-dot{border-radius:50%}
.dv-box::after{content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;border:solid var(--paper);border-width:0 1.5px 1.5px 0;transform:rotate(45deg) scale(0);transition:transform .3s var(--ease)}
.dv-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--paper);transform:scale(0);transition:transform .3s var(--ease)}
.dv-row input:checked~.dv-box,.dv-row input:checked~.dv-dot{background:var(--ink);border-color:var(--ink)}
.dv-row input:checked~.dv-box::after{transform:rotate(45deg) scale(1)}
.dv-row input:checked~.dv-dot::after{transform:scale(1)}
.dv-row input:focus-visible~.dv-box,.dv-row input:focus-visible~.dv-dot{outline:2px solid var(--accent);outline-offset:2px}
.dv-row:hover .dv-box,.dv-row:hover .dv-dot{border-color:var(--ink)}
.dv-lab{min-width:0}
.dv-lab b{display:block;font-family:var(--serif);font-weight:400;font-size:1.12rem;line-height:1.3;color:var(--ink-2);transition:color .3s}
.dv-row input:checked~.dv-lab b,.dv-row--unit .dv-lab b{color:var(--ink)}
.dv-lab small{display:block;font-size:.82rem;color:var(--ink-3);line-height:1.6;margin-top:.2rem;text-wrap:pretty}
.dv-prix{font-family:var(--sans);font-size:.92rem;white-space:nowrap;text-align:right;padding-top:.15rem;color:var(--ink)}
.dv-prix em{display:block;font-style:normal;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-top:.15rem}
.dv-row--sans .dv-lab b{font-family:var(--sans);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);padding-top:.3rem}
.dv-row.is-offert .dv-prix{text-decoration:line-through;color:var(--ink-3)}
.dv-row.is-offert .dv-prix em{text-decoration:none}
.dv-row.is-offert .dv-prix em::before{content:"offerte · "}
@media(max-width:520px){
  .dv-row{grid-template-columns:auto minmax(0,1fr)}
  .dv-row .dv-prix{grid-column:2;text-align:left;padding-top:0;display:flex;gap:.5rem;align-items:baseline}
  .dv-row .dv-prix em{margin:0}
  .dv-row--unit{grid-template-columns:minmax(0,1fr) auto}
  .dv-row--unit .dv-prix{grid-column:1;grid-row:2}
  .dv-row--unit .dv-qty{grid-row:1/3;align-self:center}
}

/* le récapitulatif */
.dv-aside{border:1px solid var(--line-2);background:var(--paper);padding:clamp(1.5rem,2.5vw,2.1rem);display:grid;gap:1.2rem}
@media(min-width:1000px){.dv-aside{position:sticky;top:104px}}
.dv-aside__t{font-family:var(--sans);font-size:.63rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3);margin:0;display:flex;justify-content:space-between;align-items:center}
.dv-aside__x{display:none;font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);padding:.4rem 0}
.dv-recap{display:grid;gap:1.1rem;max-height:min(46vh,520px);overflow:auto;padding-right:.3rem;scrollbar-width:thin}
.dv-vide{font-size:.9rem;color:var(--ink-3);line-height:1.7;margin:0}
.dv-sec__t{font-family:var(--serif);font-size:1.05rem;color:var(--ink);margin:0 0 .3rem;padding-bottom:.35rem;border-bottom:1px solid var(--line-2)}
.dv-l{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:1px solid var(--line);font-size:.9rem}
.dv-l b{font-weight:400;display:block;line-height:1.35}
.dv-l small{display:block;font-size:.74rem;color:var(--ink-3);margin-top:.1rem}
.dv-l>span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums}
.dv-total{border-top:1px solid var(--ink);padding-top:1rem;display:grid;gap:.25rem}
.dv-total__l{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.dv-total__l span:first-child{font-family:var(--sans);font-size:.63rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-3)}
.dv-total__l b{font-family:var(--serif);font-weight:300;font-size:clamp(1.9rem,3vw,2.4rem);line-height:1;font-variant-numeric:tabular-nums}
.dv-total__pp{display:flex;justify-content:space-between;font-size:.85rem;color:var(--ink-3)}
.dv-total__pp b{font-weight:400;color:var(--ink)}
.dv-aside .btn{width:100%;justify-content:center}
.dv-aside__links{display:flex;flex-wrap:wrap;gap:1.2rem;justify-content:center;font-size:.62rem}
.dv-aside__links button{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);padding-bottom:.3rem;border-bottom:1px solid var(--line);transition:color .3s,border-color .3s}
.dv-aside__links button:hover{color:var(--ink);border-color:var(--ink)}
.dv-note{font-size:.76rem;color:var(--ink-3);line-height:1.6;margin:0}

/* sur mobile : une barre en bas, le volet monte par-dessus */
.dv-bar{display:none}
@media(max-width:999px){
  .dv-bar{position:fixed;left:0;right:0;bottom:68px;z-index:69;display:flex;align-items:center;justify-content:space-between;gap:1rem;
    padding:.8rem var(--pad);background:var(--paper);border-top:1px solid var(--line-2);box-shadow:0 -10px 34px rgba(12,13,16,.12);
    transition:transform .45s var(--ease),opacity .3s var(--ease);transform:translateY(160%);opacity:0}
  body.dv-visible .dv-bar{transform:none;opacity:1}
  body.has-modal .dv-bar,body.is-open .dv-bar{transform:translateY(160%);opacity:0}
  .dv-bar__t{display:grid;line-height:1.2}
  .dv-bar__t span{font-size:.56rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3)}
  .dv-bar__t b{font-family:var(--serif);font-weight:400;font-size:1.35rem}
  .dv-bar .btn{padding:.8rem 1.2rem;font-size:.62rem}
  .dv-aside{position:fixed;left:0;right:0;bottom:0;z-index:85;max-height:88svh;overflow:auto;transform:translateY(102%);
    transition:transform .5s var(--ease);box-shadow:0 -30px 80px rgba(12,13,16,.35);border-width:1px 0 0}
  .dv-aside.is-open{transform:none}
  .dv-aside__x{display:inline-block}
  .dv-recap{max-height:none;overflow:visible}
  body.has-devis{overflow:hidden}
  body.has-devis .callbar{transform:translateY(105%);opacity:0}
  body.has-devis::after{content:"";position:fixed;inset:0;background:rgba(12,13,16,.55);z-index:84}
}

/* la fenêtre de demande : aperçu du devis */
.modal__apercu{margin:0 0 1.2rem;padding:1rem;border:1px solid var(--line);font-size:.76rem;line-height:1.55;color:var(--ink-2);white-space:pre-wrap;max-height:180px;overflow:auto;font-family:var(--sans)}
.modal details{margin-bottom:1.4rem}
.modal summary{cursor:pointer;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);list-style:none}
.modal summary::-webkit-details-marker{display:none}
.modal summary::after{content:" +";}
.modal details[open] summary::after{content:" −"}
.modal details[open] summary{margin-bottom:.8rem}

/* fin de page épurée : le logo au-dessus des boutons */
.cta-logo{width:min(70vw,340px);margin:0 auto clamp(2.4rem,5vw,3.4rem);color:var(--paper)}
.cta-logo img{width:100%;height:auto}
/* cette fin de page se fond dans le pied de page : un seul logo pour les deux */
.cta-epure{padding-bottom:clamp(1.5rem,3vw,2.5rem)}
body:has(.cta-epure):not(:has(.pageview[hidden] .cta-epure)) .ftr{padding-top:clamp(2rem,4vw,3rem)}
body:has(.cta-epure):not(:has(.pageview[hidden] .cta-epure)) .ftr__logo{display:none}

/* la brochure traiteur, en libre accès */
.tb-broch{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:center}
@media(min-width:820px){.tb-broch{grid-template-columns:.9fr 1.1fr}}
.tb-broch__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}