/* CLC · tema global — painel de partidas.
   Reveste TODAS as páginas do site (rc/, /co/, /r/, perfis, guias, hubs, institucional)
   mantendo o HTML e o <head> de SEO de cada uma. Só aparência. */

:root{
  --housing:#0B0E13; --panel:#12171F; --cell:#1A212B; --ink:#EDE7D8; --dim:#8E97A6;
  --gold:#F7B32B; --gold-soft:#FFD073; --gold-dim:#8A6520; --gold-ink:#1A1206;
  --live:#F0445A; --line:#232B36; --line-soft:#1B222C; --seam:rgba(247,179,43,.07);
  --sans:'Bricolage Grotesque',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'Martian Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --r:12px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:
    radial-gradient(1200px 620px at 50% -12%,rgba(247,179,43,.07),transparent 62%),
    linear-gradient(180deg,#0D1118,var(--housing) 42%);
  background-attachment:fixed;color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.55;
  font-variation-settings:'wght' 400;
}
img{max-width:100%;height:auto}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold-soft)}
h1,h2,h3,h4{line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(26px,6vw,40px);font-weight:800;font-variation-settings:'wght' 800;letter-spacing:-.01em}
h2{font-size:clamp(19px,4vw,25px);font-weight:800;font-variation-settings:'wght' 800;margin-top:1.4em}
h3{font-size:17px;font-weight:800;font-variation-settings:'wght' 800;margin-top:1.2em}
p{margin:0 0 1em;color:#CFC9BC}
strong,b{font-weight:800;font-variation-settings:'wght' 800;color:var(--ink)}
small,.m{color:var(--dim)}
ul,ol{padding-left:1.15em}
li{margin:.35em 0;color:#CFC9BC}
hr{border:0;border-top:1px solid var(--line);margin:1.6em 0}
code,kbd{font-family:var(--mono);font-size:.85em;background:var(--cell);border:1px solid var(--line-soft);
  border-radius:6px;padding:.15em .4em}
.container{width:min(1120px,100% - 32px);margin-inline:auto}
main.container{padding:22px 0 40px}
.legal,.guide-article{max-width:74ch}
.legal h2,.guide-article h2{margin-top:1.6em}
.legal p,.guide-article p{font-size:16.5px}
.breadcrumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-family:var(--mono);font-size:11px;
  letter-spacing:.04em;color:var(--dim);margin:0 0 18px}
.breadcrumbs a{color:var(--dim)}
.breadcrumbs a:hover{color:var(--gold)}
.bc-sep{color:#3A444F}
.direct-answer{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:10px;padding:14px 16px;font-size:16.5px}

/* ── cabeçalho / navegação (todas as páginas) ─────────────────────────────── */
.site-header{position:sticky;top:0;z-index:40;background:rgba(11,14,19,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.site-header .nav{display:flex;align-items:center;gap:14px;min-height:62px;padding:8px 0}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:800;
  font-variation-settings:'wght' 800;text-decoration:none;flex:0 0 auto}
.brand-mark{width:34px;height:34px;border-radius:50%;border:1px solid var(--gold-dim);object-fit:cover}
.brand-text{display:flex;flex-direction:column;line-height:1.05}
.brand-country,.brand .brand-name{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-soft)}
.brand-name{font-size:14px !important;letter-spacing:.02em !important;color:var(--ink) !important;
  font-family:var(--sans) !important;font-weight:800}
.live-word{color:var(--live)}
.nav-links{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.chip{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--dim);
  background:var(--cell);border:1px solid var(--line);border-radius:999px;padding:7px 11px;white-space:nowrap}
.chip:hover{color:var(--gold);border-color:var(--gold-dim)}
.chip.active{color:var(--gold-ink);background:linear-gradient(180deg,var(--gold-soft),var(--gold));
  border-color:#D89A1F;font-weight:600}
.clc-lang,.lang{display:flex;gap:6px;align-items:center;flex:0 0 auto}
.clc-lang a,.lang a{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--dim);
  border:1px solid var(--line-soft);border-radius:6px;padding:5px 7px}
.clc-lang a.on,.lang a.on{color:var(--gold);border-color:var(--gold-dim)}

/* ── blocos de conteúdo comuns ───────────────────────────────────────────── */
.section{padding:24px 0;border-top:1px solid var(--line-soft)}
.section:first-of-type{border-top:0}
.btn{display:inline-block;font-weight:800;font-variation-settings:'wght' 800;font-size:15px;
  background:linear-gradient(180deg,#FFC451,var(--gold));color:var(--gold-ink);border:1px solid #D89A1F;
  border-radius:9px;padding:12px 16px;text-align:center}
.btn:hover{filter:brightness(1.06);color:var(--gold-ink)}
.btn-ghost{background:transparent;color:var(--gold);border:1px solid var(--gold-dim)}
.cta{display:inline-block;font-weight:800;font-variation-settings:'wght' 800;font-size:15.5px;
  background:linear-gradient(180deg,#FFC451,var(--gold));color:var(--gold-ink);border:1px solid #D89A1F;
  border-radius:10px;padding:13px 18px;text-align:center}
.cta:hover{filter:brightness(1.06);color:var(--gold-ink)}
.card,.panel{background:linear-gradient(180deg,var(--panel),#101620);border:1px solid var(--line-soft);
  border-radius:var(--r);padding:14px}
.grid{display:grid;gap:12px}

/* páginas de modelo: rc/, /co/, /r/, perfil ──────────────────────────────── */
.rc,.wrap,.mw{width:min(760px,100% - 32px);margin:0 auto;padding:24px 0 46px}
.rc .place,.rc .sub{font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--dim);
  text-transform:none;margin:0 0 10px}
.rc h1,.wrap h1{margin:6px 0 10px}
.rc .lang{justify-content:flex-start;margin-bottom:14px}
.rc > p:nth-of-type(2){display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.rc > p:nth-of-type(2) a{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--dim);
  background:var(--cell);border:1px solid var(--line-soft);border-radius:999px;padding:6px 10px}
.rc > p:nth-of-type(2) a:hover{color:var(--gold);border-color:var(--gold-dim)}
.estado{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.05em;color:var(--ink);background:var(--cell);border:1px solid var(--line);
  border-radius:999px;padding:7px 12px;margin:0 0 16px}
.estado .ponto{width:7px;height:7px;border-radius:50%;background:var(--live);
  box-shadow:0 0 0 3px rgba(240,68,90,.18)}
.foto{display:block;width:100%;max-width:420px;margin:0 auto 16px;border-radius:14px;
  border:1px solid var(--line);background:var(--cell);object-fit:cover;object-position:center 18%;
  aspect-ratio:4/5}
.wrap .foto{aspect-ratio:1/1}
.rc .fatos,.dados{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:14px 0 18px}
.rc .fatos li,.dados li{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--dim);
  background:var(--cell);border:1px solid var(--line-soft);border-radius:999px;padding:7px 11px;margin:0}
.dados li b{color:var(--ink);font-weight:600}
.nota{font-size:13.5px;color:var(--dim);border-top:1px solid var(--line-soft);padding-top:12px;margin-top:16px}
.rc .cta,.wrap .cta{display:block;width:100%;max-width:420px;margin:6px auto 16px}
.sub{font-size:15px;color:var(--dim)}
.aviso{margin:16px 0;padding:13px 15px;background:rgba(247,179,43,.06);border:1px solid var(--gold-dim);
  border-radius:10px;font-size:14.5px}
.hero{margin:0 0 22px}
.stage-sfw,.stage{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);
  background:var(--cell);aspect-ratio:16/10;display:flex;align-items:center;justify-content:center}
.stage-sfw img,.stage img{width:100%;height:100%;object-fit:cover}
.ov{position:absolute;inset:auto 0 0 0;padding:14px 15px;background:linear-gradient(180deg,transparent,rgba(11,14,19,.92))}
.ov h2,.ov strong{color:var(--ink);margin:0}
.badge{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--gold-dim);color:var(--gold);border-radius:5px;padding:3px 6px}
.badge.off{border-color:var(--line);color:var(--dim)}
.sobre{margin-top:18px}
.ce-enrich,.ce-hero,.ce-related{margin:18px 0}
.ce-related{display:flex;flex-wrap:wrap;gap:8px}
.ce-related a{font-family:var(--mono);font-size:11px;color:var(--dim);background:var(--cell);
  border:1px solid var(--line-soft);border-radius:999px;padding:6px 10px}
.ce-related a:hover{color:var(--gold);border-color:var(--gold-dim)}
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-soft);margin:0 0 8px}

/* rodapé ─────────────────────────────────────────────────────────────────── */
.site-footer,.footer{border-top:1px solid var(--line);margin-top:26px;padding:26px 0 34px;
  background:linear-gradient(180deg,transparent,#0A0D12);color:var(--dim);font-size:13.5px}
.site-footer a,.footer a{color:var(--dim);border:1px solid var(--line-soft);border-radius:6px;
  padding:7px 9px;font-family:var(--mono);font-size:11px;display:inline-block;margin:3px 0}
.site-footer a:hover,.footer a:hover{color:var(--gold);border-color:var(--gold-dim)}
.site-footer nav,.footer nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.status{font-family:var(--mono);font-size:10.5px;color:var(--dim)}

/* responsivo ─────────────────────────────────────────────────────────────── */
@media (max-width:700px){
  body{font-size:15.5px}
  .site-header .nav{min-height:56px;gap:10px;flex-wrap:wrap}
  .nav-links{order:3;width:100%;margin:0 0 6px;overflow-x:auto;flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav-links::-webkit-scrollbar{display:none}
  .chip{flex:0 0 auto}
  .clc-lang,.lang{margin-left:auto}
  .rc,.wrap,.mw{padding:18px 0 38px}
  .foto{aspect-ratio:4/5}
  .cta{width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}
