/* SEO: modal titles keep their visual weight without polluting page H2 hierarchy. */
.quote-client-gate__title,
.quote-confirmation__title {
  margin: 0;
  color: #fff;
  font-family: "Teko", "Rajdhani", Arial, sans-serif;
  font-weight: 700;
  line-height: .9;
  letter-spacing: .035em;
  text-transform: uppercase;
  -webkit-text-stroke: .32px currentColor;
  text-shadow: .35px 0 0 currentColor, 0 .35px 0 currentColor, 0 14px 28px rgba(0,0,0,.42);
}

.quote-client-gate__title {
  font-size: clamp(44px, 5vw, 66px);
}

.quote-confirmation__title {
  margin-bottom: 14px;
  font-size: clamp(34px, 4vw, 52px);
}

@media (max-width: 700px) {
  .quote-client-gate__title {
    font-size: clamp(36px, 12vw, 50px);
  }
}

@media (max-width: 700px) {
  #devisModal.modal.is-open {
    align-items: stretch !important;
    padding: 6px !important;
    overflow: hidden !important;
  }

  #devisModal .modal__panel.modal__panel--quote {
    width: calc(100vw - 12px) !important;
    height: calc(100dvh - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    overflow: hidden !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-layout {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-aside {
    min-height: 0 !important;
    padding: 12px 58px 8px 14px !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-aside__title {
    margin-bottom: 4px !important;
    font-size: clamp(26px, 7.8vw, 34px) !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-aside p {
    display: none !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-back {
    min-height: 30px !important;
    margin-top: 6px !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-main {
    height: 100% !important;
    min-height: 0 !important;
    padding: 8px 10px 10px !important;
    overflow: hidden !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form-main > .quote-wizard-step:not([hidden]) {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form--grav .form-wrapper {
    min-height: 0 !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form--grav form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px 8px !important;
    height: auto !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-bottom: 2px !important;
    scrollbar-width: none !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile] .quote-form--grav form::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
  }

  #devisModal .quote-form--grav .form-field,
  #devisModal .quote-form--grav .form-group,
  #devisModal .quote-form--grav .buttons {
    min-width: 0 !important;
    margin: 0 !important;
  }

  #devisModal .quote-form--grav label {
    min-height: 0 !important;
    margin-bottom: 2px !important;
    font-size: 10px !important;
    line-height: 1.05 !important;
  }

  #devisModal .quote-form--grav input,
  #devisModal .quote-form--grav select {
    min-height: 32px !important;
    padding: 6px 8px !important;
    font-size: 12.5px !important;
    line-height: 1.15 !important;
  }

  #devisModal .quote-form--grav textarea {
    grid-column: 1 / -1 !important;
    min-height: 44px !important;
    max-height: 52px !important;
    padding: 7px 8px !important;
    font-size: 12.5px !important;
    resize: none !important;
  }

  #devisModal .quote-form--grav .form-field:has(textarea),
  #devisModal .quote-form--grav .form-group:has(textarea),
  #devisModal .quote-form--grav .form-field:has(.turnstile-container),
  #devisModal .quote-form--grav .form-group:has(.turnstile-container),
  #devisModal .quote-form--grav .form-field:has([name="data[rgpd]"]),
  #devisModal .quote-form--grav .form-group:has([name="data[rgpd]"]),
  #devisModal .quote-form--grav .buttons {
    grid-column: 1 / -1 !important;
  }

  #devisModal .form-field:has(.turnstile-container),
  #devisModal .form-group:has(.turnstile-container) {
    order: 10 !important;
    min-height: 64px !important;
    padding: 0 !important;
  }

  #devisModal .turnstile-container {
    min-height: 64px !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  #devisModal .turnstile-container iframe {
    max-width: 100% !important;
  }

  #devisModal .form-field:has([name="data[rgpd]"]),
  #devisModal .form-group:has([name="data[rgpd]"]) {
    order: 11 !important;
    min-height: 0 !important;
    padding: 7px 9px !important;
  }

  #devisModal .form-field:has([name="data[rgpd]"]) label,
  #devisModal .form-group:has([name="data[rgpd]"]) label {
    font-size: 10.5px !important;
    line-height: 1.22 !important;
  }

  #devisModal .buttons {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 25 !important;
    order: 12 !important;
    padding-top: 8px !important;
    background: linear-gradient(180deg, rgba(5, 8, 11, 0), rgba(5, 8, 11, .96) 28%) !important;
  }

  #devisModal .buttons button,
  #devisModal .buttons .button,
  #devisModal button[type="submit"] {
    width: 100% !important;
    min-height: 42px !important;
    font-size: 12px !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile="particulier"] .quote-tax-credit {
    grid-template-columns: 66px minmax(0, 1fr) !important;
    gap: 8px !important;
    margin-bottom: 6px !important;
    padding: 8px !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile="particulier"] .quote-tax-credit__badge {
    min-height: 54px !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile="particulier"] .quote-tax-credit__badge strong {
    font-size: 32px !important;
  }

  #devisModal .quote-form-wrap--organized[data-client-profile="particulier"] .quote-tax-credit h3 {
    font-size: 15px !important;
    line-height: 1 !important;
  }
}

@media (max-width: 360px) {
  #devisModal .turnstile-container {
    min-height: 58px !important;
    justify-content: flex-start !important;
  }

  #devisModal .turnstile-container iframe {
    transform: scale(.88) !important;
    transform-origin: left top !important;
  }
}
