:root{
  --bg:#070907;--surface:#0e120e;--surface2:#141a14;--text:#f6f8f6;
  --muted:#aeb7ae;--green:#78c91f;--green2:#9ae34c;--line:#263126;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}

.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:18px clamp(20px,5vw,72px);background:rgba(7,9,7,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{font-weight:800;font-size:1.4rem;letter-spacing:-.05em}.brand b{color:var(--green)}
nav{display:flex;gap:25px;align-items:center;font-size:.93rem}nav>a{color:#d3dbd3}.nav-cta{background:var(--green);color:#081008!important;padding:10px 14px;border-radius:9px;font-weight:800}

.hero{min-height:78vh;display:grid;grid-template-columns:1.18fr .82fr;align-items:center;gap:55px;padding:80px clamp(22px,7vw,110px);background:radial-gradient(circle at 82% 20%,rgba(120,201,31,.18),transparent 30%),linear-gradient(180deg,#080b08,#070907)}
.badge,.eyebrow{color:var(--green2);font-size:.78rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.hero h1{font-size:clamp(3.2rem,7vw,6.5rem);line-height:.93;letter-spacing:-.07em;margin:18px 0 26px}.hero h1 span{color:var(--green)}
.lead{max-width:720px;color:#c7d0c7;font-size:1.12rem}
.hero-actions,.trust-row{display:flex;gap:14px;flex-wrap:wrap}.hero-actions{margin-top:30px}.trust-row{margin-top:26px;color:#c7d0c7;font-size:.9rem}
.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:10px;padding:14px 20px;font-weight:800;cursor:pointer;transition:.2s}
.btn.primary{background:var(--green);color:#091009}.btn.primary:hover{background:var(--green2)}
.btn.secondary{background:#101510;color:#fff;border-color:#364236}.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.full{width:100%;margin-top:18px}

.hero-panel{background:#0c100c;border:1px solid var(--line);border-radius:25px;padding:24px;box-shadow:0 35px 90px rgba(0,0,0,.35)}
.mini-logo{font-size:2rem;font-weight:800;letter-spacing:-.06em;text-align:center;margin-bottom:18px}.mini-logo b{color:var(--green)}
.season-grid{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border-radius:18px}.season-grid div{min-height:160px;border:1px solid #202a20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.season-grid span{font-size:3.2rem}

.section{padding:95px clamp(22px,7vw,110px)}.section-heading{max-width:820px;margin-bottom:42px}.section-heading h2,.booking-intro h2,.calendar-ready h2{font-size:clamp(2.3rem,4vw,4.1rem);line-height:1.02;letter-spacing:-.05em;margin:10px 0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:30px}.service-card .icon{font-size:2.2rem}.service-card h3{margin:17px 0 8px}.service-card p{color:var(--muted);min-height:80px}.muted{opacity:.83}
.status{display:inline-block;border-radius:999px;padding:7px 10px;font-size:.76rem;font-weight:800}.available{background:rgba(120,201,31,.14);color:var(--green2)}.unavailable{background:#202520;color:#cbd1cb}

.process{background:#0b0e0b}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step{border-top:1px solid var(--line);padding-top:24px}.step>span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--green);color:#091009;font-weight:900}.step p{color:var(--muted)}

.booking{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:start}.booking-intro>p{color:var(--muted)}
.owner-box,.notice{margin-top:26px;padding:20px;border:1px solid var(--line);background:var(--surface);border-radius:16px;display:flex;flex-direction:column;gap:5px}.owner-box span,.notice p{color:var(--muted)}.owner-box a{color:var(--green2)}
.notice strong{color:var(--green2)}

.booking-box{background:var(--surface);border:1px solid var(--line);border-radius:23px;padding:28px}
.booking-progress{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:32px}.progress-step{display:flex;align-items:center;gap:8px;color:#6f786f;font-size:.82rem;font-weight:700}.progress-step span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid #3c473c}.progress-step.active{color:#fff}.progress-step.active span{background:var(--green);color:#091009;border-color:var(--green)}
.form-stage{display:none}.form-stage.active{display:block}.form-stage h3{font-size:1.45rem;margin:0 0 6px}.stage-help{color:var(--muted);margin-top:0}
label{display:block;font-weight:650;font-size:.9rem;margin-bottom:15px}.field.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}
input,select,textarea{width:100%;margin-top:8px;padding:14px 15px;border-radius:10px;border:1px solid #344034;background:#090c09;color:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(120,201,31,.13)}
textarea{resize:vertical}
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.slot{border:1px solid #364236;background:#0b0f0b;color:#fff;border-radius:10px;padding:13px 8px;font-weight:750;cursor:pointer}.slot:hover,.slot.selected{border-color:var(--green);background:rgba(120,201,31,.12);color:var(--green2)}
.stage-actions{display:flex;justify-content:space-between;gap:12px;margin-top:20px}.stage-actions .btn{flex:1}
.consent{display:flex;gap:10px;align-items:flex-start;color:#c8d0c8;font-weight:400}.consent input{width:auto;accent-color:var(--green);margin-top:3px}
.summary{margin-top:18px;border:1px solid var(--line);border-radius:14px;padding:16px;background:#0a0d0a;color:#cbd3cb}.summary strong{color:#fff}
.hidden{display:none!important}
.success{text-align:center;padding:28px 8px}.success-icon{width:62px;height:62px;border-radius:50%;background:var(--green);color:#081008;display:grid;place-items:center;margin:0 auto 18px;font-size:2rem;font-weight:900}.success h3{font-size:1.7rem}.success p{color:var(--muted)}.small{font-size:.88rem}

.calendar-ready{background:#0b0e0b}.calendar-ready>div{max-width:900px}.calendar-ready p:last-child{color:var(--muted);font-size:1.05rem}
.cta{margin:0 clamp(22px,7vw,110px) 90px;background:linear-gradient(135deg,#6fbd1f,#9ade4a);color:#081008;text-align:center;border-radius:26px;padding:50px}.cta h2{font-size:clamp(2rem,4vw,3.6rem);letter-spacing:-.05em;margin:0}.cta>div{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:22px}.btn.dark{background:#081008;color:#fff}.btn.white{background:#fff;color:#081008}
footer{border-top:1px solid var(--line);padding:34px clamp(22px,7vw,110px);display:grid;gap:7px;color:#aeb7ae;font-size:.88rem}footer strong{color:#fff}

@media(max-width:900px){nav>a:not(.nav-cta){display:none}.hero,.booking{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.topbar{padding:14px 17px}.nav-cta{font-size:.78rem;padding:9px 10px}.hero{padding-top:55px}.hero h1{font-size:3.25rem}.season-grid div{min-height:135px}.steps,.field.two{grid-template-columns:1fr}.slots{grid-template-columns:1fr 1fr}.booking-box{padding:20px}.cta{padding:36px 20px}}

.google-booking{text-align:center;padding:42px 34px}
.google-booking .google-icon{font-size:3.2rem;margin-bottom:10px}
.google-booking h3{font-size:2rem;letter-spacing:-.04em;margin:10px 0}
.google-booking>p:not(.eyebrow):not(.form-note){color:var(--muted);max-width:560px;margin:0 auto 22px}
.calendar-button{font-size:1.02rem;margin-top:24px}
.calendar-benefits{display:grid;gap:10px;text-align:left;margin:26px auto 10px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#0a0d0a;max-width:520px;color:#d6ddd6}
.calendar-benefits span{display:block}


/* ===== Avis clients ===== */
.section-subtitle {
  max-width: 760px;
  margin: 12px auto 0;
  color: var(--muted, #aab2bd);
  line-height: 1.7;
}

.reviews-section {
  scroll-margin-top: 90px;
}

.reviews-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 28px;
  align-items: stretch;
  margin-top: 34px;
}

.reviews-showcase,
.review-form-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 22px;
  padding: 30px;
}

.rating-summary {
  padding-bottom: 26px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.rating-summary h3,
.review-form-card h3 {
  margin: 8px 0 10px;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}

.rating-summary p,
.review-placeholder p {
  color: #b8c0ca;
  line-height: 1.65;
}

.rating-stars {
  font-size: 1.8rem;
  letter-spacing: .14em;
  color: #ffd166;
}

.review-placeholder {
  margin-top: 24px;
  border-radius: 18px;
  padding: 26px;
  background: rgba(0, 214, 143, .07);
  border: 1px solid rgba(0, 214, 143, .18);
}

.quote-mark {
  display: block;
  font-size: 3.5rem;
  line-height: .8;
  font-weight: 800;
  color: var(--green, #00d68f);
}

.review-placeholder strong {
  display: block;
  margin-top: 15px;
}

.review-form-card form {
  display: grid;
  gap: 12px;
  margin-top: 20px;
}

.review-form-card label,
.rating-fieldset legend {
  font-weight: 700;
  font-size: .92rem;
}

.review-form-card input[type="text"],
.review-form-card select,
.review-form-card textarea {
  width: 100%;
  box-sizing: border-box;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: inherit;
  border-radius: 12px;
  padding: 14px 15px;
  font: inherit;
  outline: none;
}

.review-form-card select option {
  color: #111;
}

.review-form-card input[type="text"]:focus,
.review-form-card select:focus,
.review-form-card textarea:focus {
  border-color: var(--green, #00d68f);
  box-shadow: 0 0 0 3px rgba(0, 214, 143, .12);
}

.rating-fieldset {
  border: 0;
  padding: 0;
  margin: 4px 0;
}

.star-rating {
  display: inline-flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 7px;
}

.star-rating input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.star-rating label {
  cursor: pointer;
  font-size: 2.15rem;
  line-height: 1;
  color: #59616c;
  transition: transform .15s ease, color .15s ease;
}

.star-rating label:hover,
.star-rating label:hover ~ label,
.star-rating input:checked ~ label {
  color: #ffd166;
}

.star-rating label:hover {
  transform: translateY(-2px);
}

.consent-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  font-weight: 500 !important;
  color: #b8c0ca;
  line-height: 1.45;
}

.consent-row input {
  margin-top: 3px;
}

.hidden-field {
  display: none;
}

.thank-you-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.thank-you-card {
  width: min(620px, 100%);
  text-align: center;
  padding: 42px 30px;
  border-radius: 24px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
}

.thank-you-card h1 {
  margin: 10px 0 12px;
}

.thank-you-card p {
  color: #b8c0ca;
  line-height: 1.65;
  margin-bottom: 24px;
}

.thank-icon {
  font-size: 3.4rem;
  color: #ffd166;
  margin: 24px 0 8px;
}

@media (max-width: 820px) {
  .reviews-layout {
    grid-template-columns: 1fr;
  }
}


/* ===== Avis approuvés V5 ===== */
.approved-reviews {
  display: grid;
  gap: 16px;
  margin-top: 24px;
}

.approved-review-card {
  padding: 22px;
  border-radius: 18px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.09);
}

.approved-review-top,
.approved-review-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.approved-review-stars {
  color: #ffd166;
  letter-spacing: .12em;
  font-size: 1.12rem;
}

.approved-review-date,
.approved-review-footer span {
  color: #8f99a5;
  font-size: .86rem;
}

.approved-review-comment {
  margin: 18px 0;
  line-height: 1.7;
  color: #d7dce2;
  font-size: 1rem;
}

.approved-review-footer strong {
  color: #fff;
}

@media (max-width: 540px) {
  .approved-review-top,
  .approved-review-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }
}