:root{
  --noite:#0b0f23; --noite-2:#141a37;
  --ouro:#d9b25f; --ouro-escuro:#a8863c;
  --texto-2:#c5c9df; --texto-3:#8a8eac;
  --linha:rgba(255,255,255,.1);
  --f:"Montserrat", system-ui, sans-serif;
  --raio:18px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--f);color:#fff;background:var(--noite);-webkit-font-smoothing:antialiased;line-height:1.55;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 60% at 50% 0%,var(--noite-2) 0%,var(--noite) 60%,#070915 100%)}
#estrelas{position:fixed;inset:0;z-index:0;pointer-events:none}
.pagina{position:relative;z-index:1;max-width:460px;margin:0 auto;padding:18px 16px 56px}

/* ---------- barra de cima: partilhar ---------- */
.barra-topo{display:flex;justify-content:flex-end}
.circ{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--linha);background:rgba(255,255,255,.04);color:#fff;cursor:pointer;transition:background .2s,border-color .2s}
.circ:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25)}
.circ svg{width:18px;height:18px}

/* ---------- topo ---------- */
.topo{text-align:center;margin-top:-8px}
.retrato{position:relative;width:210px;margin:0 auto}
.retrato img{display:block;width:100%;position:relative}
.retrato::before{content:"";position:absolute;left:50%;top:52%;width:240px;height:240px;margin:-120px 0 0 -120px;border-radius:50%;
  background:radial-gradient(circle,rgba(217,178,95,.22),transparent 65%)}
.topo h1{font-weight:700;font-size:28px;margin:12px 0 0;letter-spacing:-.2px}
.topo .marca{font-weight:600;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--ouro);margin-top:2px}
.topo p{color:var(--texto-2);font-size:14.5px;margin:14px auto 0;max-width:350px}
.topo p b{color:#fff;font-weight:600}
.redes{display:flex;justify-content:center;gap:10px;margin-top:18px}


/* ---------- grupos com espaço entre si ---------- */
.grupo{display:flex;flex-direction:column;gap:14px;margin-top:64px}
.topo + .grupo{margin-top:48px}
.grupo-cab{padding:0 4px;margin-bottom:6px}
.grupo-cab h2{font-weight:700;font-size:20px;margin:0;letter-spacing:-.1px}
.grupo-cab h2::before{content:"";display:block;width:28px;height:2px;border-radius:2px;background:var(--ouro);margin-bottom:12px}
.grupo-cab p{margin:6px 0 0;color:var(--texto-2);font-size:14.5px}
.grupo .news{margin-top:6px}

/* ---------- banners modernizados ---------- */
.lista{display:flex;flex-direction:column;gap:12px;margin-top:28px}
.banner{--cor:#5b4b8a;position:relative;display:flex;align-items:center;gap:14px;min-height:78px;padding:11px 12px;border-radius:var(--raio);overflow:hidden;
  color:#fff;text-decoration:none;isolation:isolate;border:1px solid rgba(255,255,255,.09);background:#11152e;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s}
.banner .fundo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:.55;filter:saturate(.75);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.banner::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,#11152e 0%,rgba(17,21,46,.94) 40%,rgba(17,21,46,.55) 75%,rgba(17,21,46,.25) 100%),linear-gradient(90deg,color-mix(in srgb,var(--cor) 38%,transparent),transparent 60%)}
.banner:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--aro,#fff) 55%,transparent)}
.banner:hover .fundo{transform:scale(1.06)}
.banner:active{transform:scale(.985)}
.rosto{width:54px;height:54px;border-radius:50%;flex:none;object-fit:cover;border:2px solid color-mix(in srgb,var(--aro,#fff) 85%,transparent)}
.banner .txt{min-width:0;flex:1}
.banner small{display:block;font-weight:500;font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--aro,#fff);opacity:.9;line-height:1.3}
.banner b{display:block;font-weight:600;font-size:17px;letter-spacing:.1px;line-height:1.2;margin-top:2px}
.seta{width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;background:transparent;color:rgba(255,255,255,.6);transition:transform .25s,background .25s}
.seta svg{width:16px;height:16px}
.banner:hover .seta{transform:translateX(3px);color:#fff}

/* cores (as mesmas dos banners atuais) */
.c-floresta{--cor:#4f6a45;--aro:#b9d3a3}
.c-terra{--cor:#8f5236;--aro:#f2c3a0}
.c-lilas{--cor:#6a58b0;--aro:#c9bdf5}
.c-whats{--cor:#2f8a2a;--aro:#25d366}
.c-insta{--cor:#8e37a8;--aro:#f58529}
.c-yt{--cor:#a8202a;--aro:#ff4a4a}

/* ---------- destaque grande (Vive-te) ---------- */
.destaque{position:relative;display:block;border-radius:var(--raio);overflow:hidden;color:#fff;text-decoration:none;aspect-ratio:4/3;isolation:isolate;border:1px solid rgba(255,255,255,.08);transition:transform .25s}
.destaque:hover{transform:translateY(-2px)}
.destaque .fundo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:40% 20%;transition:transform .8s}
.destaque:hover .fundo{transform:scale(1.05)}
.destaque::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(17,21,46,0) 35%,rgba(17,21,46,.7) 65%,#11152e 100%)}
.destaque .etq{position:absolute;top:12px;left:12px;font-weight:500;font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;padding:7px 11px;border-radius:999px;background:rgba(11,15,35,.55)}
.destaque .baixo{position:absolute;left:0;right:0;bottom:0;padding:18px;display:flex;align-items:flex-end;gap:14px}
.destaque .rosto{width:48px;height:48px;--aro:#c9bdf5}
.destaque .t{flex:1}
.destaque small{display:block;font-weight:500;font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:#c9bdf5}
.destaque b{display:block;font-weight:600;font-size:24px;line-height:1.1;margin-top:3px}
.destaque p{margin:6px 0 0;font-size:14px;color:#e6e2f6}
.destaque .seta{background:rgba(255,255,255,.14);color:#fff;width:40px;height:40px}

/* ---------- mosaico 2 colunas (redes) ---------- */
.mosaico{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{--cor:#8e37a8;position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:1/.82;padding:12px;background:#11152e;border-radius:var(--raio);overflow:hidden;color:#fff;text-decoration:none;isolation:isolate;border:1px solid rgba(255,255,255,.08);transition:transform .25s}
.tile:hover{transform:translateY(-2px)}
.tile .fundo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:.4;filter:saturate(.7)}
.tile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(17,21,46,.55),#11152e 85%),linear-gradient(160deg,color-mix(in srgb,var(--cor) 40%,transparent),transparent 70%)}
.tile .cima{display:flex;justify-content:space-between;align-items:flex-start}
.tile .rosto{width:42px;height:42px}
.tile .ic{width:20px;height:20px;opacity:.7}
.tile small{display:block;font-weight:500;font-size:10px;letter-spacing:1.3px;text-transform:uppercase;color:var(--aro);opacity:.9}
.tile b{display:block;font-weight:600;font-size:16px;line-height:1.2}
.tile span.h{font-size:12.5px;opacity:.85}

/* ---------- vídeo ---------- */
.video-wrap .banner{width:100%;font:inherit;text-align:left;cursor:pointer}
.play{width:54px;height:54px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1.5px solid color-mix(in srgb,var(--aro,#fff) 80%,transparent);color:#fff;cursor:pointer}
.play svg{width:18px;height:18px;margin-left:3px}
.video-aberto{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease}
.video-aberto>div{overflow:hidden}
.video-aberto .ecra{margin-top:8px;border-radius:var(--raio);overflow:hidden;aspect-ratio:16/9;position:relative;background:#000}
.video-aberto img{width:100%;height:100%;object-fit:cover;opacity:.7}
.video-aberto span{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;letter-spacing:1.4px;text-transform:uppercase}
.video-wrap.aberto .video-aberto{grid-template-rows:1fr}
.video-wrap.aberto .seta{transform:rotate(90deg)}

/* ---------- áudio ---------- */
.audio .play .pa{display:none;margin:0}
.audio.tocar .play .pl{display:none}
.audio.tocar .play .pa{display:block}
.audio .ondas{display:flex;align-items:center;gap:3px;height:18px;margin-top:6px}
.audio .ondas i{width:3px;border-radius:2px;background:rgba(255,255,255,.4)}
.audio .ondas i.ja{background:#fff}
.audio.tocar .ondas i{animation:onda .9s ease-in-out infinite alternate}
@keyframes onda{to{transform:scaleY(.45)}}
.audio .tempo{font-weight:600;font-size:12px;opacity:.85;align-self:flex-start}

/* ---------- newsletter ---------- */
.news{margin-top:26px;border-radius:var(--raio);padding:24px 18px;border:1px solid var(--linha);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
.news .cab{display:flex;gap:12px;align-items:center;margin-bottom:16px}
.news .rosto{width:48px;height:48px;--aro:var(--ouro)}
.news h2{font-weight:700;font-size:18px;margin:0;line-height:1.25}
.news p{margin:2px 0 0;color:var(--texto-2);font-size:13.5px}
.news input[type=text],.news input[type=email]{width:100%;height:50px;border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:0 16px;font:400 16px var(--f);color:#fff;background:rgba(255,255,255,.05);margin-bottom:10px;transition:border-color .2s,box-shadow .2s}
.news input::placeholder{color:var(--texto-3)}
.news input:focus{outline:none;border-color:var(--ouro);box-shadow:0 0 0 3px rgba(217,178,95,.22)}
.news label{display:flex;gap:10px;font-size:13px;color:var(--texto-2);margin:6px 0 16px;cursor:pointer;line-height:1.45}
.news label input{width:20px;height:20px;flex:none;margin:0;accent-color:var(--ouro)}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:52px;border:none;border-radius:12px;background:var(--ouro);color:#1f1806;font:700 14px var(--f);letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:background .2s,transform .15s}
.btn:hover{background:#e6c277}
.btn:active{transform:scale(.985)}

footer{text-align:center;margin-top:64px;font-size:12px;color:var(--texto-3);line-height:1.8}
footer a{color:var(--texto-2);text-decoration:none}

/* janela partilhar */
.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,120px);background:#fff;color:#141a37;font-weight:600;font-size:14px;padding:12px 18px;border-radius:12px;z-index:9;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.toast.ver{transform:translate(-50%,0)}

@media (max-width:360px){.banner b{font-size:19px}.destaque b{font-size:28px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.aviso-news{margin:0 0 12px;padding:10px 12px;border-radius:10px;font-size:13.5px;border:1px solid rgba(127,224,166,.45);background:rgba(127,224,166,.08)}
.aviso-news.erro{border-color:rgba(255,157,147,.45);background:rgba(255,157,147,.08)}
.armadilha{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.tile .ic svg{width:100%;height:100%;display:block}