:root{
  --ink:#111416; --ink-2:#1d2226; --muted:#5b6670; --line:#e3e7ea;
  --bg:#ffffff; --bg-alt:#f4f6f7; --accent:#f5b400; --wa:#25d366; --wa-dark:#1da851;
  --radius:14px; --shadow:0 6px 24px rgba(17,20,22,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
h1,h2,h3{line-height:1.2;margin:0 0 .5em}
h2{font-size:clamp(1.6rem,3.5vw,2.2rem)}
h3{font-size:1.15rem}
.small{font-size:.95rem;color:var(--muted)}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(17,20,22,.97);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.header-inner{display:flex;align-items:center;gap:20px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;letter-spacing:.2px}
.brand img{border-radius:50%;width:44px;height:44px}
.brand small{display:block;font-weight:500;font-size:.75rem;opacity:.75;margin-top:-4px}
.nav{display:flex;gap:22px;margin-left:auto}
.nav a{text-decoration:none;font-size:.95rem;opacity:.85}
.nav a:hover{opacity:1;color:var(--accent)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:999px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .1s,background .2s}
.btn:active{transform:translateY(1px)}
.btn-sm{padding:8px 16px;font-size:.9rem}
.btn-lg{padding:14px 26px;font-size:1.05rem}
.btn-wa{background:var(--wa);color:#08321a}
.btn-wa:hover{background:var(--wa-dark);color:#fff}
.btn-ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
.btn-ghost:hover{box-shadow:inset 0 0 0 2px #fff}
.btn-ghost-dark{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.btn-ghost-dark:hover{background:var(--ink);color:#fff}
.wa-icon{width:22px;height:22px}

/* Hero */
.hero{background:radial-gradient(1200px 500px at 85% 20%,#2a3137 0,transparent 60%),var(--ink);color:#fff;padding:72px 0 80px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:repeating-linear-gradient(90deg,var(--accent) 0 40px,transparent 40px 60px)}
.hero-inner{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:700;color:var(--accent);margin:0 0 12px}
.hero h1{font-size:clamp(2rem,5vw,3.3rem);font-weight:800}
.hero h1 span{color:var(--accent)}
.lead{font-size:1.15rem;opacity:.88;max-width:34em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}
.badges{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px}
.badges li{font-size:.9rem;padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.badges li::before{content:"✓ ";color:var(--wa);font-weight:800}
.hero-logo{display:flex;justify-content:center}
.ring{padding:12px;border-radius:50%;background:conic-gradient(var(--accent),#fff3,var(--accent));box-shadow:0 20px 60px rgba(0,0,0,.45)}
.ring img{border-radius:50%;width:min(320px,70vw);height:auto;aspect-ratio:1}

/* Sections */
.section{padding:72px 0}
.section-alt{background:var(--bg-alt)}
.section-lead{color:var(--muted);margin:-4px 0 28px;font-size:1.05rem}
.grid{display:grid;gap:18px}
.cards{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--accent);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.card p{margin:0;color:var(--muted);font-size:.95rem}

.steps{grid-template-columns:repeat(3,1fr);list-style:none;padding:0;margin:28px 0 0;counter-reset:s}
.step{background:#fff;border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);position:relative}
.step p{margin:0;color:var(--muted)}
.num{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--accent);font-weight:800;font-size:1.2rem;margin-bottom:14px}

/* Quote */
.quote-wrap{display:grid;grid-template-columns:1fr 1.4fr;gap:40px;align-items:start}
.quote-intro p{color:var(--muted)}
.quote-intro a{color:var(--ink);font-weight:600}
.quote-form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);display:grid;gap:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:grid;gap:6px;font-weight:600;font-size:.92rem}
input,select,textarea{font:inherit;font-weight:400;padding:12px 14px;border:1.5px solid #cfd6db;border-radius:10px;background:#fff;color:var(--ink);width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(245,180,0,.35)}
textarea{resize:vertical}
.form-actions{display:flex;flex-wrap:wrap;gap:12px}
.form-error{margin:0;color:#b42318;font-weight:600}

/* Instant estimate */
.btn-md{padding:12px 18px;font-size:.95rem}
.btn-accent{background:var(--accent);color:var(--ink)}
.btn-accent:hover{background:#ffc933}
.btn[disabled]{opacity:.6;cursor:wait}
.estimate{background:var(--ink);color:#fff;border-radius:var(--radius);padding:18px 20px;display:grid;gap:10px;border-left:6px solid var(--accent)}
.estimate-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.estimate-head h3{margin:0;color:#fff}
.estimate-tag{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;color:var(--accent)}
.miles-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}
.estimate label{color:#fff}
.estimate input{border-color:#3a434a}
.miles-status{margin:0;color:#c9d0d5;min-height:0}
.miles-status:empty{display:none}
.estimate-price{margin:0;font-size:1.05rem;color:#c9d0d5}
.estimate-price.has-price{color:#fff;font-size:1.2rem}
.estimate-price strong{color:var(--accent);font-size:1.6rem;font-weight:800}
.estimate-note{margin:0;font-size:.82rem;color:#9aa5ad}

/* Drivers */
.drivers{background:var(--ink);color:#fff}
.drivers-inner{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}
.drivers p{opacity:.9}
.vans{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.vans li{background:var(--accent);color:var(--ink);font-weight:800;padding:8px 16px;border-radius:8px}
.drivers-cta{display:flex;flex-direction:column;gap:12px}

/* Contact */
.contact{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:24px}
.contact-card{display:grid;gap:4px;padding:22px;background:#fff;border-radius:var(--radius);border:1px solid var(--line);text-decoration:none;box-shadow:var(--shadow);transition:border-color .2s}
.contact-card:hover{border-color:var(--ink)}
.contact-card .label{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700}
.contact-card .value{font-weight:700;overflow-wrap:anywhere;font-size:.98rem}

/* Footer */
.site-footer{background:#0b0d0e;color:#c9d0d5;padding:36px 0 90px;font-size:.92rem}
.footer-inner{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;align-items:center}
.footer-brand{display:flex;gap:14px;align-items:center}
.footer-brand img{border-radius:50%}
.footer-brand strong{color:#fff}
.footer-legal p{margin:0 0 6px}

/* Floating WhatsApp */
.wa-float{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:60}
.wa-float svg{width:30px;height:30px}

/* Responsive */
@media (max-width:1000px){
  .cards{grid-template-columns:repeat(3,1fr)}
  .contact{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .nav{display:none}
  .header-inner .btn-sm{margin-left:auto}
  .hero{padding:48px 0 60px}
  .hero-inner,.quote-wrap,.drivers-inner{grid-template-columns:1fr}
  .hero-logo{order:-1}
  .ring img{width:180px}
  .steps{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .section{padding:56px 0}
}
@media (max-width:520px){
  .cards,.contact,.row{grid-template-columns:1fr}
  .hero-cta .btn,.form-actions .btn{width:100%}
  .miles-row{grid-template-columns:1fr}
  .miles-row .btn{width:100%}
  .badges li{font-size:.85rem}
}
.extras-row{display:grid;grid-template-columns:auto 1fr;gap:12px 20px;align-items:end}
.estimate .check{display:flex;align-items:center;gap:10px;font-weight:600;cursor:pointer;padding-bottom:12px}
.estimate .check input{width:20px;height:20px;accent-color:var(--accent);margin:0}
.estimate-breakdown{margin:0;color:#c9d0d5}
.estimate-breakdown:empty{display:none}
.price-info{margin:0;padding-left:18px;color:#c9d0d5;font-size:.88rem;display:grid;gap:2px}
@media (max-width:640px){.extras-row{grid-template-columns:1fr}.estimate .check{padding-bottom:0}}
