/* GERADO por scripts/ds-para-bundle.py a partir de
   design-system/design-system.html. NAO EDITE ESTE ARQUIVO.
   Componente se muda no design system; a pagina recebe por script. */
/* ============================================================
   COLÉGIO CHAMPIONS · DESIGN SYSTEM v2 · "brasão e caderno"
   Este <style> é a fonte do site: scripts/ds-para-bundle.py copia
   tudo o que não é .ds-* para site/assets/css/bundle.css.
   ============================================================ */

/* ---------- FONTES · duas famílias variáveis, três arquivos ---------- */
@font-face{font-family:'Faustina';src:url('../fonts/faustina-roman-var.woff2') format('woff2-variations');
  font-weight:300 800;font-style:normal;font-display:swap}
@font-face{font-family:'Faustina';src:url('../fonts/faustina-italic-var.woff2') format('woff2-variations');
  font-weight:300 800;font-style:italic;font-display:swap}
@font-face{font-family:'Figtree';src:url('../fonts/figtree-roman-var.woff2') format('woff2-variations');
  font-weight:300 900;font-style:normal;font-display:swap}

/* ---------- PIGMENTO · a única caixa com cor literal ---------- */
:root{
  /* marinho, a cor do brasão */
  --cx-p-marinho:#010A2C;
  --cx-p-marinho-2:#071640;
  --cx-p-marinho-3:#102457;
  --cx-p-marinho-4:#0B1A4A;
  --cx-p-marinho-5:#2C3F72;
  --cx-p-tinta:#111B33;
  --cx-p-ardosia:#4A5673;
  --cx-p-ardosia-fraca:#6B7690;
  --cx-p-linha-escura:#1E2F5C;
  --cx-p-azul-palido:#A9B8DC;
  --cx-p-azul-cinza:#8D9BC2;
  --cx-p-azul-campo:#4A5E94;

  /* papel, o caderno */
  --cx-p-branco:#FFFFFF;
  --cx-p-marfim:#FAF9F5;
  --cx-p-marfim-2:#F3F1EA;
  --cx-p-pedra:#F2F0E8;
  --cx-p-pedra-escura:#8C8674;
  --cx-p-areia:#F7EFDC;
  --cx-p-noite-areia:#1A2036;
  --cx-p-linha:#E3DFD3;
  --cx-p-linha-forte:#CFC8B6;

  /* ouro, as estrelas */
  --cx-p-ouro:#F4B71C;
  --cx-p-ouro-forte:#DCA20C;
  --cx-p-ouro-luz:#FFD569;
  --cx-p-ouro-medio:#A87400;

  /* estados e canal */
  --cx-p-verde-whats:#0F7A4A;
  --cx-p-ok:#12694A;    --cx-p-ok-fundo:#EAF6EF;    --cx-p-ok-luz:#7BD8A8;    --cx-p-ok-noite:#0E2F24;
  --cx-p-aviso:#8A5A00; --cx-p-aviso-fundo:#FFF4DF; --cx-p-aviso-luz:#FFD27A; --cx-p-aviso-noite:#33270A;
  --cx-p-erro:#A4262C;  --cx-p-erro-fundo:#FCECEF;  --cx-p-erro-luz:#FF9AA0;  --cx-p-erro-noite:#3A1420;

  /* tipo */
  --cx-f-display:'Faustina', Georgia, 'Times New Roman', serif;
  --cx-f-corpo:'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --cx-f-codigo:ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --cx-t-heroi:clamp(2.5rem, 1.1rem + 5.4cqi, 5rem);
  --cx-t-h2:clamp(2rem, 1.25rem + 2.9cqi, 3.25rem);
  --cx-t-h3:clamp(1.375rem, 1.15rem + .8cqi, 1.75rem);
  --cx-t-h4:1.1875rem;
  --cx-t-citacao:clamp(1.625rem, 1.05rem + 2.4cqi, 2.625rem);
  --cx-t-numeral:clamp(2.125rem, 1.4rem + 2.8cqi, 3.5rem);
  --cx-t-lead:clamp(1.125rem, 1.02rem + .45cqi, 1.3125rem);
  --cx-t-corpo:1.0625rem;
  --cx-t-pequeno:.9375rem;
  --cx-t-meta:.875rem;
  --cx-t-rotulo:.75rem;

  /* espaço, base 4 px */
  --cx-1:.25rem; --cx-2:.5rem; --cx-3:.75rem; --cx-4:1rem; --cx-5:1.25rem; --cx-6:1.5rem;
  --cx-8:2rem; --cx-10:2.5rem; --cx-12:3rem; --cx-16:4rem; --cx-20:5rem; --cx-24:6rem;
  --cx-secao:clamp(4.5rem, 3rem + 6vw, 8.5rem);
  --cx-tela:1200px;
  --cx-gutter:clamp(1rem, .4rem + 3vw, 3rem);
  --cx-medida:62ch;
  --cx-topo:76px;

  /* forma */
  --cx-raio-1:10px; --cx-raio-2:16px; --cx-raio-3:24px; --cx-raio-pilula:999px;

  /* movimento */
  --cx-micro:180ms; --cx-base:320ms; --cx-lento:700ms;
  --cx-curva:cubic-bezier(.2,.7,.2,1);
}

/* ---------- PAPEL · tema claro (padrão) ---------- */
:root,:root[data-tema="claro"]{
  color-scheme:light;
  --cx-fundo:var(--cx-p-marfim);
  --cx-fundo-2:var(--cx-p-branco);
  --cx-fundo-3:var(--cx-p-pedra);
  --cx-fundo-areia:var(--cx-p-areia);
  --cx-tinta:var(--cx-p-tinta);
  --cx-tinta-fraca:var(--cx-p-ardosia);
  --cx-linha:var(--cx-p-linha);
  --cx-linha-forte:var(--cx-p-linha-forte);
  --cx-linha-viva:var(--cx-p-ouro-forte);
  --cx-estrela:var(--cx-p-ouro);
  --cx-acao:var(--cx-p-marinho-2);
  --cx-acao-hover:var(--cx-p-marinho-3);
  --cx-sobre-acao:var(--cx-p-branco);
  --cx-rotulo:var(--cx-p-marinho-3);
  --cx-prova:var(--cx-p-marinho-3);
  --cx-prova-clara:var(--cx-p-ouro-medio);
  --cx-sobre-prova:var(--cx-p-branco);
  --cx-ilha:var(--cx-p-marinho);
  --cx-ilha-2:var(--cx-p-marinho-2);
  --cx-ilha-3:var(--cx-p-marinho-3);
  --cx-ilha-tinta:var(--cx-p-marfim-2);
  --cx-ilha-tinta-fraca:var(--cx-p-azul-palido);
  --cx-ilha-linha:var(--cx-p-linha-escura);
  --cx-ilha-linha-forte:var(--cx-p-marinho-5);
  --cx-ilha-estrela:var(--cx-p-ouro);
  --cx-ilha-rotulo:var(--cx-p-ouro-luz);
  --cx-ilha-acao:var(--cx-p-ouro);
  --cx-ilha-acao-hover:var(--cx-p-ouro-luz);
  --cx-sobre-ilha-acao:var(--cx-p-marinho);
  --cx-ilha-foco:var(--cx-p-ouro-luz);
  --cx-campo-fundo:var(--cx-p-branco);
  --cx-campo-borda:var(--cx-p-pedra-escura);
  --cx-placeholder:var(--cx-p-ardosia-fraca);
  --cx-foco:var(--cx-p-marinho-3);
  --cx-erro-tinta:var(--cx-p-erro);
  --cx-erro-fundo:var(--cx-p-erro-fundo);
  --cx-ok:var(--cx-p-ok);
  --cx-ok-fundo:var(--cx-p-ok-fundo);
  --cx-aviso:var(--cx-p-aviso);
  --cx-aviso-fundo:var(--cx-p-aviso-fundo);
  --cx-whats:var(--cx-p-verde-whats);
  --cx-sobre-whats:var(--cx-p-branco);
  --cx-marca-estrela:var(--cx-p-ouro-forte);
  --cx-marca-texto:var(--cx-p-marinho);
  --cx-faixa:var(--cx-p-ouro);
  --cx-sobre-faixa:var(--cx-p-marinho);
  --cx-adesivo:var(--cx-p-branco);
  --cx-sobre-adesivo:var(--cx-p-marinho-2);
  --cx-sombra-recorte:drop-shadow(0 28px 36px rgba(1,10,44,.28));
  --cx-topo-fundo:rgba(250,249,245,.9);
  --cx-sombra-1:0 1px 2px rgba(1,10,44,.06), 0 1px 1px rgba(1,10,44,.04);
  --cx-sombra-2:0 18px 40px -18px rgba(1,10,44,.22);
  --cx-sombra-3:0 30px 70px -28px rgba(1,10,44,.42);
}

/* ---------- PAPEL · tema escuro ---------- */
:root[data-tema="escuro"]{
  color-scheme:dark;
  --cx-fundo:var(--cx-p-marinho);
  --cx-fundo-2:var(--cx-p-marinho-2);
  --cx-fundo-3:var(--cx-p-marinho-4);
  --cx-fundo-areia:var(--cx-p-noite-areia);
  --cx-tinta:var(--cx-p-marfim-2);
  --cx-tinta-fraca:var(--cx-p-azul-palido);
  --cx-linha:var(--cx-p-linha-escura);
  --cx-linha-forte:var(--cx-p-marinho-5);
  --cx-linha-viva:var(--cx-p-ouro);
  --cx-estrela:var(--cx-p-ouro);
  --cx-acao:var(--cx-p-ouro);
  --cx-acao-hover:var(--cx-p-ouro-luz);
  --cx-sobre-acao:var(--cx-p-marinho);
  --cx-rotulo:var(--cx-p-ouro-luz);
  --cx-prova:var(--cx-p-ouro-luz);
  --cx-prova-clara:var(--cx-p-ouro);
  --cx-sobre-prova:var(--cx-p-marinho);
  --cx-ilha:var(--cx-p-marfim);
  --cx-ilha-2:var(--cx-p-branco);
  --cx-ilha-3:var(--cx-p-pedra);
  --cx-ilha-tinta:var(--cx-p-tinta);
  --cx-ilha-tinta-fraca:var(--cx-p-ardosia);
  --cx-ilha-linha:var(--cx-p-linha);
  --cx-ilha-linha-forte:var(--cx-p-linha-forte);
  --cx-ilha-estrela:var(--cx-p-ouro-forte);
  --cx-ilha-rotulo:var(--cx-p-marinho-3);
  --cx-ilha-acao:var(--cx-p-marinho-2);
  --cx-ilha-acao-hover:var(--cx-p-marinho-3);
  --cx-sobre-ilha-acao:var(--cx-p-branco);
  --cx-ilha-foco:var(--cx-p-marinho-3);
  --cx-campo-fundo:var(--cx-p-marinho-2);
  --cx-campo-borda:var(--cx-p-azul-campo);
  --cx-placeholder:var(--cx-p-azul-cinza);
  --cx-foco:var(--cx-p-ouro-luz);
  --cx-erro-tinta:var(--cx-p-erro-luz);
  --cx-erro-fundo:var(--cx-p-erro-noite);
  --cx-ok:var(--cx-p-ok-luz);
  --cx-ok-fundo:var(--cx-p-ok-noite);
  --cx-aviso:var(--cx-p-aviso-luz);
  --cx-aviso-fundo:var(--cx-p-aviso-noite);
  --cx-whats:var(--cx-p-verde-whats);
  --cx-sobre-whats:var(--cx-p-branco);
  --cx-marca-estrela:var(--cx-p-ouro);
  --cx-marca-texto:var(--cx-p-marfim-2);
  --cx-faixa:var(--cx-p-ouro);
  --cx-sobre-faixa:var(--cx-p-marinho);
  --cx-adesivo:var(--cx-p-marfim);
  --cx-sobre-adesivo:var(--cx-p-marinho-2);
  --cx-sombra-recorte:drop-shadow(0 28px 36px rgba(0,0,0,.5));
  --cx-topo-fundo:rgba(1,10,44,.88);
  --cx-sombra-1:0 1px 2px rgba(0,0,0,.3);
  --cx-sombra-2:0 18px 40px -18px rgba(0,0,0,.6);
  --cx-sombra-3:0 30px 70px -28px rgba(0,0,0,.8);
}

/* ---------- CONTEXTO · o que os componentes leem ----------
   Componente nunca lê --cx-* direto: lê --ch-*, que o contexto
   (página ou ilha) aponta para o papel certo. É o que deixa o
   mesmo cartão viver no papel e no marinho sem variante. */
body,.ch-ilha{
  --ch-fundo:var(--cx-fundo);
  --ch-fundo-2:var(--cx-fundo-2);
  --ch-fundo-3:var(--cx-fundo-3);
  --ch-tinta:var(--cx-tinta);
  --ch-tinta-fraca:var(--cx-tinta-fraca);
  --ch-linha:var(--cx-linha);
  --ch-linha-forte:var(--cx-linha-forte);
  --ch-linha-viva:var(--cx-linha-viva);
  --ch-estrela:var(--cx-estrela);
  --ch-acao:var(--cx-acao);
  --ch-acao-hover:var(--cx-acao-hover);
  --ch-sobre-acao:var(--cx-sobre-acao);
  --ch-rotulo:var(--cx-rotulo);
  --ch-prova:var(--cx-prova);
  --ch-prova-clara:var(--cx-prova-clara);
  --ch-foco:var(--cx-foco);
  --ch-marca-estrela:var(--cx-marca-estrela);
  --ch-marca-texto:var(--cx-marca-texto);
}
.ch-ilha{
  --ch-fundo:var(--cx-ilha);
  --ch-fundo-2:var(--cx-ilha-2);
  --ch-fundo-3:var(--cx-ilha-3);
  --ch-tinta:var(--cx-ilha-tinta);
  --ch-tinta-fraca:var(--cx-ilha-tinta-fraca);
  --ch-linha:var(--cx-ilha-linha);
  --ch-linha-forte:var(--cx-ilha-linha-forte);
  --ch-linha-viva:var(--cx-ilha-estrela);
  --ch-estrela:var(--cx-ilha-estrela);
  --ch-acao:var(--cx-ilha-acao);
  --ch-acao-hover:var(--cx-ilha-acao-hover);
  --ch-sobre-acao:var(--cx-sobre-ilha-acao);
  --ch-rotulo:var(--cx-ilha-rotulo);
  --ch-prova:var(--cx-ilha-rotulo);
  --ch-prova-clara:var(--cx-ilha-rotulo);
  --ch-foco:var(--cx-ilha-foco);
  --ch-marca-estrela:var(--cx-ilha-estrela);
  --ch-marca-texto:var(--cx-ilha-tinta);
  background:var(--ch-fundo);
  color:var(--ch-tinta);
}

/* ---------- BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--cx-topo)}
body{margin:0;background:var(--ch-fundo);color:var(--ch-tinta);font:400 var(--cx-t-corpo)/1.6 var(--cx-f-corpo);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl{margin:0}
h1,h2,h3{font-family:var(--cx-f-display);font-weight:540;color:var(--ch-tinta);text-wrap:balance}
h2{font-size:var(--cx-t-h2);line-height:1.08;letter-spacing:-.015em}
h3{font-size:var(--cx-t-h3);line-height:1.18;letter-spacing:-.005em}
p{text-wrap:pretty}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
address{font-style:normal}
:focus-visible{outline:3px solid var(--ch-foco);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------- ESQUELETO ---------- */
.ch-tela{container-type:inline-size;width:100%;max-width:calc(var(--cx-tela) + 2 * var(--cx-gutter));
  margin-inline:auto;padding-inline:var(--cx-gutter)}
.ch-secao{padding-block:var(--cx-secao);background:var(--ch-fundo);color:var(--ch-tinta);scroll-margin-top:var(--cx-topo)}
.ch-secao--pedra{--ch-fundo:var(--cx-fundo-3)}
.ch-secao--areia{--ch-fundo:var(--cx-fundo-areia)}

.ch-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ch-pular{position:absolute;left:var(--cx-4);top:-120px;z-index:100}
.ch-pular:focus{top:var(--cx-4)}

/* ---------- TIPO ---------- */
.ch-titulo-heroi{font-family:var(--cx-f-display);font-size:var(--cx-t-heroi);font-weight:520;line-height:1.02;
  letter-spacing:-.022em;color:var(--ch-tinta);text-wrap:balance}
.ch-apagado{font-style:italic;font-weight:460;color:var(--ch-prova)}
.ch-h4{font-family:var(--cx-f-display);font-size:var(--cx-t-h4);font-weight:600;line-height:1.3;color:var(--ch-tinta)}
.ch-lead{font-size:var(--cx-t-lead);line-height:1.55;color:var(--ch-tinta-fraca)}
.ch-meta{font-size:var(--cx-t-meta);line-height:1.5;color:var(--ch-tinta-fraca)}
.ch-rotulo{display:inline-flex;align-items:center;gap:.7em;font:600 var(--cx-t-rotulo)/1.3 var(--cx-f-corpo);
  letter-spacing:.2em;text-transform:uppercase;color:var(--ch-rotulo)}
.ch-rotulo svg{width:1.15em;height:1.15em;flex:none;color:var(--ch-estrela)}
.ch-numeral{font-family:var(--cx-f-display);font-size:var(--cx-t-numeral);font-weight:500;line-height:1;
  letter-spacing:-.02em;color:var(--ch-prova)}

/* ---------- MARCA ---------- */
.ch-logo-estrelas{fill:var(--ch-marca-estrela)}
.ch-logo-texto{fill:var(--ch-marca-texto)}
.ch-logo--mono{--ch-marca-estrela:var(--ch-marca-texto)}
.ch-marca{display:inline-flex;align-items:center;color:inherit;text-decoration:none;flex:none}
.ch-marca__logo{width:176px;height:auto;aspect-ratio:290/50.3}
.ch-constelacao{width:88px;height:auto;aspect-ratio:557.5/180;color:var(--ch-estrela);fill:currentColor}
.ch-constelacao--centro{margin-inline:auto}
.ch-marca-dagua{position:absolute;pointer-events:none;fill:var(--ch-estrela);opacity:.1}
.ch-fio{height:1px;border:0;margin:0;background:var(--ch-linha)}
.ch-fio--ouro{width:48px;height:2px;background:var(--ch-linha-viva)}

/* ---------- BOTÃO ---------- */
.ch-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:.75rem 1.375rem;
  border:1.5px solid transparent;border-radius:var(--cx-raio-pilula);background:var(--ch-acao);color:var(--ch-sobre-acao);
  font:600 1rem/1.2 var(--cx-f-corpo);text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background-color var(--cx-micro) var(--cx-curva), border-color var(--cx-micro) var(--cx-curva),
    transform var(--cx-micro) var(--cx-curva), box-shadow var(--cx-base) var(--cx-curva)}
.ch-btn svg{width:1.2em;height:1.2em;flex:none}
.ch-btn:hover{background:var(--ch-acao-hover);box-shadow:var(--cx-sombra-2)}
.ch-btn:active{transform:translateY(1px)}
.ch-btn--acao{background:var(--ch-acao);color:var(--ch-sobre-acao)}
.ch-btn--contorno{background:transparent;color:var(--ch-tinta);border-color:var(--ch-linha-forte)}
.ch-btn--contorno:hover{background:transparent;border-color:var(--ch-tinta);box-shadow:none}
.ch-btn--largo{min-height:56px;max-width:100%;padding:1rem 1.75rem;font-size:1.0625rem;white-space:normal;text-align:center}
.ch-link{display:inline-flex;align-items:center;gap:.5em;font-weight:600;color:var(--ch-tinta);text-decoration:underline;
  text-decoration-color:var(--ch-linha-viva);text-decoration-thickness:2px;text-underline-offset:.35em}
.ch-link svg{width:1.1em;height:1.1em;transition:transform var(--cx-micro) var(--cx-curva)}
.ch-link:hover svg{transform:translateX(3px)}

/* ---------- CHIP ---------- */
.ch-chips{display:flex;flex-wrap:wrap;gap:var(--cx-2);list-style:none;padding:0}
.ch-chip{display:inline-flex;align-items:center;gap:.45em;padding:.375rem .875rem;border:1px solid var(--ch-linha-forte);
  border-radius:var(--cx-raio-pilula);background:var(--ch-fundo-2);color:var(--ch-tinta);font:500 var(--cx-t-meta)/1.3 var(--cx-f-corpo)}
.ch-chip svg{width:1em;height:1em;color:var(--ch-estrela)}

/* ---------- CABEÇALHO ---------- */
.ch-topo{position:sticky;top:0;z-index:40;container-type:inline-size;background:var(--cx-topo-fundo);
  -webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--ch-linha)}
.ch-topo__tela{display:flex;align-items:center;gap:var(--cx-6);min-height:var(--cx-topo);width:100%;
  max-width:calc(var(--cx-tela) + 2 * var(--cx-gutter));margin-inline:auto;padding-inline:var(--cx-gutter)}
.ch-topo nav{margin-left:auto}
.ch-menu{display:flex;align-items:center;gap:var(--cx-8);list-style:none;margin:0;padding:0}
.ch-menu a{display:inline-block;padding-block:var(--cx-1);font-weight:500;font-size:var(--cx-t-pequeno);color:var(--ch-tinta);
  text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:.5em;
  transition:text-decoration-color var(--cx-micro) var(--cx-curva)}
.ch-menu a:hover{text-decoration-color:var(--ch-linha-viva)}
.ch-topo .ch-btn{order:2}
.ch-menu-toggle{order:3;display:none;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--ch-linha-forte);
  border-radius:var(--cx-raio-pilula);background:transparent;color:var(--ch-tinta);cursor:pointer}
.ch-menu-toggle svg{width:20px;height:20px}
@container (max-width: 880px){
  .ch-topo nav{margin-left:auto}
  .ch-menu-toggle{display:grid}
  .ch-topo .ch-btn{flex:none;width:44px;min-height:44px;padding:0}
  .ch-topo .ch-btn__texto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .ch-menu{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;
    padding:var(--cx-2) var(--cx-gutter) var(--cx-6);background:var(--ch-fundo);border-bottom:1px solid var(--ch-linha);box-shadow:var(--cx-sombra-2)}
  .ch-menu[data-aberto]{display:flex}
  .ch-menu li+li{border-top:1px solid var(--ch-linha)}
  .ch-menu a{display:block;padding-block:var(--cx-4);font-family:var(--cx-f-display);font-size:1.375rem;font-weight:520}
}
@container (max-width: 380px){.ch-marca__logo{width:148px}}

/* ---------- HERÓI ---------- */
.ch-heroi{display:grid;gap:var(--cx-16);align-items:center}
.ch-heroi__texto{display:grid;justify-items:start;gap:var(--cx-6)}
.ch-heroi__acoes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cx-4) var(--cx-8);margin-top:var(--cx-2)}
.ch-heroi__foto{position:relative;margin:0 var(--cx-5) var(--cx-5) 0}
.ch-heroi__foto::before{content:"";position:absolute;inset:var(--cx-5) calc(-1 * var(--cx-5)) calc(-1 * var(--cx-5)) var(--cx-5);
  border:1.5px solid var(--ch-linha-viva);border-radius:var(--cx-raio-3)}
.ch-heroi__foto img{position:relative;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--cx-raio-3);background:var(--ch-fundo-3)}
.ch-heroi__foto .ch-selo{position:absolute;left:calc(-1 * var(--cx-8));bottom:var(--cx-10)}
@container (min-width: 900px){
  .ch-heroi{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--cx-16)}
}
@container (max-width: 560px){.ch-heroi__foto .ch-selo{left:var(--cx-3);bottom:var(--cx-3);width:104px}}

/* ---------- SELO ---------- */
.ch-selo{width:128px;aspect-ratio:1;border-radius:50%;background:var(--ch-fundo);box-shadow:var(--cx-sombra-2);color:var(--ch-tinta)}
.ch-selo svg{width:100%;height:100%}
.ch-selo text{font:700 10.5px var(--cx-f-corpo);letter-spacing:.24em;fill:currentColor}
.ch-selo__giro{transform-origin:60px 60px;animation:ch-gira 60s linear infinite}
.ch-selo__estrela{color:var(--ch-estrela)}
.ch-selo__aro{fill:none;stroke:var(--ch-linha-viva);stroke-width:1}
@keyframes ch-gira{to{transform:rotate(360deg)}}

/* ---------- FAIXA DE PROVA ---------- */
.ch-prova{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-block:1px solid var(--ch-linha)}
.ch-heroi+.ch-prova{margin-top:var(--cx-16)}
.ch-prova__item{display:grid;align-content:start;gap:var(--cx-2);padding:var(--cx-8) var(--cx-5) var(--cx-8) 0}
.ch-prova__item:nth-child(even){padding-left:var(--cx-5);border-left:1px solid var(--ch-linha)}
.ch-prova__item:nth-child(n+3){border-top:1px solid var(--ch-linha)}
.ch-prova .ch-numeral{font-size:clamp(1.875rem, 1.3rem + 1.6cqi, 2.625rem)}
.ch-prova__fato{font-weight:600;line-height:1.35;color:var(--ch-tinta)}
.ch-prova__fonte{font-size:var(--cx-t-meta);line-height:1.45;color:var(--ch-tinta-fraca)}
@container (min-width: 900px){
  .ch-prova{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ch-prova__item{padding:var(--cx-10) var(--cx-6)}
  .ch-prova__item:first-child{padding-left:0}
  .ch-prova__item+.ch-prova__item{border-left:1px solid var(--ch-linha)}
  .ch-prova__item:nth-child(n+3){border-top:0}
}
@container (max-width: 420px){
  .ch-prova{grid-template-columns:1fr}
  .ch-prova__item,.ch-prova__item:nth-child(even){padding:var(--cx-6) 0;border-left:0}
  .ch-prova__item+.ch-prova__item{border-top:1px solid var(--ch-linha)}
}

/* ---------- CABEÇA DE SEÇÃO ---------- */
.ch-cabeca{display:grid;gap:var(--cx-5) var(--cx-16);margin-bottom:var(--cx-12)}
.ch-cabeca__titulo{display:grid;justify-items:start;gap:var(--cx-5)}
.ch-cabeca__apoio{font-size:var(--cx-t-lead);line-height:1.55;color:var(--ch-tinta-fraca);max-width:46ch}
.ch-cabeca--centro{justify-items:center;text-align:center}
.ch-cabeca--centro .ch-cabeca__titulo{justify-items:center}
@container (min-width: 900px){
  .ch-cabeca:not(.ch-cabeca--centro):has(.ch-cabeca__apoio){grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end}
}

/* ---------- CARTÃO ---------- */
.ch-cartoes{display:grid;gap:var(--cx-5)}
@container (min-width: 720px){.ch-cartoes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ch-cartao{position:relative;display:flex;flex-direction:column;gap:var(--cx-3);padding:var(--cx-8);overflow:hidden;
  background:var(--ch-fundo-2);color:var(--ch-tinta);border:1px solid var(--ch-linha);border-radius:var(--cx-raio-2);
  transition:transform var(--cx-base) var(--cx-curva), box-shadow var(--cx-base) var(--cx-curva)}
.ch-cartao p:not([class]){color:var(--ch-tinta-fraca)}
.ch-cartao__icone{display:grid;place-items:center;width:48px;height:48px;margin-bottom:var(--cx-3);border-radius:12px;
  background:var(--ch-fundo-3);color:var(--ch-prova)}
.ch-cartao__icone svg{width:24px;height:24px}
.ch-cartao__num{font:italic 460 2.75rem/1 var(--cx-f-display);color:var(--ch-prova-clara);margin-bottom:var(--cx-4)}
.ch-cartao--foto{padding:0}
.ch-cartao--foto img{width:100%;aspect-ratio:3/2;object-fit:cover}
.ch-cartao--foto .ch-cartao__corpo{display:grid;gap:var(--cx-3);padding:var(--cx-6) var(--cx-8) var(--cx-8)}
.ch-cartao--destaque{padding:var(--cx-10);border-color:transparent;justify-content:flex-end;min-height:22rem}
.ch-cartao--destaque h3{font-size:var(--cx-t-h2);line-height:1.05}
.ch-cartao--destaque .ch-marca-dagua{width:112%;right:-18%;top:5%;opacity:.16}
.ch-cartao--destaque>*:not(.ch-marca-dagua){position:relative}
.ch-cartao--destaque .ch-chip{background:transparent;border-color:var(--ch-linha-forte);align-self:flex-start}
@media (hover:hover){.ch-cartao:not(.ch-cartao--destaque):hover{transform:translateY(-3px);box-shadow:var(--cx-sombra-2)}}

/* ---------- BENTO ---------- */
.ch-bento{display:grid;gap:var(--cx-5)}
@container (min-width: 620px){
  .ch-bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ch-bento>:first-child,.ch-bento>:last-child{grid-column:span 2}
}
@container (min-width: 960px){
  .ch-bento{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr)}
  .ch-bento>:first-child{grid-column:auto;grid-row:span 2}
  .ch-bento>:last-child{grid-column:span 2}
}

/* ---------- LINHA DO DIA ---------- */
.ch-dia{display:grid;gap:var(--cx-10);list-style:none;padding:0}
.ch-dia__passo{position:relative;display:grid;align-content:start;gap:var(--cx-3);padding-left:var(--cx-12)}
.ch-dia__passo::before{content:"";position:absolute;left:13px;top:28px;bottom:calc(-1 * var(--cx-10));width:2px;background:var(--ch-linha)}
.ch-dia__passo:last-child::before{display:none}
.ch-dia__marco{position:absolute;left:0;top:0;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  background:var(--ch-fundo);border:1.5px solid var(--ch-linha-viva);color:var(--ch-estrela)}
.ch-dia__marco svg{width:14px;height:14px}
.ch-dia__passo p:not([class]){color:var(--ch-tinta-fraca)}
@container (min-width: 800px){
  .ch-dia{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--cx-10)}
  .ch-dia__passo{padding-left:0;padding-top:var(--cx-12)}
  .ch-dia__passo::before{left:36px;right:calc(-1 * var(--cx-10));top:13px;bottom:auto;width:auto;height:2px}
  .ch-dia__passo:last-child::before{display:block;right:0;background:linear-gradient(90deg,var(--ch-linha),transparent)}
}

/* ---------- MÍDIA DIVIDIDA ---------- */
.ch-midia{display:grid;gap:var(--cx-12);align-items:center}
@container (min-width: 900px){
  .ch-midia{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--cx-20)}
  .ch-midia--inverte{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
  .ch-midia--inverte>:first-child{order:2}
}
.ch-midia__texto{display:grid;justify-items:start;gap:var(--cx-6)}
.ch-foto{position:relative;margin:0;overflow:hidden;border-radius:var(--cx-raio-3);background:var(--ch-fundo-3)}
.ch-foto img{width:100%;height:100%;object-fit:cover}
.ch-foto--retrato img{aspect-ratio:4/5}
.ch-foto--paisagem img{aspect-ratio:3/2}
.ch-foto figcaption{position:absolute;left:var(--cx-4);bottom:var(--cx-4);padding:.375rem .75rem;border-radius:var(--cx-raio-pilula);
  background:var(--ch-fundo);color:var(--ch-tinta);font-size:var(--cx-t-meta);font-weight:500}
.ch-lista{display:grid;gap:var(--cx-6);list-style:none;padding:0;width:100%}
.ch-lista li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:var(--cx-2) var(--cx-5);padding-top:var(--cx-6);border-top:1px solid var(--ch-linha)}
.ch-lista .ch-cartao__icone{grid-row:span 2;margin:0}
.ch-lista p:not([class]){color:var(--ch-tinta-fraca)}

/* ---------- CITAÇÃO ---------- */
.ch-citacao{position:relative;display:grid;justify-items:center;gap:var(--cx-8);max-width:48rem;margin-inline:auto;text-align:center}
.ch-citacao>svg{width:28px;height:28px;color:var(--ch-estrela)}
.ch-citacao blockquote{margin:0;font:italic 440 var(--cx-t-citacao)/1.28 var(--cx-f-display);letter-spacing:-.01em;color:var(--ch-tinta);text-wrap:balance}
.ch-citacao figcaption{display:grid;justify-items:center;gap:var(--cx-4);font:600 var(--cx-t-rotulo)/1.3 var(--cx-f-corpo);
  letter-spacing:.2em;text-transform:uppercase;color:var(--ch-rotulo)}
.ch-citacao figcaption::before{content:"";width:48px;height:2px;background:var(--ch-linha-viva)}

/* ---------- PERGUNTAS ---------- */
.ch-faq{display:grid;gap:var(--cx-10)}
.ch-faq__cabeca{display:grid;justify-items:start;gap:var(--cx-5);align-self:start}
@container (min-width: 900px){
  .ch-faq{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cx-20)}
  .ch-faq__cabeca{position:sticky;top:calc(var(--cx-topo) + var(--cx-8))}
}
.ch-faq__lista{border-top:1px solid var(--ch-linha)}
.ch-faq details{border-bottom:1px solid var(--ch-linha)}
.ch-faq summary{display:flex;align-items:center;justify-content:space-between;gap:var(--cx-6);padding:var(--cx-6) 0;cursor:pointer;
  list-style:none;font:560 1.25rem/1.35 var(--cx-f-display);color:var(--ch-tinta)}
.ch-faq summary::-webkit-details-marker{display:none}
.ch-faq__sinal{flex:none;width:32px;height:32px;padding:7px;border:1px solid var(--ch-linha-forte);border-radius:50%;color:var(--ch-tinta);
  transition:transform var(--cx-base) var(--cx-curva), background-color var(--cx-micro) var(--cx-curva)}
.ch-faq summary:hover .ch-faq__sinal{border-color:var(--ch-tinta)}
.ch-faq details[open] .ch-faq__sinal{transform:rotate(45deg);background:var(--ch-acao);color:var(--ch-sobre-acao);border-color:var(--ch-acao)}
.ch-faq__resposta{max-width:60ch;padding:0 var(--cx-12) var(--cx-6) 0;color:var(--ch-tinta-fraca)}

/* ---------- FECHAMENTO ---------- */
.ch-fecho{display:grid;gap:var(--cx-12);align-items:center}
.ch-fecho__texto{display:grid;justify-items:start;gap:var(--cx-6)}
.ch-fecho__apoio{color:var(--ch-tinta-fraca);max-width:48ch;font-size:var(--cx-t-lead);line-height:1.55}
@container (min-width: 900px){.ch-fecho{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--cx-20)}}
.ch-endereco{overflow:hidden;background:var(--ch-fundo-2);border:1px solid var(--ch-linha);border-radius:var(--cx-raio-3);box-shadow:var(--cx-sombra-2)}
.ch-endereco img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ch-endereco__corpo{display:grid;justify-items:start;gap:var(--cx-4);padding:var(--cx-8)}
.ch-endereco address{font-weight:500;line-height:1.5}
.ch-endereco p:not([class]){font-size:var(--cx-t-pequeno);color:var(--ch-tinta-fraca)}

/* ---------- RODAPÉ ---------- */
.ch-rodape{padding:var(--cx-20) 0 var(--cx-8)}
.ch-rodape__grade{display:grid;gap:var(--cx-10)}
@container (min-width: 800px){.ch-rodape__grade{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)}}
.ch-rodape__marca{display:grid;justify-items:start;gap:var(--cx-6)}
.ch-rodape__marca svg{width:180px;height:auto;aspect-ratio:557.5/309.2}
.ch-rodape__marca p:not([class]){color:var(--ch-tinta-fraca);max-width:30ch}
.ch-rodape h3{margin-bottom:var(--cx-4);font:600 var(--cx-t-rotulo)/1.3 var(--cx-f-corpo);letter-spacing:.2em;text-transform:uppercase;color:var(--ch-rotulo)}
.ch-rodape ul{display:grid;gap:var(--cx-2);list-style:none;padding:0}
.ch-rodape a{text-decoration-color:var(--ch-linha-forte)}
.ch-rodape a:hover{text-decoration-color:var(--ch-linha-viva)}
.ch-rodape address{color:var(--ch-tinta)}
.ch-rodape__fim{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--cx-2) var(--cx-6);margin-top:var(--cx-16);
  padding-top:var(--cx-6);border-top:1px solid var(--ch-linha);font-size:var(--cx-t-meta);color:var(--ch-tinta-fraca)}

/* ---------- WHATSAPP FLUTUANTE ---------- */
.ch-wa{position:fixed;z-index:30;right:max(var(--cx-4), env(safe-area-inset-right));bottom:max(var(--cx-4), env(safe-area-inset-bottom));
  display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--cx-whats);color:var(--cx-sobre-whats);
  box-shadow:var(--cx-sombra-3);transition:transform var(--cx-micro) var(--cx-curva)}
.ch-wa svg{width:28px;height:28px}
.ch-wa:hover{transform:scale(1.06)}

/* ---------- AVISO DE COOKIES ---------- */
.ch-cookie{position:fixed;z-index:35;left:var(--cx-4);right:var(--cx-4);bottom:var(--cx-4);display:grid;gap:var(--cx-4);max-width:28rem;
  padding:var(--cx-6);background:var(--ch-fundo-2);color:var(--ch-tinta);border:1px solid var(--ch-linha);border-radius:var(--cx-raio-2);box-shadow:var(--cx-sombra-3)}
.ch-cookie p:not([class]){font-size:var(--cx-t-pequeno);color:var(--ch-tinta-fraca)}
.ch-cookie__acoes{display:flex;flex-wrap:wrap;gap:var(--cx-3)}
.ch-cookie .ch-btn{min-height:44px;padding:.625rem 1.125rem;font-size:var(--cx-t-pequeno)}
/* O display grid do aviso venceria o atributo hidden. O script tira o hidden na carga e poe
   .is-visible so quando a primeira dobra sai da tela; ate la, o aviso nao cobre o CTA do heroi. */
.ch-cookie[hidden],.ch-cookie:not(.is-visible),.ch-cookie [data-lgpd-modo][hidden]{display:none}
/* Com o aviso aberto, o flutuante sobe acima dele: o script expoe a altura em --lgpd-banner-h. */
html[style*="--lgpd-banner-h"] .ch-wa{bottom:calc(var(--cx-4) * 2 + var(--lgpd-banner-h))}

/* ---------- FORMULÁRIO ---------- */
.ch-form{display:grid;gap:var(--cx-6)}
.ch-campo{display:grid;gap:var(--cx-2)}
.ch-campo label{font-weight:600;font-size:var(--cx-t-pequeno);color:var(--ch-tinta)}
.ch-campo__dica{font-size:var(--cx-t-meta);color:var(--ch-tinta-fraca)}
.ch-campo input,.ch-campo select,.ch-campo textarea{width:100%;min-height:52px;padding:.8rem 1rem;font:inherit;color:var(--ch-tinta);
  background:var(--cx-campo-fundo);border:1.5px solid var(--cx-campo-borda);border-radius:var(--cx-raio-1);
  transition:border-color var(--cx-micro) var(--cx-curva), box-shadow var(--cx-micro) var(--cx-curva)}
.ch-campo textarea{min-height:120px;resize:vertical}
.ch-campo ::placeholder{color:var(--cx-placeholder);opacity:1}
.ch-campo input:focus-visible,.ch-campo select:focus-visible,.ch-campo textarea:focus-visible{outline:3px solid var(--ch-foco);outline-offset:1px;border-color:var(--ch-foco)}
.ch-campo [aria-invalid="true"]{border-color:var(--cx-erro-tinta)}
.ch-campo__erro{display:flex;align-items:center;gap:var(--cx-2);font-size:var(--cx-t-meta);font-weight:600;color:var(--cx-erro-tinta)}
.ch-campo__erro svg{width:16px;height:16px;flex:none}
.ch-aviso{display:flex;gap:var(--cx-3);padding:var(--cx-4) var(--cx-5);border-radius:var(--cx-raio-1);border-left:3px solid currentColor;font-size:var(--cx-t-pequeno)}
.ch-aviso svg{width:20px;height:20px;flex:none;margin-top:2px}
.ch-aviso--ok{background:var(--cx-ok-fundo);color:var(--cx-ok)}
.ch-aviso--aviso{background:var(--cx-aviso-fundo);color:var(--cx-aviso)}
.ch-aviso--erro{background:var(--cx-erro-fundo);color:var(--cx-erro-tinta)}

/* ---------- DOCUMENTO LEGAL ---------- */
.ch-legal{max-width:68ch}
.ch-legal h1{font-size:var(--cx-t-h2);line-height:1.08;margin-bottom:var(--cx-3)}
.ch-legal h2{font-size:1.5rem;line-height:1.25;margin:var(--cx-10) 0 var(--cx-3)}
.ch-legal p:not([class]),.ch-legal li{color:var(--ch-tinta-fraca)}
.ch-legal p:not([class])+p{margin-top:var(--cx-4)}
.ch-legal ul{padding-left:1.2em;margin-top:var(--cx-3)}
.ch-legal li+li{margin-top:var(--cx-2)}
.ch-legal li::marker{color:var(--ch-estrela)}

/* ============================================================
   RECORTE · v3 (28/09/2026). A criança entra como modelo, em
   recorte com fundo transparente, e sai da caixa: vaza a faixa
   do herói, fura o topo do painel, senta na borda do cartão.
   O recorte é sempre imagem de modelo, nunca foto de aluno, e
   o rodapé diz isso. A cena corta a imagem onde a caixa corta:
   a borda de baixo do recorte encosta na borda de baixo do painel.
   ============================================================ */

/* ---------- ADESIVO · rótulo girado que pousa sobre a cena ---------- */
.ch-adesivo{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:.5em;padding:.55rem 1rem;
  border-radius:var(--cx-raio-pilula);background:var(--cx-adesivo);color:var(--cx-sobre-adesivo);box-shadow:var(--cx-sombra-2);
  font:700 var(--cx-t-meta)/1.2 var(--cx-f-corpo);letter-spacing:.01em;white-space:nowrap;transform:rotate(var(--giro,-4deg))}
.ch-adesivo svg{width:1.1em;height:1.1em;flex:none;color:var(--cx-p-ouro-forte)}
.ch-adesivo--ouro{background:var(--cx-faixa);color:var(--cx-sobre-faixa)}
.ch-adesivo--ouro svg{color:var(--cx-sobre-faixa)}

/* ---------- PALCO · herói na ilha, modelo vazando para baixo ---------- */
.ch-palco{position:relative;isolation:isolate;padding-bottom:0}
.ch-palco__fundo{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.ch-palco__eco{position:absolute;left:50%;bottom:-.18em;transform:translateX(-50%);font:italic 700 clamp(7rem, 2rem + 17vw, 17rem)/1 var(--cx-f-display);
  letter-spacing:-.04em;white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px var(--ch-linha-forte);opacity:.55}
.ch-palco__fundo .ch-marca-dagua{width:min(760px,90vw);right:-12%;top:-8%;opacity:.12}
.ch-palco__grade{display:grid;gap:var(--cx-10)}
.ch-palco__texto{display:grid;justify-items:start;gap:var(--cx-6);align-self:center}
.ch-palco .ch-titulo-heroi{font-size:clamp(2.75rem, 1rem + 6.6cqi, 5.75rem);line-height:.98}
.ch-palco .ch-lead{max-width:40ch}
.ch-palco__cena{position:relative;z-index:2;justify-self:center;width:min(92%,420px);clip-path:inset(-100vh -100vw 0 -100vw)}
.ch-disco{position:absolute;z-index:-1;left:6%;right:2%;top:12%;aspect-ratio:1;border-radius:50%;background:var(--cx-faixa)}
.ch-disco::after{content:"";position:absolute;inset:-5%;border-radius:50%;border:1.5px dashed var(--ch-linha-forte)}
.ch-palco__recorte{position:relative;width:100%;height:auto;filter:var(--cx-sombra-recorte)}
.ch-palco__cena .ch-adesivo:nth-child(3){left:-6%;top:30%;--giro:-7deg}
.ch-palco__cena .ch-adesivo:nth-child(4){right:-4%;top:52%;--giro:5deg}
.ch-palco__cena .ch-adesivo:nth-child(5){left:-2%;bottom:16%;--giro:-3deg}
@container (min-width: 900px){
  .ch-palco__grade{grid-template-columns:minmax(0,6.4fr) minmax(0,5.6fr);gap:var(--cx-8);align-items:end}
  .ch-palco__texto{padding-bottom:var(--cx-secao)}
  .ch-palco__cena{width:100%;max-width:500px;justify-self:end}
  .ch-palco__cena .ch-adesivo:nth-child(3){left:-14%}
}
@container (max-width: 420px){.ch-adesivo{font-size:.8125rem;padding:.45rem .8rem}}

/* ---------- LETREIRO · a faixa de ouro que corre, girada ---------- */
.ch-letreiro{position:relative;z-index:1;overflow:hidden;padding-block:var(--cx-6)}
.ch-letreiro__faixa{width:calc(100% + 6rem);margin-left:-3rem;padding-block:var(--cx-4);background:var(--cx-faixa);color:var(--cx-sobre-faixa);
  transform:rotate(-2deg);box-shadow:var(--cx-sombra-2)}
.ch-letreiro__trilho{display:flex;width:max-content;animation:ch-corre 48s linear infinite}
.ch-letreiro ul{display:flex;align-items:center;gap:var(--cx-8);padding:0 var(--cx-8) 0 0;margin:0;list-style:none}
.ch-letreiro li{display:inline-flex;align-items:center;gap:var(--cx-8);font:italic 600 clamp(1.375rem, 1.1rem + 1.2vw, 2.125rem)/1.1 var(--cx-f-display);white-space:nowrap}
.ch-letreiro li svg{width:.8em;height:.8em;flex:none}
@keyframes ch-corre{to{transform:translateX(-50%)}}

/* ---------- PAINEL INVADIDO · a caixa colorida e quem fura o topo dela ---------- */
.ch-invade{display:grid;gap:var(--cx-12);align-items:center}
.ch-invade__painel{--ch-painel:var(--ch-fundo-3);position:relative;isolation:isolate;margin-top:var(--cx-16);aspect-ratio:1/1.02;
  border-radius:var(--cx-raio-3);background:var(--ch-painel);clip-path:inset(-100vh -100vw 0 -100vw round 0 0 var(--cx-raio-3) var(--cx-raio-3))}
.ch-invade--ouro .ch-invade__painel{--ch-painel:var(--cx-faixa)}
.ch-invade--marinho .ch-invade__painel{--ch-painel:var(--cx-ilha)}
.ch-invade__fundo{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.ch-invade__painel:has(.ch-invade__fundo)::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
  background:linear-gradient(180deg,rgba(1,10,44,0) 35%,rgba(1,10,44,.55))}
.ch-invade__recorte{position:absolute;left:50%;bottom:0;width:auto;max-width:none;height:118%;transform:translateX(-50%);filter:var(--cx-sombra-recorte)}
.ch-invade__painel .ch-constelacao{position:absolute;left:var(--cx-6);top:var(--cx-6);width:96px;color:var(--cx-sobre-faixa);opacity:.5}
.ch-invade--marinho .ch-invade__painel .ch-constelacao{color:var(--cx-p-ouro)}
.ch-invade__painel .ch-adesivo:nth-of-type(1){left:-4%;top:28%;--giro:-6deg}
.ch-invade__painel .ch-adesivo:nth-of-type(2){right:-3%;bottom:14%;--giro:4deg}
.ch-invade__texto{container-type:inline-size;display:grid;justify-items:start;gap:var(--cx-6)}
@container (min-width: 900px){
  .ch-invade{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--cx-20)}
  .ch-invade--inverte{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
  .ch-invade--inverte>:first-child{order:2}
}
@container (max-width: 560px){.ch-invade__painel{margin-inline:var(--cx-3)}}

/* ---------- CARTÃO COM RECORTE · o objeto pula para fora do cartão ---------- */
.ch-cartao--recorte{overflow:visible}
.ch-cartao__recorte{display:block;width:min(88%,340px);height:auto;margin:calc(-1 * var(--cx-16)) auto var(--cx-4);filter:var(--cx-sombra-recorte)}
.ch-bento:has(.ch-cartao--recorte){margin-top:var(--cx-20)}
/* Variante de lado: texto à esquerda, modelo sentada na borda de baixo. */
.ch-cartao--sentado{overflow:visible;min-height:17rem}
.ch-cartao--sentado .ch-cartao__modelo{display:block;width:min(70%,260px);height:auto;margin:var(--cx-2) auto calc(-1 * var(--cx-16));filter:var(--cx-sombra-recorte)}
@container (min-width: 620px){
  .ch-cartao--sentado{padding-right:36%}
  .ch-cartao--sentado .ch-cartao__modelo{position:absolute;right:4%;bottom:calc(-1 * var(--cx-12));width:27%;max-width:220px;margin:0}
}

/* ---------- CARTÕES COM MODELO · a modelo em pé no fim da fileira ---------- */
.ch-cartoes--modelo .ch-cartoes__modelo{display:flex;justify-content:center;order:-1}
.ch-cartoes--modelo .ch-cartoes__modelo img{width:auto;height:340px;filter:var(--cx-sombra-recorte)}
@container (min-width: 960px){
  .ch-cartoes--modelo{grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,.85fr);align-items:stretch}
  .ch-cartoes--modelo .ch-cartoes__modelo{position:relative;order:0}
  .ch-cartoes--modelo .ch-cartoes__modelo img{position:absolute;left:50%;bottom:0;height:150%;transform:translateX(-50%)}
}

/* ---------- MOVIMENTO ---------- */
.ch-anima .ch-entra{opacity:0;transform:translateY(18px);transition:opacity var(--cx-lento) var(--cx-curva), transform var(--cx-lento) var(--cx-curva)}
.ch-anima .ch-entra.ch-visivel{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .ch-anima .ch-entra{opacity:1;transform:none;transition:none}
  .ch-selo__giro{animation:none}
  .ch-letreiro__trilho{animation:none;width:auto}
  .ch-letreiro ul+ul{display:none}
  .ch-btn,.ch-cartao,.ch-link svg,.ch-faq__sinal,.ch-wa{transition:none}
}

.ds-capa .ch-marca-dagua{width:900px;right:-240px;bottom:-190px;opacity:.06}

.ds-fim .ch-tela{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--cx-4)}
