/* Tangerina: home no mesmo mundo da Lupa Pública. O dado é a única coisa forte. Regras no DESIGN.md. */
:root{color-scheme:light;
--fundo:#F5F6F0;--papel:#FFFFFF;--papel2:#E9ECE1;--tinta:#1B2A2C;--suave:#566466;--linha:#D5DACB;--linha-forte:#1B2A2C;
--acento:#0F5A66;--acento-forte:#0B3640;--foco:#0F5A66;--sobre:#FFFFFF;--contorno:#7E8C84;
--f0:#ECEFE6;--f1:#D6E2C3;--f2:#ABCB9A;--f3:#79AE86;--f4:#3A7F6F;--f5:#0F4A55;
--g1:4px;--g2:8px;--g3:12px;--g4:16px;--g5:24px;--g6:32px;--g7:48px;--g8:80px;
--t-xs:13px;--t-s:14px;--t-m:16px;--t-l:18px;--t-xl:clamp(21px,2.2vw,26px);--t-2xl:clamp(30px,4.4vw,48px);
--fonte:Barlow,system-ui,-apple-system,"Segoe UI",sans-serif;--fonte-num:"Barlow Condensed",Barlow,sans-serif;
--rapido:140ms cubic-bezier(.19,1,.22,1);--largura:1240px}
:root[data-tema="escuro"]{color-scheme:dark;
--fundo:#0A1720;--papel:#0F222C;--papel2:#152B36;--tinta:#E8F0EE;--suave:#9DB2B5;--linha:#1D303A;--linha-forte:#56707A;
--acento:#8FD69A;--acento-forte:#D6E48A;--foco:#D6E48A;--sobre:#0A1720;--contorno:#56707A;
--f0:#0F2630;--f1:#1C4A58;--f2:#197072;--f3:#1F8F73;--f4:#62BE7C;--f5:#D6E48A}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--linha) transparent;scroll-padding-top:88px}
::selection{background:var(--acento);color:var(--sobre)}
body{margin:0;background:var(--fundo);color:var(--tinta);font:400 var(--t-m)/1.55 var(--fonte);font-variant-numeric:tabular-nums}
a{color:var(--acento);text-underline-offset:3px;text-decoration-thickness:1px}a:hover{color:var(--acento-forte)}
:focus-visible{outline:2px solid var(--foco);outline-offset:2px}
b,strong{font-weight:500}
p{margin:0}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.envolve{max-width:var(--largura);margin:0 auto;padding:0 var(--g5)}
h2{font-size:var(--t-2xl);font-weight:300;letter-spacing:-.025em;line-height:1.08;margin:0 0 var(--g4);text-wrap:balance}
h3{font-size:var(--t-xl);font-weight:400;letter-spacing:-.01em;line-height:1.2;margin:0 0 var(--g2)}
.fonte{font-size:12px;line-height:1.4;color:var(--suave);margin-top:var(--g4);padding-top:var(--g2);border-top:1px solid var(--linha)}

/* topo */
.topo{position:sticky;top:0;z-index:20;background:var(--fundo);border-bottom:1px solid var(--linha)}
.topo .envolve{display:flex;align-items:center;flex-wrap:wrap;gap:var(--g2) var(--g5);min-height:64px}
.marca{display:flex;align-items:center;gap:var(--g2);font-weight:500;font-size:17px;color:var(--tinta);text-decoration:none}
.marca:hover{color:var(--tinta)}
.marca i{display:block;width:24px;height:24px;background:currentColor;-webkit-mask:url(../img/tangerina.svg) center/contain no-repeat;mask:url(../img/tangerina.svg) center/contain no-repeat}
.topo nav{display:flex;gap:var(--g1);margin-left:auto;font-size:15px}
.topo nav a{padding:9px 10px;color:var(--suave);text-decoration:none;white-space:nowrap}.topo nav a:hover{color:var(--tinta)}
.troca-tema{flex:none;width:42px;height:42px;display:grid;place-items:center;background:none;color:var(--tinta);border:1px solid var(--linha);cursor:pointer}
.troca-tema:hover{border-color:var(--linha-forte)}
[data-tema="escuro"] .troca-tema .lua,[data-tema="claro"] .troca-tema .sol{display:none}
[data-js]{visibility:hidden}.com-js [data-js]{visibility:visible}

/* botões */
.acoes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--g2) var(--g3)}
.bt{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--g4);border:1px solid var(--linha-forte);color:var(--tinta);text-decoration:none;font-size:15px;transition:background var(--rapido),color var(--rapido)}
.bt:hover,.bt--cheio{background:var(--tinta);color:var(--fundo)}.bt--cheio:hover{background:none;color:var(--tinta)}

/* primeira tela: a tese à esquerda, o Brasil à direita */
.abre{display:grid;grid-template-columns:minmax(340px,420px) minmax(0,1fr);gap:0 var(--g6);max-width:var(--largura);margin:0 auto;padding:var(--g5) var(--g5) var(--g4);min-height:calc(100svh - 65px)}
.abre__tese{display:flex;flex-direction:column;min-width:0}
h1{font:300 clamp(56px,min(7.6vw,12svh),116px)/.98 var(--fonte-num);margin:0 0 var(--g4);text-wrap:balance}
.abre__tese>p{font-size:var(--t-l);line-height:1.4;font-weight:300;max-width:38ch;margin-bottom:var(--g5);text-wrap:pretty}
.abre__dado{margin-top:auto;padding-top:var(--g3)}
.abre__numero{display:block;font:300 clamp(44px,6svh,60px)/1 var(--fonte-num)}
.abre__numero small{font-size:.4em;margin-right:.2em;vertical-align:.8em}
.abre__dado p{font-size:var(--t-s);line-height:1.35;color:var(--suave);margin-top:var(--g1);max-width:44ch}.abre__dado .abre__fonte{font-size:12px}
.escala{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin:var(--g3) 0 0;padding:0;list-style:none;font-size:12px;color:var(--suave)}
.escala i{display:block;height:8px;background:var(--fx);margin-bottom:4px}
.e0{--fx:var(--f0)}.e1{--fx:var(--f1)}.e2{--fx:var(--f2)}.e3{--fx:var(--f3)}.e4{--fx:var(--f4)}.e5{--fx:var(--f5)}
.prancha{position:relative;min-width:0;display:flex;background-image:linear-gradient(var(--linha) 1px,transparent 1px),linear-gradient(90deg,var(--linha) 1px,transparent 1px);background-size:110px 110px;background-position:-1px -1px}
.quadro{position:relative;width:100%;aspect-ratio:1;max-height:calc(100svh - 110px);margin:auto}
.quadro svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.ufs path{fill:var(--fx,var(--f0));stroke:var(--contorno);stroke-width:1.6;stroke-linejoin:round;transition:fill-opacity var(--rapido)}
.ufs a{outline:none;cursor:pointer}
.quadro.pronto .ufs path{fill:transparent}
.ufs a:focus-visible path{stroke:var(--tinta);stroke-width:4}
.ufs .realce{fill:none!important;stroke:var(--tinta);stroke-width:4;pointer-events:none}
.cidades path{stroke-width:.8;stroke-linejoin:round}
.dica{position:absolute;z-index:6;pointer-events:none;background:var(--papel);border:1px solid var(--linha-forte);padding:var(--g2) var(--g3);font-size:var(--t-s);line-height:1.4;min-width:190px}
.dica[hidden]{display:none}.dica.fixa{left:0!important;right:0;top:auto!important;bottom:0;pointer-events:auto}.dica a{display:inline-flex;align-items:center;min-height:44px}.dica b{display:block;font-weight:500}.dica span{display:block;color:var(--suave)}
.estados{margin-top:var(--g3);font-size:var(--t-s)}
.estados summary{cursor:pointer;color:var(--acento)}
.estados table{margin-top:var(--g2)}
.rolar{overflow:auto;max-height:420px}

/* seções: uma puxa a outra */
.secao{display:grid;grid-template-columns:minmax(240px,4fr) minmax(0,8fr);gap:var(--g4) var(--g6);padding:var(--g7) 0;border-top:1px solid var(--linha-forte)}
.secao>div{min-width:0}
.secao__tese p{color:var(--suave);max-width:40ch;text-wrap:pretty}
.conta{list-style:none;margin:0;padding:0}
.conta li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--g4);padding:var(--g3) 0;border-bottom:1px solid var(--linha)}
.conta b{font-weight:400}.conta strong{font-weight:300;font-size:var(--t-xl);white-space:nowrap}
.conta span{grid-column:1/-1;font-size:var(--t-s);color:var(--suave)}
.conta i{grid-column:1/-1;display:block;height:10px;background:var(--papel2);margin-top:var(--g1)}
.conta i::before{content:"";display:block;height:100%;width:var(--w);margin-left:var(--m,0);background:var(--c,var(--f4))}
.fecha-conta{margin-top:var(--g3);font-size:var(--t-s);color:var(--suave)}.fecha-conta b{color:var(--tinta);font-weight:500}

.valor{display:block;font:300 clamp(60px,6.4vw,88px)/1 var(--fonte-num);white-space:nowrap}
.valor small{font-size:.32em;margin-right:.18em;vertical-align:.95em}
.anos{list-style:none;margin:var(--g4) 0 0;padding:0;display:grid;gap:3px;font-size:var(--t-s)}
.anos li{display:grid;grid-template-columns:3.2em 1fr 5em;gap:var(--g2);align-items:center}
.anos i{display:block;height:10px;width:var(--w,1px);background:var(--f4)}
.anos em{font-style:normal;text-align:right;color:var(--suave)}
.dupla{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--g6);align-items:start}
table{width:100%;border-collapse:collapse;font-size:15px}
caption{text-align:left;font-size:var(--t-s);color:var(--suave);padding-bottom:var(--g2)}
th,td{text-align:left;padding:9px var(--g2);border-bottom:1px solid var(--linha);vertical-align:top}
th:first-child,td:first-child{padding-left:0}
th{font-size:var(--t-xs);font-weight:400;color:var(--suave);box-shadow:inset 0 -1px 0 var(--linha-forte);white-space:nowrap}
.num{text-align:right;white-space:nowrap}

.mesas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--g6);border-top:1px solid var(--linha-forte)}
.mesa{padding:var(--g4) 0 var(--g5);display:flex;flex-direction:column;gap:var(--g3);min-width:0}
.mesa p{color:var(--suave);max-width:48ch}
.mesa .acoes{margin-top:auto}
.mesa__preco{font-size:var(--t-s);color:var(--suave)}
.mini{list-style:none;margin:0;padding:0;font-size:var(--t-s)}
.mini li{padding:var(--g2) 0;border-top:1px solid var(--linha)}
.mini i{display:block;height:8px;width:var(--w);background:var(--c,var(--f4));margin-bottom:var(--g1)}
.agenda{grid-column:1/-1;border-top:1px solid var(--linha);padding-top:var(--g3);font-size:var(--t-s);color:var(--suave)}

.quem__numero{display:block;font:300 clamp(72px,9vw,120px)/1 var(--fonte-num)}
.quem__dono{font-size:var(--t-l);font-weight:300;max-width:44ch;margin:var(--g2) 0 var(--g5)}
.jeito{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0 var(--g5);border-top:1px solid var(--linha-forte)}
.jeito li{padding:var(--g3) 0;border-bottom:1px solid var(--linha);color:var(--suave);font-size:15px}
.jeito strong{display:block;color:var(--tinta);font-weight:400;font-size:var(--t-l)}

.fecho{padding:var(--g8) 0;border-top:1px solid var(--linha-forte)}
.fecho h2{max-width:18ch;margin-bottom:var(--g5)}

.rodape{border-top:1px solid var(--linha-forte);padding:var(--g5) 0 var(--g6);font-size:var(--t-s);color:var(--suave)}
.rodape .envolve{display:flex;flex-wrap:wrap;gap:var(--g3) var(--g5);align-items:center}
.rodape nav{display:flex;flex-wrap:wrap;gap:var(--g2) var(--g4)}.rodape nav a{color:var(--tinta)}
.rodape p{margin-left:auto}

@media (max-width:980px){
 .abre{display:flex;flex-direction:column;min-height:0;padding:var(--g4)}
 .abre__tese{display:contents}
 h1{order:1}.abre__tese>p{order:2}.abre__tese>.acoes{order:3}.prancha{order:4;margin-top:var(--g4)}.abre__dado{order:5;margin-top:0;padding-top:var(--g3)}
 .quadro{max-height:none}
 .secao{grid-template-columns:1fr;padding:var(--g6) 0}
 .dupla,.mesas{grid-template-columns:1fr}
 .troca-tema{width:44px;height:44px}
}
@media (max-width:560px){
 .topo{position:static}
 .topo nav{order:3;width:100%;margin-left:-10px;flex-wrap:wrap}.topo nav a{padding:10px}
 .troca-tema{margin-left:auto}
 .envolve{padding:0 var(--g4)}
 .rodape p{margin-left:0}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}
