.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* Test de conversion : le CTA de réservation reste dans le HTML, mais n'est pas affiché dans le hero. */
.hero-actions[data-soft-lead-test],
.mobile-cta {
  display: none !important;
}

.offer-email-capture {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) auto;
  gap: 8px;
  width: min(100%, 550px);
  margin: 12px 0 5px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 12px;
  background: rgba(255, 255, 255, .1);
}

.offer-email-capture input[type="email"] {
  min-width: 0;
  min-height: 46px;
  margin: 0;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, .55);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
}

.offer-email-capture button {
  min-height: 46px;
  padding: 10px 15px;
  border: 1px solid var(--orange);
  border-radius: 8px;
  background: var(--orange);
  color: #fff;
  font: 800 .83rem/1.2 Montserrat, Arial, sans-serif;
  cursor: pointer;
}

.offer-email-capture button:hover,
.offer-email-capture button:focus-visible { background: #df5e00; border-color: #df5e00; }
.offer-email-capture button:disabled { opacity: .65; cursor: wait; }

.offer-email-honeypot {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

.offer-email-notice {
  grid-column: 1 / -1;
  margin: 1px 4px 0;
  font-size: .82rem;
  line-height: 1.4;
}

.offer-email-notice.success { color: #bff4d7; }
.offer-email-notice.error { color: #ffd3d3; }
.operation-inactive .offer-email-capture { display: none; }

.offer-callback-prompt {
  margin: 0;
  color: var(--cream);
  font-size: .78rem;
  line-height: 1.35;
}

.offer-callback-prompt button {
  appearance: none;
  margin: 0 0 0 4px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.plugplay-callout {
  width: min(650px, 100%);
  margin: 2px 0 14px;
  padding: 17px 18px;
  border: 1px solid rgba(255, 183, 127, .72);
  border-radius: 12px;
  background: rgba(255, 255, 255, .07);
}

.plugplay-callout h2 {
  margin: 0 0 7px;
  color: #ffb77f;
  font: 800 1.05rem/1.25 Montserrat, Arial, sans-serif;
  letter-spacing: 0;
}

.plugplay-callout p {
  max-width: 590px;
  margin: 0 0 14px;
  color: var(--cream);
  font-size: .94rem;
  line-height: 1.45;
}

.plugplay-callout p strong { color: #fff; }

.plugplay-cta {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #ffb77f;
  border-radius: 9px;
  background: transparent;
  color: #fff;
  font-size: .88rem;
}

.plugplay-cta:hover,
.plugplay-cta:focus-visible {
  border-color: var(--orange);
  background: var(--orange);
  color: #fff;
}

.pack .plugplay-callout {
  max-width: 820px;
  margin: 38px auto 0;
  border-color: #d7dce5;
  background: #fff;
  box-shadow: 0 14px 35px rgba(0, 32, 91, .08);
  text-align: center;
}

.pack .plugplay-callout h2 { color: var(--navy); }
.pack .plugplay-callout p { max-width: 670px; margin-right: auto; margin-left: auto; color: var(--muted); }
.pack .plugplay-callout p strong { color: var(--navy); }
.pack .plugplay-cta { border-color: var(--orange); background: var(--orange); color: #fff; }
.pack .plugplay-cta:hover,
.pack .plugplay-cta:focus-visible { background: #df5e00; border-color: #df5e00; }

.topbar .phone svg { width: 19px; height: 19px; fill: currentColor; }
.gift-offer > svg { display: none; }

.price del {
  margin: 0;
  color: #fff;
  font: 800 clamp(1.05rem, 2vw, 1.35rem)/1.2 Montserrat, Arial, sans-serif;
  text-decoration-color: var(--orange);
  text-decoration-thickness: 3px;
}

.price-reference-line {
  display: flex;
  align-items: baseline;
  gap: 10px;
  white-space: nowrap;
}

.price-reference-line .price-saving {
  margin: 0;
}

.gift-offer,
.reservation-gift {
  border: 1px solid rgba(255, 110, 0, .72);
  border-radius: 11px;
  background: rgba(255, 110, 0, .12);
}

.gift-offer {
  max-width: 560px;
  margin: 0 0 22px;
  padding: 13px 16px;
  color: #fff;
}

.gift-offer strong,
.gift-offer span {
  display: block;
}

.gift-offer strong {
  color: #ffb77f;
  font-family: Montserrat, Arial, sans-serif;
}

.gift-offer span {
  margin-top: 2px;
}

.reservation .trust del {
  margin-bottom: 4px;
  color: #dbe6ff;
  font: 700 .92rem/1.35 Montserrat, Arial, sans-serif;
  text-decoration-color: var(--orange);
  text-decoration-thickness: 2px;
}

.reservation-gift {
  margin: 18px 0 2px;
  padding: 12px 14px;
  color: #fff !important;
  line-height: 1.45;
}

.reservation-gift strong {
  color: #ffb77f;
}

.booking-gift-confirmed {
  margin: 18px 0;
  padding: 14px 16px;
  border-left: 4px solid var(--orange);
  border-radius: 9px;
  background: #fff7ed;
  color: var(--navy);
  font-weight: 800;
}

.booking-return {
  display: none;
  margin: 0 0 24px;
  color: #fff;
  font-weight: 800;
  text-underline-offset: 4px;
}

.landing-booking-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  padding: clamp(38px, 6vw, 68px) clamp(24px, 7vw, 100px);
  background: var(--navy);
  color: #fff;
}

.landing-booking-cta > div {
  max-width: 780px;
}

.landing-booking-cta h2 {
  margin: 0 0 12px;
  color: #fff;
}

.landing-booking-cta p:last-child {
  margin: 0;
  color: #dbe6ff;
  font-size: 1.05rem;
}

.landing-booking-cta .button {
  flex: 0 0 auto;
  text-align: center;
}

html:not(.booking-route) .reservation {
  display: none;
}

html.booking-route .hero,
html.booking-route .pack,
html.booking-route .how,
html.booking-route .landing-booking-cta,
html.booking-route .diagnostic-cta,
html.booking-route .mobile-cta {
  display: none;
}

html.booking-route .booking-return {
  display: inline-block;
}

html.booking-route .reservation {
  min-height: calc(100vh - 68px);
}

html.booking-route .faq .eyebrow {
  font-size: 0;
}

html.booking-route .faq .eyebrow::after {
  content: "Une question pendant votre réservation ?";
  font-size: .75rem;
}

.button.secondary {
  border: 1px solid currentColor;
  background: transparent;
  color: var(--navy);
  box-shadow: none;
}

.hero .button.secondary {
  color: #fff;
}

.hero .button.secondary:hover {
  background: rgba(255, 255, 255, .1);
}

#pack,
#reservation {
  scroll-margin-top: 84px;
}

.pack-grid .app-card {
  grid-column: span 2;
  border-color: rgba(255, 110, 0, .45);
  background: #fff8f2;
}

@media (min-width: 1100px) {
  .pack-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 851px) and (max-width: 1099px) {
  .pack-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pack-grid article:last-child {
    grid-column: 2;
    grid-row: 3;
  }
}

.how-benefit {
  max-width: 780px;
  margin: 42px auto 0;
  padding: 20px 24px;
  border-left: 4px solid var(--orange);
  border-radius: 9px;
  background: #fff8f2;
  color: var(--navy);
  font: 800 clamp(1.1rem, 2vw, 1.35rem)/1.45 Montserrat, Arial, sans-serif;
  text-align: left;
}

.how-benefit > span,
.how-benefit-tail {
  display: block;
}

.how-benefit-tail {
  margin-top: 7px;
}

.reservation .reservation-deadline {
  margin-top: 18px;
  color: var(--orange) !important;
  font-weight: 900;
}

.reservation .trust {
  margin-top: 24px;
}

.reservation .trust b {
  color: var(--orange);
}

.pack-intro {
  margin: 24px 0 4px;
  color: #fff !important;
  font-family: Montserrat, Arial, sans-serif;
  font-weight: 800;
}

.reservation-pack {
  margin: 0 0 18px;
  padding-left: 22px;
  color: #fff;
}

.reservation-pack li {
  margin: 7px 0;
}

.reservation-intro .all-included,
.reservation-intro .booking-warranty {
  color: #fff;
}

.reservation-intro .all-included {
  margin: 20px 0 8px;
}

.reservation-intro .booking-warranty {
  margin-top: 0;
  font-weight: 700;
}

.reservation-intro .payment-note {
  margin-top: 22px;
  padding: 13px 15px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 9px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

.postal-city-fields {
  display: grid;
  grid-template-columns: minmax(140px, 180px) minmax(220px, 1fr);
  gap: 14px;
}

.postal-city-fields select:disabled {
  color: #707887;
  background: #f3f4f6;
}

.postal-city-fields select.expanded {
  min-height: 178px;
  padding: 6px;
  background: #fff;
}

.postal-city-fields select.expanded option {
  padding: 9px 10px;
  border-radius: 6px;
}

.postal-city-fields select.expanded option:checked {
  background: var(--navy);
  color: #fff;
}

.city-choice-help {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 400;
  line-height: 1.4;
}

.city-choice-help[hidden] {
  display: none;
}

.consents {
  position: relative;
  padding-right: 52px;
}

.privacy-info {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 2px solid var(--navy);
  border-radius: 50%;
  background: #fff;
  color: var(--navy);
  font: 900 1rem/1 Montserrat, Arial, sans-serif;
  cursor: pointer;
}

.privacy-info:hover,
.privacy-info:focus-visible {
  background: var(--navy);
  color: #fff;
}

.privacy-dialog {
  width: min(480px, calc(100% - 32px));
  padding: 0;
  border: 0;
  border-radius: 16px;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0, 20, 64, .38);
}

.privacy-dialog::backdrop {
  background: rgba(0, 20, 64, .72);
  backdrop-filter: blur(3px);
}

.privacy-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px 14px;
  border-bottom: 1px solid var(--line);
}

.privacy-dialog-head h2 {
  margin: 0;
  font-size: 1.35rem;
}

.privacy-dialog-body {
  padding: 18px 24px 24px;
}

.privacy-dialog-body p {
  margin: 0 0 12px;
}

.privacy-dialog-body a {
  color: var(--navy);
  font-weight: 800;
}

.month-nav button {
  min-width: 48px;
  min-height: 48px;
  padding: 8px 16px;
  font-size: 1.6rem;
  line-height: 1;
}

.slot-buttons button.selected,
.slot-buttons button[aria-pressed="true"] {
  background: var(--navy);
  color: #fff;
  box-shadow: 0 0 0 3px rgba(255, 110, 0, .35);
}

.otp-phone-help {
  margin: -8px 0 18px;
  color: var(--muted);
  font-size: .9rem;
}

.legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
}

.otp-acceptance {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 4px 0 18px;
  padding: 13px 15px;
  border-left: 3px solid var(--orange);
  border-radius: 8px;
  background: #f6f7f9;
  color: var(--muted);
  font-size: .86rem;
  font-weight: 400;
  line-height: 1.5;
}

.otp-acceptance input {
  width: auto;
  flex: 0 0 auto;
  margin: 4px 0 0;
}

.otp-acceptance span {
  color: inherit;
  font-weight: inherit;
}

.otp-acceptance a {
  color: var(--navy);
  font-weight: 800;
}

.faq {
  max-width: none;
  padding: 56px 24px;
  background: #f4f7fb;
}

.faq-wrap {
  max-width: 1060px;
  margin: 0 auto;
}

.faq .eyebrow {
  margin-bottom: 10px;
}

.faq h2 {
  margin: 0 0 28px;
  font-size: clamp(1.8rem, 4vw, 3rem);
}

.faq-list {
  border: 1px solid #dfe4eb;
  background: #fff;
}

.faq-item {
  padding: 25px 34px 27px;
  border-bottom: 1px solid #dfe4eb;
}

.faq-item:last-child {
  border-bottom: 0;
}

.faq-item h3 {
  margin: 0 0 7px;
  color: var(--navy);
  font: 800 .95rem/1.4 Montserrat, Arial, sans-serif;
}

.faq-item p {
  margin: 0 0 0 34px;
  color: var(--ink);
  font-size: .95rem;
  line-height: 1.7;
}

.google-reviews[hidden] {
  display: none;
}

.google-reviews {
  padding: clamp(52px, 7vw, 84px) clamp(24px, 7vw, 100px);
  background: #fff;
}

.google-reviews-wrap {
  max-width: 1180px;
  margin: 0 auto;
}

.google-reviews-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 28px;
}

.google-reviews-heading h2 {
  margin: 0;
}

.google-rating {
  display: grid;
  grid-template-columns: auto auto;
  column-gap: 10px;
  align-items: center;
  min-width: 230px;
  padding: 14px 18px;
  border: 1px solid #dfe4eb;
  border-radius: 14px;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(0, 32, 91, .08);
}

.google-rating-brand {
  grid-column: 1 / -1;
  color: #374151;
  font-weight: 700;
}

.google-rating-stars,
.google-review-card-stars {
  color: #f5a000;
  letter-spacing: .08em;
}

.google-rating strong {
  color: var(--navy);
  font-family: Montserrat, Arial, sans-serif;
}

.google-rating small {
  grid-column: 1 / -1;
  color: var(--muted);
}

.google-review-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.google-review-card {
  display: flex;
  flex-direction: column;
  min-height: 250px;
  padding: 24px;
  border: 1px solid #dfe4eb;
  border-radius: 14px;
  background: #f8fafc;
}

.google-review-card blockquote {
  flex: 1;
  margin: 15px 0 24px;
  color: var(--ink);
  font-size: .96rem;
  line-height: 1.65;
}

.google-review-card footer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 0;
  background: transparent;
  color: var(--ink);
}

.google-review-card footer strong {
  color: var(--navy);
  font-family: Montserrat, Arial, sans-serif;
}

.google-review-card footer span,
.google-review-card footer a {
  color: var(--muted);
  font-size: .78rem;
}

.google-review-card footer a {
  margin-top: 6px;
  color: var(--navy);
}

.google-reviews-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 22px;
}

.google-reviews-footer p {
  margin: 0;
  color: var(--muted);
  font-size: .78rem;
}

.google-reviews-footer .button.secondary {
  border: 1px solid var(--navy);
  color: var(--navy);
  background: #fff;
  box-shadow: none;
}

.diagnostic-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  padding: clamp(34px, 5vw, 58px) clamp(24px, 7vw, 100px);
  background: var(--navy);
  color: #fff;
}

.diagnostic-cta > div {
  max-width: 760px;
}

.diagnostic-cta h2 {
  margin: 0 0 12px;
  color: #fff;
  font-size: clamp(1.7rem, 4vw, 2.7rem);
}

.diagnostic-cta p:last-child {
  margin: 0;
  color: #dbe6ff;
  font-size: 1.05rem;
}

.diagnostic-cta .button {
  flex: 0 0 auto;
  text-align: center;
}

.offer-conditions {
  width: min(680px, calc(100% - 32px));
  max-height: min(760px, calc(100vh - 32px));
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0, 20, 64, .38);
}

.offer-conditions::backdrop {
  background: rgba(0, 20, 64, .76);
  backdrop-filter: blur(3px);
}

.modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 28px 28px 18px;
  border-bottom: 1px solid var(--line);
}

.modal-head .eyebrow {
  margin-bottom: 10px;
}

.modal-head h2 {
  margin: 0;
  font-size: clamp(1.5rem, 4vw, 2.1rem);
}

.modal-close {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border: 1px solid #d8dce3;
  border-radius: 50%;
  background: #fff;
  color: var(--navy);
  font: 400 1.8rem/1 Arial, sans-serif;
  cursor: pointer;
}

.modal-close:hover {
  background: #f4f5f7;
}

.modal-body {
  max-height: calc(100vh - 260px);
  padding: 20px 28px;
  overflow: auto;
}

.modal-body ul {
  margin: 0;
  padding-left: 22px;
}

.modal-body li {
  margin: 8px 0;
}

.modal-offer {
  margin: 20px 0 0;
  padding: 15px 17px;
  border-left: 4px solid var(--orange);
  border-radius: 8px;
  background: #fff4eb;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 18px 28px 24px;
  border-top: 1px solid var(--line);
}

@media (max-width: 850px) {
  .hero-visual {
    order: -1;
    min-height: clamp(320px, 92vw, 500px);
  }

  .hero-visual figcaption {
    right: 16px;
    bottom: 16px;
    left: 16px;
    max-width: none;
  }

  .hero-copy {
    padding-top: 42px;
  }

  .postal-city-fields {
    grid-template-columns: 135px minmax(0, 1fr);
  }

  .pack-grid .app-card {
    grid-column: auto;
  }

  .hero-actions {
    width: 100%;
  }

  .hero-actions .button {
    flex: 1 1 210px;
  }

  .diagnostic-cta {
    align-items: stretch;
    flex-direction: column;
  }

  .landing-booking-cta {
    align-items: stretch;
    flex-direction: column;
  }

  html.booking-route .reservation {
    padding-top: 38px;
  }

  html.booking-route .reservation-intro {
    display: contents;
  }

  html.booking-route .reservation-heading {
    grid-row: 1;
    min-width: 0;
  }

  html.booking-route .funnel {
    grid-row: 2;
    width: 100%;
    min-width: 0;
  }

  html.booking-route .reservation-offer-details {
    grid-row: 3;
    min-width: 0;
    padding: 6px 4px 0;
  }

  html.booking-route .reservation-offer-details .trust {
    margin-top: 0;
  }

  html.booking-route .progress {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  html.booking-route .progress span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}

/* Keep the intermediate booking reassurance concise when space allows it. */
@media (min-width: 1101px) {
  .landing-booking-cta > div {
    max-width: none;
  }

  .landing-booking-cta p:last-child {
    font-size: clamp(.88rem, 1vw, 1.05rem);
    white-space: nowrap;
  }
}

/* More polished FAQ, with the same compact vertical rhythm. */
.faq h2 {
  display: flex;
  align-items: center;
  gap: 18px;
}

.faq h2::after {
  content: "";
  flex: 1 1 auto;
  height: 2px;
  background: linear-gradient(90deg, var(--orange), transparent);
}

.faq-list {
  display: grid;
  gap: 5px;
  border: 0;
  background: transparent;
}

.faq .faq-item {
  overflow: hidden;
  margin: 0;
  border: 1px solid #dfe4eb;
  border-left: 3px solid transparent;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 32, 91, .035);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.faq .faq-item:hover,
.faq .faq-item[open] {
  border-left-color: var(--orange);
  box-shadow: 0 4px 14px rgba(0, 32, 91, .07);
}

.faq .faq-item[open] {
  background: linear-gradient(90deg, #fffaf3 0, #fff 42%);
}

.faq-item summary {
  position: relative;
  padding-right: 52px;
  list-style: none;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::after {
  content: "+";
  position: absolute;
  top: 50%;
  right: 16px;
  display: grid;
  width: 23px;
  height: 23px;
  place-items: center;
  transform: translateY(-50%);
  border-radius: 50%;
  background: var(--cream);
  color: var(--orange);
  font: 800 1.05rem/1 Montserrat, Arial, sans-serif;
}

.faq-item[open] summary::after {
  content: "−";
  background: var(--orange);
  color: var(--cream);
}

@media (max-width: 560px) {
  .faq h2 {
    gap: 12px;
  }

  .faq-item:not([open]) summary {
    padding-right: 48px;
  }
}

.hero-pack-coverage {
  margin: 12px 0 0 !important;
  padding-top: 11px;
  border-top: 1px solid rgba(255, 183, 127, .52);
  color: var(--cream) !important;
  font: 700 .88rem/1.35 Roboto, Arial, sans-serif !important;
}

.hero-pack-coverage sup { color: #ffb77f; }

.pack-footnote {
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px clamp(20px, 7vw, 100px) 28px;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.45;
}

@media (max-width: 850px) {
  .hero-pack-coverage {
    margin-top: 10px !important;
    padding: 10px 3px 0;
    font-size: .8rem !important;
  }

  .hero-trust-strip {
    position: static;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: none;
    padding: 16px 10px;
    background: #001440;
    color: var(--cream);
    font: 700 .67rem/1.25 Montserrat, Arial, sans-serif;
  }

  .hero-trust-strip span {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 0 7px;
    border-right: 1px solid rgba(255,255,255,.35);
    text-align: center;
  }

  .hero-trust-strip svg { width: 28px; height: 28px; }
  .hero-trust-strip .french-flag { width: 32px; height: 24px; }
}

@media (max-width: 850px) {
  .google-reviews-heading,
  .google-reviews-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .google-rating {
    width: min(100%, 320px);
  }

  .google-review-list {
    grid-template-columns: 1fr;
  }

  .google-review-card {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .postal-city-fields {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .how-benefit {
    padding: 18px;
    font-size: 1.2rem;
    line-height: 1.55;
  }

  .faq {
    padding: 48px 18px;
  }

  .faq-item {
    padding: 20px 18px 22px;
  }

  .faq-item p {
    margin-left: 0;
  }

  .modal-head,
  .modal-body,
  .modal-actions {
    padding-left: 20px;
    padding-right: 20px;
  }

  .modal-actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }
}

/* Landing V2 — priorité à l'information et au passage vers la planification. */
.hero {
  grid-template-columns: minmax(0, 3fr) minmax(260px, 1fr);
  min-height: auto;
}

.hero-copy {
  justify-content: flex-start;
  padding: clamp(32px, 3vw, 48px) clamp(28px, 6vw, 92px);
}

.hero-copy h1 {
  max-width: 900px;
  font-size: clamp(2.35rem, 3.7vw, 3.5rem);
}

.hero-title-main,
.hero-title-sub {
  display: block;
  white-space: nowrap;
}

.hero-title-sub {
  margin-top: .18em;
  font-size: .48em;
  line-height: 1.12;
  letter-spacing: -.025em;
}

.hero-tagline {
  max-width: 780px;
  margin-bottom: 15px;
  font-size: clamp(1.12rem, 1.8vw, 1.35rem);
}

.price {
  margin-bottom: 12px;
}

.price strong {
  display: block;
  font-size: clamp(2.35rem, 4vw, 4rem);
}

.price strong span {
  color: inherit;
  letter-spacing: inherit;
  text-transform: none;
}

.price .hero-price-qualifier {
  display: block;
  margin-top: .16em;
  font-size: .48em;
  line-height: 1.05;
}

.hero-pack-summary,
.hero-payment-note,
.hero-contact {
  max-width: 700px;
  margin: 6px 0 16px;
  font-size: 1rem;
}

.hero-pack-summary {
  color: #fff;
  font-weight: 700;
}

.hero-payment-note {
  color: #dbe6ff;
}

.hero-contact {
  color: #dbe6ff;
}

.hero-contact a {
  color: #fff;
  font-weight: 900;
}

.reassurance-points {
  margin-bottom: 17px;
}

.hero-pack {
  max-width: 760px;
  margin: 2px 0 18px;
  padding: 16px 20px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 12px;
  background: rgba(255,255,255,.07);
}

.hero-pack p {
  margin: 0 0 7px;
  color: #ffb77f;
  font-family: Montserrat, Arial, sans-serif;
  font-weight: 900;
}

.hero-pack ul {
  columns: 2;
  margin: 0;
  padding-left: 22px;
}

.hero-pack li {
  margin: 4px 20px 4px 0;
  break-inside: avoid;
}

.pack-item-icon {
  display: none;
}

.pack-item-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.hero-trust-strip {
  display: none;
}

.hero-secondary-cta {
  margin-bottom: 7px;
}

.hero-visual {
  min-height: 580px;
  background: #061c4a;
}

.hero-visual img {
  object-fit: contain;
  padding: 28px 18px 100px;
}

.hero-visual:after {
  background: linear-gradient(90deg, var(--dark), transparent 22%);
}

.service-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
  gap: 10px 28px;
  list-style: none;
}

.service-list li {
  position: relative;
  padding: 12px 14px 12px 42px;
  border-bottom: 1px solid var(--line);
  font-size: 1.05rem;
}

.service-list li::before {
  content: "✓";
  position: absolute;
  left: 12px;
  color: var(--green);
  font-weight: 900;
}

.service-conclusion {
  max-width: 940px;
  margin: 30px auto 0;
  color: var(--navy);
  font: 800 clamp(1.08rem, 2vw, 1.35rem)/1.5 Montserrat, Arial, sans-serif;
  text-align: center;
}

.essential-answers {
  padding: clamp(54px, 7vw, 84px) clamp(22px, 7vw, 100px);
  background: #f4f7fb;
}

.essential-answers-wrap {
  max-width: 1180px;
  margin: 0 auto;
}

.essential-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.essential-grid details {
  padding: 20px;
  border: 1px solid #dfe4eb;
  border-radius: 12px;
  background: #fff;
}

.essential-grid summary {
  color: var(--navy);
  font: 800 1.05rem/1.4 Montserrat, Arial, sans-serif;
}

.essential-grid p {
  margin: 12px 0 0;
  line-height: 1.55;
}

.reviews-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 0 24px 64px;
  background: #fff;
}

.reviews-cta span {
  color: var(--muted);
  font-weight: 700;
}

.faq .faq-item {
  padding: 0;
  margin: 4px 0;
}

.faq-item summary {
  padding: 22px 34px;
  color: var(--navy);
  cursor: pointer;
  font: 800 1rem/1.4 Montserrat, Arial, sans-serif;
}

.faq-item:not([open]) summary {
  padding: 12px 22px;
  line-height: 1.25;
}

.faq-item p {
  margin: -5px 34px 24px;
}

.contact-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 12px;
}

.contact-actions .secondary {
  border-color: #fff;
  color: #fff;
}

.callback-dialog {
  width: min(580px, calc(100% - 32px));
  padding: 0;
  border: 0;
  border-radius: 16px;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0, 20, 64, .38);
}

.callback-dialog::backdrop {
  background: rgba(0, 20, 64, .72);
  backdrop-filter: blur(3px);
}

.callback-form {
  padding: 22px 24px 26px;
}

.callback-form > p {
  color: var(--muted);
}

.callback-form .field-hint {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 400;
  line-height: 1.35;
}

.plugplay-dialog {
  width: min(580px, calc(100% - 32px));
  padding: 0;
  border: 0;
  border-radius: 16px;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0, 20, 64, .38);
}

.plugplay-dialog::backdrop {
  background: rgba(0, 20, 64, .72);
  backdrop-filter: blur(3px);
}

.plugplay-form { padding: 22px 24px 26px; }

.plugplay-form > p { color: var(--muted); }

.plugplay-callback-choice {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 4px 0 14px;
  font-size: .94rem;
  line-height: 1.4;
}

.plugplay-callback-choice input {
  width: auto;
  margin: 4px 0 0;
}

.plugplay-privacy {
  margin: 0 0 17px !important;
  font-size: .78rem;
  line-height: 1.4;
}

.plugplay-privacy a { color: var(--navy); }

@media (max-width: 850px) {
  .offer-email-capture { width: 100%; grid-template-columns: minmax(0, 1fr); }
  .offer-email-capture input[type="email"],
  .offer-email-capture button { width: 100%; }
}

.operation-ended {
  max-width: 650px;
  margin-top: 18px;
  padding: 20px;
  border: 1px solid #ffb77f;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
}

.operation-ended strong,
.operation-ended span {
  display: block;
}

.operation-ended strong {
  color: #ffb77f;
  font: 900 1.25rem Montserrat, Arial, sans-serif;
}

.operation-ended .button {
  margin-top: 15px;
}

.operation-inactive [data-enter-booking],
.operation-inactive [data-promo-gift],
.operation-inactive .hero-payment-note,
.operation-inactive .offer-deadline,
.operation-inactive .hero-pack-summary,
.operation-inactive .reassurance-points,
.operation-inactive .hero-pack,
.operation-inactive .hero-secondary-cta,
.operation-inactive .hero-contact,
.operation-inactive .hero .legal-links,
.operation-inactive .reviews-cta,
.operation-inactive .landing-booking-cta,
.operation-inactive .mobile-cta {
  display: none !important;
}

.operation-inactive .operation-ended {
  display: block;
}

.mobile-cta {
  transform: translateY(140%);
  opacity: 0;
  transition: transform .2s ease, opacity .2s ease;
}

.mobile-cta.is-visible {
  transform: translateY(0);
  opacity: 1;
}

/* The compact campaign badge already carries the live App Admin date. */
.hero .offer-deadline { display: none; }

.hero-copy,
.hero-copy h1,
.hero-title-main,
.hero-title-sub,
.price strong,
.price .hero-price-qualifier,
.hero-payment-note,
.hero-contact,
.hero-contact a,
.hero-pack li {
  color: var(--cream);
}

.hero-contact-desktop { display: none; }

.ttc-label {
  display: inline !important;
  font-size: .48em;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .01em;
  text-transform: lowercase !important;
  vertical-align: baseline;
}

.essential-grid details > summary {
  pointer-events: none;
}

@media (max-width: 850px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  body { font-size: 17px; }
  .topbar { width: 100%; min-width: 0; height: 62px; padding: 0 14px; }
  .topbar .brand { font-size: 1rem; }
  .topbar .phone {
    display: inline-flex;
    align-items: center;
    padding: 7px 10px;
    gap: 6px;
    font-size: .74rem;
    white-space: nowrap;
  }
  .topbar .phone::before { content: none; }
  .topbar .phone svg { width: 15px; height: 15px; fill: currentColor; }
  .hero { display: flex; width: 100vw; min-width: 0; flex-direction: column; }
  .hero-copy { order: 1; flex: 0 0 auto; width: 100vw; min-width: 0; max-width: 100vw; padding: 26px 18px 24px; }
  .hero-copy > * { max-width: 100%; }
  .hero-copy .campaign-eyebrow {
    display: flex;
    align-items: center;
    flex-flow: row nowrap;
    margin-bottom: 14px;
    gap: 8px;
  }
  .hero-copy .campaign-name { flex: 0 1 auto; font-size: .64rem; white-space: nowrap; }
  .hero-copy .campaign-eyebrow .campaign-period {
    display: inline-flex;
    align-items: center;
    flex: 0 1 auto;
    flex-direction: row;
    min-width: 0;
    min-height: 32px;
    padding: 6px 8px;
    gap: 5px;
    border-radius: 8px;
    background: var(--orange);
    color: #fff;
    font-size: .58rem;
    white-space: nowrap;
  }
  body:not(.campaign-extended) .campaign-eyebrow .campaign-period::before,
  body:not(.campaign-extended) .campaign-eyebrow .campaign-period::after { display: none; }
  .campaign-period svg {
    flex: 0 0 15px;
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }
  .hero-copy h1 { width: 100%; margin: 0 0 17px; font-size: clamp(1.42rem, 7.15vw, 2rem); text-align: center; }
  .hero-title-sub { margin-top: .2em; font-size: .48em; letter-spacing: -.035em; text-align: center; }
  .price {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(100vw - 36px);
    min-width: 0;
    margin: 0 0 18px;
    padding: 13px 12px 15px;
    gap: 0;
    overflow: hidden;
    border: 2px solid var(--orange);
    border-radius: 16px;
    background: var(--cream);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
  }
  .price::before {
    content: "OFFRE TOUT COMPRIS";
    order: 0;
    margin-bottom: 2px;
    color: var(--orange);
    font: 900 .67rem/1.2 Montserrat, Arial, sans-serif;
    letter-spacing: .14em;
  }
  .price-reference-line {
    order: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 5px;
    gap: 8px;
  }
  .price-reference-line del {
    color: var(--navy);
    font-size: 1.05rem;
    text-decoration-thickness: 1px;
    white-space: nowrap;
  }
  .price-reference-line .hero-original-price {
    display: inline-flex;
    align-items: baseline;
    color: var(--navy);
    gap: 3px;
    white-space: nowrap;
  }
  .price-reference-line .hero-original-price > .ttc-label {
    color: var(--navy);
    font-size: .62rem;
    text-decoration: none;
  }
  .price-reference-line .price-saving {
    margin: 0;
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--orange);
    color: #fff;
    font-size: .68rem;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
  }
  .price strong {
    order: 1;
    display: flex;
    align-items: baseline;
    flex-flow: row nowrap;
    min-width: 0;
    color: var(--navy);
    font-size: clamp(2.75rem, 13vw, 3.65rem);
    line-height: 1;
    white-space: nowrap;
  }
  .price strong .hero-offer-price { color: var(--navy); }
  .price .hero-price-qualifier {
    display: none;
  }
  .hero-pack { width: calc(100vw - 36px); min-width: 0; margin: 17px 0 15px; padding: 14px 10px 13px; }
  .hero-pack > p { margin-bottom: 10px; }
  .hero-pack ul {
    display: block;
    margin: 0;
    padding-left: 22px;
    columns: auto;
    list-style: disc;
  }
  .hero-pack li {
    display: list-item;
    min-width: 0;
    margin: 7px 0;
    padding: 0 2px;
    border: 0;
    font-size: .84rem;
    line-height: 1.3;
    text-align: left;
  }
  .pack-item-icon { display: none; }
  .pack-item-icon img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 3px 4px rgba(0,0,0,.25)); }
  .pack-central { width: 72px; }
  .pack-central img { transform: scale(1.22); }
  .pack-opening { width: 46px; }
  .pack-motion { width: 45px; }
  .pack-siren { width: 54px; }
  .pack-badges { width: 78px; }
  .pack-phone { width: 38px; }
  .reassurance-points {
    display: grid;
    grid-template-columns: 1fr;
    width: calc(100vw - 36px);
    min-width: 0;
    margin: 0 0 14px;
    padding: 0;
    gap: 8px;
    list-style: none;
  }
  .reassurance-points li {
    display: flex;
    align-items: center;
    min-width: 0;
    margin: 0;
    padding: 0;
    gap: 10px;
    font-size: .88rem;
    line-height: 1.25;
  }
  .reassurance-points li::before { content: none; }
  .reassurance-points li br { display: none; }
  .reassurance-points li > svg {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    padding: 5px;
    border: 2px solid var(--orange);
    border-radius: 50%;
    fill: none;
    stroke: #fff;
    stroke-width: 2.4;
  }
  .gift-offer { display: flex; align-items: center; width: calc(100vw - 36px); min-width: 0; margin-bottom: 22px; padding: 10px 12px; gap: 10px; }
  .gift-offer::before { content: none; }
  .gift-offer > svg { display: block; flex: 0 0 30px; width: 30px; height: 30px; fill: none; stroke: var(--orange); stroke-width: 2.5; }
  .hero-visual {
    order: 2;
    min-height: min(92vw, 410px);
    background: url('/assets/promo-alarme/hero-night-v4-mockup-v3.webp') 68% center / cover no-repeat;
  }
  .hero-visual img,
  .hero-visual figcaption { display: none; }
  .hero-primary-cta, .hero-secondary-cta { width: 100%; }
  .hero-payment-note, .hero-pack-summary, .hero-contact { font-size: .9rem; }
  .hero-contact-desktop { display: none; }
  .hero-contact-mobile { display: block; }
  .service-list, .essential-grid { grid-template-columns: 1fr; }
  .service-list li { font-size: 1rem; }
  .essential-grid details:nth-child(-n+3) summary { cursor: default; }
  .essential-grid summary { font-size: 1.1rem; }
  .essential-grid details { padding: 20px; }
  .reviews-cta { align-items: stretch; flex-direction: column; text-align: center; }
  .google-review-list {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 2px 15% 12px 0;
  }
  .google-review-card {
    flex: 0 0 88%;
    scroll-snap-align: start;
  }
  .contact-actions { align-items: stretch; flex-direction: column; }
  .faq-item summary { padding: 20px; font-size: 1.05rem; }
  .faq-item:not([open]) summary { padding: 11px 16px; font-size: .94rem; }
  .faq-item p { margin: -3px 20px 22px; font-size: 1rem; }
}

@media (min-width: 851px) {
  .topbar {
    height: 76px;
    padding-inline: clamp(38px, 4.2vw, 72px);
    background: rgba(0, 32, 91, .96);
  }
  .topbar .brand { font-size: 1.5rem; }
  .topbar .phone {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 11px 22px;
    border: 0;
    background: var(--orange);
    box-shadow: 0 10px 30px rgba(255, 110, 0, .25);
  }
  .topbar .phone::before { content: none; }
  .topbar .phone svg { width: 21px; height: 21px; fill: currentColor; }
  .hero {
    position: relative;
    display: block;
    min-height: calc(100vh - 76px);
    background:
      linear-gradient(90deg, rgba(0, 19, 58, .98) 0%, rgba(0, 25, 69, .94) 43%, rgba(0, 25, 69, .25) 66%, rgba(0, 18, 52, .08) 100%),
      url('/assets/promo-alarme/hero-night-v4-mockup-v3.webp') center center / cover no-repeat;
  }
  .hero-copy {
    position: relative;
    z-index: 2;
    display: flex;
    width: 58%;
    min-height: calc(100vh - 76px);
    justify-content: center;
    padding: clamp(12px, 1.8vh, 24px) clamp(34px, 3.6vw, 58px);
  }
  .hero-copy .campaign-eyebrow {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 18px;
  }
  .hero-copy .campaign-eyebrow .campaign-period {
    display: inline-flex;
    align-items: center;
    flex-direction: row;
    min-height: 38px;
    padding: 7px 13px;
    gap: 8px;
    border-radius: 10px;
    background: var(--orange);
    color: #fff;
  }
  body:not(.campaign-extended) .campaign-eyebrow .campaign-period::before,
  body:not(.campaign-extended) .campaign-eyebrow .campaign-period::after { display: none; }
  .campaign-period svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }
  .hero-copy h1 {
    width: max-content;
    max-width: none;
    margin: 2px 0 13px;
    font-size: clamp(3rem, 4vw, 4.6rem);
  }
  .hero-title-sub {
    margin-top: .18em;
    color: var(--cream);
    font-size: .48em;
    font-weight: 700;
  }
  .price {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    max-width: 780px;
    margin: 0 0 11px;
    column-gap: 22px;
  }
  .price-reference-line {
    grid-column: 1;
    grid-row: 1;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }
  .price strong {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    align-items: baseline;
    flex-flow: row wrap;
    column-gap: .35em;
    row-gap: .08em;
    font-size: clamp(3rem, 4.35vw, 4.8rem);
  }
  .price strong .hero-offer-price {
    white-space: nowrap;
  }
  .price .hero-price-qualifier {
    margin: 0;
    color: var(--cream);
    font-size: .36em;
    white-space: nowrap;
  }
  .price > span:last-child {
    grid-column: 2;
    margin-top: -3px;
  }
  .hero-pack {
    width: 100%;
    max-width: 790px;
    margin: 0 0 9px;
    padding: 10px 14px 12px;
    border: 2px solid var(--orange);
    border-radius: 22px;
    background: rgba(4, 24, 61, .68);
    backdrop-filter: blur(5px);
  }
  .hero-pack > p {
    margin: 0 0 4px;
    color: #ffad66;
    font: 800 1.2rem/1.1 Montserrat, Arial, sans-serif;
  }
  .hero-pack ul {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .hero-pack li {
    display: flex;
    align-items: center;
    flex-direction: column;
    min-width: 0;
    margin: 0;
    padding: 0 7px;
    border-right: 1px solid rgba(255, 183, 127, .52);
    color: var(--cream);
    font-size: clamp(.61rem, .68vw, .76rem);
    line-height: 1.16;
    text-align: center;
  }
  .hero-pack li:last-child { border-right: 0; }
  .pack-item-icon {
    display: block;
    width: 58px;
    height: 50px;
    margin-bottom: 3px;
    color: #fff;
  }
  .pack-item-icon svg { width: 100%; height: 100%; overflow: visible; fill: rgba(250,252,255,.97); stroke: #9ca8b8; stroke-width: 1.4; }
  .pack-item-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .28));
  }
  .pack-central { width: 76px; height: 50px; }
  .pack-central img { transform: scale(1.45); }
  .pack-opening { width: 46px; }
  .pack-motion { width: 44px; }
  .pack-siren { width: 54px; }
  .pack-phone { width: 38px; }
  .pack-item-icon .accent-gold { fill: #f6ca69; stroke: #6d5a2b; }
  .pack-item-icon .lens { fill: #061526; stroke: #6f849b; }
  .pack-item-icon .blue-ring { fill: none; stroke: #1db7ff; stroke-width: 3; }
  .pack-item-icon .speaker { fill: #eef2f5; stroke: #a0aab5; }
  .pack-item-icon .phone-home { fill: rgba(80,220,103,.2); stroke: #62e473; stroke-width: 2; }
  .pack-badges { width: 70px; }
  .reassurance-points {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: 830px;
    margin: 0 0 8px;
    padding: 0;
    gap: 12px;
    list-style: none;
  }
  .reassurance-points li {
    position: relative;
    min-height: 40px;
    margin: 0;
    display: flex;
    align-items: center;
    padding: 2px 4px;
    gap: 12px;
    font-size: clamp(.72rem, .8vw, .9rem);
    line-height: 1.35;
  }
  .reassurance-points li::before { content: none; }
  .reassurance-points li > svg {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 5px;
    border: 2px solid var(--orange);
    border-radius: 50%;
    fill: none;
    stroke: var(--cream);
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .gift-offer {
    width: 100%;
    max-width: 790px;
    margin: 0 0 13px;
    display: flex;
    align-items: center;
    padding: 8px 13px;
    gap: 14px;
    line-height: 1.3;
  }
  .gift-offer::before { content: none; }
  .gift-offer > svg { display: block; flex: 0 0 38px; width: 38px; height: 38px; fill: none; stroke: var(--orange); stroke-width: 2.5; stroke-linejoin: round; }
  .hero-actions { width: min(550px, 100%); }
  .hero-actions .button {
    width: 100%;
    min-height: 58px;
    border-radius: 12px;
    font-size: 1.15rem;
    line-height: 1.1;
  }
  .hero-actions .button::after {
    content: "→";
    margin-left: 16px;
    font-size: 1.5rem;
  }
  .hero-payment-note {
    margin: 4px 0 0;
    color: var(--cream);
    font-size: .88rem;
    line-height: 1.3;
  }
  .hero-contact-desktop {
    display: block;
    margin: 5px 0 0;
    color: var(--cream);
    font-size: .82rem;
    line-height: 1.25;
  }
  .hero-contact-desktop a { color: var(--cream); font-weight: 900; }
  .hero-contact-mobile { display: none; }
  .hero-copy .legal-links {
    display: block;
    margin-top: 1px;
    color: var(--cream);
    font-size: .78rem;
    line-height: 1.2;
  }
  .hero-copy .legal-links .detail-link { margin-top: 0; }
  .hero-visual {
    display: none;
  }
  .hero-trust-strip {
    position: absolute;
    z-index: 2;
    right: 3.5vw;
    bottom: 4.5vh;
    display: flex;
    max-width: 40%;
    color: #fff;
    font: 700 clamp(.72rem, .8vw, .9rem)/1.3 Montserrat, Arial, sans-serif;
  }
  .hero-trust-strip span {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    border-right: 1px solid rgba(255,255,255,.5);
  }
  .hero-trust-strip span::before { content: none; }
  .hero-trust-strip svg { width: 34px; height: 34px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  .hero-trust-strip .french-flag { width: 38px; height: 30px; stroke: none; }
  .hero-trust-strip .french-flag .flag-blue { fill: #0055a4; }
  .hero-trust-strip .french-flag .flag-white { fill: #fff; }
  .hero-trust-strip .french-flag .flag-red { fill: #ef4135; }
  .hero-trust-strip .french-flag .flag-border { fill: none; stroke: rgba(255,255,255,.9); stroke-width: 1.5; }
  .hero-trust-strip span:last-child {
    padding-right: 0;
    border-right: 0;
  }
  .offer-deadline { display: none; }
  .essential-grid details > summary { list-style: none; cursor: default; }
  .essential-grid details > summary::-webkit-details-marker { display: none; }
  .essential-grid details:not([open]) > p { display: block; }
}

@media (min-width: 851px) and (max-width: 1100px) {
  .hero-copy h1 {
    font-size: clamp(2.25rem, 4.2vw, 3rem);
  }
}

/* Warm cream is reserved for foregrounds on dark or orange surfaces. */
.topbar,
.topbar .phone,
.hero,
.hero-copy,
.hero-copy h1,
.hero-title-main,
.hero-title-sub,
.hero-pack li,
.hero-payment-note,
.hero-contact,
.hero-contact a,
.hero-copy .legal-links,
.gift-offer,
.booking-return,
.landing-booking-cta,
.landing-booking-cta h2,
.landing-booking-cta p:last-child,
.diagnostic-cta,
.diagnostic-cta h2,
.reservation,
.reservation-intro h2,
.reservation-intro > p,
.reservation-intro .all-included,
.reservation-intro .booking-warranty,
.reservation-pack,
.reservation-gift,
.pack-intro,
.hero-trust-strip,
footer,
footer nav a,
.button.primary,
.mobile-cta,
.steps-overview > li > span,
.done-icon,
.campaign-eyebrow .campaign-period,
.price-reference-line .price-saving,
.slot-buttons button.selected,
.slot-buttons button[aria-pressed="true"],
.privacy-info:hover,
.privacy-info:focus-visible {
  color: var(--cream);
}

@media (min-width: 851px) {
  .price-reference-line .hero-original-price,
  .price-reference-line .hero-original-price del,
  .price-reference-line .hero-original-price > .ttc-label {
    color: var(--cream);
  }

  .price-reference-line .hero-original-price > .ttc-label {
    font-size: .9rem !important;
  }

  .hero-info-row {
    display: flex;
    align-items: baseline;
    width: max-content;
    max-width: 100%;
    margin-top: 12px;
    gap: 24px;
    color: var(--cream);
    white-space: nowrap;
  }

  .hero-info-row .legal-links,
  .hero-info-row .hero-contact-desktop {
    margin: 0;
  }
}

@media (max-width: 850px) {
  .price-reference-line .hero-original-price > .ttc-label {
    font-size: .78rem !important;
  }

  .hero-info-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    margin-top: 12px;
    gap: 4px 16px;
    color: var(--cream);
  }

  .hero-info-row .legal-links,
  .hero-info-row .hero-contact-mobile {
    margin: 0;
  }
}

/* Keep room for the FAQ state indicator after the compact legacy paddings. */
.faq-item summary {
  padding-right: 52px;
}

@media (max-width: 560px) {
  .faq-item summary,
  .faq-item:not([open]) summary {
    padding-right: 48px;
  }
}

/* The following Hero refinements must remain last: earlier campaign styles
   intentionally hide the strip on smaller screens. */
.hero-pack .hero-pack-coverage {
  margin: 12px 0 0 !important;
  padding-top: 11px;
  border-top: 1px solid rgba(255, 183, 127, .52);
  color: var(--cream) !important;
  font: 700 .88rem/1.35 Roboto, Arial, sans-serif !important;
}

.hero-pack .hero-pack-coverage sup { color: #ffb77f; }

@media (max-width: 850px) {
  .hero-pack .hero-pack-coverage {
    margin-top: 10px !important;
    padding: 10px 3px 0;
    font-size: .8rem !important;
  }

  .hero .hero-trust-strip {
    position: static;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: none;
    padding: 16px 10px;
    background: #001440;
    color: var(--cream);
    font: 700 .67rem/1.25 Montserrat, Arial, sans-serif;
  }

  .hero .hero-trust-strip span {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 0 7px;
    border-right: 1px solid rgba(255,255,255,.35);
    text-align: center;
  }

  .hero .hero-trust-strip svg { width: 28px; height: 28px; }
  .hero .hero-trust-strip .french-flag { width: 32px; height: 24px; }
}

/* Dedicated mobile strip within the visual: it avoids the desktop-only Hero layout. */
.hero-mobile-trust-strip { display: none; }

.pack .plugplay-callout {
  border-color: #00205b;
  background: #00205b;
  box-shadow: 0 14px 35px rgba(0, 32, 91, .18);
}

.pack .plugplay-callout h2,
.pack .plugplay-callout p,
.pack .plugplay-callout p strong { color: #fff; }

.pack .plugplay-callout h2 { font-size: 1rem; }
.pack .plugplay-callout p { font-size: 1rem; line-height: 1.6; }

.pack .plugplay-callout .plugplay-availability {
  margin-top: -4px;
  color: #ffca98;
  font-weight: 700;
}

.pack .plugplay-callout .plugplay-cta {
  border-color: #ff6e00;
  background: #ff6e00;
  color: #fff;
}

@media (max-width: 850px) {
  .hero .hero-trust-strip { display: none !important; }

  .hero-visual .hero-mobile-trust-strip {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 14px 8px 12px;
    background: linear-gradient(90deg, rgba(0, 20, 64, .32), rgba(0, 20, 64, .22));
    backdrop-filter: blur(1px);
    color: var(--cream);
    font: 700 .64rem/1.2 Montserrat, Arial, sans-serif;
  }

  .hero-mobile-trust-strip span {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 0 6px;
    border-right: 1px solid rgba(255,255,255,.35);
    text-align: center;
  }

  .hero-mobile-trust-strip span:last-child { border-right: 0; }
  .hero-mobile-trust-strip svg { width: 27px; height: 27px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  .hero-mobile-trust-strip .french-flag { width: 31px; height: 23px; stroke: none; }
  .hero-mobile-trust-strip .flag-blue { fill: #0055a4; }
  .hero-mobile-trust-strip .flag-white { fill: #fff; }
  .hero-mobile-trust-strip .flag-red { fill: #ef4135; }
  .hero-mobile-trust-strip .flag-border { fill: none; stroke: rgba(255,255,255,.9); stroke-width: 1.5; }
}

/* ── Lien "Vérifiez si votre logement est compatible" (Hero) ─────── */

.hero-pack-coverage button {
  appearance: none;
  padding: 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}

/* ── Questionnaire de compatibilité logement ──────────────────────── */

.compatibility-dialog {
  width: min(600px, calc(100% - 32px));
  padding: 0;
  border: 0;
  border-radius: 16px;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0, 20, 64, .38);
}

.compatibility-dialog::backdrop {
  background: rgba(0, 20, 64, .72);
  backdrop-filter: blur(3px);
}

.compat-body { padding: 22px 24px 26px; }

.compat-progress {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
  margin-bottom: 26px;
}

.compat-progress span {
  font: 700 .66rem Montserrat, Arial, sans-serif;
  color: #98a1ad;
  border-top: 3px solid #e2e5ea;
  padding-top: 7px;
  text-align: center;
  line-height: 1.25;
}

.compat-progress span.active { color: var(--navy); border-color: var(--orange); }

.compat-panel[hidden] { display: none; }

.compat-question {
  font: 800 1.15rem/1.3 Montserrat, Arial, sans-serif;
  color: var(--navy);
  margin: 0;
}

.compat-hint { color: var(--muted); font-size: .85rem; margin: 4px 0 0; }

.compat-choices {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 18px;
}

.compat-choice {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
  font-weight: 700;
  color: var(--ink);
  margin: 0;
  transition: border-color .15s, background-color .15s;
}

.compat-choice:hover { border-color: var(--orange); }
.compat-choice input { width: auto; margin: 0; accent-color: var(--orange); }
.compat-choice:has(input:checked) { border-color: var(--orange); background: #fff3e9; }

.compat-result {
  background: #eaf8f1;
  color: #075f38;
  border-radius: 12px;
  padding: 18px 20px;
  margin-bottom: 22px;
}

.compat-result strong { display: block; font: 800 1.05rem Montserrat, Arial, sans-serif; margin-bottom: 6px; }
.compat-result p { margin: 0; line-height: 1.5; }

.compatibility-form > .compat-recap-intro { font: 800 1rem Montserrat, Arial, sans-serif; color: var(--navy); margin: 0 0 10px; }

.compat-recap-list {
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.compat-recap-list li {
  padding-left: 24px;
  position: relative;
  color: var(--muted);
  font-size: .92rem;
}

.compat-recap-list li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 800; }

@media (max-width: 850px) {
  .compat-progress span { font-size: .58rem; }
  .compat-question { font-size: 1.05rem; }
}

/* ── Bloc cadeau déplacé du Hero vers "Prêt à sécuriser..." ────────── */
/* Rendu indépendant de l'ordre des enfants (ne dépend plus de p:last-child,
   fragile depuis l'ajout du bloc cadeau après le paragraphe d'intro). */

.landing-booking-cta .landing-booking-intro {
  margin: 0;
  color: #dbe6ff;
  font-size: 1.05rem;
}

.landing-booking-cta .reservation-gift {
  margin: 16px 0 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.landing-booking-cta .reservation-gift svg {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  fill: none;
  stroke: var(--orange);
  stroke-width: 2.5;
  stroke-linejoin: round;
}