/* Way: folha de estilos do site público. Escrita de raiz para o serviço.
   A linguagem visual (cores da capulana, o símbolo de dois triângulos, a moldura do outdoor) segue o
   conceito final do Wang como inspiração; nenhuma regra foi copiada da maqueta.
   Sem passo de build: CSS nativo, grid, clamp(), prefers-color-scheme e prefers-reduced-motion. */

/* ------------------------------------------------------------------ fontes locais */
@font-face{font-family:"Way Titulos"; src:url("/static/fontes/bricolage-grotesque-latin.woff2?v=a79fdb52") format("woff2");
  font-weight:700 800; font-style:normal; font-display:swap}
@font-face{font-family:"Way Texto"; src:url("/static/fontes/plus-jakarta-sans-latin.woff2?v=153fc85b") format("woff2");
  font-weight:400 700; font-style:normal; font-display:swap}

/* ------------------------------------------------------------------ cores e medidas */
:root{
  --carvao:#101012; --coral:#FF4B3E; --papel:#F5F3EF; --ouro:#E8A93A; --ebano:#1A1410; --rosa:#FFD4CF; --areia:#E6E1D6;
  --fundo:var(--carvao); --texto:var(--papel); --texto-2:#B4B1AA; --linha:#2E2E33; --cartao:#18181B; --campo:#0C0C0E;
  --ligacao:#FF7A70; --foco:#FFB0A8;
  --titulos:"Way Titulos","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --corpo:"Way Texto","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
  --raio:14px; --margem:clamp(14px,4vw,40px); --largura:1180px;
  --banda:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='10'%3E%3Cpath d='M0 0h20L10 10z' fill='%23E8A93A'/%3E%3C/svg%3E");
  --banda-cima:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='10'%3E%3Cpath d='M0 10h20L10 0z' fill='%23E8A93A'/%3E%3C/svg%3E");
  color-scheme:dark;
}
@media (prefers-color-scheme:light){
  :root{ --fundo:var(--papel); --texto:#141416; --texto-2:#55524C; --linha:#D6D1C6; --cartao:#FFFFFF; --campo:#FBFAF7;
    --ligacao:#B8261B; --foco:#B8261B; color-scheme:light; }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:16px}
body{margin:0; min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; background:var(--fundo); color:var(--texto);
  font:400 16px/1.55 var(--corpo); overflow-x:hidden; -webkit-font-smoothing:antialiased}
main{flex:1 0 auto}
img,video,svg{max-width:100%}
[hidden]{display:none !important}
a{color:var(--ligacao); text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
h1,h2,h3{font-family:var(--titulos); font-weight:800; line-height:1.05; letter-spacing:-.02em; margin:0 0 .4em; text-wrap:balance}
p{margin:0 0 1em}
button,input,select,textarea{font:inherit; color:inherit}
:focus-visible{outline:3px solid var(--foco); outline-offset:3px; border-radius:6px}
.so-leitor{position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}
.saltar{position:absolute; left:12px; top:-60px; z-index:50; background:var(--papel); color:var(--carvao); padding:10px 14px; border-radius:10px; font-weight:700}
.saltar:focus{top:12px}
.lead{font-size:clamp(16px,1.6vw,18px); color:var(--texto-2); max-width:62ch}
.pequeno{font-size:14px}

/* ------------------------------------------------------------------ botões */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 16px; border-radius:12px;
  border:1.5px solid var(--linha); background:transparent; color:var(--texto); font-weight:600; font-size:15px; line-height:1.2;
  text-decoration:none; cursor:pointer; transition:border-color .15s, background-color .15s, transform .1s}
.btn:hover{border-color:var(--texto-2)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.55; cursor:progress}
.btn.principal{background:var(--coral); border-color:var(--coral); color:var(--carvao); font-family:var(--titulos); font-weight:800; font-size:16px}
.btn.principal:hover{background:#FF6357; border-color:#FF6357}
.btn.discreto{border-color:transparent; color:var(--texto-2)}
.btn.grande{min-height:52px; padding:12px 22px; font-size:17px}
.btn .numero{font-variant-numeric:tabular-nums; color:var(--texto-2)}
.ligacao{background:none; border:0; padding:6px 2px; min-height:32px; color:inherit; text-decoration:underline; text-underline-offset:3px; cursor:pointer; font-size:13px; font-weight:600}
.ligacao-forte{font-weight:700; font-family:var(--titulos); font-size:17px}
.ligacao-forte::after{content:" \2192"}
.abanar{animation:abanar .32s}
@keyframes abanar{25%{transform:translateX(-3px) rotate(-2deg)} 75%{transform:translateX(3px) rotate(2deg)}}

/* ------------------------------------------------------------------ cabeçalho e logótipo */
.topo{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px var(--margem);
  padding-top:max(12px, env(safe-area-inset-top)); max-width:calc(var(--largura) + 2 * var(--margem)); width:100%; margin:0 auto}
.logo{display:inline-flex; align-items:center; gap:9px; margin:0; color:var(--texto); text-decoration:none; font-family:var(--titulos);
  font-weight:800; font-size:30px; line-height:1; letter-spacing:-.04em}
.logo-simbolo{width:34px; height:21px; flex:none; overflow:visible; fill:var(--coral)}
.logo-simbolo g{transform-box:fill-box; transform-origin:50% 0}
.logo-palavra{display:inline-flex}
.logo-palavra i{font-style:normal; display:inline-block}
/* Entrada: os triângulos caem como panos de capulana, as letras sobem uma a uma.
   Depois, de tempos a tempos, os triângulos piscam como um pisca de direcção e as letras dão uma onda. */
.logo .s1{animation:cair .65s cubic-bezier(.25,1.5,.5,1) .05s both, pisca 10s ease-in-out 2.2s infinite}
.logo .s2{animation:cair .65s cubic-bezier(.25,1.5,.5,1) .2s both, pisca 10s ease-in-out 2.35s infinite}
.logo-palavra i{animation:subir .5s cubic-bezier(.25,1.4,.5,1) both, onda 10s ease-in-out infinite}
.logo-palavra i:nth-child(1){animation-delay:.35s, 2.6s}
.logo-palavra i:nth-child(2){animation-delay:.43s, 2.68s}
.logo-palavra i:nth-child(3){animation-delay:.51s, 2.76s}
@keyframes cair{from{transform:translateY(-140%); opacity:0} 60%{opacity:1} to{transform:none; opacity:1}}
@keyframes subir{from{transform:translateY(55%); opacity:0}}
@keyframes pisca{0%,80%,100%{opacity:1; transform:none} 83%{opacity:.25; transform:scaleY(.6)} 86%{opacity:1; transform:none} 89%{opacity:.25; transform:scaleY(.6)} 92%{opacity:1; transform:none}}
@keyframes onda{0%,90%,100%{transform:none} 93%{transform:translateY(-18%)} 96%{transform:none}}
.logo:hover .s1,.logo:hover .s2{animation-duration:.65s, 2.5s}

.nav{display:flex; align-items:center; gap:clamp(6px,1.6vw,22px); font-weight:600; font-size:15px}
.nav a:not(.btn){color:var(--texto-2); text-decoration:none; padding:10px 4px; min-height:44px; display:inline-flex; align-items:center}
.nav a:not(.btn):hover,.nav a[aria-current="page"]{color:var(--texto)}
.nav a[aria-current="page"]{text-decoration:underline; text-decoration-color:var(--coral); text-decoration-thickness:2px; text-underline-offset:6px}
.nav .btn.principal{min-height:40px; padding:8px 14px; font-size:15px}
@media (max-width:640px){
  .logo{font-size:26px} .logo-simbolo{width:30px; height:18px}
  .nav a[href="/"],.nav a[href="/mural"]{display:none}
  .nav{gap:10px; font-size:14px}
}

/* ------------------------------------------------------------------ rodapé */
.rodape{margin-top:48px; border-top:1px solid var(--linha); padding:28px var(--margem) calc(28px + env(safe-area-inset-bottom)); font-size:14px; color:var(--texto-2)}
.rodape-dentro{max-width:var(--largura); margin:0 auto; display:grid; gap:14px}
.rodape-marca{margin:0; color:var(--texto)}
.rodape nav{display:flex; flex-wrap:wrap; gap:4px 18px}
.rodape nav a{color:var(--texto-2); padding:8px 0; display:inline-block}
.rodape nav a:hover{color:var(--texto)}
.rodape-nota{margin:0; font-size:13px}

/* ------------------------------------------------------------------ outdoor ao vivo */
.ao-vivo{padding:0 var(--margem)}
.palco{--w:min(calc(100vw - 2 * var(--margem)), calc((100svh - 300px) * 2), 1400px); display:flex; flex-direction:column; align-items:center}
@media (max-aspect-ratio:1/1){ .palco{--w:min(calc(100vw - 2 * var(--margem)), calc((100svh - 330px) * .75), 560px)} }
.palco > *{width:var(--w)}
.estado-ar{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:2px 2px 8px; font-size:14px; font-weight:600; color:var(--texto-2)}
.estado-ar p{margin:0}
.no-ar{display:inline-flex; align-items:center; gap:8px; margin:0; font-weight:600; color:var(--texto-2)}
.no-ar .ponto{width:9px; height:9px; border-radius:50%; background:var(--coral); box-shadow:0 0 0 0 rgba(255,75,62,.6); animation:emissao 1.6s ease-out infinite}
@keyframes emissao{0%{box-shadow:0 0 0 0 rgba(255,75,62,.55)} 70%{box-shadow:0 0 0 9px rgba(255,75,62,0)} 100%{box-shadow:0 0 0 0 rgba(255,75,62,0)}}
.relogio{font-family:var(--titulos); font-weight:800; font-size:20px; color:var(--texto); font-variant-numeric:tabular-nums; min-width:5.2ch}

/* Faixa por cima do outdoor */
.faixa{display:flex; height:clamp(34px,3.4vw,46px); background:#000; color:var(--papel); border-radius:6px 6px 0 0; overflow:hidden}
.faixa-rotulo{flex:none; display:flex; align-items:center; gap:7px; padding:0 12px; background:var(--coral); color:var(--carvao);
  font-family:var(--titulos); font-weight:800; font-size:clamp(13px,1.2vw,16px)}
.faixa-rotulo svg{fill:var(--carvao); width:20px; height:12px}
.faixa-janela{position:relative; flex:1; overflow:hidden; display:flex; align-items:center;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent);
          mask-image:linear-gradient(90deg,transparent,#000 28px,#000 calc(100% - 28px),transparent)}
.faixa-trilho{display:flex; white-space:nowrap; will-change:transform}
.faixa-conjunto{display:flex; flex:none}
.faixa-item{display:inline-flex; align-items:baseline; gap:.55em; padding:0 1em; font-family:var(--titulos); font-weight:700; font-size:clamp(14px,1.4vw,20px)}
.faixa-item b{color:var(--ouro); font-weight:700}
.faixa-item.casa b{color:var(--papel)}
.faixa-item em{font-style:normal; font-family:var(--corpo); font-weight:500; font-size:.75em; color:#B4B1AA}
.faixa-sep{width:18px; height:11px; flex:none; align-self:center; fill:var(--ouro)}
.faixa.parada .faixa-trilho{transform:none !important}

/* A moldura do outdoor: ébano, com as bandas de triângulos a toda a largura */
.outdoor{position:relative; aspect-ratio:2/1; background:var(--ebano); padding:clamp(14px,1.6vw,22px) clamp(8px,.9vw,12px); border-radius:0 0 6px 6px}
@media (max-aspect-ratio:1/1){ .outdoor{aspect-ratio:3/4} }
.outdoor::before,.outdoor::after{content:""; position:absolute; left:0; right:0; height:clamp(8px,.8vw,11px); background-repeat:repeat-x; background-size:auto 100%}
.outdoor::before{top:clamp(3px,.3vw,5px); background-image:var(--banda)}
.outdoor::after{bottom:clamp(3px,.3vw,5px); background-image:var(--banda-cima)}
.ecra{position:relative; width:100%; height:100%; background:#000; overflow:hidden; container-type:size; isolation:isolate}
.pernas{width:calc(var(--w) * .44) !important; display:flex; justify-content:space-between; height:clamp(10px,2vh,22px)}
.pernas i{width:clamp(10px,1vw,14px); background:#2A2520}
@media (prefers-color-scheme:light){ .pernas i{background:var(--ebano)} }
.placa{display:flex; justify-content:space-between; gap:10px; margin:6px 0 0; font-size:13px; font-weight:600; color:var(--texto-2)}
.contador{font-variant-numeric:tabular-nums; white-space:nowrap}

/* Peças no ecrã. O rolo: a peça nova desce de cima, a velha sai por baixo, com travagem mecânica. */
.peca{position:absolute; inset:0; background:#000; color:var(--papel)}
.peca.a-entrar{z-index:2; animation:rolo-entra 1.1s cubic-bezier(.65,0,.3,1) both}
.peca.a-sair{z-index:1; animation:rolo-sai 1.1s cubic-bezier(.65,0,.3,1) both}
.peca.a-entrar::after{content:""; position:absolute; left:0; right:0; top:100%; height:6cqh; background:linear-gradient(rgba(0,0,0,.65),transparent)}
@keyframes rolo-entra{from{transform:translateY(-100%)} 88%{transform:translateY(1%)} 95%{transform:translateY(-.3%)} to{transform:none}}
@keyframes rolo-sai{to{transform:translateY(100%)}}
.peca.a-entrar .p-ident *{animation:none !important}

.p-media{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.p-fundo{position:absolute; inset:-6%; width:112%; height:112%; max-width:none; object-fit:cover; filter:blur(28px) brightness(.45); display:none}
.encaixe .p-fundo{display:block}
.encaixe .p-media{object-fit:contain}
.p-legenda{position:absolute; left:3cqw; right:auto; bottom:4cqh; z-index:3; max-width:62cqw; background:rgba(16,16,18,.9); color:var(--papel);
  padding:1.8cqh 2.4cqw; border-radius:1.4cqh; border-left:.9cqh solid var(--coral)}
.p-legenda b{display:block; font-family:var(--titulos); font-weight:800; font-size:clamp(14px,4.8cqh,42px); line-height:1.05}
.p-legenda small{display:block; margin-top:.5cqh; font-size:clamp(11px,2.6cqh,18px); opacity:.8}
.p-buzinas{position:absolute; right:3cqw; top:3cqh; z-index:4; display:none; background:rgba(16,16,18,.9); color:var(--papel); font-weight:700;
  font-size:clamp(11px,3cqh,22px); padding:.8cqh 1.8cqw; border-radius:999px}
.p-buzinas.mostrar{display:block}

.p-ident{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4cqh; background:var(--carvao)}
.p-ident-linha{display:flex; align-items:center; gap:3cqw}
.p-ident svg{height:22cqh; width:auto; fill:var(--coral); overflow:visible}
.p-ident svg g{transform-box:fill-box; transform-origin:50% 0}
.p-ident .s1{animation:cair .7s cubic-bezier(.25,1.5,.5,1) .1s both}
.p-ident .s2{animation:cair .7s cubic-bezier(.25,1.5,.5,1) .28s both}
.p-ident-palavra{display:inline-flex; font-family:var(--titulos); font-weight:800; font-size:30cqh; line-height:1; letter-spacing:-.05em}
.p-ident-palavra i{font-style:normal; display:inline-block; animation:subir .55s cubic-bezier(.25,1.4,.5,1) both}
.p-ident-palavra i:nth-child(1){animation-delay:.5s} .p-ident-palavra i:nth-child(2){animation-delay:.6s} .p-ident-palavra i:nth-child(3){animation-delay:.7s}
.p-ident p{margin:0; font-size:clamp(13px,4.6cqh,30px); font-weight:600; color:#B4B1AA; animation:aparecer .5s ease 1s both}
.p-ident .p-pausa{font-size:clamp(11px,3cqh,20px)}
@keyframes aparecer{from{opacity:0}}

.p-cartao,.p-livre{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; padding:7cqh 6cqw}
.p-cartao h2,.p-livre h2{margin:0; font-size:clamp(26px,15cqh,150px); line-height:.95; letter-spacing:-.03em; max-width:16ch; overflow-wrap:anywhere}
.p-etiqueta{margin:0 0 3cqh; font-weight:700; font-size:clamp(12px,3.4cqh,24px); text-transform:uppercase; letter-spacing:.08em}
.p-assina{position:absolute; left:6cqw; bottom:5cqh; margin:0; font-size:clamp(11px,2.8cqh,18px); font-weight:600; opacity:.75}
.cor-coral{background:var(--coral); color:var(--carvao)}
.cor-ouro{background:var(--ouro); color:var(--ebano)}
.cor-papel{background:var(--papel); color:var(--carvao)}
.cor-base{background:var(--carvao); color:var(--papel)} .cor-base h2{color:var(--coral)}
.p-livre{background:repeating-linear-gradient(-45deg,#121214 0 22px,#17171A 22px 44px); color:var(--papel); border:.6cqh dashed #3A3A40}
.p-livre .p-etiqueta{color:var(--ouro)}
.p-livre p:last-child{margin:3cqh 0 0; font-size:clamp(13px,4cqh,28px); color:#B4B1AA; font-weight:600}
@container (max-aspect-ratio:1/1){
  .p-cartao h2,.p-livre h2{font-size:clamp(26px,9.5cqh,120px)}
  .p-ident-linha{flex-direction:column; gap:3cqh}
  .p-ident svg{height:11cqh}
  .p-ident-palavra{font-size:22cqw}
  .p-legenda{max-width:none; right:3cqw}
  .p-legenda b{font-size:clamp(14px,3.8cqh,34px)}
}

/* Acções debaixo do outdoor */
.accoes{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:16px auto 0; max-width:900px}
@media (max-width:520px){
  .accoes .btn.principal{flex:1 0 100%}
  .accoes .btn:not(.principal){flex:1 1 auto; padding:10px 10px; font-size:14px}
}

/* Blocos da página inicial e do Sobre */
.bloco{max-width:var(--largura); margin:clamp(36px,6vw,64px) auto 0}
.bloco h2{font-size:clamp(26px,3.6vw,40px)}
.bloco-cabeca{display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap}
.vazio{color:var(--texto-2); list-style:none; padding:6px 0}
.avisos{list-style:none; margin:14px 0 0; padding:0; display:grid; gap:12px; grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.aviso a{display:block; height:100%; padding:14px 16px; border-radius:var(--raio); background:var(--papel); color:var(--carvao); text-decoration:none; transition:transform .15s}
.aviso a:hover{transform:translateY(-2px)}
.aviso small,.poster small{display:block; font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.06em}
.aviso b{display:block; margin:4px 0; font-family:var(--titulos); font-size:21px; line-height:1.08}
.aviso span{display:block; font-size:14px; line-height:1.45; color:#3A3832}
.aviso a,.poster,.peca-mural{box-shadow:inset 0 0 0 1px rgba(16,16,18,.1)}
.cat-negocio a,.poster.cat-negocio,.peca-mural.cat-negocio{background:#FFFFFF}
.cat-aviso a,.poster.cat-aviso,.peca-mural.cat-aviso{background:var(--ouro)}
.cat-perdido a,.poster.cat-perdido,.peca-mural.cat-perdido{background:var(--rosa)}
.cat-evento a,.poster.cat-evento,.peca-mural.cat-evento{background:var(--areia)}
.passos{list-style:none; counter-reset:passo; margin:16px 0 18px; padding:0; display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.passos li{counter-increment:passo; padding:16px 16px 16px 60px; position:relative; border:1px solid var(--linha); border-radius:var(--raio); background:var(--cartao)}
.passos li::before{content:counter(passo); position:absolute; left:16px; top:14px; width:32px; height:32px; border-radius:50%; background:var(--coral); color:var(--carvao);
  font:800 17px/32px var(--titulos); text-align:center}
.passos b{display:block; font-family:var(--titulos); font-size:19px; margin-bottom:2px}
.passos span{color:var(--texto-2); font-size:15px}

/* ------------------------------------------------------------------ Sobre */
.sobre{padding:0 var(--margem)}
.heroi{max-width:var(--largura); margin:clamp(24px,6vw,72px) auto 0}
.sobretitulo{font-weight:700; color:var(--ligacao); text-transform:uppercase; letter-spacing:.08em; font-size:13px; margin-bottom:10px}
.heroi h1{font-size:clamp(44px,9vw,104px); line-height:.92; letter-spacing:-.045em; max-width:12ch}
.heroi-lead{font-size:clamp(18px,2.1vw,22px); line-height:1.5; max-width:46ch; color:var(--texto-2); margin-top:18px}
.heroi-botoes{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px}
.passos.grandes li{padding:20px 20px 20px 66px}
.nota-ensaio{border:1.5px dashed var(--ouro); border-radius:12px; padding:12px 14px; font-size:14.5px; max-width:70ch}
.nota-ensaio p{margin:0}
.nota-ensaio b{color:var(--ouro)}
@media (prefers-color-scheme:light){ .nota-ensaio{border-color:#A86F10} .nota-ensaio b{color:#8A5A0C} }
.duas-colunas{display:grid; gap:4px 32px; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); max-width:980px; color:var(--texto-2)}
.ofertas{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.oferta{border:1px solid var(--linha); border-radius:18px; padding:22px; background:var(--cartao)}
.oferta.destaque{border:2px solid var(--coral)}
.oferta h3{font-size:28px}
.oferta p{color:var(--texto-2)}
.oferta-etiqueta{display:inline-block; font-weight:700; font-size:13px; padding:4px 10px; border-radius:999px; background:var(--ouro); color:var(--ebano)}
.oferta.destaque .oferta-etiqueta{background:var(--coral); color:var(--carvao)}
.lista-bairros{list-style:none; padding:0; margin:12px 0 0; display:flex; flex-wrap:wrap; gap:8px}
.lista-bairros a{display:inline-flex; align-items:center; min-height:44px; padding:8px 14px; border:1.5px solid var(--linha); border-radius:999px; color:var(--texto); text-decoration:none; font-weight:600}
.lista-bairros a:hover{border-color:var(--coral)}
.perguntas details{border-bottom:1px solid var(--linha); max-width:820px}
.perguntas summary{cursor:pointer; list-style:none; padding:16px 36px 16px 0; position:relative; font-family:var(--titulos); font-weight:700; font-size:clamp(18px,2vw,21px)}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary::after{content:"+"; position:absolute; right:6px; top:12px; font-size:26px; color:var(--coral); transition:transform .2s}
.perguntas details[open] summary::after{transform:rotate(45deg)}
.perguntas details p{color:var(--texto-2); margin:0 0 18px; max-width:68ch}
.final{text-align:center; padding:28px 0 8px}

/* ------------------------------------------------------------------ páginas de formulário, murais, anúncio */
.folha-pagina{width:min(760px, calc(100% - 2 * var(--margem))); margin:clamp(16px,4vw,40px) auto 0}
.folha-pagina.larga{width:min(1180px, calc(100% - 2 * var(--margem)))}
.folha-pagina h1{font-size:clamp(34px,6vw,56px)}
.folha-pagina.centro{text-align:center} .folha-pagina.centro .lead{margin-inline:auto}
.migalhas{font-size:14px; color:var(--texto-2); margin-bottom:8px}
.cartao-form{position:relative; background:var(--cartao); border:1px solid var(--linha); border-radius:18px; padding:28px clamp(16px,3vw,26px) 22px; margin-top:20px}
.cartao-form::before{content:""; position:absolute; top:0; left:0; right:0; height:10px; border-radius:18px 18px 0 0; background:var(--ebano) var(--banda) repeat-x; background-size:auto 100%}
.cartao-form h2{font-size:26px}
.campo{margin:0 0 16px; border:0; padding:0; min-width:0}
.rotulo{display:block; font-weight:700; font-size:14px; margin-bottom:6px; padding:0}
input[type=text],input[type=tel],input[type=password],textarea,select{width:100%; min-height:46px; border:1.5px solid var(--linha); background:var(--campo); color:var(--texto);
  padding:10px 12px; font-size:16px; border-radius:10px}
textarea{resize:vertical; min-height:90px}
select option{color:#101012; background:#fff}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:1px; border-color:var(--coral)}
.ajuda{font-size:13.5px; color:var(--texto-2); margin:6px 0 0; line-height:1.45}
.ajuda.passou{color:var(--ligacao); font-weight:700}
.erro{color:var(--ligacao); font-size:14px; font-weight:700; min-height:1.2em; margin:6px 0 10px}
.erro:empty{margin:0; min-height:0}
.duas{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:520px){ .duas{grid-template-columns:1fr} }
.botoes{display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; margin-top:8px}
.botoes.centro{justify-content:center} .botoes.esquerda{justify-content:flex-start}
.segmentos{display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding:4px; border:1.5px solid var(--linha); border-radius:12px; background:var(--campo)}
.segmentos label{position:relative; text-align:center; padding:10px 4px; min-height:44px; display:flex; align-items:center; justify-content:center; border-radius:9px; cursor:pointer; font-weight:600; color:var(--texto-2); font-size:15px}
.segmentos input{position:absolute; opacity:0; pointer-events:none}
.segmentos label:has(input:checked){background:var(--coral); color:var(--carvao); font-weight:700}
.segmentos label:has(input:focus-visible){outline:3px solid var(--foco); outline-offset:2px}
.largar{display:block; border:1.5px dashed var(--linha); border-radius:12px; padding:16px; text-align:center; cursor:pointer; font-weight:600}
.largar:hover{border-color:var(--coral)}
.largar input{display:block; margin:10px auto 0; max-width:100%; font-weight:400; font-size:14px; color:var(--texto-2)}
.previa{margin-top:10px; background:#000; border-radius:10px; overflow:hidden}
.previa img,.previa video{display:block; width:100%; max-height:240px; object-fit:contain}
.bloqueado{opacity:.45}
.publicado{border-color:var(--coral)}

/* Confirmação do número */
.verificar{border:1px solid var(--linha); border-radius:14px; padding:14px; margin-bottom:18px; background:var(--campo)}
.verificar h3{margin:0 0 4px; font-family:var(--corpo); font-size:16px; font-weight:700; letter-spacing:0}
.verificar p{margin:0 0 12px; font-size:14px; color:var(--texto-2); line-height:1.45}
.verificar .nota-ensaio{color:var(--texto)}
.linha-campos{display:flex; gap:8px; flex-wrap:wrap}
.linha-campos input{flex:1 1 150px; min-width:0}
.linha-campos .cresce{flex:3 1 220px}
.linha-campos select{flex:0 1 140px; width:auto}
.indicativo{display:flex; align-items:center; padding:0 12px; border:1.5px solid var(--linha); border-radius:10px; font-weight:600; background:var(--cartao)}
.codigo{letter-spacing:.4em; font-weight:700; font-variant-numeric:tabular-nums}
.confirmado{display:flex; align-items:center; gap:10px; font-weight:600; font-size:15px; flex-wrap:wrap}
.confirmado::before{content:""; width:22px; height:22px; border-radius:50%; flex:none;
  background:var(--ouro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3 3 7-7' fill='none' stroke='%231A1410' stroke-width='2.4'/%3E%3C/svg%3E") center/100% no-repeat}
.confirmado button{margin-left:auto; background:none; border:0; color:var(--texto-2); text-decoration:underline; cursor:pointer; font-size:14px; min-height:44px}

/* Murais */
.grelha-bairros{list-style:none; padding:0; margin:20px 0 0; display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr))}
.bairro-cartao{display:flex; flex-direction:column; gap:4px; padding:18px; border-radius:var(--raio); border:1.5px solid var(--linha); background:var(--cartao); color:var(--texto); text-decoration:none}
.bairro-cartao:hover{border-color:var(--coral)}
.bairro-cartao b{font-family:var(--titulos); font-size:22px}
.bairro-cartao span{color:var(--texto-2); font-size:14px}
.mural-escolha{max-width:320px; margin:0 0 18px}
.posters{list-style:none; padding:0; margin:0; columns:230px; column-gap:12px}
.posters .vazio{column-span:all}
.poster{break-inside:avoid; margin:0 0 12px; padding:16px; border-radius:var(--raio); background:var(--papel); color:var(--carvao)}
.poster h3{margin:4px 0 6px; font-size:22px; line-height:1.05}
.poster p{margin:0; font-size:14.5px; line-height:1.45}
.poster .quando{display:block; margin-top:10px; font-size:12.5px; color:#3A3832}
.poster-accoes{display:flex; gap:14px; margin-top:4px}
.poster .ligacao{color:#2A2824}

/* Página de um anúncio */
.anuncio-peca{display:block}
.peca-midia{border-radius:16px; overflow:hidden; background:#000; aspect-ratio:2/1; border:clamp(8px,1.4vw,14px) solid var(--ebano)}
.peca-midia img,.peca-midia video{display:block; width:100%; height:100%; object-fit:contain}
.peca-legenda{font-size:clamp(28px,5vw,44px); margin-top:16px}
.peca-faixa{background:#000; color:var(--papel); border-radius:16px; padding:clamp(22px,4vw,40px); border-top:10px solid var(--coral)}
.peca-faixa small,.peca-mural small{display:block; font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:13px; margin-bottom:10px}
.peca-faixa small{color:var(--ouro)}
.peca-faixa h1,.peca-mural h1{font-size:clamp(32px,6vw,58px); margin:0}
.peca-mural{border-radius:16px; padding:clamp(22px,4vw,40px); background:var(--papel); color:var(--carvao)}
.peca-mural p{margin:14px 0 0; font-size:18px}
.anuncio-onde{margin:18px 0 12px; font-weight:600}
.partilha{display:flex; flex-wrap:wrap; gap:10px}
.anuncio-nota{margin-top:22px; font-size:14px; color:var(--texto-2)}

/* Painel */
.adm h2{font-size:22px; margin:28px 0 8px}
.adm .accoes{justify-content:flex-start; max-width:none}
.adm table{width:100%; border-collapse:collapse; font-size:13.5px}
.adm th,.adm td{text-align:left; padding:8px 6px; border-bottom:1px solid var(--linha); vertical-align:top}
.adm th{color:var(--texto-2); font-weight:600}
.adm .num{font-variant-numeric:tabular-nums; white-space:nowrap}
.adm .accoes .btn{min-height:36px; padding:6px 10px; font-size:13px; border-radius:8px}
.adm img,.adm video{max-width:220px; max-height:130px; display:block; background:#000; border-radius:6px}
.adm .perigo{background:var(--coral); border-color:var(--coral); color:var(--carvao); font-weight:800}
.adm .estado-pausa{padding:12px; border-radius:12px; border:2px solid var(--coral); font-weight:700; margin:10px 0}
.adm .vazio{padding:4px 0}
.adm code{font-size:13px}
@media (max-width:760px){ .adm table{display:block; overflow-x:auto} }

/* Diálogos e aviso flutuante */
dialog{border:0; padding:0; background:transparent; width:calc(100% - 24px); max-width:540px; color:var(--texto)}
dialog::backdrop{background:rgba(0,0,0,.66)}
.folha-dialogo{position:relative; background:var(--cartao); border:1px solid var(--linha); border-radius:18px; padding:30px 20px 20px; max-height:calc(100dvh - 40px); overflow:auto}
.folha-dialogo::before{content:""; position:absolute; top:0; left:0; right:0; height:10px; border-radius:18px 18px 0 0; background:var(--ebano) var(--banda) repeat-x; background-size:auto 100%}
.folha-dialogo h2{font-size:28px}
.motivos{border:0; padding:0; margin:0 0 14px; display:grid; gap:8px}
.motivos label{display:flex; gap:10px; align-items:center; min-height:46px; border:1.5px solid var(--linha); border-radius:10px; padding:10px 12px; cursor:pointer; font-weight:500}
.motivos input{accent-color:var(--coral); width:18px; height:18px}
.motivos label:has(input:checked){border-color:var(--coral)}
.aviso-flutuante{position:fixed; left:50%; top:calc(14px + env(safe-area-inset-top,0px)); transform:translate(-50%,-16px); z-index:40; max-width:calc(100% - 28px);
  background:var(--papel); color:var(--carvao); font-weight:600; padding:12px 18px; border-radius:12px; text-align:center; opacity:0; pointer-events:none;
  box-shadow:0 10px 30px rgba(0,0,0,.35); transition:opacity .2s, transform .2s}
.aviso-flutuante.mostrar{opacity:1; transform:translate(-50%,0)}

/* ------------------------------------------------------------------ ecrã cheio (/ecra): sem botões nem cursor */
.p-ecra{cursor:none; overflow:hidden; height:100dvh}
.p-ecra .palco{--w:min(98vw, calc((100dvh - 160px) * 2), 2400px)}
@media (max-aspect-ratio:1/1){ .p-ecra .palco{--w:min(98vw, calc((100dvh - 150px) * .75))} }
.ecra-cheio{display:flex; flex-direction:column; height:100dvh; padding:0}
.ecra-topo{display:flex; justify-content:space-between; align-items:center; padding:12px 2vw 8px}
.ecra-cheio .palco{flex:1; justify-content:center}

/* ------------------------------------------------------------------ movimento reduzido */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
  .no-ar .ponto{animation:none}
}