/* Central Valley Ignition — shared site theme (Plate).
   Used by secondary pages (feature requests, blog, service areas, etc.).
   The homepage keeps its own inline copy; keep these in sync on theme changes. */
:root{
  --bg:#1f262d; --bg-2:#252e37; --panel:#2b353f; --panel-2:#222a32; --line:#3f4b57; --line-2:#566472;
  --text:#e7ecf1; --muted:#94a1b0; --amber:#ffc233; --amber-2:#ffd569; --rivet:#6b7884; --green:#5fd38a; --red:#ff6a5e;
  --mono:ui-monospace,"Cascadia Code","SF Mono",Menlo,Consolas,monospace;
  --sans:Inter,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
body{background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.6;overflow-x:clip;
  background-image:linear-gradient(180deg,#252e37,#191f25);background-attachment:fixed}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;position:relative;z-index:1}
.wrap.narrow{max-width:820px}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* riveted plate panel */
.plate{position:relative;background:linear-gradient(160deg,var(--panel),var(--panel-2));border:1px solid var(--line-2);border-radius:8px;
  background-image:linear-gradient(160deg,var(--panel),var(--panel-2)),
    radial-gradient(circle at 12px 12px,var(--rivet) 2.5px,transparent 3.4px),
    radial-gradient(circle at calc(100% - 12px) 12px,var(--rivet) 2.5px,transparent 3.4px),
    radial-gradient(circle at 12px calc(100% - 12px),var(--rivet) 2.5px,transparent 3.4px),
    radial-gradient(circle at calc(100% - 12px) calc(100% - 12px),var(--rivet) 2.5px,transparent 3.4px);
  background-repeat:no-repeat;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 6px 18px rgba(0,0,0,.3)}

/* top nav */
.topbar{position:sticky;top:0;z-index:50;background:#13171c;border-bottom:1px solid var(--line);box-shadow:0 2px 10px rgba(0,0,0,.35)}
header.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;font-size:1.05rem}
.logo .mark{width:38px;height:38px;background:linear-gradient(145deg,#48555f,#2a333c);border:1px solid var(--line-2);border-radius:7px;display:grid;place-items:center;font-weight:800;color:var(--amber);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.nav nav{display:flex;gap:28px;font-size:14px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.nav nav a:hover{color:var(--amber)}

/* buttons */
.btn{display:inline-block;padding:14px 28px;border-radius:6px;font-weight:700;font-size:14px;transition:.15s;border:1px solid transparent;cursor:pointer;text-transform:uppercase;letter-spacing:.05em}
.btn.primary{background:var(--amber);color:#221900;box-shadow:0 5px 0 #b8851a;transition:transform .08s ease,box-shadow .08s ease}
.btn.primary:active{transform:translateY(5px);box-shadow:0 0 0 #b8851a}
.btn.ghost{border-color:var(--line-2);color:var(--text);background:var(--panel)}
.btn.ghost:hover{border-color:var(--amber);color:var(--amber)}

/* section + headings */
section{padding:66px 0}
.sec-head{text-align:center;margin-bottom:38px}
.sec-head .eyebrow{font-family:var(--mono);color:var(--amber);font-size:12px;text-transform:uppercase;letter-spacing:.16em}
.sec-head h2{font-size:2rem;font-weight:900;text-transform:uppercase;margin-top:8px;letter-spacing:-.01em}

/* page hero (sub-pages) */
.page-hero{padding:64px 0 40px;text-align:center}
.page-hero .eyebrow{font-family:var(--mono);color:var(--amber);font-size:12px;text-transform:uppercase;letter-spacing:.16em}
.page-hero h1{font-size:clamp(2.1rem,5vw,3.2rem);line-height:1.05;margin:14px auto 14px;font-weight:900;letter-spacing:-.02em;text-transform:uppercase;max-width:820px}
.page-hero p.lead{font-size:1.12rem;color:var(--muted);max-width:640px;margin:0 auto}
.crumbs{font-family:var(--mono);font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}
.crumbs a:hover{color:var(--amber)}

/* card grid */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.card{padding:28px;transition:.18s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);border-color:var(--amber)}
.card .badge{font-family:var(--mono);font-size:11px;color:var(--green);border:1px solid rgba(95,211,138,.4);border-radius:4px;padding:2px 9px;display:inline-block;margin-bottom:14px;text-transform:uppercase}
.card .badge.soon{color:var(--amber);border-color:rgba(255,194,51,.4)}
.card .badge.amber{color:var(--amber);border-color:rgba(255,194,51,.4)}
.card h3{font-size:1.2rem;margin-bottom:10px;text-transform:uppercase;letter-spacing:.01em}
.card p{color:var(--muted);font-size:14.5px}

/* long-form prose (blog / articles) */
.prose{color:var(--text)}
.prose h2{font-size:1.5rem;margin:34px 0 12px;text-transform:uppercase;letter-spacing:-.01em}
.prose h3{font-size:1.18rem;margin:26px 0 10px}
.prose p{color:#c4cdd6;margin:0 0 16px;font-size:16px}
.prose ul,.prose ol{color:#c4cdd6;margin:0 0 16px;padding-left:22px}
.prose li{margin-bottom:7px}
.prose a{color:var(--amber)}
.prose a:hover{text-decoration:underline}
.prose code{font-family:var(--mono);font-size:.92em;background:#171c22;border:1px solid var(--line);border-radius:4px;padding:1px 6px}
.meta{font-family:var(--mono);font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}

/* rich footer with link columns */
.botbar{background:#13171c;border-top:1px solid var(--line);box-shadow:0 -2px 10px rgba(0,0,0,.35)}
.foot-cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px;padding:40px 0 28px}
.foot-brand .logo{margin-bottom:12px}
.foot-brand p{color:var(--muted);font-size:13.5px;max-width:280px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* inline illustrative figures inside articles */
.fig{margin:26px 0;border:1px solid var(--line-2);border-radius:10px;background:linear-gradient(160deg,var(--panel),var(--panel-2));padding:18px 18px 6px;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.fig svg{display:block;width:100%;height:auto}
.fig figcaption{font-family:var(--mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:12px 4px 8px;text-align:center}
.foot-col h3{font-family:var(--mono);font-size:12px;color:var(--amber);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px}
.foot-col a{display:block;color:var(--muted);font-size:14px;padding:4px 0}
.foot-col a:hover{color:var(--amber)}
footer{padding:18px 0 30px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em}
.foot-status{display:flex;align-items:center;gap:8px;color:var(--green)}
.led{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:led-pulse 2.2s ease-in-out infinite}
@keyframes led-pulse{0%,100%{opacity:1}50%{opacity:.32}}
@media(prefers-reduced-motion:reduce){.led{animation:none}}

@media(max-width:760px){
  .nav nav{display:none}
  .foot-cols{grid-template-columns:1fr 1fr;gap:22px}
  .foot-brand{grid-column:1 / -1}
}
@media(max-width:640px){
  .hero-mascot{display:none}
}
@media(max-width:560px){
  /* CTA buttons go full-width and stack cleanly on phones */
  .btn{display:block;width:100%;text-align:center}
  .btn + .btn{margin-top:10px}
}