/* Guia de criativos Le Salis. Pele: molde do PDF v8 (topo e rodapé pretos, Bebas Neue, Poppins, acento Hudson). */
@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url(/fontes/poppins-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url(/fontes/poppins-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url(/fontes/poppins-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url(/fontes/poppins-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Poppins";font-weight:700;font-display:swap;src:url(/fontes/poppins-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-weight:700;font-display:swap;src:url(/fontes/poppins-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Visby CF";font-weight:400;font-display:swap;src:url(/fontes/VisbyCF-Regular.otf) format("opentype")}
@font-face{font-family:"Visby CF";font-weight:600;font-display:swap;src:url(/fontes/VisbyCF-DemiBold.otf) format("opentype")}
@font-face{font-family:"Visby CF";font-weight:800;font-display:swap;src:url(/fontes/VisbyCF-ExtraBold.otf) format("opentype")}
@font-face{font-family:"Behind The Nineties";font-weight:700;font-display:swap;src:url(/fontes/Behind-The-Nineties-Bd.otf) format("opentype")}

:root{
  --ink:#0B0B0B;--ink2:#1B1B1F;--paper:#FFFFFF;--soft:#F3F3F3;--line:#E2E2E2;
  --text:#141414;--muted:#6B6B70;--hudson:#4562FF;--hudson-deep:#2F47D6;--hudson-soft:#ECEFFF;
  --bad:#B4232A;--good:#1E7A44;
  --disp:"Bebas Neue","Arial Narrow",Impact,sans-serif;
  --body:"Poppins","Visby CF",system-ui,sans-serif;
  --label:"Visby CF","Poppins",system-ui,sans-serif;
  --serif:"Behind The Nineties",Georgia,serif;
  --ease:cubic-bezier(.2,.7,.25,1);
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#2A2A2E}
body{font-family:var(--body);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

/* ---------- palco (modo apresentação) ---------- */
.deck{position:fixed;inset:0;overflow:hidden}
.slide{position:absolute;left:50%;top:50%;width:1280px;height:720px;margin:-360px 0 0 -640px;background:var(--paper);
  display:flex;flex-direction:column;overflow:hidden;visibility:hidden;opacity:0;transition:opacity .36s var(--ease),visibility 0s .36s;transform-origin:center center}
.slide.ativo{visibility:visible;opacity:1;transition:opacity .36s var(--ease)}

/* topo preto */
.topo{background:var(--ink);color:#fff;padding:18px 40px 16px;display:flex;flex-direction:column;gap:6px;flex:none;position:relative}
.marca{display:flex;align-items:center;gap:14px}
.marca a{display:block;line-height:0;border-radius:4px}
.marca a:focus-visible{outline:3px solid var(--hudson);outline-offset:3px}
.marca img{height:22px;width:auto}
.marca .sep{width:1px;height:20px;background:#4A4A4F}
.marca b{font:600 15px/1 var(--body);letter-spacing:.5px}
.marca .tag{margin-left:auto;font:600 10px/1 var(--label);letter-spacing:1.6px;text-transform:uppercase;color:#C6C6C4;display:flex;align-items:center;gap:8px}
.marca .tag::before{content:"";width:6px;height:6px;background:var(--hudson)}
.chapeu{font:700 10.5px/1.2 var(--body);letter-spacing:2.2px;text-transform:uppercase;color:#A9A9AD;margin-top:8px}
h1,h2{font-family:var(--disp);font-weight:400;text-transform:uppercase;letter-spacing:.5px;line-height:.92}
.topo h2{font-size:52px}
.topo .sub{font:400 14px/1.4 var(--body);color:#C6C6C4;max-width:900px}
.topo .big{position:absolute;right:40px;bottom:16px;background:var(--hudson);color:#fff;display:flex;align-items:center;gap:14px;padding:12px 22px}
.topo .big b{font:400 56px/0.9 var(--disp)}
.topo .big span{font:600 13px/1.25 var(--body);max-width:150px}

/* corpo */
.corpo{flex:1;min-height:0;padding:18px 40px 14px;display:flex;flex-direction:column;gap:12px}
.rodape{background:var(--ink);color:#C6C6C4;flex:none;height:34px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;font:400 11px/1 var(--body)}
.rodape b{color:#fff;font-weight:700}
.rodape .pg{font-variant-numeric:tabular-nums}

/* blocos */
.g{display:grid;gap:14px;min-height:0}
.row{display:flex;gap:14px;min-height:0}
.card{border:1px solid var(--line);background:#fff;padding:14px 16px;display:flex;flex-direction:column;gap:6px;min-width:0;position:relative}
.card.top{border-top:4px solid var(--ink)}
.card.azul{border-top:4px solid var(--hudson)}
.card.cinza{background:var(--soft);border-color:var(--soft)}
.card h3,.h3{font:400 26px/0.95 var(--disp);text-transform:uppercase;letter-spacing:.4px}
.card p,.p{font:400 13px/1.45 var(--body);color:#2B2B2E}
.mut{color:var(--muted)}
.lbl{font:700 10px/1.2 var(--body);letter-spacing:1.6px;text-transform:uppercase;color:var(--muted)}
.num{font:400 64px/0.88 var(--disp);letter-spacing:.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.num.xl{font-size:96px}
.num.az{color:var(--hudson)}
.num small{font-size:.45em;letter-spacing:.3px}
.fonte{font:400 9.5px/1.35 var(--body);color:var(--muted);margin-top:auto;padding-top:6px;border-top:1px solid var(--line)}
.fonte.solta{border:0;padding:0;margin:0}
.selo{display:inline-flex;align-items:center;gap:6px;background:var(--hudson);color:#fff;font:700 10px/1 var(--body);letter-spacing:1.4px;text-transform:uppercase;padding:6px 10px;align-self:flex-start}
.selo.escuro{background:var(--ink)}
.selo.claro{background:var(--hudson-soft);color:var(--hudson-deep)}
.frase{font:600 15px/1.4 var(--body);color:var(--ink);border-left:4px solid var(--hudson);padding:8px 14px;background:var(--hudson-soft)}
.frase.escura{background:var(--ink);color:#fff;border-color:var(--hudson)}
.az{color:var(--hudson)}

/* figura de criativo */
.cri{position:relative;background:var(--ink);overflow:hidden;flex:none}
.cri img{width:100%;height:100%;object-fit:cover}
.cri .fmt{position:absolute;left:6px;top:6px;background:rgba(11,11,11,.82);color:#fff;font:700 9px/1 var(--body);letter-spacing:1px;padding:4px 6px}
.cri .pos{position:absolute;right:6px;top:6px;background:var(--hudson);color:#fff;font:400 20px/1 var(--disp);padding:4px 7px 2px}
.mesma{opacity:.4;filter:grayscale(1)}
.mesma-selo{position:absolute;inset:auto 0 0 0;background:var(--ink);color:#fff;font:700 9px/1.2 var(--body);letter-spacing:1px;text-transform:uppercase;padding:5px 6px;text-align:center}

/* tabela */
table{border-collapse:collapse;width:100%;font:400 12.5px/1.3 var(--body)}
th{font:700 9.5px/1.2 var(--body);letter-spacing:1.3px;text-transform:uppercase;color:var(--muted);text-align:left;padding:7px 8px;border-bottom:2px solid var(--ink)}
td{padding:7px 8px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;vertical-align:middle}
td.n,th.n{text-align:right}
tr.nos td{background:var(--hudson-soft);font-weight:600}

/* barras */
.barra{height:12px;background:var(--soft);position:relative;overflow:hidden}
.barra i{position:absolute;inset:0 auto 0 0;width:var(--v);background:var(--ink);transform-origin:left;transition:transform .9s var(--ease)}
.barra.az i{background:var(--hudson)}
.vbars{display:flex;align-items:flex-end;gap:14px;height:100%}
.vbar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px;min-width:0}
.vbar i{display:block;width:100%;height:var(--v);background:var(--ink);transform-origin:bottom;transition:transform .9s var(--ease)}
.vbar.az i{background:var(--hudson)}
.vbar.cz i{background:#BDBDC2}
.vbar b{font:400 26px/1 var(--disp)}
.vbar span{font:600 11px/1.2 var(--body);color:var(--muted);text-align:center}

/* fluxo */
.fluxo{display:flex;align-items:stretch;gap:0}
.fluxo .passo{flex:1;border:1px solid var(--line);border-top:4px solid var(--ink);padding:14px;display:flex;flex-direction:column;gap:6px;background:#fff;min-width:0}
.fluxo .seta{flex:none;width:34px;display:flex;align-items:center;justify-content:center;color:var(--hudson);font:700 22px/1 var(--body)}
.fluxo .passo .n{font:400 44px/0.9 var(--disp);color:var(--hudson)}

/* navegação */
.nav{position:fixed;right:18px;bottom:16px;z-index:20;display:flex;gap:8px;align-items:center}
.nav button,.nav a{min-width:44px;height:44px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;background:rgba(11,11,11,.9);color:#fff;border:1px solid #3A3A3F;font:600 13px/1 var(--body);text-decoration:none}
.nav button:focus-visible,.nav a:focus-visible{outline:3px solid var(--hudson);outline-offset:2px}
.nav .cont{background:transparent;border:0;color:#E8E8E8;font-variant-numeric:tabular-nums;padding:0 6px;min-width:0}
.nav a.verde{background:var(--hudson);border-color:var(--hudson)}
.prog{position:fixed;left:0;top:0;height:3px;background:var(--hudson);z-index:20;transition:width .36s var(--ease)}

/* animação de entrada */
.an{opacity:0;transform:translateY(12px);transition:opacity .52s var(--ease),transform .52s var(--ease);transition-delay:calc(var(--i,0) * 80ms)}
.slide.vis .an{opacity:1;transform:none}
.slide:not(.vis) .barra i{transform:scaleX(0)}
.slide:not(.vis) .vbar i{transform:scaleY(0)}
.slide:not(.vis) .linha-desenho{stroke-dashoffset:var(--len,2000)}
.linha-desenho{stroke-dasharray:var(--len,2000);stroke-dashoffset:0;transition:stroke-dashoffset 1.4s var(--ease) .2s}
svg .bar-svg{transform-box:fill-box;transform-origin:bottom;transition:transform .8s var(--ease)}
.slide:not(.vis) svg .bar-svg{transform:scaleY(0)}

@media (prefers-reduced-motion:reduce){
  .an,.barra i,.vbar i,.linha-desenho,svg .bar-svg,.slide{transition:none!important}
  .an{opacity:1!important;transform:none!important}
  .slide .barra i,.slide .vbar i{transform:none!important}
  .slide svg .bar-svg{transform:none!important}
  .slide .linha-desenho{stroke-dashoffset:0!important}
}

/* ---------- modo leitura (celular, tablet em pé, telas estreitas) ---------- */
body.leitura{background:#1B1B1F}
body.leitura .deck{position:static;overflow:visible;padding:0 0 84px}
body.leitura .slide{position:relative;left:auto;top:auto;margin:0 auto 14px;width:100%;max-width:980px;height:auto;min-height:0;visibility:visible;opacity:1;transform:none!important}
body.leitura .topo{padding:16px 16px 14px}
body.leitura .topo h2{font-size:clamp(34px,8.5vw,52px)}
body.leitura .topo .big{position:static;align-self:flex-start;margin-top:8px}
body.leitura .corpo{padding:14px 16px}
body.leitura .rodape{padding:0 16px;height:auto;min-height:34px;flex-wrap:wrap;gap:4px;padding-top:8px;padding-bottom:8px}
body.leitura .marca .tag{display:none}
body.leitura .g{grid-template-columns:1fr!important}
body.leitura .g.m2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.leitura .row{flex-direction:column}
body.leitura .row.m-keep{flex-direction:row}
body.leitura .fluxo{flex-direction:column}
body.leitura .fluxo .seta{width:auto;height:26px;transform:rotate(90deg)}
body.leitura .so-palco{display:none!important}
body.leitura .rola{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
body.leitura .h-auto{height:auto!important}
body.leitura .nav{left:0;right:0;bottom:0;justify-content:center;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(11,11,11,.94)}
body.leitura .nav .so-palco{display:none}
@media (min-width:640px){body.leitura .g.t2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.leitura .g.t3{grid-template-columns:repeat(3,minmax(0,1fr))!important}}

/* ---------- impressão ---------- */
@media print{
  @page{size:1280px 720px;margin:0}
  html,body{background:#fff}
  .nav,.prog{display:none!important}
  .deck{position:static}
  .slide{position:relative!important;left:auto!important;top:auto!important;margin:0!important;transform:none!important;visibility:visible!important;opacity:1!important;page-break-after:always;break-after:page}
  .an{opacity:1!important;transform:none!important;transition:none!important}
  .barra i,.vbar i,svg .bar-svg{transform:none!important;transition:none!important}
  .linha-desenho{stroke-dashoffset:0!important;transition:none!important}
  body.leitura .slide{width:1280px;max-width:none}
}
body.leitura .mosaico{height:240px!important}
body.leitura .vbars{min-height:240px;height:240px}
body.leitura .card .vbars{flex:none}

/* ---------- celular e tablet: ajustes da conferência de 21/10 ---------- */
.so-leitura{display:none}
body.leitura .so-leitura{display:block}
body.leitura svg .eixo{display:none}
/* navegação deixa de flutuar: vira rodapé da página, nada fica coberto */
body.leitura .deck{padding-bottom:16px}
body.leitura .nav{position:static;padding:14px 16px calc(14px + env(safe-area-inset-bottom));margin-top:0}
/* imagens em grade de 2 colunas, legenda embaixo */
body.leitura .cri-grade{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px!important;height:auto!important}
body.leitura .cri-grade>*{min-width:0}
body.leitura .cri-grade .cri{width:100%!important;height:auto!important;aspect-ratio:9/16}
body.leitura .cri-grade>.cri{aspect-ratio:9/16}
/* tabelas viram cartões empilhados, uma linha por cartão */
body.leitura .rola{overflow:visible}
body.leitura table,body.leitura tbody,body.leitura tr,body.leitura td{display:block;width:auto!important}
body.leitura thead{display:none}
body.leitura tr{border:1px solid var(--line);border-top:3px solid var(--ink);margin-bottom:10px;padding:6px 10px;background:#fff}
body.leitura tr.nos{border-top-color:var(--hudson)}
body.leitura tr.nos td{background:transparent}
body.leitura td{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding:6px 0;text-align:right}
body.leitura td:last-child{border-bottom:0}
body.leitura td::before{content:attr(data-label);font:700 11px/1.2 var(--body);letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-align:left;flex:none}
body.leitura td:first-child{justify-content:flex-start;text-align:left;font-weight:600}
body.leitura td:first-child::before{display:none}
body.leitura td[data-label=""]::before{display:none}
body.leitura td .row{flex-direction:row!important;flex:1;justify-content:flex-end}
body.leitura td .barra{max-width:50%}
/* árvore de pastas quebra linha em vez de arrastar */
body.leitura .arvore{white-space:pre-wrap!important;word-break:break-all;font-size:12px!important;overflow:visible}
/* calendário: lista vertical por mês */
body.leitura .cal-meses{flex-direction:column!important;min-width:0!important}
body.leitura .cal-meses>div{display:flex;flex-wrap:wrap;align-items:center;gap:6px;border-left:0!important;border-top:1px solid var(--line);padding:8px 0!important}
body.leitura .cal-meses>div>b{width:44px}
body.leitura .cal-meses>div>span[style*="display:block"]{display:inline-block!important;margin-top:0!important}
/* fonte mínima de 11px no celular e no tablet */
body.leitura .fonte,body.leitura .lbl,body.leitura .chapeu,body.leitura th,body.leitura .cri .fmt,body.leitura .mesma-selo,body.leitura .rodape{font-size:11px!important}
body.leitura .slide [style*="font-size:9px"],body.leitura .slide [style*="font-size:9.5px"],body.leitura .slide [style*="font-size:10px"],body.leitura .slide [style*="font-size:10.5px"],
body.leitura .slide [style*=" 9px/"],body.leitura .slide [style*=" 9.5px/"],body.leitura .slide [style*=" 10px/"],body.leitura .slide [style*=" 10.5px/"]{font-size:11px!important}
body.leitura .card>.row.m-keep>.cri{width:36%!important;height:auto!important;aspect-ratio:9/16}
body.leitura .selo{font-size:11px!important}
body.leitura .card[style*="flex-direction:row"]>.cri{width:38%!important;height:auto!important;aspect-ratio:9/16}
body.leitura .card[style*="flex-direction:row"]>.cri.quadrado{aspect-ratio:1}
@media (min-width:640px){body.leitura .card[style*="flex-direction:row"]>.cri{width:37%!important}body.leitura .row.m-keep-tab{flex-direction:row}}
body.leitura .encolhe{align-self:center;max-width:100%}
body.leitura .cri-grade .cri img{object-fit:contain;background:#0B0B0B}