/* ============================================================
   COLLECTION EN SECTIONS
   Chargé par index.html et escales.html.
   ============================================================ */

/* ============================================================
   LA COLLECTION EN SECTIONS – gravure et bouchée superposées
   Reprise du dispositif du site actuel : la gravure porte le lieu,
   la bouchée se pose dessus. Le voyage derrière, l'assiette devant.
   ============================================================ */
.escale-bloc{padding:clamp(44px,6vw,92px) 0;border-top:1px solid var(--ligne)}
.escale-bloc:first-child{border-top:none}
/* Colonnes égales : ces blocs alternent gauche/droite, une asymétrie ferait
   varier la taille du packshot d'une Escale à l'autre. */
.escale-bloc .dedans{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(26px,4vw,72px);align-items:center}
.escale-bloc.inverse .scene{order:2}
@media(max-width:900px){.escale-bloc .dedans{grid-template-columns:minmax(0,1fr);gap:22px}
  .escale-bloc .scene,.escale-bloc.inverse .scene{order:-1}}

.scene{position:relative;padding-bottom:34%}
.scene .grav{width:100%;display:block;opacity:.85}
.scene .bou{position:absolute;width:42%;left:40%;bottom:2%;z-index:1}
.scene .ass{position:absolute;width:64%;left:30%;bottom:0;z-index:1}
.scene .pla{position:absolute;width:78%;left:22%;bottom:0;z-index:1}
/* l'intuition : reprise à l'identique du site en production
   la gravure passe derrière et remonte, la bouchée reste dans le flux */
.intuition-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,100px);align-items:end}
.intuition-visual{position:relative;padding:0}
.intuition-visual .fond{position:absolute;right:4%;top:0;width:74%;opacity:.62;z-index:1;transform:translateY(-42%)}
.intuition-visual .produit{position:relative;z-index:2;width:min(86%,460px);margin:0 auto;display:block}
@media(max-width:900px){.intuition-grid{grid-template-columns:1fr}}

/* ---- blocs Escale : reprise du dispositif de production ---- */
.escale-visual{position:relative}
.escale-visual .monument{position:relative;display:block;width:100%;z-index:1;pointer-events:none;opacity:.62}
.escale-visual .produit{position:relative;z-index:2;width:min(74%,430px);margin-top:-26%}
/* la bouchée seule est plus petite qu'un plateau : elle remonte davantage */
.escale-visual.mg .produit{margin-left:2%;margin-right:auto}
.escale-visual.md .produit{margin-left:auto;margin-right:2%}
.escale-txt{position:relative;z-index:3}
.escale-txt .dest{display:flex;align-items:center;gap:18px;margin-bottom:18px;flex-wrap:wrap}
.escale-txt .dest .picto{width:76px;opacity:.85;flex:none}
.escale-txt .dest .nom{font-weight:500;font-size:clamp(34px,3.6vw,52px);letter-spacing:.14em;text-transform:uppercase;line-height:1}
.escale-txt .accent{display:block;width:56px;height:2px;margin:20px 0 24px}
.escale-txt .signature{font-style:italic;font-size:clamp(20px,1.8vw,25px);color:var(--kaki);margin-bottom:16px}
.escale-txt .desc{font-size:18px;line-height:1.75;color:rgba(33,48,31,.86);max-width:33em}
.sensations{display:flex;flex-wrap:wrap;align-items:center;row-gap:8px;margin-top:26px;font-family:var(--sans);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--kaki)}
.sensations span{white-space:nowrap}
.sensations .dot{color:var(--couleur,var(--or));margin:0 10px}
.decouvrir{display:inline-block;margin-top:28px;background:none;border:none;padding:0 0 4px;cursor:pointer;
  font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--vert);border-bottom:1px solid var(--couleur,var(--or))}
.decouvrir:hover{color:var(--couleur,var(--vert))}
@media(max-width:900px){
  .escale-bloc .dedans{grid-template-columns:minmax(0,1fr);gap:30px}
  .escale-bloc.inverse .escale-visual,.escale-bloc .escale-visual{order:-1}
}

.escale-txt .tete{display:flex;align-items:center;gap:16px}
.escale-txt .tete img{width:56px;height:auto;flex:0 0 auto}
.escale-txt h3{font-size:clamp(32px,4.2vw,58px);line-height:1;letter-spacing:.02em;color:var(--couleur)}
.escale-txt .filet{display:block;width:46px;height:1px;background:var(--couleur);margin:clamp(16px,2vw,24px) 0}
.escale-txt .gout{font-style:italic;font-size:clamp(20px,2vw,26px);line-height:1.35;color:var(--kaki);max-width:24em}
.escale-txt .dit{font-size:19px;line-height:1.62;color:rgba(33,48,31,.86);margin-top:16px;max-width:32em}
.escale-txt .marqueurs{display:flex;flex-wrap:wrap;gap:0;margin-top:22px;list-style:none}
.escale-txt .marqueurs li{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.18em;
  text-transform:uppercase;color:var(--kaki);border:none;padding:0;background:none}
.escale-txt .marqueurs li+li::before{content:'·';margin:0 12px;color:var(--couleur)}
.escale-txt .ouvrir{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(22px,2.6vw,30px);
  background:none;border:none;padding:0 0 4px;cursor:pointer;border-bottom:1px solid var(--couleur);
  font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--vert)}
.escale-txt .ouvrir .fl{color:var(--couleur);transition:transform .3s}
.escale-txt .ouvrir:hover .fl{transform:translateX(5px)}
.escale-txt .etiq-eph{display:inline-block;font-family:var(--sans);font-size:9.5px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--couleur);border:1px solid currentColor;
  padding:4px 9px;margin-bottom:14px}

