/*
 * Carbon Tuning — quote.css
 * The VRM "instant estimate" quote widget that sits above the bottom CTA.
 * Markup lives in the Contact Form 7 "Quote Request" form template + the
 * cta-quote.php partial. Behaviour in assets/js/quote.js.
 */

/* cta-section: background image + dark overlay */
.cta-section{position:relative;overflow:hidden;padding:5rem 0 4.5rem}
.cta-section::before{content:"";position:absolute;inset:0;background:url(../img/mechanic.webp) center/cover no-repeat;z-index:0}
.cta-section::after{content:"";position:absolute;inset:0;background:rgba(10,10,11,.78);z-index:0}
.cta-wrap{position:relative;z-index:1}

/* CTA box — glass, sits in front of the vrm strip */
.cta-section .cta{position:relative;z-index:2;overflow:hidden;background:rgba(16,7,12,.58)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.14)!important;padding:clamp(3.5rem,5vw,4.5rem) clamp(2rem,5vw,4rem)}

/* VRM strip — sits behind the CTA, slides up from underneath */
.vq-card{position:relative;z-index:1;max-width:540px;margin:0 auto -3.5rem;background:rgba(18,18,22,.84);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--line-2);border-radius:22px;padding:1.6rem 1.8rem 5rem;box-shadow:0 30px 80px -28px rgba(0,0,0,.85)}

.vq-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}
.vq-head h3{font-size:1.3rem}
.vq-head p{font-size:.86rem;color:var(--muted);margin-top:.2rem}
.vq-steps{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.vq-steps b{color:var(--magenta)}

/* steps */
.vq-step{display:none}
.vq-step.is-active{display:block;animation:vqfade .4s var(--ease)}
@keyframes vqfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* number plate */
.plate{display:inline-flex;align-items:stretch;border-radius:9px;overflow:hidden;border:2px solid #0b0b0b;box-shadow:0 4px 14px rgba(0,0,0,.4);font-family:"Arial Narrow",Arial,sans-serif}
.plate__gb{background:#063298;color:#fff;display:flex;align-items:center;justify-content:center;padding:.5rem .6rem;font-weight:700;font-size:.74rem;letter-spacing:.04em}
.plate__reg{background:#FFD400!important;border:0!important;outline:0;color:#111!important;font-weight:800;font-size:1.7rem;letter-spacing:.06em;text-transform:uppercase;padding:.35rem .8rem!important;width:100%;text-align:center;border-radius:0!important;min-height:auto!important}
.plate__reg::placeholder{color:#9a8400}
.vq-platerow{display:flex;gap:1.2rem;align-items:stretch;width:100%}
.vq-platerow .plate{flex:1}
.vq-platerow .wpcf7-form-control-wrap{flex:1;display:flex}
.vq-platerow .btn{flex:none;white-space:nowrap}
.vq-hint{font-size:.8rem;color:var(--dim);margin-top:1.3rem}
[data-vq-step="1"]{text-align:center}
[data-vq-step="1"] .vq-platerow{justify-content:center}

/* step 2 */
.vq-regchip{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.74rem;color:var(--muted);margin-bottom:1rem}
.vq-regchip b{background:#FFD400;color:#111;font-weight:800;padding:.15rem .5rem;border-radius:4px;letter-spacing:.05em;font-family:"Arial Narrow",Arial,sans-serif}
.est{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin-bottom:.7rem}
.est .e{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.8rem}
.est .e .k{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.est .e .v{font-family:var(--display);font-weight:600;font-size:1.25rem;margin-top:.2rem}
.est .e .v em{font-style:normal;color:var(--magenta);font-size:.7rem}
.est-note{font-size:.72rem;color:var(--dim);margin-bottom:1.1rem}

/* fields (CF7) */
.vq-card .vq-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.vq-card .field{margin-bottom:.7rem}
.vq-card .field>label{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.vq-card .field .req{color:var(--magenta)}
.vq-card input,.vq-card textarea{width:100%;background:#0d0d10;border:1px solid var(--line-2);border-radius:10px;padding:.7rem .85rem;color:var(--text);font-family:var(--body);font-size:.95rem}
.vq-card input:focus,.vq-card textarea:focus{outline:none;border-color:var(--magenta)}
.vq-card textarea{min-height:74px;resize:vertical}
.vq-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.8rem;color:var(--muted);margin:.3rem 0 1rem}
.vq-consent .wpcf7-list-item{margin:0}
.vq-consent a{color:var(--magenta)}
.vq-card .wpcf7-submit{width:100%;justify-content:center;background:var(--magenta);color:#fff;font-weight:600;border:0;border-radius:999px;padding:.95rem 1.5rem;cursor:pointer;font-family:var(--body);font-size:.98rem;transition:background .25s,transform .25s var(--ease)}
.vq-card .wpcf7-submit:hover{background:#e158a8;transform:translateY(-2px)}
.vq-next.btn{cursor:pointer}
.vq-back{background:none;border:0;color:var(--dim);font-size:.8rem;cursor:pointer;margin-top:.7rem;font-family:var(--body)}
.vq-back:hover{color:var(--muted)}
.vq-card .wpcf7-response-output{border-radius:10px;font-size:.85rem;margin:.6rem 0 0!important}
.vq-card .wpcf7-not-valid-tip{color:#ff9bce;font-size:.75rem}

/* CF7 strips default <p> margins inside our layout */
.vq-card form p{margin:0}

@media(max-width:560px){
  .vq-card .vq-grid{grid-template-columns:1fr}
  .vq-platerow{flex-direction:column}
}