/* Pele Porão: a mesma família do arquivo financeiro e do painel de DRE. */
@font-face{font-family:"Visby";src:url("/fonts/VisbyCF-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Visby";src:url("/fonts/VisbyCF-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Visby";src:url("/fonts/VisbyCF-DemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Visby";src:url("/fonts/VisbyCF-ExtraBold.woff2") format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Nineties";src:url("/fonts/Behind-The-Nineties-Bd.woff2") format("woff2");font-weight:700;font-display:swap}
:root{
  --bg:#08090B; --sup:#101216; --sup2:#171A1F; --sup3:#1E2127;
  --bd:#23262D; --bd2:#31353D;
  --txt:#F6F7F9; --txt2:#B4B8C1; --dim:#8A8F99;
  --porao:#F40434; --porao-soft:#FF4A6B; --porao-deep:#B80227;
  --ok:#7FD49A; --atencao:#F5C04E;
  --sans:"Visby",system-ui,sans-serif; --serif:"Nineties",Georgia,serif;
  --ease:cubic-bezier(.2,.7,.25,1); --r:18px; --r-sm:12px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--txt);font-family:var(--sans);line-height:1.5;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}

/* — telas — */
.tela{scroll-margin-top:60px;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:64px clamp(18px,5vw,84px);
  position:relative;overflow:hidden;border-bottom:1px solid var(--bd)}
.kick{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--porao);font-weight:800}
h1{font-family:var(--serif);font-weight:700;font-size:clamp(40px,7.2vw,96px);line-height:.98;letter-spacing:-.01em;margin:18px 0 14px}
h2{font-family:var(--serif);font-weight:700;font-size:clamp(30px,4.6vw,58px);line-height:1.02;margin:14px 0 10px}
h2 em,h1 em{font-style:normal;color:var(--porao)}
.sub{font-size:clamp(15px,1.6vw,19px);color:var(--txt2);max-width:62ch}
.fonte{font-size:12.5px;color:var(--dim);margin-top:auto;padding-top:26px}
.fonte b{color:var(--txt2);font-weight:600}

/* número gigante */
.gigante{font-family:var(--serif);font-size:clamp(64px,12vw,172px);line-height:.95;letter-spacing:-.01em}
.gigante small{font-size:.42em;color:var(--txt2);font-family:var(--sans);font-weight:600;letter-spacing:0}

/* cards e grids */
.grade{display:grid;gap:14px;margin-top:26px}
.card{background:var(--sup);border:1px solid var(--bd);border-radius:var(--r);padding:20px 22px;min-width:0}
.card .rot{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);font-weight:800}
.card .n{font-family:var(--serif);font-size:clamp(26px,3vw,40px);margin-top:6px;white-space:nowrap}
.card .peq{font-size:12.5px;color:var(--txt2);margin-top:4px}
.regua{font-size:12px;color:var(--dim);margin-top:8px;border-top:1px dashed var(--bd2);padding-top:8px}
.regua b{color:var(--txt2)}
.selo-ok{color:var(--ok);font-weight:700}.selo-at{color:var(--atencao);font-weight:700}.selo-rd{color:var(--porao-soft);font-weight:700}

/* foto */
.foto{border-radius:var(--r);object-fit:cover;width:100%;height:100%;filter:saturate(.92)}
.credito{position:absolute;right:18px;bottom:14px;font-size:12px;color:#fffc;background:#0008;padding:4px 10px;border-radius:99px}

/* barras */
.barras{display:flex;flex-direction:column;gap:12px;margin-top:22px}
.linha-barra{display:grid;grid-template-columns:minmax(120px,210px) 1fr auto;gap:12px;align-items:center}
.linha-barra .nome{font-size:14px;color:var(--txt2);font-weight:600}
.trilho{height:14px;background:var(--sup2);border-radius:99px;overflow:hidden;border:1px solid var(--bd)}
.trilho i{display:block;height:100%;background:var(--porao);border-radius:99px;width:0;transition:width 1.1s var(--ease)}
.trilho i.cinza{background:#5A5F6A}.trilho i.suave{background:var(--porao-soft)}
.linha-barra .val{font-family:var(--serif);font-size:19px;white-space:nowrap}
.linha-barra .val small{color:var(--dim);font-family:var(--sans);font-size:12px}

/* tabela da completa */
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{padding:9px 12px;border-bottom:1px solid var(--bd);text-align:right;white-space:nowrap}
th:first-child,td:first-child{text-align:left;white-space:normal}
thead th{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
tr.g td{background:var(--sup2);font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
tr.t td{font-weight:800;background:var(--sup3);font-size:15px}
td.v{font-variant-numeric:tabular-nums}

/* animação de entrada */
.anima{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.anima.viva{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.anima{opacity:1;transform:none;transition:none}.trilho i{transition:none}}
@media print{.anima{opacity:1;transform:none}.tela{min-height:auto;page-break-after:always}}

/* topo fixo discreto */
.topo{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;
  padding:14px clamp(18px,4vw,42px);z-index:50;background:linear-gradient(#08090Bcc,#08090B00);backdrop-filter:blur(6px)}
.topo img{height:22px}
.topo .btn{appearance:none;-webkit-appearance:none;font-family:var(--sans);font-size:13px;font-weight:700;color:var(--txt);
  border:1px solid var(--bd2);border-radius:99px;padding:9px 16px;cursor:pointer;
  text-decoration:none;min-height:40px;display:inline-flex;align-items:center;background:#0a0b0ecc}
.topo .btn:hover{border-color:var(--porao)}
footer{padding:30px clamp(18px,5vw,84px);display:flex;align-items:center;gap:10px;color:var(--dim);font-size:13px}
footer img{height:20px;border-radius:4px}
footer a{color:var(--txt2);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;padding:12px 8px;margin:-12px 0}

@media(max-width:760px){
  .tela{padding:76px 16px 44px}
  .lado{grid-template-columns:1fr !important}
  .lado > div[style*="min-height"]{min-height:230px !important;order:-1}
  .linha-barra{grid-template-columns:1fr auto}
  .linha-barra .nome{grid-column:1/-1}
  .so-desktop{display:none}
}

/* Em tela larga a foto da capa ocupa a metade direita, inteira e legível;
   o texto fica na esquerda e nada cobre o letreiro. */
@media (min-width: 900px), (orientation: landscape) and (max-height: 500px){
  .capa-img{left:auto !important;width:50% !important;opacity:.9 !important;object-position:center 38% !important}
  .capa-veu{background:linear-gradient(90deg,#08090B 44%,#08090B88 58%,#08090B22 100%) !important}
  .capa-txt{max-width:56% !important}
}

/* Celular deitado: a capa é baixa, o kicker não pode nascer atrás da barra. */
@media (orientation: landscape) and (max-height: 500px){
  .capa-txt{padding-top:76px !important}
  .capa-txt h1{font-size:clamp(30px,8vh,44px)}
  .capa-txt .fonte{display:none}
}