/* assets/css/V2_kariny.css */

:root {
    --fundo: #f7f5ef;
    --papel: #fffdf8;
    --papel-2: #f0f7f3;
    --texto: #17333a;
    --texto-suave: #5f7477;
    --verde-950: #062e31;
    --verde-900: #0a3b3f;
    --verde-800: #105459;
    --verde-700: #146b65;
    --verde-500: #2f9a7d;
    --verde-200: #bfe4d2;
    --verde-100: #e3f3ea;
    --dourado: #e3b44f;
    --dourado-claro: #f8e5ae;
    --coral: #cf526c;
    --coral-escuro: #a93651;
    --erro: #b4233d;
    --sucesso: #18704f;
    --borda: rgba(19, 70, 72, .14);
    --sombra: 0 24px 70px rgba(7, 46, 49, .13);
    --sombra-curta: 0 12px 30px rgba(7, 46, 49, .09);
    --raio: 28px;
    --raio-m: 20px;
    --raio-p: 14px;
    --limite: 1200px;
}

* { box-sizing: border-box; }
html { max-width: 100%; overflow-x: hidden; scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
    margin: 0;
    min-width: 320px;
    max-width: 100%;
    overflow-x: hidden;
    color: var(--texto);
    background: var(--fundo);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { color: inherit; }
.limite { width: min(calc(100% - 40px), var(--limite)); margin-inline: auto; }
.pular-conteudo { position: fixed; z-index: 999; top: 8px; left: 8px; padding: 10px 14px; border-radius: 10px; background: #fff; transform: translateY(-150%); }
.pular-conteudo:focus { transform: none; }

.topo-site {
    position: sticky;
    z-index: 100;
    top: 0;
    border-bottom: 1px solid transparent;
    background: rgba(247, 245, 239, .88);
    backdrop-filter: blur(18px);
    transition: box-shadow .25s ease, border-color .25s ease;
}
.topo-site.rolado { border-color: var(--borda); box-shadow: 0 8px 28px rgba(7, 46, 49, .07); }
.topo-interno { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.marca { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.marca-simbolo {
    position: relative;
    width: 47px;
    height: 47px;
    flex: 0 0 47px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 16px 16px 16px 5px;
    color: #fff;
    background: linear-gradient(145deg, var(--verde-700), var(--verde-950));
    box-shadow: 0 10px 20px rgba(8, 62, 60, .18);
}
.marca-simbolo::before, .marca-simbolo::after, .marca-simbolo i::before, .marca-simbolo i::after {
    content: "";
    position: absolute;
    width: 9px;
    height: 9px;
    border-radius: 50% 50% 50% 2px;
    background: var(--dourado);
    opacity: .92;
}
.marca-simbolo::before { top: 6px; left: 9px; transform: rotate(-28deg); }
.marca-simbolo::after { top: 6px; right: 9px; transform: rotate(118deg); }
.marca-simbolo i::before { top: 15px; left: 5px; transform: rotate(-62deg); }
.marca-simbolo i::after { top: 15px; right: 5px; transform: rotate(152deg); }
.marca-simbolo b { position: relative; z-index: 2; padding-top: 12px; font-size: .78rem; letter-spacing: -.04em; }
.marca-texto { display: grid; line-height: 1.05; }
.marca-texto strong { color: var(--verde-950); font-family: Georgia, "Times New Roman", serif; font-size: 1.13rem; }
.marca-texto small { margin-top: 4px; color: var(--coral-escuro); font-size: .69rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.menu-principal { display: flex; align-items: center; gap: 6px; }
.menu-principal > a, .menu-link { padding: 11px 10px; border: 0; border-radius: 12px; color: #3e5a5e; background: transparent; font-size: .88rem; font-weight: 720; cursor: pointer; }
.menu-principal > a:hover, .menu-principal > a.ativo, .menu-link:hover { color: var(--verde-900); background: rgba(20, 107, 101, .08); }
.menu-link span { display: inline-grid; place-items: center; min-width: 22px; height: 20px; margin-left: 3px; border-radius: 7px; color: #fff; background: var(--coral); font-size: .59rem; }
.menu-botao { display: none; width: 46px; height: 46px; padding: 11px; border: 1px solid var(--borda); border-radius: 14px; background: var(--papel); cursor: pointer; }
.menu-botao span { display: block; width: 100%; height: 2px; margin: 4px 0; border-radius: 2px; background: var(--verde-900); transition: transform .2s, opacity .2s; }
.menu-botao em { position: absolute; width: 1px; height: 1px; overflow: hidden; }

.botao {
    display: inline-flex;
    min-height: 49px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 13px 20px;
    border: 0;
    border-radius: 15px;
    color: #fff;
    background: linear-gradient(135deg, var(--coral), var(--coral-escuro));
    box-shadow: 0 12px 24px rgba(169, 54, 81, .19);
    font-weight: 820;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}
.botao:hover { transform: translateY(-2px); box-shadow: 0 16px 28px rgba(169, 54, 81, .24); }
.botao:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(227, 180, 79, .75); outline-offset: 2px; }
.botao.pequeno { min-height: 42px; padding: 10px 16px; font-size: .84rem; }
.botao.verde { background: linear-gradient(135deg, var(--verde-700), var(--verde-900)); box-shadow: 0 12px 24px rgba(8, 62, 60, .16); }
.botao.claro { color: var(--verde-950); background: #fff; box-shadow: none; }
.botao.contorno { color: var(--verde-900); border: 1px solid rgba(20, 107, 101, .26); background: transparent; box-shadow: none; }

.hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 76px 0 52px;
    color: #fff;
    background:
        radial-gradient(circle at 81% 15%, rgba(227, 180, 79, .22), transparent 25%),
        radial-gradient(circle at 18% 90%, rgba(47, 154, 125, .26), transparent 30%),
        linear-gradient(140deg, var(--verde-950) 0%, #0c4f50 58%, #176b62 100%);
}
.hero::before { content: ""; position: absolute; z-index: -1; width: 610px; height: 610px; top: -300px; right: -160px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; box-shadow: 0 0 0 50px rgba(255,255,255,.025), 0 0 0 100px rgba(255,255,255,.018); }
.hero-grade { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr); align-items: center; gap: 58px; }
.etiqueta { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: var(--dourado-claro); background: rgba(255,255,255,.07); font-size: .72rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.etiqueta::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--dourado); box-shadow: 0 0 0 5px rgba(227,180,79,.13); }
.hero h1 { max-width: 760px; margin: 19px 0 18px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3rem, 6.3vw, 6.35rem); line-height: .91; letter-spacing: -.055em; }
.hero h1 span { display: block; color: var(--dourado); font-style: italic; font-weight: 500; }
.hero-chamada { max-width: 660px; margin: 0; color: rgba(255,255,255,.82); font-size: clamp(1rem, 2vw, 1.23rem); }
.hero-acoes { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 29px; }
.hero-nota { display: flex; align-items: center; gap: 9px; margin-top: 18px; color: rgba(255,255,255,.68); font-size: .79rem; }
.hero-nota i { width: 7px; height: 7px; border-radius: 50%; background: #8ad7b3; }

.arvore-visual { position: relative; min-height: 520px; display: grid; place-items: center; }
.numero-295 { position: absolute; top: -5px; right: 8px; color: rgba(255,255,255,.055); font-family: Georgia, serif; font-size: clamp(10rem, 21vw, 18rem); font-weight: 800; line-height: 1; letter-spacing: -.1em; }
.arvore-copa { position: relative; width: min(440px, 100%); aspect-ratio: 1 / .94; }
.arvore-copa::before { content: ""; position: absolute; left: 50%; bottom: 9%; width: 25px; height: 46%; border-radius: 20px 20px 3px 3px; background: linear-gradient(90deg, #885f39, #b08251 55%, #69452a); transform: translateX(-50%); box-shadow: 0 10px 15px rgba(0,0,0,.14); }
.arvore-copa::after { content: ""; position: absolute; left: 50%; bottom: 4%; width: 64%; height: 18px; border-radius: 50%; background: rgba(0,0,0,.18); filter: blur(7px); transform: translateX(-50%); }
.galho { position: absolute; z-index: 1; left: 50%; bottom: 38%; width: 4px; height: 37%; border-radius: 6px; background: #9d7247; transform-origin: bottom center; }
.galho.g1 { transform: rotate(-55deg); height: 35%; }
.galho.g2 { transform: rotate(-31deg); height: 42%; }
.galho.g3 { transform: rotate(-9deg); height: 45%; }
.galho.g4 { transform: rotate(22deg); height: 43%; }
.galho.g5 { transform: rotate(51deg); height: 37%; }
.folha { position: absolute; z-index: 2; width: 82px; height: 72px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 60% 42% 55% 38%; color: #fff; background: linear-gradient(145deg, rgba(68,177,133,.98), rgba(14,101,91,.98)); box-shadow: 0 17px 34px rgba(0,0,0,.16); transform: rotate(-7deg); }
.folha::after { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(255,255,255,.13); border-radius: inherit; }
.folha b { position: relative; z-index: 1; font-size: 1.08rem; }
.folha small { position: relative; z-index: 1; display: block; margin-top: -8px; color: rgba(255,255,255,.7); font-size: .58rem; text-transform: uppercase; }
.folha.f1 { left: 3%; top: 40%; }
.folha.f2 { left: 17%; top: 13%; transform: rotate(-18deg); }
.folha.f3 { left: 40%; top: 0; width: 90px; height: 82px; }
.folha.f4 { right: 15%; top: 14%; transform: rotate(14deg); }
.folha.f5 { right: 0; top: 41%; transform: rotate(20deg); }
.folha.f6 { left: 27%; top: 39%; background: linear-gradient(145deg, #e2b550, #b97b32); }
.folha.f7 { right: 26%; top: 41%; background: linear-gradient(145deg, #d45d77, #9f334d); }
.arvore-selo { position: absolute; z-index: 4; right: 2%; bottom: 8%; width: 110px; height: 110px; display: grid; place-items: center; padding: 15px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; text-align: center; background: rgba(6,46,49,.88); box-shadow: var(--sombra); backdrop-filter: blur(10px); }
.arvore-selo strong { color: var(--dourado); font-family: Georgia, serif; font-size: 1.6rem; line-height: 1; }
.arvore-selo small { color: rgba(255,255,255,.75); font-size: .62rem; font-weight: 750; text-transform: uppercase; }

.metricas { position: relative; z-index: 5; margin-top: -1px; padding: 0 0 18px; background: var(--verde-950); }
.metricas-grade { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid rgba(255,255,255,.11); border-radius: 0 0 22px 22px; background: rgba(255,255,255,.06); }
.metrica { min-width: 0; padding: 21px 18px; border-right: 1px solid rgba(255,255,255,.1); color: #fff; }
.metrica:last-child { border-right: 0; }
.metrica strong { display: block; color: var(--dourado); font-family: Georgia, serif; font-size: clamp(1.65rem, 3vw, 2.25rem); line-height: 1; }
.metrica span { display: block; margin-top: 6px; color: rgba(255,255,255,.66); font-size: .74rem; font-weight: 700; }

.secao { padding: 92px 0; }
.secao.compacta { padding: 62px 0; }
.secao.verde-claro { background: var(--papel-2); }
.secao.escura { color: #fff; background: var(--verde-950); }
.secao-topo { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 34px; }
.secao-topo > div:first-child { width: 100%; min-width: 0; max-width: 750px; }
.sobrelinha { display: inline-flex; align-items: center; gap: 8px; color: var(--coral-escuro); font-size: .73rem; font-weight: 880; letter-spacing: .11em; text-transform: uppercase; }
.sobrelinha::before { content: ""; width: 24px; height: 2px; background: var(--coral); }
.secao.escura .sobrelinha { color: var(--dourado); }
.secao h2 { margin: 11px 0 10px; color: var(--verde-950); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.15rem, 5vw, 4.25rem); line-height: 1; letter-spacing: -.045em; }
.secao.escura h2 { color: #fff; }
.secao-topo p { max-width: 700px; margin: 0; color: var(--texto-suave); font-size: 1.04rem; }
.secao.escura .secao-topo p { color: rgba(255,255,255,.68); }

.mapa-grade { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(290px, .58fr); gap: 22px; }
.mapa-painel, .mapa-detalhe { border: 1px solid var(--borda); border-radius: var(--raio); background: var(--papel); box-shadow: var(--sombra-curta); }
.mapa-painel { position: relative; min-height: 610px; overflow: hidden; padding: 22px; background: linear-gradient(145deg, #f8fbf7, #e8f2ec); }
.mapa-painel::after { content: "295"; position: absolute; right: 12px; bottom: -30px; color: rgba(10,59,63,.04); font-family: Georgia, serif; font-size: 13rem; font-weight: 900; }
.mapa-controles { position: relative; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mapa-legenda { display: flex; flex-wrap: wrap; gap: 8px; }
.mapa-legenda span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid rgba(19,70,72,.1); border-radius: 999px; color: #4f676b; background: rgba(255,255,255,.72); font-size: .66rem; font-weight: 750; }
.mapa-legenda i { width: 9px; height: 9px; border-radius: 3px; background: #d3d8d4; }
.mapa-legenda .formando i { background: #8bd0ae; }
.mapa-legenda .ativa i { background: var(--verde-700); }
.mapa-legenda .visitada i { background: var(--dourado); }
.mapa-carregando { position: absolute; inset: 0; display: grid; place-items: center; color: var(--verde-800); font-weight: 780; }
.mapa-svg { position: relative; z-index: 2; width: 100%; height: 525px; margin-top: 8px; filter: drop-shadow(0 15px 18px rgba(7,46,49,.12)); }
.mapa-svg path { stroke: rgba(255,255,255,.9); stroke-width: .7; vector-effect: non-scaling-stroke; cursor: pointer; transition: filter .18s, opacity .18s, transform .18s; transform-box: fill-box; transform-origin: center; }
.mapa-svg path:hover, .mapa-svg path:focus { z-index: 3; filter: brightness(1.08) drop-shadow(0 3px 3px rgba(7,46,49,.25)); opacity: 1; outline: none; }
.mapa-svg path.aguardando { fill: #cfd8d2; }
.mapa-svg path.formando { fill: #82c8a6; }
.mapa-svg path.ativa { fill: #176b62; }
.mapa-svg path.visitada { fill: #e3b44f; }
.mapa-detalhe { display: flex; flex-direction: column; min-height: 610px; padding: 26px; }
.mapa-detalhe-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.status-rede { display: inline-flex; align-items: center; min-height: 30px; padding: 6px 10px; border-radius: 999px; color: #496266; background: #edf0ed; font-size: .65rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.status-rede.formando { color: #0a5d43; background: #daf1e4; }
.status-rede.ativa { color: #fff; background: var(--verde-700); }
.status-rede.visitada { color: #6e4811; background: var(--dourado-claro); }
.mapa-detalhe h3 { margin: 27px 0 4px; color: var(--verde-950); font-family: Georgia, serif; font-size: 2.2rem; line-height: 1; }
.mapa-detalhe > p { color: var(--texto-suave); }
.mapa-numeros { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 24px 0; }
.mapa-numeros div { padding: 16px; border: 1px solid var(--borda); border-radius: 17px; background: #f7faf7; }
.mapa-numeros strong { display: block; color: var(--verde-800); font-size: 1.55rem; }
.mapa-numeros small { color: var(--texto-suave); }
.mapa-detalhe-acoes { display: grid; gap: 9px; margin-top: auto; }
.mapa-busca { position: relative; }
.mapa-busca input { width: 100%; min-height: 44px; padding: 10px 14px 10px 38px; border: 1px solid var(--borda); border-radius: 14px; background: rgba(255,255,255,.86); }
.mapa-busca::before { content: "⌕"; position: absolute; z-index: 2; top: 9px; left: 13px; color: var(--verde-700); font-size: 1.2rem; }

.passos-grade { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.passo-card { position: relative; overflow: hidden; min-height: 245px; padding: 25px; border: 1px solid var(--borda); border-radius: var(--raio-m); background: var(--papel); box-shadow: var(--sombra-curta); }
.passo-card::before { content: attr(data-numero); position: absolute; top: -25px; right: -4px; color: rgba(20,107,101,.07); font-family: Georgia, serif; font-size: 7rem; font-weight: 900; }
.passo-icone { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; color: var(--verde-900); background: var(--verde-100); font-size: 1.4rem; }
.passo-card h3 { margin: 22px 0 8px; color: var(--verde-950); font-size: 1.08rem; }
.passo-card p { margin: 0; color: var(--texto-suave); font-size: .9rem; }
.aviso-rede { display: flex; align-items: center; gap: 15px; margin-top: 22px; padding: 17px 20px; border: 1px solid rgba(227,180,79,.33); border-radius: 18px; background: #fff8e7; }
.aviso-rede strong { color: #815a14; }
.aviso-rede p { margin: 3px 0 0; color: #795f2e; font-size: .84rem; }

.gabinete-grade { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 54px; align-items: center; }
.gabinete-manifesto { position: relative; padding: 40px; border: 1px solid rgba(255,255,255,.14); border-radius: 36px; background: linear-gradient(150deg, rgba(255,255,255,.1), rgba(255,255,255,.035)); box-shadow: var(--sombra); }
.gabinete-manifesto::before { content: "“"; position: absolute; top: -10px; left: 22px; color: var(--dourado); font-family: Georgia, serif; font-size: 7rem; line-height: 1; opacity: .7; }
.gabinete-manifesto blockquote { position: relative; margin: 0; font-family: Georgia, serif; font-size: clamp(1.65rem, 3.4vw, 3.1rem); line-height: 1.08; }
.gabinete-manifesto p { margin: 22px 0 0; color: rgba(255,255,255,.68); }
.gabinete-itens { display: grid; gap: 12px; }
.gabinete-item { display: grid; grid-template-columns: 50px 1fr; gap: 14px; padding: 18px; border: 1px solid rgba(255,255,255,.11); border-radius: 18px; background: rgba(255,255,255,.055); }
.gabinete-item span { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; color: var(--dourado); background: rgba(227,180,79,.1); font-size: 1.35rem; }
.gabinete-item strong { display: block; margin-bottom: 4px; }
.gabinete-item p { margin: 0; color: rgba(255,255,255,.64); font-size: .86rem; }

.cards-grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.conteudo-card { position: relative; display: flex; min-height: 300px; flex-direction: column; overflow: hidden; padding: 25px; border: 1px solid var(--borda); border-radius: var(--raio-m); background: var(--papel); box-shadow: var(--sombra-curta); }
.conteudo-card.destaque { color: #fff; background: linear-gradient(145deg, var(--verde-800), var(--verde-950)); }
.conteudo-card .tipo { display: inline-flex; align-self: flex-start; padding: 6px 9px; border-radius: 999px; color: var(--coral-escuro); background: rgba(207,82,108,.09); font-size: .65rem; font-weight: 850; text-transform: uppercase; }
.conteudo-card.destaque .tipo { color: var(--dourado-claro); background: rgba(227,180,79,.12); }
.conteudo-card h3 { margin: 22px 0 9px; color: var(--verde-950); font-family: Georgia, serif; font-size: 1.6rem; line-height: 1.08; }
.conteudo-card.destaque h3 { color: #fff; }
.conteudo-card p { margin: 0; color: var(--texto-suave); font-size: .9rem; }
.conteudo-card.destaque p { color: rgba(255,255,255,.7); }
.conteudo-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 24px; color: var(--verde-700); font-size: .77rem; font-weight: 800; }
.conteudo-card.destaque footer { color: var(--dourado); }
.vazio-elegante { grid-column: 1/-1; padding: 32px; border: 1px dashed rgba(20,107,101,.28); border-radius: 22px; text-align: center; background: rgba(255,255,255,.5); }
.vazio-elegante strong { display: block; color: var(--verde-900); font-family: Georgia, serif; font-size: 1.5rem; }
.vazio-elegante p { margin: 6px 0 0; color: var(--texto-suave); }

.cta-final { padding: 28px 0 92px; }
.cta-caixa { position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; padding: 42px; border-radius: 34px; color: #fff; background: linear-gradient(135deg, var(--coral-escuro), var(--coral) 58%, #e17484); box-shadow: 0 30px 70px rgba(169,54,81,.22); }
.cta-caixa::after { content: "295"; position: absolute; right: 190px; bottom: -65px; color: rgba(255,255,255,.09); font-family: Georgia, serif; font-size: 10rem; font-weight: 900; }
.cta-caixa h2 { position: relative; z-index: 1; margin: 0 0 8px; color: #fff; font-family: Georgia, serif; font-size: clamp(2rem, 4vw, 3.5rem); }
.cta-caixa p { position: relative; z-index: 1; max-width: 680px; margin: 0; color: rgba(255,255,255,.79); }
.cta-caixa .hero-acoes { position: relative; z-index: 2; margin: 0; }

dialog.modal {
    width: min(720px, calc(100% - 24px));
    max-height: min(900px, calc(100dvh - 24px));
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 28px;
    color: var(--texto);
    background: var(--papel);
    box-shadow: 0 35px 100px rgba(3,32,34,.35);
}
dialog.modal::backdrop { background: rgba(3,31,34,.71); backdrop-filter: blur(8px); }
dialog.modal[open] { animation: modalEntrar .24s ease-out; }
@keyframes modalEntrar { from { opacity: 0; transform: translateY(20px) scale(.98); } to { opacity: 1; transform: none; } }
.modal-conteudo { max-height: calc(100dvh - 24px); overflow-y: auto; overscroll-behavior: contain; }
.modal-topo { position: sticky; z-index: 5; top: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 23px 24px 19px; border-bottom: 1px solid var(--borda); background: rgba(255,253,248,.94); backdrop-filter: blur(14px); }
.modal-topo small { display: block; color: var(--coral-escuro); font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.modal-topo h2 { margin: 4px 0 0; color: var(--verde-950); font-family: Georgia, serif; font-size: 1.8rem; line-height: 1; }
.modal-fechar { width: 42px; height: 42px; flex: 0 0 42px; border: 1px solid var(--borda); border-radius: 13px; background: #fff; font-size: 1.15rem; cursor: pointer; }
.formulario { display: grid; gap: 17px; padding: 24px; }
.formulario-intro { margin: 0; padding: 15px 17px; border: 1px solid rgba(20,107,101,.16); border-radius: 16px; color: #466165; background: var(--verde-100); font-size: .85rem; }
.convite-identificado { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; color: #775316; background: #fff5d9; }
.convite-identificado span { width: 39px; height: 39px; display: grid; place-items: center; flex: 0 0 39px; border-radius: 13px; background: var(--dourado-claro); }
.convite-identificado strong { display: block; }
.convite-identificado small { display: block; color: #8a6e3b; }
.campo-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.campo { display: grid; gap: 7px; min-width: 0; }
.campo.span-2 { grid-column: 1/-1; }
.campo > label, .campo > span { color: #2d4c50; font-size: .78rem; font-weight: 820; }
.campo input, .campo select, .campo textarea {
    width: 100%;
    min-height: 50px;
    padding: 12px 14px;
    border: 1px solid rgba(19,70,72,.2);
    border-radius: 14px;
    color: var(--texto);
    background: #fff;
    transition: border-color .18s, box-shadow .18s;
}
.campo textarea { min-height: 130px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { border-color: var(--verde-500); box-shadow: 0 0 0 4px rgba(47,154,125,.11); outline: 0; }
.campo small { color: var(--texto-suave); font-size: .7rem; }
.grupo-opcoes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.checagem { display: flex; align-items: flex-start; gap: 10px; min-height: 48px; padding: 11px 12px; border: 1px solid rgba(19,70,72,.14); border-radius: 14px; color: #405b5f; background: #fff; cursor: pointer; }
.checagem input { width: 19px; height: 19px; flex: 0 0 19px; margin: 1px 0 0; accent-color: var(--verde-700); }
.checagem span { font-size: .77rem; line-height: 1.4; }
.checagem strong { color: var(--verde-900); }
.checagem a { text-decoration: underline; }
.checagem.compacta { min-height: 0; padding: 10px; }
.formulario-acoes { position: sticky; bottom: 0; display: flex; align-items: center; justify-content: flex-end; gap: 9px; margin: 3px -24px -24px; padding: 16px 24px calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--borda); background: rgba(255,253,248,.95); backdrop-filter: blur(14px); }
.assistente-aviso { display: flex; gap: 10px; padding: 13px 15px; border-radius: 15px; color: #5f4c22; background: #fff5d9; font-size: .77rem; }
.assistente-aviso strong { color: #7a5517; }
.assistente-resposta { min-height: 170px; padding: 19px; border: 1px solid var(--borda); border-radius: 18px; background: var(--verde-100); }
.assistente-resposta strong { display: block; color: var(--verde-900); }
.assistente-resposta p { margin: 7px 0 0; color: #405e5d; }
.assistente-sugestoes { display: flex; flex-wrap: wrap; gap: 7px; }
.assistente-sugestoes button { padding: 8px 10px; border: 1px solid var(--borda); border-radius: 999px; color: var(--verde-800); background: #fff; font-size: .7rem; font-weight: 750; cursor: pointer; }

.toast { position: fixed; z-index: 500; top: 90px; left: 50%; width: min(520px, calc(100% - 28px)); display: flex; align-items: flex-start; gap: 12px; padding: 15px 17px; border: 1px solid rgba(255,255,255,.35); border-radius: 17px; color: #fff; background: var(--verde-900); box-shadow: var(--sombra); transform: translateX(-50%); }
.toast.erro { background: var(--erro); }
.toast.aviso { color: #503a12; background: var(--dourado); }
.toast button { margin-left: auto; border: 0; color: inherit; background: transparent; cursor: pointer; }

.pagina-cabecalho { padding: 72px 0 55px; color: #fff; background: linear-gradient(145deg, var(--verde-950), var(--verde-700)); }
.pagina-cabecalho h1 { margin: 15px 0 10px; font-family: Georgia, serif; font-size: clamp(2.8rem, 7vw, 5.6rem); line-height: .95; letter-spacing: -.05em; }
.pagina-cabecalho p { max-width: 720px; margin: 0; color: rgba(255,255,255,.72); }
.painel-publico { display: grid; grid-template-columns: 310px 1fr; gap: 20px; align-items: start; }
.painel-lateral, .painel-conteudo { border: 1px solid var(--borda); border-radius: var(--raio-m); background: var(--papel); box-shadow: var(--sombra-curta); }
.painel-lateral { position: sticky; top: 98px; padding: 22px; }
.painel-conteudo { padding: 26px; }
.codigo-raiz { padding: 17px; border-radius: 17px; color: #fff; background: var(--verde-900); }
.codigo-raiz small { display: block; color: rgba(255,255,255,.65); }
.codigo-raiz strong { display: block; margin-top: 4px; color: var(--dourado); font-size: 1.35rem; }
.niveis-grade { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.nivel-card { padding: 17px; border: 1px solid var(--borda); border-radius: 16px; background: #f7faf7; }
.nivel-card strong { display: block; color: var(--verde-700); font-size: 1.5rem; }
.tabela-lista { display: grid; gap: 8px; margin-top: 18px; }
.linha-lista { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--borda); border-radius: 14px; }
.linha-lista small { display: block; color: var(--texto-suave); }

.rodape-site { padding: 64px 0 calc(24px + env(safe-area-inset-bottom)); color: rgba(255,255,255,.7); background: #05282b; }
.rodape-grade { display: grid; grid-template-columns: 1.4fr repeat(3, .7fr); gap: 38px; }
.marca-rodape .marca-texto strong { color: #fff; }
.rodape-grade p { max-width: 360px; }
.rodape-grade > div:not(:first-child) { display: grid; align-content: start; gap: 9px; }
.rodape-grade > div > strong { margin-bottom: 6px; color: #fff; }
.rodape-grade a, .rodape-grade button { width: fit-content; padding: 0; border: 0; color: rgba(255,255,255,.65); background: transparent; font-size: .83rem; cursor: pointer; }
.rodape-grade a:hover, .rodape-grade button:hover { color: var(--dourado); }
.rodape-final { display: flex; justify-content: space-between; gap: 20px; margin-top: 42px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); font-size: .7rem; }
.barra-movel { display: none; }
.aviso-cookies { position: fixed; z-index: 400; right: 18px; bottom: 18px; width: min(620px, calc(100% - 36px)); display: grid; grid-template-columns: 1fr auto; gap: 17px; padding: 18px; border: 1px solid rgba(255,255,255,.3); border-radius: 19px; color: #fff; background: rgba(6,46,49,.96); box-shadow: var(--sombra); backdrop-filter: blur(16px); }
.aviso-cookies[hidden] { display: none; }
.aviso-cookies p { margin: 4px 0 0; color: rgba(255,255,255,.67); font-size: .76rem; }
.aviso-cookies-acoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 7px; }
.aviso-cookies-acoes a, .aviso-cookies-acoes button { min-height: 39px; padding: 8px 11px; border: 1px solid rgba(255,255,255,.2); border-radius: 11px; color: #fff; background: transparent; font-size: .7rem; font-weight: 780; cursor: pointer; }
.aviso-cookies-acoes .botao { border: 0; }

.admin-body { background: #eff3ef; }
.admin-topo { color: #fff; background: var(--verde-950); }
.admin-grade { display: grid; grid-template-columns: 250px 1fr; min-height: 100dvh; }
.admin-menu { position: sticky; top: 0; height: 100dvh; padding: 20px; color: rgba(255,255,255,.7); background: var(--verde-950); }
.admin-menu nav { display: grid; gap: 5px; margin-top: 28px; }
.admin-menu nav a { padding: 11px 12px; border-radius: 11px; font-size: .83rem; font-weight: 720; }
.admin-menu nav a:hover, .admin-menu nav a.ativo { color: #fff; background: rgba(255,255,255,.1); }
.admin-principal { min-width: 0; padding: 30px; }
.admin-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 24px; }
.admin-cabecalho h1 { margin: 0; color: var(--verde-950); font-family: Georgia, serif; font-size: 2.2rem; }
.admin-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; }
.admin-card { padding: 20px; border: 1px solid var(--borda); border-radius: 18px; background: #fff; box-shadow: var(--sombra-curta); }
.admin-card strong { display: block; color: var(--verde-800); font-size: 1.8rem; }
.admin-card small { color: var(--texto-suave); }
.admin-secao { margin-top: 18px; padding: 21px; border: 1px solid var(--borda); border-radius: 20px; background: #fff; box-shadow: var(--sombra-curta); }
.admin-tabela-wrap { max-width: 100%; overflow-x: auto; }
.admin-tabela { width: 100%; border-collapse: collapse; font-size: .78rem; }
.admin-tabela th, .admin-tabela td { padding: 11px 9px; border-bottom: 1px solid var(--borda); text-align: left; vertical-align: top; }
.admin-tabela th { color: var(--texto-suave); font-size: .68rem; text-transform: uppercase; }
.admin-acoes { display: flex; flex-wrap: wrap; gap: 6px; }
.admin-acoes button, .admin-acoes a { padding: 7px 9px; border: 1px solid var(--borda); border-radius: 9px; background: #fff; font-size: .69rem; font-weight: 760; cursor: pointer; }
.admin-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 15px; }
.admin-filtros input, .admin-filtros select { min-height: 42px; padding: 8px 11px; border: 1px solid var(--borda); border-radius: 11px; background: #fff; }
.login-admin { min-height: 100dvh; display: grid; place-items: center; padding: 20px; color: #fff; background: linear-gradient(145deg, var(--verde-950), var(--verde-700)); }
.login-caixa { width: min(460px, 100%); padding: 29px; border: 1px solid rgba(255,255,255,.17); border-radius: 28px; background: rgba(255,255,255,.1); box-shadow: var(--sombra); backdrop-filter: blur(15px); }
.login-caixa h1 { margin: 24px 0 7px; font-family: Georgia, serif; font-size: 2.3rem; }
.login-caixa p { color: rgba(255,255,255,.67); }
.login-caixa .campo > label { color: rgba(255,255,255,.78); }

@media (max-width: 1020px) {
    .menu-principal > a, .menu-link { padding-inline: 7px; font-size: .8rem; }
    .hero-grade { grid-template-columns: 1fr .8fr; gap: 25px; }
    .mapa-grade { grid-template-columns: 1fr; }
    .mapa-detalhe { min-height: 0; }
    .passos-grade { grid-template-columns: 1fr 1fr; }
    .rodape-grade { grid-template-columns: 1.2fr repeat(3, .8fr); gap: 22px; }
    .admin-cards { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
    html { scroll-padding-top: 78px; }
    .limite { width: min(calc(100% - 28px), var(--limite)); }
    .topo-interno { min-height: 68px; }
    .menu-botao { display: block; }
    .menu-principal { position: fixed; z-index: 99; top: 68px; right: 12px; left: 12px; display: grid; gap: 3px; padding: 12px; border: 1px solid var(--borda); border-radius: 20px; background: rgba(255,253,248,.98); box-shadow: var(--sombra); transform: translateY(-15px); opacity: 0; pointer-events: none; transition: transform .2s, opacity .2s; }
    .menu-principal.aberto { transform: none; opacity: 1; pointer-events: auto; }
    .menu-principal > a, .menu-link { width: 100%; padding: 11px 12px; text-align: left; }
    .menu-principal .botao { width: 100%; }
    .menu-botao[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
    .menu-botao[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
    .menu-botao[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
    .hero { padding: 62px 0 33px; }
    .hero-grade { grid-template-columns: 1fr; }
    .hero h1 { max-width: 620px; }
    .arvore-visual { min-height: 400px; margin-top: -20px; }
    .arvore-copa { width: min(390px, 90%); }
    .numero-295 { right: 0; }
    .metricas-grade { grid-template-columns: repeat(3, 1fr); border-radius: 0 0 18px 18px; }
    .metrica:nth-child(3) { border-right: 0; }
    .metrica:nth-child(n+4) { border-top: 1px solid rgba(255,255,255,.1); }
    .secao { padding: 70px 0; }
    .secao-topo { align-items: flex-start; flex-direction: column; }
    .gabinete-grade { grid-template-columns: 1fr; gap: 25px; }
    .cards-grade { grid-template-columns: 1fr 1fr; }
    .cta-caixa { grid-template-columns: 1fr; padding: 31px; }
    .cta-caixa .hero-acoes { margin-top: 4px; }
    .rodape-grade { grid-template-columns: 1fr 1fr; }
    .rodape-final { flex-direction: column; }
    .painel-publico { grid-template-columns: 1fr; }
    .painel-lateral { position: static; }
    .admin-grade { grid-template-columns: 1fr; }
    .admin-menu { position: static; height: auto; }
    .admin-menu nav { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 600px) {
    body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }
    .limite { width: min(calc(100% - 22px), var(--limite)); }
    .marca-texto strong { font-size: 1.03rem; }
    .marca-simbolo { width: 43px; height: 43px; flex-basis: 43px; border-radius: 14px 14px 14px 4px; }
    .hero { padding-top: 44px; }
    .hero h1 { font-size: clamp(2.95rem, 17vw, 4.5rem); }
    .hero-acoes { display: grid; grid-template-columns: 1fr; }
    .hero-acoes .botao { width: 100%; }
    .arvore-visual { min-height: 350px; margin: -10px -10px 0; }
    .arvore-copa { transform: scale(.87); }
    .arvore-selo { width: 94px; height: 94px; right: 4%; }
    .metricas { padding-bottom: 10px; }
    .metricas-grade { grid-template-columns: 1fr 1fr; }
    .metrica { padding: 15px 13px; }
    .metrica:nth-child(2n) { border-right: 0; }
    .metrica:nth-child(3) { border-right: 1px solid rgba(255,255,255,.1); }
    .metrica:last-child { grid-column: 1/-1; border-top: 1px solid rgba(255,255,255,.1); text-align: center; }
    .secao { padding: 58px 0; }
    .secao.compacta { padding: 46px 0; }
    .secao h2 { font-size: clamp(2.05rem, 12vw, 3rem); }
    .mapa-painel { min-height: 455px; padding: 13px; border-radius: 21px; }
    .mapa-controles { align-items: stretch; flex-direction: column; }
    .mapa-legenda span { padding: 5px 7px; font-size: .58rem; }
    .mapa-svg { height: 350px; }
    .mapa-detalhe { padding: 20px; border-radius: 21px; }
    .mapa-detalhe h3 { margin-top: 20px; font-size: 1.9rem; }
    .passos-grade, .cards-grade { grid-template-columns: 1fr; }
    .passo-card { min-height: 0; }
    .aviso-rede { align-items: flex-start; }
    .gabinete-manifesto { padding: 29px 23px; border-radius: 25px; }
    .gabinete-item { grid-template-columns: 42px 1fr; padding: 14px; }
    .gabinete-item span { width: 42px; height: 42px; }
    .cta-final { padding-bottom: 60px; }
    .cta-caixa { padding: 26px 22px; border-radius: 24px; }
    .campo-grade { grid-template-columns: 1fr; }
    .campo.span-2 { grid-column: auto; }
    .grupo-opcoes { grid-template-columns: 1fr; }
    dialog.modal { width: calc(100% - 12px); max-height: calc(100dvh - 12px); border-radius: 22px; }
    .modal-conteudo { max-height: calc(100dvh - 12px); }
    .modal-topo { padding: 17px 18px 14px; }
    .modal-topo h2 { font-size: 1.45rem; }
    .formulario { padding: 18px; }
    .formulario-acoes { margin: 3px -18px -18px; padding: 13px 18px calc(13px + env(safe-area-inset-bottom)); }
    .formulario-acoes .botao { flex: 1; }
    .rodape-site { padding-top: 46px; }
    .rodape-grade { grid-template-columns: 1fr; gap: 28px; }
    .barra-movel { position: fixed; z-index: 150; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(3, 1fr); padding: 7px 7px calc(7px + env(safe-area-inset-bottom)); border-top: 1px solid var(--borda); background: rgba(255,253,248,.96); box-shadow: 0 -10px 30px rgba(7,46,49,.1); backdrop-filter: blur(16px); }
    .barra-movel button { min-width: 0; display: grid; place-items: center; gap: 1px; padding: 4px 2px; border: 0; color: var(--verde-900); background: transparent; font-size: .62rem; font-weight: 810; cursor: pointer; }
    .barra-movel span { font-size: 1.05rem; }
    .aviso-cookies { right: 7px; bottom: calc(70px + env(safe-area-inset-bottom)); width: calc(100% - 14px); grid-template-columns: 1fr; padding: 15px; }
    .aviso-cookies-acoes { justify-content: stretch; }
    .aviso-cookies-acoes a, .aviso-cookies-acoes button { flex: 1; }
    .niveis-grade { grid-template-columns: 1fr 1fr; }
    .linha-lista { grid-template-columns: 1fr auto; }
    .linha-lista > :last-child { grid-column: 1/-1; }
    .admin-principal { padding: 16px; }
    .admin-menu nav { grid-template-columns: 1fr 1fr; }
    .admin-cards { grid-template-columns: 1fr 1fr; }
    .admin-cabecalho { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 375px) {
    .hero h1 { font-size: 2.85rem; }
    .arvore-copa { transform: scale(.8); }
    .mapa-legenda span { font-size: .54rem; }
    .admin-cards { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
