/* ═══════════════════════════════════════════════════════════════════════
   MOTUS WEDDINGS — FORM SECTION TREATMENT
   Loaded LAST on every page that carries an inquiry form.
   Purpose: no Super 8 video behind forms, and the form itself reads as a
   lifted card on a flat charcoal panel so it cannot be missed.
   Sept 2026.
════════════════════════════════════════════════════════════════════════ */

/* ── 1. No video behind any form section ──────────────────────────────── */
.s8-bg-wrap > .s8-video-bg,
.s8-section > .s8-video-bg,
.contact-intro > .s8-video-bg,
.inquire-section > .s8-video-bg,
.s8-bg-wrap > video,
.inquire-section > video { display: none !important; }

/* ── 2. The panel the card sits on ────────────────────────────────────── */
.mq-section,
.s8-bg-wrap,
.s8-section,
.contact-intro.s8-section,
.inquire-section { background: #262728 !important; }

/* Section inside a wrapper stays see-through so the wrapper paints it once */
.s8-bg-wrap .mq-section,
.s8-section .mq-section,
.contact-intro .mq-section { background: transparent !important; }

/* Warm vignette so the card edge separates from the panel */
.mq-section::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse 70% 55% at 50% 0%, rgba(201,157,102,.12) 0%, transparent 72%),
    linear-gradient(180deg, rgba(0,0,0,.30) 0%, rgba(0,0,0,0) 38%, rgba(0,0,0,.40) 100%) !important;
}

.inquire-section { position: relative; overflow: hidden; }
.inquire-section::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70% 55% at 50% 0%, rgba(201,157,102,.12) 0%, transparent 72%),
    linear-gradient(180deg, rgba(0,0,0,.30) 0%, rgba(0,0,0,0) 38%, rgba(0,0,0,.40) 100%);
}

/* ── 3. The card ──────────────────────────────────────────────────────── */
.mq-wrap,
.inquire-inner {
  position: relative;
  z-index: 2;
  background: #121212 !important;
  border: 1px solid rgba(201,157,102,.30) !important;
  border-radius: 4px !important;
  padding: clamp(28px, 4.5vw, 56px) clamp(22px, 4.5vw, 52px) !important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.62),
    0 0 90px -24px rgba(201,157,102,.20) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden;
}

.mq-wrap { max-width: 820px !important; }
.inquire-inner { max-width: 760px !important; }

/* Film-leader hairline across the top edge */
.mq-wrap::before,
.inquire-inner::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 2px;
  background: linear-gradient(90deg, #A8D0D0 0%, #FAB617 48%, #C99D66 100%);
  z-index: 3;
}

/* ── 4. Pricing band — the first thing the eye lands on ──────────────── */
.mq-price {
  margin: 2px 0 26px !important;
  padding: 16px 20px;
  border-left: 3px solid #FAB617;
  background: rgba(250,182,23,.07);
  border-radius: 0 3px 3px 0;
}

.mq-price p {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: clamp(16px, 2.05vw, 20px) !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  color: #F0EBE0 !important;
  margin: 0 !important;
  letter-spacing: 0;
  text-transform: none;
}

.mq-price p + p { margin-top: 7px !important; }

.mq-price strong {
  font-weight: 700;
  color: #FAB617;
  font-size: 1.14em;
  white-space: nowrap;
}

/* Intro sentence under the pricing band */
.mq-sub,
.inquire-inner > p {
  margin-bottom: 34px !important;
}

/* ── 5. Submit button sits on the card, not the panel ────────────────── */
.mq-btn,
.btn-submit { box-shadow: 0 6px 24px rgba(201,157,102,.18); }

/* ── 6. Mobile ───────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .mq-wrap,
  .inquire-inner {
    border-radius: 3px !important;
    padding: 26px 18px !important;
  }
  .mq-price { padding: 14px 16px; }
}

/* ── 7. Error state for the blog-template form (no inline error text) ─── */
.form-group input.mq-err,
.form-group select.mq-err,
.form-group textarea.mq-err {
  border-color: rgba(220,80,60,.70) !important;
  box-shadow: 0 0 0 3px rgba(220,80,60,.10);
}
.terms-row.mq-tc-err span { color: rgba(240,140,120,.95) !important; }