/* Padrão de marca (revisão 02/11/2026): grupo "contraste".
   Tinta real = -webkit-text-fill-color, que vence color: as duas são sempre definidas.
   Dourado em texto: #7d6626 abaixo de 24 px, #a48334 de 24 px para cima (títulos ficam como estão).
   Apoio: nada abaixo de rgba(10,67,35,.72). Sobre o verde: dourado claro #e7c785.
   Só cor: nenhuma animação, tamanho ou posição muda aqui. */

/* ── 1. Sobretítulos dourados sobre fundo claro ── */
html:root body :is(.acpf-tag,.acauth-tag,.acsol-tag,.acexp-tag,.acfaq-tag,.acblog-sec-tag,.acbf-tag,.acvg-tag,.acvg-card-tag,.acsp-guias-tag,.acspf-tag,.actc-intro-tag,.actc-sec-tag,.acpp-section-tag){
  color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
html:root body .ac4 .ac4-tag,
html:root body .acauth-head .acauth-tag,html:root body .acbf-head .acbf-tag,html:root body .acvg-head .acvg-tag,html:root body .acspf-head .acspf-tag,
html:root body #ah-section .ah-itag{color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}

/* ── 2. Sobretítulos sobre o verde: dourado claro ── */
html:root body :is(.acblog-ponte-tag,.acpp-tag){color:#e7c785 !important;-webkit-text-fill-color:#e7c785 !important}
html:root body .c > .tag{color:#e7c785 !important;-webkit-text-fill-color:#e7c785 !important}

/* ── 3. Palavra em itálico dos títulos de formulário (22–23 px) ── */
html:root body :is(.ac4-form-em,.acbf-card-title em,.acspf-card-title em,.actc-form-em){color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}

/* ── 4. Números e links pequenos em dourado ── */
html:root body :is(.actc-area-num,.elementor-post__read-more){color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
html:root body .elementor-post__card .elementor-post__read-more{color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
html:root body .acsp-passo::before,
html:root body .acmvv-rf-card::before,
html:root body .acauth-wrap .acauth-item::before,
html:root body .acauth-item::before,
html:root body .acauth-item:hover::before{color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
html:root body #ah-section.ah-enhanced #ah-counter,
html:root body #ah-section.ah-enhanced #ah-counter strong{color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
/* títulos de post ao passar o mouse: #cfa048 não é cor de texto */
html:root body .elementor-post__card .elementor-post__title a:hover,
html:root body .elementor-post-navigation__link a:hover{color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
/* link da política: a tinta herdava o cinza do parágrafo; volta a ser o dourado que o CSS dele já pedia */
html:root body .acpp-card-text .acpp-link{color:#7d6626 !important;-webkit-text-fill-color:#7d6626 !important}
html:root body .acpp-card-text .acpp-link:hover{color:#0a4323 !important;-webkit-text-fill-color:#0a4323 !important}

/* ── 5. Soluções: só cor. Fechado: título .74 (4,8:1) e número dourado (4,6:1).
   Aberto: título e número no verde cheio (9,4:1). O hover antecipa o aberto. ── */
html:root body .acsx .acsx-title{color:rgba(10,67,35,.74);-webkit-text-fill-color:currentColor}
html:root body .acsx .acsx-num{color:#7d6626;-webkit-text-fill-color:currentColor}
html:root body .acsx .acsx-item:not(.is-open) .acsx-btn:hover .acsx-title{color:rgba(10,67,35,.86)}
html:root body .acsx .acsx-item:not(.is-open) .acsx-btn:hover .acsx-num{color:#0a4323}
html:root body .acsx .acsx-item.is-open .acsx-title,
html:root body .acsx .acsx-item.is-open .acsx-num{color:#0a4323}

/* ── 6. Textos de apoio: .78 / .74, os mesmos valores que o celular já usava (harmonia-mobile.css) ── */
html:root body :is(.ac4-lgpd,.acpp-card-text,.acsp-atalho-txt span,.acsp-passo p,.actc-area p,.actc-pillar-desc,.elementor-post__excerpt p,.actc-file-hint,.acblog-vazio,.actc-foto--reservado p,.acx-eti-marca,.acx-eti-quem span){
  color:rgba(10,67,35,.78) !important;-webkit-text-fill-color:rgba(10,67,35,.78) !important}
html:root body .elementor-post__card .elementor-post__excerpt p{color:rgba(10,67,35,.78) !important;-webkit-text-fill-color:rgba(10,67,35,.78) !important}
html:root body .acblog-temas-lbl{color:rgba(10,67,35,.74) !important;-webkit-text-fill-color:rgba(10,67,35,.74) !important}
/* lead das seções: o color pedia .80, a tinta ficava em .68 (no celular já é .84) */
@media (min-width:769px){
  html:root body :is(.acpf-desc,.acexp-desc,.acsol-subtitle,.acsol-card-desc){color:rgba(10,67,35,.8) !important;-webkit-text-fill-color:rgba(10,67,35,.8) !important}
}

/* ── 7. Nossa história, painel de abertura ── */
html:root body #ah-section .ah-isub{color:rgba(10,67,35,.78) !important;-webkit-text-fill-color:rgba(10,67,35,.78) !important}
html:root body #ah-section :is(.ah-intro-note,.ah-hint-label,.ah-hint-years){color:rgba(10,67,35,.74) !important;-webkit-text-fill-color:rgba(10,67,35,.74) !important}

/* ── 8. Segmentos (faixa sobre verde-escuro): nomes apagados legíveis; o ativo segue dourado e maior ── */
html:root body .acvar-name:not(.is-active){color:rgba(245,242,235,.52);-webkit-text-fill-color:rgba(245,242,235,.52)}

/* ── 9. Aviso de cookies: rótulo e link pequenos ── */
html:root body .ck-banner .ck-text::before{color:#7d6626}
html:root body .ck-banner .ck-btn-link{color:#7d6626 !important;-webkit-text-fill-color:#7d6626}
html:root body .ck-banner .ck-btn-link:hover{color:#0a4323 !important;-webkit-text-fill-color:#0a4323}

/* ── 10. Link "Ir para o conteúdo" (aparece ao navegar por teclado) ── */
html:root body .skip-link{color:#0a4323;-webkit-text-fill-color:#0a4323}

/* ── 11. Trabalhe conosco: legendas sobre foto clara. O degradê só escurecia o rodapé e o título ficava em 1,8:1
   sobre a camisa clara. Mesma cor do véu, mais cedo: o título passa de 3:1 e a legenda de 4,5:1 em qualquer foto. ── */
html:root body .actc-foto-txt{background:linear-gradient(180deg,rgba(5,15,10,0) 0%,rgba(5,15,10,.62) 30%,rgba(5,15,10,.84) 58%,rgba(5,15,10,.92) 100%)}

/* ── 12. Link no fim do texto dos posts: a tinta já era .72; o color (rosa padrão do WordPress) não aparecia, mas sobrava no CSS ── */
html:root body .elementor-element-bf4aca7 .elementor-widget-container p a{color:rgba(10,67,35,.72)}

/* ── 13. Trabalhe conosco, topo no celular: o véu horizontal deixava o fim das linhas sobre a foto clara (2,7:1).
   Mesmo véu vertical que o Blog já usa até 580 px. ── */
@media (max-width:580px){
  html:root body .actc-hero-overlay{background:linear-gradient(180deg,rgba(5,15,10,.96) 0%,rgba(6,20,13,.9) 55%,rgba(8,28,17,.62) 100%)}
}

/* ── 14. Cartão de confirmação dos formulários (só aparece depois do envio): "recebida." em #cfa048 sobre o papel dava 2,33:1.
   O título tem 27 a 32 px, então vale o dourado de texto grande. ── */
html:root body .acx-eti-titulo em{color:#a48334 !important;-webkit-text-fill-color:#a48334 !important}

/* ── 15. Trabalhe conosco: "2026" sobre foto clara dava 4,09:1. Mesmo véu da regra 11. ── */
html:root body .actc-fachada figcaption{background:linear-gradient(180deg,rgba(5,15,10,0) 0%,rgba(5,15,10,.62) 30%,rgba(5,15,10,.84) 58%,rgba(5,15,10,.92) 100%)}

/* Padrão de marca (revisão 02/11/2026): grupo "forms".
   Os 4 formulários: Início (.ac4), Blog (.acbf), Suporte (.acspf) e Trabalhe conosco (.actc).
   O honeypot (_hp) fica fora de .xx-field, então estas regras não o alcançam.
   Fundo só por background-color: quem usa shorthand aqui apagaria qualquer imagem do campo. */

/* ── Campos ── */
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input:not([type=file]),select,textarea){
  box-sizing:border-box !important;
  background-color:#f6f2ea !important;
  border:1px solid rgba(30,86,49,.35) !important;
  border-radius:12px !important;
  outline:none !important;
  font-family:'Outfit',Arial,sans-serif !important;
  font-size:15px !important;
  font-weight:400 !important;
}
/* Linha única: 44 px. O padding vertical sai para o texto de 16 px caber sem cortar. A textarea mantém a altura que já tinha. */
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) input:not([type=file]){height:44px !important;min-height:44px !important;padding:0 14px !important}
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) select{height:44px !important;min-height:44px !important;padding:0 40px 0 14px !important}

html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input:not([type=file]),select,textarea):hover{border-color:rgba(30,86,49,.55) !important}
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input:not([type=file]),select,textarea):focus{
  background-color:#fff !important;
  border-color:#1e5631 !important;
  box-shadow:0 0 0 1px #1e5631,0 0 0 4px rgba(207,160,72,.28) !important;
}

/* Placeholder. "Selecione" no select é a opção vazia, com :invalid. */
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input,textarea)::placeholder{
  color:#56695b !important;
  -webkit-text-fill-color:#56695b !important;
  opacity:1 !important;
  font-family:'Outfit',Arial,sans-serif !important;
  font-size:15px !important;
}
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) select:invalid{color:#56695b !important;-webkit-text-fill-color:#56695b !important}

/* ── Currículo (Trabalhe conosco): caixa igual à dos campos ── */
html:root body .actc-field .actc-file{
  box-sizing:border-box !important;
  min-height:44px !important;
  padding:8px 12px !important;
  background-color:#f6f2ea !important;
  border:1px solid rgba(30,86,49,.35) !important;
  border-radius:12px !important;
}
html:root body .actc-field .actc-file:hover{background-color:#f6f2ea !important;border-color:rgba(30,86,49,.55) !important}
html:root body .actc-field .actc-file-text{font-family:'Outfit',Arial,sans-serif !important;font-size:15px !important}
html:root body .actc-field .actc-file-hint{color:#56695b !important;-webkit-text-fill-color:#56695b !important}

/* ── Erro: sem isto as regras de campo acima (e as antigas) vencem o .artchik-input-error de ajustes.css.
   Mesmos valores daquele arquivo; a mensagem continua em ajustes.css e envio.css. */
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input,select,textarea).artchik-input-error{
  border-color:#c83232 !important;
  box-shadow:0 0 0 2px rgba(200,50,50,.10) !important;
}
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input,select,textarea).artchik-input-error:focus{
  box-shadow:0 0 0 1px #c83232,0 0 0 4px rgba(200,50,50,.16) !important;
}
/* as regras de :hover e :focus acima têm especificidade maior: sem isto o campo com erro perde a borda vermelha */
html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input:not([type=file]),select,textarea).artchik-input-error:is(:hover,:focus){border-color:#c83232 !important}

/* ── Rótulos ── */
html:root body :is(.ac4-label,.ac4-lbl,.acbf-lbl,.acspf-lbl,.actc-label){
  font-family:'Outfit',Arial,sans-serif !important;
  font-style:normal !important;
  font-size:12px !important;
  font-weight:600 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  line-height:1.3 !important;
  color:rgba(22,60,38,.78) !important;
  -webkit-text-fill-color:rgba(22,60,38,.78) !important;
}
/* Rótulos de contato (Endereço, Telefone, E-mail) */
html:root body .ac4 .ac4-contacts .ac4-clbl{
  font-family:'Outfit',Arial,sans-serif !important;
  font-style:normal !important;
  font-size:12px !important;
  font-weight:600 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  color:rgba(22,60,38,.78) !important;
  -webkit-text-fill-color:rgba(22,60,38,.78) !important;
}
html:root body .ac4 .ac4-contacts .ac4-crow:hover .ac4-clbl{color:#0a4323 !important;-webkit-text-fill-color:#0a4323 !important}

/* ── Botão de enviar: igual aos demais botões dourados ── */
html:root body :is(.ac4-btn,.acbf-btn,.acspf-btn,.actc-btn){
  height:52px !important;
  min-height:52px !important;
  font-family:'Crimson Pro',Georgia,serif !important;
  font-size:18px !important;
  font-weight:600 !important;
}
html:root body :is(.ac4-btn,.acbf-btn,.acspf-btn,.actc-btn) *{font-size:18px !important}

/* ── Até 640 px: 16 px para o iPhone não dar zoom ao tocar no campo ── */
@media (max-width:640px){
  html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input:not([type=file]),select,textarea),
  html:root body :is(.ac4-field,.acbf-field,.acspf-field,.actc-field) :is(input,textarea)::placeholder,
  html:root body .actc-field .actc-file-text{font-size:16px !important}
}

/* Padrão de marca (revisão 02/11/2026): grupo "toque". Teclado e toque. */

/* ═══ A. ANEL DE FOCO (só :focus-visible; o clique do mouse não acende) ═══
   Fundo claro: branco + verde. Fundo verde: verde-escuro + dourado.
   Vale para tudo que recebe foco, inclusive carrosséis roláveis (o Chrome os põe no Tab com o azul padrão).
   Campos de formulário ficam no grupo "forms", acima.
   O #_ no :not() não casa com nada: só eleva a especificidade acima das sombras e anéis antigos com !important. */
html:root body :focus-visible:not(input,select,textarea,iframe,[tabindex="-1"],#_){
  outline:none !important;
  box-shadow:0 0 0 2px #fff,0 0 0 4px #1e5631 !important;
}
/* seções escuras (404 incluída: .b > .gold/.out) */
html:root body :is(.ach5,.acvar-wrap,#ac6kWrap,.acvid-wrap,.artchik-footer,.acblog-ponte,.vpp,.acx-palco) :focus-visible:not(input,select,textarea,iframe,[tabindex="-1"],#_),
html:root body .b > :is(a.gold,a.out):focus-visible:not(#_){
  outline:none !important;
  box-shadow:0 0 0 2px #163f26,0 0 0 4px #e7c785 !important;
}
/* alvos de foco só por script (#content, cartão do modal): sem anel nem azul */
html:root body [tabindex="-1"]:focus-visible{outline:none !important}
/* interruptor do modal de cookies: o foco está no input invisível, o anel vai no desenho */
html:root body .ck-prefs .ck-toggle-input:focus-visible ~ .ck-toggle{
  outline:none !important;
  box-shadow:0 0 0 2px #fff,0 0 0 4px #1e5631 !important;
}
/* o tema pinta <button> de rosa (#c36) em :focus e :hover: cada controle mantém a sua cor */
html:root body .ac-dot:not(.is-active):is(:hover,:focus){background:rgba(207,160,72,.32) !important}
html:root body .acauth-dot:not(.is-active):is(:hover,:focus){background:rgba(207,160,72,.32) !important}
html:root body :is(.ac-dot,.acauth-dot).is-active:is(:hover,:focus){background:#cfa048 !important}
html:root body .vpp-bigplay:focus:not(:hover){background:rgba(0,0,0,.34)}
html:root body :is(.vpp-btn,.vpp-speed):focus:not(:hover){background:transparent}
html:root body .vpp-speed.vpp-on:focus:not(:hover){background:rgba(17,17,17,.82)}
/* links de texto: raio do anel de link; no link que quebra em duas linhas, cada linha fecha o seu anel */
html:root body :is(.ac4-lgpd-link,.acpp-link):focus-visible{-webkit-box-decoration-break:clone;box-decoration-break:clone}
html:root body :is(.artchik-footer li a,.ck-btn-link,.ac4-lgpd-link,.acpp-link,.elementor-post__read-more):focus-visible{border-radius:4px !important}
/* alto contraste do sistema apaga box-shadow: devolve um contorno */
@media (forced-colors:active){
  html:root body :focus-visible:not(input,select,textarea,iframe,[tabindex="-1"],#_){outline:2px solid Highlight !important;outline-offset:2px !important}
}

/* ═══ B. AVISO DE COOKIES FECHADO FORA DA ORDEM DO TAB ═══
   A visibilidade troca junto com a animação: entra na hora ao abrir e só some depois do fade ao fechar.
   Mesma curva e duração de cookies.css (a regra de lá é !important). */
html:root body .ck-banner{
  visibility:hidden;
  transition:opacity .5s cubic-bezier(.25,.46,.45,.94),transform .5s cubic-bezier(.25,.46,.45,.94),visibility 0s linear .5s !important;
}
html:root body .ck-banner.ck-show{
  visibility:visible;
  transition:opacity .5s cubic-bezier(.25,.46,.45,.94),transform .5s cubic-bezier(.25,.46,.45,.94),visibility 0s linear 0s !important;
}
@media (prefers-reduced-motion:reduce){
  html:root body .ck-banner{transition:opacity .2s linear,visibility 0s linear .2s !important}
  html:root body .ck-banner.ck-show{transition:opacity .2s linear,visibility 0s linear 0s !important}
}

/* ═══ C. ALVOS DE 44 PX NO TOQUE, SEM MUDAR O DESENHO ═══
   Só área invisível de toque (pseudo-elemento ou padding de elemento inline).
   Vale em tela de toque de qualquer largura e em qualquer tela até 860 px.
   Onde o desenho deixa menos de 44 px entre um alvo e o próximo, a área para no limite: nada se sobrepõe. */
@media (pointer:coarse),(max-width:860px){

  /* ── pontos de carrossel: 44 de altura; a largura vai até o meio do vão (8 px) entre pontos.
        z-index: em /suporte/ o carrossel (z-index 5, margem negativa) cobria os pontos e o toque não chegava. */
  html:root body :is(.ac-dots,.acauth-dots){position:relative;z-index:6}
  html:root body :is(.ac-dot,.acauth-dot){position:relative}
  html:root body :is(.ac-dot,.acauth-dot)::after{
    content:"" !important;position:absolute !important;
    left:-4px !important;right:-4px !important;top:-19px !important;bottom:-19px !important;
  }

  /* ── Leia mais, filtros, política no aviso de cookies, seletor de idioma: centro mantido, 44 de altura ── */
  html:root body :is(.elementor-post__read-more,.acblog-tema,.acvg-filtro,.ck-btn-link){position:relative}
  html:root body :is(.elementor-post__read-more,.acblog-tema,.acvg-filtro,.ck-btn-link,.ac-lang-btn)::after{
    content:"";position:absolute;left:0;right:0;top:calc(50% - 22px);height:44px;
  }

  /* ── controles do vídeo ── */
  html:root body .vpp-btn{position:relative}
  html:root body .vpp-btn::after{content:"";position:absolute;left:calc(50% - 22px);top:calc(50% - 22px);width:44px;height:44px}
  html:root body .vpp-speed{position:relative}
  html:root body .vpp-speed::after{content:"";position:absolute;left:-4px;right:-4px;top:calc(50% - 22px);height:44px}

  /* ── links do rodapé: vão entre linhas de 37 px (39 acima de 860); a área ocupa o vão todo ── */
  html:root body .artchik-footer li a{position:relative}
  html:root body .artchik-footer li a::after{content:"";position:absolute;left:-8px;right:-8px;top:-6.8px;bottom:-6.8px}

  /* ── Fale Conosco: telefone e e-mail. O link tem 20 px de altura; entre um e outro há mais de 44 ── */
  html:root body .ac4 .ac4-contacts .ac4-cval a{position:relative}
  html:root body .ac4 .ac4-contacts .ac4-cval a::after{content:"";position:absolute;left:0;right:0;top:calc(50% - 22px);height:44px}

  /* ── fechar o modal de cookies: 34 px de desenho, 44 de área ── */
  html:root body .ck-prefs .ck-prefs-close{position:relative}
  html:root body .ck-prefs .ck-prefs-close::after{content:"";position:absolute;left:calc(50% - 22px);top:calc(50% - 22px);width:44px;height:44px}

  /* ── links de texto inline (política nos formulários, e-mail da política): padding vertical não altera a linha ── */
  html:root body .ac4-lgpd-link{padding-block:14px}
  html:root body .acpp-link{padding-block:12.5px}
  /* em Trabalhe conosco o link vem logo abaixo do botão de enviar: a área cresce para baixo */
  html:root body .actc-form-card .ac4-lgpd-link{padding-block:5px 23px}
  html:root body :is(.ac4-lgpd-link,.acpp-link):focus-visible,
  html:root body .actc-form-card .ac4-lgpd-link:focus-visible{padding-block:0}
}

@media (max-width:860px){
  html:root body .artchik-footer li a::after{top:-7.3px;bottom:-7.3px}
}
/* filtros do blog a 34,8 px, em várias linhas: 1,4 px a mais entre linhas fecham os 44 sem sobrepor */
@media (max-width:640px){
  html:root body .acblog-temas-inner{row-gap:9.4px}
}
/* vídeo a 32 px (até 700 px): reproduzir e som ficam a 40 px um do outro; cada área anda para o lado livre */
@media (max-width:700px){
  html:root body .vpp:not(.vpp--vertical) .vpp-play::after{left:calc(50% - 26px)}
  html:root body .vpp:not(.vpp--vertical) .vpp-mute::after{left:calc(50% - 18px)}
}
/* redes do rodapé a 34 px (a partir de 701 px): 5 ícones a 42 px; as áreas de 44 abrem em leque e cada uma mantém o seu ícone */
@media (pointer:coarse) and (min-width:701px),(min-width:701px) and (max-width:860px){
  html:root body .artchik-footer__social a{position:relative}
  html:root body .artchik-footer__social a::after{content:"";position:absolute;left:calc(50% - 22px);top:calc(50% - 22px);width:44px;height:44px}
  html:root body .artchik-footer__social a:nth-child(1)::after{left:calc(50% - 26px)}
  html:root body .artchik-footer__social a:nth-child(2)::after{left:calc(50% - 24px)}
  html:root body .artchik-footer__social a:nth-child(4)::after{left:calc(50% - 20px)}
  html:root body .artchik-footer__social a:nth-child(5)::after{left:calc(50% - 18px)}
}

/* ═══ D. O TAB SÓ PARA NO QUE SE VÊ ═══ */
/* Vídeo. Antes do 1º play os controles não existem para o mouse nem para o Tab: só o botão central.
   Tocando, o botão central apaga e sai da ordem depois do fade. */
html:root body .vpp:not(.vpp-started) .vpp-controls{visibility:hidden}
html:root body .vpp.vpp-playing .vpp-bigplay{
  visibility:hidden;
  transition:background .2s ease,transform .2s ease,opacity .25s ease,top 0s linear .25s,margin-top 0s linear .25s,visibility 0s linear .25s;
}
/* Tocando, com os controles recolhidos: o Tab os traz de volta enquanto o foco estiver neles.
   :focus-visible: o clique do mouse não prende o painel aberto. */
html:root body .vpp.vpp-started .vpp-controls.vpp-off:has(:focus-visible){
  opacity:1 !important;transform:translateY(0) !important;filter:blur(0) !important;pointer-events:auto !important;
}

/* Rodapé: telefone e e-mail ficam fora da tela para quem usa o mouse. No Tab, o bloco toma o lugar do copyright enquanto durar o foco,
   sem mexer no layout (já é absolute). */
html:root body .artchik-footer__contact-links:has(a:focus-visible){
  width:auto;height:auto;overflow:visible;clip:auto;
  display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;
  padding:8px 12px;z-index:3;
  background-color:#0a4323;border:1px solid rgba(215,184,107,.3);border-radius:12px;
}
html:root body .artchik-footer__bottom-inner:has(.artchik-footer__contact-links a:focus-visible) .artchik-footer__copyright{visibility:hidden}
html:root body .artchik-footer__contact-links a{color:#f0dfb9;-webkit-text-fill-color:#f0dfb9;border-radius:4px}

/* Botões fixos: enquanto o conjunto está apagado (opacidade 0, antes de .ac-show), não recebem dedo nem Tab.
   A troca espera o fade de .6s de movimento.css. Fora daqui: a rede de segurança (mv-lento) e o movimento reduzido, que deixam os botões à vista.
   html.mv: só vale nas páginas com movimento.js, as únicas onde .ac-show é aplicada. Sem isso, artigos e como-é-feito ficam sem os botões. */
@media (prefers-reduced-motion:no-preference){
  html.mv:root:is(:not(.mv-lento),.mv-ok) body .acfab:not(.ac-show) .acfab__wa{
    visibility:hidden !important;
    transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease,visibility 0s linear .6s !important;
  }
  html.mv:root:is(:not(.mv-lento),.mv-ok) body .acfab:not(.ac-show) .acfab__top{
    visibility:hidden !important;
    transition:opacity .28s ease,transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease,visibility 0s linear .6s !important;
  }
  /* Tab rápido durante o fade: o botão focado aparece e segura o foco, em vez de receber o foco invisível e perdê-lo. */
  html.mv:root:is(:not(.mv-lento),.mv-ok) body .acfab:not(.ac-show):has(.acfab__btn:focus-visible){opacity:1 !important;transform:none}
  html.mv:root:is(:not(.mv-lento),.mv-ok) body .acfab:not(.ac-show) .acfab__btn:focus-visible{visibility:visible !important;opacity:1 !important}
}

/* ═══ E. BOTÕES FIXOS x AVISO DE COOKIES ═══ */
/* Com movimento.js o WhatsApp fica à vista durante o aviso: sobe até ficar acima dele (folga de 14 px).
   O aviso muda de altura conforme a largura (324/303/247/225 px); a partir de 911 px a subida de comum.css já basta.
   Telas muito baixas (celular deitado) ficam com a subida antiga: acima do aviso o botão sairia da tela. */
@media (max-width:327px) and (min-height:480px){html.mv:root body:has(.ck-banner.ck-show) .acfab{transform:translateY(-336px) !important}}
@media (min-width:328px) and (max-width:563px) and (min-height:480px){html.mv:root body:has(.ck-banner.ck-show) .acfab{transform:translateY(-316px) !important}}
@media (min-width:564px) and (max-width:630px) and (min-height:480px){html.mv:root body:has(.ck-banner.ck-show) .acfab{transform:translateY(-269px) !important}}
@media (min-width:631px) and (max-width:767px) and (min-height:480px){html.mv:root body:has(.ck-banner.ck-show) .acfab{transform:translateY(-247px) !important}}
@media (min-width:768px) and (max-width:910px) and (min-height:480px){html.mv:root body:has(.ck-banner.ck-show) .acfab{transform:translateY(-241px) !important}}
/* Sem movimento.js (artigos, como-é-feito) cookies.css apaga os botões durante o aviso, mas comum.css os mantinha clicáveis: invisíveis, não recebem dedo nem Tab. */
html:root:not(.mv) body:has(.ck-banner.ck-show) .acfab .acfab__btn{visibility:hidden !important;pointer-events:none !important}

/* Padrão de marca (revisão 02/11/2026): grupo "consistencia".
   Só sobrescreve; o CSS antigo fica como está. */

/* ── a. Título principal das páginas internas e dos artigos: mesmo tamanho e peso.
   48 px no desktop (o valor das 4 páginas internas) e 36 px até 1058 px. Cresce sem degrau entre os dois. */
html:root body :is(.acblog-title,.acsp-title,.actc-hero-title,.acpp-hero-title),
html:root body .elementor-widget-theme-post-title h1.elementor-heading-title{
  font-size:clamp(36px,3.4vw,48px) !important;
  font-weight:700 !important;
}

/* ── b. Sem blur. O desfoque sai; onde o fundo é foto ou vídeo, o véu fica mais denso para manter a leitura.
   .vpp-controls.vpp-off segue com filter:blur na saída: é parte da animação atual e termina em opacidade 0. */
html:root body .acsx-cap{
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  background:rgba(10,30,20,.78) !important;
}
html:root body .acsx-cap-tot{opacity:.8 !important}
html:root body .vpp-controls{
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  background:rgba(17,17,17,.78) !important;
}
html:root body .elementor-post__thumbnail::after{-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
html:root body .ck-prefs .ck-prefs-backdrop{-webkit-backdrop-filter:none !important;backdrop-filter:none !important}

/* ── c. Raios. Cartões e fichas: 16. Controles pequenos: 8. Selo de ícone e avisos: 12.
   Fora daqui, de propósito: campos de formulário, pílulas, fotos e vídeos (.actc-fachada, .acvid-wrap video)
   e a bobina animada do formulário (.acx-bobina). */
html:root body :is(.acsp-atalho,.acsp-passo,.acpp-card,.acvar-stage,.acfab__label),
html:root body #ah-section .ah-pcard{border-radius:16px !important}
html:root body :is(.vpp-btn,.vpp-speed,.ac-lang-item){border-radius:8px !important}
html:root body :is(.actc-pillar-icon,.artchik-form-status,.acx-erro){border-radius:12px !important}

/* ── d. Texto de 12 px no mínimo. Só o tamanho: cor, espaçamento e altura das cápsulas seguem os mesmos. ── */
html:root body :is(.acbc-post-tema,.acblog-temas-lbl,.acvg-duration-badge,.acx-eti-marca){font-size:12px !important}
html:root body .elementor-post__thumbnail::after,
html:root body .elementor-post:first-child .elementor-post__thumbnail::before{font-size:12px !important}
@media (max-width:768px){
  html:root body #ah-section .ah-pmeta{font-size:12px !important}
}

/* ═══ BUGS (revisão 02/11/2026) ═══
   Último estilo do <head>. Convenção: html:root body + !important para vencer regras antigas. */

/* ── 1. Vídeo "Conheça a Art Chik": o título "50 anos de Art Chik" está gravado no pôster (só nele,
   o vídeo não traz o título) e vai de 46% a 55% da altura. Antes do 1º play, o botão fica abaixo
   do título, centrado. Depois de iniciado, volta ao centro. A troca espera o sumiço (.25s),
   para o botão não saltar enquanto apaga. */
html:root body .acvid-player-wrap .vpp .vpp-bigplay{transition:background .2s ease,transform .2s ease,opacity .25s ease,top 0s linear .25s,margin-top 0s linear .25s}
html:root body .acvid-player-wrap .vpp:not(.vpp-started) .vpp-bigplay{top:min(70%,calc(100% - 58px));margin-top:0}
/* Pausado depois de iniciado: centro, salvo se o botão encostar no painel de controles (84 + 6 de margem + 6 de folga + 26 do raio).
   Na prática, só abaixo de 480 px; ali ele fica logo acima do painel. */
html:root body .acvid-player-wrap .vpp.vpp-started .vpp-bigplay{top:min(50%,calc(100% - 122px))}

/* ── 2. Fale Conosco: o endereço (nowrap em home-v2.css:92) passava por baixo do cartão do formulário.
   Até 860 px a coluna já é única e o mobile-v2 cuida da altura. */
@media (min-width:861px){
  html:root body .ac4 .ac4-contacts .ac4-cval{white-space:normal !important;overflow-wrap:break-word}
  html:root body .ac4 .ac4-contacts .ac4-crow{height:auto !important;min-height:44px}
}

/* ── 3. Botões fixos (.acfab) ──
   Até 860 px: só o WhatsApp. Respiro no fim da página para o rodapé não ficar sob os botões. */
@media (max-width:860px){
  html:root body .acfab__top,
  html:root body .acfab__row:has(.acfab__top){display:none !important}
}
/* coluna única: redes sociais centradas; a faixa livre embaixo é a altura do WhatsApp (52 + 18) + 14 */
@media (max-width:700px){
  html:root body .artchik-footer__bottom-inner{padding-bottom:84px !important}
}
/* tablet: copyright e redes na mesma linha; as redes param antes do WhatsApp */
@media (min-width:701px) and (max-width:860px){
  html:root body .artchik-footer__social{margin-right:72px !important}
}
/* duas bolas: coluna reservada à direita (22 + 58 + 14). Acima de 1024 a margem da página já basta */
@media (min-width:861px) and (max-width:1280px){
  html:root body .artchik-footer__inner,
  html:root body .artchik-footer__bottom{padding-right:max(var(--lp-gutter),94px) !important}
}

/* ── 4. Missão (primeiro cartão), até 1100 px: a seção de cima (.sec-artchik-overlap, z-index 1) passa 19 px por cima do cartão
   e corta o topo, os cantos e o respiro do ícone. Em telas maiores a sobra é transparente, mas também rouba o hover. ── */
html:root body .acmvv-rf-card{z-index:1}

/* ── 5. Preferências de cookies aberto: botões fixos e idioma ficam sob o véu (10000/10001 em cookies.css). ── */
html:root.modal-aberto body :is(.acfab,.ac-lang){z-index:9999 !important}

/* 03/11/2026: caixa de aceite de marketing dos formulários (mesmo estilo da linha da Política, .ac4-lgpd) */
html:root body .ac4-optin{display:flex;align-items:flex-start;gap:10px;grid-column:1/-1;margin:2px 0 0;font:400 13px/1.45 'Outfit',Arial,sans-serif;color:rgba(10,67,35,.78) !important;-webkit-text-fill-color:rgba(10,67,35,.78) !important;text-align:left;cursor:pointer}
html:root body .ac4-optin input[type=checkbox]{flex:none;width:18px;height:18px;min-height:0;margin:0;padding:0;accent-color:#1e5631;cursor:pointer}
html:root body .ac4-optin input[type=checkbox]:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px #1e5631}
html:root body .cf-turnstile{grid-column:1/-1}
html:root body .cf-turnstile:not(:has(iframe)){display:contents}
