@font-face{
  font-family:'PoliceTitre';
  src:url('police-titre.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'PoliceLibelle';
  src:url('police-libelle.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
}

:root{
  --encre:#1F2733;              /* texte courant — encre bleutée */
  --encre-douce:#4F5A69;        /* texte secondaire — jamais plus clair que ça */
  --fond:#F7F3EA;               /* le lin */
  --fond-alt:#EBE3D5;           /* le grain de la nappe : sections alternées */
  --carte:#FFFDF8;              /* les panneaux */
  --marque:#7E5714;             /* laiton patiné : boutons, filets, montants */
  --marque-fonce:#64430D;       /* survol — mesuré, pas calculé */
  --filet:#DAD0BC;              /* filets et bordures : décor, jamais du texte */
  --wa:#25d366;                 /* vert WhatsApp : texte FONCÉ dessus, jamais blanc */

  --nuit:#16202E;               /* bleu de nuit */
  --nuit-2:#0E1622;             /* un cran plus profond : le pied */
  --creme:#F4F0E6;              /* texte sur nuit */
  --creme-doux:#B7BFCA;         /* texte secondaire sur nuit */
  --laiton:#D7A94F;             /* l'accent du sombre : la clé, les surtitres */
  --laiton-clair:#EAC782;       /* l'accent des surfaces de verre */
  --bois:#B98A55;               /* le bois du casier — filets et fonds, jamais de texte */

  --texte-bouton:#fff;
  --ruban-fond:var(--marque);
  --ruban-texte:#fff;

  --barre:color-mix(in srgb,var(--nuit) 85%,transparent);
  --barre-filet:color-mix(in srgb,var(--creme) 16%,transparent);
  --barre-texte:var(--creme);
  --barre-texte-doux:var(--creme-doux);
  --barre-accent:var(--laiton-clair);

  --police-texte:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --police-titre:'PoliceTitre',"Book Antiqua",Palatino,Georgia,"Times New Roman",serif;
  --police-libelle:'PoliceLibelle',"Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;

  --rayon:12px;
  --rayon-bouton:10px;
  --largeur:1120px;
  --demi-largeur:560px;         /* la moitié de --largeur : sert à poser l'ourlet */
  --gouttiere:clamp(1rem,3vw,2rem);
  --hauteur-bandeau:78svh;

  --ombre:0 1px 2px color-mix(in srgb,var(--nuit) 8%,transparent),
          0 12px 28px color-mix(in srgb,var(--nuit) 14%,transparent);
  --ombre-levee:0 1px 2px color-mix(in srgb,var(--nuit) 8%,transparent),
          0 18px 40px color-mix(in srgb,var(--nuit) 20%,transparent);
  --liseret:rgba(255,255,255,.9);           /* bord HAUT des blocs clairs */
  --liseret-nuit:rgba(255,255,255,.10);     /* bord HAUT des blocs sombres */

  --fil:color-mix(in srgb,var(--encre) 5%,transparent);
  --fil-fort:color-mix(in srgb,var(--encre) 9%,transparent);
  --fil-ourlet:var(--filet);
  --fil-ourlet-pale:color-mix(in srgb,var(--filet) 55%,transparent);
  --bord-lumiere:color-mix(in srgb,var(--nuit) 5%,transparent);

  --lumiere-bord:linear-gradient(90deg,
    var(--bord-lumiere) 0%,transparent 22%,transparent 78%,var(--bord-lumiere) 100%);
}

:root,.sejour,.pied{
  --tissage:
    radial-gradient(128% 82% at 16% 0%,var(--fil-fort) 0%,transparent 64%)
      0 0/100% 100% no-repeat,
    radial-gradient(112% 74% at 88% 100%,var(--fil) 0%,transparent 68%)
      0 0/100% 100% no-repeat;
  --ourlet:
    linear-gradient(90deg,
      var(--fil-ourlet) 0%,
      color-mix(in srgb,var(--fil-ourlet) 46%,transparent) 13%,
      color-mix(in srgb,var(--fil-ourlet) 14%,transparent) 29%,
      transparent 44%,transparent 56%,
      color-mix(in srgb,var(--fil-ourlet) 14%,transparent) 71%,
      color-mix(in srgb,var(--fil-ourlet) 46%,transparent) 87%,
      var(--fil-ourlet) 100%)
      0 0/100% 100% no-repeat;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  font-family:var(--police-texte);
  font-size:clamp(1rem,.95rem + .2vw,1.08rem);   /* jamais sous 16px */
  line-height:1.62;
  color:var(--encre);
  background:var(--ourlet),var(--tissage),var(--lumiere-bord),var(--fond);
  -webkit-font-smoothing:antialiased;
}
img,svg,video{max-width:100%;height:auto;display:block}
figure{margin:0;max-width:100%}   /* une image cassée ne fait pas déborder la page */

h1,h2,h3{font-family:var(--police-titre);font-weight:400;line-height:1.12;
  margin:0 0 .6em;text-wrap:balance}
h1{font-size:clamp(2.5rem,1.4rem + 4.6vw,4.6rem);letter-spacing:-.012em}
h2{font-size:clamp(1.75rem,1.15rem + 2.4vw,2.75rem);letter-spacing:-.008em}
h3{font-size:clamp(1.1rem,1.02rem + .45vw,1.35rem)}
p{margin:0 0 1em}
.perron__intro,.contact__phrase,.service p,.sejour__texte,.intro-section{max-width:60ch}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
main a:not(.bouton):not(.plaque):not(.entree):not(.cadre__lien){
  text-decoration:underline;text-underline-offset:.15em}
main a[href^="tel:"]:not(.bouton):not(.plaque),
main a[href^="mailto:"]:not(.bouton):not(.plaque){display:inline-block;padding-block:.25rem}
:focus-visible{outline:3px solid var(--marque);outline-offset:2px;border-radius:2px}
.perron :focus-visible,.sejour :focus-visible,.pied :focus-visible,.entete :focus-visible{
  outline-color:var(--laiton)}

.bande{width:100%;max-width:var(--largeur);margin-inline:auto;padding-inline:var(--gouttiere)}

.saut-contenu{position:absolute;top:-6rem;left:.5rem;z-index:50;background:var(--carte);
  color:var(--encre);padding:.6rem 1rem;border-radius:var(--rayon);box-shadow:var(--ombre)}
.saut-contenu:focus{top:.5rem}

.ruban{margin:0;padding:.5rem var(--gouttiere);text-align:center;font-size:.85rem;
  font-family:var(--police-libelle);
  background:var(--ruban-fond);color:var(--ruban-texte)}                     /* 6,44 */
.ruban a,.pied a{display:inline-block;padding-block:.2rem;text-decoration:underline}

.pastille{display:inline-block;margin:0 0 1rem;
  padding:.34rem .8rem;border-radius:999px;
  border:1px solid var(--filet);
  background:color-mix(in srgb,var(--fond-alt) 60%,transparent);
  font-family:var(--police-libelle);font-weight:600;font-size:.68rem;
  text-transform:uppercase;letter-spacing:.2em;
  color:var(--encre-douce)}                                                  /* 5,50 */
.pastille--nuit{border-color:color-mix(in srgb,var(--laiton) 40%,transparent);
  background:color-mix(in srgb,var(--laiton) 12%,transparent);
  color:var(--laiton)}                                                       /* 7,56 */
.pastille--verre{border-color:color-mix(in srgb,var(--laiton-clair) 42%,transparent);
  background:color-mix(in srgb,var(--creme) 10%,transparent);
  color:var(--laiton-clair)}                                                 /* 6,11 pire cas */

.trait{display:block;height:3px;width:min(184px,100%);margin-top:8px;
  background:linear-gradient(90deg,var(--marque) 0 48px,var(--filet) 48px 100%);
  transform-origin:left}
.entete-section--centre .trait{margin-inline:auto;transform-origin:center;
  background:linear-gradient(90deg,var(--filet) 0 calc(50% - 24px),
    var(--marque) calc(50% - 24px) calc(50% + 24px),var(--filet) calc(50% + 24px) 100%)}
.sejour .trait,.pied .trait{
  background:linear-gradient(90deg,var(--laiton) 0 48px,
    color-mix(in srgb,var(--laiton) 26%,transparent) 48px 100%)}
.sejour .entete-section--centre .trait,.pied .entete-section--centre .trait{
  background:linear-gradient(90deg,color-mix(in srgb,var(--laiton) 26%,transparent) 0 calc(50% - 24px),
    var(--laiton) calc(50% - 24px) calc(50% + 24px),
    color-mix(in srgb,var(--laiton) 26%,transparent) calc(50% + 24px) 100%)}

.entete-section{margin-bottom:clamp(1.5rem,3.5vw,2rem)}
.entete-section h2{margin:0}
.entete-section--centre{text-align:center}
.intro-section{margin:1rem 0 0;color:var(--encre-douce);font-size:1.02rem}   /* 6,32 */
.entete-section--centre .intro-section{margin-inline:auto}

.bouton{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:48px;padding:.8rem 1.5rem;border:0;border-radius:var(--rayon-bouton);
  font-family:var(--police-libelle);font-size:.88rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;text-align:center;cursor:pointer;
  white-space:nowrap;font-variant-numeric:lining-nums tabular-nums;
  transition:background .24s ease,box-shadow .24s ease,transform .24s ease;
}
.bouton--plein{
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--marque) 88%,white) 0%,var(--marque) 100%);
  color:var(--texte-bouton);                                                 /* 6,44 */
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),var(--ombre)}
.bouton--plein:hover,.bouton--plein:focus-visible{
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--marque-fonce) 88%,white) 0%,var(--marque-fonce) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),var(--ombre-levee)}         /* 8,93 */
.bouton--wa{background:var(--wa);color:#11221a}   /* blanc sur #25d366 = 1,98:1 : texte foncé */
.bouton--wa:hover,.bouton--wa:focus-visible{
  background:color-mix(in oklab,var(--wa) 88%,black)}
.mobile-seulement{display:inline-flex}
@media (min-width:48rem){.mobile-seulement{display:none}}

.plaque{
  display:flex;flex-direction:column;gap:2px;min-height:56px;
  padding:.7rem 1.1rem;border-radius:var(--rayon);
  background:linear-gradient(180deg,var(--carte) 0%,
    color-mix(in srgb,var(--fond-alt) 45%,var(--carte)) 100%);
  border:1px solid var(--filet);
  box-shadow:inset 0 1px 0 var(--liseret),var(--ombre);
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}
.plaque:hover,.plaque:focus-visible{
  box-shadow:inset 0 1px 0 var(--liseret),var(--ombre-levee);
  border-color:color-mix(in srgb,var(--marque) 40%,var(--filet))}
.plaque__libelle{font-family:var(--police-libelle);font-weight:600;font-size:.66rem;
  text-transform:uppercase;letter-spacing:.18em;color:var(--encre-douce)}    /* 6,89 */
.plaque__num{font-family:var(--police-libelle);font-weight:600;
  font-size:clamp(1.15rem,1rem + .6vw,1.45rem);letter-spacing:.01em;
  font-variant-numeric:lining-nums tabular-nums;
  color:var(--marque)}                                                       /* 6,34 */
.plaque--nuit{background:linear-gradient(180deg,
    color-mix(in srgb,var(--creme) 12%,transparent) 0%,
    color-mix(in srgb,var(--creme) 6%,transparent) 100%);
  border-color:color-mix(in srgb,var(--creme) 24%,transparent);
  box-shadow:inset 0 1px 0 var(--liseret-nuit),var(--ombre)}
.plaque--nuit:hover,.plaque--nuit:focus-visible{
  border-color:color-mix(in srgb,var(--laiton-clair) 55%,transparent);
  box-shadow:inset 0 1px 0 var(--liseret-nuit),var(--ombre-levee)}
.plaque--nuit .plaque__libelle{color:var(--creme-doux)}                      /* 5,32 pire cas */
.plaque--nuit .plaque__num{color:var(--laiton-clair)}                        /* 6,11 pire cas */
.plaques{display:grid;gap:12px}
@media (min-width:34rem){.plaques{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}}

.verre{
  border-radius:var(--rayon);
  border:1px solid rgba(255,255,255,.14);
  background:color-mix(in srgb,var(--nuit) 84%,transparent);
  box-shadow:inset 0 1px 0 var(--liseret-nuit),
             0 1px 2px rgba(0,0,0,.18),0 24px 60px rgba(0,0,0,.42);
  color:var(--creme);
}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .verre{-webkit-backdrop-filter:blur(16px) saturate(1.15);
    backdrop-filter:blur(16px) saturate(1.15)}
}

.entete{position:sticky;top:0;z-index:30;
  background:var(--barre);
  border-bottom:1px solid var(--barre-filet);
  box-shadow:0 14px 34px -22px rgba(0,0,0,.8)}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .entete{-webkit-backdrop-filter:blur(16px) saturate(1.15);
    backdrop-filter:blur(16px) saturate(1.15)}
}
.entete::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,var(--laiton) 0 30%,
    color-mix(in srgb,var(--laiton) 45%,transparent) 30% 58%,transparent 58% 100%);
  opacity:.85;pointer-events:none}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  flex-wrap:wrap;min-height:66px;padding-block:.5rem}
.marque{display:flex;flex-direction:column;line-height:1.15;min-width:0;flex:1 1 0}
.marque__nom{font-family:var(--police-titre);
  font-size:clamp(.95rem,.8rem + .7vw,1.2rem);
  letter-spacing:.02em;color:var(--barre-texte);                             /* 9,06 pire cas */
  overflow-wrap:break-word}
.marque__sous{font-family:var(--police-libelle);font-weight:600;font-size:.66rem;
  color:var(--barre-accent);                                                 /* 6,38 pire cas */
  text-transform:uppercase;letter-spacing:.18em;margin-top:3px}

#nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:48px;height:48px;padding:0 12px;background:none;
  border:1px solid var(--barre-filet);border-radius:var(--rayon-bouton);
  cursor:pointer;flex:none}
.nav-toggle__trait{display:block;height:2px;background:var(--barre-accent);border-radius:1px}

#nav-links{display:flex;flex-direction:column;gap:2px;width:100%;flex-basis:100%;
  padding-bottom:.6rem;border-top:1px solid var(--barre-filet);
  padding-top:.5rem;margin-top:.35rem}
#nav-links a{display:flex;align-items:center;min-height:46px;padding:.5rem .25rem;
  font-family:var(--police-libelle);font-weight:600;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.13em;
  color:var(--barre-texte-doux);                                             /* 5,56 pire cas */
  transition:color .2s ease}
#nav-links a:hover,#nav-links a:focus-visible{color:var(--barre-texte)}
#nav-links a.bouton{justify-content:center;letter-spacing:.1em;
  color:var(--texte-bouton);margin-top:.4rem}
.js #nav-links{display:none}
.js #nav-links.is-open{display:flex}

@media (min-width:62rem){
  #nav-toggle{display:none}
  #nav-links,.js #nav-links{display:flex;flex-direction:row;align-items:center;
    gap:clamp(.9rem,2vw,1.8rem);width:auto;flex-basis:auto;padding-bottom:0;
    border-top:0;padding-top:0;margin-top:0}
  .marque{flex:0 1 auto}
  #nav-links a{padding:.5rem .3rem}
  #nav-links a.bouton{margin-top:0;padding:.7rem 1.3rem;min-height:44px}
  #nav-links li:not(:last-child) a{position:relative}
  #nav-links li:not(:last-child) a::after{content:"";position:absolute;
    left:.3rem;right:.3rem;bottom:.5rem;height:2px;background:var(--barre-accent);
    transform:scaleX(0);transform-origin:left;transition:transform .26s ease}
  #nav-links li:not(:last-child) a:hover::after,
  #nav-links li:not(:last-child) a:focus-visible::after{transform:scaleX(1)}
}

.perron{position:relative;display:flex;align-items:flex-end;
  min-height:min(var(--hauteur-bandeau),44rem);
  padding-block:clamp(3rem,9vw,5rem) clamp(5rem,12vw,7rem);
  background:var(--nuit)}
.perron__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center 55%}
.perron__voile{position:absolute;inset:0;
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--nuit) 62%,transparent) 0%,
    color-mix(in srgb,var(--nuit) 30%,transparent) 38%,
    color-mix(in srgb,var(--nuit) 78%,transparent) 100%)}
.perron__bande{position:relative;z-index:2;width:100%}
.perron__panneau{max-width:46rem;padding:clamp(1.5rem,4vw,2.5rem);
  animation:verre-monte .7s cubic-bezier(.2,.75,.25,1) both}
@keyframes verre-monte{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes paraitre{from{opacity:0}to{opacity:1}}

.perron__titre{margin:0;color:var(--creme);line-height:1.06}                 /* 8,68 pire cas */
.perron__accent{display:block;font-family:var(--police-titre);line-height:1.06;
  font-size:clamp(2.5rem,1.4rem + 4.6vw,4.6rem);letter-spacing:-.012em;
  color:var(--laiton-clair);margin:0 0 1rem;text-wrap:balance}               /* 6,11 pire cas */
.perron__intro{color:var(--creme-doux);font-size:1.05rem;margin:1rem 0 0}    /* 5,32 pire cas */
.perron__appel{margin-top:1.5rem;max-width:22rem}

.tableau{position:relative;z-index:3;
  padding-top:clamp(2.25rem,5vw,3.25rem);
  padding-bottom:clamp(2rem,5vw,3rem)}

.tableau__plaque{position:relative;display:grid;
  gap:clamp(1.25rem,3vw,1.75rem);
  padding:clamp(1.1rem,3vw,1.6rem);
  border-radius:var(--rayon);
  border:1px solid color-mix(in srgb,var(--bois) 44%,transparent);
  background:color-mix(in srgb,var(--bois) 20%,var(--nuit));
  box-shadow:inset 0 1px 0 var(--liseret-nuit),var(--ombre-levee)}
.tableau__plaque::before{content:"";position:absolute;
  left:var(--rayon);right:var(--rayon);top:0;height:3px;
  background:linear-gradient(90deg,var(--laiton) 0 40%,
    color-mix(in srgb,var(--laiton) 35%,transparent) 40% 100%);
  border-radius:0 0 2px 2px}
@media (min-width:52rem){
  .tableau__plaque{padding:clamp(1.4rem,3.2vw,2.1rem) clamp(1.6rem,4vw,2.6rem)}
}

.tableau__entrees{display:grid;list-style:none;margin:0;padding:0;align-self:center}
.tableau__entrees li + li .entree{
  border-top:1px solid color-mix(in srgb,var(--laiton) 24%,transparent)}
@media (min-width:52rem){
  .tableau__entrees{grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:clamp(1.75rem,4vw,2.75rem)}
  .tableau__entrees li + li .entree{border-top:0;
    border-left:1px solid color-mix(in srgb,var(--laiton) 24%,transparent);
    padding-left:clamp(1.75rem,4vw,2.75rem)}
  .entree:hover,.entree:focus-visible{padding-left:calc(clamp(1.75rem,4vw,2.75rem))}
  .tableau__entrees li:first-child .entree:hover,
  .tableau__entrees li:first-child .entree:focus-visible{padding-left:.45rem}
}
.entree{display:block;text-decoration:none;color:var(--creme);
  padding:clamp(.9rem,2.2vw,1.15rem) 0;
  transition:padding-left .24s ease}
.entree:hover,.entree:focus-visible{padding-left:.45rem}
.entree__sur{font-family:var(--police-libelle);font-weight:600;font-size:.66rem;
  text-transform:uppercase;letter-spacing:.2em;color:var(--laiton);          /* 5,05 */
  margin:0 0 .35rem}
.entree h2{font-size:clamp(1.35rem,1.1rem + 1vw,1.8rem);margin:0 0 .4rem;
  color:var(--creme)}                                                        /* 9,64 */
.entree__texte{margin:0;color:var(--creme-doux);font-size:.95rem}            /* 5,91 */
.entree__fleche{display:flex;align-items:center;gap:.6rem;margin-top:.8rem;
  font-family:var(--police-libelle);font-weight:600;font-size:.72rem;
  text-transform:uppercase;letter-spacing:.16em;color:var(--laiton)}         /* 5,05 */
.entree__fleche i{display:block;height:2px;width:24px;background:var(--laiton);
  transition:width .26s ease}
.entree:hover .entree__fleche i,.entree:focus-visible .entree__fleche i{width:44px}

.table{position:relative;padding-block:clamp(2.25rem,5vw,3.5rem) clamp(3rem,8vw,5.5rem);
  background:transparent}
.table__grille{display:grid;gap:clamp(1.5rem,4vw,3rem)}
@media (min-width:62rem){
  .table__grille{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:stretch}
  .table__visuel{margin-top:clamp(3rem,7vw,5rem);display:flex}
  .table__visuel img{height:100%;min-height:20rem;object-fit:cover}
}

.panneau{position:relative;background:var(--carte);
  border:1px solid var(--filet);border-radius:var(--rayon);
  padding:clamp(1.75rem,4vw,3rem) clamp(1.25rem,3.5vw,2.5rem);
  box-shadow:inset 0 1px 0 var(--liseret),var(--ombre)}

.services{display:grid;margin-top:clamp(1.25rem,3vw,1.75rem)}
.service{display:grid;grid-template-columns:auto minmax(0,1fr);
  column-gap:clamp(.75rem,2.2vw,1.1rem);
  padding-block:clamp(1rem,2.4vw,1.25rem);
  border-top:1px solid var(--filet)}
.service:first-child{border-top:0;padding-top:0}
.service__marque{grid-row:1 / span 2;width:9px;height:9px;margin-top:.55em;
  background:var(--marque);opacity:.4;border-radius:2px;
  transition:opacity .24s ease,transform .24s ease}
.service:hover .service__marque{opacity:1}
.service h3{grid-column:2;margin:0 0 .25rem;color:var(--encre)}              /* 14,79 */
.service p{grid-column:2;margin:0;color:var(--encre-douce);font-size:.97rem} /* 6,89 */
.js .service.reveal{transition-delay:calc(var(--i,0) * 80ms)}

.cadre{position:relative;border-radius:var(--rayon);overflow:hidden;
  box-shadow:var(--ombre)}
.cadre img{width:100%;object-fit:cover;object-position:50% 50%}
.cadre--filet::after{content:"";position:absolute;inset:0;pointer-events:none;
  border-radius:var(--rayon);border:1px solid color-mix(in srgb,var(--marque) 26%,transparent)}

.journee{padding-block:clamp(3rem,8vw,5rem);
  background:transparent}
.rythme{position:relative;display:grid;gap:1.5rem;
  margin-top:clamp(1.75rem,4vw,2.5rem);padding-left:2rem}
.rythme::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:3px;
  background:linear-gradient(180deg,var(--marque) 0%,
    color-mix(in srgb,var(--marque) 20%,transparent) 100%);
  transform-origin:top;border-radius:2px}
.temps{position:relative}
.temps__point{position:absolute;left:-2rem;top:2px;
  width:13px;height:13px;border-radius:50%;
  background:var(--carte);border:3px solid var(--marque)}
.temps__num{font-family:var(--police-libelle);font-weight:600;font-size:.66rem;
  letter-spacing:.16em;font-variant-numeric:lining-nums tabular-nums;
  color:var(--marque);display:block;margin-bottom:.2rem}                     /* 5,05 */
.temps h3{margin:0 0 .2rem;color:var(--encre)}                               /* 11,80 */
.temps p{margin:0;color:var(--encre-douce);font-size:.95rem}                 /* 5,50 */
.js .temps.reveal{transition-delay:calc(var(--i,0) * 66ms)}   /* 5 × 66 = 330 ms */

@media (min-width:62rem){
  .rythme{grid-template-columns:repeat(5,minmax(0,1fr));gap:1.5rem;
    padding-left:0;padding-top:2.5rem}
  .rythme::before{left:0;right:0;top:5px;bottom:auto;width:auto;height:3px;
    background:linear-gradient(90deg,var(--marque) 0%,
      color-mix(in srgb,var(--marque) 20%,transparent) 100%);
    transform-origin:left}
  .temps__point{left:0;top:-2.5rem}
}

.sejour{
  --fil:color-mix(in srgb,var(--creme) 3.5%,transparent);
  --fil-fort:color-mix(in srgb,var(--creme) 5.5%,transparent);
  --fil-ourlet:color-mix(in srgb,var(--creme) 14%,transparent);
  --fil-ourlet-pale:color-mix(in srgb,var(--creme) 7%,transparent);
  color:var(--creme);
  padding-block:clamp(3rem,8vw,5.5rem);
  background:var(--ourlet),var(--tissage),
    radial-gradient(90% 60% at 50% 0%,
      color-mix(in srgb,var(--laiton) 7%,transparent),transparent 62%),
    var(--nuit)}
.sejour h2{color:var(--creme)}                                               /* 14,41 */
.sejour__grille{display:grid;gap:clamp(1.5rem,4vw,2.5rem);
  margin-top:clamp(1.75rem,4vw,2.5rem)}
@media (min-width:62rem){
  .sejour__grille{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
}
.sejour__cote{display:grid;gap:16px;align-content:start}

.sejour__visuels{display:grid;gap:16px;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  align-items:stretch}
.sejour__visuels > .cadre{position:relative}
.sejour__visuels > .cadre img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.sejour__chambre img{aspect-ratio:3/2}
.sejour__detail img{aspect-ratio:3/4}
.sejour__texte{color:var(--creme-doux);margin:0 0 1.5rem}                    /* 8,84 */
.sejour .cadre{box-shadow:0 1px 2px rgba(0,0,0,.2),0 16px 36px rgba(0,0,0,.4)}
.sejour .cadre{box-shadow:0 1px 2px rgba(0,0,0,.2),0 18px 40px rgba(0,0,0,.42)}
.sejour .cadre--filet::after{border-color:color-mix(in srgb,var(--laiton) 32%,transparent)}

.nuitee{margin:0 0 1.5rem;padding-top:1rem;
  border-top:1px solid color-mix(in srgb,var(--creme) 16%,transparent)}
.nuitee__ligne{display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;gap:0 .9rem;padding:.5rem 0}
.nuitee__ligne + .nuitee__ligne{
  border-top:1px solid color-mix(in srgb,var(--creme) 10%,transparent)}
.nuitee dt{font-family:var(--police-libelle);font-weight:600;font-size:.86rem;
  color:var(--creme-doux)}                                                   /* 8,84 */
.nuitee dd{margin:0;text-align:right;font-family:var(--police-libelle);font-weight:600;
  font-variant-numeric:lining-nums tabular-nums;font-size:1.05rem;
  color:var(--laiton)}                                                       /* 7,56 */
.nuitee__note{margin:.75rem 0 0;font-size:.85rem;color:var(--creme-doux)}    /* 8,84 */

.maison{padding-block:clamp(3rem,8vw,5rem);
  background:transparent}
.maison__grille{display:grid;gap:clamp(12px,2vw,16px);
  margin-top:clamp(1.75rem,4vw,2.5rem)}
.maison__grille .cadre{display:flex}
.maison__grille img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;aspect-ratio:3/2}
.maison__haute img{aspect-ratio:3/4}
@media (min-width:52rem){
  .maison__grille{grid-template-columns:repeat(3,minmax(0,1fr))}
  .maison__haute--gauche{grid-column:1;grid-row:1 / span 2}
  .maison__large{grid-column:2}
  .maison__haute--droite{grid-column:3;grid-row:1 / span 2}
  .maison__grille img,.maison__haute img{aspect-ratio:auto}
}

.contact{padding-block:clamp(3.5rem,9vw,6rem);
  background:transparent}
.contact__grille{display:grid;gap:clamp(1.5rem,4vw,3rem)}
.contact__carte{position:relative}
@media (min-width:62rem){
  .contact__carte{display:grid;
    grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
    grid-template-rows:auto auto 1fr;
    column-gap:clamp(2rem,4vw,3rem);align-items:start}
  .contact__carte > .entete-section{grid-column:1;grid-row:1;margin-bottom:0}
  .contact__plaques{grid-column:1;grid-row:2;align-self:start}
  .contact__carte [data-bloc="coordonnees"]{grid-column:1;grid-row:3;
    align-self:start}
  .contact__carte [data-bloc="horaires"]{grid-column:2;grid-row:1 / span 3;
    align-self:start;margin-top:0}
}
.contact__carte::before{content:"";position:absolute;
  left:var(--rayon);right:var(--rayon);top:0;height:3px;
  background:linear-gradient(90deg,var(--marque) 0 34%,
    color-mix(in srgb,var(--marque) 30%,transparent) 34% 100%);
  border-radius:0 0 2px 2px}
.contact__phrase{font-size:1.02rem;color:var(--encre);margin:1rem 0 0}       /* 14,79 */
.contact__plaques{margin-top:clamp(1.25rem,3vw,1.75rem)}

.fiche{margin-top:clamp(1.25rem,3vw,1.75rem);padding-top:clamp(1rem,2.5vw,1.5rem);
  border-top:1px solid var(--filet)}
.fiche__titre{margin:0 0 .5rem;
  font-family:var(--police-libelle);font-weight:600;font-size:.68rem;
  text-transform:uppercase;letter-spacing:.18em;color:var(--encre-douce)}    /* 6,89 */

.tableau{margin:0;display:grid}
.tableau__ligne{display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;gap:0 .9rem;
  padding:clamp(.45rem,1.5vw,.6rem) .5rem;border-radius:var(--rayon-bouton)}
.tableau__ligne + .tableau__ligne{border-top:1px solid var(--filet)}
.tableau dt{color:var(--encre-douce);font-family:var(--police-libelle);
  font-weight:600;font-size:.86rem}                                          /* 6,89 */
.tableau dd{margin:0;min-width:0;color:var(--encre);text-align:right;        /* 14,79 */
  font-variant-numeric:lining-nums tabular-nums}
.tableau dd a{font-family:var(--police-libelle);font-weight:600;
  color:var(--marque);text-decoration:none;                                  /* 6,34 */
  border-bottom:1px solid color-mix(in oklab,var(--marque) 35%,transparent);
  transition:color .24s ease,border-color .24s ease}
.tableau dd a:hover,.tableau dd a:focus-visible{
  color:var(--marque-fonce);border-bottom-color:var(--marque)}               /* 8,93 */
.tableau dd a[href^="tel:"]{display:inline-block;padding-block:.3rem;font-size:1.1rem}

.tableau__ligne--aujourdhui{background:color-mix(in oklab,var(--marque) 8%,transparent)}
.tableau__ligne--aujourdhui dt{color:var(--marque)}                          /* 6,34 */
.tableau--horaires .tableau__ligne--ferme dd{color:var(--encre-douce)}       /* 6,89 */
.tableau__aujourdhui{margin-left:.5rem;padding:.1rem .45rem;border-radius:999px;
  background:var(--marque);color:var(--texte-bouton);                        /* 6,44 */
  font-family:var(--police-libelle);font-weight:600;font-size:.6rem;
  text-transform:uppercase;letter-spacing:.1em;vertical-align:.08em}

.pied{
  --fil:color-mix(in srgb,var(--creme) 3%,transparent);
  --fil-fort:color-mix(in srgb,var(--creme) 5%,transparent);
  --fil-ourlet:color-mix(in srgb,var(--creme) 12%,transparent);
  --fil-ourlet-pale:color-mix(in srgb,var(--creme) 6%,transparent);
  padding-block:clamp(2.5rem,7vw,4rem);color:var(--creme);
  background:var(--ourlet),var(--tissage),var(--nuit-2)}
.pied__interieur{text-align:center}
.pied .trait{margin:0 auto clamp(1rem,3vw,1.5rem)}
.pied__nom{margin:0 0 .4rem;font-family:var(--police-titre);
  font-size:clamp(1.3rem,1.05rem + .9vw,1.75rem);line-height:1.2;
  letter-spacing:.02em;color:var(--creme);overflow-wrap:break-word}          /* 15,96 */
.pied__lieu{margin:0;font-family:var(--police-libelle);font-weight:600;font-size:.68rem;
  text-transform:uppercase;letter-spacing:.2em;color:var(--creme-doux)}      /* 9,79 */
.pied__bas{font-size:.82rem;margin-top:clamp(1.5rem,4vw,2rem);
  padding-top:clamp(1rem,2.5vw,1.5rem);
  border-top:1px solid color-mix(in srgb,var(--laiton) 22%,transparent)}
.pied p{margin:0}
.pied__credit{color:var(--creme-doux)}                                       /* 9,79 */

html.js .reveal{opacity:0;transform:translateY(16px);
  transition:opacity .55s ease,transform .55s ease}
html.js .trait.reveal{transform:scaleX(0);
  transition:opacity .3s ease,transform .8s cubic-bezier(.22,.8,.25,1) .1s}
html.js .reveal.est-vu{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .reveal{transform:none;transition:opacity .55s ease}
  html.js .reveal.est-vu{transform:none}
  html.js .trait.reveal{transform:none;transition:opacity .8s ease .1s}
  .perron__panneau{animation-name:paraitre}
  .service:hover .service__marque{opacity:1}
  .entree:hover,.entree:focus-visible{padding-left:0}
  .entree:hover .entree__fleche i,.entree:focus-visible .entree__fleche i{width:36px}
  #nav-links li:not(:last-child) a::after{transform:scaleX(1);opacity:0;
    transition:opacity .24s ease}
  #nav-links li:not(:last-child) a:hover::after,
  #nav-links li:not(:last-child) a:focus-visible::after{opacity:1}
}

@media (max-width:600px){
  .perron{display:block;min-height:0;
    padding-block:0 clamp(3rem,10vw,4rem)}
  .perron__photo{position:static;width:100%;
    height:38vh;min-height:210px;max-height:340px;
    object-position:center 62%}
  .perron__voile{display:none}
  .perron__bande{padding-top:clamp(1.75rem,7vw,2.25rem)}
}

.entete{background-color:rgba(22,32,46,0.76)}
.entete{margin-bottom:-67px}