/* Cena 3D do CECLIMAR — [cfp_cena] */
.cfpc-hero {
    --cfpc-veu: rgba(255, 255, 255, 0.82);
    position: relative; width: 100%; height: min(86vh, 760px); min-height: 520px; overflow: hidden; isolation: isolate;
    background: linear-gradient(180deg, #9fd0e4 0%, #f8e7d3 70%);
    font-family: 'Inter', 'Segoe UI', Roboto, sans-serif;
}
html.ceclimar-dark-mode .cfpc-hero { --cfpc-veu: rgba(18, 18, 18, 0.8); }
.cfpc-hero *, .cfpc-hero *::before, .cfpc-hero *::after { box-sizing: border-box; }
.cfpc-hero canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; z-index: 0; }
/* névoa à esquerda (clara de dia, escura à noite ou no modo escuro) */
.cfpc-hero::before, .cfpc-hero::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; transition: opacity 1.6s ease; }
.cfpc-hero::before { background: linear-gradient(90deg, var(--cfpc-veu) 0%, var(--cfpc-veu) 16%, transparent 42%); }
.cfpc-hero::after { background: linear-gradient(90deg, rgba(6, 16, 30, 0.7) 0%, rgba(6, 16, 30, 0.6) 16%, transparent 42%); opacity: 0; }
.cfpc-hero.is-noite::before { opacity: 0; }
.cfpc-hero.is-noite::after, html.ceclimar-dark-mode .cfpc-hero::after { opacity: 1; }

.cfpc-copy { position: absolute; z-index: 2; left: clamp(20px, 6vw, 88px); top: 50%; transform: translateY(-50%); }
.cfpc-titulo { margin: 0; padding: 0; line-height: 0; }
.cfpc-simbolo { display: block; width: clamp(190px, 22vw, 300px); height: auto; filter: drop-shadow(0 2px 10px rgba(255, 255, 255, 0.35)); }
.cfpc-simbolo:not(.is-ok) { visibility: hidden; }   /* só aparece depois de carregada: nada de texto nem moldura de imagem quebrada */
.cfpc-simbolo-escuro { display: none; filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.35)); }
html.ceclimar-dark-mode .cfpc-simbolo-claro, .cfpc-hero.is-noite .cfpc-simbolo-claro { display: none; }
html.ceclimar-dark-mode .cfpc-simbolo-escuro, .cfpc-hero.is-noite .cfpc-simbolo-escuro { display: block; }

/* bandeiras no pé da cena, alinhadas ao símbolo */
.cfpc-idiomas { position: absolute; z-index: 4; left: clamp(20px, 6vw, 88px); bottom: 20px; }
.cfpc-idiomas button { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85), 0 2px 6px rgba(0, 0, 0, 0.2) !important; }
.cfpc-idiomas button[aria-pressed="true"] { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #e0705f !important; }

/* controles de revisão (?revisar, só logado) */
.cfpc-rodape { display: none; position: absolute; z-index: 4; right: 84px; bottom: 14px; align-items: center; gap: 8px; }
.cfpc-hero.is-revisao .cfpc-rodape { display: flex; }
.cfpc-rodape > * { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; border-radius: 999px; color: #fff; font: 600 0.78rem 'Inter', sans-serif; background: rgba(14, 42, 63, 0.6); }
.cfpc-seletor select { border: 0; background: transparent; color: #fff; font: inherit; max-width: 190px; }
.cfpc-seletor option { color: #16222c; }
.cfpc-acao-ponto { width: 7px; height: 7px; border-radius: 50%; background: #6fe3a5; }

@media (max-width: 760px) {
    .cfpc-hero { height: 92vh; min-height: 640px; }
    .cfpc-hero::before { background: linear-gradient(180deg, var(--cfpc-veu) 0%, var(--cfpc-veu) 22%, transparent 42%); }
    .cfpc-hero::after { background: linear-gradient(180deg, rgba(6, 16, 30, 0.7) 0%, rgba(6, 16, 30, 0.6) 22%, transparent 42%); }
    .cfpc-copy { top: 24px; transform: none; left: 16px; }
    .cfpc-simbolo { width: 150px; }
    .cfpc-idiomas { left: 16px; bottom: 18px; gap: 8px; }
    .cfpc-hero.is-revisao .cfpc-idiomas { bottom: 60px; }
    .cfpc-rodape { left: 12px; right: 12px; flex-wrap: wrap; }
    .cfpc-dica { display: none !important; }
}

/* ---------- Cena no topo, de ponta a ponta, com o menu fixo por cima (como na prévia) ---------- */
/* sem o espaço reservado ao menu; cena-ui.js ainda desfaz o recuo do contêiner do Elementor (margem negativa) */
body:has(.cfpc-hero) .cfp-espaco { display: none; }
.cfpc-hero { z-index: 30; }
body:has(.cfpc-hero) { overflow-x: clip; }

/* ---------- Ícones verticais ---------- */
/* ficam fora de .cfp-cabecalho: o reset de lista de lá não vale aqui e o tema punha bolinhas e recuo */
.cfp-icones, .cfp-icones li { list-style: none !important; margin: 0 !important; }
.cfp-icones li { padding: 0 !important; line-height: 0; }
.cfp-icones li::before, .cfp-icones li::marker { content: none !important; display: none !important; }
.cfp-icones a, .cfp-icones a:hover, .cfp-icones a:focus { text-decoration: none !important; box-shadow: none; color: var(--cfp-tinta) !important; }
.cfpc-hero .cfp-icones { position: absolute; z-index: 4; right: 22px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 6px; padding: 6px !important; border-radius: 30px; }
.cfp-icones a { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 999px; color: var(--cfp-tinta); transition: background 0.2s ease, transform 0.25s cubic-bezier(0.3, 1.4, 0.5, 1); }
.cfp-icones a:hover, .cfp-icones a:focus-visible { background: rgba(128, 128, 128, 0.18); transform: scale(1.08); outline: none; }
.cfp-icones svg { width: 20px; height: 20px; }
.cfp-icones a::after {
    content: attr(data-rotulo); position: absolute; right: calc(100% + 12px); top: 50%; transform: translate(6px, -50%);
    padding: 6px 11px; border-radius: 999px; background: rgba(14, 42, 63, 0.88); color: #fff; font: 600 0.76rem 'Inter', sans-serif; white-space: nowrap;
    opacity: 0; pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease;
}
.cfp-icones a:hover::after, .cfp-icones a:focus-visible::after { opacity: 1; transform: translate(0, -50%); }

/* ---------- Bandeiras ---------- */
.cfp-idiomas { display: flex; gap: 6px; align-items: center; }
.cfp-idiomas button {
    width: 28px; height: 28px; padding: 0; margin: 0; border: 0; border-radius: 50%; cursor: pointer; overflow: hidden; background: none;
    box-shadow: 0 0 0 2px var(--cfp-fundo), 0 0 0 3px var(--cfp-linha); transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.cfp-idiomas svg { width: 42px; height: 28px; margin-left: -7px; display: block; }
.cfp-idiomas button:hover { transform: translateY(-2px); }
.cfp-idiomas button[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--cfp-fundo), 0 0 0 4px var(--cfp-coral); }
.cfp-idiomas button:focus-visible { outline: 2px solid var(--cfp-coral); outline-offset: 3px; }
body { top: 0 !important; }
.skiptranslate iframe, #goog-gt-tt { display: none !important; }


/* ---------- Faixa de avisos ---------- */
.cfp-faixa {
    position: relative; z-index: 2; display: flex; align-items: center; overflow: hidden; height: 48px;
    background: var(--cfp-faixa); color: #fff; font: 600 0.8rem 'Inter', sans-serif; letter-spacing: 0.06em; text-transform: uppercase;
}
.cfp-faixa::before, .cfp-faixa::after { content: ''; position: absolute; top: 0; bottom: 0; width: 70px; z-index: 2; pointer-events: none; }
.cfp-faixa::before { left: 0; background: linear-gradient(90deg, var(--cfp-faixa), transparent); }
.cfp-faixa::after { right: 0; background: linear-gradient(-90deg, var(--cfp-faixa), transparent); }
.cfp-faixa-trilho { display: flex; width: max-content; animation: cfp-rola 46s linear infinite; }
/* pausa só com o mouse em cima ou com foco de teclado (o foco de um clique deixava a faixa parada) */
.cfp-faixa:hover .cfp-faixa-trilho, .cfp-faixa:has(:focus-visible) .cfp-faixa-trilho { animation-play-state: paused; }
@keyframes cfp-rola { to { transform: translateX(-50%); } }
.cfp-faixa-grupo { display: flex; }
.cfp-aviso { position: relative; display: inline-flex; align-items: center; gap: 9px; height: 48px; padding: 0 30px; color: rgba(255, 255, 255, 0.86) !important; text-decoration: none !important; white-space: nowrap; }
.cfp-aviso::after { content: ''; position: absolute; right: -3px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--cfp-coral); }
.cfp-aviso svg { width: 17px; height: 17px; color: #f2a497; flex: none; }
.cfp-aviso b { color: #fff; font-weight: 800; }
a.cfp-aviso:hover b, a.cfp-aviso:focus-visible b { color: #f2a497; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 760px) {
    .cfpc-hero .cfp-icones { top: auto; bottom: 64px; transform: none; right: 12px; gap: 2px; }
    .cfpc-hero .cfp-icones a { width: 38px; height: 38px; }
    .cfpc-hero .cfp-icones a::after { display: none; }
    .cfp-faixa { height: 42px; font-size: 0.72rem; }
    .cfp-aviso { height: 42px; padding: 0 22px; }
}
@media (prefers-reduced-motion: reduce) {
    .cfp-faixa-trilho { animation: none; overflow-x: auto; width: auto; }
    .cfp-faixa-grupo[aria-hidden] { display: none; }
}