/* ===========================================================
   SpeeDee Delivery WV — elegant charcoal + gold business card
   Offline (Bootstrap 5 local). Flat, restrained, professional.
   =========================================================== */
:root{
  --bg:#0f1015;
  --panel:#191b22;
  --panel-2:#20232c;
  --gold:#c9a24b;
  --gold-2:#e0bd6a;
  --ink:#ece9e2;
  --muted:#9aa0ad;
  --line:#2b2e39;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;line-height:1.6;
}
h1,h2,h3,h4{font-weight:700;letter-spacing:-.01em;color:var(--ink);margin:0}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold-2)}
section{scroll-margin-top:80px}

/* ---------- wordmark ---------- */
.sd-word{font-weight:800;font-size:1.15rem;line-height:1;color:var(--ink);letter-spacing:-.01em;white-space:nowrap}
.sd-word b{color:var(--gold);font-weight:800}
.sd-word i{display:inline-block;margin-left:5px;font-style:normal;font-size:.55rem;font-weight:800;letter-spacing:.18em;
  color:#14151a;background:var(--gold);border-radius:4px;padding:2px 6px;vertical-align:middle}

/* ---------- buttons ---------- */
.sd-btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:999px;font-weight:700;font-size:.95rem;
  padding:.62rem 1.4rem;border:1px solid transparent;transition:.15s;cursor:pointer}
.sd-btn-gold{background:var(--gold);color:#14151a}
.sd-btn-gold:hover{background:var(--gold-2);color:#14151a;transform:translateY(-1px)}
.sd-btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.sd-btn-ghost:hover{border-color:var(--gold);color:var(--gold)}

/* ---------- navbar ---------- */
.sd-nav{background:rgba(15,16,21,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:20}
.sd-nav .container{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem}
.sd-brand{display:flex;align-items:center;gap:.6rem}
.sd-brand img{height:38px;width:38px;border-radius:9px}

/* ---------- hero / business card ---------- */
.sd-hero{padding:4.5rem 0 4rem;position:relative}
.sd-hero:before{content:"";position:absolute;inset:0;
  background:radial-gradient(60% 60% at 50% 0%,rgba(201,162,75,.10),transparent 70%);pointer-events:none}
.sd-cardwrap{max-width:560px;margin:0 auto;position:relative}
.sd-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:2.4rem 2.2rem;
  box-shadow:0 30px 70px rgba(0,0,0,.45);position:relative;overflow:hidden}
.sd-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gold)}
.sd-card-top{display:flex;align-items:center;gap:.8rem;margin-bottom:1.4rem}
.sd-card-top img{height:52px;width:52px;border-radius:12px}
.sd-card-top .sd-word{font-size:1.5rem}
.sd-tagline{color:var(--muted);font-size:1.02rem;margin:0 0 1.3rem}
.sd-hr{height:2px;width:46px;background:var(--gold);border-radius:2px;margin:0 0 1.3rem}
.sd-services-line{font-size:.98rem;color:var(--ink);margin:0 0 1.6rem;line-height:1.7}
.sd-services-line b{color:var(--gold);font-weight:700}
.sd-contact{list-style:none;margin:0 0 1.7rem;padding:0;display:grid;gap:.7rem}
.sd-contact li{display:flex;align-items:center;gap:.75rem;font-size:1rem}
.sd-contact li a{color:var(--ink)}
.sd-contact li a:hover{color:var(--gold)}
.sd-contact .ic{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--gold);font-size:.85rem;flex:0 0 auto}
.sd-cta-row{display:flex;flex-wrap:wrap;gap:.7rem}

/* ---------- generic section ---------- */
.sd-sec{padding:3.6rem 0;border-top:1px solid var(--line)}
.sd-eyebrow{display:block;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:800;
  color:var(--gold);margin-bottom:.7rem}
.sd-sec h2{font-size:1.5rem;margin-bottom:.6rem}
.sd-lead{color:var(--muted);font-size:1.05rem;max-width:46rem}

/* ---------- about ---------- */
.sd-about p{color:var(--muted);font-size:1.06rem;max-width:48rem;margin:.4rem 0 0}
.sd-about strong{color:var(--ink);font-weight:600}

/* ---------- services (simple) ---------- */
.sd-svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-top:1.6rem}
.sd-svc .item{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1.4rem 1.4rem}
.sd-svc .item h3{font-size:1.08rem;margin-bottom:.4rem;display:flex;align-items:center;gap:.55rem}
.sd-svc .item h3 .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex:0 0 auto}
.sd-svc .item p{color:var(--muted);font-size:.94rem;margin:0}

/* ---------- coverage ---------- */
.sd-coverage{color:var(--muted);font-size:1.02rem;margin-top:.4rem}
.sd-coverage b{color:var(--ink);font-weight:600}

/* ---------- footer ---------- */
.sd-footer{background:#0b0c10;border-top:1px solid var(--line);padding:2.4rem 0;margin-top:1rem}
.sd-footer .container{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
.sd-footer .muted{color:#6f7581;font-size:.9rem}
.sd-footer a{color:#aeb4bf}
.sd-footer a:hover{color:var(--gold)}

@media (max-width:560px){
  .sd-card{padding:1.8rem 1.5rem}
  .sd-card-top .sd-word{font-size:1.25rem}
}