@font-face{
  font-family:"Anton";
  src:url("/fonts/anton.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap;
}

:root{
  --ink:#050505; --ink-2:#0C0C0E; --ink-3:#141417;
  --pink:#FF2D8F; --pink-2:#ED1E79;
  --white:#FFFFFF; --mute:#A79BA3; --mute-2:#8F8494;
  --hair:rgba(255,255,255,.12); --hair-2:rgba(255,255,255,.06);
  --teal:#2FD3A5; --gold:#F5C24B;
  --display:"Anton",Impact,system-ui,sans-serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,"Helvetica Neue",sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --gut:clamp(20px,5vw,64px);
  color-scheme:dark;
}

*{box-sizing:border-box}
body{
  margin:0;background:var(--ink);color:var(--white);
  font-family:var(--sans);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--pink);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--pink);outline-offset:3px;border-radius:4px}

.wrap{max-width:760px;margin:0 auto;padding:0 var(--gut)}

/* topo */
.top{
  border-bottom:1px solid var(--hair);
  padding:18px 0;position:sticky;top:0;z-index:10;
  background:rgba(5,5,5,.88);backdrop-filter:blur(12px);
}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.wm{font-weight:900;letter-spacing:-1px;font-size:20px;color:var(--white);text-decoration:none}
.wm .s{color:var(--pink)}
.back{font-size:13px;color:var(--mute)}

/* cabeçalho */
header.hd{padding:clamp(44px,7vw,76px) 0 clamp(28px,4vw,40px)}
.lbl{
  font-size:10.5px;font-weight:800;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--mute-2);margin:0 0 14px;
}
h1{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(34px,6.6vw,58px);line-height:1.02;margin:0;
}
.ver{
  font-family:var(--mono);font-size:12px;color:var(--mute-2);
  margin-top:16px;display:block;
}

/* corpo */
main{padding-bottom:clamp(56px,8vw,96px)}
main h2{
  font-size:clamp(17px,2.4vw,20px);font-weight:800;letter-spacing:-.2px;
  margin:44px 0 12px;padding-top:22px;border-top:1px solid var(--hair-2);
}
main h2:first-child{border-top:0;padding-top:0;margin-top:8px}
main h3{font-size:15px;font-weight:800;margin:26px 0 8px;color:var(--white)}
main p{color:var(--mute);margin:0 0 14px}
main ul,main ol{color:var(--mute);margin:0 0 14px;padding-left:22px}
main li{margin-bottom:7px}
main strong{color:var(--white);font-weight:700}
main code{
  font-family:var(--mono);font-size:13px;background:var(--ink-3);
  padding:2px 6px;border-radius:4px;color:var(--white);
}

/* destaques */
.card{
  background:var(--ink-2);border:1px solid var(--hair);
  border-radius:14px;padding:clamp(20px,3.4vw,28px);margin:24px 0;
}
.card.warn{border-color:rgba(245,194,75,.34);background:rgba(245,194,75,.05)}
.card.go{border-color:rgba(47,211,165,.34);background:rgba(47,211,165,.05)}
.card > :last-child{margin-bottom:0}
.card .lbl{margin-bottom:10px}

.steps{list-style:none;padding:0;counter-reset:st}
.steps li{
  counter-increment:st;position:relative;padding-left:44px;
  margin-bottom:18px;color:var(--mute);
}
.steps li::before{
  content:counter(st);position:absolute;left:0;top:-1px;
  width:28px;height:28px;border-radius:99px;
  background:var(--pink);color:var(--white);
  font-size:13px;font-weight:800;
  display:grid;place-items:center;
}
.steps li b{color:var(--white)}

table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--hair-2);vertical-align:top}
th{
  font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;
  color:var(--mute-2);border-bottom-color:var(--hair);
}
td{color:var(--mute)}
td:first-child{color:var(--white);font-weight:600}

.btn{
  display:inline-block;background:var(--pink);color:var(--white);
  font-weight:800;font-size:15px;padding:14px 26px;border-radius:99px;
  text-decoration:none;margin-top:6px;
}
.btn:hover{background:var(--pink-2);text-decoration:none}

/* rodapé */
footer{border-top:1px solid var(--hair);padding:36px 0 48px;font-size:13px}
footer p{color:var(--mute-2);margin:0 0 6px}
footer .ent{color:var(--mute);font-weight:600}
footer nav{margin-bottom:18px;display:flex;gap:20px;flex-wrap:wrap}