/* Viavista, página "Quanto custa". Identidade Farol: grafite, âmbar, areia. Só escuro, como o app. */
@font-face{font-family:Archivo;font-weight:400;font-display:swap;src:url(/fontes/Archivo-Regular.ttf) format("truetype")}
@font-face{font-family:Archivo;font-weight:600;font-display:swap;src:url(/fontes/Archivo-SemiBold.ttf) format("truetype")}
@font-face{font-family:Archivo;font-weight:700;font-display:swap;src:url(/fontes/Archivo-Bold.ttf) format("truetype")}
@font-face{font-family:ArchivoTitulo;font-weight:800;font-display:swap;src:url(/fontes/Archivo-Titulo.ttf) format("truetype")}
@font-face{font-family:ArchivoMarca;font-weight:800;font-display:swap;src:url(/fontes/Archivo-Marca.ttf) format("truetype")}
:root{--fundo:#0F1214;--cartao:#1A1F22;--asf:#14181A;--asf2:#2C3236;--tx:#F5F2EA;--tx2:#ABB1AC;--ln:#2C3236;--ambar:#FFB224;--on:#1C1403;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--tx);font:400 16px/1.4 Archivo,Arial,sans-serif}
h1,h2,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
a{color:var(--ambar)}
.ic{flex:none}
.mono{font-variant-numeric:tabular-nums;font-weight:600}
.pg{max-width:1080px;margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:max(16px,env(safe-area-inset-top,0px)) max(24px,env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.topo{display:flex;flex-direction:column;gap:10px;min-width:0}
.vey{display:inline-flex;align-items:center;gap:8px;font:800 18px ArchivoMarca,Archivo,Arial,sans-serif;letter-spacing:.07em;color:var(--tx);text-decoration:none;align-self:flex-start;min-height:44px}
.vey .ic-m{flex:none}
h1{font:800 clamp(27px,6.6vw,40px)/1.06 ArchivoTitulo,Archivo,Arial,sans-serif;text-wrap:balance}
.sub{color:var(--tx2);font-size:15px;line-height:1.35;max-width:62ch}
.mapa{display:none}
.mapa path{fill:none;stroke:var(--ambar);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.conta{display:flex;flex-direction:column;gap:12px;min-width:0}
.sim{background:var(--cartao);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:10px}
.ins{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr));gap:8px}
.in{background:var(--fundo);border-radius:11px;padding:8px 11px;display:flex;flex-direction:column;min-width:0;box-shadow:inset 0 0 0 1.5px var(--ln);cursor:text}
.in:focus-within{box-shadow:inset 0 0 0 2px var(--ambar)}
.in>span:first-child{color:var(--tx2);font-size:13px}
.in input{all:unset;width:100%;min-width:0;font:600 24px/1.2 Archivo,Arial,sans-serif;font-variant-numeric:tabular-nums;color:var(--tx);min-height:32px}
.in .pre{display:flex;align-items:baseline;gap:5px;font-size:24px;line-height:1.2}
.in i{font-style:normal;color:var(--tx2);font-size:12.5px}
.seg{display:flex;background:var(--fundo);padding:3px;border-radius:10px}
.seg button{all:unset;flex:1;text-align:center;padding:11px 0;font-weight:600;border-radius:8px;color:var(--tx2);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--ambar);color:var(--on)}
.seg button:focus-visible{outline:2px solid var(--tx);outline-offset:2px}
.res{display:flex;flex-direction:column;gap:2px;padding:2px 2px 0}
.eb{font-size:13px;color:var(--tx2)}
.pc-v{font:800 clamp(28px,8vw,34px)/1.1 ArchivoTitulo,Archivo,Arial,sans-serif;color:var(--ambar)}
.pc-s{font-size:13.5px;color:var(--tx2)}
.falta .pc-s{color:var(--tx)}
.cat li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--ln)}
.cat li .ic{color:var(--ambar)}
.cat li span{flex:1;min-width:0;display:flex;flex-direction:column}
.cat b{font-weight:600}
.cat em{font-style:normal;color:var(--tx2);font-size:13px}
.cat strong{font-size:16px}
.av{display:flex;flex-direction:column;gap:9px;border:1.5px solid var(--ambar);border-radius:14px;padding:12px}
.av b{font:800 18px/1.15 ArchivoTitulo,Archivo,Arial,sans-serif}
.mail{display:flex;gap:8px;flex-wrap:wrap}
.mail input{flex:1 1 160px;min-width:0;min-height:48px;background:var(--fundo);color:var(--tx);border:0;box-shadow:inset 0 0 0 1.5px var(--ln);border-radius:11px;padding:0 12px;font:400 16px Archivo,Arial,sans-serif}
.mail input:focus{outline:none;box-shadow:inset 0 0 0 2px var(--ambar)}
.bt{all:unset;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;background:var(--ambar);color:var(--on);border-radius:11px;font:800 16px ArchivoTitulo,Archivo,Arial,sans-serif;cursor:pointer;text-align:center}
.bt:focus-visible{outline:2px solid var(--tx);outline-offset:2px}
.mais{display:flex;flex-direction:column;gap:12px;min-width:0}
.mais h2{font:800 19px/1.15 ArchivoTitulo,Archivo,Arial,sans-serif;margin-top:6px}
.dias li{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--ln);font-size:15px}
.dias li b{flex:none;width:26px;height:26px;border-radius:7px;background:var(--asf2);display:grid;place-items:center;font-size:13px}
.dias li span{flex:1;min-width:0}
.dias li i{font-style:normal;color:var(--tx2);font-size:14px;flex:none}
.tira{display:flex;align-items:center;gap:10px;background:var(--cartao);border-radius:11px;padding:11px 13px;font-size:15px}
.tira span{flex:1;min-width:0}
.tira b{font-size:19px;color:var(--ambar)}
.nota{color:var(--tx2);font-size:14px;line-height:1.35;max-width:68ch}
.nota b{color:var(--tx)}
.fontes{font-size:13px}
.aviso{display:flex;gap:7px;color:var(--tx2);font-size:14px;line-height:1.3;align-items:flex-start}
.aviso .ic{margin-top:1px}
.lista li a{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--ln);color:var(--tx);text-decoration:none;min-height:48px}
.lista li a:hover b{color:var(--ambar)}
.lista span{flex:1;min-width:0;display:flex;flex-direction:column}
.lista b{font-weight:600;font-size:16px}
.lista em{font-style:normal;color:var(--tx2);font-size:13px}
.lista i{font-style:normal;color:var(--ambar);font-size:14.5px;text-align:right;flex:none}
.pe{display:flex;flex-direction:column;gap:8px;align-items:center;border-top:1px solid var(--ln);padding-top:12px;margin-top:4px}
.pe nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 20px}
.pe a{display:inline-flex;align-items:center;gap:5px;font-weight:600;min-height:44px;text-decoration:none}
.pe p{color:var(--tx2);font-size:13.5px;text-align:center}
:focus-visible{outline:2px solid var(--ambar);outline-offset:2px}
@media (min-width:900px){
  .pg{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);grid-template-areas:"topo conta" "mais conta" "pe pe";gap:20px 40px;padding-block:28px 32px}
  .topo{grid-area:topo}.conta{grid-area:conta;position:sticky;top:20px;align-self:start}.mais{grid-area:mais}.pe{grid-area:pe}
  .mapa{display:block;width:100%;height:auto;max-height:240px;background:var(--asf);border-radius:14px;margin-top:6px}
  .lista-pg{grid-template-columns:minmax(0,760px);grid-template-areas:"topo" "mais" "pe";justify-content:center}
}
