:root{--teal:#0e5963;--teal2:#11434a;--green:#3aa64a;--ink:#f4fbff;--muted:#b4c8cc;--card:#0f2326;--line:rgba(255,255,255,.08)}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;background:
radial-gradient(900px 600px at 85% -10%, rgba(58,166,74,.12),transparent 55%),
radial-gradient(700px 500px at 10% 10%, rgba(14,89,99,.25),transparent 60%),
linear-gradient(180deg,var(--teal),var(--teal2));
color:var(--ink);font:16px/1.6 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial}
.header{max-width:1120px;margin:0 auto;padding:22px 18px;display:flex;align-items:center;justify-content:space-between}
.brand{font:900 22px/1 Inter}.brand .em{color:var(--green)}
.nav{display:flex;gap:20px}.nav a{opacity:.9;font-weight:600}.nav a:hover{opacity:1}
.hero{max-width:1120px;margin:26px auto;padding:28px 22px;border:1px solid var(--line);border-radius:18px;background:rgba(15,35,38,.55);backdrop-filter:blur(6px)}
h1{margin:0 0 8px;font-size:36px}
.sub{color:var(--muted);margin:0 0 14px}
.section{max-width:1120px;margin:0 auto 28px;padding:0 18px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.card{border:1px solid var(--line);background:var(--card);border-radius:14px;overflow:hidden}
.cap{padding:12px}
.tag{display:inline-block;margin-top:6px;padding:5px 9px;border-radius:999px;background:#0d2022;border:1px solid var(--line);font-size:12px;color:var(--muted)}
.btn{padding:11px 16px;border-radius:12px;border:1px solid var(--line);background:#0d2224;font-weight:800}
.btn.primary{background:var(--green);color:#06210a;border:none}