
:root{
  --bg: #0b1220;
  --bg-soft: #0f172a;
  --text: #e5e7eb;
  --muted: #a1a1aa;
  --accent: #0ea5e9;
  --card: #111827;
  --border: #1f2937;
}
@media (prefers-color-scheme: light){
  :root{
    --bg: #ffffff;
    --bg-soft: #f8fafc;
    --text: #0f172a;
    --muted: #475569;
    --accent: #0284c7;
    --card: #f1f5f9;
    --border: #e2e8f0;
  }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background: var(--bg);
  color: var(--text);
  line-height:1.6;
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:2rem}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#000;color:#fff;padding:.5rem 1rem;z-index:1000}
.site-header{
  position:sticky;top:0;background:rgba(0,0,0,.35);
  backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--border);
  z-index:50;
}
.header-row{display:flex;align-items:center;gap:1rem;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;color:var(--text)}
.logo{fill:var(--accent)}
.menu{display:flex;gap:1rem;list-style:none;margin:0;padding:0}
.nav-toggle{display:none}
.theme-toggle{background:transparent;border:1px solid var(--border);border-radius:999px;padding:.4rem .6rem;color:var(--text);cursor:pointer}
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center;padding-top:3rem}
.hero h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:0 0 .75rem}
.hero p{font-size:1.125rem;margin:0 0 1rem}
.accent{color:var(--accent)}
.cta-row{display:flex;gap:1rem;margin:1rem 0 1.5rem}
.btn{display:inline-block;padding:.8rem 1rem;border-radius:.75rem;border:1px solid var(--border);font-weight:600}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn.ghost{background:transparent;color:var(--text)}
.trust{display:flex;gap:1rem;list-style: "✓  ";padding-left:1rem;color:var(--muted)}
.hero-art svg .hero-bg{fill:url(#g)}
.hero-art svg .b1{fill:var(--accent);opacity:.25}
.hero-art svg .b2{fill:var(--accent);opacity:.15}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{display:block;background:var(--card);border:1px solid var(--border);border-radius:1rem;padding:1rem}
.card h3{margin:.25rem 0 .5rem}
.card span{display:inline-block;margin-top:.5rem}
.testimonials blockquote{background:var(--card);border-left:4px solid var(--accent);padding:1rem;border-radius:.75rem;margin:1rem 0}
.testimonials cite{display:block;color:var(--muted);margin-top:.5rem}
.cta-banner{background:linear-gradient(45deg, var(--bg-soft), transparent);border:1px solid var(--border);padding:2rem;border-radius:1rem;text-align:center}
.projects-list{display:grid;grid-template-columns:1fr;gap:1rem}
.project{background:var(--card);border:1px solid var(--border);border-radius:1rem;padding:1rem}
.meta{display:flex;gap:1rem;list-style:none;padding:0;color:var(--muted);margin:.25rem 0 1rem}
.site-footer{border-top:1px solid var(--border);margin-top:3rem}
.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.fineprint{color:var(--muted);font-size:.9rem}
/* Responsive */
@media (max-width: 900px){
  .hero{grid-template-columns:1fr}
  .grid-3,.cards{grid-template-columns:1fr}
  .menu{display:none;flex-direction:column;background:var(--bg-soft);position:absolute;right:1rem;top:62px;padding:1rem;border:1px solid var(--border);border-radius:.75rem}
  .nav-toggle{display:inline-block;background:transparent;border:1px solid var(--border);border-radius:.6rem;padding:.4rem .6rem;color:var(--text)}
  .footer-grid{grid-template-columns:1fr}
}
