/* ============================================================
   NØVRA Interiors — Hero with Call / WhatsApp buttons + quote form
   Used on every page hero. Mobile first.
   ============================================================ */
.hero-split { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; align-items: center; }
@media (min-width: 992px) {
  .hero-split { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 3.5rem; }
}
.hero-split.no-form { grid-template-columns: minmax(0, 1fr); max-width: 52rem; margin: 0 auto; text-align: center; }
.hero-copy { text-align: left; min-width: 0; }
.no-form .hero-copy { text-align: center; }
.hero-copy .kicker { letter-spacing: .28em; line-height: 1.6; }
.hero-copy h1 { font-size: clamp(1.9rem, 4.6vw, 3.1rem); line-height: 1.08; overflow-wrap: break-word; }
.hero-copy > p { margin-left: 0; margin-right: 0; max-width: 40rem; }
.no-form .hero-copy > p { margin-left: auto; margin-right: auto; }

/* Call Now + WhatsApp Us */
.hero-copy .hero-buttons { justify-content: flex-start; margin-top: 1.75rem; gap: .75rem; flex-wrap: nowrap; }
.no-form .hero-copy .hero-buttons { justify-content: center; }
.hero-copy .hero-buttons a { flex: 0 1 auto; white-space: nowrap; }
.btn-whatsapp { border-color: color-mix(in oklch, #25d366 55%, transparent); }
.btn-whatsapp svg { color: #25d366; }
.btn-whatsapp:hover { border-color: #25d366; color: #25d366; }
@media (max-width: 480px) {
  .hero-copy .hero-buttons { flex-direction: row; gap: .5rem; }
  .hero-copy .hero-buttons a { flex: 1 1 0; width: auto; justify-content: center; padding: .8rem .5rem; letter-spacing: .1em; font-size: .7rem; }
}

/* Quote form card */
.hero-form-card {
  min-width: 0; width: 100%; max-width: 34rem; justify-self: end;
  border-radius: var(--radius, .5rem);
  border: 1px solid color-mix(in oklch, var(--gold) 40%, transparent);
  background: color-mix(in oklch, var(--background) 82%, transparent);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  padding: 1.5rem; box-shadow: 0 20px 60px rgba(0, 0, 0, .45);
}
@media (min-width: 640px) { .hero-form-card { padding: 1.9rem; } }
@media (max-width: 991px) { .hero-form-card { justify-self: stretch; max-width: none; } }
.hero-form-title { font-family: var(--font-display); font-size: 1.6rem; line-height: 1.15; color: var(--gold); margin: 0 0 .25rem; }
.hero .hero-form-card .hero-form-sub { font-size: .85rem; line-height: 1.45; color: var(--muted-foreground); margin: 0 0 1.1rem; max-width: none; }
.hero-form-card .hf-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
@media (min-width: 480px) { .hero-form-card .hf-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.hero-form-card .hf-full { grid-column: 1 / -1; }
.hero-form-card .form-input, .hero-form-card .form-select, .hero-form-card .form-textarea { padding: .7rem .9rem; font-size: .9rem; margin: 0; }
.hero-form-card .form-textarea { min-height: 4.5rem; }
.hero-form-card .form-select { appearance: auto; }
.hero-form-card .form-submit { margin-top: 1rem; width: 100%; border: 1px solid var(--gold); }
.hero-form-card .form-status { margin-top: .75rem; min-height: 1.2rem; }
.hero .hero-form-card .hero-form-note { margin: .75rem 0 0; font-size: .72rem; color: var(--muted-foreground); text-align: center; max-width: none; }
.hero-form-card input, .hero-form-card select, .hero-form-card textarea { font-size: 16px; } /* stops iOS zoom on focus */
@media (min-width: 992px) { .hero-form-card input, .hero-form-card select, .hero-form-card textarea { font-size: .9rem; } }