/* Pierre et Jardins — responsive.css — mobile-first strict (390px cible) */

/* ── HEADER MOBILE ── */
@media (max-width: 767px) {
  .header { height: var(--header-h-mobile); }
  .header__nav  { display: none; }
  .header__cta  { display: none; }
  .burger       { display: grid; } /* burger activé sur mobile */
  html { scroll-padding-top: var(--header-h-mobile); }
}
@media (min-width: 768px) {
  .burger       { display: none; }
  .menu-mobile  { display: none; }
}

/* ── HERO IMMERSIF MOBILE ── */
@media (max-width: 767px) {
  .hero-immersif {
    min-height: 82dvh;
    padding: calc(var(--header-h-mobile) + 24px) 20px 40px;
    align-items: flex-end;
    border-radius: 0 0 14px 14px;
  }
  .hero-immersif__title { font-size: clamp(2.2rem, 10vw, 3rem); }
  .hero-immersif__sub { font-size: .97rem; margin: 14px 0 22px; }

  /* CTA héro : colonnes empilées pleine largeur sur mobile — OBLIGATOIRE */
  .hero-immersif__cta {
    flex-direction: column;
    width: 100%;
  }
  .hero-immersif__cta .btn {
    width: 100%;
    justify-content: center;
  }
}

/* ── STATS STRIP MOBILE ── */
@media (max-width: 560px) {
  .stats-strip__inner {
    gap: 20px;
    justify-content: space-around;
  }
  .stat-item { flex: 0 0 calc(50% - 12px); }
}

/* ── ABOUT LEAD MOBILE ── */
@media (max-width: 767px) {
  .about-lead-block {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .about-lead-img {
    max-width: 100%;
    aspect-ratio: 16/10;
    order: -1;
  }
}

/* ── PROCESS GRID MOBILE ── */
@media (max-width: 767px) {
  .process-grid { grid-template-columns: 1fr; gap: 28px; }
}

/* ── SERVICES LIST MOBILE ── */
@media (max-width: 560px) {
  .svc-list__item {
    grid-template-columns: 40px 1fr;
    gap: 14px;
  }
  .svc-list__arrow { display: none; }
  .svc-list__title { font-size: 1.05rem; }
}

/* ── RÉALISATIONS HEADER MOBILE ── */
@media (max-width: 600px) {
  .realisations-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
}

/* ── ZONE GRID MOBILE ── */
@media (max-width: 767px) {
  .zone-grid { grid-template-columns: 1fr; gap: 28px; }
  .zone-map { padding-top: 70%; }
}

/* ── CONTACT GRID MOBILE ── */
@media (max-width: 767px) {
  .contact-grid { grid-template-columns: 1fr; gap: 32px; }
}

/* ── FOOTER MOBILE ── */
@media (max-width: 767px) {
  .footer__inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* ── GALERIE MASONRY MOBILE (realisations.html) ── */
@media (max-width: 900px) { .gal-masonry { column-count: 2; } }
@media (max-width: 560px) { .gal-masonry { column-count: 1; } }

/* ── CTA FINAL MOBILE ── */
@media (max-width: 560px) {
  .real-cta__btns { flex-direction: column; align-items: center; }
  .real-cta__btns .btn { width: 100%; max-width: 320px; }
}

/* ── FORM GRID MOBILE ── */
@media (max-width: 560px) {
  .form-grid { grid-template-columns: 1fr; }
}

/* ── LIGHTBOX MOBILE ── */
@media (max-width: 600px) {
  .lightbox__prev { left: 4px; }
  .lightbox__next { right: 4px; }
}

/* ── PAGE HERO MOBILE ── */
@media (max-width: 600px) {
  .page-hero { padding-top: calc(var(--header-h-mobile) + 24px); }
}

/* wf-noxoverflow : reveal vertical (le slide horizontal deborde la largeur sur mobile) */
[data-reveal]:not(.in){ transform: translateY(18px) !important; }