/* Shared marketing SEO pages — matches DriveManager landing tokens */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#07090c;--ink2:#0e1218;--panel:#141a22;--line:rgba(255,255,255,.08);
  --fog:#a8b4c4;--mist:#6d7a8c;--snow:#f4f7fb;--volt:#1ec8b0;--volt2:#6ef0d8;
  --signal:#ffb020;--signal2:#ffd27a;
}
html{scroll-behavior:smooth;overflow-x:clip}
body{
  font-family:Onest,system-ui,sans-serif;background:var(--ink);color:var(--snow);
  line-height:1.65;min-height:100vh;
  background-image:
    radial-gradient(900px 420px at 10% -10%,rgba(30,200,176,.12),transparent 55%),
    radial-gradient(700px 380px at 95% 0%,rgba(255,176,32,.08),transparent 50%);
}
a{color:var(--volt2);text-decoration:none}
a:hover{color:var(--snow)}
.topnav{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding:.85rem clamp(1rem,3vw,2rem);
  background:rgba(7,9,12,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);
}
.brand{font-family:Unbounded,sans-serif;font-weight:800;font-size:1.05rem;color:var(--snow);letter-spacing:-.02em}
.brand span{color:var(--volt)}
.nav-links{display:flex;flex-wrap:wrap;gap:.35rem .85rem;align-items:center;font-size:.88rem}
.nav-links a{color:var(--fog)}
.nav-links a:hover,.nav-links a.active{color:var(--snow)}
.btn-nav{
  display:inline-flex;align-items:center;padding:.42rem .95rem;border-radius:999px;
  background:linear-gradient(135deg,var(--volt),#0ea5a0);color:#04110f !important;font-weight:700;
}
.wrap{width:min(920px,100%);margin:0 auto;padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,1.5rem) 4rem}
.crumb{font-size:.82rem;color:var(--mist);margin-bottom:1.25rem}
.crumb a{color:var(--fog)}
.kicker{
  display:inline-flex;align-items:center;gap:.45rem;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--volt2);margin-bottom:.85rem;
}
.kicker i{width:.45rem;height:.45rem;border-radius:50%;background:var(--volt);display:inline-block}
h1{
  font-family:Unbounded,sans-serif;font-weight:800;font-size:clamp(1.7rem,4.5vw,2.6rem);
  line-height:1.15;letter-spacing:-.03em;margin-bottom:1rem;
}
h1 em{font-style:normal;color:var(--volt2)}
.lead{font-size:1.05rem;color:var(--fog);max-width:42rem;margin-bottom:1.75rem}
.cta-row{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0 2.25rem}
.btn-primary,.btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;padding:.85rem 1.25rem;
  border-radius:999px;font-weight:700;font-size:.95rem;
}
.btn-primary{background:linear-gradient(135deg,var(--volt),#0ea5a0);color:#04110f}
.btn-secondary{border:1px solid var(--line);color:var(--snow);background:rgba(255,255,255,.03)}
.btn-secondary:hover{border-color:rgba(30,200,176,.45)}
h2{
  font-family:Unbounded,sans-serif;font-size:clamp(1.2rem,3vw,1.55rem);font-weight:700;
  letter-spacing:-.02em;margin:2.25rem 0 .85rem;line-height:1.25;
}
h2 em{font-style:normal;color:var(--signal2)}
h3{font-size:1.02rem;margin:1.35rem 0 .45rem;color:var(--snow)}
p,li{color:var(--fog)}
ul,ol{padding-left:1.2rem;margin:.6rem 0 1rem}
li{margin:.35rem 0}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin:1.25rem 0 1.75rem}
.card{
  background:rgba(20,26,34,.9);border:1px solid var(--line);border-radius:16px;padding:1.15rem 1.2rem;
}
.card strong{display:block;color:var(--snow);margin-bottom:.35rem;font-size:.98rem}
.card p{font-size:.92rem;margin:0}
.price-box{
  margin:1.5rem 0;padding:1.5rem;border-radius:20px;border:1px solid rgba(30,200,176,.28);
  background:linear-gradient(180deg,rgba(30,200,176,.1),rgba(20,26,34,.95));
}
.price-box .amount{font-family:Unbounded,sans-serif;font-size:clamp(2rem,6vw,3rem);font-weight:800;color:var(--snow)}
.price-box .amount span{color:var(--volt2)}
.price-box .note{color:var(--mist);font-size:.9rem;margin-top:.35rem}
.faq details{
  border:1px solid var(--line);border-radius:12px;padding:.85rem 1rem;margin:.55rem 0;
  background:rgba(20,26,34,.75);
}
.faq summary{cursor:pointer;font-weight:600;color:var(--snow);list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq details[open] summary{color:var(--volt2);margin-bottom:.45rem}
.related{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}
.related a{
  border:1px solid var(--line);border-radius:999px;padding:.4rem .85rem;font-size:.85rem;color:var(--fog);
}
.related a:hover{border-color:rgba(30,200,176,.45);color:var(--snow)}
footer{
  border-top:1px solid var(--line);padding:1.5rem clamp(1rem,3vw,2rem) 2.5rem;
  text-align:center;color:var(--mist);font-size:.9rem;
}
footer p{margin:.4rem 0}
@media(max-width:700px){
  .nav-links a:not(.btn-nav){display:none}
}
