/* Dark theme with green accents. Plain CSS, no frameworks. */
* { box-sizing: border-box; }
:root{
  --bg:#0b0f0b;
  --panel:#0f1510;
  --fg:#ecfdf5;
  --muted:#9aa7a0;
  --border:#1b2a1e;
  --accent:#22c55e;      /* emerald-500 */
  --accent-2:#16a34a;    /* emerald-600 */
}
html, body { margin:0; padding:0; }
body { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica Neue, Arial, 'Apple Color Emoji','Segoe UI Emoji'; color:var(--fg); background:var(--bg); }
img { max-width:100%; height:auto; display:block; }
a { color:var(--fg); text-decoration:none; }
a.link { color:var(--accent); text-decoration:underline; }
a.link:hover{ color:var(--fg); text-decoration:none; }
.container{ max-width:1100px; margin:0 auto; padding:0 16px; }

/* Nav */
.nav{ position:sticky; top:0; z-index:20; background:rgba(11,15,11,.85); backdrop-filter:saturate(180%) blur(8px); border-bottom:1px solid var(--border); }
.nav__inner{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; }
.logo{ font-weight:800; letter-spacing:.2px; color:var(--fg); }
.menu a{ margin-left:20px; font-size:14px; color:var(--muted); }
.menu a:hover, .menu a:focus{ color:var(--fg); }
.cta{ display:inline-flex; align-items:center; justify-content:center; padding:8px 14px; border-radius:12px; background:var(--accent); color:#041107; font-weight:700; }
.cta:hover{ background:var(--accent-2); color:#eafff3; }

/* Sections */
.section{ padding:64px 0; }
.section--divider{ background:var(--panel); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.section__head h2{ margin:0; }
.lead{ margin-top:12px; font-size:18px; color:var(--muted); }
.muted{ color:var(--muted); }
.micro{ font-size:12px; color:var(--muted); }
.small{ font-size:14px; color:var(--muted); }
.m-top{ margin-top:12px; }

/* Hero */
.hero{ background:linear-gradient(180deg, #0c120c 0%, #0b0f0b 100%); }
.hero__grid{ display:grid; grid-template-columns:1fr; gap:24px; }
@media(min-width:768px){ .hero__grid{ grid-template-columns:1fr 1fr; } }
h1{ font-size:40px; line-height:1.1; margin:0; }
@media(min-width:768px){ h1{ font-size:48px; } }

/* Cards & grid */
.card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:24px; box-shadow:0 1px 2px rgba(0,0,0,.25); }
.grid-3{ display:grid; grid-template-columns:1fr; gap:16px; }
@media(min-width:768px){ .grid-3{ grid-template-columns: repeat(3, 1fr); } }
.grid-2{ display:grid; grid-template-columns:1fr; gap:16px; }
@media(min-width:768px){ .grid-2{ grid-template-columns: repeat(2, 1fr); } }
.center{ display:flex; align-items:center; justify-content:center; }
.center-left{ display:flex; align-items:center; }
.logo-img{ height:40px; width:auto; filter: brightness(0) saturate(100%) invert(88%) sepia(12%) saturate(595%) hue-rotate(86deg) brightness(95%) contrast(88%); }

/* Buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border-radius:12px; background:var(--accent); color:#041107; font-weight:700; }
.btn:hover{ background:var(--accent-2); color:#eafff3; }
.btn.outline{ background:transparent; border:1px solid var(--accent); color:var(--fg); }
.btn.outline:hover{ background:var(--panel); }

/* Lists */
.ul-check{ list-style:none; padding:0; margin:0; }
.ul-check li{ padding-left:26px; position:relative; margin:8px 0; color:var(--muted); }
.ul-check li::before{ content:'✓'; position:absolute; left:0; top:0; color:var(--accent); font-weight:900; }

/* FAQ */
.faq{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:18px 20px; margin:12px 0; }
.faq > summary{ cursor:pointer; font-weight:600; color:var(--fg); }
.faq > p{ margin:8px 0 0; color:var(--muted); }

/* Footer */
.footer{ border-top:1px solid var(--border); background:#0a0e0a; }
.footer__row{ display:flex; align-items:center; gap:12px; padding:8px 0; }
.footer__row.wrap{ flex-wrap:wrap; }
.badge{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:999px; border:1px solid var(--accent); color:var(--accent); font-weight:800; font-size:13px; }
.dot{ color:#1f2b21; margin:0 4px; }

/* Utility */
.kicker{ text-transform:uppercase; letter-spacing:.18em; font-size:12px; color:var(--accent); font-weight:800; }
hr.soft{ border:0; border-top:1px solid var(--border); margin:24px 0; opacity:.6; }