:root{--bg:#e8edf1;--card:#fff;--ink:#14202b;--mute:#5d6b78;--acc:#0b7a75;--onacc:#fff;--line:#d9e0e6;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#0e1620;--card:#18232f;--ink:#e8eef3;--mute:#8b9aa8;--acc:#4fd1c5;--onacc:#06201e;--line:#25323f;color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:"Barlow Semi Condensed",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:500;font-size:18px;line-height:1.6}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:760px;margin:0 auto;padding:max(16px,env(safe-area-inset-top,0px)) 16px 8px}
.logo{font-family:"Bebas Neue",sans-serif;font-size:28px;letter-spacing:.5px;color:var(--ink);text-decoration:none}
.logo em{font-style:normal;color:var(--acc)}
.cta{font-family:"Bebas Neue",sans-serif;font-size:20px;letter-spacing:.5px;background:var(--acc);color:var(--onacc);text-decoration:none;padding:6px 16px;border-radius:999px;white-space:nowrap}
main{max-width:760px;margin:0 auto;padding:8px 16px 24px}
h1,h2{font-family:"Bebas Neue",sans-serif;font-weight:400;letter-spacing:.5px;line-height:1.1}
h1{font-size:44px;margin:16px 0 8px}
h2{font-size:30px;margin:32px 0 6px}
.lead{font-size:20px;color:var(--mute)}
a{color:var(--acc)}
li{margin:4px 0}
.cards{list-style:none;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.cards a{display:block;height:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px;text-decoration:none;color:var(--ink)}
.cards b{display:block;font-family:"Bebas Neue",sans-serif;font-weight:400;font-size:26px;color:var(--acc)}
.cards span{color:var(--mute);font-size:16px;line-height:1.4}
.aviso{margin-top:36px;font-size:15px;color:var(--mute);border-top:1px solid var(--line);padding-top:12px}
footer{max-width:760px;margin:0 auto;padding:8px 16px max(24px,env(safe-area-inset-bottom,0px));font-size:16px;color:var(--mute);text-align:center}
footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin-bottom:6px}
footer a{color:var(--mute)}
