/* ==========================================================================
   ESPACE MABIN — 04 PAGES & COMPOSANTS
   Systeme de pages, carrousel de galerie, avis clients, page de reservation,
   bloc destination, corrections d'alignement.
   ========================================================================== */

/* ==========================================================================
   SYSTEME DE PAGES
   Une seule page HTML, mais un ecran a la fois : cliquer sur « Restauration »
   affiche la page Restauration, comme sur un site classique.
   ========================================================================== */
.page{display:none}
.page.is-active{display:block;animation:pageIn .42s var(--ease)}
@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.page.is-active{animation:none}}

/* Les pages internes commencent sous la navigation fixe */
.page:not(#page-accueil){padding-top:calc(var(--topbar-h) + var(--nav-h))}

/* Banniere de tete des pages internes */
.page-head{
  position:relative;overflow:hidden;
  background:var(--forest);
  padding:clamp(46px,6vw,84px) 0 clamp(38px,5vw,64px);
}
.page-head img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:.34;
}
.page-head::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,22,12,.55),rgba(10,22,12,.8));
}
.page-head .wrap{position:relative;z-index:2}
.page-head h1{
  color:var(--hero-ink);
  font-size:clamp(1.35rem,2vw,1.7rem);
  max-width:20ch;
}
.page-head .lead{color:rgba(246,245,236,.82);margin-top:12px}
.page-head .eyebrow{color:var(--gold-2)}

/* Fil d'Ariane */
.crumb{
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(246,245,236,.6);margin-bottom:16px;
}
.crumb button{color:rgba(246,245,236,.6);transition:color .2s}
.crumb button:hover{color:var(--gold-2)}
.crumb i{font-style:normal;opacity:.5}

/* ==========================================================================
   CORRECTIONS D'ALIGNEMENT
   Les cartes d'une meme rangee doivent finir a la meme hauteur, et les
   elements de pied (prix, liens) rester alignes entre eux.
   ========================================================================== */
.offers-grid,.rooms-grid,.evt-grid,.news-grid,.menu-grid{align-items:stretch}
.offer,.room,.evt,.news,.dish{height:100%}

/* Le lien de bas de carte se cale toujours en bas, quelle que soit la
   longueur du texte au-dessus. */
.offer-body > .link-arrow,
.news-body > .link-arrow,
.evt > .link-arrow{margin-top:auto;align-self:flex-start}
.offer-body .offer-price{margin-top:auto}
.offer-body .offer-price + .link-arrow{margin-top:14px}

/* Grilles d'egale hauteur pour les listes a puces des evenements */
.evt ul{flex:1}

/* Les entetes de section centres ne doivent pas heriter d'un alignement
   a gauche via .wrap. */
.sec-head.center{text-align:center}
.sec-head.center .eyebrow,
.sec-head.center h2,
.sec-head.center .lead{text-align:center}

/* Chiffres alignes partout ou ils se comparent */
.stat b,.rate-table td,.poi-dist,.offer-price b,.room-rate b,
.dish-price,.bkp-price b,.cart-total b,.rate-total b{font-variant-numeric:tabular-nums}

/* ==========================================================================
   GALERIE DEROULANTE
   ========================================================================== */
.gal{position:relative}
.gal-track{
  display:flex;gap:14px;
  overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding-bottom:12px;
  scrollbar-width:none;
}
.gal-track::-webkit-scrollbar{display:none}
.gal-item{
  flex:0 0 clamp(260px,32%,400px);
  scroll-snap-align:start;
  position:relative;overflow:hidden;
  aspect-ratio:3/2;
  border:0;padding:0;cursor:zoom-in;
  background:var(--surface-3);
}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.gal-item:hover img{transform:scale(1.06)}
.gal-item::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 52%,rgba(10,22,12,.78));
  opacity:.85;transition:opacity .3s;
}
.gal-item:hover::after{opacity:1}
.gal-cap{
  position:absolute;left:16px;right:16px;bottom:14px;z-index:2;
  color:#fff;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  text-align:left;
}

.gal-nav{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin-top:18px;
}
.gal-arrows{display:flex;gap:8px}
.gal-arrow{
  width:42px;height:42px;display:grid;place-items:center;
  border:1px solid var(--line-strong);color:var(--ink);
  font-size:1.05rem;
  transition:background-color .22s,border-color .22s,color .22s;
}
.gal-arrow:hover{background:var(--btn);border-color:var(--btn);color:var(--on-btn)}
.gal-arrow[disabled]{opacity:.3;pointer-events:none}
.gal-progress{flex:1;height:1px;background:var(--line);position:relative;max-width:320px}
.gal-progress i{
  position:absolute;left:0;top:0;bottom:0;
  background:var(--gold);transition:width .3s var(--ease),left .3s var(--ease);
}
.gal-count{
  font-size:.68rem;letter-spacing:.14em;color:var(--muted);
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
@media (max-width:640px){
  .gal-item{flex-basis:82%}
}

/* ==========================================================================
   AVIS CLIENTS
   ========================================================================== */
.avis-wrap{max-width:880px;margin-inline:auto}
.avis-hd{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:28px;padding-bottom:22px;
  border-bottom:1px solid var(--line);
}
.avis-hd-left h2{font-size:clamp(1.08rem,1.4vw,1.28rem);margin-bottom:8px}
.avis-hd-left p{font-size:.84rem;color:var(--muted);margin-bottom:8px}
.avis-hd-left a{
  font-size:.78rem;color:var(--gold);text-decoration:underline;
  text-underline-offset:3px;
}
.avis-hd-left a:hover{color:var(--forest)}
.avis-sc{text-align:center;flex-shrink:0}
.avis-sc-num{
  font-family:var(--serif);font-size:1.7rem;line-height:1;
  color:var(--gold);font-variant-numeric:tabular-nums;
}
.avis-sc-dots{color:var(--gold);font-size:.68rem;letter-spacing:3px;margin:6px 0}
.avis-sc-label{font-size:.63rem;color:var(--muted);line-height:1.5}

.avis-list{list-style:none;padding:0;margin:0}
.avis-item{
  display:flex;gap:16px;align-items:flex-start;
  padding:20px 0;border-bottom:1px solid var(--line-soft);
}
.avis-item:last-child{border-bottom:0}
.avis-av{
  width:44px;height:44px;flex:0 0 44px;border-radius:50%;
  border:1px solid var(--line);display:grid;place-items:center;
  overflow:hidden;background:var(--surface-2);
}
.avis-av svg{width:26px;height:26px;stroke:var(--muted);fill:none;stroke-width:1.4}
.avis-meta{flex:1;min-width:0}
.avis-top{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-bottom:7px}
.avis-stars{display:flex;gap:2px}
.avis-star{
  width:11px;height:11px;background:var(--gold);flex-shrink:0;
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
}
.avis-star.empty{background:var(--line-strong)}
.avis-name{font-size:.82rem;font-weight:600;color:var(--ink)}
.avis-ctx{font-size:.75rem;color:var(--muted)}
.avis-badge{
  font-size:.6rem;background:var(--gold-soft);color:var(--gold);
  border:1px solid transparent;padding:2px 8px;font-weight:600;
  letter-spacing:.04em;
}
.avis-text{font-size:.85rem;color:var(--muted);line-height:1.75}
@media (max-width:560px){
  .avis-hd{flex-direction:column;gap:18px}
  .avis-sc{text-align:left}
}

/* ==========================================================================
   PAGE DE RESERVATION (plein ecran, facon moteur hotelier)
   ========================================================================== */
.bkp{
  position:fixed;inset:0;z-index:960;
  background:var(--bg);
  overflow-y:auto;
  display:none;
}
.bkp.open{display:block}
.bkp-top{
  position:sticky;top:0;z-index:5;
  background:var(--forest);color:var(--hero-ink);
  padding:16px 0;
}
.bkp-top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}
.bkp-brand{display:flex;align-items:center;gap:12px}
.bkp-brand .brand-logo{height:46px;filter:drop-shadow(0 1px 10px rgba(246,245,236,.35))}
.bkp-brand .brand-mark{border-color:var(--gold-2);color:var(--gold-2)}
.bkp-brand b{font-family:var(--serif);font-size:1.05rem;font-weight:600;display:block}
.bkp-brand small{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;opacity:.7}
.bkp-close{
  width:40px;height:40px;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.3);color:#fff;font-size:1.1rem;
  transition:background-color .22s;
}
.bkp-close:hover{background:rgba(255,255,255,.15)}

.bkp-inner{
  display:grid;grid-template-columns:1fr 330px;
  gap:clamp(20px,3vw,38px);
  padding:clamp(24px,3.4vw,44px) 0 80px;
  align-items:start;
}

/* Rappel de recherche */
.bkp-search{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border:1px solid var(--line);background:var(--surface);
  padding:14px 18px;margin-bottom:14px;
  font-size:.8rem;color:var(--ink-2);
}
.bkp-search span{display:flex;align-items:center;gap:7px}
.bkp-search span b{font-weight:600}
.bkp-search em{color:var(--line-strong);font-style:normal}
.bkp-search button{
  margin-left:auto;padding:8px 18px;
  background:var(--forest);color:#fff;
  font-size:.62rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  transition:background-color .22s;
}
.bkp-search button:hover{background:var(--btn);color:var(--on-btn)}

.bkp-filters{
  display:flex;gap:20px;flex-wrap:wrap;
  margin-bottom:14px;font-size:.8rem;color:var(--muted);
}
.bkp-filter{display:flex;align-items:center;gap:7px;cursor:pointer}
.bkp-filter input{accent-color:var(--gold);cursor:pointer}
.bkp-count{font-size:.8rem;color:var(--muted);margin-bottom:16px}

/* Carte chambre */
.bkp-room{
  border:1px solid var(--line);background:var(--surface);
  display:grid;grid-template-columns:220px 1fr;gap:20px;
  padding:18px;margin-bottom:14px;
  transition:border-color .25s,box-shadow .25s;
}
.bkp-room:hover{border-color:var(--gold);box-shadow:var(--shadow-sm)}
.bkp-room-media{position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--surface-3)}
.bkp-room-media img{width:100%;height:100%;object-fit:cover}
.bkp-room-body{display:flex;flex-direction:column;min-width:0}
.bkp-room-name{font-family:var(--serif);font-size:1.02rem;margin-bottom:6px}
.bkp-room-meta{
  display:flex;gap:16px;flex-wrap:wrap;
  font-size:.8rem;color:var(--muted);margin-bottom:12px;
}
.bkp-room-meta span{display:flex;align-items:center;gap:6px}
.bkp-room-meta svg{width:14px;height:14px;stroke:var(--gold);fill:none;stroke-width:1.6;flex-shrink:0}
.bkp-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}

.bkp-price{margin-top:auto;padding-top:12px;border-top:1px solid var(--line-soft)}
.bkp-price-old{font-size:.75rem;color:var(--muted);text-decoration:line-through}
.bkp-price b{
  display:block;font-family:var(--serif);font-size:1.24rem;font-weight:600;
  color:var(--gold);line-height:1.2;
}
.bkp-price small{display:block;font-size:.68rem;color:var(--muted);margin-top:2px}
.bkp-room-foot{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;margin-top:14px;
}

/* Tarifs depliables */
.bkp-rates{display:none;grid-column:1/-1;margin-top:6px;gap:10px;flex-direction:column}
.bkp-room.open .bkp-rates{display:flex}
.bkp-rate{
  border:1px solid var(--line);padding:16px;cursor:pointer;
  display:flex;align-items:flex-start;gap:14px;
  transition:border-color .18s,background-color .18s;
}
.bkp-rate:hover{border-color:var(--gold)}
.bkp-rate.picked{border-color:var(--btn);background:var(--btn-soft)}
.bkp-radio{
  width:18px;height:18px;flex-shrink:0;margin-top:2px;
  border:2px solid var(--line-strong);border-radius:50%;
  display:grid;place-items:center;transition:border-color .18s;
}
.bkp-rate.picked .bkp-radio{border-color:var(--btn)}
.bkp-radio i{width:9px;height:9px;border-radius:50%;background:var(--btn);display:none}
.bkp-rate.picked .bkp-radio i{display:block}
.bkp-rate-main{flex:1;min-width:0}
.bkp-rate-name{font-size:.9rem;font-weight:600;margin-bottom:6px}
.bkp-rate-line{
  display:flex;align-items:center;gap:8px;
  font-size:.82rem;color:var(--muted);margin:3px 0;
}
.bkp-rate-line.ok{color:var(--ok)}
.bkp-rate-line span{flex-shrink:0}
.bkp-rate-right{text-align:right;flex-shrink:0}
.bkp-rate-right b{
  display:block;font-family:var(--serif);font-size:1.2rem;font-weight:600;color:var(--gold);
}
.bkp-rate-right small{font-size:.68rem;color:var(--muted)}

/* Recapitulatif lateral */
.bkp-side{
  position:sticky;top:calc(72px + 16px);
  border:1px solid var(--line);background:var(--surface);
  padding:22px;
}
.bkp-side h3{font-size:1.02rem;margin-bottom:4px}
.bkp-side-sub{font-size:.72rem;color:var(--muted);margin-bottom:18px}
.bkp-side-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:9px 0;font-size:.82rem;border-top:1px solid var(--line-soft);
}
.bkp-side-row:first-of-type{border-top:0}
.bkp-side-row span{color:var(--muted)}
.bkp-side-row b{font-weight:600;text-align:right}
.bkp-side-pick{
  display:flex;gap:12px;align-items:center;
  padding:12px 0;border-top:1px solid var(--line-soft);margin-top:6px;
}
.bkp-side-pick img{width:56px;height:42px;object-fit:cover;flex-shrink:0;background:var(--surface-3)}
.bkp-side-pick div{flex:1;min-width:0}
.bkp-side-pick b{display:block;font-size:.84rem}
.bkp-side-pick small{font-size:.7rem;color:var(--muted)}
.bkp-side-total{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  background:var(--forest);color:#fff;padding:14px 16px;margin:16px -22px 0;
}
.bkp-side-total span{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;opacity:.82}
.bkp-side-total b{font-family:var(--serif);font-size:1.4rem;font-weight:600;color:var(--gold-2)}
.bkp-side-note{font-size:.78rem;color:var(--muted);margin-top:12px;line-height:1.65}
.bkp-side .btn{margin-top:16px}

@media (max-width:960px){
  .bkp-inner{grid-template-columns:1fr}
  .bkp-side{position:static;order:-1}
  .bkp-side-total{margin-inline:-22px}
}
@media (max-width:600px){
  .bkp-room{grid-template-columns:1fr}
  .bkp-room-media{aspect-ratio:16/9}
}

/* ==========================================================================
   DESTINATION
   Le plan interactif dependait d'un service exterieur : bloque dans la
   version fichier unique, la zone restait vide. On utilise desormais la
   vue aerienne du domaine, toujours disponible, avec un lien vers le plan.
   ========================================================================== */
.dest-visual{
  position:relative;overflow:hidden;
  aspect-ratio:16/11;background:var(--surface-3);
  border:1px solid var(--line);
}
.dest-visual img{width:100%;height:100%;object-fit:cover}
.dest-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,22,12,.1) 40%,rgba(10,22,12,.72));
}
.dest-pin{
  position:absolute;left:50%;top:47%;z-index:3;
  transform:translate(-50%,-50%);
  width:20px;height:20px;border-radius:50%;
  background:var(--gold);border:3px solid #fff;
  box-shadow:0 0 0 0 rgba(176,134,55,.55);
  animation:pin 2.6s ease-out infinite;
}
@keyframes pin{
  0%{box-shadow:0 0 0 0 rgba(200,155,74,.6)}
  70%{box-shadow:0 0 0 26px rgba(200,155,74,0)}
  100%{box-shadow:0 0 0 0 rgba(200,155,74,0)}
}
@media (prefers-reduced-motion:reduce){.dest-pin{animation:none}}
.dest-label{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  padding:clamp(18px,2.6vw,28px);color:#fff;
}
.dest-label b{
  display:block;font-family:var(--serif);font-size:1.24rem;font-weight:600;
}
.dest-label span{font-size:.78rem;color:rgba(255,255,255,.8)}
.dest-label .btn{margin-top:14px}

/* ==========================================================================
   CARTE DU RESTAURANT
   Reprise de la carte imprimee : des familles de plats avec une fourchette
   de prix, et non des prix fermes plat par plat.
   ========================================================================== */
.carte-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(24px,3vw,36px)}
.carte-nav button{
  padding:9px 16px;border:1px solid var(--line);background:var(--surface);
  font-size:.63rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);transition:background-color .22s,color .22s,border-color .22s;
}
.carte-nav button:hover{border-color:var(--btn);color:var(--btn)}
.carte-nav button.on{background:var(--btn);border-color:var(--btn);color:var(--on-btn)}

.carte{display:grid;gap:clamp(18px,2.4vw,28px)}
.carte-cat{border:1px solid var(--line);background:var(--surface);overflow:hidden}

.carte-cat-head{display:grid;grid-template-columns:210px 1fr;align-items:stretch}
.carte-cat.sans-image .carte-cat-head{grid-template-columns:1fr}
.carte-cat-media{position:relative;overflow:hidden;background:var(--surface-3);min-height:150px}
.carte-cat-media img{width:100%;height:100%;object-fit:cover}
.carte-cat-txt{padding:clamp(18px,2.4vw,26px);display:flex;flex-direction:column;justify-content:center;gap:6px}
.carte-cat-txt h3{font-size:clamp(.98rem,1.2vw,1.08rem)}
.carte-cat-txt p{font-size:.8rem;color:var(--muted)}

.carte-corps{padding:0 clamp(18px,2.4vw,26px) clamp(18px,2.4vw,26px)}
.carte-fam + .carte-fam{margin-top:22px;padding-top:20px;border-top:1px solid var(--line-soft)}
.carte-fam-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-bottom:12px;
}
.carte-fam-nom{display:flex;align-items:center;gap:12px;min-width:0}
.carte-fam-vig{
  width:52px;height:38px;flex-shrink:0;
  object-fit:cover;background:var(--surface-3);
}
.carte-fam-head h4{
  font-family:var(--display);font-size:.92rem;font-weight:600;
  letter-spacing:.01em;
}
.carte-fam-head small{font-size:.74rem;color:var(--muted);font-weight:400}
.carte-prix{
  font-size:.86rem;font-weight:600;color:var(--gold);
  white-space:nowrap;font-variant-numeric:tabular-nums;
}

.carte-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:2px}
.carte-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 0;font-size:.85rem;color:var(--ink-2);
  border-bottom:1px solid var(--line-soft);text-align:left;
  transition:color .18s;
}
.carte-item:hover{color:var(--btn)}
.carte-item span{flex:1;min-width:0}
.carte-item i{
  font-style:normal;flex-shrink:0;
  width:22px;height:22px;display:grid;place-items:center;
  border:1px solid var(--line);color:var(--muted);font-size:.9rem;
  transition:background-color .18s,border-color .18s,color .18s;
}
.carte-item:hover i{background:var(--btn);border-color:var(--btn);color:var(--on-btn)}

.carte-bbq{
  display:flex;align-items:flex-start;gap:14px;
  margin-top:clamp(24px,3vw,36px);padding:18px 20px;
  background:var(--surface-2);border-left:3px solid var(--gold);
  font-size:.88rem;color:var(--ink-2);line-height:1.7;
}
.carte-bbq span{color:var(--gold);font-size:1.1rem;line-height:1;flex-shrink:0}

@media (max-width:720px){
  .carte-cat-head{grid-template-columns:1fr}
  .carte-cat-media{min-height:0;aspect-ratio:16/9}
}

/* Total en fourchette : il n'existe pas de prix ferme avant la commande */
.sel-total{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:16px 18px;background:var(--forest);color:#fff;
}
.sel-total span{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;opacity:.82}
.sel-total b{font-family:var(--display);font-size:1.16rem;font-weight:600;color:var(--gold-2);white-space:nowrap}

/* Hebergement deja reserve sur les dates demandees */
.bkp-room.est-pris{opacity:.55;background:var(--surface-2)}
.bkp-room.est-pris:hover{border-color:var(--line);box-shadow:none}
.bkp-room.est-pris .bkp-room-media{filter:grayscale(1)}
.bkp-indispo{
  font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--danger);border:1px solid var(--danger);
  padding:8px 14px;white-space:nowrap;
}

/* ==========================================================================
   RAPPEL FLOTTANT DE LA SELECTION (page Restauration)
   La carte fait 83 plats : sans ce rappel, on ajoute un plat et plus rien ne
   le confirme a l'ecran. Il reste en bas de la fenetre, au-dessus du contenu.
   ========================================================================== */
.cart-flottant{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  display:flex;justify-content:center;
  padding:14px var(--gutter) calc(14px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,transparent,rgba(10,22,12,.28) 42%);
  pointer-events:none;                 /* seul le bouton reste cliquable */
  animation:cartMonte .3s var(--ease);
}
.cart-flottant[hidden]{display:none}
.cart-flottant .btn{
  pointer-events:auto;
  box-shadow:0 10px 34px rgba(10,22,12,.34);
  gap:14px;
}
.cart-flottant .btn b{
  font-weight:600;padding-left:14px;
  border-left:1px solid rgba(255,255,255,.34);
  font-variant-numeric:tabular-nums;
}
@keyframes cartMonte{from{transform:translateY(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.cart-flottant{animation:none}}

/* Duree annoncee sur la vignette : le visiteur sait ce qu'il engage avant
   de lancer un telechargement de plusieurs megaoctets. */
.video-duree{
  position:absolute;top:12px;right:12px;z-index:3;
  background:rgba(10,22,12,.82);color:var(--gold-2);
  font-size:.6rem;font-weight:600;letter-spacing:.12em;
  font-variant-numeric:tabular-nums;
  padding:5px 10px;
}

/* ==========================================================================
   AVIS EN VIDEO
   Deux temoignages verticaux, au-dessus des avis ecrits.
   ========================================================================== */
.avis-videos-bloc{padding-bottom:26px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.avis-videos-bloc h3{font-size:1rem;margin:4px 0 20px}
.avis-videos{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(14px,2.4vw,26px);
}
.avis-video{margin:0}
.avis-video figcaption{margin-top:11px;line-height:1.5}
.avis-video figcaption b{display:block;font-size:.8rem;font-weight:600;color:var(--ink)}
.avis-video figcaption span{display:block;font-size:.7rem;color:var(--muted);margin-top:2px}
@media (max-width:560px){
  .avis-videos{grid-template-columns:1fr}
}