/* ══════════════════════════════════════════
       RESET & ROOT
    ══════════════════════════════════════════ */
    *, *::before, *::after {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    :root {
      --sand:         #E8DFD0;
      --sand-light:   #F5F0E8;
      --sand-dark:    #C4B49A;
      --terre:        #8B6F47;
      --terre-deep:   #5C4A2A;
      --esterel:      #C0392B;
      --esterel-soft: #D4523A;
      --sage:         #7A8C6E;
      --sage-light:   #A8B89C;
      --ecru:         #FAF7F2;
      --charcoal:     #2C2820;
      --charcoal-mid: #4A4238;
      --white:        #FEFDFB;

      --nav-height: 60px;
      --section-pad-v: 6rem;
      --section-pad-h: 4rem;
      --max-width: 1200px;
      --radius: 0px; /* design carré volontaire, changer si souhaité */
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: 'Jost', sans-serif;
      background: var(--ecru);
      color: var(--charcoal);
      font-weight: 300;
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }

    img {
      display: block;
      max-width: 100%;
      height: auto;
    }

    a { text-decoration: none; }

    /* ══════════════════════════════════════════
       UTILITAIRES
    ══════════════════════════════════════════ */
    .container {
      max-width: var(--max-width);
      margin: 0 auto;
    }

    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0,0,0,0);
      white-space: nowrap;
      border: 0;
    }

    .section-label {
      font-size: 12px;
      letter-spacing: 0.25em;
      text-transform: uppercase;
      color: var(--esterel);
      margin-bottom: 0.75rem;
      font-weight: 400;
    }

    .section-h2 {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(28px, 4vw, 44px);
      font-weight: 300;
      color: var(--terre-deep);
      line-height: 1.2;
      margin-bottom: 1rem;
    }

    .section-intro {
      font-size: 16px;
      color: var(--charcoal-mid);
      line-height: 1.8;
      max-width: 560px;
      font-weight: 300;
    }

    .divider {
      width: 48px;
      height: 1px;
      background: var(--esterel);
      margin: 1.5rem 0;
    }

    .btn-primary {
      display: inline-block;
      background: var(--esterel);
      color: var(--white);
      padding: 14px 28px;
      font-size: 13px;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      font-weight: 500;
      border: 2px solid var(--esterel);
      cursor: pointer;
      font-family: 'Jost', sans-serif;
      transition: background 0.25s, border-color 0.25s;
    }

    .btn-primary:hover {
      background: var(--terre-deep);
      border-color: var(--terre-deep);
    }

    .btn-ghost {
      display: inline-block;
      background: transparent;
      color: var(--white);
      padding: 13px 28px;
      font-size: 11px;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      font-weight: 400;
      border: 1px solid rgba(255, 255, 255, 0.4);
      cursor: pointer;
      font-family: 'Jost', sans-serif;
      transition: border-color 0.25s, background 0.25s;
    }

    .btn-ghost:hover {
      border-color: rgba(255, 255, 255, 0.8);
      background: rgba(255, 255, 255, 0.08);
    }

    /* ══════════════════════════════════════════
       STICKY NAV
    ══════════════════════════════════════════ */
    #main-nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
      height: var(--nav-height);
      padding: 0 var(--section-pad-h);
      display: flex;
      align-items: center;
      justify-content: space-between;
      transition: background 0.4s, box-shadow 0.4s;
    }

    #main-nav.transparent {
      background: transparent;
    }

    #main-nav.scrolled {
      background: rgba(250, 247, 242, 0.97);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      box-shadow: 0 1px 0 var(--sand);
    }

    .nav-logo {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      font-weight: 300;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--terre-deep);
      transition: color 0.3s;
    }

    #main-nav.transparent .nav-logo { color: var(--sand-light); }

    .nav-logo span { color: var(--esterel); }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 2.5rem;
      list-style: none;
    }

    .nav-links a {
      font-size: 12px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--charcoal-mid);
      font-weight: 400;
      transition: color 0.2s;
    }

    #main-nav.transparent .nav-links a { color: rgba(255,255,255,0.8); }

    .nav-links a:hover { color: var(--terre); }

    .nav-cta {
      background: var(--esterel);
      color: var(--white) !important;
      padding: 11px 20px;
      font-size: 12px !important;
      letter-spacing: 0.18em;
      transition: background 0.25s !important;
    }

    .nav-cta:hover { background: var(--terre-deep); color: var(--white) !important; }

    /* Hamburger mobile */
    .nav-hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 4px;
      background: none;
      border: none;
    }

    .nav-hamburger span {
      display: block;
      width: 22px;
      height: 1.5px;
      background: var(--charcoal);
      transition: transform 0.3s, opacity 0.3s;
    }

    #main-nav.transparent .nav-hamburger span { background: var(--white); }

    /* Mobile drawer */
    .nav-drawer {
      display: none;
      position: fixed;
      top: 0;
      right: -100%;
      width: min(320px, 85vw);
      height: 100vh;
      background: var(--ecru);
      z-index: 2000;
      padding: 2rem;
      flex-direction: column;
      transition: right 0.35s cubic-bezier(0.4, 0, 0.2, 1);
      box-shadow: -4px 0 24px rgba(44, 40, 32, 0.12);
    }

    .nav-drawer.open { right: 0; }

    .drawer-close {
      align-self: flex-end;
      background: none;
      border: none;
      font-size: 24px;
      color: var(--charcoal-mid);
      cursor: pointer;
      margin-bottom: 2rem;
    }

    .drawer-links {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .drawer-links li a {
      display: block;
      padding: 1rem 0;
      font-size: 12px;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--charcoal-mid);
      border-bottom: 1px solid var(--sand);
      transition: color 0.2s;
    }

    .drawer-links li a:hover { color: var(--terre); }

    .drawer-cta {
      margin-top: 2rem;
      background: var(--esterel);
      color: var(--white) !important;
      text-align: center;
      padding: 14px;
      font-size: 13px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      font-weight: 500;
      border: none;
      display: block;
    }

    .nav-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(44, 40, 32, 0.4);
      z-index: 1999;
    }

    .nav-overlay.open { display: block; }

    /* ══════════════════════════════════════════
       HERO
    ══════════════════════════════════════════ */
    #hero {
      position: relative;
      height: 100vh;
      min-height: 600px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      overflow: hidden;
    }

    .hero-bg {
      position: absolute;
      inset: 0;
      background-color: #3D2B1A;
    }

    .hero-bg video {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 40%;
    }

    /* Placeholder visuel en attendant la vidéo */
    .hero-bg::after {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 80% 60% at 65% 30%, rgba(139,96,64,0.5) 0%, transparent 70%),
        radial-gradient(ellipse 50% 80% at 20% 75%, rgba(192,57,43,0.2) 0%, transparent 60%),
        radial-gradient(ellipse 60% 50% at 80% 80%, rgba(92,74,42,0.4) 0%, transparent 60%);
    }

    .hero-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(
        to top,
        rgba(30, 20, 10, 0.88) 0%,
        rgba(30, 20, 10, 0.35) 50%,
        rgba(30, 20, 10, 0.1) 100%
      );
      z-index: 1;
    }

    .hero-content {
      position: relative;
      z-index: 2;
      padding: 0 var(--section-pad-h) 4rem;
      max-width: calc(var(--max-width) + 2 * var(--section-pad-h));
    }

    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(255, 255, 255, 0.1);
      border: 1px solid rgba(255, 255, 255, 0.22);
      padding: 6px 14px;
      font-size: 10px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--sand-light);
      margin-bottom: 1.5rem;
    }

    .hero-badge .dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--esterel-soft);
      flex-shrink: 0;
    }

    .hero-h1 {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(40px, 7vw, 76px);
      font-weight: 300;
      color: var(--white);
      line-height: 1.05;
      margin-bottom: 1.25rem;
      font-style: italic;
    }

    .hero-h1 strong {
      font-style: normal;
      font-weight: 400;
      color: var(--sand);
    }

    .hero-sub {
      font-size: 16px;
      letter-spacing: 0.04em;
      color: rgba(255, 255, 255, 0.72);
      margin-bottom: 2.25rem;
      font-weight: 300;
      max-width: 520px;
      line-height: 1.75;
    }

    .hero-actions {
      display: flex;
      align-items: center;
      gap: 1rem;
      flex-wrap: wrap;
    }

    .hero-price {
      display: flex;
      align-items: baseline;
      gap: 6px;
      margin-bottom: 1.75rem;
    }

    .hero-price-label {
      font-size: 11px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.5);
    }

    .hero-price-value {
      font-family: 'Cormorant Garamond', serif;
      font-size: 32px;
      color: var(--sand-light);
      font-weight: 300;
    }

    .hero-price-unit {
      font-size: 14px;
      color: rgba(255,255,255,0.5);
    }

    .hero-trust {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-top: 1.75rem;
      padding-top: 1.75rem;
      border-top: 1px solid rgba(255, 255, 255, 0.12);
    }

    .stars { color: #F0A800; font-size: 14px; letter-spacing: 3px; }

    .hero-trust-score {
      font-size: 14px;
      color: var(--sand-light);
      font-weight: 500;
      letter-spacing: 0.05em;
    }

    .hero-trust-text {
      font-size: 12px;
      color: rgba(255, 255, 255, 0.80);
      letter-spacing: 0.04em;
    }

    /* ══════════════════════════════════════════
       SECTION APPARTEMENT
    ══════════════════════════════════════════ */
    #appartement {
      background: var(--white);
      padding: var(--section-pad-v) var(--section-pad-h);
    }

    /* Header centré */
    .apt-header {
      text-align: center;
      margin-bottom: 3rem;
    }
    .apt-header .divider {
      margin-left: auto;
      margin-right: auto;
    }

    /* Galerie mosaïque - desktop */
    .apt-mosaic {
      display: grid;
      grid-template-columns: 3fr 1fr 1fr;
      grid-template-rows: 1fr 1fr;
      gap: 6px;
      height: 540px;
    }

    .mosaic-hero {
      grid-row: 1 / -1;
      grid-column: 1;
    }

    .mosaic-side-top {
      grid-row: 1;
      grid-column: 2;
    }

    .mosaic-side-mid {
      grid-row: 1;
      grid-column: 3;
    }

    .mosaic-side-btm {
      grid-row: 2;
      grid-column: 2 / 4;
    }

    .photo-item {
      overflow: hidden;
      cursor: pointer;
      position: relative;
      min-height: 0;
    }

    .photo-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    .photo-item:hover img {
      transform: scale(1.05);
    }

    /* Léger overlay au hover pour profondeur */
    .photo-item::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 60%, rgba(30, 20, 10, 0.12) 100%);
      pointer-events: none;
      transition: opacity 0.4s;
      opacity: 0;
    }
    .mosaic-hero::after {
      opacity: 1;
    }

    /* Badge "voir toutes les photos" */
    .photo-more-overlay {
      position: absolute;
      inset: 0;
      background: rgba(30, 20, 10, 0.5);
      backdrop-filter: blur(2px);
      -webkit-backdrop-filter: blur(2px);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.4rem;
      color: var(--white);
      cursor: pointer;
      transition: background 0.3s;
      z-index: 1;
    }
    .photo-more-overlay:hover { background: rgba(30, 20, 10, 0.68); }
    .photo-more-icon {
      font-size: 1.5rem;
      line-height: 1;
    }
    .photo-more-count {
      font-family: 'Jost', sans-serif;
      font-size: 0.85rem;
      font-weight: 500;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .photo-more-mobile { display: none; }
    .photo-more-tablet { display: none; }

    /* Bouton coin bas-droit - mobile uniquement */
    .photo-more-corner-mobile {
      display: none;
      position: absolute;
      bottom: 0.75rem;
      right: 0.75rem;
      background: rgba(44, 40, 32, 0.82);
      color: var(--white);
      font-family: 'Jost', sans-serif;
      font-size: 0.78rem;
      font-weight: 500;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      padding: 0.45rem 0.85rem;
      border: 1px solid rgba(255,255,255,0.25);
      cursor: pointer;
      z-index: 2;
      transition: background 0.25s;
      pointer-events: auto;
    }
    .photo-more-corner-mobile:hover { background: rgba(44, 40, 32, 0.95); }

    /* Indicateur swipe mobile (masqué par défaut) */
    .apt-swipe-hint {
      display: none;
      align-items: center;
      justify-content: center;
      gap: 6px;
      margin-top: 0.75rem;
      font-size: 11px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--terre);
    }
    .apt-swipe-hint svg {
      width: 16px;
      height: 16px;
      opacity: 0.6;
    }

    /* Détails sous la galerie - disposition en 2 colonnes */
    .apt-details {
      display: grid;
      grid-template-columns: 1.4fr 1fr;
      gap: 3.5rem;
      margin-top: 3.5rem;
      align-items: start;
    }

    .apt-details-specs-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0 2rem;
    }

    .apt-details-text .section-intro {
      max-width: none;
    }

    .specs-list {
      list-style: none;
      display: grid;
      grid-template-columns: 1fr;
      gap: 0;
      margin: 0;
    }

    .specs-list li {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 14px;
      color: var(--charcoal-mid);
      padding: 0.65rem 0;
      border-bottom: 1px solid var(--sand);
    }

    .specs-list li:first-child {
      padding-top: 0;
    }

    .spec-icon {
      display: none;
    }

    @media (max-width: 768px) {
      .spec-icon {
        width: 30px;
        height: 30px;
        background: var(--sand-light);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        font-size: 14px;
      }
    }

    .spec-value { font-weight: 500; }

    .spec-icon--star {
      color: var(--esterel);
      font-size: 16px;
      font-style: normal;
    }

    .amenities-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    /* ─── Descriptif complet ─────────────────── */
    .btn-descriptif-complet {
      background: none;
      border: 1px solid var(--esterel);
      color: var(--esterel);
      padding: 12px 28px;
      font-size: 12px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      font-family: 'Jost', sans-serif;
      font-weight: 500;
      cursor: pointer;
      transition: background 0.25s, color 0.25s;
      margin-top: 0.5rem;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }
    .btn-descriptif-complet:hover {
      background: var(--esterel);
      color: var(--white);
    }
    .btn-descriptif-complet svg {
      transition: transform 0.3s;
      flex-shrink: 0;
    }
    .btn-descriptif-complet.open svg {
      transform: rotate(180deg);
    }

    .descriptif-complet {
      display: none;
      margin-top: 2.5rem;
      padding: 2rem 0;
      border-top: 1px solid var(--sand);
      border-bottom: 1px solid var(--sand);
      columns: 2;
      column-gap: 4rem;
    }
    .descriptif-complet.open { display: block; }

    .descriptif-complet h3 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 21px;
      font-style: italic;
      font-weight: 400;
      color: var(--charcoal);
      margin: 1.75rem 0 0.6rem;
      break-after: avoid;
    }
    .descriptif-complet h3:first-child { margin-top: 0; }

    .descriptif-complet h4 {
      font-family: 'Jost', sans-serif;
      font-size: 11px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--terre);
      margin: 1.25rem 0 0.5rem;
      font-weight: 500;
      break-after: avoid;
    }

    .descriptif-complet p {
      font-size: 14px;
      color: var(--charcoal-mid);
      line-height: 1.75;
      margin-bottom: 0.75rem;
    }

    .descriptif-complet ul {
      margin: 0.5rem 0 1rem;
      padding-left: 0;
      list-style: none;
    }
    .descriptif-complet ul li {
      font-size: 14px;
      color: var(--charcoal-mid);
      line-height: 1.7;
      padding: 0.25rem 0;
      padding-left: 1.1rem;
      position: relative;
    }
    .descriptif-complet ul li::before {
      content: '–';
      position: absolute;
      left: 0;
      color: var(--esterel);
    }

    .descriptif-complet em {
      font-size: 13px;
      color: var(--terre);
    }

    @media (max-width: 768px) {
      .descriptif-complet { columns: 1; }
    }

    .amenity-chip {
      background: var(--sand-light);
      border: 1px solid var(--sand);
      padding: 9px 16px;
      font-size: 11px;
      letter-spacing: 0.06em;
      color: var(--terre-deep);
      text-align: center;
      transition: background 0.3s, border-color 0.3s;
    }
    .amenity-chip:hover {
      background: var(--sand);
      border-color: var(--sand-dark);
    }

    /* ══════════════════════════════════════════
       SECTION AVIS
    ══════════════════════════════════════════ */
    #avis {
      background: var(--sand-light);
      padding: var(--section-pad-v) var(--section-pad-h);
    }

    .avis-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      margin-bottom: 1.5rem;
    }

    .avis-score-block {
      display: flex;
      align-items: baseline;
      gap: 1rem;
    }

    .avis-score-big {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(60px, 8vw, 88px);
      font-weight: 300;
      color: var(--terre-deep);
      line-height: 1;
    }

    .avis-score-meta {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .avis-score-denom {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      color: var(--terre);
      font-style: italic;
    }

    .avis-score-qualify {
      font-size: 10px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--terre);
    }

    .avis-verified {
      font-size: 11px;
      color: var(--terre);
      letter-spacing: 0.05em;
      margin-top: 6px;
    }

    .avis-carousel-wrap {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin-top: 2rem;
    }

    .avis-arrow {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      border: 1px solid var(--sand-dark);
      background: var(--white);
      color: var(--terre-deep);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.2s, border-color 0.2s, opacity 0.2s;
      align-self: center;
    }
    .avis-arrow svg { width: 18px; height: 18px; }
    .avis-arrow:hover:not(:disabled) {
      background: var(--sand);
      border-color: var(--terre);
    }
    .avis-arrow:disabled {
      opacity: 0.25;
      cursor: default;
    }
    @media (max-width: 768px) {
      .avis-arrow { display: none; }
    }

    .avis-cards {
      flex: 1;
      min-width: 0;
      display: flex;
      gap: 1.5rem;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      padding-bottom: 0.25rem;
    }

    .avis-cards::-webkit-scrollbar { display: none; }

    .avis-card {
      flex: 0 0 calc(33.33% - 1rem);
      min-width: 260px;
      scroll-snap-align: start;
      padding-left: 1rem;
      border-left: 2px solid var(--esterel);
    }

    .avis-carousel-nav {
      display: flex;
      justify-content: center;
      gap: 0.5rem;
      margin-top: 1.25rem;
    }

    .avis-dot {
      position: relative;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--sand-dark);
      border: none;
      padding: 0;
      cursor: pointer;
      transition: background 0.2s, transform 0.2s;
    }
    /* Zone tactile étendue sans modifier l'apparence visuelle */
    .avis-dot::before {
      content: '';
      position: absolute;
      inset: -14px;
    }

    .avis-dot.active {
      background: var(--esterel);
      transform: scale(1.3);
    }

    .avis-card-quote {
      font-family: 'Cormorant Garamond', serif;
      font-size: 36px;
      line-height: 1;
      color: var(--esterel);
      opacity: 0.35;
      margin-bottom: -0.25rem;
      user-select: none;
    }

    .avis-card-text {
      font-family: 'Cormorant Garamond', serif;
      font-size: 19px;
      font-style: italic;
      color: var(--charcoal-mid);
      line-height: 1.5;
      margin: 0;
      padding: 0;
      display: -webkit-box;
      -webkit-line-clamp: 4;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .avis-card.expanded .avis-card-text {
      -webkit-line-clamp: unset;
      overflow: visible;
    }
    .avis-voir-suite {
      background: none;
      border: none;
      padding: 0;
      margin-top: 0.4rem;
      font-family: 'Jost', sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: var(--esterel);
      cursor: pointer;
      display: none;
    }
    .avis-voir-suite:hover {
      text-decoration: underline;
    }
    .avis-voir-suite.visible {
      display: inline-block;
    }

    .avis-card-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 0.6rem;
    }

    .avis-card-stars {
      color: #F0A800;
      font-size: 10px;
      letter-spacing: 1.5px;
    }

    .avis-card-author {
      font-family: 'Cormorant Garamond', serif;
      font-size: 12px;
      font-style: italic;
      color: var(--sage);
    }

    .avis-cta-row {
      margin-top: 2.5rem;
      text-align: center;
    }

    /* Modules notes plateformes */
    .platform-ratings-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1.5rem;
      margin-bottom: 2.5rem;
      align-items: stretch;
    }
    .platform-rating-card {
      background: var(--white);
      border: 1px solid var(--sand);
      border-radius: 16px;
      padding: 1.5rem 1.75rem;
      box-shadow: 0 2px 12px rgba(44,40,32,0.07);
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
    }
    .platform-rating-top {
      display: flex;
      align-items: center;
      gap: 0.6rem;
    }
    .platform-logo-img {
      width: 32px;
      height: 32px;
      object-fit: cover;
      border-radius: 8px;
      flex-shrink: 0;
    }
    .platform-wordmark {
      font-family: 'Jost', sans-serif;
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--charcoal-mid);
    }
    .platform-rating-divider {
      height: 1px;
      background: var(--sand);
      margin: 0.25rem 0;
    }
    .platform-badge-laurel-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      margin: 0.5rem 0 0.25rem;
    }
    .laurier-img {
      width: 46px;
      height: 72px;
      object-fit: contain;
      flex-shrink: 0;
    }
    .platform-rating-badge {
      font-family: 'Cormorant Garamond', serif;
      font-size: 21px;
      font-weight: 400;
      color: var(--terre-deep);
      line-height: 1.3;
      text-align: center;
    }
    .platform-rating-desc {
      font-size: 11px;
      color: var(--terre);
      letter-spacing: 0.03em;
      text-align: center;
    }
    .platform-rating-score-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      margin-top: 0.25rem;
    }
    .platform-rating-stars {
      display: flex;
      gap: 2px;
    }
    .platform-rating-stars svg {
      width: 10px;
      height: 10px;
      fill: var(--esterel);
    }
    .platform-rating-num {
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px;
      font-weight: 600;
      color: var(--terre-deep);
      line-height: 1;
    }
    .platform-rating-count {
      font-size: 11px;
      color: var(--sage);
      letter-spacing: 0.05em;
    }
    .platform-rating-score-big-row {
      display: flex;
      align-items: baseline;
      justify-content: center;
      gap: 0.4rem;
      margin-top: 0.25rem;
    }
    .platform-score-num {
      font-family: 'Cormorant Garamond', serif;
      font-size: 48px;
      font-weight: 300;
      color: var(--terre-deep);
      line-height: 1;
    }
    .platform-score-denom {
      font-family: 'Cormorant Garamond', serif;
      font-size: 18px;
      color: var(--terre);
      font-style: italic;
    }
    @media (max-width: 768px) {
      .platform-ratings-row { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════════════════
       SECTION LOCAL GUIDE
    ══════════════════════════════════════════ */
    #alentours {
      background: var(--ecru);
      padding: var(--section-pad-v) var(--section-pad-h);
    }

    .guide-tabs {
      display: flex;
      border-bottom: 1px solid var(--sand);
      margin: 2.5rem 0;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
    }

    .guide-tabs::-webkit-scrollbar { display: none; }

    .guide-tab {
      flex: 1;
      text-align: center;
      padding: 10px 16px;
      font-size: 12px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--charcoal-mid);
      cursor: pointer;
      border: none;
      border-bottom: 2px solid transparent;
      margin-bottom: -1px;
      background: none;
      font-family: 'Jost', sans-serif;
      font-weight: 400;
      white-space: nowrap;
      transition: color 0.2s;
    }

    .guide-tab.active {
      color: var(--esterel);
      border-bottom-color: var(--esterel);
    }

    .guide-tab:hover:not(.active) { color: var(--terre); }

    #guide-panels-wrapper {
      position: relative;
      overflow: hidden;
    }

    .guide-panel { display: none; }
    .guide-panel.active {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1rem;
    }

    @keyframes guideSlideInRight  { from { transform: translateX(100%); } to { transform: translateX(0); } }
    @keyframes guideSlideInLeft   { from { transform: translateX(-100%); } to { transform: translateX(0); } }
    @keyframes guideSlideOutRight { from { transform: translateX(0); } to { transform: translateX(100%); } }
    @keyframes guideSlideOutLeft  { from { transform: translateX(0); } to { transform: translateX(-100%); } }

    .guide-panel.slide-in-right  { animation: guideSlideInRight  0.35s ease forwards; }
    .guide-panel.slide-in-left   { animation: guideSlideInLeft   0.35s ease forwards; }
    .guide-panel.slide-out-right { animation: guideSlideOutRight 0.35s ease forwards; }
    .guide-panel.slide-out-left  { animation: guideSlideOutLeft  0.35s ease forwards; }

    .guide-card {
      cursor: pointer;
      transition: transform 0.2s;
    }
    .guide-card:hover { transform: translateY(-3px); }

    /* ─── Guide Modal ─────────────────────── */
    #guide-modal {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(30, 20, 10, 0.92);
      z-index: 3000;
      align-items: center;
      justify-content: center;
      padding: 2rem;
    }
    #guide-modal.open { display: flex; }

    .guide-modal-inner {
      display: flex;
      width: 100%;
      max-width: 900px;
      max-height: 85vh;
      background: var(--white);
      overflow: hidden;
      position: relative;
    }

    .guide-modal-wrapper {
      position: relative;
      display: flex;
      align-items: stretch;
      width: 100%;
      max-width: 900px;
    }

    @media (min-width: 1025px) {
      .guide-modal-inner  { max-width: 1350px; }
      .guide-modal-wrapper { max-width: 1350px; }
      .guide-modal-content { padding: 3rem 3.5rem 2.5rem; }
      .guide-modal-title  { font-size: 44px; }
      .guide-modal-desc   { font-size: 16px; }
    }
    .guide-modal-nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.2);
      border-radius: 50%;
      color: var(--white);
      width: 44px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      z-index: 10;
      transition: background 0.2s;
    }
    .guide-modal-nav:hover { background: rgba(255,255,255,0.25); }
    .guide-modal-nav:disabled { opacity: 0.25; cursor: default; pointer-events: none; }
    .guide-modal-prev { right: calc(100% + 16px); }
    .guide-modal-next { left: calc(100% + 16px); }
    .guide-modal-nav svg { width: 20px; height: 20px; }

    .guide-modal-photo {
      width: 30%;
      flex-shrink: 0;
      position: relative;
      overflow: hidden;
      background: var(--sand);
    }
    .guide-modal-photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .guide-modal-photo-bg {
      width: 100%;
      height: 100%;
      position: absolute;
      inset: 0;
    }

    .guide-modal-content {
      width: 70%;
      padding: 2.5rem 2.5rem 2rem;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
    }

    .guide-modal-close {
      position: absolute;
      top: 0.75rem;
      right: 0.75rem;
      background: rgba(44,40,32,0.08);
      border: none;
      color: var(--charcoal);
      font-size: 16px;
      width: 36px;
      height: 36px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      z-index: 10;
      transition: background 0.2s;
    }
    .guide-modal-close:hover { background: rgba(44,40,32,0.15); }

    .guide-modal-tag {
      font-size: 10px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--esterel);
      font-weight: 500;
      font-family: 'Jost', sans-serif;
      margin-bottom: 0.75rem;
    }

    .guide-modal-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 32px;
      font-style: italic;
      font-weight: 400;
      color: var(--charcoal);
      line-height: 1.2;
      margin-bottom: 0.5rem;
    }

    .guide-modal-dist {
      font-family: 'Jost', sans-serif;
      font-size: 13px;
      color: var(--sage);
      letter-spacing: 0.05em;
      margin-bottom: 1.75rem;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .guide-modal-dist::before {
      content: '';
      display: inline-block;
      width: 20px;
      height: 1px;
      background: var(--sage);
      flex-shrink: 0;
    }

    .guide-modal-desc {
      font-size: 15px;
      color: var(--charcoal-mid);
      line-height: 1.8;
      flex: 1;
    }
    .guide-modal-desc p { margin-bottom: 1rem; }

    @media (max-width: 768px) {
      #guide-modal { padding: 0; align-items: flex-end; }
      .guide-modal-wrapper { max-width: 100%; }
      .guide-modal-inner { flex-direction: column; max-height: 90vh; max-width: 100%; width: 100%; }
      .guide-modal-photo { width: 100%; height: 220px; }
      .guide-modal-photo img { height: 220px; }
      .guide-modal-content { width: 100%; padding: 1.5rem; }
      .guide-modal-prev { right: auto; left: 12px; top: 110px; }
      .guide-modal-next { left: auto; right: 12px; top: 110px; }
    }

    .guide-card-img {
      aspect-ratio: 3/4;
      overflow: hidden;
      position: relative;
    }

    /* ⬇ Fonds placeholder - remplacer par des <img> */
    .guide-card-img.bg-plongee  { background: linear-gradient(145deg, var(--terre-deep) 0%, #1A3A4A 100%); }
    .guide-card-img.bg-rando    { background: linear-gradient(145deg, var(--sage) 0%, var(--terre) 100%); }
    .guide-card-img.bg-plage    { background: linear-gradient(145deg, var(--sand-dark) 0%, var(--terre) 100%); }
    .guide-card-img.bg-village  { background: linear-gradient(145deg, var(--esterel) 0%, var(--terre-deep) 100%); }

    .guide-card-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.5s ease;
    }

    .guide-card:hover .guide-card-img img { transform: scale(1.06); }

    .guide-card-tag {
      position: absolute;
      bottom: 12px;
      left: 12px;
      font-size: 10px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--white);
      background: rgba(0, 0, 0, 0.32);
      padding: 4px 10px;
    }

    .guide-card-body { padding: 1rem 0; }

    .guide-card-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px;
      color: var(--terre-deep);
      margin-bottom: 4px;
    }

    .guide-card-dist {
      font-size: 10px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--sage);
    }

    /* ══════════════════════════════════════════
       SECTION HÔTE
    ══════════════════════════════════════════ */
    #hote {
      background: var(--sand-light);
      padding: var(--section-pad-v) var(--section-pad-h);
    }

    .hote-inner { max-width: 880px; margin: 0 auto; text-align: center; }

    .hote-card {
      display: grid;
      grid-template-columns: 200px 1fr;
      gap: 2.5rem;
      align-items: center;
      background: var(--white);
      border: 1px solid var(--sand);
      padding: 2.5rem 2.75rem;
      margin-top: 2.5rem;
      text-align: left;
      box-shadow: 0 1px 3px rgba(44, 40, 32, 0.04);
    }

    .hote-photo-wrap {
      position: relative;
      width: 160px;
      height: 160px;
      justify-self: center;
      padding: 4px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--esterel) 0%, var(--sand-dark) 60%, var(--terre) 100%);
    }

    .hote-photo {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      object-fit: cover;
      display: block;
      background: var(--sand);
      box-shadow: 0 0 0 3px var(--white);
    }

    .hote-badge {
      position: absolute;
      bottom: 6px;
      right: 6px;
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background: var(--esterel);
      color: var(--white);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0 0 3px var(--white);
    }
    .hote-badge svg { width: 18px; height: 18px; }

    .hote-body { display: flex; flex-direction: column; gap: 1rem; }

    .hote-identity .hote-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(28px, 4vw, 36px);
      font-weight: 400;
      color: var(--terre-deep);
      margin: 0;
      line-height: 1.1;
    }
    .hote-identity .hote-role {
      font-size: 13px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--terre);
      margin: 6px 0 0;
    }

    .hote-stats {
      list-style: none;
      padding: 1rem 0;
      margin: 0;
      display: flex;
      gap: 2.5rem;
      border-top: 1px solid var(--sand);
      border-bottom: 1px solid var(--sand);
    }
    .hote-stat { display: flex; flex-direction: column; gap: 4px; }
    .hote-stat-value {
      font-family: 'Cormorant Garamond', serif;
      font-size: 28px;
      font-weight: 400;
      color: var(--terre-deep);
      line-height: 1;
    }
    .hote-stat-star { color: var(--esterel); font-size: 22px; }
    .hote-stat-label {
      font-size: 11px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--terre);
    }

    .hote-message {
      font-size: 15px;
      line-height: 1.75;
      color: var(--charcoal-mid);
      margin: 0;
      font-style: italic;
    }

    .hote-actions { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-top: 0.25rem; }
    .hote-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 12px 22px;
      font-size: 12px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      font-weight: 500;
      text-decoration: none;
      border: 1.5px solid var(--terre-deep);
      transition: background 0.2s, color 0.2s, border-color 0.2s;
      cursor: pointer;
    }
    .hote-btn-whatsapp {
      background: #25D366;
      color: var(--white);
      border-color: #25D366;
    }
    .hote-btn-whatsapp:hover { background: #1DA851; border-color: #1DA851; }
    .hote-btn-email {
      background: transparent;
      color: var(--terre-deep);
    }
    .hote-btn-email:hover { background: var(--terre-deep); color: var(--white); }

    @media (max-width: 768px) {
      .hote-card {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 2rem 1.5rem;
        text-align: center;
      }
      .hote-photo-wrap { width: 130px; height: 130px; }
      .hote-stats { justify-content: center; gap: 2rem; }
      .hote-stat { align-items: center; }
      .hote-actions { justify-content: center; }
      .hote-btn { flex: 1 1 100%; justify-content: center; }
    }

    /* ══════════════════════════════════════════
       SECTION BOOKING
    ══════════════════════════════════════════ */
    #booking {
      background: var(--terre-deep);
      padding: var(--section-pad-v) var(--section-pad-h);
    }

    .booking-inner {
      max-width: 820px;
      margin: 0 auto;
      text-align: center;
    }

    .booking-inner .section-label { color: var(--sand-dark); }
    .booking-inner .section-h2 { color: var(--sand-light); margin-bottom: 0.5rem; }

    .booking-sub {
      font-size: 16px;
      color: rgba(232, 223, 208, 0.6);
      margin-bottom: 1.5rem;
      line-height: 1.8;
    }

    /* ─── Booking Fields ─────────────────────── */
    .booking-fields {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 1rem;
      margin-bottom: 1.5rem;
      position: relative;
    }

    .booking-field {
      position: relative;
    }

    .booking-field label {
      display: block;
      font-size: 9px;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: var(--sand-dark);
      margin-bottom: 7px;
      font-weight: 500;
      text-align: left;
    }

    .booking-field-input {
      width: 100%;
      padding: 10px 12px;
      border: 1px solid rgba(232,223,208,0.25);
      background: rgba(254,253,251,0.08);
      font-family: 'Jost', sans-serif;
      font-size: 16px;
      color: var(--sand-light);
      outline: none;
      cursor: pointer;
      transition: border-color 0.2s;
      user-select: none;
    }
    .booking-field-input:focus-visible {
      outline: 2px solid var(--esterel);
      outline-offset: 0;
      border-color: var(--esterel);
    }
    .booking-field-input:hover { border-color: rgba(232,223,208,0.45); }
    .booking-field-input.active { border-color: var(--esterel); }
    .booking-field-input.has-value { color: var(--white); }

    .booking-field select {
      width: 100%;
      height: 48px;
      padding: 10px 12px;
      border: 1px solid rgba(232,223,208,0.25);
      background: rgba(254,253,251,0.08);
      font-family: 'Jost', sans-serif;
      font-size: 16px;
      color: var(--sand-light);
      outline: none;
      appearance: none;
      -webkit-appearance: none;
      cursor: pointer;
      transition: border-color 0.2s;
      box-sizing: border-box;
    }
    .booking-field select:hover { border-color: rgba(232,223,208,0.45); }
    .booking-field select:focus { border-color: var(--esterel); }
    .booking-field select option { background: var(--terre-deep); color: var(--sand-light); }

    /* ─── Summary line ─────────────────────── */
    .booking-summary {
      margin-bottom: 1.5rem;
      padding: 14px 20px;
      background: rgba(254,253,251,0.06);
      border: 1px solid rgba(232,223,208,0.15);
      display: none;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 0.5rem;
    }
    .booking-summary.visible { display: flex; }
    .booking-summary-left {
      font-family: 'Jost', sans-serif;
      font-size: 16px;
      color: var(--sand-light);
    }
    .booking-summary-left strong {
      color: var(--white);
      font-weight: 500;
    }
    .booking-summary-right {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      color: var(--white);
      font-weight: 400;
    }

    /* ─── Calendar dropdown ─────────────────── */
    .cal-dropdown {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      top: calc(100% + 8px);
      z-index: 100;
      background: var(--white);
      box-shadow: 0 12px 40px rgba(0,0,0,0.18);
      padding: 24px;
      display: none;
      width: max-content;
      max-width: 95vw;
    }
    .cal-dropdown.open { display: block; }

    .cal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 16px;
    }
    .cal-nav {
      background: none;
      border: 1px solid var(--sand-dark);
      color: var(--charcoal);
      width: 36px;
      height: 36px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      transition: background 0.2s, color 0.2s;
      flex-shrink: 0;
      margin: 0 16px;
    }
    .cal-nav:hover { background: var(--sand-light); }

    .cal-months {
      display: flex;
      gap: 30px;
    }

    .cal-month {
      width: 320px;
    }
    .cal-month-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      font-style: italic;
      color: var(--charcoal);
      text-align: center;
      margin-bottom: 12px;
    }

    .cal-weekdays {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      text-align: center;
      margin-bottom: 4px;
    }
    .cal-weekday {
      font-size: 14px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--terre);
      font-weight: 500;
      padding: 6px 0;
    }

    .cal-days {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
    }

    .cal-day {
      text-align: center;
      padding: 8px 0;
      cursor: pointer;
      position: relative;
      isolation: isolate;
      transition: background 0.15s;
    }
    .cal-day-num {
      font-family: 'Jost', sans-serif;
      font-size: 18px;
      font-weight: 400;
      color: var(--charcoal);
      line-height: 1.3;
    }
    .cal-day-price {
      font-family: 'Jost', sans-serif;
      font-size: 14px;
      color: var(--terre);
      line-height: 1.2;
    }

    .cal-day:hover:not(.cal-day--disabled):not(.cal-day--blocked):not(.cal-day--empty):not(.cal-day--checkout-only) {
      background: var(--sand-light);
    }

    .cal-day--empty {
      cursor: default;
    }
    .cal-day--disabled {
      cursor: default;
    }
    .cal-day--disabled .cal-day-num {
      color: var(--sand-dark);
    }
    .cal-day--disabled .cal-day-price {
      color: var(--sand-dark);
    }

    .cal-day--blocked {
      cursor: default;
      background: rgba(196,180,154,0.18);
    }
    .cal-day--blocked .cal-day-num {
      color: var(--sand-dark);
    }
    .cal-day--blocked .cal-day-price { display: none; }

    /* État invalid_min_stay : visuellement identique aux dates sélectionnables. */

    /* État checkout_only : date bloquée utilisable comme date de départ.
       Triangles gris clair (même teinte que les dates indisponibles). */
    .cal-day--checkout-only {
      cursor: pointer;
      background: transparent;
    }
    .cal-day--checkout-only::before {
      content: '';
      position: absolute;
      inset: 0;
      background: rgba(196,180,154,0.18);
      clip-path: polygon(100% 0, 100% 100%, 0 100%);
      pointer-events: none;
      z-index: -1;
    }
    .cal-day--checkout-only .cal-day-num {
      color: var(--charcoal);
    }
    .cal-day--checkout-only .cal-day-price { display: none; }

    /* Arrivée (◢ lower-right) / Départ (◤ upper-left) — triangles */
    .cal-day--start,
    .cal-day--end {
      background: transparent !important;
    }
    .cal-day--start::before,
    .cal-day--end::before {
      content: '';
      position: absolute;
      inset: 0;
      background: var(--esterel);
      pointer-events: none;
      z-index: -1;
    }
    .cal-day--start::before { clip-path: polygon(100% 0, 100% 100%, 0 100%); }
    .cal-day--end::before   { clip-path: polygon(0 0, 100% 0, 0 100%); }
    .cal-day--start .cal-day-num,
    .cal-day--end .cal-day-num {
      color: var(--charcoal) !important;
      font-weight: 600;
    }
    .cal-day--start .cal-day-price,
    .cal-day--end .cal-day-price {
      color: var(--charcoal) !important;
    }

    .cal-day--in-range {
      background: var(--esterel-soft);
    }
    .cal-day--in-range .cal-day-num {
      color: var(--white);
    }
    .cal-day--in-range .cal-day-price {
      color: rgba(255,255,255,0.6);
    }
    .cal-day--hover-range {
      background: var(--esterel-soft);
    }
    .cal-day--hover-range .cal-day-num {
      color: var(--white);
    }
    .cal-day--hover-range .cal-day-price {
      color: rgba(255,255,255,0.5);
    }
    /* Survol date d'arrivée — triangle ◢ */
    .cal-day--hover-start {
      background: transparent;
    }
    .cal-day--hover-start::before {
      content: '';
      position: absolute;
      inset: 0;
      background: var(--esterel);
      opacity: 0.85;
      clip-path: polygon(100% 0, 100% 100%, 0 100%);
      pointer-events: none;
      z-index: -1;
    }
    .cal-day--hover-start .cal-day-num {
      color: var(--charcoal);
      font-weight: 600;
    }
    .cal-day--hover-start .cal-day-price {
      color: var(--terre);
    }

    /* Survol date de départ — triangle ◤ */
    .cal-day--hover-end {
      background: transparent;
    }
    .cal-day--hover-end::before {
      content: '';
      position: absolute;
      inset: 0;
      background: var(--esterel);
      opacity: 0.85;
      clip-path: polygon(0 0, 100% 0, 0 100%);
      pointer-events: none;
      z-index: -1;
    }
    .cal-day--hover-end .cal-day-num {
      color: var(--charcoal);
      font-weight: 600;
    }
    .cal-day--hover-end .cal-day-price {
      color: var(--terre);
    }

    /* ─── Booking recap ────────────── */
    .booking-recap {
      display: none;
      background: rgba(254,253,251,0.06);
      border: 1px solid rgba(232,223,208,0.15);
      padding: 24px;
      margin-top: 1.5rem;
      text-align: left;
    }
    .booking-recap.visible { display: block; }
    .booking-recap h3 {
      font-family: 'Cormorant Garamond', serif;
      font-style: italic;
      font-size: 20px;
      color: var(--white);
      margin-bottom: 16px;
    }
    .recap-line {
      display: flex;
      justify-content: space-between;
      padding: 6px 0;
      font-size: 16px;
      color: var(--sand-light);
      border-bottom: 1px solid rgba(232,223,208,0.1);
    }
    .recap-line:has(+ .recap-total) { border-bottom: none; }
    .recap-total {
      display: flex;
      justify-content: space-between;
      padding: 12px 0 0;
      margin-top: 8px;
      border-top: 1px solid rgba(232,223,208,0.3);
      font-size: 18px;
      color: var(--white);
      font-weight: 500;
    }
    .recap-cgv {
      margin-top: 16px;
      font-size: 12px;
      color: rgba(232,223,208,0.5);
    }
    .recap-cgv label {
      cursor: pointer;
      display: flex;
      align-items: flex-start;
      gap: 8px;
    }
    .recap-cgv input[type="checkbox"] {
      margin-top: 2px;
      accent-color: var(--esterel);
    }
    .recap-cgv a {
      color: var(--sand-light);
      text-decoration: underline;
    }
    .booking-confirm {
      width: 100%;
      background: var(--esterel);
      color: var(--white);
      padding: 16px;
      font-size: 11px;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      font-weight: 500;
      border: none;
      cursor: pointer;
      font-family: 'Jost', sans-serif;
      transition: background 0.25s, opacity 0.25s;
      margin-top: 16px;
    }
    .booking-confirm:hover:not(:disabled) { background: var(--charcoal); }
    .booking-confirm:disabled { opacity: 0.35; cursor: not-allowed; }

    .booking-checkin-out {
      display: flex;
      gap: 1.5rem;
      margin-top: 12px;
      font-size: 12px;
      color: var(--terre-deep);
      justify-content: center;
    }

    .booking-min-stay {
      font-size: 12px;
      color: var(--terre-deep);
      margin-top: 6px;
    }

    .booking-sync-note {
      font-size: 11px;
      color: rgba(232,223,208,0.65);
      letter-spacing: 0.05em;
      line-height: 1.6;
      margin-top: 1.5rem;
    }

    .booking-note {
      font-size: 11px;
      color: rgba(232, 223, 208, 0.65);
      letter-spacing: 0.05em;
      line-height: 1.6;
      margin-bottom: 1.5rem;
    }

    .booking-trust-row {
      display: flex;
      justify-content: center;
      gap: 2.5rem;
      flex-wrap: wrap;
      margin-top: 3.5rem;
    }

    .booking-trust-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 11px;
      color: rgba(232, 223, 208, 0.5);
      letter-spacing: 0.06em;
    }

    .trust-dot {
      width: 5px;
      height: 5px;
      background: var(--sage-light);
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* ══════════════════════════════════════════
       SECTION LOCALISATION
    ══════════════════════════════════════════ */
    #localisation {
      background: var(--white);
      padding: var(--section-pad-v) var(--section-pad-h);
    }

    .map-grid {
      display: grid;
      grid-template-columns: 1fr 2fr;
      gap: 4rem;
      align-items: center;
      margin-top: 3rem;
    }

    .map-distances { list-style: none; }

    .map-dist-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0.45rem 0;
      border-bottom: 1px solid var(--sand);
    }

    .map-dist-place {
      font-size: 14px;
      color: var(--charcoal-mid);
    }

    .map-dist-time {
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px;
      color: var(--terre);
    }

    .map-container {
      /* ⬇ Google Maps iframe s'intègre ici */
      background: var(--sand-light);
      border: 1px solid var(--sand);
      aspect-ratio: 16/7;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 8px;
      position: relative;
      overflow: hidden;
    }

    .map-container iframe {
      width: 100%;
      height: 100%;
      border: none;
    }


    /* ══════════════════════════════════════════
       FOOTER
    ══════════════════════════════════════════ */
    footer {
      background: var(--charcoal);
      padding: 3.5rem var(--section-pad-h);
    }

    .footer-top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      padding-bottom: 2.5rem;
      border-bottom: 1px solid rgba(255, 255, 255, 0.07);
      margin-bottom: 1.75rem;
    }

    .footer-logo {
      font-family: 'Cormorant Garamond', serif;
      font-size: 24px;
      font-weight: 300;
      color: var(--sand-light);
      letter-spacing: 0.1em;
    }

    .footer-logo span { color: var(--esterel-soft); }

    .footer-tagline {
      font-size: 10px;
      color: rgba(200, 185, 165, 0.4);
      letter-spacing: 0.12em;
      text-transform: uppercase;
      margin-top: 6px;
    }

    .footer-nav {
      display: flex;
      flex-direction: column;
      gap: 0.6rem;
      align-items: flex-end;
    }

    .footer-nav a {
      font-size: 10px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: rgba(200, 185, 165, 0.4);
      transition: color 0.2s;
    }

    .footer-nav a:hover { color: var(--sand-light); }

    .footer-bottom {
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .footer-copy {
      font-size: 10px;
      color: rgba(200, 185, 165, 0.28);
      letter-spacing: 0.08em;
    }

    .footer-platforms {
      display: flex;
      gap: 10px;
    }

    .platform-badge {
      padding: 4px 12px;
      border: 1px solid rgba(255, 255, 255, 0.1);
      font-size: 9px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(200, 185, 165, 0.35);
    }

    /* ══════════════════════════════════════════
       STICKY MOBILE CTA BAR
    ══════════════════════════════════════════ */
    #mobile-sticky-bar {
      display: none;
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      background: var(--terre-deep);
      padding: 10px 20px;
      z-index: 999;
      align-items: center;
      justify-content: space-between;
      border-top: 1px solid rgba(255,255,255,0.08);
      transition: transform 0.3s ease;
    }

    .mobile-bar-price-label {
      font-size: 9px;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--sand-dark);
    }

    .mobile-bar-price-value {
      font-family: 'Cormorant Garamond', serif;
      font-size: 24px;
      color: var(--sand-light);
      font-weight: 300;
    }

    .mobile-bar-price-unit {
      font-size: 12px;
      color: rgba(232,223,208,0.5);
    }

    .mobile-bar-btn {
      background: var(--esterel);
      color: var(--white);
      padding: 10px 20px;
      font-size: 12px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      font-weight: 500;
      border: none;
      cursor: pointer;
      font-family: 'Jost', sans-serif;
      white-space: nowrap;
    }

    /* ══════════════════════════════════════════
       LIGHTBOX GALERIE
    ══════════════════════════════════════════ */
    #lightbox {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(30, 20, 10, 0.95);
      z-index: 3000;
      align-items: center;
      justify-content: center;
      flex-direction: column;
    }

    #lightbox.open { display: flex; }

    #lightbox img {
      max-width: 90vw;
      max-height: 85vh;
      object-fit: contain;
    }

    .lightbox-close {
      position: absolute;
      top: 1.5rem;
      right: 1.5rem;
      background: none;
      border: 1px solid rgba(255,255,255,0.2);
      color: var(--white);
      font-size: 20px;
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
    }

    .lightbox-nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.25);
      color: var(--white);
      width: 48px;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: background 0.2s;
      border-radius: 2px;
      user-select: none;
    }
    .lightbox-nav svg { width: 22px; height: 22px; }
    .lightbox-nav:hover { background: rgba(255,255,255,0.28); }
    .lightbox-prev { left: 1.5rem; }
    .lightbox-next { right: 1.5rem; }

    .lightbox-counter {
      position: absolute;
      bottom: 1.5rem;
      left: 50%;
      transform: translateX(-50%);
      color: rgba(255,255,255,0.65);
      font-family: 'Jost', sans-serif;
      font-size: 14px;
      letter-spacing: 0.1em;
      white-space: nowrap;
    }

    /* ══════════════════════════════════════════
       RESPONSIVE - TABLETTE (≤1024px)
    ══════════════════════════════════════════ */
    @media (max-width: 1024px) {
      :root {
        --section-pad-h: 2.5rem;
      }

      .apt-mosaic { height: 400px; }
      .photo-more-tablet { display: flex; }
      .apt-details { grid-template-columns: 1fr; gap: 2rem; }
      .apt-details-specs-grid { grid-template-columns: 1fr 1fr; }
      .guide-panel.active { grid-template-columns: repeat(2, 1fr); }
      .avis-card { flex: 0 0 calc(50% - 0.75rem); }
    }

    /* ══════════════════════════════════════════
       RESPONSIVE - MOBILE (≤768px)
    ══════════════════════════════════════════ */
    @media (max-width: 768px) {
      :root {
        --section-pad-v: 4rem;
        --section-pad-h: 1.5rem;
      }

      /* Nav */
      #main-nav { padding: 0 var(--section-pad-h); }
      .nav-links { display: none; }
      .nav-hamburger { display: flex; }
      .nav-drawer { display: flex; }

      /* Hero */
      .hero-content { padding-left: 1.5rem; padding-right: 1.5rem; padding-bottom: 2.5rem; }
      .hero-h1 { font-size: clamp(32px, 9vw, 44px); }
      .hero-actions { flex-direction: column; align-items: flex-start; }
      .btn-primary, .btn-ghost { width: 100%; text-align: center; }

      /* Appartement — galerie swipeable */
      .apt-header { margin-bottom: 2rem; }
      .apt-mosaic {
        display: flex;
        flex-direction: row;
        overflow-x: scroll;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        height: auto;
        gap: 6px;
      }
      .apt-mosaic::-webkit-scrollbar { display: none; }
      .mosaic-hero,
      .mosaic-side-top,
      .mosaic-side-mid,
      .mosaic-side-btm {
        display: block;
        flex: 0 0 85vw;
        aspect-ratio: 4/3;
        scroll-snap-align: start;
        height: auto;
        min-height: 0;
      }
      .photo-more-mobile { display: none; }
      .photo-more-tablet { display: none; }
      .photo-more-corner-mobile { display: block; }
      /* Indicateur swipe */
      .apt-swipe-hint { display: flex; }
      /* Masquer le bouton coin sur les photos non-hero en mobile */
      .mosaic-side-top .photo-more-corner-mobile,
      .mosaic-side-mid .photo-more-corner-mobile,
      .mosaic-side-btm .photo-more-corner-mobile { display: none; }
      .apt-details { grid-template-columns: 1fr; gap: 2rem; margin-top: 2.5rem; }
      .apt-details-specs-grid { grid-template-columns: 1fr 1fr; }

      /* Avis */
      .avis-header { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
      .avis-card { flex: 0 0 calc(100% - 1rem); min-width: 0; }

      /* Guide */
      .guide-panel.active { grid-template-columns: 1fr 1fr; }

      /* Booking */
      .booking-fields { grid-template-columns: 1fr; }
      .booking-trust-row { flex-direction: column; gap: 1rem; align-items: center; }
      .cal-dropdown { left: 0; transform: none; width: 100%; padding: 12px; }
      .cal-header { flex-wrap: wrap; }
      .cal-header .cal-nav { order: 0; }
      .cal-months { flex-direction: column; gap: 16px; width: 100%; order: 1; flex-basis: 100%; }
      .cal-month { width: 100%; }
      .booking-summary { flex-direction: column; text-align: center; }
      .booking-recap { padding: 16px; }

      /* Map */
      .map-grid { grid-template-columns: 1fr; }
      .map-container { aspect-ratio: 4/3; }

      /* Footer */
      .footer-top { flex-direction: column; gap: 2rem; }
      .footer-nav { align-items: flex-start; }
      .footer-bottom { flex-direction: column; gap: 1rem; text-align: center; }

      /* Sticky mobile bar */
      #mobile-sticky-bar { display: flex; transform: translateY(100%); pointer-events: none; }

      /* padding bottom pour ne pas masquer le contenu par la sticky bar */
      body { padding-bottom: 72px; }
    }

    @media (max-width: 480px) {
      .hero-h1 { font-size: 34px; }
    }

    /* ══════════════════════════════════════════
       ANIMATIONS AU SCROLL
    ══════════════════════════════════════════ */
    .reveal {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity 0.7s ease, transform 0.7s ease;
    }

    .reveal.visible {
      opacity: 1;
      transform: translateY(0);
    }

    /* ══════════════════════════════════════════
       REDUCED MOTION & FOCUS
    ══════════════════════════════════════════ */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
      }
      html { scroll-behavior: auto; }
      .reveal { opacity: 1; transform: none; transition: none; }
      .photo-item img { transition: none; }
      .guide-panel.slide-in-right,
      .guide-panel.slide-in-left,
      .guide-panel.slide-out-right,
      .guide-panel.slide-out-left { animation: none; }
    }

    :focus-visible {
      outline: 2px solid var(--esterel);
      outline-offset: 3px;
    }

    /* ══════════════════════════════════════════
       TEXTES COURANTS +2px (hors titres/sous-titres)
    ══════════════════════════════════════════ */
    .hero-sub           { font-size: 18px; }
    .section-intro      { font-size: 18px; }
    .descriptif-complet p              { font-size: 16px; }
    .descriptif-complet ul li          { font-size: 16px; }
    .descriptif-complet em             { font-size: 15px; }
    .avis-card-text     { font-size: 21px; }
    .avis-card-author   { font-size: 14px; }
    .map-dist-place     { font-size: 16px; }
    .map-dist-time      { font-size: 22px; }
    .booking-sub        { font-size: 18px; }
    .booking-sync-note  { font-size: 13px; }
    .platform-rating-desc { font-size: 13px; }
    .guide-card-dist    { font-size: 12px; }
    .footer-tagline     { font-size: 12px; }
    .footer-copy        { font-size: 12px; }