.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;
}

html {
  scroll-behavior: smooth;
}

/* Réseaux sociaux : masquage forcé si enabled: false dans site.json */
.social-link--off,
[data-social-links].social-link--off {
  display: none !important;
}

body {
  font-family: "DM Sans", system-ui, sans-serif;
  color: #1a3026;
  background-color: #f5f1e3;
}

.container-combi {
  width: min(72rem, calc(100% - 2rem));
  margin-inline: auto;
  padding-inline: 1rem;
}

@media (min-width: 640px) {
  .container-combi {
    padding-inline: 1.5rem;
  }
}

.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.5rem;
  background-color: #d97328;
  padding: 0.75rem 1.5rem;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #fff;
  transition: background-color 0.2s;
}

.btn-primary:hover {
  background-color: #c26220;
}

.btn-forest {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.5rem;
  background-color: #2d4f36;
  padding: 0.75rem 1.5rem;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #fff;
  transition: background-color 0.2s;
}

.btn-forest:hover {
  background-color: #243f2b;
}

.nav-link {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #2d4f36;
  transition: color 0.2s;
}

.nav-link:hover {
  color: #d97328;
}

.nav-link-active {
  color: #d97328;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 2px;
}

.icon-badge {
  display: flex;
  width: 4rem;
  height: 4rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: #f5f1e3;
  font-size: 1.5rem;
  color: #2d4f36;
  box-shadow: 0 12px 28px rgba(45, 79, 54, 0.12);
}

.icon-badge-orange {
  display: flex;
  width: 3.5rem;
  height: 3.5rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: #d97328;
  font-size: 1.25rem;
  color: #fff;
}

.section-title {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #2d4f36;
}

.section-title-light {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff;
}

.combi-card {
  overflow: hidden;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 12px 28px rgba(45, 79, 54, 0.12);
  transition: transform 0.2s;
}

.combi-card:hover {
  transform: translateY(-4px);
}

.polaroid {
  background: #fff;
  padding: 0.75rem 0.75rem 2rem;
  box-shadow: 0 8px 24px rgba(26, 48, 38, 0.18);
  transition: transform 0.3s;
}

.polaroid:hover {
  transform: rotate(0deg) !important;
}

.polaroid-caption {
  margin-top: 0.75rem;
  text-align: center;
  font-family: Pacifico, cursive;
  font-size: 1.125rem;
  color: #2d4f36;
}

.stamp-badge {
  display: flex;
  width: 7rem;
  height: 7rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border: 4px dashed #d97328;
  background: rgba(245, 241, 227, 0.92);
  text-align: center;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.3;
  color: #2d4f36;
}

.input-field {
  width: 100%;
  border-radius: 0.5rem;
  border: 1px solid rgba(45, 79, 54, 0.2);
  background: #fff;
  padding: 0.75rem 1rem;
  color: #1a3026;
  outline: none;
}

.input-field:focus {
  border-color: #2d4f36;
  box-shadow: 0 0 0 3px rgba(45, 79, 54, 0.15);
}

.calendar-day {
  display: flex;
  aspect-ratio: 1;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  font-size: 0.875rem;
}

.calendar-day-available {
  cursor: pointer;
  background: #fff;
}

.calendar-day-available:hover {
  background: rgba(217, 115, 40, 0.2);
}

.calendar-day-blocked {
  cursor: not-allowed;
  background: #f3f4f6;
  color: #9ca3af;
  text-decoration: line-through;
}

.calendar-day-selected {
  background: #d97328;
  color: #fff;
  font-weight: 700;
}

.faq-item {
  border-radius: 0.75rem;
  border: 1px solid rgba(45, 79, 54, 0.1);
  background: #fff;
}

.hero-overlay {
  background: linear-gradient(
    105deg,
    rgba(26, 48, 38, 0.78) 0%,
    rgba(26, 48, 38, 0.4) 50%,
    transparent 75%
  );
}

.pine-silhouette {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 80' preserveAspectRatio='none'%3E%3Cpath fill='%232D4F36' fill-opacity='0.08' d='M0 80 L0 50 L30 20 L50 45 L70 15 L100 40 L130 10 L160 35 L200 5 L240 30 L280 0 L320 25 L360 8 L400 35 L450 12 L500 40 L550 18 L600 45 L650 20 L700 50 L750 25 L800 55 L850 30 L900 60 L950 35 L1000 65 L1050 40 L1100 70 L1150 45 L1200 75 L1200 80 Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: 100% auto;
}

/* ——— Accueil : header + hero (maquette) ——— */

.home-top {
  position: relative;
  z-index: 2;
  overflow: visible;
  background-color: #fdfbf7;
}

/* Barre d'en-tête — grille logo | nav centrée | CTA */
.home-header {
  position: relative;
  z-index: 40;
  background-color: #fdfbf7;
  overflow: visible;
}

.home-header__bar {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.25rem;
  width: min(72rem, calc(100% - 1.5rem));
  margin-inline: auto;
  padding: 0.15rem 0.75rem 0.1rem;
  min-height: 0;
}

@media (min-width: 1024px) {
  .home-header__bar {
    padding: 0.12rem 1.5rem 0.08rem;
    min-height: 0;
  }
}

/* Logo chevauchant header + hero — positionné plus bas */
.home-header__logo {
  position: relative;
  z-index: 50;
  display: block;
  align-self: end;
  margin-top: 0.25rem;
  margin-bottom: -5.75rem;
  line-height: 0;
  transform: translateY(1.5rem);
}

.home-header__logo img {
  width: 10.125rem;
  height: 10.125rem;
  border-radius: 9999px;
  object-fit: cover;
  filter: drop-shadow(0 8px 20px rgba(26, 48, 38, 0.18));
  transition: transform 0.2s ease;
}

.home-header__logo:hover img {
  transform: scale(1.02);
}

@media (min-width: 768px) {
  .home-header__logo {
    margin-top: 0.35rem;
    margin-bottom: -6.75rem;
    transform: translateY(2rem);
  }

  .home-header__logo img {
    width: 12.75rem;
    height: 12.75rem;
  }
}

@media (min-width: 1024px) {
  .home-header__logo {
    margin-top: 0.5rem;
    margin-bottom: -8rem;
    transform: translateY(2.75rem);
  }

  .home-header__logo img {
    width: 15.75rem;
    height: 15.75rem;
  }
}

/* Navigation centrée */
.home-header__nav {
  display: none;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem 1.25rem;
  padding-top: 0;
}

@media (min-width: 1024px) {
  .home-header__nav {
    display: flex;
  }
}

.home-header__nav.is-open {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: 60;
  flex-direction: column;
  justify-content: center;
  gap: 1.25rem;
  background: #fdfbf7;
  padding: 2rem;
}

.nav-link-home {
  position: relative;
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #3d5248;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s;
  padding-bottom: 0.35rem;
}

@media (min-width: 1280px) {
  .nav-link-home {
    font-size: 0.72rem;
    letter-spacing: 0.14em;
  }
}

.nav-link-home:hover {
  color: #d97328;
}

/* Actif : orange + trait horizontal (maquette) */
.nav-link-home-active {
  color: #d97328;
  font-weight: 700;
  text-decoration: none;
}

.nav-link-home-active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 1.35rem;
  height: 3px;
  border-radius: 2px;
  background-color: #d97328;
  transform: translateX(-50%);
}

/* Bouton Réserver */
.home-header__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

.header-reserve-group .btn-header-reserve {
  display: inline-flex;
}

.btn-header-reserve {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 0.5rem;
  background-color: #1b3022;
  padding: 0.7rem 1.35rem;
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: background-color 0.2s;
  white-space: nowrap;
}

.btn-header-reserve i {
  font-size: 1rem;
}

.btn-header-reserve:hover {
  background-color: #2d4f36;
}

.btn-header-reserve--casimir {
  background-color: #d97328;
}

.btn-header-reserve--casimir:hover {
  background-color: #c26220;
}

.btn-header-reserve--hypolite {
  background-color: #6b8f71;
}

.btn-header-reserve--hypolite:hover {
  background-color: #5a7a60;
}

.reserve-buttons-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}

.btn-header-reserve--mobile {
  display: none;
  margin-top: 0.75rem;
  padding: 0.85rem 1.75rem;
  font-size: 0.85rem;
}

.home-header__nav.is-open .btn-header-reserve--mobile {
  display: inline-flex;
}

.home-header__burger {
  display: flex;
  width: 2.25rem;
  height: 2.25rem;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(27, 48, 34, 0.15);
  border-radius: 0.375rem;
  background: transparent;
  color: #1b3022;
  font-size: 1.15rem;
  cursor: pointer;
}

@media (min-width: 1024px) {
  .home-header__burger {
    display: none;
  }
}

/* Bannière accueil — maquette panoramique */
.hero-home {
  position: relative;
  overflow: hidden;
  height: clamp(22rem, 38vw, 38rem);
  min-height: 0;
}

.hero-home__scene {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-home__scene picture {
  position: absolute;
  inset: 0;
  display: block;
}

.hero-home__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Panorama : combis à droite, lac à gauche — légèrement vers la droite */
  object-position: 62% 42%;
}

.hero-home__wash {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  /* Voile plus léger pour que la photo paraisse plus nette (le texte reste lisible) */
  background: linear-gradient(
    90deg,
    rgba(253, 248, 239, 0.78) 0%,
    rgba(253, 248, 239, 0.48) 32%,
    rgba(253, 248, 239, 0.12) 52%,
    transparent 72%
  );
}

@media (max-width: 1023px) {
  .hero-home {
    height: auto;
    min-height: clamp(26rem, 85vw, 34rem);
  }

  .hero-home__bg {
    /* Narrow view : garder les combis visibles à droite */
    object-position: 88% 42%;
  }

  .hero-home__wash {
    background: linear-gradient(
      180deg,
      rgba(253, 248, 239, 0.82) 0%,
      rgba(253, 248, 239, 0.58) 50%,
      rgba(253, 248, 239, 0.18) 100%
    );
  }
}

/* Même largeur utile + gouttières que la barre du header pour aligner logo et pastilles */
.hero-home__inner.container-combi {
  width: min(72rem, calc(100% - 1.5rem));
}

.hero-home__inner {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: inherit;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  /* padding horizontal comme .home-header__bar (0.75rem puis 1.5rem lg) */
  padding: 4.25rem 0.75rem 1.5rem;
}

@media (min-width: 1024px) {
  .hero-home__inner {
    padding: 3.25rem 1.5rem 1.75rem;
  }
}

.hero-home__content {
  display: flex;
  width: 100%;
  max-width: 36rem;
  align-self: center;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

/* Bloc titre + chapô — centré dans l’écran */
.hero-home__headline {
  max-width: 28rem;
  margin-inline: auto;
  margin-top: clamp(0.5rem, 2vw, 1.25rem);
  text-align: center;
  transform: none;
}

.hero-home__title {
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: center;
  gap: 0 0.4rem;
  margin: 0;
  line-height: 1.02;
  /* Inclinaison d’ensemble comme sur la capture (script + slab alignés) */
  transform: skewX(-5deg) rotate(-0.5deg);
  transform-origin: center center;
}

.hero-home__title-script {
  font-family: "Caveat", "Pacifico", cursive;
  font-size: clamp(2.1rem, 4.8vw, 3.15rem);
  font-weight: 700;
  font-style: italic;
  color: #2d4f36;
  letter-spacing: 0.015em;
  -webkit-text-stroke: 0.35px rgba(26, 48, 38, 0.35);
  text-shadow:
    0 1px 0 rgba(26, 48, 38, 0.2),
    0 2px 8px rgba(255, 255, 255, 0.35);
}

.hero-home__title-van {
  display: inline-block;
  font-family: "Roboto Slab", "Georgia", serif;
  font-weight: 700;
  font-style: italic;
  font-size: clamp(2.65rem, 7vw, 4rem);
  line-height: 0.98;
  letter-spacing: 0.04em;
  color: #d97328;
  text-transform: uppercase;
  /* Relief 3D orange + ombre brun / brique (comme la capture) */
  -webkit-text-stroke: 0.5px rgba(110, 52, 28, 0.45);
  paint-order: stroke fill;
  text-shadow:
    1px 1px 0 #9a4e1c,
    2px 2px 0 #7a3d18,
    3px 3px 0 rgba(60, 30, 15, 0.35),
    0 6px 18px rgba(217, 115, 40, 0.45);
}

.hero-home__lead {
  margin: 0.75rem 0 0;
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: clamp(0.9rem, 1.55vw, 1.05rem);
  font-weight: 600;
  line-height: 1.45;
  text-align: center;
  color: #2d4f36;
}

/* Pastilles + CTA — seule cette zone : à gauche, un peu plus compacte */
.hero-home__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: flex-start;
  width: 100%;
  max-width: 24rem;
  margin-top: clamp(1rem, 4.5vw, 6.25rem);
  margin-inline: 0;
  transform: none;
}

@media (max-width: 639px) {
  .hero-home__actions {
    margin-top: clamp(1rem, 4vw, 3rem);
  }
}

.hero-home__features {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 0.55rem;
  margin: 0;
  justify-content: flex-start;
  padding: 0;
  list-style: none;
}

@media (min-width: 640px) {
  .hero-home__features {
    flex-wrap: nowrap;
    gap: 0.85rem 0.65rem;
  }
}

.hero-home__feature {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  gap: 0.38rem;
  text-align: center;
}

.hero-home__feature-icon {
  display: flex;
  width: 3.5rem;
  height: 3.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #fdf8ef;
  font-size: 1.1rem;
  color: #2d4f36;
  box-shadow: 0 5px 12px rgba(45, 79, 54, 0.1);
}

@media (min-width: 1024px) {
  .hero-home__feature-icon {
    width: 3.75rem;
    height: 3.75rem;
    font-size: 1.22rem;
  }
}

.hero-home__feature-text {
  display: flex;
  flex-direction: column;
  font-size: 0.56rem;
  font-weight: 900;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #1b3022;
}

.hero-home__feature-text strong {
  display: block;
  font-family: "DM Sans", system-ui, sans-serif;
  font-weight: 900;
  color: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

@media (min-width: 640px) {
  .hero-home__feature-text {
    font-size: 0.6rem;
  }
}

@media (min-width: 1024px) {
  .hero-home__feature-text {
    font-size: 0.63rem;
  }
}

.hero-home__cta {
  margin-top: 0.85rem !important;
  padding: 0.65rem 1.15rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.72rem;
  font-weight: 700;
  box-shadow: 0 8px 20px rgba(217, 115, 40, 0.35);
}

/* Badge image — bas droite, à cheval hero / section suivante (maquette) */
.hero-home__stamp {
  position: absolute;
  z-index: 30;
  right: max(0.75rem, calc((100% - min(72rem, calc(100% - 1.5rem))) / 2 + 0.75rem));
  bottom: 0;
  left: auto;
  line-height: 0;
  transform: translateY(50%);
  pointer-events: none;
}

@media (min-width: 1024px) {
  .hero-home__stamp {
    right: max(1.5rem, calc((100% - min(72rem, calc(100% - 1.5rem))) / 2 + 1.5rem));
  }
}

.hero-home__stamp-img {
  display: block;
  width: clamp(4.75rem, 14vh, 6.75rem);
  height: auto;
  filter: drop-shadow(0 10px 28px rgba(26, 48, 38, 0.2));
}

@media (min-width: 768px) {
  .hero-home__stamp-img {
    width: clamp(5.25rem, 16vh, 7.25rem);
  }
}

@media (min-width: 1024px) {
  .hero-home__stamp-img {
    width: clamp(5.5rem, 17vh, 7.5rem);
  }
}

main > section:first-of-type {
  position: relative;
  z-index: 1;
}

@media (min-width: 768px) {
  main > section:first-of-type {
    padding-top: 1.75rem;
  }
}

/* Accueil mobile / tablette — bureau (≥1024px) inchangé */
@media (max-width: 1023px) {
  .home-header__logo {
    margin-top: 0.15rem;
    margin-bottom: -3.35rem;
    transform: translateY(0.35rem);
  }

  .home-header__logo img {
    width: 6rem;
    height: 6rem;
  }

  .hero-home__inner {
    padding-top: 4.85rem;
    padding-bottom: 3rem;
  }

  .hero-home__headline {
    margin-top: 0.25rem;
    max-width: 100%;
    padding-inline: 0.5rem;
  }

  .hero-home__title {
    flex-wrap: wrap;
    row-gap: 0.1rem;
  }

  .hero-home__actions {
    align-self: center;
    align-items: center;
    width: 100%;
    max-width: 18.5rem;
    margin-top: 1rem;
    margin-inline: auto;
  }

  .hero-home__features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem 0.45rem;
    width: 100%;
    max-width: 18.5rem;
    margin-inline: auto;
    justify-items: center;
  }

  .hero-home__feature {
    width: 100%;
    max-width: 8.5rem;
  }

  .hero-home__cta {
    width: 100%;
    max-width: 16rem;
    justify-content: center;
  }

  .hero-home__stamp {
    right: 0.65rem;
    left: auto;
    transform: translateY(42%);
  }

  .hero-home__stamp-img {
    width: 5.25rem;
  }

  main > section:first-of-type {
    padding-top: 2rem;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .home-header__logo img {
    width: 7.25rem;
    height: 7.25rem;
  }

  .home-header__logo {
    margin-bottom: -3.85rem;
  }

  .hero-home__inner {
    padding-top: 5.35rem;
  }
}

@media (max-width: 479px) {
  .home-header__logo img {
    width: 5.35rem;
    height: 5.35rem;
  }

  .home-header__logo {
    margin-bottom: -2.85rem;
  }

  .hero-home__inner {
    padding-top: 4.35rem;
  }

  .hero-home__title-script {
    font-size: 1.85rem;
  }

  .hero-home__title-van {
    font-size: 2.35rem;
  }

  .hero-home__lead {
    font-size: 0.85rem;
  }

  .hero-home__feature-icon {
    width: 3.1rem;
    height: 3.1rem;
    font-size: 0.95rem;
  }

  .hero-home__features {
    max-width: 17rem;
    gap: 0.55rem 0.35rem;
  }

  .hero-home__stamp {
    right: 0.5rem;
  }

  .hero-home__stamp-img {
    width: 4.5rem;
  }
}
