/* ========================================================
   PAGE RÉSERVATION / CONTACT
   ======================================================== */

/* --- Barre de recherche dispo (remplace ss-hero-stats) --- */
.ss-hero-search {position: relative;z-index: 2;margin-top: clamp(-3.5rem, -5.5vh, -2.8rem);margin-bottom: clamp(2rem, 4vh, 3rem)}
.ss-hero-search__card {background: #fff;border-radius: var(--border-radius-xl);box-shadow: 0 26px 60px rgba(15, 22, 15, .14), 0 2px 8px rgba(15, 22, 15, .04);padding: clamp(1.6rem, 3vw, 2.4rem) clamp(1.4rem, 3vw, 2.4rem);display: flex;flex-direction: column;gap: clamp(1rem, 2vh, 1.5rem)}
.ss-hero-search__head {text-align: center;max-width: 720px;margin: 0 auto}
.ss-hero-search__eyebrow {margin: 0 0 .5rem;color: var(--main-color);font-size: .78rem;letter-spacing: .1em;text-transform: uppercase;font-weight: 700}
.ss-hero-search__title {margin: 0 0 .5rem;font-size: clamp(1.3rem, 1.6vw + .4rem, 1.7rem);line-height: 1.2;color: #172018}
.ss-hero-search__lead {margin: 0;color: var(--grey-color);font-size: .95rem;line-height: 1.55}
.ss-hero-search__widget {min-height: 96px}
.ss-hero-search__widget .booking-widget {min-height: 96px}

@media (max-width: 1024px) {
  .ss-hero-search {margin-top: clamp(1.2rem, 2.5vh, 1.8rem)}
}

/* --- Cartes de contact rapide --- */
.reserv-contacts__grid {list-style: none;margin: 40px 0 0;padding: 0;display: grid;grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));gap: clamp(1rem, 2vw, 1.6rem)}
.reserv-contact-card {background: #fff;border-radius: var(--border-radius-lg);padding: clamp(1.3rem, 2vw, 1.8rem);box-shadow: 0 14px 32px rgba(15, 22, 15, .08);text-align: center;display: flex;flex-direction: column;gap: .35rem;border: 1px solid rgba(157, 174, 70, .15);transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease}
.reserv-contact-card:hover {transform: translateY(-3px);box-shadow: 0 22px 48px rgba(15, 22, 15, .12);border-color: rgba(157, 174, 70, .4)}
.reserv-contact-card__icon {display:grid;place-items:center;min-height:40px;margin:0 0 .8rem;color:#000;line-height:0}
.reserv-contact-card__icon svg {display:block;width:30px;height:30px;fill:var(--main-color);color:var(--main-color)}
.reserv-contact-card__label {margin: 0;color: var(--main-color);font-size: .76rem;letter-spacing: .1em;text-transform: uppercase;font-weight: 700}
.reserv-contact-card__value {color: #172018;font-size: 1.04rem;font-weight: 700;text-decoration: none;line-height: 1.35;word-break: break-word}
a.reserv-contact-card__value:hover {color: var(--main-color);text-decoration: underline;text-decoration-thickness: 1px;text-underline-offset: .2em}
.reserv-contact-card__note {margin: 0;font-size: .82rem;color: var(--grey-color);line-height: 1.45}

/* --- Section formulaire + map --- */
.reserv-form {background: linear-gradient(180deg, #fff 0%, #f7f4ed 100%)}
.reserv-form, .reserv-form * {box-sizing: border-box}
.reserv-form__grid {gap: clamp(2rem, 3vw, 3.4rem);align-items: start;min-width: 0}
.reserv-form__body {min-width: 0;max-width: 100%}
.reserv-form__body .title,
.reserv-form__form,
.reserv-form .lead {min-width: 0;max-width: 100%;overflow-wrap: anywhere}
.reserv-form__aside {display: flex;flex-direction: column;gap: 1.2rem;position: sticky;top: calc(var(--ss-hero-mt, 70px) + 1.5rem);min-width: 0;max-width: 100%}
.reserv-form__aside .title {margin: 0}

@media (max-width: 1024px) {
  .reserv-form__aside {position: static}
}

/* Honeypot anti-spam (caché à l'utilisateur, visible aux bots) */
.reserv-form__honeypot {position: absolute !important;left: -9999px !important;width: 1px !important;height: 1px !important;opacity: 0 !important;pointer-events: none}

/* Form grid (2 colonnes pour les champs courts, full pour les longs) */
.form-grid {display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: clamp(.8rem, 1.6vw, 1.2rem);margin-top: 24px;min-width: 0;max-width: 100%}
.form-field {display: flex;flex-direction: column;gap: 6px;margin: 0;min-width: 0}
.form-field--full {grid-column: 1 / -1}
.form-field label {font-size: .88rem;font-weight: 600;color: #2d342d}
.form-field__opt {color: var(--grey-color);font-weight: 400;font-size: .82rem;margin-left: 4px}
.form-field input, .form-field textarea {width: 100%;max-width: 100%;min-width: 0;box-sizing: border-box;padding: .8rem 1rem;border: 1px solid rgba(15, 22, 15, .18);border-radius: var(--border-radius-sm);font: inherit;font-size: .95rem;background: #fff;color: #172018;transition: border-color .2s ease, box-shadow .2s ease, background .2s ease}
.form-field input:hover, .form-field textarea:hover {border-color: rgba(157, 174, 70, .55)}
.form-field input:focus, .form-field textarea:focus {outline: none;border-color: var(--main-color);box-shadow: 0 0 0 3px rgba(157, 174, 70, .22);background: #fff}
.form-field input.error, .form-field textarea.error {border-color: #c43c2a;box-shadow: 0 0 0 3px rgba(196, 60, 42, .12)}
.form-field input.valid, .form-field textarea.valid {border-color: var(--main-color)}
.form-field textarea {min-height: 140px;resize: vertical;line-height: 1.55}
.form-error {color: #c43c2a;font-size: .82rem;min-height: 1em;line-height: 1.3}
.form-error:empty {min-height: 0}
.form-rgpd {color: var(--grey-color);margin: 1.4rem 0 0;font-size: .82rem;line-height: 1.55}
.form-rgpd a {color: var(--main-color);font-weight: 600;text-decoration: underline;text-decoration-thickness: 1px;text-underline-offset: .2em}
.form-submit {margin: 1.6rem 0 0;text-align: left}

@media (max-width: 768px) {
  .reserv-form__grid {gap: clamp(1.4rem, 5vw, 2rem)}
  .reserv-form__body,
  .reserv-form__aside {width: 100%}
  .form-grid {grid-template-columns: 1fr}
  .form-submit {text-align: center}
  .form-submit .btn {width: 100%}
}

/* --- Carte Leaflet + infos accès --- */
.reserv-map {width: 100%;max-width: 100%;min-width: 0;aspect-ratio: 4 / 3;border-radius: var(--border-radius-xl);overflow: hidden;box-shadow: 0 18px 40px rgba(15, 22, 15, .12);min-height: 280px;background: #f0eee6}
.reserv-map .leaflet-tile {filter: grayscale(14%) saturate(.88) contrast(1.03)}
.reserv-map .leaflet-control-attribution {font-size: .68rem}
.reserv-map .leaflet-popup-content-wrapper {border-radius: 16px;box-shadow: 0 14px 34px rgba(15, 22, 15, .18)}
.reserv-map .leaflet-popup-content {font-family: inherit;color: #172018;line-height: 1.45}

.reserv-aside__list {list-style: none;margin: 0;padding: 0;display: grid;gap: 0;min-width: 0;max-width: 100%}
.reserv-aside__list li {display: flex;justify-content: space-between;align-items: baseline;gap: 1rem;padding: 10px 0;border-bottom: 1px solid rgba(15, 22, 15, .08);font-size: .92rem}
.reserv-aside__list li:last-child {border-bottom: 0}
.reserv-aside__list li strong {color: var(--main-color);font-weight: 700;flex-shrink: 0}
.reserv-aside__list li span {text-align: right;color: #2d342d;min-width: 0;overflow-wrap: anywhere}

.reserv-aside__actions {display: flex;flex-wrap: wrap;justify-content: flex-end;gap: 10px;margin-top: 4px}
.reserv-aside__actions .btn {flex: 0 1 auto;min-width: 0;text-align: center}

@media (max-width: 768px) {
  .reserv-aside__list li {display: grid;grid-template-columns: 1fr;gap: 4px;align-items: start}
  .reserv-aside__list li span {text-align: left}
  .reserv-aside__actions {justify-content: stretch}
  .reserv-aside__actions .btn {width: 100%;justify-content: center}
}

/* --- Section "Comment ça marche" --- */
.reserv-trust__grid {list-style: none;margin: 40px 0 0;padding: 0;display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: clamp(1rem, 2vw, 1.6rem);counter-reset: reserv-step}
.reserv-step {position: relative;background: #fff;border-radius: var(--border-radius-xl);padding: clamp(1.4rem, 2vw, 1.8rem) clamp(1.3rem, 2vw, 1.6rem);border: 1px solid rgba(157, 174, 70, .18);box-shadow: 0 14px 36px rgba(15, 22, 15, .06);transition: transform .3s ease, box-shadow .3s ease}
.reserv-step:hover {transform: translateY(-3px);box-shadow: 0 22px 48px rgba(15, 22, 15, .10)}
.reserv-step__num {display: inline-flex;align-items: center;justify-content: center;width: 44px;height: 44px;border-radius: 50%;background: linear-gradient(135deg, var(--main-color), var(--second-color));color: #fff;font-weight: 800;font-size: 1.15rem;margin-bottom: 14px;box-shadow: 0 8px 20px rgba(157, 174, 70, .35)}
.reserv-step__title {margin: 0 0 10px;font-size: 1.05rem;color: #172018;letter-spacing: -.005em}
.reserv-step__desc {margin: 0;color: #43463a;font-size: .92rem;line-height: 1.55}

.reserv-trust__badges {list-style: none;margin: 40px 0 0;padding: clamp(1.2rem, 2vw, 1.6rem) clamp(1.4rem, 3vw, 2rem);display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: clamp(1rem, 2vw, 1.4rem);background: #fff;border-radius: var(--border-radius-xl);border: 1px solid rgba(157, 174, 70, .18);box-shadow: 0 10px 28px rgba(15, 22, 15, .05)}
.reserv-trust__badges li {display: flex;flex-direction: column;gap: 4px;text-align: center}
.reserv-trust__badges li strong {color: var(--main-color);font-size: .98rem;letter-spacing: -.01em}
.reserv-trust__badges li span {color: var(--grey-color);font-size: .82rem;line-height: 1.45}

@media (max-width: 1024px) {
  .reserv-trust__grid {grid-template-columns: repeat(2, 1fr)}
  .reserv-trust__badges {grid-template-columns: repeat(2, 1fr)}
}
@media (max-width: 640px) {
  .reserv-trust__grid {grid-template-columns: 1fr}
  .reserv-trust__badges {grid-template-columns: 1fr;gap: .8rem}
}

/* --- /PAGE RÉSERVATION ----------------------------------- */
/* ======================================================== */