/* Mesmo visual da landing (tokens de pages/src/css.css), só o necessário para texto. Sem scripts, sem nada de terceiros. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;src:url(/fonts/bricolage.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/figtree.woff2) format('woff2')}
:root{
  --bg:#F2F7F2; --surface:#FFFFFF; --soft:#E1F0E7; --ink:#0F2A22; --ink2:#44574D; --line:#C6D9CC;
  --brand:#0F7556; --deep:#0B4A38; --amber:#F4B73F; --amber-soft:#FBE8BA;
  --shadow:0 1px 2px rgb(15 58 44 / .06), 0 10px 28px rgb(15 58 44 / .09);
  --r-card:24px;
  --font-d:'Bricolage Grotesque','Figtree',system-ui,sans-serif;
  --font-b:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--font-b);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,p,ul,ol{margin:0}
a{color:var(--brand);font-weight:600;text-underline-offset:4px;text-decoration-thickness:2px;text-decoration-color:var(--line)}
a:hover{text-decoration-color:var(--brand)}
:focus-visible{outline:3px solid var(--brand);outline-offset:3px;border-radius:6px}
.wrap{width:100%;max-width:760px;margin-inline:auto;padding-inline:20px}
@media (min-width:768px){.wrap{padding-inline:32px}}

.top{padding-block:18px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--font-d);font-weight:800;font-size:1.2rem;letter-spacing:-.02em}
.logo{width:40px;height:40px;border-radius:11px;background:url(/logo.webp) center/cover no-repeat;flex:none}

main{padding-block:12px 48px}
.card{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow);padding:28px 22px;display:grid;gap:30px}
@media (min-width:768px){.card{padding:48px 52px}}
h1,h2{font-family:var(--font-d);font-weight:700;letter-spacing:-.02em;text-wrap:balance}
h1{font-weight:800;font-size:clamp(2rem,1.3rem + 3vw,2.9rem);line-height:1.05;letter-spacing:-.03em}
h2{font-size:1.3rem;line-height:1.2;margin-bottom:10px}
.data{color:var(--ink2);font-size:.95rem;margin-top:10px}
.intro{display:grid;gap:12px}
.intro p{color:var(--ink2);text-wrap:pretty}
section p+p,section p+ul,section ul+p,section p+ol{margin-top:10px}
section ol+p{margin-top:20px}
ul,ol{padding-left:22px;display:grid;gap:8px}
li::marker{color:var(--brand)}
ol>li::marker{font-weight:700}
strong{font-weight:700}
.intro .destaque{background:var(--soft);border-radius:16px;padding:16px 18px;font-weight:500;color:var(--ink)}
.destaque strong{display:block;font-family:var(--font-d);font-size:1.12rem;margin-bottom:2px}
.mark{background:linear-gradient(transparent 60%,var(--amber) 60% 90%,transparent 90%);padding-inline:.06em}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border-radius:999px;background:var(--brand);color:#fff;font-weight:700;text-decoration:none;box-shadow:0 6px 18px rgb(15 117 86 / .28);max-width:100%;text-align:center;line-height:1.2}
.btn:hover{background:var(--deep)}
code{font:inherit;font-weight:700;background:var(--amber-soft);padding:1px 7px;border-radius:6px;overflow-wrap:anywhere}

footer{padding-block:8px 48px;color:var(--ink2);font-size:.93rem}
.foot{display:grid;gap:10px;border-top:2px dashed var(--line);padding-top:24px}
.foot strong{color:var(--ink);font-family:var(--font-d);font-size:1.05rem}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot a{color:var(--ink2)}
.foot a[aria-current]{color:var(--ink);text-decoration-color:var(--brand)}