:root{
    --ink:#1C1714; --parchment:#F4EFE6; --parchment2:#ECE4D5;
    --gold:#B08D4F; --blue:#5E7C93; --stone:#8A8175; --line:#DDD3C2;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth;overflow-x:hidden}
  body{font-family:'Montserrat',sans-serif;color:var(--ink);background:var(--parchment);margin:0;overflow-x:hidden;max-width:100%}
  .serif{font-family:'Cormorant Garamond',serif}
  /* ── Anti-débordement mobile : titres & textes se replient, jamais coupés ── */
  .chapter .inner h1, .chapter .inner h2, .chapter .inner p,
  .page-inner h1, .page-inner h2, .page-inner h3, .page-inner p,
  .avis-card-title, .avis-slide-quote, .splash-title{
    overflow-wrap:break-word; word-break:normal; hyphens:auto; max-width:100%;
  }
  img,video,svg,table{max-width:100%}
  .eyebrow{font-family:'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:.32em;font-weight:400;font-size:.72rem;color:var(--gold)}
  .eyebrow.light{color:#E8C98A}
  .rule{width:64px;height:1px;background:var(--gold);border:0;margin:1.1rem 0}
  .rule.center{margin-left:auto;margin-right:auto}
  /* ---- fullscreen chapters ---- */
  .chapter{position:relative;height:100svh;min-height:560px;overflow:hidden;display:flex;align-items:center}
  .chapter .bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.04);
    animation:kenburns 22s ease-in-out infinite alternate;will-change:transform}
  .chapter .scrim{position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(20,16,12,.42) 0%,rgba(20,16,12,.12) 38%,rgba(20,16,12,.20) 70%,rgba(20,16,12,.66) 100%)}
  .chapter .inner{position:relative;z-index:2;width:100%;max-width:1180px;margin:0 auto;padding:0 2rem;color:#fff}
  @keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.13)}}
  /* ---- reveal ---- */
  [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity 1s ease-out,transform 1s ease-out}
  [data-reveal].in{opacity:1;transform:none}
  .d1{transition-delay:.12s}.d2{transition-delay:.24s}.d3{transition-delay:.36s}.d4{transition-delay:.48s}
  /* ---- threshold (passage de porte) ---- */
  #seuil .bg{transform:scale(1.22);animation:none;transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
  #seuil.in .bg{transform:scale(1.02)}
  #seuil .scrim{background:radial-gradient(120% 90% at 50% 50%,rgba(20,16,12,.20) 0%,rgba(20,16,12,.62) 50%,rgba(20,16,12,.92) 100%);
    opacity:1;transition:opacity 1.6s ease}
  #seuil.in .scrim{opacity:.50}
  /* ---- nav ---- */
  header.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s,box-shadow .4s,padding .4s;padding:1.15rem 0}
  header.nav.solid{background:rgba(244,239,230,.92);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line);padding:.7rem 0}
  header.nav .wm{color:#fff;transition:color .4s}
  header.nav.solid .wm{color:var(--ink)}
  header.nav.solid .navlink{color:var(--ink)}
  .navlink{color:rgba(255,255,255,.92);text-decoration:none;font-size:.8rem;letter-spacing:.04em}
  .langbtn{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:none;border:0;cursor:pointer;
    color:inherit;opacity:.55;padding:.15rem .15rem}
  .langbtn.active{opacity:1;border-bottom:1px solid var(--gold)}
  header.nav .langbtn{color:#fff}header.nav.solid .langbtn{color:var(--ink)}
  /* ---- buttons ---- */
  .btn{display:inline-flex;align-items:center;gap:.6rem;padding:.95rem 1.8rem;border-radius:2px;font-size:.82rem;
    letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:all .25s;border:1px solid transparent}
  .btn-gold{background:var(--gold);color:#1c1714}
  .btn-gold:hover{background:#9c7c41;transform:translateY(-2px)}
  .btn-ghost{border-color:rgba(255,255,255,.6);color:#fff}
  .btn-ghost:hover{background:#fff;color:var(--ink)}
  /* ---- editorial sections ---- */
  .editorial{padding:7rem 2rem}
  .wrap{max-width:1180px;margin:0 auto}
  .facts{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--line)}
  @media(min-width:769px){.facts--wide{grid-template-columns:repeat(2,1fr)}}
  .fact{padding:1.6rem .5rem;border-bottom:1px solid var(--line)}
  .fact:nth-child(odd){border-right:1px solid var(--line);padding-right:1.5rem}
  .fact:nth-child(even){padding-left:1.5rem}
  .fact .n{font-family:'Cormorant Garamond',serif;font-size:2.4rem;line-height:1;color:var(--ink)}
  .fact .l{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);margin-top:.5rem}
  /* ---- réservation / calendrier ---- */
  .res-sync{display:inline-block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
    border:1px solid rgba(176,141,79,.35);padding:.5rem 1.2rem;border-radius:2px}
  .res-legend{display:flex;gap:1.6rem;justify-content:center;margin-bottom:2rem;font-size:.75rem;color:#b9b0a2;flex-wrap:wrap}
  .res-dot{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:.4rem;vertical-align:middle}
  .res-dot--avail{background:#3a5a3a}.res-dot--sel{background:var(--gold)}.res-dot--blocked{background:#5a3a3a}
  .res-cal{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:2rem}
  .res-month{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:3px;padding:1.2rem}
  .res-month-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
  .res-month-title{font-family:'Cormorant Garamond',serif;font-size:1.2rem;color:#fff;text-transform:capitalize}
  .res-nav-btn{background:none;border:1px solid rgba(255,255,255,.2);color:#fff;width:34px;height:34px;border-radius:2px;
    cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
  .res-nav-btn:hover{border-color:var(--gold);color:var(--gold)}
  .res-nav-btn[disabled]{opacity:.2;cursor:default}
  .res-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
  .res-dow{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:#706858;padding:.4rem 0}
  .res-day{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;
    font-size:.82rem;border-radius:2px;cursor:pointer;transition:all .15s;color:#d4cdc0;min-height:40px}
  .res-day:hover:not(.res-day--blocked):not(.res-day--empty):not(.res-day--past){background:rgba(176,141,79,.2)}
  .res-day--empty{cursor:default}
  .res-day--past{color:#4a4540;cursor:default}
  .res-day--blocked{background:rgba(90,58,58,.4);color:#8a6a6a;cursor:not-allowed;text-decoration:line-through}
  .res-day--arrival{background:var(--gold);color:var(--ink);font-weight:500;border-radius:2px 0 0 2px}
  .res-day--departure{background:var(--gold);color:var(--ink);font-weight:500;border-radius:0 2px 2px 0}
  .res-day--range{background:rgba(176,141,79,.25);color:#fff}
  .res-day--today{box-shadow:inset 0 0 0 1px var(--gold)}
  .res-recap{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:3px;padding:1.5rem;margin-bottom:1.5rem;text-align:center}
  .res-placeholder{color:#706858;font-size:.9rem;font-weight:300;margin:0}
  .res-recap-detail{display:flex;gap:2rem;justify-content:center;flex-wrap:wrap;color:#d4cdc0;font-size:.88rem}
  .res-recap-detail strong{color:#fff;font-weight:500}
  .res-form{margin-bottom:1.5rem}
  .res-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
  .res-form .field input,.res-form .field textarea{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.15);color:#EBE3D6}
  .res-form .field input:focus,.res-form .field textarea:focus{border-color:var(--gold);outline-color:var(--gold)}
  .res-form .field label{color:#b9b0a2}
  .res-ok{text-align:center;padding:2rem;background:rgba(58,90,58,.2);border:1px solid rgba(58,90,58,.4);border-radius:3px;margin-bottom:1.5rem}
  .res-ok p{color:#8abf8a;font-size:.95rem;margin:0}
  .res-reassure{text-align:center;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#706858;margin-top:1rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.06)}
  .field label{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-bottom:.5rem}
  .field input,.field textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:2px;padding:.8rem 1rem;
    font-family:inherit;font-size:.95rem;color:var(--ink)}
  .field input:focus,.field textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
  .vidnote{position:absolute;bottom:1.2rem;right:1.2rem;z-index:3;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
    color:rgba(255,255,255,.85);background:rgba(20,16,12,.5);padding:.4rem .7rem;border-radius:2px;display:flex;gap:.5rem;align-items:center}
  .chev{animation:bob 2s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}

  /* ---- focus-visible (accessibilité clavier) ---- */
  :focus-visible{outline:2px solid var(--gold);outline-offset:2px}
  a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}

  /* ---- video backgrounds (chapitres) ---- */
  video.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  #hero .bg{animation:none;transform:none}
  .herochev{position:absolute;bottom:2.2rem;left:50%;transform:translateX(-50%);z-index:3;color:#fff;text-decoration:none;text-align:center}
  .herochev span{display:block;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;opacity:.85;margin-bottom:.5rem}

  /* ---- splash choix de langue (prestige) ---- */
  .splash{position:fixed;inset:0;z-index:200;background:#0e0c0a;
    display:flex;align-items:center;justify-content:center;
    transition:opacity .7s ease, transform .7s ease}
  .splash.leaving{opacity:0;transform:scale(1.04);pointer-events:none}
  .splash-filigrane{position:absolute;width:min(70vw,480px);height:min(70vw,480px);
    color:rgba(176,141,79,.06);pointer-events:none}
  .splash-frame{position:relative;border:1px solid rgba(176,141,79,.3);padding:3.5rem 3rem;
    text-align:center;max-width:520px;width:calc(100% - 3rem);background:rgba(14,12,10,.6)}
  .splash-frame::before,.splash-frame::after{content:'';position:absolute;width:18px;height:18px;border-color:var(--gold);border-style:solid}
  .splash-frame::before{top:-1px;left:-1px;border-width:1px 0 0 1px}
  .splash-frame::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}
  .splash-eyebrow{font-family:'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:.32em;
    font-size:.62rem;color:var(--gold);margin:0 0 1rem;
    opacity:0;transform:translateY(14px);animation:splashIn .7s .3s ease forwards}
  .splash-title{font-weight:500;font-size:clamp(1.8rem,5vw,2.8rem);color:#fff;letter-spacing:.08em;margin:0;
    opacity:0;transform:translateY(14px);animation:splashIn .7s .5s ease forwards}
  .splash-rule{width:48px;height:1px;background:var(--gold);margin:1.2rem auto 1.6rem;
    opacity:0;animation:splashIn .7s .7s ease forwards}
  .splash-flags{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}
  .splash-flag{background:none;border:1px solid rgba(176,141,79,.25);border-radius:3px;
    padding:1rem 1.2rem;cursor:pointer;text-align:center;transition:all .3s;
    opacity:0;transform:translateY(14px);min-width:100px}
  .splash-flag:nth-child(1){animation:splashIn .6s .9s ease forwards}
  .splash-flag:nth-child(2){animation:splashIn .6s 1.05s ease forwards}
  .splash-flag:nth-child(3){animation:splashIn .6s 1.2s ease forwards}
  .splash-flag:nth-child(4){animation:splashIn .6s 1.35s ease forwards}
  .splash-flag:hover,.splash-flag:focus-visible{border-color:var(--gold);background:rgba(176,141,79,.1);transform:translateY(-3px)}
  .splash-flag-svg{width:42px;height:28px;border-radius:2px;display:block;margin:0 auto .6rem;box-shadow:0 1px 4px rgba(0,0,0,.3)}
  .splash-flag-label{font-family:'Montserrat',sans-serif;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75)}
  .splash-flag:hover .splash-flag-label{color:#fff}
  @keyframes splashIn{to{opacity:1;transform:translateY(0)}}

  /* ---- responsive ---- */
  @media (max-width:768px){
    .editorial{padding:4.5rem 1.5rem}
    .chapter .inner{padding:0 1.5rem}
    .navlink.hideon{display:none}
    #espaces .wrap{grid-template-columns:1fr!important;gap:2.5rem}
    .tente-grid{grid-template-columns:1fr!important;gap:2rem!important}
    .tarifs-table-wrap{overflow-x:auto}
    .tarifs-table th,.tarifs-table td{padding:.7rem .8rem;font-size:.82rem}
    .res-cal{grid-template-columns:1fr}
    .res-form-grid{grid-template-columns:1fr}
  }
  @media (max-width:600px){
    .facts{grid-template-columns:1fr}
    .fact:nth-child(odd){border-right:none;padding-right:.5rem}
    .fact:nth-child(even){padding-left:.5rem}
    .splash-frame{padding:2.5rem 1.5rem}
    .splash-flags{gap:1rem}
    .splash-flag{min-width:0;flex:1 1 calc(50% - .5rem);padding:.8rem .6rem}
  }

  /* ═══ Titres de chapitres / overlays — anti-débordement mobile ═══════════════
     PROBLÈME : les grands titres serif portent un font-size:clamp() EN STYLE
     INLINE ; sur petit écran le clamp retombe sur sa borne min (~30–32px) et le
     titre court d'un bord à l'autre (« coupé aux deux bords »), surtout en NL/DE.
     SOLUTION : sous 768px, on réduit la taille via un clamp plus doux et on
     autorise le repli. !important est REQUIS pour battre le font-size inline.
     La respiration latérale (~24px) est déjà fournie par le padding de .inner /
     .wrap, donc on n'ajoute pas de padding au titre (préserve l'alignement
     titre/texte dans les chapitres alignés à gauche). Desktop 100% inchangé. */
  @media (max-width:768px){
    .chapter .inner h1,
    .chapter .inner h2,
    #espaces h2, #tente h2, #tarifs h2, #temoignages h2, #reserver h2,
    .page-hero h1,
    .page-inner .editorial h2{
      font-size:clamp(1.5rem,7vw,2.6rem)!important;
      line-height:1.12!important;
      letter-spacing:0!important;
      white-space:normal;
      overflow-wrap:break-word;
      word-break:normal;
      hyphens:auto;
      max-width:100%;
    }
    /* Petits intitulés en capitales espacées (OUTSIDE, THE BEDROOMS, INSIDE…) :
       tracking réduit + repli autorisé pour tenir en NL/DE. */
    .eyebrow{letter-spacing:.16em;overflow-wrap:break-word;max-width:100%}
  }

  /* ═══ Médias plein écran des chapitres — cadrage propre en portrait ═══════════
     Les fonds de chapitre sont des vidéos 4K PAYSAGE (16:9). Sur écran vertical,
     object-fit:cover affiche une tranche centrée : un média paysage est TOUJOURS
     recadré en portrait (normal). On fige la hauteur en 100svh (pas 100vh) pour
     éviter les sauts dus aux barres du navigateur mobile, on centre le sujet, et
     on rend le point focal réglable par chapitre via --focal si besoin d'affiner.
     Pour supprimer le recadrage, il faudrait des versions PORTRAIT des médias
     (voir livrable). Mobile uniquement — desktop inchangé. */
  @media (max-width:768px){
    .chapter{height:100svh}
    .chapter video.bg{object-fit:cover;object-position:var(--focal,50% 50%)}
    /* Points focaux par chapitre — défaut centre ; ajuster ici si un sujet
       est décentré (ex. #chambres{--focal:50% 40%} pour remonter le cadrage). */
    #lieu{--focal:50% 50%}
    #interieur{--focal:50% 50%}
    #chambres{--focal:50% 50%}
    #dehors{--focal:50% 50%}
    /* Lisibilité des titres blancs sur médias clairs (chambres lumineuses) —
       ombre discrète, sans assombrir la scène ni casser l'immersif. */
    .chapter .inner h1,.chapter .inner h2,.chapter .inner p,.chapter .inner .eyebrow{
      text-shadow:0 1px 14px rgba(20,16,12,.42);
    }
  }

  /* ---- bande chiffres ---- */
  .chiffres{background:var(--ink);padding:3.5rem 2rem}
  .chiffres-grid{display:flex;justify-content:center;flex-wrap:wrap;gap:2.5rem 3.5rem;text-align:center}
  .chiffre-n{font-size:clamp(2rem,4vw,3rem);line-height:1;color:#fff;display:block}
  .chiffre-l{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-top:.4rem;display:block}

  /* ---- tableau tarifs ---- */
  .tarifs-table-wrap{overflow-x:auto;margin-top:2rem}
  .tarifs-table{width:100%;border-collapse:collapse;text-align:left}
  .tarifs-table th{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);
    padding:.8rem 1.2rem;border-bottom:2px solid var(--line);font-weight:400}
  .tarifs-table td{padding:1.1rem 1.2rem;border-bottom:1px solid var(--line);font-size:.95rem;color:var(--ink)}
  .tarifs-table td strong{color:var(--gold);font-weight:600}
  .tarifs-table tbody tr:hover{background:rgba(176,141,79,.06)}

  /* ---- en-tête bande chiffres ---- */
  .chiffres-head{text-align:center;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);
    margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid rgba(176,141,79,.2)}

  /* ---- détails tarifs (inclus / non inclus) ---- */
  .tarifs-details{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;text-align:left;margin-top:2.5rem;
    padding-top:2rem;border-top:1px solid var(--line)}
  .tarifs-col-title{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0 0 .8rem;font-weight:500}
  .tarifs-list{list-style:none;padding:0;margin:0}
  .tarifs-list li{font-size:.88rem;line-height:1.7;color:var(--stone);padding-left:1rem;position:relative}
  .tarifs-list li::before{content:'·';position:absolute;left:0;color:var(--gold);font-weight:700}
  @media(max-width:768px){.tarifs-details{grid-template-columns:1fr}}

  /* ---- bio équipe (histoire) ---- */
  .hist-person{margin-top:1.5rem}

  /* ---- reveal formulaire réservation (300ms) ---- */
  .res-form-reveal{max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease,opacity .3s ease}
  .res-form-reveal.active{max-height:700px;opacity:1}
  .res-note{text-align:center;margin-top:1rem;font-size:.78rem;letter-spacing:.08em;color:#706858;font-style:italic}

  /* ---- select (formulaire réservation) ---- */
  .field select{width:100%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:2px;
    padding:.8rem 1rem;font-family:inherit;font-size:.95rem;color:#EBE3D6;cursor:pointer;-webkit-appearance:none;appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23b9b0a2' stroke-width='2'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 1rem center}
  .field select:focus{border-color:var(--gold);outline:2px solid var(--gold);outline-offset:1px}
  .field select option{background:var(--ink);color:#EBE3D6}

  /* ---- dates readonly (fond légèrement différent) ---- */
  #res-dates{background:rgba(176,141,79,.12);border-color:rgba(176,141,79,.3);color:var(--gold);cursor:default}

  @media (max-width:768px){
    .chiffres-grid{gap:1.5rem 2rem}
    .chiffre-n{font-size:1.8rem}
  }
  @media (max-width:600px){
    .chiffres-grid{gap:1.2rem 1.5rem}
    .chiffre{flex:0 0 calc(33.33% - 1rem)}
  }

  /* ---- layout éditorial histoire ---- */
  .hist-layout{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;max-width:1060px}
  .hist-text{padding-top:.5rem}
  .hist-images figure img{box-shadow:0 4px 20px rgba(28,23,20,.1)}
  @media(max-width:768px){
    .hist-layout{grid-template-columns:1fr;gap:2.5rem}
    .hist-images{order:-1}
  }

  /* ---- pages légales (mentions / confidentialité) ---- */
  .legal-section{margin-top:2.2rem;padding-top:2.2rem;border-top:1px solid var(--line)}
  .legal-section:first-of-type{margin-top:1rem;padding-top:0;border-top:0}
  .legal-contact a:hover{text-decoration:underline}

  /* ---- pages internes (nav solid par défaut) ---- */
  .page-inner .nav{background:rgba(244,239,230,.92);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line);padding:.7rem 0}
  .page-inner .nav .wm{color:var(--ink)}
  .page-inner .nav .navlink{color:var(--ink)}
  .page-inner .nav .langbtn{color:var(--ink)}
  .navlink--active{color:var(--gold)!important;font-weight:500}
  .page-hero{background:var(--parchment)}

  /* ---- profils "Pour qui" (page éditoriale) ---- */
  .pq-profil{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--line)}
  .pq-profil:first-of-type{margin-top:1.5rem}

  /* ---- grille "Pour qui" (legacy, peut être supprimé) ---- */
  .pq-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
  .pq-card{background:#fff;border-radius:3px;overflow:hidden;border:1px solid var(--line);transition:transform .25s,box-shadow .25s}
  .pq-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(28,23,20,.1)}
  .pq-card-img{aspect-ratio:16/10;overflow:hidden}
  .pq-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
  .pq-card:hover .pq-card-img img{transform:scale(1.05)}
  .pq-card-body{padding:1.6rem 1.8rem 1.8rem}

  /* Carte vedette (pleine largeur) */
  .pq-card--featured{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;border-color:var(--gold)}
  .pq-card--featured .pq-card-img{aspect-ratio:auto;min-height:320px}
  .pq-card--featured .pq-card-body{display:flex;flex-direction:column;justify-content:center;padding:2.5rem 3rem}

  /* Clôture */
  .pq-cloture{text-align:center;margin-top:3.5rem;font-size:1rem;font-weight:300;color:var(--stone);font-style:italic;
    padding-top:2rem;border-top:1px solid var(--line)}

  @media (max-width:768px){
    .pq-grid{grid-template-columns:1fr}
    .pq-card--featured{grid-template-columns:1fr}
    .pq-card--featured .pq-card-img{min-height:220px}
    .pq-card--featured .pq-card-body{padding:1.6rem 1.8rem 1.8rem}
  }

  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
    .chapter .bg{animation:none;transform:scale(1.03)}
    [data-reveal]{opacity:1;transform:none}
    #seuil .bg{transform:scale(1.03)}
    .splash-eyebrow,.splash-title,.splash-rule,.splash-flag{opacity:1!important;transform:none!important;animation:none!important}
    .splash.leaving{display:none}
  }

  /* ============================================================
     Livre d'or — Avis publics (charte site, variables CSS)
     ============================================================ */
  .avis-stars{display:inline-flex;gap:2px;color:var(--gold)}
  .avis-stars .avis-star{width:18px;height:18px}
  .avis-avg{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;margin-top:1.4rem;color:var(--ink)}
  .avis-avg .avis-stars .avis-star{width:22px;height:22px}
  .avis-avg-num{font-size:1.1rem}
  .avis-avg-count{color:var(--stone);font-size:.95rem}

  /* Carrousel */
  .avis-carousel{position:relative;overflow:hidden}
  .avis-carousel-track{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1)}
  .avis-slide{flex:0 0 100%;min-width:100%;text-align:center;padding:1rem 1.5rem 0}
  .avis-slide .avis-stars{margin-bottom:1rem}
  .avis-slide-quote{font-size:clamp(1.2rem,2.6vw,1.7rem);font-weight:400;line-height:1.5;font-style:italic;color:var(--ink);max-width:640px;margin:0 auto 1.4rem}
  .avis-slide-author{display:flex;align-items:center;justify-content:center;gap:.8rem;color:var(--stone);font-size:.95rem}
  .avis-slide-author strong{color:var(--ink);font-weight:500;display:block}
  .avis-slide-author em{font-style:normal;font-size:.85rem}
  .avis-slide-photo{width:56px;height:56px;border-radius:50%;object-fit:cover;border:2px solid var(--line)}
  .avis-carousel-dots{display:flex;gap:.5rem;justify-content:center;margin-top:1.6rem}
  .avis-dot{width:9px;height:9px;border-radius:50%;border:none;background:var(--line);cursor:pointer;padding:0;transition:background .2s,transform .2s}
  .avis-dot.is-on{background:var(--gold);transform:scale(1.25)}
  .avis-source{display:inline-block;margin-top:.2rem;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--blue)}

  /* Formulaire de dépôt — carte élégante */
  .avis-deposit .wrap{max-width:720px}
  .avis-formcard{max-width:42rem;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 55px -24px rgba(28,23,20,.3);padding:2rem}
  .avis-card-head{text-align:center;margin-bottom:2rem}
  .avis-card-title{font-weight:500;font-size:clamp(1.6rem,4vw,2.4rem);margin-top:.15rem}
  .avis-card-lede{color:var(--stone);font-weight:300;font-size:.98rem;line-height:1.6;margin:.6rem auto 0;max-width:34rem}

  .avis-form{display:flex;flex-direction:column;gap:1.5rem}
  .avis-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
  .avis-field{display:flex;flex-direction:column;gap:.5rem}
  .avis-field--center{align-items:center;text-align:center}
  .avis-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
  .avis-label{font-size:.85rem;font-weight:600;letter-spacing:.01em;color:var(--ink)}
  .avis-opt{color:var(--stone);font-weight:400;text-transform:none;letter-spacing:0;margin-left:.35ch}

  .avis-input{width:100%;padding:.8rem 1rem;border:1.5px solid var(--line);border-radius:10px;background:#fff;font-family:inherit;font-size:1rem;color:var(--ink);transition:border-color .15s,box-shadow .15s}
  .avis-input::placeholder{color:var(--stone);opacity:.7}
  .avis-input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(176,141,79,.18)}
  textarea.avis-input{resize:vertical;min-height:7rem;line-height:1.6}

  /* Étoiles */
  .avis-rate{display:inline-flex;gap:.35rem}
  .avis-rate-star{background:none;border:none;cursor:pointer;padding:.15rem;color:var(--line);line-height:0;transition:color .12s,transform .12s}
  .avis-rate-star svg{width:2rem;height:2rem;display:block}
  .avis-rate-star.is-on{color:var(--gold)}
  .avis-rate-star:hover{transform:scale(1.1)}
  .avis-rate-star:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}

  /* Zone d'upload stylée */
  .avis-file-native{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
  .avis-drop{display:flex;align-items:center;justify-content:center;gap:.6rem;width:100%;padding:1.05rem;border:1.5px dashed var(--line);border-radius:10px;background:var(--parchment);color:var(--stone);font-size:.92rem;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
  .avis-drop:hover{border-color:var(--gold);color:var(--gold)}
  .avis-drop svg{width:1.4rem;height:1.4rem;flex-shrink:0}
  .avis-drop-name{font-weight:500;color:var(--ink)}
  .avis-file-native:focus-visible + .avis-drop{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 3px rgba(176,141,79,.18)}
  .avis-photo-preview{margin-top:.75rem;max-width:180px;border-radius:8px;border:1px solid var(--line)}

  /* Consentement */
  .avis-consent{display:flex;align-items:flex-start;gap:.75rem;font-size:.92rem;color:var(--ink);line-height:1.55;cursor:pointer}
  .avis-consent input{margin-top:.15rem;width:19px;height:19px;accent-color:var(--gold);flex-shrink:0;cursor:pointer}

  /* Bouton d'envoi */
  .avis-submit{width:100%;padding:.95rem 1rem;border:none;border-radius:10px;background:var(--gold);color:#fff;font-family:inherit;font-size:1rem;font-weight:600;letter-spacing:.02em;cursor:pointer;transition:opacity .15s,transform .1s}
  .avis-submit:hover{opacity:.9}
  .avis-submit:active{transform:scale(.985)}

  .avis-note{font-size:.85rem;color:var(--stone);text-align:center;margin-top:-.5rem}
  .avis-ok{text-align:center;padding:2.5rem 1.5rem;color:var(--ink);font-size:1.05rem;line-height:1.6}
  .avis-ok svg{color:var(--gold);margin-bottom:.75rem}
  @media (max-width:560px){
    .avis-grid-2{grid-template-columns:1fr}
    .avis-formcard{padding:1.5rem}
  }

  /* Grille de tous les avis */
  .avis-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}
  .avis-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:1.5rem;display:flex;flex-direction:column;gap:.85rem}
  .avis-card .avis-stars .avis-star{width:16px;height:16px}
  .avis-card-msg{font-size:.98rem;line-height:1.65;color:var(--ink);font-weight:300}
  .avis-card-photo{width:100%;max-height:220px;object-fit:cover;border-radius:6px}
  .avis-card-foot{margin-top:auto;display:flex;flex-direction:column;gap:.15rem}
  .avis-card-foot strong{color:var(--ink);font-weight:500}
  .avis-card-stay{font-size:.82rem;color:var(--stone)}
  @media (max-width:640px){
    .avis-slide{padding:1rem .5rem 0}
    .avis-grid{grid-template-columns:1fr}
  }

  /* --- Accessibilité : focus clavier visible --- */
  a:focus-visible,button:focus-visible,input:focus-visible,
  select:focus-visible,textarea:focus-visible,.btn:focus-visible,
  .langbtn:focus-visible,.navlink:focus-visible{
    outline:2px solid var(--gold);outline-offset:3px;border-radius:3px;
  }

  /* ═══ Menu mobile (burger) — injecté par app.js ═══ */
  .burger{display:none;background:none;border:0;cursor:pointer;color:#fff;padding:.35rem;line-height:0}
  header.nav.solid .burger,.page-inner .nav .burger{color:var(--ink)}
  .mobile-menu{position:fixed;inset:0;z-index:200;background:rgba(20,16,12,.5);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}
  .mobile-menu.open{opacity:1;visibility:visible}
  .mm-panel{position:absolute;top:0;right:0;height:100%;width:min(86vw,340px);max-width:100%;
    background:var(--parchment);box-shadow:-10px 0 40px rgba(0,0,0,.28);
    padding:4.6rem 1.6rem 2rem;display:flex;flex-direction:column;overflow-y:auto;
    transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1)}
  .mobile-menu.open .mm-panel{transform:translateX(0)}
  .mm-close{position:absolute;top:1.15rem;right:1.15rem;background:none;border:0;cursor:pointer;color:var(--ink);line-height:0;padding:.3rem}
  .mm-links{display:flex;flex-direction:column}
  .mm-links a{padding:.9rem .1rem;color:var(--ink);text-decoration:none;font-size:1.06rem;
    letter-spacing:.02em;border-bottom:1px solid var(--line)}
  .mm-links a.navlink--active{color:var(--gold)}
  .mm-links a.btn-gold{margin-top:1.4rem;border:0;border-bottom:0;text-align:center;color:#fff}
  .mm-langs{display:flex;gap:.55rem;margin-top:1.6rem}
  .mm-langs .langbtn{color:var(--ink);background:none;border:1px solid var(--line);
    padding:.45rem .8rem;border-radius:3px;cursor:pointer;font-size:.82rem;letter-spacing:.05em}
  .mm-langs .langbtn.active{background:var(--gold);color:#fff;border-color:var(--gold)}
  body.menu-open{overflow:hidden}
  /* Sur mobile : header = logo + burger uniquement.
     .header-langs a un display:flex INLINE → !important obligatoire pour le battre.
     Réserver est masqué du header (il reste dans le menu burger) pour garantir
     que le burger tienne à l'écran même en NL/DE (libellés plus longs) dès 320px. */
  @media(max-width:768px){
    .burger{display:inline-flex}
    header.nav nav .header-langs{display:none!important}
    header.nav nav a.btn-gold{display:none!important}
  }
  @media(min-width:769px){ .mobile-menu{display:none!important} }
  @media(prefers-reduced-motion:reduce){ .mobile-menu,.mm-panel{transition:none} }