:root{
  --brand:#24b47e;
  --brand-dark:#0b3b2e;
  --ink:#132019;
  --muted:#5e6a62;
  --bg:#ffffff;
  --bg-alt:#f7fbf9;
  --card:#ffffff;
  --border:#e1efe7;
  --focus:#0a7a56;
  --header-bg:#ffffffcc;
}
:root[data-theme="dark"]{
  --brand:#24b47e;
  --brand-dark:#0b3b2e;
  --ink:#e7f2ec;
  --muted:#a6b3ab;
  --bg:#0f1713;
  --bg-alt:#121d17;
  --card:#0f1a14;
  --border:#21332a;
  --focus:#37c294;
  --header-bg:#0f1713cc;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}
img{max-width:100%;height:auto;display:block}
.container{width:min(1200px, 92%);margin-inline:auto}

.skip-link{position:absolute;left:-9999px;top:auto}
.skip-link:focus{left:1rem;top:1rem;background:var(--bg);border:2px solid var(--brand);padding:.5rem .75rem;border-radius:.5rem;z-index:1000}

.site-header{position:sticky;top:0;background:var(--header-bg);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--border);z-index:100}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px}
.brand{display:inline-flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none;font-weight:700}
.brand img{filter:saturate(110%)}

.site-nav ul{display:flex;align-items:center;gap:1rem;list-style:none;margin:0;padding:0}
.site-nav a{color:var(--ink);text-decoration:none;padding:.5rem .5rem;border-radius:.375rem}
.site-nav a:hover{background:var(--bg-alt)}
.btn{display:inline-block;background:var(--brand);color:#fff;text-decoration:none;padding:.75rem 1rem;border-radius:.6rem;font-weight:600;border:1px solid transparent}
.btn:hover{filter:brightness(0.95)}
.btn:focus{outline:3px solid var(--focus);outline-offset:2px}
.btn-outline{background:transparent;border-color:var(--brand);color:var(--brand)}
.btn-small{padding:.5rem .75rem}

.nav-toggle{display:none;flex-direction:column;gap:4px;background:transparent;border:0;padding:.5rem;margin-right:-.5rem}
.nav-toggle .bar{width:22px;height:2px;background:var(--ink)}

.hero{padding:clamp(2rem, 6vw, 4rem) 0;background:linear-gradient(180deg, var(--bg) 0%, var(--bg-alt) 100%)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.hero h1{font-size:clamp(2rem, 4vw + 1rem, 3rem);line-height:1.1;margin:0 0 1rem}
.lead{font-size:1.1rem;color:var(--muted);max-width:60ch}
.hero-ctas{display:flex;gap:.75rem;margin-top:1rem;flex-wrap:wrap}
.trust{display:flex;gap:1rem;flex-wrap:wrap;color:var(--muted);padding:0;margin:1rem 0 0;list-style:none}
.hero-art{filter:drop-shadow(0 10px 30px rgba(12,59,46,.08))}

.section{padding:clamp(2.5rem, 6vw, 4rem) 0}
.section.alt{background:var(--bg-alt)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
.cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.25rem}
.card h3{margin-top:0}

.services{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.service{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1rem}
.service h3{margin-top:0}

.stats{list-style:none;padding:0;margin:1rem 0 0;display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:.75rem;color:var(--muted)}
.stat{display:inline-block;font-size:1.35rem;font-weight:800;color:var(--brand);margin-right:.4rem}
.chart-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:.5rem;box-shadow:0 10px 30px rgba(12,59,46,.06)}

.testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.quote{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1rem;color:var(--ink)}
.quote p{margin:.25rem 0 .5rem}
.quote footer{color:var(--muted)}

.contact-points{list-style:none;margin:1rem 0 0;padding:0;color:var(--muted)}
.contact-form{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1rem}
.field{display:flex;flex-direction:column;margin-bottom:.75rem}
label{font-weight:600}
input,textarea{font:inherit;padding:.6rem .7rem;border:1px solid var(--border);border-radius:.5rem}
input:focus,textarea:focus{outline:3px solid var(--focus);outline-offset:2px}
.form-note{color:var(--muted);font-size:.9rem;margin:.75rem 0 0}

.site-footer{border-top:1px solid var(--border);padding:2rem 0;background:var(--bg)}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:1rem;align-items:start}
.footer-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.footer-nav a{color:var(--ink);text-decoration:none}
.footer-nav a:hover{text-decoration:underline}
.legal{color:var(--muted);display:flex;flex-direction:column;gap:.4rem}

@media (max-width: 900px){
  .hero-grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .services{grid-template-columns:1fr 1fr}
  .testimonials{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
  .cards{grid-template-columns:1fr}
  .services{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .nav-toggle{display:flex}
  .site-nav{position:absolute;inset:64px 0 auto 0;background:var(--bg);border-bottom:1px solid var(--border);transform-origin:top;transform:scaleY(0);transition:transform .2s ease;}
  .site-nav.open{transform:scaleY(1)}
  .site-nav ul{flex-direction:column;align-items:stretch;padding:1rem}
  .site-nav a{padding:.75rem}
}

.site-nav li.has-dropdown{position:relative}
.site-nav li.has-dropdown>a::after{content:"\25BE";margin-left:.25rem;font-size:.8em}
.site-nav li.has-dropdown>ul.dropdown{display:none;position:absolute;top:100%;left:0;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:.25rem;min-width:220px;box-shadow:0 10px 30px rgba(12,59,46,.12);z-index:200}
.site-nav li.has-dropdown:hover>ul.dropdown,.site-nav li.has-dropdown:focus-within>ul.dropdown{display:block}
.site-nav li.has-dropdown>ul.dropdown li{list-style:none}
.site-nav li.has-dropdown>ul.dropdown a{display:block;padding:.5rem .75rem;border-radius:.375rem;white-space:nowrap}
.site-nav li.has-dropdown>ul.dropdown a:hover{background:var(--bg-alt)}

@media (max-width: 640px){
  .site-nav li.has-dropdown{position:static}
  .site-nav li.has-dropdown>ul.dropdown{display:block;position:static;border:0;box-shadow:none;padding:0;margin-left:.5rem}
}
