/* ═══ Soluções v5 (14/11/2026; redesenho em duas colunas em 17/11/2026) · "Soluções que acompanham a sua demanda." ═══
   Direção "papel, tinta e filete", pelo guia docs/DESIGN-ART-CHIK.md do Admin:
   · sem cartão e sem abas de sistema: o conteúdo fica direto no papel creme com textura (guia 1.1, 1.2);
     a única superfície com moldura é a mídia (raio 16, anel de ouro e --ac-sombra: guia 1.6 e 2.4);
   · sumário das quatro soluções em serifa, separado por fio de 1 px ouro .30 (lista com linhas, guia 2.8);
     rótulo em Outfit caixa alta (guia 1.3, .ac-label); na solução ativa o fio da base vira o filete
     dourado de 2 px, que cresce da esquerda e marca o tempo da troca (gesto do guia 2.8, linear: guia 4.1);
   · clipe vertical 9:16 no quadro de mídia, com o botão-ícone de pausar (44 px, raio 8: guia 2.1);
   · detalhe: descrição, três fatos entre fios e o botão verde do site (.btn-verde, guia 2.1);
   · trocar de solução muda só a opacidade; nada muda de lugar (os quatro painéis ocupam a mesma célula:
     guia, regras 4 e 5);
   · a troca automática passa uma vez pelas quatro soluções e para ("movimento acontece uma vez e para",
     guia 1.1); o layout é decidido pela largura do próprio palco (container query, guia 3.7);
   · no computador a seção inteira cabe em uma tela (bloco "computador", no fim do arquivo).
   Ordem: Acabamentos Especiais, Impressão Digital, Impressão Flexográfica, Inspeção de Qualidade.
   Carregado no <head>: decide o primeiro desenho. Lógica em solucoes-v5.js. */

/* ---------- cores e medidas do guia, com o papel no nome (guia, regra 12) ---------- */
html body .acsol-wrap.sol-wrap{
  --sol-papel:#f5f2eb;                       /* --creme: fundo */
  --sol-tinta:#0a4323;                       /* --verde-titulo: títulos, botão verde, fundo do quadro */
  --sol-tinta-84:rgba(10,67,35,.84);         /* texto corrido no celular (padrão do site) */
  --sol-tinta-80:rgba(10,67,35,.8);          /* --ac-tinta-80: texto corrido */
  --sol-tinta-72:rgba(10,67,35,.72);         /* --ac-tinta-72: apoio e nome em repouso */
  --sol-rotulo:rgba(22,60,38,.78);           /* --texto-soft: rótulo em caixa alta */
  --sol-ouro-texto:#7d6626;                  /* --dourado-texto: texto dourado abaixo de 24 px, seta */
  --sol-ouro-20:rgba(207,160,72,.2);         /* --ac-ouro-20: anel da mídia */
  --sol-ouro-30:rgba(207,160,72,.3);         /* --ac-ouro-30: fio entre linhas */
  --sol-filete:linear-gradient(90deg,#e7c785,#cfa048);   /* --ac-filete */
  --sol-creme-sobre-verde:#f5f2eb;           /* texto e ícone sobre o verde */
  --sol-verde-hover:#024624;                 /* --ac-verde-hover */
  --sol-realce-sobre-midia:rgba(255,255,255,.08);        /* hover do botão sobre a mídia (guia 3.3) */
  --sol-veu-0:rgba(14,42,28,0);              /* --backdrop, transparente */
  --sol-veu-1:rgba(14,42,28,.9);             /* --backdrop, reforçado na base do quadro */
  --sol-veu-2:rgba(14,42,28,.8);             /* --backdrop, na altura do ícone de pausar */
  --sol-sombra:0 1px 2px rgba(3,10,6,.05),0 10px 20px -10px rgba(3,10,6,.18),0 28px 48px -28px rgba(3,10,6,.22);   /* --ac-sombra */
  --sol-foco:0 0 0 2px #fff,0 0 0 4px #1e5631;            /* --foco-anel */
  --sol-foco-cor:#1e5631;                    /* a cor do anel de foco */
  --sol-foco-escuro:0 0 0 2px #163f26,0 0 0 4px #e7c785;  /* --foco-anel-escuro */
  --sol-ease:cubic-bezier(.22,1,.36,1);      /* --ease-marca */
  --sol-std:cubic-bezier(.25,.46,.45,.94);   /* --mv-std */
  --sol-aperto:cubic-bezier(.34,1,.64,1);    /* --mv-btn */
  --sol-brilho:cubic-bezier(.3,.7,.2,1);     /* --mv-brilho */
  --sol-tx-creme:url("data:image/svg+xml,%3Csvg id=%22Camada_1%22 data-name=%22Camada 1%22 xmlns=%22http://www.w3.org/2000/svg%22 xmlns:xlink=%22http://www.w3.org/1999/xlink%22 viewBox=%22157.1152 350.4789 260.88 381.3%22 width=%22260.88%22 height=%22381.3%22%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; %7D .cls-2 %7B fill: %23efebe4; %7D .cls-3 %7B fill: url(%23Novo_padr%C3%A3o_3); %7D .cls-4 %7B fill: %23f5f1ea; %7D %3C/style%3E%3Cpattern id=%22Novo_padr%C3%A3o_3%22 data-name=%22Novo padr%C3%A3o 3%22 x=%220%22 y=%220%22 width=%2243.48%22 height=%2263.55%22 patternTransform=%22translate(157.1152 350.4789) scale(6)%22 patternUnits=%22userSpaceOnUse%22 viewBox=%220 0 43.48 63.55%22%3E%3Cg%3E%3Crect class=%22cls-1%22 width=%2243.48%22 height=%2263.55%22/%3E%3Crect class=%22cls-4%22 width=%2243.48%22 height=%2263.55%22/%3E%3Cpath class=%22cls-2%22 d=%22M.77,52.35c-.26,0-.51,0-.77.03v.63c.37-.03.71-.03,1.08-.03-.31.63-.65,1.23-1.08,1.8v1c1.67-1.94,2.69-4.49,2.69-7.26s-.94-5.15-2.49-7.06c-.03-.11-.06-.26-.06-.4h-.14v1.2c.37.49.71,1.06.99,1.63h-.99v.63c.43,0,.85-.03,1.28,0,.31.71.51,1.46.65,2.23-.65-.06-1.28-.06-1.93-.03v.63c.68-.03,1.33-.03,2.01.03.03.37.06.74.06,1.14,0,.34-.03.71-.06,1.06-.65-.06-1.33-.06-2.01-.03v.63c.65-.03,1.3-.03,1.93.03-.11.74-.31,1.46-.6,2.14h-.57ZM8.11,0c-.23.26-.45.51-.71.74-.43.46-.88.89-1.36,1.29C2.66,5.86.62,10.89.62,16.41c0,11.86,9.47,21.56,21.17,21.73.45-.69.85-1.43,1.16-2.2-11,.46-20.15-8.4-20.15-19.53C2.81,9.52,6.35,3.49,11.68,0h1.19C7.23,3.26,3.43,9.38,3.43,16.41c0,10.86,9.01,19.47,19.73,18.9.23-.71.37-1.46.43-2.23-9.64.83-17.97-6.83-17.97-16.67C5.61,8.26,11.4,1.46,19.08,0h3.63c.06,5.95,2.44,11.32,6.32,15.21,3.71,3.77,8.82,6.15,14.46,6.35v.63c-5.81-.2-11.06-2.66-14.91-6.52-2.61-2.66-4.59-5.95-5.64-9.66h-.09c-3.49-.23-6.69,1.32-8.73,3.86,9.81.37,17.97,7.15,20.52,16.3,3.03-.09,6.04.46,8.84,1.6v.69c-2.75-1.17-5.7-1.72-8.67-1.66.17.71.31,1.43.43,2.17,2.83,0,5.67.66,8.25,1.89v.69c-2.55-1.26-5.33-1.92-8.19-1.94.09.74.14,1.46.17,2.2,2.83.06,5.56.8,8.02,2.23v.74c-2.47-1.52-5.19-2.29-8.02-2.34-.03.74-.06,1.49-.14,2.2,2.95.03,5.81,1,8.16,2.77v.8c-2.35-1.92-5.22-2.94-8.25-2.94-.09.74-.23,1.49-.4,2.2h.37c3.12,0,6.04,1.32,8.14,3.63l.14-.03v.2h0v1c-.14-.2-.28-.37-.43-.54-5.47.31-10.4,2.66-14.03,6.32-3.91,3.95-6.32,9.38-6.32,15.38v.14h-3.63c.99-.17,1.98-.29,3-.29,0-.74.06-1.46.11-2.2-3.37,0-6.58.91-9.33,2.49h-1.19c3.03-1.97,6.63-3.12,10.49-3.12h.11c.09-.74.23-1.46.4-2.17-5.47-.14-10.52,1.8-14.4,5.09l-.17.2h-.99c.26-.2.48-.43.74-.63,3.37-3.83,5.41-8.89,5.41-14.41,0-6-2.41-11.44-6.29-15.38-1.98-2-4.34-3.6-6.97-4.69v-.69c1.81.74,3.54,1.72,5.07,2.89-1.98-2.43-3.49-5.29-4.34-8.43-.23-.03-.48-.03-.74-.03v-.63h.6c-.17-.71-.31-1.46-.4-2.2h-.2v-.63h.11c-.06-.71-.11-1.46-.11-2.2h0v-.63h0c.03-.74.09-1.46.17-2.2h-.17v-.63l.26.03c.11-.74.26-1.49.43-2.2-.23,0-.45,0-.68-.03v-.63c.28.03.57.03.85.03.68-2.43,1.79-4.72,3.2-6.75-1.25.86-2.61,1.6-4.05,2.17v-.69c2.04-.86,3.94-2.03,5.61-3.43.48-.54.99-1.09,1.5-1.57h.99ZM4.05,0C2.83,1.03,1.47,1.92,0,2.6v-.69C1.08,1.37,2.1.74,3.06,0h.99ZM42.32,0c-2.55,1.29-5.39,1.89-8.25,1.74.14.77.37,1.52.68,2.2,3.03.03,6.01-.66,8.73-2.06v.69c-2.66,1.34-5.5,1.97-8.45,2,.4.8.88,1.52,1.45,2.14,2.47-.17,4.82-.77,7-1.72v.69c-2.01.86-4.2,1.4-6.46,1.63,1.7,1.66,3.97,2.74,6.46,2.94v.63c-2.72-.2-5.19-1.4-7-3.23-1.93-1.97-3.15-4.66-3.2-7.66h.62c0,.37.03.74.09,1.11,2.32.14,4.65-.23,6.83-1.11h1.5ZM31.1,0c.06,3.6,1.5,6.86,3.86,9.21,2.21,2.23,5.22,3.69,8.53,3.89v.63c-3.49-.2-6.63-1.72-8.96-4.06-2.47-2.49-4-5.89-4.05-9.66h.62ZM28.32,0c.03,4.37,1.81,8.35,4.65,11.21,2.72,2.74,6.41,4.52,10.52,4.69v.63c-4.28-.17-8.11-2-10.94-4.86-2.98-3-4.82-7.12-4.85-11.66h.62ZM25.51,0c.03,5.17,2.13,9.83,5.47,13.21,3.23,3.26,7.63,5.32,12.5,5.52v.63c-5.05-.2-9.58-2.34-12.93-5.69-3.49-3.52-5.64-8.32-5.67-13.67h.62ZM22.08.34c-8.73.06-15.85,7.2-15.85,16.07,0,9.52,8.08,16.87,17.4,16.01v-.23c0-.66-.09-1.32-.2-1.94-8.05.74-15.05-5.6-15.05-13.84,0-7.66,6.18-13.87,13.78-13.87h.09c-.09-.74-.14-1.46-.17-2.2h0ZM22.34,3.17c-7.31-.09-13.32,5.86-13.32,13.24,0,7.8,6.63,13.89,14.29,13.21-.17-.74-.45-1.46-.79-2.14-6.18.2-11.31-4.8-11.31-11.06s4.9-11.06,10.97-11.06c.17,0,.34.03.51.03h.09c-.17-.71-.31-1.46-.43-2.2h0ZM33.9,63.55v-.14c0-.37.03-.71.06-1.09,3.4.31,6.77-.63,9.52-2.72v-.8c-2.66,2.17-6.04,3.2-9.44,2.92.11-.77.31-1.49.6-2.17,3.37.17,6.6-1.2,8.84-3.77v-1c-2.04,2.72-5.22,4.26-8.59,4.15.51-1.09,1.22-2.06,2.04-2.89,1.7-1.72,4-2.86,6.55-3.03v-.63c-2.72.17-5.19,1.37-7,3.2-1.98,2-3.2,4.77-3.2,7.83v.14h.62ZM42.52,41.11c-2.07-2.06-4.9-3.17-7.85-3.03-.71,2.63-1.87,5.06-3.43,7.23,3.23-2.37,7.09-3.86,11.28-4.2h0ZM26.28,50.32c-3.71,2.72-8.28,4.29-13.21,4.23-.68,2.49-1.79,4.8-3.23,6.86,3.51-2.4,7.77-3.77,12.33-3.77h.65c.71-2.66,1.9-5.15,3.46-7.32h0ZM24.89,63.41c0-5.4,2.15-10.29,5.67-13.81,3.34-3.37,7.88-5.52,12.93-5.72v.63c-4.88.2-9.27,2.29-12.5,5.52-3.37,3.43-5.47,8.15-5.47,13.38v.14h-.62v-.14ZM27.69,63.41c0-4.63,1.84-8.81,4.85-11.81,2.83-2.86,6.66-4.69,10.94-4.89v.63c-4.11.2-7.8,1.94-10.52,4.69-2.86,2.92-4.65,6.95-4.65,11.38v.14h-.62v-.14ZM30.47,63.41c0-3.83,1.56-7.32,4.05-9.83,2.32-2.34,5.47-3.83,8.96-4.03v.63c-3.32.2-6.32,1.63-8.53,3.86-2.38,2.4-3.86,5.72-3.86,9.38v.14h-.62v-.14ZM13.29,21.13c6.04,0,10.97,4.97,10.97,11.06s-4.85,11.01-10.86,11.06h-.11c.17.71.28,1.46.4,2.2,7.06-.23,12.73-6.06,12.73-13.26,0-7.8-6.63-13.87-14.29-13.21.2.77.48,1.49.82,2.17.11-.03.23-.03.34-.03h0ZM13.15,42.63c3.29.06,6.24-1.46,8.16-3.86-4.68-.17-8.99-1.83-12.5-4.49,1.98,2.4,3.46,5.23,4.31,8.35h.03ZM22.17,26.84c-1.81-3.06-5.13-5.06-8.87-5.09,1.79,3.06,5.1,5.09,8.87,5.09h0ZM13.29,15.49c9.13,0,16.55,7.49,16.55,16.7s-7.09,16.38-15.96,16.7c0,.74-.06,1.49-.14,2.2,10.15-.23,18.28-8.61,18.28-18.9,0-10.86-9.04-19.44-19.76-18.87-.2.71-.34,1.46-.43,2.23.48-.03.96-.06,1.45-.06h0ZM13.89,48.26c8.53-.31,15.34-7.38,15.34-16.07,0-9.49-8.08-16.87-17.4-16.01v.23c0,.69.06,1.34.2,1.97.4-.06.82-.06,1.28-.06,7.6,0,13.75,6.2,13.75,13.87s-5.9,13.64-13.27,13.89c.06.71.11,1.43.11,2.17h0ZM13.29,12.66c10.69,0,19.36,8.75,19.36,19.53s-8.48,19.33-18.99,19.53c-.11.74-.26,1.49-.43,2.2h.06c11.88,0,21.54-9.72,21.54-21.73S25.4,10.69,13.66,10.49c-.45.66-.85,1.4-1.16,2.2.26-.03.51-.03.79-.03h0ZM0,30.85c2.01.97,3.86,2.26,5.41,3.86,3.51,3.52,5.67,8.4,5.67,13.81s-2.15,10.26-5.67,13.81c-.43.43-.88.83-1.36,1.23h-.99c.68-.51,1.33-1.09,1.93-1.69,3.37-3.4,5.47-8.15,5.47-13.35s-2.1-9.95-5.47-13.38c-1.45-1.46-3.15-2.69-4.99-3.6v-.69h0ZM0,34.02c1.28.74,2.41,1.63,3.43,2.66,3,3.03,4.88,7.2,4.88,11.84s-1.87,8.78-4.88,11.81c-1.02,1.03-2.15,1.92-3.43,2.66v-.74c1.11-.66,2.1-1.46,3-2.37,2.89-2.89,4.68-6.92,4.68-11.35s-1.79-8.46-4.68-11.38c-.91-.91-1.9-1.72-3-2.37v-.74h0ZM0,37.39c.51.4,1.02.83,1.47,1.29,2.47,2.52,4.03,5.97,4.03,9.83s-1.56,7.29-4.03,9.81c-.45.46-.96.89-1.47,1.29v-.8c.37-.29.71-.6,1.02-.94,2.38-2.37,3.86-5.69,3.86-9.35s-1.47-6.98-3.86-9.38c-.31-.34-.65-.63-1.02-.94v-.8h0ZM40.82,63.55c.94-.34,1.81-.77,2.66-1.29v.71c-.34.2-.71.4-1.08.57h-1.59Z%22/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Cpolygon class=%22cls-3%22 points=%220 0 0 540 0 1080 1920 1080 1920 540 1920 0 0 0%22/%3E%3C/svg%3E");
  position:relative;overflow:hidden;
  background:var(--sol-papel) !important;
}
/* textura creme do site, embutida (não depende de arquivo de imagem): ladrilho de 200 px (guia 1.2) */
html body .acsol-wrap.sol-wrap::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:var(--sol-tx-creme) 0 0/200px auto repeat;opacity:.6;
  /* a textura nasce aos poucos: a seção de cima é o mesmo papel, sem textura, e a emenda não aparece como uma linha */
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 144px);mask-image:linear-gradient(to bottom,transparent 0,#000 144px)}
html body .sol-wrap > *{position:relative;z-index:1}
html body .sol-wrap .acsol-title{text-wrap:balance}
/* entrada da seção: o sobretítulo é visível desde sempre em todas as seções (paridade-lp.css, opacity:1 !important).
   Aqui ele espera a seção entrar e aparece junto com o filete dele, antes do título. Só com o motor de entrada ligado. */
html.mv.mv-ok:not(.mv-tarde) body .acsol-wrap.sol-wrap:not(.ac-in) .acsol-tag{opacity:0 !important}
html.mv.mv-ok body .acsol-wrap.sol-wrap .acsol-tag{transition:opacity .6s cubic-bezier(.22,1,.36,1) var(--d,0s)}
/* a opacidade do sobretítulo é !important no site inteiro e vence a da animação de entrada: aqui a animação dele
   cuida só da subida e a opacidade vem pela transição acima (no Chromium a transição não disparava enquanto a
   animação geral, mvEntra, também animava a opacidade: o sobretítulo aparecia seco) */
@keyframes solTagSobe{from{translate:0 22px}to{translate:0 0}}
html:root.mv.mv-ok:not(.mv-tarde) body .acsol-wrap.sol-wrap.ac-in .acsol-tag[data-mv]{animation:solTagSobe var(--mv-dur,.9s) var(--mv-ease,cubic-bezier(.22,1,.36,1)) var(--d,0s) both}
@media (prefers-reduced-motion:reduce){html:root body .acsol-wrap.sol-wrap .acsol-tag:not(#_){opacity:1 !important;transition:none !important;animation:none !important}}
/* ritmo vertical do padrão (--lp-sec: 96 / 80 / 56). De 768 para cima a faixa verde seguinte sobe 35 px
   por cima desta seção: o respiro de baixo soma esses 35 */
html body .acsol-wrap.sol-wrap{padding-top:var(--lp-sec,96px) !important;padding-bottom:var(--lp-sec,96px) !important}
@media (min-width:768px){html body .acsol-wrap.sol-wrap{padding-bottom:calc(var(--lp-sec,96px) + 35px) !important}}
/* até 768 a margem lateral é a das seções vizinhas (vídeo, Experiência e FAQ usam 22): guia 3.2 */
@media (max-width:768px){html body .sol-wrap .acsol-inner{padding-left:22px !important;padding-right:22px !important}}
/* o contêiner do Elementor em volta desta seção era o único da home com sombra própria */
html body #segmentos.elementor-element{box-shadow:none !important}

/* ---------- palco: mede a própria largura (celular < 600 · tablet 600 a 855 · computador de 856 em diante);
   o corte não depende da janela (guia 3.2 e 3.7). 856 é o palco da janela de 1112 com a margem de 128 da home:
   notebook pequeno e iPad deitado (palco de 924 a 928) já recebem o desenho de computador.
   17/11/2026: o cabeçalho da seção (sobretítulo, título e apoio) mora dentro do palco, na coluna da esquerda,
   para dividir a mesma grade do clipe no computador. ---------- */
html body .sol-wrap .sol-palco{
  container:sol / inline-size;
  color:var(--sol-tinta);-webkit-text-fill-color:currentColor;
  font-family:'Outfit',Arial,sans-serif;
}
html body .sol-wrap .sol-grade{--sol-cw:140px}   /* largura do clipe; a altura é 16/9 disso */
html body .sol-wrap .sol-palco :is(.sol-esq,.sol-sumario,.sol-vitrine),html body .sol-wrap :is(.sol-sumario,.sol-vitrine) *,html body .sol-wrap :is(.sol-sumario,.sol-vitrine) *::before,html body .sol-wrap :is(.sol-sumario,.sol-vitrine) *::after{box-sizing:border-box}
/* O palco tem contenção de largura (container query): para quem mede "pelo conteúdo" ele vale 0 de largura. O
   contêiner do Elementor em volta da seção é uma coluna flex e media o filho assim antes de esticá-lo; no WebKit
   as grades de dentro ficavam com a altura das linhas calculada nessa largura mínima (linhas do sumário de 113 a
   144 px e fatos de 148 px no celular). Com a largura do filho declarada, ninguém mede pelo conteúdo. */
html body #segmentos > .elementor-element{width:100%}

/* ---------- cabeçalho no tablet (janela de 901 em diante com palco abaixo de 856): duas colunas, por
   paridade-lp.css. A 2ª coluna, a do apoio, começa no eixo da 2ª coluna do sumário (metade da largura menos o
   vão de 32). No computador o cabeçalho é empilhado (bloco "computador", no fim do arquivo). ---------- */
html body .acsol-wrap.sol-wrap .acsol-head{grid-template-columns:minmax(0,1fr) calc((100% - 32px) / 2);column-gap:32px}
/* a última linha do apoio assenta na linha de base da última linha do título */
@supports (align-self:last baseline){
  html body .acsol-wrap.sol-wrap .acsol-head > :is(.acsol-title,.acsol-subtitle){align-self:last baseline}
  html body .acsol-wrap.sol-wrap .acsol-head > .acsol-subtitle{padding-bottom:0}
}

/* ---------- sumário: as quatro soluções, uma linha cada ----------
   A linha tem 10 px de respiro de cada lado, compensados por margem negativa: o texto e os fios continuam na
   margem da seção e o anel de foco fica a 10 px das letras (guia 2.10 e 4.8). Os fios são desenhados por
   dentro (::before), para não avançarem com a caixa. */
/* no celular e no computador o sumário é uma coluna flex (no computador as quatro linhas repartem a altura) */
html body .sol-wrap .sol-sumario{display:flex;flex-direction:column;align-items:stretch;margin:0;padding:0}
html body .sol-wrap .sol-linha{flex:none}
html body .sol-wrap .sol-linha{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) 18px;align-items:center;column-gap:16px;
  width:auto;min-width:0;min-height:60px;margin:0 -10px;padding:8px 10px;
  border:0;border-radius:0;background:none;box-shadow:none;
  font:inherit;letter-spacing:0;text-transform:none;text-align:left;white-space:normal;
  color:var(--sol-tinta);-webkit-text-fill-color:currentColor;cursor:pointer;
  -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
  -webkit-user-select:none;user-select:none;transition:none;
}
/* fio de 1 px ouro .30 abaixo de cada linha e acima da primeira (lista com linhas, guia 2.8) */
html body .sol-wrap .sol-linha::before{content:"";position:absolute;left:10px;right:10px;top:0;bottom:0;border-bottom:1px solid var(--sol-ouro-30);pointer-events:none}
html body .sol-wrap .sol-linha:first-child::before{border-top:1px solid var(--sol-ouro-30)}
/* o tema pinta <button> de rosa em :hover e :focus: a linha mantém o desenho dela */
html body .sol-wrap .sol-linha:is(:hover,:focus,:active){background:none;color:var(--sol-tinta);outline:none}
/* filete dourado de 2 px sobre o fio da base: cheio na solução escolhida, proporcional ao tempo na troca
   automática (o JS escreve --p de 0 a 1) */
html body .sol-wrap .sol-linha::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;border-radius:2px;
  background:var(--sol-filete);transform:scaleX(var(--p,0));transform-origin:0 50%;transition:transform .45s var(--sol-std)}
/* a linha que deixa de ser a ativa guarda o tamanho do filete e só apaga (.24 s): ele não some de uma vez nem volta para trás */
html body .sol-wrap .sol-linha:not([aria-selected="true"])::after{opacity:0;transition:opacity .24s linear}
html body .sol-wrap .sol-linha:is(.is-correndo,.is-zerando)::after{transition:none}
/* o nome vem antes do rótulo no HTML (é assim que o leitor de tela lê); na tela o rótulo fica em cima */
html body .sol-wrap .sol-linha-txt{display:grid;grid-template-columns:minmax(0,1fr);row-gap:2px;min-width:0}
html body .sol-wrap .sol-linha-txt .sol-papel{grid-row:1}
html body .sol-wrap .sol-linha-txt .sol-linha-nome{grid-row:2}
html body .sol-wrap .sol-papel{display:block;margin:0;padding:0;font:600 12px/1.3 'Outfit',Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--sol-rotulo);-webkit-text-fill-color:currentColor}
html body .sol-wrap .sol-linha-nome{display:block;margin:0;padding:0;font:700 20px/1.2 'Crimson Pro',Georgia,serif;letter-spacing:0;color:var(--sol-tinta-72);-webkit-text-fill-color:currentColor;transition:color .32s var(--sol-std)}
html body .sol-wrap .sol-linha[aria-selected="true"] .sol-linha-nome{color:var(--sol-tinta)}
/* a seta aponta para onde o detalhe está: para baixo no celular (lista em pé, detalhe embaixo) e para a direita
   no computador. No tablet o sumário é 2 × 2 e a seta apontaria para a célula vizinha: ali fica só o filete. */
html body .sol-wrap .sol-linha-seta{flex:none;display:block;width:18px;height:18px;transform:rotate(90deg);fill:none;stroke:var(--sol-ouro-texto);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity .32s var(--sol-std)}
html body .sol-wrap .sol-linha[aria-selected="true"] .sol-linha-seta{opacity:1}
@media (hover:hover){
  html body .sol-wrap .sol-linha:not([aria-selected="true"]):hover .sol-linha-nome{color:var(--sol-ouro-texto)}
}
/* foco do teclado: o anel do guia (4.8), na caixa da linha — a 10 px do texto. O :not(#_) não casa com nada:
   só eleva a força acima da regra geral de padrao-marca.css, que usa !important. */
html:root body .sol-wrap .sol-linha:focus-visible:not(#_){outline:none !important;border-radius:4px;box-shadow:var(--sol-foco) !important;z-index:1}

/* ---------- vitrine: clipe + detalhe + chamada ----------
   Celular: o clipe e os quatro painéis dividem a mesma célula. Cada painel é uma coluna com a descrição em
   cima e os fatos embaixo, ao lado do clipe (os fatos têm no mínimo a altura do clipe e deixam a coluna dele
   livre). A altura da célula é a do painel mais alto: nada muda de lugar na troca. */
html body .sol-wrap .sol-vitrine{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;margin:24px 0 0}

/* quadro de mídia: a única superfície com moldura (anel fino de ouro + sombra do guia) */
html body .sol-wrap .sol-clipe{grid-area:1 / 1;align-self:end;justify-self:start;position:relative;z-index:2;width:var(--sol-cw)}
html body .sol-wrap .sol-quadro{position:relative;isolation:isolate;width:100%;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:var(--sol-tinta);
  box-shadow:0 0 0 1px var(--sol-ouro-20),var(--sol-sombra)}
/* camadas do clipe (pilha, ver solucoes-v5.js): a nova entra por cima, de 0 a 1; a de baixo só sai depois */
html body .sol-wrap .sol-midia{position:absolute;inset:0;visibility:hidden;opacity:0;transition:opacity .36s var(--sol-std)}
html body .sol-wrap .sol-midia.is-pilha{visibility:visible}
html body .sol-wrap .sol-midia.is-cheia{opacity:1}
html body .sol-wrap .sol-poster,html body .sol-wrap .sol-video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;display:block;border:0;border-radius:0}
html body .sol-wrap .sol-video{opacity:0;transition:opacity .32s linear;pointer-events:none}
html body .sol-wrap .sol-video.is-tocando{opacity:1}
/* véu só sob o botão de pausar, para o ícone ter contraste em qualquer quadro do clipe */
html body .sol-wrap .sol-veu{position:absolute;left:0;right:0;bottom:0;z-index:5;height:80px;pointer-events:none;
  background:linear-gradient(to top,var(--sol-veu-1) 0,var(--sol-veu-2) 44px,var(--sol-veu-0) 100%)}
/* pausar / tocar: botão-ícone sobre a mídia, sempre à vista */
html body .sol-wrap .sol-pausa{
  position:absolute;right:8px;bottom:8px;z-index:6;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;min-width:44px;min-height:44px;margin:0;padding:0;
  border:0;border-radius:8px;background:none;box-shadow:none;color:var(--sol-creme-sobre-verde);-webkit-text-fill-color:currentColor;cursor:pointer;
  -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
  transition:background-color .12s ease,transform .28s var(--sol-aperto);
}
html body .sol-wrap .sol-pausa:is(:hover,:focus){background:none;color:var(--sol-creme-sobre-verde);outline:none}
html body .sol-wrap .sol-pausa:active{background:none;transform:scale(.95)}
/* foco sobre a mídia: anel do fundo verde (guia 4.8); vence a regra geral de padrao-marca.css */
html:root body .sol-wrap .sol-pausa:focus-visible:not(#_){outline:none !important;box-shadow:var(--sol-foco-escuro) !important}
html body .sol-wrap .sol-pausa svg{width:20px;height:20px;display:block;fill:currentColor;stroke:none}
html body .sol-wrap .sol-pausa .sol-ic-tocar{display:none}
html body .sol-wrap .sol-pausa[aria-pressed="true"] .sol-ic-tocar{display:block}
html body .sol-wrap .sol-pausa[aria-pressed="true"] .sol-ic-pausar{display:none}
@media (hover:hover){
  html body .sol-wrap .sol-pausa:hover{background:var(--sol-realce-sobre-midia)}
}

/* painéis. Troca só por opacidade, em dois tempos: o texto que sai apaga em .14 s e só então o novo aparece
   (.3 s): os dois nunca se cruzam, nem com cliques seguidos (o atraso do que entra espera o que sai). */
html body .sol-wrap .sol-item{grid-area:1 / 1;min-width:0;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);align-content:space-between;row-gap:20px;border-radius:8px;
  opacity:0;visibility:hidden;transition:opacity .14s linear,visibility 0s linear .14s}
html body .sol-wrap .sol-item.is-ativo{opacity:1;visibility:visible;transition:opacity .3s var(--sol-std) .14s,visibility 0s linear 0s}
/* foco do painel: contorno verde do guia (4.8) com folga, para não encostar no texto */
html:root body .sol-wrap .sol-item:focus-visible:not(#_){outline:2px solid var(--sol-foco-cor) !important;outline-offset:4px !important;box-shadow:none !important}
/* o rótulo e o nome já estão no sumário; no celular e no tablet o cabeçalho do painel fica só para leitor de
   tela e para a ordem dos títulos. No computador ele aparece (bloco "computador"). */
html body .sol-wrap .sol-cab{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
html body .sol-wrap .sol-rot{display:none;margin:0;padding:0}
html body .sol-wrap .sol-nome{margin:0;padding:0;font:700 20px/1.2 'Crimson Pro',Georgia,serif;letter-spacing:0;color:var(--sol-tinta);-webkit-text-fill-color:currentColor}
html body .sol-wrap .sol-fios{display:none}
/* descrição = lead do guia (1.3, .ac-lead): Crimson 500, 19 px (17 no celular), entrelinha 1.55, tinta .80 */
html body .sol-wrap .sol-desc{margin:0;padding:0;font:500 17px/1.55 'Crimson Pro',Georgia,serif;font-family:'Crimson Pro',Georgia,serif !important;font-weight:500 !important;   /* ajustes.css força Outfit 400 em toda classe terminada em -desc */
  letter-spacing:0;color:var(--sol-tinta-80);-webkit-text-fill-color:currentColor;text-wrap:balance}   /* sem palavra sozinha na última linha */
/* fatos: três linhas entre fios, com o traço do filete como marcador */
html body .sol-wrap .sol-fatos{list-style:none;margin:0 0 0 calc(var(--sol-cw) + 16px);padding:0;min-width:0;
  display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;min-height:calc(var(--sol-cw) * 16 / 9)}
html body .sol-wrap .sol-fatos li{display:grid;grid-template-columns:12px minmax(0,1fr);column-gap:8px;align-content:center;min-height:44px;margin:0;padding:10px 0;
  border-bottom:1px solid var(--sol-ouro-30);list-style:none;
  font:400 14px/1.5 'Outfit',Arial,sans-serif;letter-spacing:0;color:var(--sol-tinta-84);-webkit-text-fill-color:currentColor;text-wrap:balance}   /* sem palavra sozinha na última linha */
html body .sol-wrap .sol-fatos li:first-child{border-top:1px solid var(--sol-ouro-30)}
html body .sol-wrap .sol-fatos li::marker{content:none}
html body .sol-wrap .sol-fatos li::before{content:"";width:12px;height:2px;margin-top:calc(.75em - 1px);border-radius:2px;background:var(--sol-filete)}

/* chamada: um botão só, o mesmo lugar em todas as soluções */
html body .sol-wrap .sol-acao{grid-area:2 / 1;display:flex;flex-direction:column;align-items:stretch;gap:8px;padding-top:24px}
/* botão verde do site (= .acauth-cta, .btn-verde do guia) */
html body .sol-wrap .sol-btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;height:44px;min-height:44px;padding:0 32px;border:0;border-radius:999px;
  background:var(--sol-tinta);color:var(--sol-creme-sobre-verde);-webkit-text-fill-color:var(--sol-creme-sobre-verde);box-shadow:none;
  font:600 18px/1.15 'Crimson Pro',Georgia,serif;letter-spacing:.01em;text-decoration:none;text-transform:none;white-space:nowrap;cursor:pointer;
  transition:transform .28s var(--sol-aperto),background-color .32s var(--sol-std)}
html body .sol-wrap .sol-btn:active{transform:scale(.95)}
html body .sol-wrap .sol-btn:focus-visible{outline:none;box-shadow:var(--sol-foco)}
html body .sol-wrap .sol-btn span{position:relative;z-index:2}
html body .sol-wrap .sol-nota{font:400 14px/20px 'Outfit',Arial,sans-serif;text-align:center;color:var(--sol-tinta-72);-webkit-text-fill-color:currentColor}
@media (hover:hover){
  html body .sol-wrap .sol-btn:hover{background:var(--sol-verde-hover);color:var(--sol-creme-sobre-verde);-webkit-text-fill-color:var(--sol-creme-sobre-verde)}
}
/* brilho que atravessa o botão no hover, uma vez: o mesmo dos outros botões da home (motion-wow.css) */
@media (hover:hover) and (pointer:fine){
  html body .sol-wrap .sol-btn::after{content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:55%;pointer-events:none;z-index:1;
    background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,250,235,.42) 50%,rgba(255,255,255,0));transform:translateX(-170%) skewX(-18deg)}
  html body .sol-wrap .sol-btn:hover::after{transform:translateX(260%) skewX(-18deg);transition:transform .8s var(--sol-brilho)}
}

/* ---------- tablet (palco de 600 a 855): sumário 2 × 2; embaixo, clipe à esquerda e detalhe à direita.
   A coluna do detalhe ocupa a altura inteira do clipe, sem buraco: a descrição fica no topo, o botão e a nota
   na base, e os três fatos repartem por igual a altura que sobra: 32 px da descrição aos fatos e 32 px dos
   fatos ao botão (guia 1.6). A caixa da vitrine, o clipe e o botão não mudam de lugar na troca. ---------- */
@container sol (min-width:600px){
  html body .sol-wrap .sol-grade{--sol-cw:240px}
  html body .sol-wrap .sol-sumario{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
  html body .sol-wrap .sol-linha{grid-template-columns:minmax(0,1fr);min-height:72px;padding-top:12px;padding-bottom:12px}
  html body .sol-wrap .sol-linha:nth-child(2)::before{border-top:1px solid var(--sol-ouro-30)}
  html body .sol-wrap .sol-linha-seta{display:none}
  html body .sol-wrap .sol-linha-txt{row-gap:4px}
  html body .sol-wrap .sol-linha-nome{font-size:22px}
  html body .sol-wrap .sol-vitrine{grid-template-columns:var(--sol-cw) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;column-gap:32px;margin-top:32px}
  html body .sol-wrap .sol-clipe{grid-area:1 / 1 / 3 / 2;align-self:start}
  html body .sol-wrap .sol-item{grid-area:1 / 2;align-self:stretch;align-content:stretch;grid-template-rows:auto minmax(0,1fr);row-gap:32px}
  html body .sol-wrap .sol-desc{margin-top:-6px;font-size:19px}
  html body .sol-wrap .sol-fatos{margin-left:0;min-height:0;grid-auto-rows:1fr}   /* cada fato tem no mínimo 44 px (regra geral) e cresce por igual */
  html body .sol-wrap .sol-fatos li{column-gap:12px;font-size:15px;color:var(--sol-tinta-80)}
  html body .sol-wrap .sol-acao{grid-area:2 / 2;flex-direction:row;align-items:center;gap:8px 20px;flex-wrap:wrap;padding-top:32px}
  html body .sol-wrap .sol-nota{text-align:left}
  /* os quatro painéis dividem as mesmas linhas (descrição · fato · fato · fato): a linha da descrição tem a
     altura da mais longa e os fios dos fatos não mudam de lugar na troca, em nenhum idioma */
  @supports (grid-template-rows:subgrid){
    html body .sol-wrap .sol-vitrine{grid-template-rows:auto repeat(3,minmax(44px,1fr)) auto}
    html body .sol-wrap .sol-clipe{grid-area:1 / 1 / 6 / 2}
    html body .sol-wrap .sol-item{grid-area:1 / 2 / 5 / 3;grid-template-rows:subgrid;row-gap:0}
    html body .sol-wrap .sol-desc{grid-row:1;padding-bottom:32px}
    html body .sol-wrap .sol-fatos{grid-row:2 / 5;grid-template-rows:subgrid;grid-auto-rows:auto}
    html body .sol-wrap .sol-fatos li,html body .sol-wrap .sol-fatos li:first-child{border-color:transparent}
    html body .sol-wrap .sol-fios{display:contents}
    html body .sol-wrap .sol-fios i{display:block;grid-column:2;border-bottom:1px solid var(--sol-ouro-30);pointer-events:none}
    html body .sol-wrap .sol-fios i:nth-child(1){grid-row:2;border-top:1px solid var(--sol-ouro-30)}
    html body .sol-wrap .sol-fios i:nth-child(2){grid-row:3}
    html body .sol-wrap .sol-fios i:nth-child(3){grid-row:4}
    html body .sol-wrap .sol-acao{grid-area:5 / 2}
  }
}

/* ═════════ computador (palco de 856 em diante) · 17/11/2026: a seção cabe em uma tela ═════════
   Duas colunas, sem linha de cabeçalho separada:
     esquerda · sobretítulo, título, apoio e, na base, o sumário das quatro soluções;
     direita  · a vitrine: o clipe vertical e, ao lado, o detalhe (nome, descrição, três fatos, botão).
   O topo do sobretítulo, do clipe e do nome do detalhe é o mesmo; a base do sumário, do clipe e da nota do
   botão também. O que sobra de altura é repartido: nas quatro linhas do sumário e nos três fatos.
   Altura: o respiro de cima e de baixo (--sol-resp, 48 a 96 px) e o clipe acompanham a altura da tela (svh):
     clipe = tela − 2 × respiro − 35 (os 35 px que a faixa verde sobe), limitado pela largura do palco (32%)
     e a 528 px (297 × 528). A largura é múltipla de 9, para a altura (16/9) ser um número inteiro de px.
     Se a coluna da esquerda pedir mais altura (tela baixa), o clipe estica com ela e as bases continuam juntas.
   Larguras (palco de 856 a 1184): detalhe 240 → 336 · vão até o clipe 40 → 64 · vão clipe–detalhe 28 → 40. */
/* janelas de 1025 a 1127: com a margem de 128 da home o palco ficaria abaixo de 856 (desenho de tablet, que não
   cabe em uma tela deitada: iPad de 10,2", notebook com zoom). Nessa faixa a seção usa a margem de 48 do tablet. */
@media (min-width:1025px) and (max-width:1127px){
  html body .sol-wrap .acsol-inner{padding-left:48px !important;padding-right:48px !important}
}
@media (min-width:952px){
  html body .acsol-wrap.sol-wrap{--sol-resp:clamp(48px,calc(13vh - 36px),96px);padding-top:var(--sol-resp) !important;padding-bottom:calc(var(--sol-resp) + 35px) !important}
  @supports (height:1svh){html body .acsol-wrap.sol-wrap{--sol-resp:clamp(48px,calc(13svh - 36px),96px)}}
  /* a âncora #segmentos ("Ver Soluções" do topo e "Soluções" do rodapé) é rolada por ancoras.js, que para sempre
     24 px antes do alvo. Aqui a seção foi medida para caber inteira na tela: o alvo desce 24 px e a seção sobe
     os mesmos 24 dentro dele; nada muda de lugar e a rolagem encosta a seção no alto da tela. */
  html body #segmentos.elementor-element{margin-top:24px !important}
  html body #segmentos > .elementor-element{margin-top:-24px !important}
}
@container sol (min-width:856px){
  html body .sol-wrap .sol-grade{
    --sol-tela:100vh;
    --sol-cw-livre:clamp(216px,min(calc((var(--sol-tela) - 2 * var(--sol-resp,96px) - 35px) * 9 / 16),32cqi),297px);
    --sol-cw:var(--sol-cw-livre);
    --sol-ch:calc(var(--sol-cw) * 16 / 9);
    --sol-dw:clamp(240px,calc(240px + (100cqi - 856px) * 96 / 328),336px);
    --sol-v1:clamp(40px,calc(40px + (100cqi - 856px) * 24 / 328),64px);
    --sol-v2:clamp(28px,calc(28px + (100cqi - 856px) * 12 / 328),40px);
    --sol-ew:calc(100cqi - var(--sol-cw) - var(--sol-dw) - var(--sol-v1) - var(--sol-v2));   /* largura da coluna da esquerda */
    display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--sol-v1);align-items:stretch}
  @supports (height:1svh){html body .sol-wrap .sol-grade{--sol-tela:100svh}}
  @supports (width:round(down,10px,9px)){html body .sol-wrap .sol-grade{--sol-cw:round(down,var(--sol-cw-livre),9px)}}

  /* --- coluna da esquerda: cabeçalho no topo, sumário até a base --- */
  html body .sol-wrap .sol-esq{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;row-gap:clamp(24px,calc(24px + (100cqi - 856px) * 16 / 328),40px);min-width:0}
  html body .acsol-wrap.sol-wrap .acsol-head{display:block !important;margin:0 !important}
  html body .acsol-wrap.sol-wrap .acsol-head .acsol-tag{display:flex !important;width:fit-content !important;margin:0 0 16px !important;line-height:1 !important}
  html body .acsol-wrap.sol-wrap .acsol-head .acsol-gold-line{display:none !important}
  /* o título cabe em duas linhas na largura da coluna: a 1ª linha mede 11,5 vezes o corpo em português e em
     espanhol e 11,75 em inglês */
  html body .acsol-wrap.sol-wrap .acsol-head .acsol-title{font-size:clamp(22px,calc(var(--sol-ew) / 12),38px) !important;line-height:1.08 !important;margin:0 0 16px !important}
  /* o apoio ocupa a largura da coluna, como o título e os fios (sem "equilibrar" as linhas, que o estreitava) */
  html body .acsol-wrap.sol-wrap .acsol-head .acsol-subtitle{max-width:none !important;margin:0 !important;padding:0 !important;font-size:clamp(15px,calc(15px + (100cqi - 856px) * 2 / 328),17px) !important;line-height:1.55 !important;text-wrap:pretty}

  html body .sol-wrap .sol-sumario{display:flex;align-self:stretch;min-height:0}
  html body .sol-wrap .sol-linha{flex:1 1 0;grid-template-columns:minmax(0,1fr) 18px;min-height:60px;padding-top:4px;padding-bottom:4px}
  html body .sol-wrap .sol-linha:nth-child(2)::before{border-top:0}
  html body .sol-wrap .sol-linha-seta{display:block;transform:none}
  html body .sol-wrap .sol-linha-txt{row-gap:5px}
  html body .sol-wrap .sol-papel{font-size:11px;line-height:1.2;letter-spacing:.1em;transition:color .32s var(--sol-std)}
  html body .sol-wrap .sol-linha[aria-selected="true"] .sol-papel{color:var(--sol-ouro-texto)}
  html body .sol-wrap .sol-linha-nome{font-size:clamp(21px,calc(21px + (100cqi - 856px) * 5 / 328),26px);line-height:1.1}

  /* --- vitrine: o clipe à esquerda, na altura toda; o detalhe à direita, em seis linhas da mesma grade:
         nome · descrição · fato · fato · fato · chamada. Os quatro painéis usam as mesmas linhas (subgrid): a
         linha da descrição tem a altura da mais longa e os fios dos fatos ficam parados na troca. --- */
  html body .sol-wrap .sol-vitrine{grid-template-columns:var(--sol-cw) var(--sol-dw);grid-template-rows:auto auto repeat(3,minmax(44px,1fr)) auto;column-gap:var(--sol-v2);margin-top:0;min-height:var(--sol-ch)}
  /* o clipe ocupa a altura inteira da vitrine: no mínimo 16/9 da largura; se a coluna da esquerda for mais alta,
     ele acompanha (o enquadramento absorve a diferença) e as três bases continuam na mesma linha */
  html body .sol-wrap .sol-clipe{grid-area:1 / 1 / 7 / 2;align-self:stretch;display:grid;width:var(--sol-cw)}
  html body .sol-wrap .sol-quadro{aspect-ratio:auto;height:auto;min-height:var(--sol-ch);box-shadow:0 0 0 1px rgba(207,160,72,.45),var(--sol-sombra)}
  html body .sol-wrap .sol-item{grid-area:1 / 2 / 6 / 3;align-self:stretch;align-content:stretch;grid-template-rows:auto auto minmax(0,1fr);row-gap:0}
  /* o rótulo em caixa alta já está na linha ativa do sumário, ao lado: no detalhe fica só o nome (h3) */
  html body .sol-wrap .sol-cab{position:static;width:auto;height:auto;margin:0;padding:0 0 clamp(12px,calc(12px + (100cqi - 856px) * 12 / 328),24px);overflow:visible;clip:auto;clip-path:none;white-space:normal}
  html body .sol-wrap .sol-nome{font-size:clamp(25px,calc(25px + (100cqi - 856px) * 7 / 328),32px);line-height:1.08;text-wrap:balance}
  /* a descrição tem largura de leitura fixa em relação ao corpo (16,25 em): as quatro quebram em três linhas
     equilibradas; se em algum idioma uma ficar mais curta, a folga se divide por igual acima e abaixo dela */
  html body .sol-wrap .sol-desc{margin-top:0;max-width:16.25em;align-self:center;padding-bottom:clamp(24px,calc(24px + (100cqi - 856px) * 8 / 328),32px);font-size:clamp(17px,calc(17px + (100cqi - 856px) * 2 / 328),19px);line-height:1.5;text-wrap:balance}
  html body .sol-wrap .sol-fatos{margin-left:0;min-height:0;grid-auto-rows:minmax(44px,1fr)}
  html body .sol-wrap .sol-fatos li{grid-template-columns:20px minmax(0,1fr);column-gap:12px;padding:8px 0;font:600 clamp(18px,calc(18px + (100cqi - 856px) * 4 / 328),22px)/1.25 'Crimson Pro',Georgia,serif;color:var(--sol-tinta)}
  html body .sol-wrap .sol-fatos li::before{width:20px;margin-top:calc(.625em - 1px)}
  html body .sol-wrap .sol-acao{grid-area:6 / 2;flex-direction:column;align-items:flex-start;flex-wrap:nowrap;gap:8px;padding-top:clamp(24px,calc(24px + (100cqi - 856px) * 8 / 328),32px)}
  html body .sol-wrap .sol-nota{text-align:left}
  @supports (grid-template-rows:subgrid){
    html body .sol-wrap .sol-item{grid-template-rows:subgrid}
    html body .sol-wrap .sol-cab{grid-row:1}
    html body .sol-wrap .sol-desc{grid-row:2}
    html body .sol-wrap .sol-fatos{grid-row:3 / 6;grid-template-rows:subgrid;grid-auto-rows:auto}
    html body .sol-wrap .sol-fios i:nth-child(1){grid-row:3}
    html body .sol-wrap .sol-fios i:nth-child(2){grid-row:4}
    html body .sol-wrap .sol-fios i:nth-child(3){grid-row:5}
  }

  /* contador discreto sobre o véu, na mesma distância da borda que o ícone de pausar (24 px): acompanha a camada
     ativa do clipe. O número vem do JS (data-n no quadro), sem depender de :has() */
  html body .sol-wrap .sol-veu{height:120px}
  html body .sol-wrap .sol-veu::after{content:"01 / 04";position:absolute;left:24px;bottom:8px;height:44px;display:flex;align-items:center;
    font:600 12px/1 'Outfit',Arial,sans-serif;letter-spacing:.14em;font-variant-numeric:tabular-nums;color:var(--sol-creme-sobre-verde)}
  html body .sol-wrap .sol-quadro[data-n="2"] .sol-veu::after{content:"02 / 04"}
  html body .sol-wrap .sol-quadro[data-n="3"] .sol-veu::after{content:"03 / 04"}
  html body .sol-wrap .sol-quadro[data-n="4"] .sol-veu::after{content:"04 / 04"}
  html body .sol-wrap .sol-pausa{right:12px}
  @media (hover:hover){
    html body .sol-wrap .sol-linha:not([aria-selected="true"]):hover .sol-linha-nome{color:var(--sol-tinta)}
    html body .sol-wrap .sol-linha:not([aria-selected="true"]):hover .sol-linha-seta{opacity:.5}
  }
}

/* ---------- movimento reduzido: sem troca automática, sem vídeo (fica o pôster), sem botão de pausar ---------- */
@media (prefers-reduced-motion:reduce){
  html body .sol-wrap .sol-pausa,html body .sol-wrap .sol-veu,html body .sol-wrap .sol-video{display:none}
  html body .sol-wrap .sol-palco *,html body .sol-wrap .sol-palco *::before,html body .sol-wrap .sol-palco *::after{animation:none !important;transition:none !important}
}