@font-face{font-family:"Marcellus";src:url(fonts/marcellus-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(fonts/source-sans-3-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(fonts/source-sans-3-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(fonts/source-sans-3-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  --chaux:#f4f7f6;      /* murs blanchis à la chaux */
  --blanc:#ffffff;
  --encre:#15263b;      /* texte */
  --gris:#4d5d70;       /* texte secondaire */
  --porte:#1b4c8c;      /* bleu des portes de Djerba */
  --porte-fonce:#123866;
  --lagon:#1aa0ae;      /* eau du lagon, accent rare */
  --sable:#e8dcc4;      /* sable, pierre du Fortin */
  --trait:#d7dfe3;
  --display:"Marcellus",Georgia,serif;
  --texte:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mesure:68ch;
  --gouttiere:clamp(16px,4vw,48px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--chaux);color:var(--encre);font-family:var(--texte);font-size:1.0625rem;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--porte);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--porte-fonce);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--lagon);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--porte);color:#fff;padding:.5rem 1rem;z-index:10}
.skip:focus{left:8px}
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--gouttiere)}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.15;letter-spacing:.005em;margin:0}
h1{font-size:clamp(2.1rem,1.4rem + 3vw,3.6rem);max-width:20ch}
h2{font-size:clamp(1.45rem,1.2rem + 1vw,1.9rem);margin:2.4rem 0 .8rem}
p,ul{margin:0 0 1rem;max-width:var(--mesure)}
.lead{font-size:clamp(1.15rem,1.05rem + .4vw,1.3rem);line-height:1.55;color:var(--gris);margin-top:1.1rem}
ul.liste{padding-left:1.1rem}
ul.liste li{margin:.25rem 0;padding-left:.3rem}
ul.liste li::marker{color:var(--lagon)}

/* En-tête */
.entete{background:var(--blanc);border-bottom:1px solid var(--trait)}
.entete .wrap{display:flex;align-items:center;gap:1.5rem;min-height:72px}
.marque{font-family:var(--display);font-size:1.55rem;color:var(--encre);text-decoration:none;white-space:nowrap}
.marque:hover{color:var(--porte)}
.nav{margin-left:auto;display:flex;align-items:center;gap:.2rem}
.nav a{color:var(--encre);text-decoration:none;padding:.5rem .6rem;border-radius:4px;font-size:.98rem;white-space:nowrap}
.nav a:hover{color:var(--porte);background:var(--chaux)}
.nav a[aria-current=page]{color:var(--porte);box-shadow:inset 0 -2px 0 var(--porte);border-radius:0}
.langue{margin-left:.6rem;font-weight:600;font-size:.9rem;color:var(--porte);text-decoration:none;border:1px solid var(--trait);padding:.3rem .6rem;border-radius:4px;white-space:nowrap}
.langue:hover{border-color:var(--porte)}
.menu-btn{display:none;align-items:center;gap:.5rem;margin-left:.6rem;font:600 .95rem var(--texte);color:var(--encre);background:transparent;border:1px solid var(--trait);border-radius:4px;padding:.4rem .7rem;cursor:pointer}
.burger{display:inline-grid;gap:3px;width:16px}
.burger i{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform .25s,opacity .25s}
.entete.ouvert .burger i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.entete.ouvert .burger i:nth-child(2){opacity:0}
.entete.ouvert .burger i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
@media (max-width:1040px){
  .js .entete{position:relative;z-index:20}
  .js .entete .wrap{flex-wrap:nowrap}
  .js .menu-btn{display:inline-flex}
  .js .langue{margin-left:auto}
  .js .nav{display:none;position:absolute;top:100%;left:0;right:0;margin:0;width:auto;flex-direction:column;align-items:stretch;gap:0;background:var(--blanc);padding:.4rem var(--gouttiere) 1.2rem;border-bottom:1px solid var(--trait);box-shadow:0 18px 30px -18px rgba(21,38,59,.35);-webkit-mask-image:none;overflow:visible}
  .js .entete.ouvert .nav{display:flex}
  .js .nav a{padding:.85rem 0;font-size:1.15rem;border-bottom:1px solid var(--trait);border-radius:0}
  .js .nav a:last-child{border-bottom:0}
  .js .nav a[aria-current=page]{box-shadow:none;color:var(--porte);font-weight:600}
}
@media (max-width:1040px){
  html:not(.js) .entete .wrap{flex-wrap:wrap;gap:0;padding-top:.6rem}
  html:not(.js) .nav{order:3;width:100%;margin:0 calc(var(--gouttiere)*-1);padding:0 var(--gouttiere) .2rem;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}
  html:not(.js) .nav::-webkit-scrollbar{display:none}
  html:not(.js) .langue{margin-left:auto}
}

/* Accueil : l'arche */
.accueil{padding:clamp(2.5rem,6vw,5rem) 0 clamp(3rem,6vw,5rem)}
.accueil .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.accueil h1{font-size:clamp(2.6rem,1.6rem + 4.5vw,5rem);max-width:12ch}
.arche{margin:0;justify-self:center;width:min(100%,420px);aspect-ratio:405/495;border-radius:999px 999px 6px 6px;overflow:hidden;background:var(--sable);box-shadow:0 0 0 10px var(--blanc),0 0 0 11px var(--trait)}
.arche img{width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:no-preference){
  .arche img{animation:lever 1.6s cubic-bezier(.2,.7,.2,1) both}
  @keyframes lever{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
}
@media (max-width:760px){
  .accueil .wrap{grid-template-columns:1fr}
  .arche{width:min(78%,340px);order:-1}
}

/* Chiffres */
.chiffres{background:var(--sable)}
.chiffres .wrap{padding-top:2.2rem;padding-bottom:2.2rem}
.chiffres dl{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem 2rem}
.chiffres dl>div{border-left:2px solid var(--porte);padding-left:1rem}
.chiffres dt{font-family:var(--display);font-size:clamp(1.9rem,1.5rem + 1.5vw,2.6rem);line-height:1}
.chiffres dt small{font-size:.5em;margin-left:.3em;font-family:var(--texte);font-weight:600;color:var(--gris)}
.chiffres dd{margin:.4rem 0 0;color:var(--gris);font-size:.98rem;line-height:1.4}
@media (max-width:760px){.chiffres dl{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Visite (liste des étapes) */
.visite{padding:clamp(3rem,6vw,5rem) 0}
.visite h2{margin-top:0}
.visite ol{list-style:none;margin:1.6rem 0 0;padding:0;border-top:1px solid var(--trait);max-width:none}
.visite li a{display:grid;grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:.2rem 2rem;align-items:baseline;padding:1.05rem 0;border-bottom:1px solid var(--trait);text-decoration:none;color:var(--encre)}
.visite li a strong{font-family:var(--display);font-weight:400;font-size:1.35rem;color:var(--porte)}
.visite li a span{color:var(--gris)}
.visite li a:hover strong{text-decoration:underline;text-underline-offset:.2em}
@media (max-width:640px){.visite li a{grid-template-columns:1fr}}

/* Pages intérieures */
.page-tete{padding-top:clamp(2.5rem,6vw,4.5rem);padding-bottom:1.5rem}
.contenu{padding-bottom:3rem}
.contenu .colonne{max-width:var(--mesure)}
.grande-image{margin:2rem 0}
.grande-image img{width:100%;max-width:820px;border-radius:4px}
.aquarelle{margin:1rem 0 1rem;max-width:min(560px,100%);mix-blend-mode:multiply}
.page-tete + .contenu .grande-image{margin-top:.5rem}

/* Suite de la visite */
.suite{border-top:1px solid var(--trait);margin-top:2.5rem;padding-top:1.4rem;max-width:var(--mesure)}
.suite span{display:block;color:var(--gris);font-size:.95rem}
.suite a{font-family:var(--display);font-size:1.5rem;text-decoration:none}
.suite a:hover{text-decoration:underline}

/* Bandeau contact */
.appel{background:var(--porte);color:#fff}
.appel .wrap{padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2.5rem,5vw,4rem);display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:2rem;align-items:end}
.appel h2{margin:0 0 .8rem;color:#fff;max-width:26ch}
.appel p{color:#dbe6f4;margin:0}
.bouton{display:inline-block;background:var(--blanc);color:var(--porte);font-weight:600;text-decoration:none;padding:.85rem 1.4rem;border-radius:999px;border:2px solid var(--blanc);font-size:1rem;cursor:pointer;font-family:var(--texte)}
.bouton:hover{background:transparent;color:#fff}
.bouton.plein{background:var(--porte);border-color:var(--porte);color:#fff}
.bouton.plein:hover{background:var(--porte-fonce);border-color:var(--porte-fonce);color:#fff}
@media (max-width:760px){.appel .wrap{grid-template-columns:1fr}.appel .bouton{justify-self:start}}

/* Plan de masse */
.plan{display:grid;grid-template-columns:minmax(0,13.5rem) minmax(0,17rem) minmax(0,1fr);gap:clamp(1rem,2.5vw,2rem);align-items:start;margin-top:1rem}
.zones{list-style:none;margin:0;padding:0;max-width:none}
.zones button{all:unset;box-sizing:border-box;display:block;width:100%;padding:.55rem .8rem;border-left:3px solid transparent;cursor:pointer;color:var(--encre);border-radius:0 4px 4px 0;line-height:1.35}
.zones button:hover{background:var(--blanc)}
.zones button[aria-pressed=true]{border-left-color:var(--lagon);background:var(--blanc);color:var(--porte);font-weight:600}
.zones button:focus-visible{outline:3px solid var(--lagon);outline-offset:-3px}
.plan-carte{position:relative;margin:0;border-radius:6px;overflow:hidden;background:var(--blanc);border:1px solid var(--trait);box-shadow:0 10px 30px -18px rgba(21,38,59,.45)}
.plan-carte img{width:100%;display:block}
.repere{all:unset;position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:var(--blanc);border:3px solid var(--porte);box-sizing:border-box;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .2s,background .2s}
.repere:hover{transform:scale(1.25)}
.repere:focus-visible{outline:3px solid var(--lagon);outline-offset:2px}
.repere.actif{background:var(--porte);border-color:var(--blanc);transform:scale(1.35);z-index:2}
@media (prefers-reduced-motion:no-preference){.repere.actif::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid var(--blanc);animation:onde 1.6s ease-out infinite}}
@keyframes onde{from{opacity:.9;transform:scale(.6)}to{opacity:0;transform:scale(1.6)}}
.plan-vue{margin:0;position:sticky;top:1rem}
.plan-cadre{background:var(--blanc);border-radius:6px;overflow:hidden;border:1px solid var(--trait);display:grid;place-items:center}
.plan-cadre img{width:100%;transition:opacity .25s}
.plan-vue figcaption{font-family:var(--display);font-size:1.3rem;color:var(--porte);margin-top:.7rem}
.indication{color:var(--gris);font-size:.95rem}
@media (max-width:1000px){
  .plan{grid-template-columns:minmax(0,15rem) minmax(0,1fr)}
  .zones{grid-column:1/-1;display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.3rem;scrollbar-width:thin}
  .zones li{flex:0 0 auto}
  .zones button{border:1px solid var(--trait);border-radius:999px;padding:.45rem .9rem;background:var(--blanc);white-space:nowrap}
  .zones button[aria-pressed=true]{border-color:var(--porte);background:var(--porte);color:#fff}
}
@media (max-width:600px){
  .plan{grid-template-columns:minmax(0,1fr)}
  .plan-carte{width:min(100%,300px);justify-self:center}
  .plan-vue{position:static;order:-1;grid-row:2}
  .zones{grid-row:1}
  .plan-carte{grid-row:3}
}

/* Album */
.galerie{list-style:none;margin:1.5rem 0 0;padding:0;columns:3 280px;column-gap:1.1rem;max-width:none}
.galerie li{break-inside:avoid;margin:0 0 1.2rem}
.galerie .legende{display:block;padding:.45rem .1rem 0;color:var(--gris);font-size:.95rem}

/* Images agrandissables */
.zoom{all:unset;display:block;cursor:zoom-in;width:100%;border-radius:6px;overflow:hidden;background:var(--sable);position:relative}
.zoom img{width:100%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.zoom:hover img{transform:scale(1.03)}
.zoom:focus-visible{outline:3px solid var(--lagon);outline-offset:3px}
.zoom::after{content:"";position:absolute;right:.6rem;bottom:.6rem;width:2rem;height:2rem;border-radius:50%;background:rgba(255,255,255,.88) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b4c8c' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='M11 8v6M8 11h6M16 16l4 4'/%3E%3C/svg%3E") center/1.1rem no-repeat;opacity:0;transition:opacity .2s}
.zoom:hover::after,.zoom:focus-visible::after{opacity:1}
@media (hover:none){.zoom::after{opacity:.9;width:1.7rem;height:1.7rem}}

/* Visionneuse */
dialog.visionneuse{border:0;padding:0;margin:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;background:rgba(9,20,35,.96);color:#fff;overflow:hidden}
dialog.visionneuse::backdrop{background:rgba(9,20,35,.96)}
dialog.visionneuse[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto}
.v-haut{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:max(.7rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) .4rem max(1rem,env(safe-area-inset-left));position:relative;z-index:2}
.v-compteur{font-variant-numeric:tabular-nums;color:#c7d2de;font-size:.95rem}
.v-outils{display:flex;gap:.4rem}
.visionneuse button{appearance:none;border:0;background:rgba(255,255,255,.1);color:#fff;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:background .2s}
.visionneuse button:hover{background:rgba(255,255,255,.22)}
.visionneuse button:disabled{opacity:.35;cursor:default;background:rgba(255,255,255,.1)}
.visionneuse button:focus-visible{outline:3px solid var(--lagon);outline-offset:2px}
.visionneuse svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.v-scene{position:relative;overflow:hidden;touch-action:none;display:grid;place-items:center;user-select:none;-webkit-user-select:none}
.v-img{max-width:calc(100vw - 2rem);max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:4px;transform-origin:center center;will-change:transform;cursor:zoom-in;-webkit-user-drag:none}
.v-img.zoome{cursor:grab}
.v-img.glisse{cursor:grabbing}
.v-img.anime{transition:transform .28s cubic-bezier(.2,.7,.2,1),opacity .28s}
.v-fleche{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:52px!important;height:52px!important}
.v-prec{left:max(1rem,env(safe-area-inset-left))}
.v-suiv{right:max(1rem,env(safe-area-inset-right))}
.v-fleche svg{width:26px;height:26px}
.v-legende{margin:0 auto;padding:.6rem 1rem 0;text-align:center;font-size:1.05rem;max-width:60ch}
.v-aide{margin:0 auto;padding:.2rem 1rem max(.9rem,env(safe-area-inset-bottom));text-align:center;color:#9fb0c3;font-size:.85rem}
@media (hover:hover) and (pointer:fine){.v-aide{display:none}.v-legende{padding-bottom:1.2rem}}
@media (max-width:640px){.v-fleche{top:auto;bottom:calc(5.2rem + env(safe-area-inset-bottom));transform:none;width:46px!important;height:46px!important;background:rgba(255,255,255,.16)}.v-img{max-width:100vw;border-radius:0}}
@media (prefers-reduced-motion:reduce){.v-img.anime{transition:none}}

/* Formulaire */
.formulaire{max-width:640px;margin-top:1rem}
.champ{margin:0 0 1.2rem}
.champ label,.formulaire legend{display:block;font-weight:600;margin-bottom:.35rem}
.champ input,.champ textarea{width:100%;font:inherit;color:var(--encre);background:var(--blanc);border:1px solid #b9c5cd;border-radius:4px;padding:.7rem .8rem}
.champ input:focus,.champ textarea:focus{border-color:var(--porte);outline:3px solid rgba(26,160,174,.35);outline-offset:0}
.champ textarea{min-height:9rem;resize:vertical}
.aide{color:var(--gris);font-size:.93rem;margin:.3rem 0 0}
fieldset{border:0;margin:0 0 1.4rem;padding:0}
.choix{display:flex;gap:.6rem;align-items:flex-start;margin:.35rem 0}
.choix input{margin-top:.35rem;accent-color:var(--porte);width:1.05rem;height:1.05rem}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media (max-width:560px){.deux{grid-template-columns:1fr}}
.pot{position:absolute;left:-5000px}
.message{padding:1rem 1.2rem;border-radius:4px;margin:0 0 1.5rem;max-width:640px}
.message.ok{background:#e3f4ef;border-left:4px solid #1f8a63}
.message.erreur{background:#fbeaea;border-left:4px solid #b3261e}
.message[hidden]{display:none}
.confidentialite{color:var(--gris);font-size:.93rem}

/* Plan du site */
.plan-site{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem;max-width:760px}
.plan-site ul{list-style:none;padding:0}
.plan-site li{padding:.35rem 0;border-bottom:1px solid var(--trait)}
@media (max-width:560px){.plan-site{grid-template-columns:1fr}}

/* Pied */
.pied{background:var(--encre);color:#c7d2de;font-size:.95rem}
.pied .wrap{padding-top:2rem;padding-bottom:2rem;display:flex;flex-wrap:wrap;gap:.8rem 2rem;align-items:center}
.pied a{color:#fff}
.pied .marque{color:#fff;font-size:1.25rem}
.pied .droite{margin-left:auto;display:flex;gap:1.5rem;flex-wrap:wrap}
.ecrire{margin:-.2rem 0 1.6rem}.ecrire a{font-weight:600}

/* Têtes de page illustrées */
.page-tete.avec-image{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.mini-arche{margin:0;width:clamp(170px,20vw,250px);aspect-ratio:405/495;border-radius:999px 999px 6px 6px;overflow:hidden;background:var(--sable);box-shadow:0 0 0 8px var(--blanc),0 0 0 9px var(--trait);max-width:100%}
.mini-arche img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){
  .page-tete.avec-image{grid-template-columns:1fr}
  .mini-arche{order:-1;width:120px;box-shadow:0 0 0 6px var(--blanc),0 0 0 7px var(--trait)}
}

/* Illustrations dans le texte */
.colonne::after{content:"";display:block;clear:both}
.fig-large{margin:2.4rem 0;width:min(980px,calc(100vw - 2*var(--gouttiere)))}
.fig-large figcaption,.fig-cote figcaption,.trio figcaption{color:var(--gris);font-size:.93rem;margin-top:.55rem}
.fig-cote{margin:.4rem 0 1.4rem 2rem;float:right;width:min(46%,330px)}
@media (min-width:1180px){.fig-cote{width:300px;margin-right:calc(-300px - 4rem)}}
@media (max-width:700px){.fig-cote{float:none;width:100%;max-width:440px;margin:1.6rem 0}}
.citation{margin:2.2rem 0;padding:0 0 0 clamp(2.4rem,5vw,3.4rem);position:relative;max-width:34rem}
.citation::before{content:"“";position:absolute;left:0;top:-.35em;font-family:var(--display);font-size:clamp(4.5rem,8vw,6rem);line-height:1;color:var(--lagon);opacity:.55}
.citation p{font-family:var(--display);font-size:clamp(1.45rem,1.15rem + 1.2vw,2rem);line-height:1.3;color:var(--porte);margin:0 0 .5rem}
.citation cite{font-style:normal;color:var(--gris);font-size:.95rem}
.deco{display:block;width:min(420px,80%);margin:2.4rem 0 1.4rem;opacity:.9}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;margin:2.4rem 0 1rem}
.trio figure{margin:0}
.trio .zoom{aspect-ratio:4/3}
.trio .zoom img{height:100%;object-fit:cover}
@media (max-width:760px){
  .trio{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.4rem;margin-right:calc(var(--gouttiere)*-1);padding-right:var(--gouttiere)}
  .trio figure{scroll-snap-align:start}
}
.grande-image .zoom{max-width:820px}

/* Visite : vignettes */
.visite li a{grid-template-columns:auto minmax(0,15rem) minmax(0,1fr);align-items:center}
.vignette{width:52px;height:64px;object-fit:cover;border-radius:999px 999px 3px 3px;background:var(--sable)}
@media (max-width:640px){.visite li a{grid-template-columns:auto minmax(0,1fr);gap:.1rem 1rem}.visite li a .vignette{grid-row:span 2}}

/* Bandeau contact : dessin de façade */
.appel{position:relative;overflow:hidden}
.appel .wrap{position:relative;z-index:1}
.appel .trait{position:absolute;right:max(-60px,-4vw);bottom:-12px;width:min(560px,62%);opacity:.2;pointer-events:none;z-index:0}
@media (max-width:760px){.appel .trait{width:90%;right:-20%;opacity:.12}}

/* Ajustements responsive */
@media (max-width:480px){
  body{font-size:1rem}
  .accueil{padding-top:1.8rem}
  .chiffres dl{gap:1.2rem 1rem}
  .chiffres div,.chiffres dl>div{padding-left:.7rem}
  .formulaire .bouton{width:100%;text-align:center}
}
.ornement{float:right;width:150px;margin:.2rem 0 1rem 1.5rem;mix-blend-mode:multiply}
@media (min-width:1180px){.ornement{margin-right:calc(-150px - 8rem)}}
@media (max-width:900px){.chiffres dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
.appel .wrap{grid-template-columns:minmax(0,40rem);align-items:start;gap:1.6rem}
.appel .bouton{justify-self:start}

/* Chiffres : une arcade de quatre arches */
.chiffres{background:var(--chaux);padding:0}
.chiffres .wrap{padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:0}
.chiffres dl.arcade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.6rem,1.6vw,1.4rem);margin:0;border-bottom:2px solid var(--sable);padding:0 clamp(0rem,1vw,1rem)}
.chiffres dl.arcade>div{border:1px solid var(--trait);border-bottom:0;border-radius:999px 999px 0 0;background:var(--blanc);padding:clamp(2.2rem,4vw,3.2rem) 1rem 1.6rem;text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:inset 0 -14px 24px -24px rgba(21,38,59,.35)}
.chiffres dt{display:flex;flex-direction:column;align-items:center;gap:.15rem}
.chiffres .nombre{font-family:var(--display);font-size:clamp(2rem,1.4rem + 2.2vw,3.1rem);line-height:1;color:var(--porte);font-variant-numeric:lining-nums}
.chiffres .unite{font-size:.85rem;font-weight:600;letter-spacing:.08em;color:var(--lagon)}
.chiffres dd{margin:.8rem 0 0;color:var(--gris);font-size:.95rem;line-height:1.4;max-width:15ch}
@media (max-width:760px){.chiffres dl.arcade{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:0}.chiffres dl.arcade>div:nth-child(-n+2){border-bottom:2px solid var(--sable)}}