/* p18b: "Book a consultation" card (home page). Gold on black, phone-first. */
.consult { padding: 0; margin: auto; border: 0; background: transparent; color: var(--text); width: min(640px, 100% - 2rem); max-width: none; max-height: calc(100dvh - 2rem); overflow: visible; }
.consult:not([open]) { display: none; }
.consult::backdrop { background: rgba(4, 3, 2, .78); backdrop-filter: blur(6px); }
.consult.is-fallback { position: fixed; inset: 0; z-index: 100; display: block; }
.consult-overlay { position: fixed; inset: 0; z-index: 99; background: rgba(4, 3, 2, .78); }
html.consult-lock, html.consult-lock body { overflow: hidden; }
.consult-card { position: relative; max-height: calc(100dvh - 2rem); overflow-y: auto; overscroll-behavior: contain; padding: 1.9rem 2.1rem 1.6rem;
  background: radial-gradient(30rem 18rem at 20% 0%, rgba(227,181,79,.14), transparent 70%), var(--ink);
  border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 30px 90px rgba(0,0,0,.7), 0 0 60px rgba(227,181,79,.12); }
.consult-close { position: absolute; top: .6rem; right: .6rem; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line-soft); border-radius: 50%; background: rgba(227,181,79,.06); color: var(--gold-hi); font-size: 1.7rem; line-height: 1; cursor: pointer; }
.consult-close:hover { border-color: var(--gold); background: rgba(227,181,79,.14); }
.consult .kicker { padding-right: 3rem; }
.consult-title { margin: .7rem 0 0; padding-right: 2.5rem; font-size: clamp(1.6rem, 4.6vw, 2.2rem); font-weight: 900; line-height: 1.05; letter-spacing: -.02em; }
.consult-title:focus { outline: none; }
.consult-desc { margin: .7rem 0 0; color: var(--muted); font-size: 1rem; }
.consult-desc a, .consult-alt a, .consult-status a { color: var(--gold); text-underline-offset: 3px; font-weight: 700; white-space: nowrap; }
.consult-form { margin-top: 1.1rem; display: grid; gap: .9rem; }
.consult-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.consult-field { display: grid; gap: .35rem; min-width: 0; }
.consult-field label { font-family: var(--display); font-weight: 700; font-size: .95rem; color: var(--gold-hi); }
.consult-field .req { color: var(--gold); }
.consult-field .opt { font-family: var(--sans); font-weight: 400; color: var(--muted); font-size: .85rem; }
.consult-field input, .consult-field textarea { width: 100%; min-height: 48px; padding: .75rem .9rem; font: inherit; font-size: 16px; color: var(--text);
  background: rgba(255,255,255,.03); border: 1.5px solid var(--line-soft); border-radius: 4px; transition: border-color .15s, background .15s; }
.consult-field textarea { min-height: 96px; resize: vertical; }
.consult-field input::placeholder, .consult-field textarea::placeholder { color: rgba(169,158,134,.6); }
.consult-field input:focus, .consult-field textarea:focus { outline: none; border-color: var(--gold); background: rgba(227,181,79,.06); box-shadow: 0 0 0 3px rgba(227,181,79,.18); }
.consult-field [aria-invalid="true"] { border-color: #ff8a73; }
.consult-err { margin: 0; color: #ffb4a3; font-size: .9rem; }
.consult-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.consult-status { margin: 0; padding: .8rem 1rem; border: 1px solid rgba(255,138,115,.5); border-radius: 4px; background: rgba(255,138,115,.08); color: #ffd6cc; font-size: .98rem; }
.consult-submit { width: 100%; cursor: pointer; border: 0; }
.consult-submit[disabled] { opacity: .7; cursor: progress; transform: none; }
.consult-alt { margin: 0; text-align: center; color: var(--muted); font-size: .95rem; }
.consult-done { padding-top: .4rem; }
.consult-done .btn { margin-top: 1.4rem; width: 100%; cursor: pointer; background: transparent; }
@media (max-width: 600px) {
  .consult { width: 100%; max-height: 100dvh; height: 100dvh; margin: 0; }
  .consult-card { min-height: 100dvh; max-height: 100dvh; border-radius: 0; border-width: 0; padding: 1.4rem 1.15rem calc(1.4rem + env(safe-area-inset-bottom)); }
  .consult-row { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: no-preference) {
  .consult[open] .consult-card { animation: consult-in .18s ease-out; }
  @keyframes consult-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
}