/* ══════════════════════════════════════════════════════════════
   Lux4Rides — Custom Transportation Quote form (.l4q-*)  2026-11-02
   Light, compact, premium. Scoped; safe on any page.
   Palette: ink #14130F · body #3A3832 · muted #6E6A61 · hairline #E6E3DC
   cream #FAF9F6 · gold text #7A5F22 (6:1 on white) · gold fill #D4AF37
   ══════════════════════════════════════════════════════════════ */
.l4q{--q-ink:#14130F;--q-text:#3A3832;--q-muted:#6E6A61;--q-line:#E6E3DC;--q-line-2:#CFCAC0;--q-cream:#FAF9F6;--q-gold:#7A5F22;--q-gold-dark:#5C4718;--q-gold-fill:#D4AF37;--q-ok:#1B945A;--q-err:#B3261E;--q-r:12px;--q-r-lg:18px;
  font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:var(--q-text);line-height:1.55;-webkit-font-smoothing:antialiased}
.l4q *,.l4q *::before,.l4q *::after{box-sizing:border-box}
.l4q [hidden]{display:none!important}
.l4q :focus-visible{outline:3px solid rgba(122,95,34,.45);outline-offset:2px;border-radius:8px}

.l4q-card{background:#fff;border:1px solid var(--q-line);border-radius:var(--q-r-lg);box-shadow:0 18px 50px -30px rgba(20,19,15,.35);padding:26px 22px;max-width:760px;margin:0 auto;position:relative}
@media (min-width:720px){.l4q-card{padding:34px 36px}}
.l4q-eyebrow{margin:0 0 6px;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--q-gold)}
.l4q-title{margin:0 0 8px;font-family:'Playfair Display',Georgia,serif;font-weight:600;font-size:clamp(24px,4.6vw,32px);line-height:1.15;letter-spacing:-.3px;color:var(--q-ink);text-wrap:balance}
.l4q-lead{margin:0 0 22px;font-size:15px;color:var(--q-muted);max-width:60ch}

.l4q-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:640px){.l4q-grid--2{grid-template-columns:1fr 1fr}}
.l4q-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.l4q-label{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--q-muted)}
.l4q-label em{font-style:normal;color:var(--q-err)}
.l4q-opt{font-weight:500;text-transform:none;letter-spacing:0;color:var(--q-muted)}
.l4q-input,.l4q-select,.l4q-textarea{width:100%;font:inherit;font-size:16px;color:var(--q-ink);background:#fff;border:1px solid var(--q-line-2);border-radius:var(--q-r);padding:12px 14px;min-height:48px;transition:border-color .15s,box-shadow .15s}
.l4q-input:focus,.l4q-select:focus,.l4q-textarea:focus{border-color:var(--q-gold);box-shadow:0 0 0 3px rgba(122,95,34,.14);outline:none}
.l4q-field.is-error .l4q-input,.l4q-field.is-error .l4q-textarea,.l4q-field.is-error .l4q-select{border-color:var(--q-err);box-shadow:0 0 0 3px rgba(179,38,30,.12)}
.l4q-err{font-size:13px;color:var(--q-err);margin:0}
.l4q-err[hidden]{display:none}
.l4q-hint{margin:0;font-size:12.5px;color:var(--q-muted)}
.l4q-select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236E6A61' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}

/* section headings inside the card */
.l4q-sec{margin:24px 0 10px}
.l4q-h{margin:0 0 2px;font-size:16px;font-weight:700;color:var(--q-ink)}
.l4q-sub{margin:0;font-size:13px;color:var(--q-muted)}

/* date mode pills */
.l4q-pills{display:flex;flex-wrap:wrap;gap:8px}
.l4q-pill{position:relative}
.l4q-pill input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.l4q-pill span{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 14px;border:1px solid var(--q-line-2);border-radius:999px;font-size:14px;font-weight:600;color:var(--q-text);background:#fff;transition:all .15s}
.l4q-pill input:checked+span{background:var(--q-ink);border-color:var(--q-ink);color:#fff}
.l4q-pill input:focus-visible+span{outline:3px solid rgba(122,95,34,.45);outline-offset:2px}
.l4q-dates{display:grid;grid-template-columns:1fr;gap:12px;margin-top:12px}
@media (min-width:560px){.l4q-dates{grid-template-columns:1fr 1fr}}
.l4q-ifield{position:relative}
.l4q-ifield .l4q-input{padding-left:42px}
.l4q-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--q-muted);pointer-events:none}

/* vehicle cards */
.l4q-veh{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:640px){.l4q-veh{grid-template-columns:1fr 1fr}}
.l4q-vcard{position:relative;display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:1px solid var(--q-line-2);border-radius:var(--q-r);background:#fff;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;min-height:56px}
.l4q-vcard:hover{border-color:var(--q-gold)}
.l4q-vcard input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.l4q-check{flex:none;width:22px;height:22px;margin-top:1px;border:1.5px solid var(--q-line-2);border-radius:7px;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:#fff;transition:all .15s}
.l4q-check svg{width:14px;height:14px;opacity:0;transform:scale(.6);transition:all .15s}
.l4q-vcard input:checked~.l4q-check{background:var(--q-gold);border-color:var(--q-gold)}
.l4q-vcard input:checked~.l4q-check svg{opacity:1;transform:scale(1)}
.l4q-vcard.is-on{border-color:var(--q-gold);background:#fcfaf4;box-shadow:0 0 0 3px rgba(122,95,34,.10)}
.l4q-vcard input:focus-visible~.l4q-check{outline:3px solid rgba(122,95,34,.45);outline-offset:2px}
.l4q-vtext{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.l4q-vname{font-size:14.5px;font-weight:700;color:var(--q-ink);line-height:1.3}
.l4q-vdesc{font-size:12.5px;color:var(--q-muted);line-height:1.35}
.l4q-qty{display:none;align-items:center;gap:6px;margin-top:8px}
.l4q-vcard.is-on .l4q-qty{display:inline-flex}
.l4q-qty label{font-size:12px;color:var(--q-muted);font-weight:600}
.l4q-qty input{width:64px;min-height:34px;padding:4px 8px;font:inherit;font-size:14px;border:1px solid var(--q-line-2);border-radius:8px;text-align:center}
.l4q-cond{margin-top:12px;padding:14px;border:1px dashed var(--q-line-2);border-radius:var(--q-r);background:var(--q-cream)}

/* textarea */
.l4q-textarea{resize:none;min-height:112px;line-height:1.55;overflow:hidden}
.l4q-count{text-align:right;font-size:12px;color:var(--q-muted);margin:0}
.l4q-count.is-warn{color:var(--q-err)}

/* submit */
.l4q-actions{margin-top:22px}
.l4q-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:54px;padding:0 24px;border:0;border-radius:999px;background:var(--q-ink);color:#fff;font:inherit;font-size:15.5px;font-weight:700;letter-spacing:.02em;cursor:pointer;transition:transform .12s,background .15s,opacity .15s}
.l4q-btn:hover{background:#000}
.l4q-btn:active{transform:translateY(1px)}
.l4q-btn[disabled]{opacity:.65;cursor:progress}
@media (min-width:640px){.l4q-btn{width:auto;min-width:300px}}
.l4q-note{margin:12px 0 0;font-size:12.5px;color:var(--q-muted);display:flex;gap:8px;align-items:flex-start}
.l4q-note svg{flex:none;width:15px;height:15px;margin-top:2px;color:var(--q-ok)}
.l4q-spin{width:16px;height:16px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:l4qspin .7s linear infinite}
@keyframes l4qspin{to{transform:rotate(360deg)}}
.l4q-alert{margin:0 0 16px;padding:12px 14px;border-radius:var(--q-r);font-size:14px;background:#fdf2f2;border:1px solid rgba(179,38,30,.25);color:var(--q-err)}
.l4q-alert[hidden]{display:none}
.l4q-hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}

/* confirmation */
.l4q-done{text-align:center;padding:10px 0 4px}
.l4q-done-ico{width:66px;height:66px;border-radius:50%;background:rgba(27,148,90,.12);color:var(--q-ok);display:inline-flex;align-items:center;justify-content:center;margin-bottom:14px}
.l4q-done-ico svg{width:30px;height:30px}
.l4q-done h3{margin:0 0 10px;font-family:'Playfair Display',Georgia,serif;font-size:clamp(22px,4.4vw,30px);font-weight:600;color:var(--q-ink)}
.l4q-done p{margin:0 0 12px;font-size:15px;color:var(--q-text);max-width:56ch;margin-left:auto;margin-right:auto}
.l4q-ref{display:inline-block;margin:6px 0 14px;padding:8px 16px;border:1px solid var(--q-line);border-radius:999px;background:var(--q-cream);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:15px;font-weight:700;letter-spacing:.06em;color:var(--q-ink)}
.l4q-done .l4q-hint{margin-top:6px}
@media (prefers-reduced-motion:reduce){.l4q *{transition:none!important;animation:none!important}}