/* app.css — extrait de <style> inline dans index.html (#66 perf).
   Conservé tel quel : règles globales, animations, transitions,
   a11y focus/skip-link, classes .gnum/.bkform, media queries.
   Le framework DC ajoute ses propres sc-classes via sc-component. */

  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;font-family:'Archivo',system-ui,sans-serif;color:#2b2926;background:#faf8f2;-webkit-font-smoothing:antialiased}
  ::selection{background:#5f7a6e;color:#faf8f2}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  @keyframes floatUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
  @keyframes kenburns{from{transform:scale(1.05)}to{transform:scale(1.16)}}
  .reveal{animation:floatUp .9s cubic-bezier(.2,.7,.2,1) both}
  .navlink{position:relative}
  .navlink::after{content:"";position:absolute;left:0;bottom:-4px;height:1.5px;width:0;background:#5f7a6e;transition:width .3s ease}
  .navlink:hover::after{width:100%}
  .gimg{transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .5s ease}
  .gcard:hover .gimg{transform:scale(1.07)}
  .roomcard{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s ease}
  .roomcard:hover{transform:translateY(-6px);box-shadow:0 24px 50px -24px rgba(43,41,38,.4)}
  .btnp{transition:transform .25s ease,box-shadow .35s ease,background .3s ease}
  .btnp:hover{transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(63,83,74,.7)}
  .btng{transition:background .25s ease,color .25s ease,border-color .25s ease}
  .amenity{transition:transform .35s ease,background .35s ease}
  .amenity:hover{transform:translateY(-4px);background:#fff}
  .faqitem summary{list-style:none;cursor:pointer}
  .faqitem summary::-webkit-details-marker{display:none}
  .faqitem[open] .faqchev{transform:rotate(45deg)}
  details>summary:focus-visible{outline:2px solid #3f534a;outline-offset:2px;border-radius:2px}
  .skip-link{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
  .skip-link:focus{position:fixed;top:8px;left:8px;width:auto;height:auto;z-index:100000;padding:10px 14px;background:#3f534a;color:#fff;text-decoration:none;border-radius:4px;font-weight:700;font-size:13px}
  /* Focus reste toujours visible au clavier même si on a tenté d'enlever l'outline natif
     sur un élément précis (WCAG 2.4.7). */
  :focus-visible{outline:2px solid #3f534a;outline-offset:2px;border-radius:2px}
  .cday{transition:background .15s ease}
  .cday:hover{background:#dde4dd}
  .ct-sec{margin:0 0 22px}
  .ct-sec:last-child{margin-bottom:0}
  .ct-sec h4{font-family:'Fraunces',serif;font-weight:500;font-size:17px;color:#2b2926;margin:0 0 7px;letter-spacing:-.01em}
  .ct-sec p{margin:0;font-size:14px;line-height:1.62;color:#4a4843}
  .gnum::-webkit-inner-spin-button,.gnum::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
  .gnum{-moz-appearance:textfield;appearance:textfield}
  .gnum:focus{border-color:#5f7a6e}
  .gnum:focus-visible{outline:2px solid #3f534a;outline-offset:2px;border-radius:2px}
  /* Firefox is strict about the automatic minimum size of grid/flex items:
     inputs keep their intrinsic (~20ch) width and refuse to shrink, pushing
     the booking modal wider than the phone screen (right edge gets clipped).
     Forcing min-width:0 lets the columns and fields collapse to fit. */
  .bkform label{min-width:0}
  .bkform input{min-width:0;width:100%}
  @media(max-width:860px){.hide-m{display:none!important}}
  @media(min-width:861px){.only-m{display:none!important}}
  @media(max-width:820px){
    .mcol1{grid-template-columns:1fr!important}
    .mcol2{grid-template-columns:repeat(2,1fr)!important}
    .m-noborder{border-right:0!important}
  }