
:root{
  --emerald:#072D25;
  --emerald-deep:#062720;
  --bone:#F4F4F0;
  --ink:#0b1a18;
  --silver:#C0C0C0;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--emerald);background:var(--bone)}
a{color:var(--emerald);text-decoration:none}
header{background:var(--emerald-deep);color:#fff;padding:16px}
header .wrap{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
nav a{color:#fff;margin:0 10px;font-weight:600;opacity:.9}
nav a:hover{opacity:1;text-decoration:underline}
.hero{display:grid;place-items:center;min-height:54vh;text-align:center;padding:64px 16px;background:linear-gradient(180deg,#062720, #0b342b);color:#fff}
.hero h1{font-size:40px;margin:0 0 8px}
.hero p{opacity:.9;max-width:720px;margin:0 auto 16px}
.btn{display:inline-block;padding:12px 18px;border-radius:999px;border:1px solid #fff;color:#fff}
.btn:hover{background:rgba(255,255,255,.08)}
.section{max-width:1100px;margin:0 auto;padding:56px 16px}
h2{font-size:32px;margin:0 0 16px}
.card{background:#fff;border:1px solid #e6ebe8;border-radius:16px;padding:20px;margin:12px 0}
.grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:860px){.grid{grid-template-columns:1fr 1fr}}
footer{background:var(--emerald-deep);color:#fff;padding:24px;margin-top:40px}
footer .wrap{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:6px}
details{background:#fff;border:1px solid #e6ebe8;border-radius:12px;padding:14px;margin:10px 0}
summary{cursor:pointer;font-weight:600}
.small{font-size:14px;opacity:.85}
