/* Used Car Parts World — deep blue + lime */
:root{
  --ink:#14243a; --blue:#153a63; --deep:#0f2e4f; --lime:#9adb2e; --lime-ink:#15300a;
  --bg:#f5f8fb; --paper:#ffffff; --mute:#5b6b7d; --line:#dbe4ee;
  --shadow-sm:0 3px 12px rgba(21,58,99,.13);
  --r:14px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Public Sans',-apple-system,'Segoe UI',sans-serif;background:var(--bg);color:var(--ink);line-height:1.5;padding-bottom:76px;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrapx{max-width:1080px;margin:0 auto;padding:0 18px;}
h1,h2,h3,.wordmark{font-family:'Archivo Narrow','Public Sans',sans-serif;}

/* ---------- header ---------- */
.topline{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40;}
.topline .wrapx{display:flex;align-items:center;justify-content:space-between;height:58px;position:relative;}
.wordmark{font-size:19px;font-weight:700;color:var(--blue);letter-spacing:.2px;}
.wordmark span{color:#4a7d0e;}
nav.links{display:flex;align-items:center;gap:22px;font-size:14px;font-weight:600;color:var(--mute);}
nav.links a:hover{color:var(--blue);}
.callbtn{background:var(--blue);color:#eef4fb;padding:9px 16px;border-radius:10px;font-weight:800;display:flex;align-items:center;gap:7px;}
.callbtn .ph{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.burger span{display:block;width:22px;height:2.5px;background:var(--blue);margin:4px 0;border-radius:2px;}

/* ---------- ring animation (unique keyframes) ---------- */
.ring-i{display:inline-block;animation:ucpwRing 1.7s ease-in-out infinite;transform-origin:50% 15%;}
@keyframes ucpwRing{0%,68%,100%{transform:rotate(0)}72%{transform:rotate(-14deg)}76%{transform:rotate(11deg)}80%{transform:rotate(-8deg)}84%{transform:rotate(5deg)}88%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.ring-i{animation:none;}}

/* ---------- hero ---------- */
.heroband{background:linear-gradient(160deg,var(--blue),var(--deep));color:#eef4fb;padding:34px 0 40px;}
.heroband .wrapx{display:grid;gap:24px;}
.hero-kick{font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--lime);margin-bottom:10px;}
.heroband h1{font-size:31px;line-height:1.14;margin-bottom:10px;}
.hero-sub{font-size:15px;color:#c6d6e8;margin-bottom:16px;max-width:46ch;}
.hero-points{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;font-weight:600;color:#dbe8f6;}
.hero-points li::before{content:"\2713";color:var(--lime);font-weight:800;margin-right:6px;}

/* ---------- quote form ---------- */
.quotewrap{padding:6px 0 10px;}
.heroband .quotewrap{padding:0;}
.quotecardx{background:var(--paper);border-radius:18px;padding:22px 18px;box-shadow:var(--shadow-sm);max-width:520px;}
.heroband .quotecardx{background:var(--deep);box-shadow:none;}
.q-head{font-size:20px;margin-bottom:4px;}
.heroband .q-head{color:#eef4fb;}
.q-sub{font-size:13px;color:var(--mute);margin-bottom:14px;}
.heroband .q-sub{color:#a9c0d8;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.field{margin-bottom:10px;position:relative;}
.field label{display:block;font-size:11.5px;font-weight:700;margin-bottom:4px;color:var(--mute);}
.heroband .field label{color:#a9c0d8;}
.field label em{font-style:normal;font-weight:400;opacity:.7;}
.field input,.field select{width:100%;height:44px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;font-size:15px;background:#fff;color:var(--ink);font-family:inherit;}
.field input:focus,.field select:focus{outline:none;border-color:var(--blue);}
.field.err input,.field.err select{border-color:#d0342c;background:#fdf0ef;}
.submit{width:100%;height:50px;border:none;border-radius:11px;background:var(--lime);color:var(--lime-ink);font-size:16px;font-weight:800;cursor:pointer;font-family:inherit;margin-top:4px;}
.submit:hover{filter:brightness(1.05);}
.submit:disabled{opacity:.6;}
.formok{margin-top:10px;font-size:13px;color:#2e7d32;font-weight:600;}
.q-note{margin-top:9px;font-size:11.5px;color:var(--mute);text-align:center;}
.heroband .q-note{color:#a9c0d8;}

/* ---------- unit cards ---------- */
.stockzone{padding:34px 0 26px;}
.zone-kick{font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:#4a7d0e;margin-bottom:4px;}
.zone-title{font-size:24px;color:var(--blue);margin-bottom:14px;}
.unit-tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;}
.unit-tabs button{border:1.5px solid var(--line);background:var(--paper);color:var(--mute);padding:8px 16px;border-radius:999px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;}
.unit-tabs button.on{background:var(--blue);border-color:var(--blue);color:#eef4fb;}
.unit-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:16px;}
.unit-card{background:var(--paper);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);}
.unit-img{height:118px;position:relative;background:linear-gradient(135deg,#dde6ef,#c8d5e2);}
.unit-tag{position:absolute;top:10px;left:10px;background:#e6f6cf;color:#4a7d0e;font-size:10px;font-weight:800;letter-spacing:.6px;padding:4px 9px;border-radius:6px;}
.unit-body{padding:13px 15px 15px;}
.unit-veh{font-size:16.5px;margin-bottom:2px;}
.unit-spec{font-size:12.5px;color:var(--mute);margin-bottom:10px;}
.unit-meta{list-style:none;display:flex;gap:16px;margin-bottom:12px;}
.unit-meta li span{display:block;font-size:10.5px;color:var(--mute);}
.unit-meta li b{font-size:13px;}
.unit-foot{display:flex;align-items:center;justify-content:space-between;}
.unit-price{font-size:18px;font-weight:800;color:var(--blue);filter:blur(6px);user-select:none;}
.unit-unlock{border:none;background:var(--blue);color:#eef4fb;padding:10px 16px;border-radius:10px;font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;}
.unit-unlock:hover{background:var(--deep);}

/* placeholder art per card until real images */
.ph-a{background:linear-gradient(135deg,#d3deea,#b9c9da);}
.ph-b{background:linear-gradient(135deg,#dbe2ec,#c2cfdd);}
.ph-c{background:linear-gradient(135deg,#d6e2ea,#bccddb);}
.ph-d{background:linear-gradient(135deg,#dee4ed,#c5d1de);}
.ph-e{background:linear-gradient(135deg,#d4dfe9,#bac9d9);}
.ph-f{background:linear-gradient(135deg,#dce6e3,#c3d4cf);}
.ph-g{background:linear-gradient(135deg,#d8e3e0,#bfd0cb);}
.ph-h{background:linear-gradient(135deg,#e0e6e0,#c8d3c9);}
.ph-i{background:linear-gradient(135deg,#dde4dd,#c4cfc5);}
.ph-j{background:linear-gradient(135deg,#dfe3ea,#c6cdd9);}
.ph-k{background:linear-gradient(135deg,#dae2ea,#c1cdd9);}
.ph-l{background:linear-gradient(135deg,#d5dfe9,#bccada);}
.ph-m{background:linear-gradient(135deg,#d9e1eb,#c0ccdb);}
.ph-n{background:linear-gradient(135deg,#dde3ec,#c4d0dd);}
.ph-o{background:linear-gradient(135deg,#d7e0ea,#bec9d9);}
.ph-p{background:linear-gradient(135deg,#dfe5e1,#c6d2ca);}
.ph-q{background:linear-gradient(135deg,#dbe4e1,#c2d1cc);}
.ph-r{background:linear-gradient(135deg,#dee5e2,#c5d2cd);}
.ph-s{background:linear-gradient(135deg,#e0e4eb,#c7cedb);}

/* ---------- generic sections ---------- */
.stepzone{padding:26px 0;}
.step-list{display:grid;gap:12px;}
.step{background:var(--paper);border-radius:var(--r);padding:15px 16px;box-shadow:var(--shadow-sm);display:flex;gap:13px;align-items:flex-start;}
.step i{font-style:normal;flex:none;width:32px;height:32px;border-radius:9px;background:#e6f6cf;color:#4a7d0e;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:14px;}
.step p{font-size:13.5px;color:var(--mute);}
.step b{display:block;color:var(--ink);font-size:14.5px;margin-bottom:2px;}
.trustband{padding:22px 0;}
.trustband .wrapx{background:var(--blue);color:#dbe8f6;border-radius:18px;padding:20px 18px;display:grid;gap:6px;font-size:13.5px;}
.trustband b{color:#fff;font-size:15px;}
.qa-zone{padding:26px 0 30px;}
.qa{background:var(--paper);border-radius:12px;box-shadow:var(--shadow-sm);margin-bottom:9px;overflow:hidden;}
.qa button{width:100%;text-align:left;background:none;border:none;padding:14px 16px;font-size:14.5px;font-weight:700;color:var(--ink);cursor:pointer;font-family:inherit;display:flex;justify-content:space-between;align-items:center;}
.qa button::after{content:"+";font-size:19px;color:var(--blue);font-weight:400;}
.qa.open button::after{content:"\2212";}
.qa div{display:none;padding:0 16px 14px;font-size:13.5px;color:var(--mute);}
.qa.open div{display:block;}
.pagehead{background:linear-gradient(160deg,var(--blue),var(--deep));color:#eef4fb;padding:26px 0 28px;}
.pagehead h1{font-size:27px;margin-bottom:6px;}
.pagehead p{font-size:14px;color:#c6d6e8;max-width:56ch;}
.prose{padding:26px 0;font-size:14.5px;color:#33455c;}
.prose .wrapx>*{margin-bottom:12px;max-width:72ch;}
.prose h2{color:var(--blue);font-size:20px;margin-top:8px;}

/* ---------- thank-you ---------- */
.ty-zone{padding:44px 0 60px;}
.ty-note{background:#e6f6cf;border:1.5px solid #bfe08a;border-radius:16px;padding:20px 18px;max-width:520px;margin:0 auto 16px;}
.ty-note h1{font-size:22px;color:#2c4d0d;margin-bottom:6px;}
.ty-note p{font-size:14px;color:#3d5b1c;}
.ty-call{background:var(--blue);color:#eef4fb;border-radius:16px;padding:22px 18px;max-width:520px;margin:0 auto;text-align:center;}
.ty-call p{font-size:14px;color:#c6d6e8;margin-bottom:12px;}
.ty-call a{display:inline-flex;align-items:center;gap:9px;background:var(--lime);color:var(--lime-ink);font-weight:800;font-size:16px;padding:14px 26px;border-radius:12px;}

/* ---------- footer ---------- */
.basefoot{background:var(--deep);color:#a9c0d8;padding:28px 0 90px;margin-top:20px;}
.foot-full{display:grid;grid-template-columns:2fr 1fr 1fr;gap:22px;padding-bottom:18px;border-bottom:1px solid rgba(219,228,238,.15);margin-bottom:14px;}
.foot-brand{font-size:17px;font-weight:800;color:#eef4fb;margin-bottom:6px;font-family:'Archivo Narrow',sans-serif;}
.foot-brand span{color:var(--lime);}
.foot-txt{font-size:13px;line-height:1.55;}
.foot-h{font-size:11.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#eef4fb;margin-bottom:8px;}
.foot-col a{display:block;font-size:13px;margin-bottom:6px;}
.foot-col a:hover{color:#fff;}
.foot-line{display:flex;justify-content:space-between;font-size:12.5px;flex-wrap:wrap;gap:6px;}
.foot-legal a{text-decoration:underline;}

/* ---------- sticky dockbar ---------- */
.dockbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(245,248,251,.94);backdrop-filter:blur(6px);border-top:1px solid var(--line);}
.dock-call,.dock-quote{flex:1;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;font-weight:800;}
.dock-call{background:var(--lime);color:var(--lime-ink);}
.dock-quote{background:var(--blue);color:#eef4fb;}

/* ---------- responsive ---------- */
@media (min-width:760px){
  .heroband .wrapx{grid-template-columns:1.05fr 1fr;align-items:center;}
  .heroband h1{font-size:40px;}
  .dockbar{display:none;}
  body{padding-bottom:0;}
  .basefoot{padding-bottom:28px;}
}
@media (max-width:980px){
  nav.links{display:none;}
  .burger{display:block;}
}
@media (max-width:759px){
  .foot-full{display:none;}           /* footer collapses to one line on mobile */
  .basefoot{padding-top:16px;}
  .foot-line{justify-content:center;text-align:center;}
  .frow{grid-template-columns:1fr 1fr;}
  .unit-grid{grid-template-columns:1fr 1fr;}
  .unit-img{height:92px;}
  .unit-veh{font-size:14.5px;}
  .unit-meta{gap:11px;}
  .unit-meta li b{font-size:12px;}
  .unit-price{font-size:15px;}
  .unit-unlock{padding:9px 13px;font-size:12px;}
}
@media (max-width:420px){
  .heroband h1{font-size:27px;}
}

/* unit card photos */
.unit-img img{width:100%;height:100%;object-fit:cover;display:block;}
.unit-img{background:#e8edf3;}