:root{
      --glacier:#173B52;   /* bleu nuit, texte & fonds sombres */
      --piste:#2F6FB0;     /* bleu balisage de piste, actions */
      --pin:#C7893A;       /* bois de pin du mobilier */
      --neige:#F7F9FA;
      --ciel:#E3EEF5;
      --roche:#56646D;

      --bs-body-font-family:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
      --bs-body-color:var(--glacier);
      --bs-body-bg:var(--neige);
      --bs-link-color-rgb:47,111,176;
      --bs-border-radius:.5rem;
    }
    body{font-size:1.0625rem;line-height:1.6;font-variation-settings:"wdth" 100}
    h1,h2,h3,.display{font-stretch:125%;font-weight:800;letter-spacing:-.015em;line-height:1.05}
    h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin-bottom:1.25rem}
    h3{font-size:1.2rem;font-weight:700}
    p{max-width:62ch}
    .text-roche{color:var(--roche)}
    section{padding-block:clamp(4rem,9vw,7rem);scroll-margin-top:4rem}
    :focus-visible{outline:3px solid var(--pin);outline-offset:3px}

    /* ---------- Boutons ---------- */
    .btn{font-weight:700;font-stretch:112%;padding:.8rem 1.5rem;border-radius:.4rem}
    .btn-piste{background:var(--piste);color:#fff;border:0}
    .btn-piste:hover,.btn-piste:focus-visible{background:#255d96;color:#fff}
    .btn-ghost{color:#fff;border:2px solid rgba(255,255,255,.75)}
    .btn-ghost:hover{background:#fff;color:var(--glacier)}

    /* ---------- Navigation ---------- */
    .navbar{transition:background .25s,box-shadow .25s;padding-block:1rem}
    .navbar-brand{color:#fff;font-weight:800;font-stretch:118%;display:flex;align-items:center;gap:.6rem}
    .navbar.is-solid{background:rgba(247,249,250,.97);box-shadow:0 1px 0 rgba(23,59,82,.12);padding-block:.6rem}
    .navbar.is-solid .navbar-brand{color:var(--glacier)}

    /* ---------- Hero ---------- */
    .hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;padding:0;overflow:hidden}
    .hero picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
    .hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,59,82,.4) 0%,rgba(23,59,82,0) 28%,rgba(23,59,82,.25) 48%,rgba(23,59,82,.9) 100%),linear-gradient(90deg,rgba(23,59,82,.55) 0%,rgba(23,59,82,0) 60%)}
    .hero h1,.hero .lead{text-shadow:0 2px 18px rgba(10,30,45,.45)}
    .hero .container{position:relative;z-index:1;padding-bottom:clamp(2.5rem,7vw,5rem)}
    .hero h1{font-size:clamp(2.8rem,8.2vw,6.6rem);font-weight:900;max-width:11ch;margin-bottom:1.25rem;text-wrap:balance}
    .hero .lead{font-size:clamp(1.1rem,1.8vw,1.35rem);max-width:40ch;opacity:.95}

    /* Le panneau « balisage » : l'élément signature de la page */
    .balise{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
      width:10.5rem;aspect-ratio:1;border-radius:50%;background:var(--piste);color:#fff;
      border:6px solid #fff;box-shadow:0 12px 30px rgba(0,0,0,.25);text-align:center;transform:rotate(-8deg)}
    .balise small{font-size:.8rem;font-weight:600;opacity:.9}
    .balise strong{font-size:1.6rem;font-stretch:125%;font-weight:900;line-height:1}
    @media (prefers-reduced-motion:no-preference){
      .balise{animation:plante .9s cubic-bezier(.2,1.4,.4,1) .4s both}
      @keyframes plante{from{transform:translateY(40px) rotate(-30deg);opacity:0}to{transform:translateY(0) rotate(-8deg);opacity:1}}
    }

    /* ---------- Bande d'infos ---------- */
    .faits{background:var(--glacier);color:#fff;padding-block:1.75rem}
    .faits ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1.25rem 2.5rem}
    .faits li{display:flex;align-items:center;gap:.7rem;font-weight:600}
    .faits i{font-size:1.5rem;color:var(--pin)}

    /* ---------- Photos ---------- */
    .photo{display:block;width:100%;height:100%;border:0;padding:0;background:none;border-radius:.5rem;overflow:hidden;cursor:zoom-in}
    .photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
    .photo:hover img{transform:scale(1.03)}
    .galerie{display:grid;gap:.75rem;grid-template-columns:repeat(2,1fr);grid-auto-rows:11rem}
    @media (min-width:768px){
      .galerie{grid-template-columns:repeat(4,1fr);grid-auto-rows:13rem}
      .galerie .g-large{grid-column:span 2;grid-row:span 2}
      .galerie .g-haute{grid-row:span 2}
    }
    .galerie .g-large{grid-column:span 2}
    .modal-content{background:#0e2433;border:0}
    .carousel-item img{max-height:80vh;width:100%;object-fit:contain}
    .carousel-caption{position:static;padding:1rem 0 0;color:#dfe9f0}

    /* ---------- Plan du studio (texte) ---------- */
    .piece{border-top:2px solid var(--glacier);padding-top:1rem;height:100%}
    .piece .bi{color:var(--piste);font-size:1.6rem}

    /* ---------- Emplacement ---------- */
    .bg-ciel{background:var(--ciel)}
    .carte{border-radius:.5rem;overflow:hidden;aspect-ratio:4/3;background:#cfdde6}
    .carte iframe{width:100%;height:100%;border:0}
    .saison{border-left:4px solid var(--pin);padding-left:1rem}

    /* ---------- Équipements ---------- */
    .equip{list-style:none;padding:0;columns:2 16rem;column-gap:3rem}
    .equip li{break-inside:avoid;display:flex;gap:.75rem;padding:.6rem 0;border-bottom:1px solid rgba(23,59,82,.12)}
    .equip i{color:var(--piste);font-size:1.2rem;line-height:1.4}

    /* ---------- Réservation ---------- */
    .resa{background:var(--glacier);color:#fff}
    .resa .form-control,.resa .form-select{padding:.8rem 1rem;border:0}
    .resa .form-label{font-weight:600}
    .resa .text-roche{color:#b8cad6}
    .infos dt{font-weight:700}
    .infos dd{color:#c9d8e2;margin-bottom:1rem}

    /* Calendrier (Litepicker) */
    .cal-panel{background:#fff;color:var(--glacier);border-radius:.75rem;padding:1.25rem;min-height:22rem}
    #calendrier{display:flex;justify-content:center}
    .litepicker{
      font-family:inherit;font-size:1rem;
      --litepicker-container-months-box-shadow-color:transparent;
      --litepicker-month-width:calc(var(--litepicker-day-width) * 7);
      --litepicker-day-width:clamp(2.4rem,11vw,3.1rem);
      --litepicker-day-color:var(--glacier);
      --litepicker-day-color-hover:var(--piste);
      --litepicker-is-today-color:var(--pin);
      --litepicker-is-in-range-color:#dbe8f4;
      --litepicker-is-locked-color:#a9b4bb;
      --litepicker-is-start-color-bg:var(--piste);
      --litepicker-is-end-color-bg:var(--piste);
      --litepicker-month-header-color:var(--glacier);
      --litepicker-month-weekday-color:var(--roche);
      --litepicker-button-prev-month-color:var(--glacier);
      --litepicker-button-next-month-color:var(--glacier);
      --litepicker-button-prev-month-color-hover:var(--piste);
      --litepicker-button-next-month-color-hover:var(--piste);
      --litepicker-button-reset-color:var(--roche);
      --litepicker-button-reset-color-hover:var(--piste);
      --litepicker-tooltip-color-bg:var(--glacier);
    }
    .litepicker .container__months{box-shadow:none;border-radius:0}
    .litepicker .container__months .month-item-header{font-weight:800;font-stretch:115%;text-transform:capitalize}
    .litepicker .container__months .month-item-weekdays-row>div{font-weight:600}
    .litepicker .container__days .day-item{height:calc(var(--litepicker-day-width) * .9);display:flex;align-items:center;justify-content:center;font-weight:500}
    .litepicker .container__days .day-item.est-occupe{color:#98a5ad;text-decoration:line-through;background:repeating-linear-gradient(-45deg,#f1f4f6 0 4px,#e3e9ed 4px 8px)}
    .litepicker .container__days .day-item.est-occupe:not(.is-locked){color:var(--glacier);text-decoration:none;box-shadow:inset 0 0 0 2px var(--piste)} /* départ possible un jour d'arrivée d'autres clients */
    .litepicker .container__days .day-item.est-passe{color:#c9d1d6}
    .litepicker .container__days .day-item.est-occupe.is-end-date,
    .litepicker .container__days .day-item.est-occupe.is-start-date{background:var(--piste);color:#fff;text-decoration:none;box-shadow:none}
    .btn-effacer{border:0;background:none;color:var(--piste);font-weight:600;text-decoration:underline;padding:0;font-size:.9rem}
    .litepicker .container__days .day-item.is-start-date,.litepicker .container__days .day-item.is-end-date{font-weight:800}
    .litepicker .container__tooltip{color:#fff;font-weight:600}
    .legende{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;justify-content:center;font-size:.9rem;color:var(--roche)}
    .pastille{display:inline-block;width:1rem;height:1rem;border-radius:.2rem;vertical-align:-.15rem;margin-right:.35rem;border:1px solid #d5dde2}
    .pastille.libre{background:#fff}
    .pastille.occupe{background:repeating-linear-gradient(-45deg,#f1f4f6 0 3px,#dfe5e9 3px 6px)}
    .pastille.choisi{background:var(--piste);border-color:var(--piste)}
    .cal-etat{text-align:center;font-size:.9rem;color:var(--roche);margin:.75rem 0 0;min-height:1.4em}
    .cal-etat.erreur{color:#b23b2e;font-weight:600}

    /* Récap du séjour */
    .sejour{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.18);border-radius:.6rem;overflow:hidden}
    .sejour-date,.sejour-nuits{background:#1e4862;padding:.9rem 1.1rem}
    .sejour-date span{display:block;font-size:.85rem;color:#b8cad6}
    .sejour-date strong{font-size:1.15rem;font-stretch:112%;text-transform:capitalize}
    .sejour-nuits{grid-column:1/-1;font-weight:700;color:#fff}
    .sejour.est-choisi .sejour-nuits{background:var(--piste)}
    .btn-piste:disabled{background:#4d6b80;color:#cfdce5;opacity:1}
    #retour .alert{margin:0}

    footer{background:#0f2a3b;color:#b8cad6;padding-block:2.5rem;font-size:.95rem}
    footer a{color:#fff}