/* SP Detailing — shared site styles
   Layout: sticky nav + footer wrap every page; content max-width 880px.
   Tokens mirror the print rate-card identity (teal/purple on warm neutral). */
:root{
  --bg:#FBF9F2;
  --surface:#FFFFFF;
  --ink:#1C1F21;
  --muted:#5C6266;
  --border:#E4DCC8;
  --head-row:#EAE4D7;
  --accent:#0C6D67;
  --accent-soft:#D9EFEC;
  --accent-2:#6A3FCE;
  --accent-2-soft:#EDE6FB;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#15181A;
    --surface:#1D2022;
    --ink:#F2EFE8;
    --muted:#A8AFB2;
    --border:#33393C;
    --head-row:#23272A;
    --accent:#4FC7BE;
    --accent-soft:#1C3634;
    --accent-2:#B49CF0;
    --accent-2-soft:#2C2440;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#15181A;
  --surface:#1D2022;
  --ink:#F2EFE8;
  --muted:#A8AFB2;
  --border:#33393C;
  --head-row:#23272A;
  --accent:#4FC7BE;
  --accent-soft:#1C3634;
  --accent-2:#B49CF0;
  --accent-2-soft:#2C2440;
  color-scheme:dark;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  padding-inline:16px;
  padding-block:0 32px;
}
img{max-width:100%;}
[hidden]{display:none!important;}
.wrap{max-width:880px;margin-inline:auto;}

/* ---------- nav ---------- */
.site-nav{
  position:sticky;
  top:env(safe-area-inset-top,0px);
  z-index:10;
  background:var(--bg);
  border-bottom:1px solid var(--border);
  margin-inline:-16px;
  padding-inline:16px;
}
.nav-wrap{
  max-width:880px;
  margin-inline:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding-block:14px;
}
.brand{
  font-weight:800;
  font-size:1.05rem;
  text-decoration:none;
  color:var(--ink);
  letter-spacing:-0.01em;
}
.brand span{color:var(--accent);}
.nav-links{display:flex;gap:20px;align-items:center;flex-wrap:wrap;}
.nav-links a{
  text-decoration:none;
  color:var(--muted);
  font-size:0.85rem;
  font-weight:600;
}
.nav-links a:hover,
.nav-links a.active{color:var(--ink);}
.nav-links a.nav-cta{
  background:var(--accent);
  color:#fff;
  padding:8px 16px;
  border-radius:999px;
}
.nav-links a.nav-cta:hover{opacity:0.9;color:#fff;}

/* ---------- shared type ---------- */
.kicker{
  font-family:'JetBrains Mono',monospace;
  font-size:0.7rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:700;
  margin-bottom:8px;
}
.section-label{
  font-family:'JetBrains Mono',monospace;
  font-size:0.72rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 14px;
}
h1{font-size:1.8rem;line-height:1.15;margin:0 0 10px;text-wrap:balance;letter-spacing:-0.01em;}
.dek{color:var(--muted);font-size:0.97rem;line-height:1.6;max-width:60ch;margin:0;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
  border-radius:10px;
  font-weight:700;
  font-size:0.9rem;
  text-decoration:none;
  border:1.5px solid transparent;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{opacity:0.92;color:#fff;}
.btn-secondary{background:transparent;border-color:var(--border);color:var(--ink);}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent);}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px;}

/* ---------- cards ---------- */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px 18px 20px;
  display:flex;
  flex-direction:column;
  min-width:0;
}
.card.featured{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:6px;}
.level-tag{
  font-family:'JetBrains Mono',monospace;
  font-size:0.68rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);
}
.badge{
  font-family:'JetBrains Mono',monospace;font-size:0.62rem;letter-spacing:0.06em;
  text-transform:uppercase;font-weight:700;color:var(--accent);background:var(--accent-soft);
  border-radius:999px;padding:3px 9px;white-space:nowrap;
}
.card h2{font-size:1.12rem;margin:0 0 12px;letter-spacing:-0.005em;}
.prices{display:flex;gap:16px;margin-bottom:14px;flex-wrap:wrap;}
.price-block{min-width:0;}
.price-block .amt{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:1.35rem;
  font-variant-numeric:tabular-nums;color:var(--ink);display:block;
}
.price-block .veh{font-size:0.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.04em;}
.card p.desc{font-size:0.87rem;line-height:1.55;color:var(--muted);margin:0;}
.card p.desc strong{color:var(--ink);font-weight:600;}

.tiers{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:34px;}
@media (min-width:560px){.tiers{grid-template-columns:1fr 1fr;}}

.plans{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:26px;}
@media (min-width:560px){.plans{grid-template-columns:1fr 1fr;}}
.plan-card{background:var(--accent-2-soft);border:1px solid var(--border);border-radius:14px;padding:18px;min-width:0;}
.plan-card h2{font-size:1rem;margin:0 0 6px;color:var(--ink);}
.plan-card .rate{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:1.2rem;color:var(--accent-2);
  display:block;margin-bottom:8px;font-variant-numeric:tabular-nums;
}
.plan-card p{font-size:0.85rem;line-height:1.5;color:var(--muted);margin:0;}
.plan-card .prices{margin-bottom:12px;}
.plan-card .price-block .amt{color:var(--accent-2);}

/* ---------- add-on list ---------- */
.addon-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;}
.addon-list li{display:flex;justify-content:space-between;gap:12px;font-size:0.88rem;color:var(--ink);border-top:1px solid var(--border);padding-top:8px;}
.addon-list li:first-child{border-top:none;padding-top:0;}
.addon-list .addon-price{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--accent-2);white-space:nowrap;}

/* ---------- value / included grid ---------- */
.value-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-block:8px 34px;}
@media (min-width:640px){.value-grid{grid-template-columns:repeat(3,1fr);}}
.value-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:18px;min-width:0;}
.value-card .tag{
  font-family:'JetBrains Mono',monospace;font-size:0.65rem;letter-spacing:0.06em;
  text-transform:uppercase;color:var(--accent);font-weight:700;
}
.value-card h3{font-size:1rem;margin:8px 0 6px;}
.value-card p{font-size:0.85rem;color:var(--muted);line-height:1.5;margin:0;}

/* ---------- pricing teaser (home) ---------- */
.teaser-row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:8px;}
@media (min-width:640px){.teaser-row{grid-template-columns:repeat(4,1fr);}}
.teaser-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px;min-width:0;}
.teaser-card .lvl{
  font-family:'JetBrains Mono',monospace;font-size:0.62rem;text-transform:uppercase;
  color:var(--muted);letter-spacing:0.06em;
}
.teaser-card h4{font-size:0.86rem;margin:4px 0 8px;}
.teaser-card .from{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--accent);font-size:1rem;}
.teaser-link{display:inline-block;margin-top:14px;font-weight:700;color:var(--accent);text-decoration:none;font-size:0.88rem;}
.teaser-link:hover{text-decoration:underline;}

/* ---------- about page ---------- */
.about-body p{font-size:0.96rem;line-height:1.7;color:var(--ink);max-width:65ch;margin:0 0 16px;}

/* ---------- contact page ---------- */
.contact-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:24px;max-width:480px;}
.contact-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.contact-email{font-family:'JetBrains Mono',monospace;font-size:0.95rem;word-break:break-all;}
.copy-btn{
  font-family:'JetBrains Mono',monospace;font-size:0.68rem;text-transform:uppercase;
  letter-spacing:0.04em;border:1px solid var(--border);background:transparent;color:var(--muted);
  border-radius:6px;padding:4px 9px;cursor:pointer;
}
.copy-btn:hover{border-color:var(--accent);color:var(--accent);}
.note-box{background:var(--accent-soft);border-radius:10px;padding:14px 16px;font-size:0.85rem;color:var(--ink);margin-top:18px;line-height:1.55;}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--border);margin-top:40px;padding-block:24px 40px;}
.footer-wrap{max-width:880px;margin-inline:auto;display:flex;flex-direction:column;gap:8px;}
.footer-brand{font-weight:800;}
.footer-brand span{color:var(--accent);}
.footer-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:0.82rem;color:var(--muted);}
.footer-legal{font-size:0.75rem;color:var(--muted);opacity:0.8;}