/* Terra Alta - formulaire de réservation (carte claire, lisible sur fond sel ou nuit) */
.booking { scroll-margin-top: 90px; }
.booking-page .breadcrumb { max-width: 860px; margin: 0 auto 1rem; }
.booking__card {
  background: #fffdf8; color: var(--nuit); border: 1px solid var(--sel-soft);
  border-radius: 6px; padding: clamp(1.4rem, 4vw, 2.6rem); max-width: 860px; margin-inline: auto;
  box-shadow: 0 14px 40px rgba(28, 38, 32, .10);
}
.booking .eyebrow { color: var(--or); margin: 0 0 .4rem; text-align: center; }
.booking__form { text-align: left; }
.booking__title { text-align: center; margin: 0 0 .6rem; font-weight: 300; font-size: clamp(1.5rem, 3.2vw, 2.1rem); letter-spacing: .02em; }
.booking__lead { margin: 0 auto 1rem; color: var(--texte-mute); max-width: 56ch; text-align: center; }
.booking__trust { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.4rem; list-style: none; padding: 0; margin: 0 0 1.6rem; font-size: .85rem; color: var(--texte-mute); }
.booking__trust li::before { content: "✓"; color: var(--or); margin-right: .45rem; font-weight: 600; }

.booking__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.2rem; }
.booking .f { display: flex; flex-direction: column; gap: .35rem; min-width: 0; border: 0; padding: 0; margin: 0; }
.booking .f--full { grid-column: 1 / -1; }
.booking label, .booking legend { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--texte-mute); padding: 0; }
.booking input[type="text"], .booking input[type="email"], .booking input[type="tel"],
.booking input[type="date"], .booking input[type="number"], .booking select, .booking textarea {
  width: 100%; font: inherit; font-size: 1rem; color: var(--nuit); background: #fff;
  border: 1px solid #cfc6b0; border-radius: 3px; padding: .75rem .85rem; min-height: 46px;
}
.booking textarea { resize: vertical; }
.booking input:focus, .booking select:focus, .booking textarea:focus { outline: 2px solid var(--or); outline-offset: 1px; border-color: var(--or); }
.booking small { color: var(--texte-mute); font-size: .78rem; }
.booking .f__check { display: flex; align-items: flex-start; gap: .55rem; text-transform: none; letter-spacing: 0; font-size: .88rem; color: var(--nuit); margin-top: .2rem; cursor: pointer; }
.booking .f__check input { margin-top: .25rem; accent-color: var(--or); width: 1.05rem; height: 1.05rem; }
.booking .f--radio { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .4rem 1.4rem; }
.booking .f--radio legend { float: left; margin-right: .8rem; }
.booking .f--radio label { text-transform: none; letter-spacing: 0; font-size: .95rem; color: var(--nuit); display: inline-flex; gap: .45rem; align-items: center; cursor: pointer; }
.booking .f--radio input { accent-color: var(--or); }

.booking__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.booking__actions { margin-top: 1.5rem; }
.booking__actions .btn { width: 100%; justify-content: center; cursor: pointer; font-family: inherit; }
.booking__actions .btn[disabled] { opacity: .6; cursor: wait; }
.booking__alert { background: #fbeae6; color: #8a2a17; border: 1px solid #e8b9ae; border-radius: 3px; padding: .8rem 1rem; margin-bottom: 1rem; font-size: .92rem; }

.booking__alt { margin-top: 1.4rem; padding-top: 1.1rem; border-top: 1px solid var(--sel-soft); font-size: .92rem; }
.booking__alt p { margin: 0 0 .4rem; }
.booking__alt a { color: var(--nuit); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--or); }
.booking__num { color: var(--texte-mute); margin-left: .5rem; user-select: all; }

.booking__ok { text-align: center; padding: 1.2rem 0; }
.booking__ok h3 { margin: 0 0 .6rem; font-weight: 300; font-size: 1.6rem; }
.booking__ok-wa { margin-top: 1.4rem; color: var(--texte-mute); }
.booking__ok:focus { outline: none; }

/* Bouton « Réserver » des fiches : lien vers le formulaire */
.modal__foot .js-book { cursor: pointer; }

@media (max-width: 640px) {
  .booking__grid { grid-template-columns: 1fr; }
  .booking .f--radio legend { float: none; width: 100%; margin-bottom: .2rem; }
}
