@media(max-width:1100px){
  .reason-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:980px){
  .nav,.header-cta{display:none}
  .menu-toggle{display:block}
  .nav.open{
    display:flex;
    position:absolute;
    top:82px;
    left:16px;
    right:16px;
    background:#fff;
    color:#222;
    flex-direction:column;
    padding:20px;
    border:1px solid var(--line);
  }

  .hero{grid-template-columns:1fr;padding:130px 20px 70px}
  .availability-card{grid-column:auto;margin-top:30px}
  .destination-section,.property-content,.property-video{grid-template-columns:1fr}
  .apartment-card,.apartment-card:nth-child(even){grid-template-columns:1fr}
  .apartment-card:nth-child(even) .apartment-media{order:0}
  .practical-grid,.footer-grid,.contact-page{grid-template-columns:1fr 1fr}
}

@media(max-width:640px){
  .site-header{height:72px}
  .brand small{display:none}
  .hero{min-height:auto;padding-top:120px}
  .hero-media video{object-position:center center}
  .hero h1{font-size:34px}
  .hero-kicker{font-size:13px}
  .hero-location{font-size:12px}
  .hero-description{font-size:15px}
  .section{padding:58px 18px}
  .destination-gallery,.property-gallery,.full-gallery{grid-template-columns:1fr;grid-template-rows:auto}
  .destination-main,.property-gallery .large{grid-row:auto}
  .destination-gallery img,.property-gallery button,.full-gallery button{min-height:230px}
  .reason-grid,.practical-grid,.review-grid,.footer-grid,.equipment-grid,.contact-page{grid-template-columns:1fr}
  .contact-section,.property-hero{display:block}
  .apartment-content{padding:28px}
  .apartment-content h3{font-size:32px}
}


/* V7 responsive */
@media(max-width:1100px){
  .airbnb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .practical-icons{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:700px){
  .hero{min-height:auto;padding-bottom:64px}
  .hero-kicker{font-size:42px}
  .hero-location{margin-top:7px;font-size:16px}
  .hero h1{margin-top:26px;font-size:32px;line-height:1.15}
  .hero-description{font-size:16px;line-height:1.6}

  .airbnb-grid{grid-template-columns:1fr;gap:34px}
  .airbnb-card-gallery{aspect-ratio:4/3;border-radius:16px}
  .airbnb-arrow{opacity:.92;width:32px;height:32px}

  .practical-icons{grid-template-columns:repeat(2,1fr)}
  .practical-icon-card{padding:18px 10px}

  .property-gallery-v7{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows:250px 170px 170px;
  }
  .property-gallery-v7 .large{
    grid-column:1/3;
    grid-row:auto;
  }
}


/* V7.1 responsive */
@media(max-width:1250px){
  .activities-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .activities-section .section-title h2,
  .practical-discreet .section-title h2{
    white-space:normal;
  }
}

@media(max-width:980px){
  .hero-kicker{
    white-space:normal;
  }

  .brand strong{
    white-space:normal;
  }
}

@media(max-width:700px){
  .hero-kicker{
    font-size:40px;
    line-height:1.04;
  }

  .hero h1{
    font-size:31px;
  }

  .activities-grid{
    grid-template-columns:1fr 1fr;
  }

  .destination-copy p{
    font-size:14px;
  }
}

@media(max-width:460px){
  .activities-grid{
    grid-template-columns:1fr;
  }

  .brand strong{
    font-size:15px;
  }
}

@media(max-width:1050px){
  .property-showcase{grid-template-columns:1fr;gap:34px;padding-top:118px}
  .property-showcase-left{position:static}
  .property-showcase-left h2,.property-intro{max-width:none}
}
@media(max-width:700px){
  .property-showcase{padding-left:18px;padding-right:18px;padding-top:102px}
  .property-showcase-left h1{font-size:44px}
  .property-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .property-main-photo{aspect-ratio:4/3;border-radius:14px}
  .property-thumb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .property-thumb-grid button{aspect-ratio:4/3}
}
@media(max-width:440px){
  .property-feature-grid{grid-template-columns:1fr}
  .property-contact-card{grid-template-columns:48px 1fr}
}


/* V7.3 responsive */
@media(max-width:1180px){
  .property-showcase{
    min-height:auto;
    align-items:start;
  }

  .reviews-compact{
    grid-template-columns:1fr;
  }

  .reviews-compact .section-title{
    max-width:620px;
  }
}

@media(max-width:900px){
  .reviews-compact .review-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:700px){
  .property-showcase{
    padding-top:94px;
    padding-bottom:44px;
  }

  .property-showcase-left h1{
    font-size:40px;
  }

  .property-feature-grid{
    grid-template-columns:1fr 1fr;
  }

  .reviews-compact .review-grid{
    grid-template-columns:1fr;
  }

  .reviews-compact blockquote{
    min-height:auto;
  }
}

/* V7.4 responsive */
@media(max-width:700px){
  .property-page-v74 .property-showcase{
    padding-top:88px;
  }

  .property-sibling-nav{
    grid-template-columns:1fr;
  }

  .property-sibling-nav a:last-child{
    text-align:left;
  }
}


/* V7.5 responsive */
@media(max-width:980px){
  .nav.open .nav-socials{
    margin:8px 0 0;
  }

  .gallery-masonry{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-auto-rows:190px;
  }
}

@media(max-width:620px){
  .gallery-hero-compact{
    padding-top:104px;
    padding-bottom:34px;
  }

  .gallery-hero-compact h1{
    font-size:34px;
  }

  .gallery-section-v75{
    padding-top:32px;
  }

  .gallery-group{
    margin-bottom:58px;
  }

  .gallery-masonry{
    grid-template-columns:1fr;
    grid-auto-rows:240px;
  }

  .gallery-masonry .gallery-featured{
    grid-column:auto;
    grid-row:auto;
  }
}


/* V7.6 responsive */
@media(max-width:980px){
  .nav-socials{
    margin-left:0;
  }

  .property-detail-page .site-header .header-cta{
    display:none;
  }
}

@media(max-width:700px){
  .property-media-actions{
    grid-template-columns:1fr;
  }

  .contact-page-v76 .page-hero-simple h1,
  .gallery-page-v76 .gallery-hero-compact h1{
    font-size:34px;
  }
}


/* V7.7 responsive */
@media(max-width:1180px){
  .gallery-v77-grid{
    grid-template-columns:repeat(5,minmax(0,1fr));
  }
}

@media(max-width:900px){
  .gallery-v77-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .nav-socials{
    margin-left:0;
  }
}

@media(max-width:620px){
  .gallery-v77{
    padding-top:72px;
  }

  .gallery-v77-intro{
    padding-top:30px;
  }

  .gallery-v77-intro h1{
    font-size:31px;
  }

  .gallery-filter-bar{
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:5px;
  }

  .gallery-filter-bar button{
    flex:0 0 auto;
  }

  .gallery-v77-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .video-modal{
    padding:12px;
  }

  .video-modal-close{
    top:6px;
    right:6px;
  }
}


/* V7.8 responsive contact */
@media(max-width:1180px){
  .contact-v78-hero h1{
    white-space:normal;
  }

  .contact-v78-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px){
  .contact-v78{
    padding-top:72px;
  }

  .contact-v78-hero{
    padding-top:42px;
    padding-bottom:36px;
  }

  .contact-v78-hero h1{
    font-size:36px;
  }

  .contact-v78-hero > p:last-child{
    font-size:16px;
  }

  .contact-v78-grid{
    grid-template-columns:1fr;
    padding-top:38px;
    padding-bottom:58px;
  }

  .contact-v78-card{
    min-height:124px;
  }
}


/* V7.9 responsive */
@media(max-width:1100px){
  .contact-v78-hero h1,
  .contact-v78-hero > p:last-child{
    white-space:normal;
  }
}

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

  .contact-v78-hero > p:last-child{
    font-size:15px;
  }
}


/* =========================================================
   V7.11 + V7.12 — ACCUEIL MOBILE, TOUS SMARTPHONES
   ========================================================= */

@media (max-width: 768px) {
  .hero {
    display: block;
    min-height: auto;
    padding: 0 18px 38px;
  }

  .hero-content {
    width: 100%;
    max-width: none;
    min-height: calc(100svh - 76px);
    padding-top: 112px;
    padding-bottom: 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .hero-kicker {
    width: 100%;
    margin: 0;
    white-space: nowrap;
    font-size: clamp(27px, 7.2vw, 36px);
    line-height: 1.04;
    letter-spacing: -0.035em;
  }

  .hero-location {
    margin-top: 8px;
    font-size: 15px;
  }

  .hero h1 {
    margin-top: 22px;
    margin-bottom: 16px;
    font-size: clamp(31px, 8.3vw, 42px);
    line-height: 1.1;
  }

  .hero-description {
    margin-bottom: 0;
    font-size: 16px;
    line-height: 1.55;
  }

  .hero-actions {
    display: block;
    margin-top: 22px;
  }

  .hero-actions .btn:nth-child(n + 2) {
    display: none !important;
  }

  .hero-actions .btn:first-child {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    white-space: nowrap;
    font-size: clamp(11px, 3.2vw, 14px);
    text-align: center;
  }

  .availability-card {
    width: 100%;
    margin: 18px 0 0;
    padding: 24px 20px;
    border-radius: 14px;
  }

  .availability-card h2 {
    margin: 6px 0 10px;
    font-size: clamp(27px, 7.5vw, 34px);
    line-height: 1.08;
  }

  .availability-card p {
    margin-bottom: 18px;
    font-size: 14px;
    line-height: 1.5;
  }

  .availability-card .btn {
    min-height: 48px;
    padding: 0 12px;
    font-size: 11px;
  }
}

@media (max-width: 375px) {
  .hero {
    padding-left: 12px;
    padding-right: 12px;
  }

  .hero-content {
    padding-top: 102px;
  }

  .hero-kicker {
    font-size: 25px;
  }

  .hero h1 {
    font-size: 29px;
  }

  .hero-actions .btn:first-child {
    font-size: 10px;
  }
}

@supports not (height: 100svh) {
  @media (max-width: 768px) {
    .hero-content {
      min-height: calc(100vh - 76px);
    }
  }
}


/* =========================================================
   V7.13 — CARTE DISPONIBILITÉS COMPACTE SUR MOBILE
   ========================================================= */

@media (max-width: 768px) {
  /*
   * Le petit libellé « DISPONIBILITÉS » est retiré sur mobile
   * afin de gagner de la hauteur.
   */
  .availability-card > .eyebrow,
  .availability-card .eyebrow {
    display: none !important;
  }

  /*
   * Carte plus compacte pour que son contenu complet tienne
   * dans la hauteur utile d'un smartphone.
   */
  .availability-card {
    margin-top: 12px;
    padding: 18px 16px;
    border-radius: 12px;
  }

  .availability-card h2 {
    margin: 0 0 8px;
    font-size: clamp(24px, 6.8vw, 30px);
    line-height: 1.05;
  }

  .availability-card p {
    margin: 0 0 13px;
    font-size: 13px;
    line-height: 1.42;
  }

  .availability-card .btn {
    min-height: 44px;
    padding: 0 10px;
    font-size: 10px;
    line-height: 1.2;
  }
}

@media (max-width: 375px) {
  .availability-card {
    padding: 16px 14px;
  }

  .availability-card h2 {
    font-size: 23px;
  }

  .availability-card p {
    font-size: 12px;
  }

  .availability-card .btn {
    min-height: 42px;
    font-size: 9px;
  }
}


/* =========================================================
   V7.14 — HERO MOBILE PREMIUM PLEIN ÉCRAN
   ========================================================= */

@media (max-width: 768px) {
  /*
   * Le Hero devient une vraie couverture immersive.
   * La carte blanche de disponibilités est remplacée sur mobile
   * par un bandeau WhatsApp discret en bas de l'image.
   */
  .hero {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100svh;
    padding: 0 24px 28px;
    overflow: hidden;
  }

  .hero-media {
    background-position: center center;
    background-size: cover;
  }

  .hero-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(9, 24, 24, .18) 0%,
        rgba(9, 24, 24, .14) 18%,
        rgba(9, 24, 24, .38) 48%,
        rgba(9, 24, 24, .72) 100%
      );
  }

  .hero-content {
    width: 100%;
    max-width: none;
    min-height: auto;
    flex: 1 1 auto;
    padding: 122px 0 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  /*
   * Titre de bienvenue en deux lignes, comme sur la maquette.
   */
  .hero-kicker {
    display: block;
    width: 100%;
    margin: 0;
    white-space: normal;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(46px, 12vw, 64px);
    line-height: .98;
    letter-spacing: -.045em;
    text-transform: none;
    font-weight: 400;
  }

  .hero-kicker span {
    display: block;
  }

  .hero-kicker-place {
    margin-top: 4px;
  }

  .hero-location {
    margin-top: 13px;
    font-size: 15px;
    color: rgba(255,255,255,.92);
  }

  .hero-mobile-divider {
    display: block;
    width: 36px;
    height: 2px;
    margin: 26px 0 24px;
    background: #d9ae62;
  }

  .hero h1 {
    max-width: 650px;
    margin: 0 0 22px;
    font-size: clamp(38px, 10.4vw, 52px);
    line-height: 1.08;
    letter-spacing: -.025em;
  }

  .hero-description {
    max-width: 640px;
    margin: 0;
    font-size: clamp(16px, 4.15vw, 19px);
    line-height: 1.65;
    color: rgba(255,255,255,.94);
  }

  .hero-actions {
    display: block;
    margin-top: 28px;
  }

  /* Un seul bouton principal sur mobile */
  .hero-actions .btn:nth-child(n + 2) {
    display: none !important;
  }

  .hero-actions .btn:first-child {
    width: auto;
    max-width: 100%;
    min-height: 58px;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    white-space: nowrap;
    border-radius: 8px;
    font-size: clamp(11px, 3.15vw, 14px);
    letter-spacing: .04em;
    text-align: center;
  }

  .hero-action-arrow {
    display: inline;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
  }

  /* L'ancienne carte Disponibilités n'apparaît plus dans le Hero mobile */
  .availability-card {
    display: none !important;
  }

  /*
   * Nouveau contact WhatsApp en bas du Hero.
   */
  .hero-mobile-contact {
    position: relative;
    z-index: 4;
    width: 100%;
    min-height: 98px;
    margin-top: auto;
    padding: 18px 2px 4px;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    color: #fff;
    border-top: 1px solid rgba(255,255,255,.28);
  }

  .hero-mobile-contact-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.55);
    border-radius: 10px;
    font-size: 24px;
    background: rgba(255,255,255,.05);
    backdrop-filter: blur(6px);
  }

  .hero-mobile-contact-copy {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
  }

  .hero-mobile-contact-copy strong {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 400;
  }

  .hero-mobile-contact-copy small {
    font-size: 12px;
    line-height: 1.35;
    color: rgba(255,255,255,.86);
  }

  .hero-mobile-contact-arrow {
    padding-right: 5px;
    font-size: 27px;
    line-height: 1;
  }
}

/*
 * Le bloc WhatsApp ajouté au Hero reste invisible sur tablette large
 * et ordinateur.
 */
@media (min-width: 769px) {
  .hero-mobile-contact,
  .hero-mobile-divider,
  .hero-action-arrow {
    display: none;
  }

  .hero-kicker span {
    display: inline;
  }

  .hero-kicker-place::before {
    content: " ";
  }
}

/* Réglage spécifique pour les écrans étroits */
@media (max-width: 390px) {
  .hero {
    padding-left: 18px;
    padding-right: 18px;
  }

  .hero-content {
    padding-top: 108px;
  }

  .hero-kicker {
    font-size: clamp(42px, 11.8vw, 50px);
  }

  .hero h1 {
    font-size: clamp(34px, 9.8vw, 42px);
  }

  .hero-description {
    font-size: 15px;
    line-height: 1.55;
  }

  .hero-actions .btn:first-child {
    width: 100%;
    padding-left: 14px;
    padding-right: 14px;
    gap: 10px;
    font-size: 10px;
  }

  .hero-mobile-contact {
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 11px;
  }

  .hero-mobile-contact-icon {
    width: 48px;
    height: 48px;
  }

  .hero-mobile-contact-copy strong {
    font-size: 18px;
  }

  .hero-mobile-contact-copy small {
    font-size: 11px;
  }
}

/* Repli pour les anciens navigateurs */
@supports not (height: 100svh) {
  @media (max-width: 768px) {
    .hero {
      min-height: 100vh;
    }
  }
}
