/**
 * Ferbeatz canonical Inquiry frontend (Sprint 2.2B-5).
 *
 * Additive only: the form step reuses .fbz-simple-contact / .fbz-contact-grid / .fbz-contact-field /
 * .fbz-contact-actions / .fbz-contact-status / .fbz-email-delay (css/fbz-booking.css) and the OTP/success
 * steps reuse .fbz-code-inputs / .fbz-code-resend / .fbz-resend-disabled / .fbz-verified-premium and
 * friends (same file) for visual consistency with the Booking Wizard's own OTP step. Only the bits that
 * don't already exist — the OTP step's own header/card shell — are defined here.
 */

.fbz-inquiry {
  max-width: 860px;
  margin: 0 auto;

  /* Sprint 2.2B-5: the .fbz-simple-contact / .fbz-contact-field card styling this component reuses
     (css/fbz-booking.css) was written expecting these vars from its .fbz-booking-landing page wrapper,
     which only exists on the Booking page. Redeclaring the same values here makes the component
     self-contained so it renders identically on the Homepage, which has no such wrapper. */
  --fbz-lp-radius: 22px;
  --fbz-lp-card-bg: rgba(255, 255, 255, 0.04);
  --fbz-lp-card-border: rgba(255, 255, 255, 0.10);
  --fbz-lp-input-bg: rgba(255, 255, 255, 0.05);
  --fbz-lp-input-border: rgba(255, 255, 255, 0.12);
}

.fbz-inquiry__header {
  margin-bottom: 3rem;
}

/* Sprint 2.2C: shown instead of .fbz-inquiry__header when heading="false" (the Homepage, which already
   renders its own SEO sec-tag/sec-title above this component). A premium, self-contained feature callout
   for the Instant Quote / online estimate — visually distinct from the form below it (tinted card, not a
   plain text link), restrained accent (a thin border/glow, not a loud fill), no animation, and scoped
   entirely under .fbz-inquiry so it can never bleed into or be affected by Booking Wizard CSS. */
.fbz-inquiry__quote-callout {
  text-align: center;
  background: linear-gradient(180deg, rgba(253, 235, 25, 0.07), rgba(253, 235, 25, 0.02));
  border: 1px solid rgba(253, 235, 25, 0.35);
  border-radius: 18px;
  padding: 22px 24px;
  margin-bottom: 2.5rem;
  box-shadow: 0 8px 30px rgba(253, 235, 25, 0.06);
}

.fbz-inquiry__quote-callout-eyebrow {
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent, #fdeb19);
  margin-bottom: 8px;
}

.fbz-inquiry__quote-callout-copy {
  font-family: var(--font-body);
  color: var(--text-gray, #94a3b8);
  font-size: 0.9rem;
  line-height: 1.5;
  max-width: 420px;
  margin: 0 auto 16px auto;
}

.fbz-inquiry__quote-callout-cta {
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 800;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #0b1024;
  background: var(--accent, #fdeb19);
  text-decoration: none;
  border: 2px solid var(--accent, #fdeb19);
  border-radius: 999px;
  padding: 11px 26px;
  transition: box-shadow 0.15s ease;
}

.fbz-inquiry__quote-callout-cta:hover {
  box-shadow: 0 4px 18px rgba(253, 235, 25, 0.35);
}

.fbz-inquiry__quote-callout-cta:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

@media (max-width: 480px) {
  .fbz-inquiry__quote-callout {
    padding: 18px 16px;
  }
}

.fbz-inquiry-otp {
  background: var(--fbz-lp-card-bg);
  border: 1px solid var(--fbz-lp-card-border);
  border-radius: var(--fbz-lp-radius);
  padding: clamp(24px, 4vw, 44px);
  backdrop-filter: blur(8px);
  text-align: center;
}

.fbz-inquiry-otp__header h3 {
  font-family: var(--font-head);
  font-size: 1.5rem;
  color: #fff;
  margin: 0 0 8px 0;
}

.fbz-inquiry-otp__header p {
  font-family: var(--font-body);
  color: var(--text-gray, #94a3b8);
  font-size: 0.95rem;
  margin: 0 0 26px 0;
}

.fbz-inquiry-otp__header strong {
  color: var(--accent, #fdeb19);
  font-weight: 700;
}

.fbz-inquiry-otp .fbz-contact-actions {
  justify-content: center;
}

/* Sprint 2.2C: locked while a verification request is in flight (js/fbz-inquiry.js setBusy()) — a visible,
   non-animated cue that something is happening, distinct from the Wizard's own OTP cells (.fbz-code-inputs
   is shared CSS only; this rule is scoped under .fbz-inquiry so it never touches the Wizard's markup). */
.fbz-inquiry .fbz-code-inputs input:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.fbz-inquiry-success {
  background: var(--fbz-lp-card-bg);
  border: 1px solid var(--fbz-lp-card-border);
  border-radius: var(--fbz-lp-radius);
  backdrop-filter: blur(8px);
}

.fbz-inquiry-success .fbz-verified-subtitle,
.fbz-inquiry-success p {
  font-family: var(--font-body);
  color: var(--text-gray, #94a3b8);
  font-size: 1rem;
  line-height: 1.6;
  max-width: 480px;
  margin: 0 auto 26px auto;
}

.fbz-inquiry-success .view-all-btn {
  margin: 0 auto;
}

@media (max-width: 480px) {
  .fbz-inquiry-otp,
  .fbz-inquiry-success {
    padding: 28px 18px;
  }
}