/* Páginas internas (blog e as próximas). Usa os tokens do site (cores, fontes) definidos no CSS da página. */
.pagina { background: var(--brand-paper); color: var(--brand-ink); }
.pagina-topo { position: relative; z-index: 1; background: var(--brand-lime); padding: 32px 0 56px; }
@media (min-width: 1180px) { .pagina-topo { padding: calc(200 * var(--u)) 0 calc(72 * var(--u)); } }
.pagina-topo h1 { font-family: var(--font-display); font-weight: 600; font-size: clamp(2rem, 4.2vw, 3.4rem); line-height: 1.1; letter-spacing: -.02em; margin: 0 0 14px; max-width: 18ch; }
.pagina-sobre { display: inline-block; margin: 0 0 14px; padding: 4px 12px; border-radius: 999px; background: var(--brand-ink); color: var(--brand-lime); font-weight: 600; font-size: .85rem; letter-spacing: .02em; }
.pagina-intro { font-size: 1.15rem; max-width: 46ch; margin: 0; }
.pagina-corpo { padding: 56px 0 88px; }

.blog-vazio { text-align: center; font-size: 1.15rem; color: #6B6680; padding: 40px 0; }

.container--texto { max-width: calc(760px + 2 * var(--gutter)); }
.artigo-topo h1 { max-width: none; }
.artigo-voltar { display: table; margin-bottom: 18px; font-weight: 600; text-decoration: none; }
.artigo-voltar:hover { text-decoration: underline; }
.artigo-meta { margin: 0; color: #3A3355; }
.artigo-capa { margin-top: -28px; }
.artigo-capa img { width: 100%; border-radius: 22px; box-shadow: 0 18px 40px rgba(26,18,55,.12); }
.artigo-texto { padding-top: 40px; padding-bottom: 72px; font-size: 1.125rem; line-height: 1.75; }
.artigo-texto > :first-child { margin-top: 0; }
.artigo-texto p { margin: 0 0 1.1em; }
.artigo-texto h2 { font-family: var(--font-display); font-weight: 600; font-size: 1.6rem; line-height: 1.25; margin: 1.6em 0 .5em; }
.artigo-texto h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; margin: 1.4em 0 .4em; }
.artigo-texto ul, .artigo-texto ol { padding-left: 1.3em; margin: 0 0 1.1em; }
.artigo-texto li { margin-bottom: .35em; }
.artigo-texto blockquote { margin: 1.4em 0; padding: 6px 0 6px 22px; border-left: 4px solid var(--brand-blue); font-size: 1.2rem; }
.artigo-texto figure { margin: 1.8em 0; }
.artigo-texto figure img { width: 100%; border-radius: 16px; }
.artigo-texto figcaption { margin-top: 8px; font-size: .92rem; color: #6B6680; }
.artigo-texto a { color: var(--brand-blue); text-underline-offset: 3px; }
.artigo-mais { background: var(--brand-ink); color: var(--ui-white); }
.mais-titulo { font-family: var(--font-display); font-weight: 600; font-size: 1.6rem; margin: 0 0 24px; }


/* =====================================================================
   Quem somos (19/10/2026, segunda versão), fiel à referência
   "Bobby_ pessoas além da média": topo lavanda, história em papel,
   propósito em ink, equipe em lavanda, convite em lime.
   ===================================================================== */
.masthead:has(.qs-topo) { background: #F4F4FD; }
.masthead:has(.qs-topo) .sheen { display: none; }
.pagina:has(.qs-topo) { background: #F4F4FD; }
.qs-topo, .qs-historia, .qs-proposito, .qs-equipe, .qs-convite { position: relative; isolation: isolate; overflow: clip; }
.qs-proposito, .qs-convite { overflow-x: clip; overflow-y: visible; }   /* o traço atravessa para a seção de cima sem corte */

.qs-rotulo { margin: 0 0 14px; font: 700 .8125rem/1 var(--font-text); letter-spacing: .06em; text-transform: uppercase; color: #6F8000; }
.qs-topo h1, .qs-historia h2, .qs-proposito h2, .qs-equipe h2, .qs-convite h2 {
  margin: 0; font-family: var(--font-display); font-weight: 600; letter-spacing: -.03em; line-height: 1.04; text-wrap: balance;
}
.qs-topo h1 .ln, .qs-historia h2 .ln, .qs-proposito h2 .ln, .qs-equipe h2 .ln, .qs-convite h2 .ln { display: block; }
.qs-texto { margin: 18px 0 0; max-width: 34rem; font-size: clamp(1rem, .95rem + .3vw, 1.1875rem); line-height: 1.55; color: #2B2450; }
.qs-texto--curto { margin-top: 12px; }
.qs-cta { margin-top: 28px; }
.qs-linha { position: absolute; z-index: 0; pointer-events: none; fill: none; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }

/* 1. abertura */
.qs-topo { background: #F4F4FD; padding-bottom: clamp(32px, 4vw, 56px); }
.qs-hero { display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr); gap: clamp(24px, 3vw, 48px); align-items: center; }
.qs-topo h1 { font-size: clamp(2.375rem, 1.2rem + 3.3vw, 4.25rem); }
.qs-hero-figura { position: relative; margin: 0; }
.qs-hero-figura > img { position: relative; z-index: 1; display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 26px; }
.qs-linha--hero { inset: -6% -3% 4% -5%; width: 108%; height: 102%; stroke: var(--brand-lime); stroke-width: 4; }
.qs-selo {
  position: absolute; z-index: 2; right: 0; bottom: -18px;
  display: flex; align-items: center; gap: 14px; max-width: 18rem;
  padding: 16px 20px; border-radius: 18px;
  background: #F6FDDA; color: var(--brand-ink);
  box-shadow: 0 18px 36px -22px rgba(26,18,55,.45);
  font-size: .9375rem; line-height: 1.35;
}
.qs-selo svg { flex: none; width: 34px; height: 34px; color: #6F8000; }
.qs-selo strong { font-weight: 700; }

/* 2. história */
.qs-historia { background: #EDE7E2; }
.qs-linha--historia { left: 0; top: 0; width: min(46vw, 640px); height: 100%; stroke: var(--brand-lime); stroke-width: 5; }
.qs-historia-grid { display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.qs-retrato { position: relative; z-index: 1; margin: 0; }
.qs-retrato img { display: block; width: 100%; height: auto; aspect-ratio: 530 / 506; object-fit: cover; border-radius: 22px; }
.qs-retrato figcaption, .qs-foto figcaption { margin-top: 12px; line-height: 1.3; }
.qs-retrato figcaption strong, .qs-foto figcaption strong { display: block; font: 600 1.0625rem/1.3 var(--font-display); color: var(--brand-ink); }
.qs-retrato figcaption span, .qs-foto figcaption span { display: block; font-size: .875rem; color: #4A4366; }
.qs-historia h2 { font-size: clamp(2.125rem, 1.1rem + 3vw, 3.875rem); }
.qs-destaque { margin: 28px 0 0; font: 600 clamp(1.25rem, 1rem + 1vw, 1.875rem)/1.25 var(--font-display); letter-spacing: -.015em; color: var(--brand-ink); }
.qs-destaque span {   /* marca-texto lime, levemente inclinada, como na referência */
  display: table; margin-bottom: 4px; padding: 2px 10px;
  background: var(--brand-lime); transform: rotate(-2deg); transform-origin: left center;
}
.qs-destaque span + span { margin-left: 4px; transform: rotate(-1.4deg); }

/* 3. propósito */
.qs-proposito { background: var(--brand-ink); color: var(--ui-white); }
.qs-proposito .qs-rotulo { color: var(--brand-lime); }
.qs-linha--proposito { right: -4%; top: -14%; width: min(36vw, 480px); height: auto; stroke: var(--brand-lime); stroke-width: 22; }
.qs-proposito h2 { font-size: clamp(2.125rem, 1.1rem + 3vw, 3.875rem); }
.qs-mv { display: grid; grid-template-columns: 1fr 1fr; margin-top: clamp(28px, 4vw, 48px); }
.qs-mv-item { display: flex; gap: 18px; align-items: flex-start; padding-right: clamp(20px, 3vw, 48px); }
.qs-mv-item + .qs-mv-item { padding: 0 0 0 clamp(20px, 3vw, 48px); border-left: 1px solid rgba(255,255,255,.28); }
.qs-mv-item > svg { flex: none; width: 44px; height: 44px; color: var(--brand-lime); }
.qs-mv h3 { margin: 0 0 6px; font: 600 1.25rem/1.25 var(--font-display); color: var(--brand-lime); }
.qs-mv p { margin: 0; max-width: 30rem; font-size: 1.0625rem; line-height: 1.5; color: rgba(255,255,255,.88); }
.qs-crencas {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px;
  margin: clamp(28px, 3.4vw, 40px) 0 0; padding: clamp(24px, 3vw, 32px) 0 0; list-style: none;
  border-top: 1px solid rgba(255,255,255,.28);
}
.qs-crencas li { display: flex; align-items: center; gap: 14px; font: 600 1.0625rem/1.3 var(--font-text); }
.qs-crencas svg { flex: none; width: 42px; height: 42px; color: var(--brand-lime); }
.qs-crencas .ln { display: block; }

/* 4. equipe */
.qs-equipe { background: #F4F4FD; }
.qs-equipe h2 { font-size: clamp(2.125rem, 1.1rem + 3vw, 3.875rem); }
.qs-equipe-sub { margin: 12px 0 0; font-size: clamp(1.0625rem, 1rem + .5vw, 1.375rem); color: var(--brand-ink); }
.qs-fotos { display: grid; grid-template-columns: 0.9fr 1fr 1.75fr; gap: clamp(10px, 1.2vw, 16px); margin-top: clamp(24px, 3vw, 36px); }
.qs-foto { margin: 0; }
.qs-foto img { display: block; width: 100%; height: clamp(220px, 24vw, 350px); object-fit: cover; border-radius: 16px; }
.qs-foto:nth-child(2) img { object-position: 50% 30%; }

/* 5. convite */
.qs-convite { background: var(--brand-lime); color: var(--brand-ink); }
.qs-convite .container { position: relative; z-index: 1; }
.qs-convite h2 { font-size: clamp(1.875rem, 1rem + 2.6vw, 3.25rem); line-height: 1.08; }
.qs-convite .qs-texto { max-width: 28rem; color: var(--brand-ink); }
.qs-linha--convite { right: -6%; top: -18%; width: min(52vw, 760px); height: auto; stroke: var(--brand-ink); stroke-width: 26; }

/* tablet e celular */
@media (max-width: 899.98px) {
  .qs-hero, .qs-historia-grid { grid-template-columns: minmax(0, 1fr); }
  .qs-hero-figura { margin-top: 8px; }
  .qs-retrato { max-width: 420px; }
  .qs-mv { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .qs-mv-item + .qs-mv-item { padding: 24px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.28); }
  .qs-crencas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; }
  .qs-fotos { grid-template-columns: 1fr 1fr; }
  .qs-foto--larga { grid-column: 1 / -1; }
  .qs-linha--historia { width: 90vw; height: 46%; opacity: .8; }
  .qs-linha--convite { width: 70vw; top: auto; bottom: -24%; opacity: .9; }
}
@media (max-width: 599.98px) {
  .qs-selo { position: relative; right: auto; bottom: auto; margin: -28px 12px 0 auto; max-width: 16rem; padding: 12px 16px; font-size: .875rem; }
  .qs-crencas li { font-size: .9375rem; gap: 10px; }
  .qs-crencas svg { width: 34px; height: 34px; }
  .qs-foto img { height: 200px; }
  .qs-linha--proposito { width: 46vw; }
}

/* proporções da referência (19/10/2026): textos e ícones maiores, menos espaço vertical */
.qs-historia, .qs-proposito, .qs-equipe, .qs-convite { padding-block: clamp(44px, 4.6vw, 72px); }
.qs-rotulo { font-size: .9375rem; margin-bottom: 12px; }
.qs-texto { font-size: clamp(1.0625rem, .9rem + .5vw, 1.3125rem); max-width: 36rem; }
.qs-topo h1 { font-size: clamp(2.5rem, 1.1rem + 3.9vw, 4.75rem); }
.qs-historia h2, .qs-proposito h2, .qs-equipe h2 { font-size: clamp(2.25rem, 1.1rem + 3.4vw, 4.25rem); }
.qs-convite h2 { font-size: clamp(2rem, 1rem + 3vw, 3.75rem); }
.qs-cta { min-height: 56px; padding: 0 30px; font-size: 1.125rem; }
.qs-selo { font-size: 1.0625rem; max-width: 20rem; padding: 18px 22px; }
.qs-selo svg { width: 40px; height: 40px; }
.qs-destaque { font-size: clamp(1.375rem, 1rem + 1.3vw, 2.125rem); }
.qs-retrato figcaption strong, .qs-foto figcaption strong { font-size: 1.25rem; }
.qs-retrato figcaption span, .qs-foto figcaption span { font-size: 1rem; }
.qs-mv h3 { font-size: 1.5rem; }
.qs-mv p { font-size: clamp(1.0625rem, .95rem + .4vw, 1.25rem); }
.qs-mv-item > svg { width: 54px; height: 54px; }
.qs-crencas li { font-size: clamp(1rem, .9rem + .4vw, 1.25rem); gap: 16px; }
.qs-crencas svg { width: 52px; height: 52px; }
.qs-equipe-sub { font-size: clamp(1.125rem, 1rem + .7vw, 1.625rem); }
.qs-linha--proposito { top: -30%; right: -2%; width: min(32vw, 440px); }
@media (max-width: 599.98px) {
  .qs-crencas li { font-size: .9375rem; }
  .qs-crencas svg { width: 36px; height: 36px; }
  .qs-cta { min-height: 52px; font-size: 1rem; }
}

/* segunda passada (19/10/2026): área de conteúdo mais larga e colunas como na referência */
@media (min-width: 900px) {
  .qs-topo .container, .qs-historia .container, .qs-proposito .container, .qs-equipe .container, .qs-convite .container {
    max-width: calc(1300px + 2 * var(--gutter));
  }
  .qs-hero { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); }
  .qs-historia-grid { grid-template-columns: minmax(0, 0.72fr) minmax(0, 1fr); }
}
.qs-topo h1 { font-size: clamp(2.5rem, 0.9rem + 3.6vw, 4.25rem); }
.qs-historia h2, .qs-proposito h2, .qs-equipe h2 { font-size: clamp(2.25rem, 0.9rem + 3.3vw, 4rem); }
.qs-rotulo { font-size: 1rem; }
.qs-texto { font-size: clamp(1.0625rem, .85rem + .62vw, 1.375rem); max-width: 38rem; }
.qs-cta { font-size: 1.1875rem; min-height: 58px; padding: 0 32px; }
.qs-selo { font-size: 1.125rem; max-width: 21rem; }
.qs-mv p { font-size: clamp(1.0625rem, .85rem + .55vw, 1.3125rem); }
.qs-crencas li { font-size: clamp(1rem, .85rem + .5vw, 1.3125rem); }
.qs-retrato figcaption strong, .qs-foto figcaption strong { font-size: 1.375rem; }
.qs-retrato figcaption span, .qs-foto figcaption span { font-size: 1.0625rem; }
.qs-equipe-sub { font-size: clamp(1.125rem, .95rem + .8vw, 1.75rem); }
.qs-convite .qs-texto { max-width: 34rem; }
@media (max-width: 599.98px) {
  .qs-crencas { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .qs-crencas .ln { display: inline; }
}

/* Abertura: proporções equilibradas e efeitos da skill site-de-10k (19/10/2026) */
@media (min-width: 900px) { .qs-topo .qs-hero { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); } }
.qs-topo .qs-rotulo { font-size: .875rem; margin-bottom: 16px; }
.qs-topo h1 { font-size: clamp(2rem, 1rem + 2vw, 2.875rem); line-height: 1.1; letter-spacing: -.025em; }   /* 19/10: título menor, a pedido */
.qs-topo .qs-texto { margin-top: 20px; max-width: 31rem; font-size: clamp(1rem, .94rem + .25vw, 1.1875rem); line-height: 1.6; color: #3A3355; }
.qs-topo .qs-cta { margin-top: 32px; min-height: 52px; padding: 0 26px; font-size: 1rem; }
.qs-topo .qs-selo { font-size: .9375rem; max-width: 17.5rem; padding: 14px 18px; gap: 12px; }
.qs-topo .qs-selo svg { width: 32px; height: 32px; }

/* linha: contorno lime que se desenha e um pulso de luz que percorre o traço */
.qs-linha--hero { stroke-width: 3; }
.qs-linha--hero path { stroke-width: 3; }
.qs-linha--hero .energy { stroke: var(--ui-white); stroke-dasharray: 0 1; stroke-width: 3.5; filter: drop-shadow(0 0 3px rgba(203,231,0,.9)); }
.qs-linha--hero .energy--tail { stroke-width: 7; stroke-opacity: .35; filter: blur(2px); }
.qs-hero-figura > img { box-shadow: 0 30px 60px -36px rgba(26,18,55,.45); }
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .qs-linha--hero .line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: qs-desenha 1.8s cubic-bezier(.16,1,.3,1) .35s forwards; }
  .js-reveal .qs-linha--hero .energy { stroke-dasharray: .08 1.08; animation: qs-pulso 5.5s cubic-bezier(.45,.05,.35,1) 2.2s infinite backwards; }
  .js-reveal .qs-linha--hero .energy--tail { stroke-dasharray: .22 1.22; animation-name: qs-pulso-cauda; }
  @keyframes qs-desenha { to { stroke-dashoffset: 0; } }
  @keyframes qs-pulso { 0% { stroke-dashoffset: .08; opacity: 0; } 8% { opacity: 1; } 60% { opacity: 1; } 70%, 100% { stroke-dashoffset: -1; opacity: 0; } }
  @keyframes qs-pulso-cauda { 0% { stroke-dashoffset: .22; opacity: 0; } 8% { opacity: 1; } 60% { opacity: 1; } 70%, 100% { stroke-dashoffset: -.86; opacity: 0; } }
  /* a foto entra revelando de baixo para cima, o selo chega depois */
  .js-reveal .qs-hero-figura > img { clip-path: inset(100% 0 0 0 round 26px); animation: qs-revela 1.1s cubic-bezier(.16,1,.3,1) .15s forwards; }
  @keyframes qs-revela { to { clip-path: inset(0 0 0 0 round 26px); } }
  .js-reveal .qs-topo .qs-selo { transition-delay: .9s !important; }
  /* respiro lento da foto ao passar o mouse */
  .qs-hero-figura > img { transition: transform 1.2s cubic-bezier(.16,1,.3,1); }
  .qs-hero-figura:hover > img { transform: scale(1.015); }
}
@media (max-width: 899.98px) {
  .qs-topo h1 { font-size: clamp(1.875rem, 6.6vw, 2.5rem); }
}

/* Abertura (19/10, ajuste do Dauro): título em 2 linhas, texto justificado e a linha da marca
   saindo do hero e entrando na Nossa história, como uma ponte entre as seções */
.qs-topo { overflow: visible; overflow-x: clip; z-index: 2; }
.qs-topo .qs-hero { position: relative; z-index: 1; }
.qs-topo .qs-texto { text-align: justify; hyphens: auto; }
.qs-topo h1 { text-wrap: balance; }   /* 19/10: o título quebra dentro da coluna e nunca passa por cima da foto */
.qs-ponte { position: absolute; z-index: 0; left: 7%; top: 27%; width: min(54vw, 780px); height: auto; aspect-ratio: 1; overflow: visible; pointer-events: none; rotate: 6deg; }
.qs-ponte path { fill: none; stroke-linecap: butt; }
.qs-ponte .line { stroke: var(--brand-lime-soft); stroke-width: 40; }
.qs-ponte .energy { stroke: var(--ui-white); stroke-width: 16; opacity: 0; filter: drop-shadow(0 0 6px rgba(255,255,255,.9)); }
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .qs-ponte .line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: qs-desenha 2.4s cubic-bezier(.16,1,.3,1) .5s forwards; }
  .js-reveal .qs-ponte .energy { stroke-dasharray: .06 1.06; animation: qs-pulso 7s cubic-bezier(.45,.05,.35,1) 3s infinite backwards; }
}
@media (max-width: 899.98px) { .qs-ponte { left: -30%; top: 4%; width: 120vw; opacity: .75; } }

/* 19/10: a linha do contorno da foto continua e desce até a Nossa história (a linha grossa separada saiu) */
.qs-linha--hero { overflow: visible; }

/* 19/10: no desktop a abertura usa a mesma largura e as mesmas margens do cabeçalho
   (começa onde começa o logo e termina onde termina o botão "Agendar demonstração") */
@media (min-width: 1180px) {
  .qs-topo > .container { max-width: calc(1440 * var(--u)); padding: 0 calc(75 * var(--u)); }
}

/* 19/10: a página inteira (todas as seções e o rodapé) segue as margens do cabeçalho no desktop */
@media (min-width: 1180px) {
  .pagina:has(.qs-topo) > section > .container,
  .masthead:has(.qs-topo) .site-footer > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}

/* 19/10: ligação entre a linha da foto da equipe e a foto do Dauro (desenhada pelo JS da página) */
.qs-conector { position: absolute; z-index: 3; left: 0; top: 0; width: 100%; overflow: visible; pointer-events: none; }
.qs-conector path { fill: none; stroke-linecap: round; }
.qs-conector .line { stroke: var(--brand-lime); stroke-width: 3; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.6s cubic-bezier(.16,1,.3,1); }
.qs-conector.ligado .line { stroke-dashoffset: 0; }
.qs-conector .energy { stroke: var(--ui-white); stroke-width: 3.5; opacity: 0; filter: drop-shadow(0 0 3px rgba(203,231,0,.9)); }
@media (prefers-reduced-motion: no-preference) {
  .qs-conector.ligado .energy { stroke-dasharray: .1 1.1; animation: qs-pulso 5.5s cubic-bezier(.45,.05,.35,1) 1.4s infinite backwards; }
}
@media (prefers-reduced-motion: reduce) { .qs-conector .line { stroke-dashoffset: 0; transition: none; } }


/* =====================================================================
   Nossa história, ajuste fino (20/10/2026)
   ===================================================================== */
/* camadas: linhas decorativas sempre atrás de foto e textos */
.qs-historia { overflow: clip; }
.qs-historia > .qs-linha { z-index: 0; }
.qs-historia > .container { position: relative; z-index: 1; }

/* composição: textos centralizados em relação à foto, sem sobra de espaço */
.qs-historia-grid { align-items: center; }
.qs-historia-texto { container-type: inline-size; display: flex; flex-direction: column; justify-content: center; }

/* tipografia da marca: Sora para título e destaques, DM Sans para o texto corrido */
.qs-historia h2 { font-family: "Sora", var(--font-display); font-weight: 700; color: var(--brand-ink);
  font-size: clamp(2.125rem, 7.6cqi, 3.875rem); line-height: 1.08; letter-spacing: -.03em; margin: 0; }
@media (min-width: 900px) { .qs-historia h2 .ln { white-space: nowrap; } }   /* 2 linhas: "Uma história que" / "se tornou propósito." */
.qs-historia .qs-rotulo { margin-bottom: 14px; }
.qs-historia .qs-texto { font-family: "DM Sans", var(--font-text); font-weight: 400; text-align: left; color: var(--brand-ink); margin-top: 22px; max-width: 36rem; line-height: 1.6; }
.qs-historia .qs-texto--curto { margin-top: 14px; }
.qs-retrato figcaption strong { font-family: "Sora", var(--font-display); font-weight: 600; }
.qs-retrato figcaption span { font-family: "DM Sans", var(--font-text); font-weight: 400; }

/* frase de destaque: marca-texto pintado uma vez, da esquerda para a direita */
.qs-destaque { font-family: "Sora", var(--font-display); font-weight: 700; margin-top: 30px; color: var(--brand-ink); }
.qs-destaque span { background: linear-gradient(var(--brand-lime), var(--brand-lime)) 0 0 / 100% 100% no-repeat; box-shadow: none !important; animation: none !important; }
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .qs-destaque span { background-size: 0% 100%; transition: background-size .62s cubic-bezier(.65,0,.35,1) .1s; }
  .js-reveal .qs-destaque span + span { transition-delay: .52s; }      /* a de baixo vem logo depois: ~1,15 s no total */
  .js-reveal .qs-destaque.in span { background-size: 100% 100%; }
  .js-reveal .qs-destaque:not(.in) span { transform: rotate(-2deg); }  /* a inclinação não anima: a frase fica legível o tempo todo */
  .js-reveal .qs-destaque:not(.in) span + span { transform: rotate(-1.4deg); }
}

@media (max-width: 899.98px) {
  .qs-historia h2 { font-size: clamp(2rem, 9vw, 2.75rem); }
}

/* 20/10: parágrafos da Nossa história justificados em todas as telas (hifenização evita buracos no celular) */
.qs-historia .qs-texto { text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto; }

/* 20/10: no computador nenhuma palavra é partida com hífen; o celular mantém a hifenização para não abrir buracos */
@media (min-width: 900px) {
  .qs-topo .qs-texto, .qs-historia .qs-texto { hyphens: manual; -webkit-hyphens: manual; text-justify: inter-word; }
}

/* 20/10: título da abertura sempre em 2 linhas no computador ("Toda criança merece ser" / "vista além da média.");
   o tamanho acompanha a largura da coluna de texto, então nunca quebra em 3 nem invade a foto */
@media (min-width: 900px) {
  .qs-topo .qs-hero-texto { container-type: inline-size; }
  .qs-topo h1 { text-wrap: nowrap; font-size: clamp(2rem, 7.1cqi, 3.25rem); }
  .qs-topo h1 .ln { white-space: nowrap; }
}
/* 20/10: duas linhas também no celular e no tablet */
.qs-topo .qs-hero-texto { container-type: inline-size; }
.qs-topo h1 { text-wrap: nowrap; font-size: clamp(1.5rem, 7.1cqi, 3.25rem); }
.qs-topo h1 .ln { white-space: nowrap; }

/* =====================================================================
   Nosso propósito em "slides" (20/10/2026), inspirado no vídeo de referência:
   cartões coloridos que sobem em sequência, título que entra linha a linha,
   ícones que surgem com um pequeno salto e uma convicção em destaque por vez
   ===================================================================== */
.qs-proposito h2 .ln { overflow: hidden; padding-bottom: .06em; }
.qs-proposito h2 .ln > * { display: inline-block; }

/* missão e visão viram cartões */
.qs-mv { gap: clamp(14px, 1.6vw, 22px); }
.qs-mv-item, .qs-mv-item + .qs-mv-item { position: relative; overflow: hidden; padding: clamp(24px, 2.6vw, 40px); border: 0; border-radius: 26px; }
.qs-mv-item { background: var(--brand-blue); }
.qs-mv-item + .qs-mv-item { background: var(--brand-lime); color: var(--brand-ink); }
.qs-mv-item + .qs-mv-item h3 { color: var(--brand-ink); }
.qs-mv-item + .qs-mv-item p { color: var(--brand-ink); }
.qs-mv-item + .qs-mv-item > svg { color: var(--brand-ink); }
.qs-mv-item > svg { padding: 10px; width: 64px; height: 64px; border-radius: 50%; background: rgba(255,255,255,.14); }
.qs-mv-item + .qs-mv-item > svg { background: rgba(26,18,55,.1); }
.qs-mv-item::after { content: ""; position: absolute; right: -40px; bottom: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255,255,255,.08); pointer-events: none; }

/* convicções viram cartões menores; o destaque passa de um para o outro */
.qs-crencas { gap: clamp(12px, 1.4vw, 18px) !important; border-top: 0 !important; padding-top: 0 !important; margin-top: clamp(14px, 1.6vw, 22px) !important; }
.qs-crencas li { position: relative; padding: clamp(18px, 1.8vw, 26px); border-radius: 22px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1);
  transition: background .5s cubic-bezier(.16,1,.3,1), color .5s, transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s; }
.qs-crencas li > svg { padding: 9px; border-radius: 50%; background: rgba(203,231,0,.14); transition: background .5s, color .5s, transform .6s cubic-bezier(.34,1.56,.64,1); }
.qs-crencas li.ativo, .qs-crencas li:hover { background: var(--brand-lime); color: var(--brand-ink); transform: translateY(-6px); box-shadow: 0 18px 36px -18px rgba(203,231,0,.55); }
.qs-crencas li.ativo > svg, .qs-crencas li:hover > svg { color: var(--brand-ink); background: rgba(26,18,55,.1); transform: rotate(-8deg) scale(1.08); }

@media (prefers-reduced-motion: no-preference) {
  /* título: cada linha sobe por trás de uma máscara */
  .js-reveal .qs-proposito h2:not(.in) .ln > * { transform: translateY(105%); }
  .js-reveal .qs-proposito h2 .ln > * { transition: transform .9s cubic-bezier(.16,1,.3,1); }
  .js-reveal .qs-proposito h2 .ln + .ln > * { transition-delay: .12s; }
  /* cartões sobem em sequência, como slides */
  .js-reveal .qs-mv:not(.in) .qs-mv-item, .js-reveal .qs-crencas:not(.in) li { opacity: 0; transform: translateY(46px) scale(.94); }
  .js-reveal .qs-mv .qs-mv-item, .js-reveal .qs-crencas li { transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1), background .5s, color .5s, box-shadow .5s; }
  .js-reveal .qs-mv .qs-mv-item + .qs-mv-item { transition-delay: .14s; }
  .js-reveal .qs-crencas li:nth-child(2) { transition-delay: .1s; } .js-reveal .qs-crencas li:nth-child(3) { transition-delay: .2s; } .js-reveal .qs-crencas li:nth-child(4) { transition-delay: .3s; }
  .qs-crencas li.ativo, .qs-crencas li:hover { transition-delay: 0s !important; }
  /* o título do cartão entra grande e assenta, como os números do vídeo */
  .js-reveal .qs-mv.in h3 { animation: qs-assenta .9s cubic-bezier(.16,1,.3,1) .25s backwards; transform-origin: left center; }
  .js-reveal .qs-mv.in .qs-mv-item + .qs-mv-item h3 { animation-delay: .4s; }
  @keyframes qs-assenta { from { transform: scale(1.35); opacity: 0; } }
  /* ícones surgem com um pequeno salto */
  .js-reveal .qs-mv.in .qs-mv-item > svg, .js-reveal .qs-crencas.in li > svg { animation: qs-salto .7s cubic-bezier(.34,1.56,.64,1) backwards; }
  .js-reveal .qs-mv.in .qs-mv-item > svg { animation-delay: .35s; } .js-reveal .qs-mv.in .qs-mv-item + .qs-mv-item > svg { animation-delay: .5s; }
  .js-reveal .qs-crencas.in li:nth-child(1) > svg { animation-delay: .35s; } .js-reveal .qs-crencas.in li:nth-child(2) > svg { animation-delay: .45s; }
  .js-reveal .qs-crencas.in li:nth-child(3) > svg { animation-delay: .55s; } .js-reveal .qs-crencas.in li:nth-child(4) > svg { animation-delay: .65s; }
  @keyframes qs-salto { from { transform: scale(0) rotate(-25deg); opacity: 0; } }
  /* o círculo de luz no canto dos cartões respira devagar */
  .qs-mv-item::after { animation: qs-respira 6s ease-in-out infinite; }
  .qs-mv-item + .qs-mv-item::after { animation-delay: -3s; }
  @keyframes qs-respira { 50% { transform: scale(1.25) translate(-10px, -10px); } }
}
@media (max-width: 899.98px) { .qs-mv-item > svg { width: 52px; height: 52px; } }

/* 20/10: Nossa história com os mesmos tamanhos de texto da abertura */
.qs-historia .qs-historia-texto { container-type: inline-size; }
.qs-historia h2 { font-size: clamp(1.5rem, 7.1cqi, 3.25rem) !important; line-height: 1.1; letter-spacing: -.025em; }
.qs-historia .qs-rotulo { font-size: .875rem; margin-bottom: 16px; }
.qs-historia .qs-texto { font-size: clamp(1rem, .94rem + .25vw, 1.1875rem) !important; line-height: 1.6; max-width: 31rem; margin-top: 20px; }
.qs-historia .qs-texto--curto { margin-top: 12px; }
.qs-historia .qs-destaque { font-size: clamp(1.125rem, 4.4cqi, 1.75rem) !important; margin-top: 28px; }

/* 20/10: a luz chega na foto do Dauro, se divide e contorna a foto para os dois lados até sumir */
.qs-retrato { position: relative; }
.qs-espalha { position: absolute; z-index: 3; overflow: visible; pointer-events: none; }
.qs-espalha path { fill: none; stroke: var(--ui-white); stroke-width: 3.5; stroke-linecap: round; stroke-dasharray: .12 .88; opacity: 0; filter: drop-shadow(0 0 4px rgba(203,231,0,.95)); }
@media (prefers-reduced-motion: no-preference) {
  .qs-espalha.ligado .ida { animation: qs-espalha-ida 5.5s linear 1.4s infinite backwards; }
  .qs-espalha.ligado .volta { animation: qs-espalha-volta 5.5s linear 1.4s infinite backwards; }
  @keyframes qs-espalha-ida   { 0%, 62% { stroke-dashoffset: .12; opacity: 0; } 64% { opacity: 1; } 88% { opacity: .9; } 96%, 100% { stroke-dashoffset: -.38; opacity: 0; } }
  @keyframes qs-espalha-volta { 0%, 62% { stroke-dashoffset: .12; opacity: 0; } 64% { opacity: 1; } 88% { opacity: .9; } 96%, 100% { stroke-dashoffset: .5;  opacity: 0; } }
}
.qs-historia h2 { font-size: var(--qs-titulo, clamp(1.5rem, 7.1cqi, 3.25rem)) !important; }

/* =====================================================================
   20/10: título "O que nos move. O futuro que buscamos." animado (referência: abertura do vídeo enviado)
   palavras surgem do desfoque uma a uma; "move." em verde; "futuro" chega numa pílula de vidro
   que desliza do desfoque, as letras aparecem uma por uma e uma estrelinha cintila ao lado
   ===================================================================== */
.qs-titulo-anim .ln { overflow: visible !important; padding: 0; }
.qs-titulo-anim .qs-pal, .qs-titulo-anim .qs-pilula { display: inline-block; }
.qs-titulo-anim .qs-pal--cor { color: var(--brand-lime); }
.qs-pilula { position: relative; padding: .02em .38em .1em; margin: 0 .04em; border-radius: 999px; color: var(--brand-ink);
  background: linear-gradient(180deg, #E4F55C, var(--brand-lime)); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 10px 30px -10px rgba(203,231,0,.6); }
.qs-pilula-txt { position: relative; z-index: 1; }
.qs-letra { display: inline-block; }
.qs-brilho { position: absolute; z-index: 2; right: -.34em; bottom: -.3em; width: .5em; height: .5em; fill: var(--brand-lime); filter: drop-shadow(0 0 6px rgba(203,231,0,.9)); }
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .qs-titulo-anim:not(.in) .qs-pal { opacity: 0; filter: blur(12px); transform: translateY(.18em); }
  .js-reveal .qs-titulo-anim .qs-pal { transition: opacity .7s cubic-bezier(.16,1,.3,1), filter .7s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); transition-delay: calc(var(--i) * 90ms); }
  /* pílula: chega deslizando da direita, de dentro do desfoque */
  .js-reveal .qs-titulo-anim:not(.in) .qs-pilula { opacity: 0; filter: blur(14px); transform: translateX(1.2em) scaleX(.7); }
  .js-reveal .qs-titulo-anim .qs-pilula { transform-origin: left center; transition: opacity .6s ease, filter .8s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); transition-delay: .5s; }
  /* letras de "futuro", uma por vez */
  .js-reveal .qs-titulo-anim:not(.in) .qs-letra { opacity: 0; filter: blur(6px); }
  .js-reveal .qs-titulo-anim .qs-letra { transition: opacity .35s ease, filter .45s ease; transition-delay: calc(.85s + var(--l) * 75ms); }
  /* estrelinha: aparece girando e fica cintilando */
  .js-reveal .qs-titulo-anim:not(.in) .qs-brilho { opacity: 0; transform: scale(0) rotate(-90deg); }
  .js-reveal .qs-titulo-anim .qs-brilho { transition: opacity .4s ease 1.3s, transform .7s cubic-bezier(.34,1.56,.64,1) 1.3s; }
  .qs-titulo-anim.feito .qs-brilho { animation: qs-cintila 2.6s ease-in-out 1.2s infinite; }
  @keyframes qs-cintila { 0%, 100% { transform: scale(1) rotate(0); opacity: 1; } 45% { transform: scale(.55) rotate(45deg); opacity: .6; } 55% { transform: scale(1.15) rotate(90deg); opacity: 1; } }
  /* um reflexo de luz atravessa a pílula de tempos em tempos */
  .qs-pilula::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.65) 50%, transparent 65%) -150% 0 / 220% 100% no-repeat; }
  .qs-titulo-anim.feito .qs-pilula::after { animation: qs-reflexo 4.5s ease-in-out 1s infinite; }
  @keyframes qs-reflexo { 0%, 60% { background-position: -150% 0; } 85%, 100% { background-position: 150% 0; } }
}

/* 20/10: nas páginas internas (fundo claro) o destaque do menu passa a ser o verde da marca,
   no passar do mouse e na página em que a pessoa está; na home (fundo verde) segue como antes */
@media (min-width: 1180px) {
  .site-header .nav-list > li > a:hover, .site-header .nav-sub-btn:hover, .site-header .nav-sub-btn[aria-expanded="true"],
  .site-header .nav-list > li > a[aria-current="page"] { background-color: rgba(203, 231, 0, .28); color: var(--brand-ink); }   /* verde da marca, suave */
}
@media (max-width: 1179.98px) {
  .site-header .nav-list > li > a[aria-current="page"] { color: var(--brand-ink); box-shadow: inset 4px 0 0 var(--brand-ink); padding-left: 14px; font-weight: 700; }   /* gaveta do celular já é verde: marca em tinta */
  .site-header .nav-list > li > a:hover, .site-header .nav-sub-btn:hover { color: var(--brand-ink); text-decoration-thickness: 2px; }
}

/* 20/10: "Nosso propósito" compacto no computador: do rótulo ao último cartão cabe numa tela só */
@media (min-width: 900px) {
  .qs-proposito { padding-block: clamp(28px, 6svh, 64px) !important; }
  .qs-proposito .qs-rotulo { margin-bottom: clamp(8px, 1.4svh, 14px); }
  .qs-proposito h2 { font-size: clamp(2rem, min(4.2vw, 7.4svh), 3.75rem) !important; line-height: 1.08; }
  .qs-mv { margin-top: clamp(18px, 3.4svh, 36px) !important; }
  .qs-mv-item, .qs-mv-item + .qs-mv-item { padding: clamp(18px, 3svh, 30px) clamp(20px, 2vw, 32px); gap: 16px; align-items: center; }
  .qs-mv-item > svg { width: clamp(44px, 6svh, 56px) !important; height: clamp(44px, 6svh, 56px) !important; padding: 9px; }
  .qs-mv h3 { font-size: clamp(1.125rem, .9rem + .5vw, 1.375rem) !important; margin-bottom: 4px; }
  .qs-mv p { font-size: clamp(.9375rem, .85rem + .3vw, 1.0625rem) !important; line-height: 1.45; }
  .qs-crencas li { padding: clamp(14px, 2.2svh, 20px) clamp(14px, 1.4vw, 20px); font-size: clamp(.9375rem, .85rem + .3vw, 1.0625rem) !important; gap: 12px; }
  .qs-crencas li > svg { width: clamp(38px, 5svh, 46px) !important; height: clamp(38px, 5svh, 46px) !important; padding: 8px; }
  .qs-crencas .ln { display: block; white-space: nowrap; }
}

/* 20/10 (2): o propósito ocupa a tela inteira, com destaque, e tudo cabe dentro dela */
@media (min-width: 900px) {
  .qs-proposito { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding-block: clamp(72px, 10svh, 110px) clamp(40px, 6svh, 72px) !important; }
  .qs-proposito h2 { font-size: clamp(2.4rem, min(5.6vw, 10.5svh), 6rem) !important; line-height: 1.04; }
  .qs-proposito .qs-rotulo { font-size: .9375rem; margin-bottom: clamp(10px, 2svh, 20px); }
  .qs-mv { margin-top: clamp(24px, 5svh, 56px) !important; }
  .qs-mv-item, .qs-mv-item + .qs-mv-item { padding: clamp(22px, 4.4svh, 44px) clamp(24px, 2.4vw, 44px); gap: clamp(16px, 1.6vw, 24px); }
  .qs-mv-item > svg { width: clamp(52px, 8svh, 76px) !important; height: clamp(52px, 8svh, 76px) !important; padding: 11px; }
  .qs-mv h3 { font-size: clamp(1.25rem, min(1.9vw, 3.6svh), 2rem) !important; margin-bottom: 6px; }
  .qs-mv p { font-size: clamp(1rem, min(1.25vw, 2.4svh), 1.375rem) !important; line-height: 1.45; }
  .qs-crencas { margin-top: clamp(14px, 2.4svh, 24px) !important; }
  .qs-crencas li { padding: clamp(16px, 3.2svh, 30px) clamp(16px, 1.6vw, 26px); font-size: clamp(1rem, min(1.25vw, 2.4svh), 1.375rem) !important; gap: clamp(12px, 1.2vw, 18px); }
  .qs-crencas li > svg { width: clamp(42px, 6.6svh, 62px) !important; height: clamp(42px, 6.6svh, 62px) !important; padding: 10px; }
}

/* =====================================================================
   Nossa equipe (20/10/2026): "nosso time" animado na página
   cenas de texto em sequência (saem do desfoque) + órbitas com o time
   ===================================================================== */
@property --gir { syntax: "<angle>"; inherits: true; initial-value: 0deg; }
.qs-time { background: #F4F4FD; overflow: clip; }
.qs-time::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(circle at 72% 50%, rgba(203,231,0,.22), transparent 45%), radial-gradient(rgba(26,18,55,.13) 1.2px, transparent 1.4px) 0 0 / 22px 22px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 45%); mask-image: linear-gradient(90deg, transparent 0, #000 45%); }
.qs-time > .container { position: relative; z-index: 1; }
.qs-time-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
@media (min-width: 900px) { .qs-time { min-height: 100svh; display: flex; align-items: center; } .qs-time > .container { width: 100%; } }

/* cenas */
.qs-cenas { display: grid; min-height: 6.4em; font-size: clamp(2rem, 1.2rem + 2.6vw, 3.75rem); }
.qs-cena { grid-area: 1 / 1; align-self: center; margin: 0; font: 700 1em/1.06 "Sora", var(--font-display); letter-spacing: -.03em; color: var(--brand-ink); }
.qs-cena .ln { display: block; }
.qs-cena-menor { font-size: .62em; font-weight: 600; color: var(--brand-blue); margin-top: .35em; }
.qs-cena-pilula { display: inline-block; padding: .02em .32em .08em; margin-top: .06em; border-radius: .22em; background: var(--brand-lime); text-transform: uppercase; }
.qs-cena--final p { margin: 0; }
.qs-cena-pre { font: 600 .32em/1 "DM Sans", var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--brand-blue); }
.qs-cena-num { font-size: 1.9em; line-height: .95; letter-spacing: -.045em; }
.qs-cena-num [data-time-num] { font-variant-numeric: tabular-nums; }
.qs-cena-un { display: block; font-size: .42em; letter-spacing: -.02em; }
.qs-cena-det { margin-top: .7em !important; font: 400 .3em/1.4 "DM Sans", var(--font-text); letter-spacing: 0; color: #3A3355; }
.qs-cena-det strong { font-weight: 600; color: var(--brand-ink); }
.qs-cena-fecho { margin-top: .7em !important; font-size: .36em; letter-spacing: -.01em; }
.qs-cena-fecho span { display: inline-block; padding: .35em .8em; border-radius: 999px;
  background-image: linear-gradient(var(--brand-lime), var(--brand-lime)); background-repeat: no-repeat; background-size: 100% 100%; }
.qs-time-dica { margin: 28px 0 0; font-size: .9375rem; color: #5A5478; opacity: 0; transition: opacity .6s; }
.qs-time.pronta .qs-time-dica { opacity: 1; }

/* sem JS: só a cena final */
.qs-time:not(.com-js) .qs-cena:not(.qs-cena--final) { display: none; }
.qs-time.com-js .qs-cena { opacity: 0; filter: blur(14px); transform: translateY(.25em); pointer-events: none;
  transition: opacity .7s cubic-bezier(.16,1,.3,1), filter .7s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.qs-time.com-js .qs-cena.saiu { transform: translateY(-.25em); }
.qs-time.com-js .qs-cena.ativa { opacity: 1; filter: none; transform: none; pointer-events: auto; }
.qs-time.com-js .qs-cena .ln { transition: transform .8s cubic-bezier(.16,1,.3,1); }
.qs-time.com-js .qs-cena:not(.ativa) .ln + .ln { transform: translateY(.3em); }
.qs-time.com-js .qs-cena-pilula { transition: transform .7s cubic-bezier(.34,1.56,.64,1) .25s; }
.qs-time.com-js .qs-cena:not(.ativa) .qs-cena-pilula { transform: scale(.6) rotate(-6deg); }
.qs-time.com-js .qs-cena:not(.ativa) .qs-cena-fecho span { background-size: 0% 100%; }
.qs-time.com-js .qs-cena-fecho span { transition: background-size .8s cubic-bezier(.65,0,.35,1) 1.1s; }

/* órbitas */
.qs-orbita { position: relative; container-type: inline-size; width: min(100%, 76svh, 680px); aspect-ratio: 1; justify-self: center; }
.qs-anel { position: absolute; left: 50%; top: 50%; border-radius: 50%; border: 1.5px solid rgba(122,140,0,.45); translate: -50% -50%; }
.qs-anel--1 { width: 62cqi; height: 62cqi; }
.qs-anel--2 { width: 82cqi; height: 82cqi; border-style: dashed; border-color: rgba(122,140,0,.4); }
.qs-anel--3 { width: 99cqi; height: 99cqi; border-color: rgba(22,69,187,.18); }
.qs-orbita-centro { position: absolute; left: 50%; top: 50%; width: 40cqi; height: 40cqi; margin: 0; translate: -50% -50%; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 1.4cqi #fff, 0 0 0 2cqi var(--brand-lime), 0 24px 50px -20px rgba(26,18,55,.45); z-index: 2; }
.qs-orbita-centro img { width: 100%; height: 100%; object-fit: cover; }
.qs-avs { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; z-index: 3; }
.qs-av { --r: 31cqi; --t: 10.5cqi; position: absolute; left: 50%; top: 50%; width: var(--t); height: var(--t); margin: calc(var(--t) / -2) 0 0 calc(var(--t) / -2);
  transform: rotate(calc(var(--ang) + var(--gir))) translateX(var(--r)) rotate(calc(-1 * (var(--ang) + var(--gir)))); outline: none; }
.qs-av--a2 { --r: 41cqi; --t: 9cqi; --gir-dir: -1; }
.qs-av--a3 { --r: 49.5cqi; --t: 7.6cqi; }
.qs-av-giro { position: relative; display: block; width: 100%; height: 100%; border-radius: 50%; transition: transform .6s cubic-bezier(.34,1.56,.64,1), opacity .4s ease; transition-delay: calc(var(--k) * 45ms); }
.qs-av img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 .5cqi #fff, 0 8px 18px -8px rgba(26,18,55,.5); transition: box-shadow .3s; }
.qs-time.com-js .qs-orbita:not(.povoada) .qs-av-giro { opacity: 0; transform: scale(0); }
.qs-av:hover, .qs-av:focus-visible { z-index: 5; }
.qs-av:hover .qs-av-giro, .qs-av:focus-visible .qs-av-giro { transform: scale(1.18); transition-delay: 0s; }
.qs-av:hover img, .qs-av:focus-visible img { box-shadow: 0 0 0 .5cqi var(--brand-lime), 0 10px 22px -8px rgba(26,18,55,.55); }
.qs-av-nome { position: absolute; left: 50%; bottom: calc(100% + 8px); translate: -50% 6px; width: max-content; max-width: 220px; padding: 8px 12px; border-radius: 12px;
  background: var(--brand-ink); color: #fff; font: 400 .8125rem/1.3 "DM Sans", var(--font-text); text-align: center; opacity: 0; pointer-events: none; transition: opacity .25s, translate .25s; }
.qs-av-nome strong { display: block; font: 600 .875rem/1.25 "Sora", var(--font-display); color: var(--brand-lime); }
.qs-av:hover .qs-av-nome, .qs-av:focus-visible .qs-av-nome { opacity: 1; translate: -50% 0; }
@media (prefers-reduced-motion: no-preference) {
  .qs-orbita.girando .qs-av { animation: qs-gira 90s linear infinite; }
  .qs-orbita.girando .qs-av--a2 { animation-duration: 120s; animation-direction: reverse; }
  .qs-orbita.girando .qs-av--a3 { animation-duration: 150s; }
  .qs-orbita:hover .qs-av { animation-play-state: paused; }
  @keyframes qs-gira { to { --gir: 360deg; } }
  .qs-anel--2 { animation: qs-anel 60s linear infinite; }
  @keyframes qs-anel { to { rotate: 360deg; } }
  .qs-orbita-centro::after { content: ""; position: absolute; inset: 0; border-radius: 50%; box-shadow: inset 0 0 0 0 rgba(203,231,0,.0); }
}

@media (max-width: 899.98px) {
  .qs-time-grid { grid-template-columns: 1fr; }
  .qs-cenas { min-height: 5.4em; font-size: clamp(1.9rem, 8vw, 2.6rem); }
  .qs-orbita { width: min(100%, 460px); margin-top: 8px; }
  .qs-av-nome { font-size: .75rem; max-width: 160px; }
}
.qs-dica-toque { display: none; }
@media (hover: none) { .qs-dica-mouse { display: none; } .qs-dica-toque { display: inline; } }
.qs-time-cta { margin-top: 18px; }
.qs-time-cta svg { width: 18px; height: 18px; margin-left: 10px; }
@media (max-width: 599.98px) { .qs-time-cta { width: 100%; justify-content: center; } }

/* =====================================================================
   Sistemas e Aplicativos (21/10/2026)
   ===================================================================== */
.masthead:has(.sa-topo) { background: var(--brand-ink); }
.masthead:has(.sa-topo) .sheen { display: none; }
.pagina:has(.sa-topo) { background: var(--brand-ink); color: var(--ui-white); }
.masthead:has(.sa-topo) .site-header .brand { color: var(--brand-lime); }
.masthead:has(.sa-topo) .menu-toggle { background: var(--brand-lime); color: var(--brand-ink); }
@media (min-width: 1180px) {
  .masthead:has(.sa-topo) .nav-list > li > a, .masthead:has(.sa-topo) .nav-sub-btn { color: rgba(255,255,255,.86); }
  .masthead:has(.sa-topo) .site-header .nav-list > li > a:hover, .masthead:has(.sa-topo) .site-header .nav-sub-btn:hover,
  .masthead:has(.sa-topo) .site-header .nav-sub-btn[aria-expanded="true"] { background-color: rgba(203,231,0,.16); color: var(--brand-lime); }
  .masthead:has(.sa-topo) .nav-actions .btn--light { background: transparent; color: var(--ui-white); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.4); }
  .masthead:has(.sa-topo) .nav-actions .btn--ink { background: var(--brand-lime); color: var(--brand-ink); }
  .pagina:has(.sa-topo) > section > .container, .masthead:has(.sa-topo) .site-footer > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
.sa-rotulo { margin: 0 0 16px; font: 600 .8125rem/1 "DM Sans", var(--font-text); letter-spacing: .28em; text-transform: uppercase; color: rgba(255,255,255,.72); }
.btn--seta svg { width: 18px; height: 18px; margin-left: 10px; transition: transform .3s var(--ease-out); }
.btn--seta:hover svg { transform: translateX(3px); }
.btn--lime { background: var(--brand-lime); color: var(--brand-ink); }
.btn--lime:hover { background: #DDF53A; }

/* 1. abertura */
.sa-topo { background: var(--brand-ink); color: var(--ui-white); overflow: clip; padding-bottom: clamp(56px, 7vw, 110px); }
.sa-topo::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 72% 46%, rgba(22,69,187,.55), transparent 48%), radial-gradient(circle at 85% 80%, rgba(203,231,0,.14), transparent 40%); }
.sa-hero { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 4vw, 64px); align-items: center; min-height: min(68svh, 620px); }
.sa-topo h1 { margin: 0; max-width: none; font: 700 clamp(2.4rem, 1.2rem + 3.6vw, 4.5rem)/1.04 "Sora", var(--font-display); letter-spacing: -.035em; color: var(--ui-white); }
.sa-topo h1 .ln { display: block; }
@media (min-width: 1024px) { .sa-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .sa-topo h1 { font-size: clamp(2.4rem, .6rem + 3.1vw, 4rem); } .sa-topo h1 .ln { white-space: nowrap; } }
.sa-topo h1 .ln + .ln { color: var(--brand-lime); }
.sa-lede { margin: 20px 0 0; max-width: 32rem; font-size: clamp(1rem, .94rem + .3vw, 1.25rem); line-height: 1.55; color: rgba(255,255,255,.8); }
.sa-acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.sa-hero-video { position: relative; margin: 0; aspect-ratio: 16 / 10; border-radius: 28px; overflow: hidden; background: radial-gradient(circle at 50% 50%, rgba(22,69,187,.6), rgba(26,18,55,0) 70%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); display: grid; place-items: center; }
.sa-video-brilho { position: absolute; width: 60%; aspect-ratio: 1; border-radius: 50%; border: 2px solid rgba(203,231,0,.5); box-shadow: 0 0 60px rgba(203,231,0,.25), inset 0 0 60px rgba(22,69,187,.6); }
.sa-video-aviso { position: relative; font: 600 .875rem/1 "DM Sans", var(--font-text); letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.sa-onda { position: absolute; left: 0; right: 0; bottom: 10px; width: 100%; height: 90px; z-index: 0; }
.sa-onda path { fill: none; stroke: var(--brand-lime); stroke-width: 2.5; opacity: .7; filter: drop-shadow(0 0 6px rgba(203,231,0,.7)); }
@media (prefers-reduced-motion: no-preference) {
  .sa-video-brilho { animation: sa-respira 6s ease-in-out infinite; }
  @keyframes sa-respira { 50% { transform: scale(1.08) rotate(20deg); box-shadow: 0 0 90px rgba(203,231,0,.35), inset 0 0 80px rgba(22,69,187,.7); } }
  .js-reveal .masthead:not(.entrou) .sa-onda path { stroke-dasharray: 1; stroke-dashoffset: 1; }
  .entrou .sa-onda path { stroke-dasharray: 1; animation: sa-desenha 2.4s cubic-bezier(.16,1,.3,1) .4s backwards; }
  @keyframes sa-desenha { from { stroke-dashoffset: 1; } }
}

/* produtos */
.sa-produto { overflow: clip; padding-block: clamp(56px, 7vw, 104px); scroll-margin-top: 60px; }
.sa-produto--claro { background: #F4F4FD; color: var(--brand-ink); }
.sa-produto--escuro { background: var(--brand-ink); color: var(--ui-white); }
.sa-produto--escuro::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 80% 50%, rgba(22,69,187,.45), transparent 50%); }
.sa-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(28px, 4vw, 72px); align-items: center; }
.sa-nome { display: flex; align-items: center; gap: 16px; margin: 0; font: 700 clamp(2.25rem, 1.2rem + 3vw, 4rem)/1 "Sora", var(--font-display); letter-spacing: -.035em; }
.sa-nome b { font-weight: 700; color: var(--brand-blue); }
.sa-produto--escuro .sa-nome b { color: var(--brand-lime); }
.sa-icone { flex: none; display: grid; place-items: center; width: 1.25em; height: 1.25em; border-radius: .32em; background: var(--brand-lime); color: var(--brand-ink); }
.sa-icone svg { width: 58%; height: 58%; }
.sa-produto--escuro .sa-icone { background: rgba(203,231,0,.14); color: var(--brand-lime); box-shadow: inset 0 0 0 1.5px rgba(203,231,0,.5); }
.sa-sub { margin: 20px 0 0; max-width: 28ch; font: 600 clamp(1.25rem, 1rem + .9vw, 1.75rem)/1.25 "Sora", var(--font-display); letter-spacing: -.015em; }
.sa-desc { margin: 12px 0 0; max-width: 34rem; font-size: clamp(1rem, .94rem + .25vw, 1.1875rem); line-height: 1.6; color: #3A3355; }
.sa-produto--escuro .sa-desc { color: rgba(255,255,255,.78); }
.sa-cards { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.sa-cards li { display: flex; flex-direction: column; gap: 12px; padding: 16px 14px; border-radius: 16px; background: var(--ui-white); box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 10px 24px -14px rgba(26,18,55,.25); font: 500 .9375rem/1.3 "DM Sans", var(--font-text);
  transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s, background .4s; }
.sa-cards li svg { width: 30px; height: 30px; padding: 5px; border-radius: 8px; background: rgba(22,69,187,.1); color: var(--brand-blue); }
.sa-cards li:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(26,18,55,.06), 0 18px 32px -14px rgba(26,18,55,.35); }
.sa-produto--escuro .sa-cards li { background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); color: var(--ui-white); }
.sa-produto--escuro .sa-cards li svg { background: rgba(203,231,0,.14); color: var(--brand-lime); }
.sa-produto--escuro .sa-cards li:hover { background: rgba(255,255,255,.1); }
.sa-cta { margin-top: 28px; }

/* aparelhos (molduras para os prints) */
.sa-aparelhos { position: relative; margin: 0; min-height: clamp(300px, 34vw, 480px); }
.sa-tela { position: absolute; inset: 0; overflow: hidden; background: #EEF0FA; }
.sa-tela img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.sa-tela-vazia { position: absolute; inset: 0; display: grid; place-items: center; background:
  linear-gradient(90deg, rgba(22,69,187,.08) 0 22%, transparent 22%), repeating-linear-gradient(180deg, transparent 0 34px, rgba(26,18,55,.05) 34px 36px), #F7F8FD; }
.sa-tela-vazia span { padding: 6px 12px; border-radius: 999px; background: rgba(26,18,55,.08); font: 600 .75rem/1 "DM Sans", var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: #5A5478; }
.sa-notebook { position: absolute; left: 0; top: 4%; width: 86%; aspect-ratio: 16 / 10; }
.sa-notebook > .sa-tela { inset: 0 0 6% 0; border-radius: 14px 14px 0 0; border: 10px solid #1C1733; border-bottom-width: 0; }
.sa-notebook-base { position: absolute; left: -6%; right: -6%; bottom: 0; height: 6%; border-radius: 0 0 18px 18px; background: linear-gradient(#C9CBD6, #8E91A1); box-shadow: 0 24px 40px -18px rgba(26,18,55,.5); }
.sa-celular { position: absolute; right: 0; bottom: 0; width: 26%; aspect-ratio: 9 / 19; border-radius: 26px; border: 7px solid #1C1733; background: #1C1733; box-shadow: 0 30px 50px -20px rgba(26,18,55,.55); overflow: hidden; }
.sa-celular > .sa-tela { border-radius: 19px; }
.sa-monitor { position: absolute; inset: 4% 0 6% 0; border-radius: 20px; border: 10px solid #0F0B26; background: #0F0B26; box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 40px 70px -30px rgba(0,0,0,.7); overflow: hidden; }
.sa-monitor > .sa-tela { border-radius: 10px; }
.sa-aparelhos--gamify { display: grid; place-items: center; }
.sa-celular--grande { position: relative; right: auto; bottom: auto; width: min(52%, 280px); }
.sa-balao { position: absolute; display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 18px; background: var(--ui-white); color: var(--brand-ink); box-shadow: 0 20px 40px -18px rgba(26,18,55,.45); font: 400 .875rem/1.3 "DM Sans", var(--font-text); }
.sa-balao strong { display: block; font: 700 1.0625rem/1.2 "Sora", var(--font-display); }
.sa-balao svg { flex: none; width: 34px; height: 34px; }
.sa-balao--xp { left: 0; top: 10%; } .sa-balao--xp svg { color: #F2B705; }
.sa-balao--nivel { right: 0; top: 38%; background: var(--brand-blue); color: #fff; } .sa-balao--nivel svg { color: var(--brand-lime); }
.sa-balao--top { left: 4%; bottom: 10%; } .sa-balao--top svg { color: var(--brand-blue); }
.sa-balao--ia { right: -2%; bottom: 0; background: var(--brand-lime); font: 700 .9375rem/1 "Sora", var(--font-display); } .sa-balao--ia svg { width: 22px; height: 22px; }

/* entradas: aparelho chega de lado, cartões e balões em sequência */
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .sa-aparelhos:not(.in) .sa-notebook, .js-reveal .sa-aparelhos:not(.in) .sa-monitor { opacity: 0; transform: translateX(60px) rotate(1.5deg); }
  .js-reveal .sa-aparelhos:not(.in) .sa-celular { opacity: 0; transform: translateY(60px) rotate(-4deg); }
  .js-reveal .sa-aparelhos .sa-notebook, .js-reveal .sa-aparelhos .sa-monitor, .js-reveal .sa-aparelhos .sa-celular { transition: opacity .8s ease, transform 1.1s cubic-bezier(.16,1,.3,1); }
  .js-reveal .sa-aparelhos--educ .sa-celular { transition-delay: .3s; }
  .js-reveal .sa-aparelhos:not(.in) .sa-balao { opacity: 0; transform: translateY(20px) scale(.85); }
  .js-reveal .sa-aparelhos .sa-balao { transition: opacity .5s ease, transform .7s cubic-bezier(.34,1.56,.64,1); }
  .js-reveal .sa-balao--xp { transition-delay: .5s !important; } .js-reveal .sa-balao--nivel { transition-delay: .8s !important; } .js-reveal .sa-balao--top { transition-delay: 1.1s !important; } .js-reveal .sa-balao--ia { transition-delay: .6s !important; }
  .sa-aparelhos.feito .sa-balao { animation: sa-flutua 6s ease-in-out infinite; }
  .sa-aparelhos.feito .sa-balao--nivel { animation-delay: -2s; } .sa-aparelhos.feito .sa-balao--top { animation-delay: -4s; }
  @keyframes sa-flutua { 50% { translate: 0 -10px; } }
  .js-reveal .sa-cards:not(.in) li { opacity: 0; transform: translateY(24px); }
  .js-reveal .sa-cards li { transition: opacity .6s ease, transform .7s cubic-bezier(.16,1,.3,1), box-shadow .4s, background .4s; }
  .js-reveal .sa-cards li:nth-child(2) { transition-delay: .08s; } .js-reveal .sa-cards li:nth-child(3) { transition-delay: .16s; } .js-reveal .sa-cards li:nth-child(4) { transition-delay: .24s; }
  .sa-cards.feito li { transition-delay: 0s !important; }
}

/* 5. fechamento */
.sa-fecho { background: var(--brand-ink); color: var(--ui-white); overflow-x: clip; overflow-y: visible; padding-block: clamp(56px, 6vw, 96px); }
.sa-fecho-linha { position: absolute; right: -8%; top: -30%; width: 60%; pointer-events: none; opacity: .5; }
.sa-fecho-linha path { fill: none; stroke: var(--brand-blue); stroke-width: 36; stroke-dasharray: 1; }
.js-reveal .sa-fecho:not(:has(.in)) .sa-fecho-linha path { stroke-dashoffset: 1; }
.sa-fecho-linha path { transition: stroke-dashoffset 2.4s cubic-bezier(.16,1,.3,1); }
.sa-fecho-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr); gap: 32px; align-items: center; }
.sa-fecho h2 { margin: 0; font: 700 clamp(1.75rem, 1.1rem + 2vw, 3rem)/1.1 "Sora", var(--font-display); letter-spacing: -.03em; }
.sa-fecho h2 span { color: var(--brand-lime); }
.sa-fecho p { margin: 12px 0 0; font-size: clamp(1rem, .94rem + .25vw, 1.1875rem); color: rgba(255,255,255,.78); }
.sa-btn-borda { background: transparent; color: var(--ui-white); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5); }
.sa-btn-borda:hover { background: rgba(255,255,255,.1); }
.sa-fecho-frase { justify-self: end; margin: 0 !important; transform: rotate(-6deg); font: 600 clamp(1.25rem, 1rem + 1vw, 1.9rem)/1.2 "Sora", var(--font-display) !important; font-style: italic !important; color: var(--ui-white) !important; text-align: right; }
.sa-fecho-frase span { color: var(--brand-lime); background: linear-gradient(var(--brand-lime), var(--brand-lime)) 0 100% / 100% 3px no-repeat; padding-bottom: 2px; }

@media (max-width: 1023.98px) {
  .sa-hero, .sa-grid, .sa-fecho-grid { grid-template-columns: 1fr; }
  .sa-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sa-aparelhos { min-height: 0; aspect-ratio: 4 / 3; }
  .sa-fecho-frase { justify-self: start; text-align: left; }
}
@media (max-width: 599.98px) {
  .sa-balao { padding: 10px 12px; font-size: .75rem; } .sa-balao strong { font-size: .9375rem; } .sa-balao svg { width: 26px; height: 26px; }
  .sa-aparelhos--gamify { aspect-ratio: 1 / 1.1; }
  .sa-acoes .btn { width: 100%; justify-content: center; }
}

/* Gamify + onda de luz (21/10/2026, igual ao mockup): a parte clara termina reta na base do celular,
   o escuro sobe em curva logo à direita dele e um feixe de luz percorre a borda */
.sa-produto--gamify { padding-bottom: 0; overflow-x: clip; overflow-y: visible; }
.sa-produto--gamify + .sa-fecho { padding-top: clamp(28px, 3.5vw, 52px); }
.sa-produto--gamify .sa-aparelhos--gamify { min-height: 0; aspect-ratio: auto; display: flex; align-items: flex-end; }
.sa-gm-fone { position: relative; flex: none; margin-bottom: -6px; }
.sa-gm-fone .sa-celular--grande { position: relative; width: 100%; aspect-ratio: 9 / 17; border-radius: 34px; border-width: 9px; }
.sa-gm-fone .sa-celular--grande > .sa-tela { border-radius: 25px; }
.sa-gm-onda { position: absolute; z-index: -1; left: calc(100% - 60px); bottom: -94px; width: 1400px; height: 260px; overflow: visible; pointer-events: none; }
.sa-gm-fundo { fill: var(--brand-ink); }
.sa-gm-fita, .sa-gm-feixe, .sa-gm-pulso { fill: none; stroke-linecap: round; }
.sa-gm-fita { stroke: #4FB8FF; stroke-width: 2; opacity: .55; filter: url(#sa-gm-b3); }
.sa-gm-fita--larga { stroke: #2F5BFF; stroke-width: 7; opacity: .35; }
.sa-gm-feixe { stroke: url(#sa-gm-g); }
.sa-gm-feixe--halo { stroke-width: 22; opacity: .75; filter: url(#sa-gm-b8); }
.sa-gm-feixe--meio { stroke-width: 7; opacity: .9; filter: url(#sa-gm-b3); }
.sa-gm-feixe--nucleo { stroke-width: 2.2; }
.sa-gm-pulso { stroke: #F4FFD6; stroke-width: 3; stroke-dasharray: .12 .88; stroke-dashoffset: .12; opacity: 0; filter: drop-shadow(0 0 6px #CBE700); }
.sa-gm-baloes { position: relative; display: flex; flex-direction: column; align-items: flex-start; }
.sa-gm-risco, .sa-gm-coroa { position: absolute; fill: none; stroke: #8EE04A; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.sa-gm-coroa { stroke: #B6E86A; stroke-width: 2.4; }
.sa-gm-risco--a { left: -46px; top: 13%; width: 38px; }
.sa-aparelhos--gamify .sa-balao--top svg { color: #3B6BFF; }
.sa-aparelhos--gamify .sa-balao--xp svg { color: #F5B800; }
.sa-aparelhos--gamify .sa-balao--nivel { background: linear-gradient(135deg, #2D33C9, #1B1680); }
.sa-aparelhos--gamify .sa-balao--nivel svg { color: #FFC531; }
@media (min-width: 1024px) {
  .sa-produto--gamify .sa-texto { align-self: center; padding-bottom: clamp(40px, 4vw, 72px); }
  .sa-produto--gamify .sa-aparelhos--gamify { align-self: end; gap: clamp(14px, 1.6vw, 24px); }
  .sa-gm-fone { width: clamp(230px, 20vw, 300px); }
  .sa-gm-baloes { gap: clamp(16px, 1.6vw, 24px); padding-bottom: clamp(130px, 10.5vw, 160px); }
  .sa-gm-baloes .sa-balao { position: relative; inset: auto; padding: clamp(14px, 1.3vw, 20px) clamp(16px, 1.5vw, 24px); border-radius: 20px; gap: 14px; font-size: .9375rem; box-shadow: 0 22px 44px -20px rgba(26,18,55,.4); }
  .sa-gm-baloes .sa-balao strong { font-size: clamp(1.05rem, .8rem + .45vw, 1.3rem); white-space: nowrap; }
  .sa-gm-baloes .sa-balao--top strong { white-space: normal; }
  .sa-gm-baloes .sa-balao { white-space: nowrap; }
  .sa-gm-baloes .sa-balao svg { width: clamp(32px, 3vw, 44px); height: clamp(32px, 3vw, 44px); }
  .sa-gm-baloes .sa-balao--nivel { margin-left: clamp(16px, 2.6vw, 40px); }
  .sa-gm-baloes .sa-balao--top { margin-left: clamp(4px, .8vw, 12px); max-width: 15.5rem; }
  .sa-gm-baloes .sa-balao--top strong { color: #1F2A9E; }
  .sa-gm-coroa { right: -6px; top: -46px; width: 44px; }
  .sa-gm-risco--b { right: -30px; bottom: calc(clamp(130px, 10.5vw, 160px) + 18px); width: 34px; }
}
@media (max-width: 1023.98px) {
  .sa-produto--gamify .sa-aparelhos--gamify { justify-content: center; padding-top: 36px; }
  .sa-gm-fone { width: min(54%, 240px); }
  .sa-gm-baloes { position: static; }
  .sa-gm-baloes .sa-balao--top { bottom: 26%; left: 0; }
  .sa-gm-coroa, .sa-gm-risco--b { display: none; }
  .sa-gm-risco--a { left: -34px; width: 28px; }
}
@media (prefers-reduced-motion: no-preference) {
  .sa-gm-pulso { animation: sa-gm-corre 4.8s cubic-bezier(.45,0,.2,1) 1.2s infinite; }
  @keyframes sa-gm-corre { 0% { stroke-dashoffset: .12; opacity: 0; } 10%, 75% { opacity: 1; } 100% { stroke-dashoffset: -.9; opacity: 0; } }
  .sa-gm-feixe--halo { animation: sa-gm-pulsa 3.6s ease-in-out infinite; }
  @keyframes sa-gm-pulsa { 50% { opacity: .45; } }
  .sa-gm-fita { animation: sa-gm-ondula 7s ease-in-out infinite; }
  .sa-gm-fita--larga { animation-delay: -3.5s; }
  @keyframes sa-gm-ondula { 50% { transform: translate(14px, -6px); opacity: .8; } }
  .js-reveal .sa-aparelhos:not(.in) .sa-gm-risco, .js-reveal .sa-aparelhos:not(.in) .sa-gm-coroa { opacity: 0; transform: scale(.6); }
  .sa-gm-risco, .sa-gm-coroa { transition: opacity .5s ease 1.2s, transform .6s cubic-bezier(.34,1.56,.64,1) 1.2s; }
}

/* Sistemas e Aplicativos: azul Bobby fora da abertura e transições sem corte reto (21/10/2026) */
.pagina:has(.sa-topo) { --sa-azul: #1645BB; --sa-azul-fundo: #0F36A0; background: var(--sa-azul); }
body:has(.sa-topo) .site-footer { background: #1645BB; }
body:has(.sa-topo) .site-footer .footer-grid { border-top: 1px solid rgba(255,255,255,.16); padding-top: 40px; }
/* abertura -> Educ: a parte clara sobe por cima do índigo com cantos arredondados */
.sa-topo { padding-bottom: calc(clamp(56px, 7vw, 110px) + 56px); }
.sa-onda { bottom: 62px; }
.sa-topo + .sa-produto { position: relative; z-index: 2; margin-top: -56px; border-radius: 56px 56px 0 0; box-shadow: 0 -30px 60px -30px rgba(22,69,187,.5); }
/* Analytics: bloco azul que se abre na largura ao rolar; em volta continua o fundo claro */
.sa-produto--escuro { background: #F4F4FD; view-timeline: --sa-an block; }
.sa-produto--escuro::before { inset: 0; z-index: 0; clip-path: inset(0 0 round 72px);
  background: radial-gradient(circle at 22% 50%, rgba(98,140,255,.45), transparent 50%), radial-gradient(circle at 90% 100%, rgba(203,231,0,.12), transparent 40%), linear-gradient(160deg, var(--sa-azul), var(--sa-azul-fundo)); }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .sa-produto--escuro::before { animation: sa-abre linear both; animation-timeline: --sa-an; animation-range: entry 0% cover 40%; }
    @keyframes sa-abre { from { clip-path: inset(0 6% round 40px); } to { clip-path: inset(0 0 round 72px); } }
  }
}
.sa-produto--escuro .sa-desc { color: rgba(255,255,255,.86); }
.sa-produto--escuro .sa-cards li { background: rgba(255,255,255,.1); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.sa-produto--escuro .sa-cards li:hover { background: rgba(255,255,255,.16); }
.sa-produto--escuro .sa-icone { background: rgba(203,231,0,.18); }
.sa-monitor { border-color: #0B2468; background: #0B2468; box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 40px 70px -30px rgba(5,15,60,.7); }
@media (min-width: 1024px) {
  .sa-produto--escuro .sa-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); }
  .sa-produto--escuro .sa-aparelhos { order: -1; }
  .sa-produto--escuro .sa-balao--ia { right: auto; left: -2%; }
}
@media (max-width: 1023.98px) {
  .sa-topo + .sa-produto { border-radius: 32px 32px 0 0; margin-top: -32px; }
  .sa-produto--escuro::before { clip-path: inset(0 0 round 36px); }
  @keyframes sa-abre { from { clip-path: inset(0 4% round 28px); } to { clip-path: inset(0 0 round 36px); } }
}
/* Gamify -> fechamento no azul Bobby */
.sa-gm-fundo { fill: var(--sa-azul); }
.sa-gm-fita { stroke: #9FD8FF; }
.sa-gm-fita--larga { stroke: #6E95FF; opacity: .4; }
.sa-fecho { background: var(--sa-azul); }
.sa-fecho-linha path { stroke: #0C2C86; }
.sa-fecho-linha { opacity: .7; }

/* prints reais (21/10/2026) */
.sa-celular .sa-tela img { object-position: top center; }
.sa-janela { position: absolute; z-index: 2; right: -3%; bottom: -6%; width: 50%; border-radius: 16px; overflow: hidden; border: 6px solid #fff; background: #fff; box-shadow: 0 30px 60px -24px rgba(5,15,60,.65); }
.sa-janela img { display: block; width: 100%; height: auto; }
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .sa-aparelhos:not(.in) .sa-janela { opacity: 0; transform: translateY(40px) rotate(-2deg); }
  .js-reveal .sa-aparelhos .sa-janela { transition: opacity .7s ease .45s, transform 1s cubic-bezier(.16,1,.3,1) .45s; }
  .sa-aparelhos.feito .sa-janela { animation: sa-flutua 7s ease-in-out infinite; }
}
@media (max-width: 599.98px) { .sa-janela { border-width: 4px; border-radius: 10px; right: -2%; } }

/* Abertura animada (21/10/2026): 4 cenas em 3D com os prints reais, no estilo da referência */
.sa-cena { position: relative; margin: 0; aspect-ratio: 16 / 10; container-type: inline-size; border-radius: 28px; overflow: hidden;
  background: radial-gradient(circle at 50% 48%, rgba(22,69,187,.75), rgba(26,18,55,0) 68%), radial-gradient(circle at 80% 90%, rgba(203,231,0,.12), transparent 45%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.sa-palco { position: absolute; inset: 0; perspective: 140cqi; transform-style: preserve-3d; transition: transform 2.4s cubic-bezier(.65,0,.25,1); }
.sa-cena[data-cena="1"] .sa-palco { transform: rotateY(3deg) rotateX(2deg); }
.sa-cena[data-cena="2"] .sa-palco { transform: rotateY(-4deg) rotateX(2deg); }
.sa-cena[data-cena="3"] .sa-palco { transform: rotateX(6deg); }
.sa-j { --x: 50%; --y: 50%; --z: -40cqi; --ry: 0deg; --rx: 0deg; --s: .6; --o: 0; --b: 1.4cqi;
  position: absolute; left: var(--x); top: var(--y); width: 60%; border-radius: 1.6cqi; overflow: hidden; background: #fff;
  opacity: var(--o); filter: blur(var(--b));
  transform: translate(-50%, -50%) translateZ(var(--z)) rotateY(var(--ry)) rotateX(var(--rx)) scale(var(--s));
  box-shadow: 0 3cqi 6cqi -2cqi rgba(5,10,40,.65), 0 0 0 .35cqi rgba(255,255,255,.75);
  transition: left 1.4s cubic-bezier(.65,0,.25,1), top 1.4s cubic-bezier(.65,0,.25,1), transform 1.4s cubic-bezier(.65,0,.25,1), opacity .9s ease, filter .9s ease; }
.sa-j img { display: block; width: 100%; height: auto; }
.sa-j--ranking { width: 36%; }
.sa-j--fone { width: 17%; aspect-ratio: 9 / 17.5; border-radius: 2.6cqi; border: .9cqi solid #0E0A24; background: #0E0A24; box-shadow: 0 3cqi 6cqi -2cqi rgba(5,10,40,.7); }
.sa-j--fone img { height: 100%; object-fit: cover; object-position: top center; border-radius: 1.8cqi; }
/* cena 1: avaliação */
[data-cena="1"] .sa-j--samalg { --x: 46%; --y: 45%; --z: 0cqi; --ry: -16deg; --rx: 5deg; --s: 1; --o: 1; --b: 0cqi; }
[data-cena="1"] .sa-j--ranking { --x: 74%; --y: 74%; --z: 12cqi; --ry: -10deg; --s: 1; --o: 1; --b: 0cqi; transition-delay: .35s; }
[data-cena="1"] .sa-j--educ { --x: 115%; --z: -30cqi; }
/* cena 2: Educ */
[data-cena="2"] .sa-j--samalg { --x: 16%; --y: 40%; --z: -50cqi; --ry: 24deg; --s: .6; --o: .3; --b: .7cqi; }
[data-cena="2"] .sa-j--ranking { --x: 8%; --y: 80%; --z: -40cqi; --s: .6; }
[data-cena="2"] .sa-j--educ { --x: 52%; --y: 46%; --z: 0cqi; --ry: 14deg; --rx: 5deg; --s: 1; --o: 1; --b: 0cqi; }
[data-cena="2"] .sa-j--app { --x: 82%; --y: 60%; --z: 14cqi; --ry: -12deg; --s: 1; --o: 1; --b: 0cqi; transition-delay: .35s; }
/* cena 3: tudo integrado em volta da IA */
[data-cena="3"] .sa-j { --o: 1; --b: 0cqi; --z: 0cqi; }
[data-cena="3"] .sa-j--samalg { --x: 20%; --y: 27%; --ry: 16deg; --s: .5; }
[data-cena="3"] .sa-j--educ { --x: 80%; --y: 27%; --ry: -16deg; --s: .5; transition-delay: .1s; }
[data-cena="3"] .sa-j--ranking { --x: 21%; --y: 77%; --ry: 12deg; --s: .62; transition-delay: .2s; }
[data-cena="3"] .sa-j--app { --x: 64%; --y: 73%; --ry: -10deg; --s: .72; transition-delay: .3s; }
[data-cena="3"] .sa-j--gamify { --x: 84%; --y: 68%; --z: 6cqi; --ry: -16deg; --s: .72; transition-delay: .45s; }
/* esfera da IA */
.sa-esfera { position: absolute; left: 50%; top: 48%; width: 30cqi; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%);
  display: grid; place-items: center; transition: left 1.4s cubic-bezier(.65,0,.25,1), top 1.4s cubic-bezier(.65,0,.25,1), width 1.4s cubic-bezier(.65,0,.25,1);
  background: radial-gradient(circle at 50% 50%, rgba(203,231,0,.95) 0 6%, rgba(203,231,0,.35) 22%, rgba(22,69,187,.35) 48%, transparent 70%);
  box-shadow: 0 0 8cqi rgba(203,231,0,.35); }
.sa-esfera-anel { position: absolute; inset: 8%; border-radius: 50%; border: .3cqi solid rgba(203,231,0,.6); box-shadow: 0 0 3cqi rgba(203,231,0,.4), inset 0 0 3cqi rgba(203,231,0,.25); }
.sa-esfera-nome { position: relative; font: 700 4.4cqi/1 "Sora", var(--font-display); letter-spacing: -.03em; color: #fff; text-shadow: 0 0 2cqi rgba(26,18,55,.8); transition: font-size 1.4s cubic-bezier(.65,0,.25,1), opacity .6s; }
.sa-esfera-nome b { color: var(--brand-lime); }
[data-cena="1"] .sa-esfera, [data-cena="2"] .sa-esfera { left: 10%; top: 14%; width: 11cqi; }
[data-cena="1"] .sa-esfera-nome, [data-cena="2"] .sa-esfera-nome { font-size: 1.8cqi; }
[data-cena="3"] .sa-esfera { width: 17cqi; }
[data-cena="3"] .sa-esfera-nome { font-size: 2.6cqi; }
/* feixes de luz da cena 3 */
.sa-feixes { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; opacity: 0; transform: translateZ(-2cqi); transition: opacity .6s ease; }
[data-cena="3"] .sa-feixes { opacity: 1; transition: opacity .8s ease .9s; }
.sa-feixes path { fill: none; stroke: var(--brand-lime); stroke-width: .32; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: .6; filter: drop-shadow(0 0 4px rgba(203,231,0,.8)); transition: stroke-dashoffset 1.2s cubic-bezier(.65,0,.25,1); }
.sa-feixes path.p { stroke: #fff; stroke-width: .5; stroke-dasharray: .12 .88; opacity: 0; }
[data-cena="3"] .sa-feixes path { stroke-dashoffset: 0; transition-delay: .7s; }
[data-cena="3"] .sa-feixes path.p { opacity: 1; animation: sa-feixe-corre 1.8s linear 1.4s infinite; }
@keyframes sa-feixe-corre { from { stroke-dashoffset: .12; } to { stroke-dashoffset: -.88; } }
/* bolhas dos módulos (cena 2) */
.sa-bolhas { list-style: none; margin: 0; padding: 0; }
.sa-bolhas li { position: absolute; left: var(--x); top: var(--y); display: flex; align-items: center; gap: .9cqi; padding: 1cqi 1.8cqi; border-radius: 99px; background: #fff; color: var(--brand-ink);
  font: 600 1.9cqi/1 "DM Sans", var(--font-text); white-space: nowrap; box-shadow: 0 1.6cqi 3cqi -1cqi rgba(5,10,40,.5);
  opacity: 0; transform: translate(-50%, -50%) translateZ(20cqi) scale(.4); transition: opacity .4s ease, transform .7s cubic-bezier(.34,1.56,.64,1); }
.sa-bolhas li::before { content: ""; width: 1.3cqi; height: 1.3cqi; border-radius: 50%; background: var(--c); }
[data-cena="2"] .sa-bolhas li { opacity: 1; transform: translate(-50%, -50%) translateZ(20cqi) scale(1); transition-delay: calc(.6s + var(--d)); }
/* legendas */
.sa-legendas { list-style: none; margin: 0; padding: 0; position: absolute; left: 4%; right: 4%; bottom: 5%; height: 6.4cqi; }
.sa-legendas li { position: absolute; left: 0; bottom: 0; max-width: 100%; padding: 1.4cqi 2.2cqi; border-radius: 1.4cqi; background: rgba(26,18,55,.72); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  font: 500 2.2cqi/1.25 "DM Sans", var(--font-text); color: #fff; opacity: 0; filter: blur(6px); transform: translateY(1.5cqi); transition: opacity .6s ease, filter .6s ease, transform .6s cubic-bezier(.16,1,.3,1); }
.sa-legendas li b { font-weight: 700; color: var(--brand-lime); }
[data-cena="0"] .sa-legendas li:nth-child(1), [data-cena="1"] .sa-legendas li:nth-child(2), [data-cena="2"] .sa-legendas li:nth-child(3), [data-cena="3"] .sa-legendas li:nth-child(4) { opacity: 1; filter: blur(0); transform: none; transition-delay: .5s; }
@media (prefers-reduced-motion: no-preference) {
  .sa-esfera-anel { animation: sa-respira 5s ease-in-out infinite; }
}
@media (max-width: 599.98px) { .sa-cena { border-radius: 18px; aspect-ratio: 4 / 3.2; } .sa-legendas li { font-size: 3.2cqi; } .sa-legendas { height: 9cqi; } .sa-bolhas li { font-size: 2.6cqi; } }

/* Abertura com a onda da IA em tela cheia (21/10/2026) */
.sa-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.sa-topo--ia { display: grid; min-height: 100svh; padding: 0 0 calc(56px + clamp(36px, 7vh, 90px)); }
.sa-topo--ia::before { display: none; }
.sa-ia-fundo { position: absolute; inset: 0; z-index: 0; overflow: hidden; background: var(--brand-ink); }
.sa-ia-fundo img, .sa-ia-fundo video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 46%; }
.sa-ia-fundo video { opacity: 0; transition: opacity .8s ease; }
.sa-ia-fundo video.toca { opacity: 1; }
.sa-ia-fundo::after { content: ""; position: absolute; inset: auto 0 0 0; height: 40%; background: linear-gradient(transparent, rgba(26,18,55,.85)); }
.sa-ia { position: relative; z-index: 1; align-self: end; display: grid; justify-items: center; text-align: center; }
.sa-ia > p { grid-area: 1 / 1; margin: 0; transition: opacity .7s ease, filter .7s ease, transform .9s cubic-bezier(.16,1,.3,1); }
.sa-ia-nome, .sa-ia-t { font: 700 clamp(2.4rem, 1rem + 4.2vw, 4.75rem)/1.04 "Sora", var(--font-display); letter-spacing: -.035em; color: #fff; text-shadow: 0 4px 30px rgba(26,18,55,.7); }
.sa-ia-nome b { color: var(--brand-lime); }
.sa-ia-t { display: block; }
.sa-ia-s { display: block; margin-top: 14px; font: 500 clamp(1.05rem, .9rem + .7vw, 1.6rem)/1.35 "DM Sans", var(--font-text); letter-spacing: 0; color: rgba(255,255,255,.85); text-shadow: 0 2px 18px rgba(26,18,55,.8); }
.sa-ia[data-fase="aberta"] .sa-ia-nome, .sa-ia[data-fase="fechada"] .sa-ia-frase { opacity: 0; filter: blur(12px); transform: translateY(14px) scale(.98); }
.sa-ia[data-fase="fechada"] .sa-ia-nome { transition-delay: .15s; }
.sa-ia[data-fase="aberta"] .sa-ia-frase .sa-ia-s { transition: opacity .7s ease .25s, filter .7s ease .25s; }
.sa-topo--ia .sa-onda { z-index: 1; }
@media (max-width: 767.98px) {
  .sa-topo--ia { min-height: 88svh; }
  .sa-ia-fundo img, .sa-ia-fundo video { object-position: 50% 42%; }
}

/* onda um pouco acima, deixando o texto livre embaixo */
.sa-ia-fundo { bottom: 14%; -webkit-mask-image: linear-gradient(#000 78%, transparent); mask-image: linear-gradient(#000 78%, transparent); }
.sa-ia-fundo::after { display: none; }
@media (max-width: 767.98px) { .sa-ia-fundo { bottom: 24%; } }

/* Telas do Analytics e do Educ saindo da onda (21/10/2026) */
.sa-ia-fundo video, .sa-ia-fundo img { transition: opacity .8s ease, filter 1.2s ease, transform 1.6s cubic-bezier(.65,0,.25,1); }
.sa-topo--ia[data-ato="analytics"] .sa-ia-fundo video, .sa-topo--ia[data-ato="educ"] .sa-ia-fundo video { filter: blur(6px) brightness(.55); transform: scale(1.12); }
.sa-ia-telas { position: absolute; inset: 0 0 14% 0; z-index: 1; perspective: 1400px; pointer-events: none; }
.sa-ia-tela { position: absolute; left: 50%; top: 52%; width: min(54vw, 760px); aspect-ratio: 16 / 10;
  opacity: 0; filter: blur(16px); transform: translate(-50%, -50%) translateZ(-500px) scale(.25);
  transition: opacity .7s ease, filter .9s ease, transform 1.3s cubic-bezier(.65,0,.25,1); transform-style: preserve-3d; }
.sa-ia-principal { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; border-radius: 18px; background: #fff;
  box-shadow: 0 0 0 4px rgba(255,255,255,.85), 0 0 60px rgba(203,231,0,.35), 0 50px 90px -30px rgba(0,0,0,.75); }
.sa-ia-extra { position: absolute; display: block; height: auto; transform: translateZ(60px); transition: opacity .6s ease .5s, transform 1s cubic-bezier(.16,1,.3,1) .5s; opacity: 0; }
.sa-ia-extra--janela { right: -10%; bottom: -14%; width: 52%; border-radius: 14px; border: 5px solid #fff; box-shadow: 0 30px 60px -20px rgba(0,0,0,.7); }
.sa-ia-extra--fone { right: -8%; bottom: -16%; width: 21%; border-radius: 22px; border: 6px solid #0E0A24; box-shadow: 0 30px 60px -20px rgba(0,0,0,.75); }
.sa-topo--ia[data-ato="analytics"] .sa-ia-tela--an, .sa-topo--ia[data-ato="educ"] .sa-ia-tela--ed { opacity: 1; filter: blur(0); transform: translate(-50%, -50%) rotateY(-14deg) rotateX(6deg); transition-delay: .25s; }
.sa-topo--ia[data-ato="educ"] .sa-ia-tela--ed { transform: translate(-50%, -50%) rotateY(14deg) rotateX(6deg); }
.sa-topo--ia[data-ato="analytics"] .sa-ia-tela--an .sa-ia-extra, .sa-topo--ia[data-ato="educ"] .sa-ia-tela--ed .sa-ia-extra { opacity: 1; transform: translateZ(60px) translateY(-6px); }
.sa-topo--ia[data-ato="educ"] .sa-ia-tela--an { opacity: 0; filter: blur(14px); transform: translate(-50%, -50%) translateX(-40vw) rotateY(30deg) scale(.7); }
/* legendas das telas: mesmo lugar do texto da onda */
.sa-ia-leg { grid-area: 1 / 1; margin: 0; opacity: 0; filter: blur(12px); transform: translateY(14px) scale(.98); transition: opacity .7s ease, filter .7s ease, transform .9s cubic-bezier(.16,1,.3,1); }
.sa-ia-leg .sa-ia-t { font-size: clamp(2rem, 1rem + 3vw, 3.5rem); }
.sa-ia-leg .sa-ia-t b { color: var(--brand-lime); font-weight: 700; }
.sa-ia[data-ato="analytics"] .sa-ia-leg--an, .sa-ia[data-ato="educ"] .sa-ia-leg--ed { opacity: 1; filter: blur(0); transform: none; transition-delay: .5s; }
.sa-ia[data-ato="analytics"] .sa-ia-nome, .sa-ia[data-ato="analytics"] .sa-ia-frase, .sa-ia[data-ato="educ"] .sa-ia-nome, .sa-ia[data-ato="educ"] .sa-ia-frase { opacity: 0; filter: blur(12px); transform: translateY(14px) scale(.98); transition-delay: 0s; }
@media (max-width: 767.98px) {
  .sa-ia-telas { bottom: 26%; }
  .sa-ia-tela { width: 84vw; top: 50%; }
  .sa-ia-principal { border-radius: 10px; box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 30px 50px -20px rgba(0,0,0,.75); }
  .sa-ia-extra--fone { right: -4%; width: 24%; border-width: 4px; border-radius: 14px; }
  .sa-ia-extra--janela { right: -4%; border-width: 3px; border-radius: 8px; }
}
/* telas um pouco menores e mais altas no computador, sem cobrir o texto */
.sa-ia { z-index: 3; }
@media (min-width: 768px) {
  .sa-ia-tela { width: min(44vw, 640px); top: 47%; }
  .sa-ia-extra--janela { bottom: -9%; right: -14%; width: 48%; }
  .sa-ia-extra--fone { bottom: -10%; right: -9%; }
}

/* ===== Abertura v3 (21/10/2026): onda uma vez, telas se montando com luz na borda ===== */
@property --sa-gir { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.sa-ia-fundo video { transition: opacity .9s ease !important; filter: none !important; transform: none !important; }
.sa-topo--ia[data-ato="analytics"] .sa-ia-fundo video, .sa-topo--ia[data-ato="educ"] .sa-ia-fundo video { opacity: 0; }
.sa-topo--ia:not([data-ato="onda"]):not([data-ato="ponte"]) .sa-ia-fundo img { opacity: 0; transition: opacity .9s ease; }
.sa-topo--ia[data-ato] .sa-ia-fundo img { opacity: 0; }
/* textos: um por vez, grandes */
.sa-ia > .sa-ia-txt { grid-area: 1 / 1; margin: 0; opacity: 0; filter: blur(12px); transform: translateY(14px) scale(.98); transition: opacity .8s ease, filter .8s ease, transform 1s cubic-bezier(.16,1,.3,1); }
.sa-ia-txt .sa-ia-t { display: block; font: 700 clamp(2.4rem, 1rem + 4.2vw, 4.75rem)/1.04 "Sora", var(--font-display); letter-spacing: -.035em; color: #fff; text-shadow: 0 4px 30px rgba(26,18,55,.7); }
.sa-ia-txt .sa-ia-t b { color: var(--brand-lime); font-weight: 700; }
.sa-ia-leg--an .sa-ia-t, .sa-ia-leg--ed .sa-ia-t { font-size: clamp(2rem, 1rem + 3vw, 3.5rem); }
.sa-ia[data-ato="onda"][data-fase="nome"] .sa-ia-nome, .sa-ia[data-ato="onda"][data-fase="f1"] .sa-ia-f1, .sa-ia[data-ato="onda"][data-fase="f2"] .sa-ia-f2,
.sa-ia:not([data-ato]) .sa-ia-f1, .sa-ia[data-ato="analytics"] .sa-ia-leg--an, .sa-ia[data-ato="educ"] .sa-ia-leg--ed { opacity: 1; filter: blur(0); transform: none; transition-delay: .25s; }
.sa-ia[data-ato="analytics"] .sa-ia-leg--an, .sa-ia[data-ato="educ"] .sa-ia-leg--ed { transition-delay: .7s; }
/* área das telas: entre o menu e o texto */
.sa-ia-telas { position: absolute; z-index: 1; left: 0; right: 0; top: clamp(104px, 14svh, 140px); bottom: calc(56px + clamp(36px, 7vh, 90px) + 150px); display: grid; place-items: center; perspective: none; pointer-events: none; }
.sa-tv { grid-area: 1 / 1; position: relative; height: min(100%, calc(90vw * 10 / 16)); aspect-ratio: 16 / 10; border-radius: 14px;
  opacity: 0; filter: blur(10px); transform: scale(.94) translateY(18px); transition: opacity .8s ease, filter .8s ease, transform 1s cubic-bezier(.16,1,.3,1); }
.sa-topo--ia[data-ato="analytics"] .sa-tv--an, .sa-topo--ia[data-ato="educ"] .sa-tv--ed { opacity: 1; filter: blur(0); transform: none; }
.sa-tv-vidro { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; background: #F4F6FB; box-shadow: 0 40px 80px -30px rgba(0,0,0,.7); }
.sa-tv-vidro::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; box-shadow: inset 0 0 28px 4px rgba(203,231,0,.4), inset 0 0 0 1.5px rgba(203,231,0,.7); opacity: 0; transition: opacity .6s ease .3s; }
.sa-topo--ia[data-ato="analytics"] .sa-tv--an .sa-tv-vidro::after, .sa-topo--ia[data-ato="educ"] .sa-tv--ed .sa-tv-vidro::after { opacity: 1; animation: sa-tv-pulsa 2.4s ease-in-out infinite; }
@keyframes sa-tv-pulsa { 50% { box-shadow: inset 0 0 44px 8px rgba(203,231,0,.55), inset 0 0 0 2px rgba(203,231,0,.9); } }
/* luz correndo pela borda (a IA assumindo a tela) */
.sa-tv-luz { position: absolute; inset: -4px; border-radius: 18px; padding: 3px; pointer-events: none; z-index: 4;
  background: conic-gradient(from var(--sa-gir), transparent 0 50%, rgba(127,216,255,.9) 66%, #CBE700 80%, #fff 85%, transparent 92%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  filter: drop-shadow(0 0 8px rgba(203,231,0,.8)); animation: sa-tv-gira 2.8s linear infinite; }
.sa-tv::before { content: ""; position: absolute; inset: -18px; border-radius: 30px; z-index: -1; background: radial-gradient(closest-side, rgba(203,231,0,.22), rgba(22,69,187,.18) 60%, transparent); filter: blur(10px); }
@keyframes sa-tv-gira { to { --sa-gir: 360deg; } }
/* página do sistema: layout fixo, só rola para mostrar as funcionalidades */
.sa-tv-pagina { position: absolute; left: 0; top: 0; width: 100%; transform: translateY(0); transition: transform .6s ease; }
.sa-topo--ia[data-ato="analytics"] .sa-tv--an .sa-tv-pagina, .sa-topo--ia[data-ato="educ"] .sa-tv--ed .sa-tv-pagina { transform: translateY(var(--rolar)); transition: transform 3.4s cubic-bezier(.65,0,.35,1) 1.4s; }
.sa-topo--ia[data-ato="educ"] .sa-tv--ed .sa-tv-pagina { transition-delay: 2.2s; }
.sa-tv-topo { position: absolute; left: 0; top: 0; width: 100%; z-index: 2; box-shadow: 0 2px 10px rgba(0,0,0,.12); }
.sa-tv-base { display: block; width: 100%; height: auto; }
/* funcionalidades caindo e encaixando */
.sa-tv-peca { position: absolute; left: var(--l); top: var(--t); width: var(--w); height: auto; border-radius: 6px; opacity: 0; transform: translateY(-40%) scale(1.06); filter: blur(4px);
  transition: opacity .2s ease, transform .2s ease, filter .2s ease; }
.sa-topo--ia[data-ato="analytics"] .sa-tv--an .sa-tv-peca, .sa-topo--ia[data-ato="educ"] .sa-tv--ed .sa-tv-peca {
  opacity: 1; transform: none; filter: blur(0); --atraso: calc(1.1s + var(--i) * .26s);
  transition: opacity .3s ease var(--atraso), transform .6s cubic-bezier(.34,1.56,.64,1) var(--atraso), filter .35s ease var(--atraso);
  animation: sa-tv-encaixe .9s ease-out var(--atraso) backwards; }
.sa-topo--ia[data-ato="educ"] .sa-tv--ed .sa-tv-peca--botao { --atraso: calc(.9s + var(--i) * .13s); }
.sa-topo--ia[data-ato="educ"] .sa-tv--ed .sa-tv-pagina .sa-tv-peca { --atraso: calc(2s + var(--i) * .3s); }
@keyframes sa-tv-encaixe { 0% { box-shadow: 0 0 0 0 rgba(203,231,0,0); } 30% { box-shadow: 0 0 0 3px rgba(203,231,0,.95), 0 0 24px rgba(203,231,0,.6); } 100% { box-shadow: 0 0 0 0 rgba(203,231,0,0); } }
@media (max-width: 767.98px) {
  .sa-ia-telas { top: 84px; bottom: calc(56px + clamp(36px, 7vh, 90px) + 140px); }
  .sa-tv { border-radius: 9px; } .sa-tv-luz { border-radius: 12px; inset: -3px; padding: 2px; }
  .sa-tv-peca { border-radius: 3px; }
}
/* luz da IA na borda: verde e nítida */
.sa-tv-luz { padding: 3px; background: conic-gradient(from var(--sa-gir), rgba(203,231,0,.35) 0 40%, rgba(203,231,0,.6) 60%, #CBE700 76%, #F6FFC2 82%, #CBE700 86%, rgba(203,231,0,.35) 95%);
  filter: drop-shadow(0 0 2px #CBE700) drop-shadow(0 0 10px rgba(203,231,0,.55)); }
.sa-tv::before { background: radial-gradient(closest-side, rgba(203,231,0,.2), transparent); }
.sa-tv-vidro::after { box-shadow: inset 0 0 22px 2px rgba(203,231,0,.35), inset 0 0 0 2px rgba(203,231,0,.85); }
@keyframes sa-tv-pulsa { 50% { box-shadow: inset 0 0 34px 5px rgba(203,231,0,.5), inset 0 0 0 2px #CBE700; } }
@media (max-width: 767.98px) { .sa-tv-luz { padding: 2px; } }
/* telas sempre abaixo do menu (o logo termina em ~164 * --u no computador) */
@media (min-width: 1180px) { .sa-ia-telas { top: calc(196 * var(--u)); } }
@media (min-width: 768px) and (max-width: 1179.98px) { .sa-ia-telas { top: 110px; } }

/* ===== Abertura final (21/10/2026): texto em 5 passos com efeitos de edição de vídeo ===== */
.sa-ia > .sa-ia-txt { grid-area: 1 / 1; margin: 0; opacity: 0; filter: blur(12px); transform: translateY(14px) scale(.98); transition: opacity .8s ease, filter .8s ease, transform 1s cubic-bezier(.16,1,.3,1); }
.sa-ia[data-passo="1"] .sa-ia-p1, .sa-ia[data-passo="2"] .sa-ia-p2, .sa-ia[data-passo="3"] .sa-ia-p3, .sa-ia[data-passo="4"] .sa-ia-p4, .sa-ia[data-passo="5"] .sa-ia-p5 { opacity: 1; filter: blur(0); transform: none; transition-delay: .3s; }
.sa-ia-txt .sa-ia-t { position: relative; display: block; font: 700 clamp(2.4rem, 1rem + 4.2vw, 4.75rem)/1.06 "Sora", var(--font-display); letter-spacing: -.035em; color: #fff; text-shadow: 0 4px 30px rgba(26,18,55,.7); }
.sa-ia-txt .sa-ia-t--longo { font-size: clamp(2rem, .9rem + 3.4vw, 4rem); }
.sa-ia-txt .sa-ia-t b { color: var(--brand-lime); font-weight: 700; }
.sa-ia-txt .sa-ia-s { display: block; margin-top: 14px; font: 500 clamp(1.05rem, .9rem + .7vw, 1.6rem)/1.35 "DM Sans", var(--font-text); color: rgba(255,255,255,.86); text-shadow: 0 2px 18px rgba(26,18,55,.8); }
.sa-ia-p2 .sa-ia-s { letter-spacing: .04em; color: var(--brand-lime); }
.sa-ia-num { display: inline-block; min-width: 1.25em; font-variant-numeric: tabular-nums; }
/* 1: letras surgindo do desfoque */
.sa-letras .pal { display: inline-block; white-space: nowrap; }
.sa-letras .pal > span { display: inline-block; opacity: 0; filter: blur(10px); transform: translateY(.18em); transition: opacity .5s ease, filter .6s ease, transform .7s cubic-bezier(.16,1,.3,1); }
.sa-ia[data-passo="1"] .sa-letras .pal > span { opacity: 1; filter: blur(0); transform: none; transition-delay: calc(.4s + var(--k) * 38ms); }
/* 4: brilho passando pela frase */
.sa-ia-brilho { background: linear-gradient(100deg, #fff 0 40%, var(--brand-lime) 48%, #F6FFC2 50%, var(--brand-lime) 52%, #fff 60% 100%) 120% 0 / 250% 100% no-repeat; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.sa-ia[data-passo="4"] .sa-ia-brilho { animation: sa-ia-varre 2.2s cubic-bezier(.65,0,.35,1) 1s both; }
@keyframes sa-ia-varre { from { background-position: 120% 0; } to { background-position: -20% 0; } }
/* 5: linha da marca se desenhando sob "Bobby IA" */
.sa-ia-traco { position: absolute; left: 50%; bottom: -.2em; width: 4.6em; height: .32em; transform: translateX(-50%); overflow: visible; }
.sa-ia-traco path { fill: none; stroke: var(--brand-lime); stroke-width: 4; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 6px rgba(203,231,0,.7)); transition: stroke-dashoffset .3s ease; }
.sa-ia[data-passo="5"] .sa-ia-traco path { stroke-dashoffset: 0; transition: stroke-dashoffset 1.4s cubic-bezier(.65,0,.35,1) .9s; }
.sa-ia-p5 .sa-ia-s { transition: opacity .8s ease; }
.sa-ia:not([data-passo="5"]) .sa-ia-p5 .sa-ia-s { opacity: 0; }
.sa-ia[data-passo="5"] .sa-ia-p5 .sa-ia-s { transition-delay: 1.6s; }
/* 2: três pontos ligados, puxados para o centro, viram a bola da IA */
.sa-ia-centro { position: absolute; inset: 0 0 14% 0; z-index: 1; pointer-events: none; --r: min(17vw, 230px); }
.sa-ia-centro > * { position: absolute; left: 50%; top: 50%; }
.sa-ia-ligas { width: calc(var(--r) * 2 * 1.282); height: calc(var(--r) * 2 * 1.282); transform: translate(-50%, -50%); overflow: visible; opacity: 0; transition: opacity .5s ease; }
.sa-ia-ligas path { fill: none; stroke: var(--brand-lime); stroke-width: 1.2; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 4px rgba(203,231,0,.8)); }
.sa-ia-ponto { width: 0; height: 0; transform: rotate(var(--a)) translateX(var(--r)) rotate(calc(var(--a) * -1)); opacity: 0; transition: opacity .5s ease, transform 1.1s cubic-bezier(.65,0,.35,1); }
.sa-ia-ponto i { position: absolute; left: -9px; top: -9px; width: 18px; height: 18px; border-radius: 50%; background: #F6FFC2; box-shadow: 0 0 0 4px rgba(203,231,0,.35), 0 0 22px 6px rgba(203,231,0,.75); }
.sa-ia-ponto em { position: absolute; left: 0; top: 18px; transform: translateX(-50%); font: 600 clamp(.95rem, .8rem + .5vw, 1.3rem)/1 "DM Sans", var(--font-text); font-style: normal; color: #fff; white-space: nowrap; text-shadow: 0 2px 12px rgba(26,18,55,.9); transition: opacity .4s ease; }
.sa-topo--ia[data-passo="2"] .sa-ia-ponto { opacity: 1; animation: sa-ia-puxa 4.8s cubic-bezier(.65,0,.35,1) both; }
.sa-topo--ia[data-passo="2"] .sa-ia-ponto:nth-of-type(2) { animation-delay: .25s; } .sa-topo--ia[data-passo="2"] .sa-ia-ponto:nth-of-type(3) { animation-delay: .5s; }
@keyframes sa-ia-puxa {
  0% { opacity: 0; transform: rotate(var(--a)) translateX(calc(var(--r) * 1.3)) rotate(calc(var(--a) * -1)) scale(.4); }
  14%, 58% { opacity: 1; transform: rotate(var(--a)) translateX(var(--r)) rotate(calc(var(--a) * -1)); }
  80% { opacity: 1; transform: rotate(calc(var(--a) + 120deg)) translateX(0) rotate(calc(var(--a) * -1 - 120deg)) scale(.5); }
  100% { opacity: 0; transform: rotate(calc(var(--a) + 120deg)) translateX(0) scale(.2); } }
.sa-topo--ia[data-passo="2"] .sa-ia-ponto em { animation: sa-ia-some-rotulo 4.8s ease both; }
@keyframes sa-ia-some-rotulo { 0%, 55% { opacity: 1; } 68%, 100% { opacity: 0; } }
.sa-topo--ia[data-passo="2"] .sa-ia-ligas { opacity: 1; animation: sa-ia-ligas-some 4.8s ease both; }
.sa-topo--ia[data-passo="2"] .sa-ia-ligas path { animation: sa-ia-liga 4.8s cubic-bezier(.65,0,.35,1) both; }
@keyframes sa-ia-liga { 0%, 18% { stroke-dashoffset: 1; } 45% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 0; } }
@keyframes sa-ia-ligas-some { 0%, 58% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); } 80%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.1) rotate(120deg); } }
/* a bola da IA girando, pulsando como se estivesse falando */
.sa-ia-bola { width: calc(var(--r) * .9); aspect-ratio: 1; transform: translate(-50%, -50%) scale(.3); opacity: 0; transition: opacity .6s ease, transform .9s cubic-bezier(.34,1.56,.64,1); transform-style: preserve-3d; }
.sa-ia-bola > span { position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(203,231,0,.85); box-shadow: 0 0 14px rgba(203,231,0,.6), inset 0 0 14px rgba(203,231,0,.35); }
.sa-ia-bola > span:nth-child(1) { animation: sa-ia-anel1 3.2s linear infinite; }
.sa-ia-bola > span:nth-child(2) { animation: sa-ia-anel2 4.4s linear infinite; border-color: rgba(246,255,194,.7); }
.sa-ia-bola > span:nth-child(3) { inset: 22%; border: 0; background: radial-gradient(circle, #F6FFC2 0 12%, rgba(203,231,0,.75) 30%, rgba(203,231,0,0) 70%); box-shadow: none; animation: sa-ia-fala .9s ease-in-out infinite; }
@keyframes sa-ia-anel1 { from { transform: rotateX(70deg) rotateZ(0); } to { transform: rotateX(70deg) rotateZ(360deg); } }
@keyframes sa-ia-anel2 { from { transform: rotateY(68deg) rotateZ(0); } to { transform: rotateY(68deg) rotateZ(-360deg); } }
@keyframes sa-ia-fala { 0%, 100% { transform: scale(.85); } 25% { transform: scale(1.12); } 45% { transform: scale(.95); } 70% { transform: scale(1.2); } }
.sa-topo--ia[data-passo="2"] .sa-ia-bola { animation: sa-ia-bola-entra 4.8s ease both; }
@keyframes sa-ia-bola-entra { 0%, 74% { opacity: 0; transform: translate(-50%, -50%) scale(.3); } 86%, 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
/* onda escurece um pouco enquanto os pontos aparecem, para eles ganharem destaque */
.sa-ia-fundo video { transition: opacity .9s ease, filter 1.2s ease !important; }
.sa-topo--ia[data-passo="2"] .sa-ia-fundo video { filter: brightness(.55) !important; }
/* sobras da versão com telas */
.sa-ia-telas, .sa-ia-leg--an, .sa-ia-leg--ed { display: none !important; }
@media (max-width: 767.98px) {
  .sa-ia-centro { inset: 0 0 24% 0; --r: 30vw; }
  .sa-ia-ponto i { width: 14px; height: 14px; left: -7px; top: -7px; }
}
@media (prefers-reduced-motion: reduce) {
  .sa-ia-traco path { stroke-dashoffset: 0; }
}
/* brilho sem cortar o texto: o fundo cobre a frase inteira o tempo todo */
.sa-ia-brilho { background: linear-gradient(100deg, #fff 0 42%, var(--brand-lime) 47%, #F6FFC2 50%, var(--brand-lime) 53%, #fff 58% 100%) 100% 0 / 300% 100% no-repeat; }
@keyframes sa-ia-varre { from { background-position: 100% 0; } to { background-position: 0% 0; } }
.sa-ia-brilho { -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* versão mais rápida (21/10/2026): pontos soltos no meio, sem triângulo; ciclo termina na onda fechando */
.sa-ia[data-passo="1"] .sa-letras .pal > span { transition-delay: calc(.25s + var(--k) * 22ms); }
.sa-ia > .sa-ia-txt { transition: opacity .55s ease, filter .55s ease, transform .7s cubic-bezier(.16,1,.3,1); }
.sa-ia[data-passo="1"] .sa-ia-p1, .sa-ia[data-passo="2"] .sa-ia-p2, .sa-ia[data-passo="3"] .sa-ia-p3, .sa-ia[data-passo="4"] .sa-ia-p4 { transition-delay: .15s; }
.sa-ia:not([data-passo]) .sa-ia-p1, .sa-ia[data-passo="4"] .sa-ia-p4 { opacity: 1; filter: blur(0); transform: none; }
.sa-ia[data-passo="4"] .sa-ia-brilho { animation-duration: 1.6s; animation-delay: .5s; }
.sa-ia-ponto { transform: translate(calc(var(--x) * var(--r)), calc(var(--y) * var(--r))); }
.sa-topo--ia[data-passo="2"] .sa-ia-ponto { animation: sa-ia-junta 3.3s cubic-bezier(.65,0,.35,1) var(--d) both; }
@keyframes sa-ia-junta {
  0% { opacity: 0; transform: translate(calc(var(--x) * var(--r) * 1.25), calc(var(--y) * var(--r) * 1.25)) scale(.4); }
  14% { opacity: 1; transform: translate(calc(var(--x) * var(--r)), calc(var(--y) * var(--r))) scale(1); }
  52% { opacity: 1; transform: translate(calc(var(--x) * var(--r) * .9 + 8px), calc(var(--y) * var(--r) * .9 - 6px)) scale(1); }
  78% { opacity: 1; transform: translate(0, 0) scale(.5); }
  100% { opacity: 0; transform: translate(0, 0) scale(.2); } }
.sa-topo--ia[data-passo="2"] .sa-ia-ponto em { animation: sa-ia-some-rotulo 3.3s ease var(--d) both; }
@keyframes sa-ia-some-rotulo { 0%, 50% { opacity: 1; } 64%, 100% { opacity: 0; } }
.sa-topo--ia[data-passo="2"] .sa-ia-bola { animation: sa-ia-bola-entra 3.3s ease both; }
@keyframes sa-ia-bola-entra { 0%, 72% { opacity: 0; transform: translate(-50%, -50%) scale(.3); } 86%, 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
/* texto no centro, luz bem fraca atrás, bola "falando" (21/10/2026) */
.sa-topo--ia { padding-bottom: 56px; }
.sa-ia { align-self: center; padding-top: clamp(60px, 9vh, 110px); }
.sa-ia-fundo { bottom: 56px; -webkit-mask-image: none; mask-image: none; }
.sa-ia-fundo video.toca { opacity: .3; }
.sa-topo--ia[data-passo="2"] .sa-ia-fundo video { filter: none !important; opacity: .18; }
.sa-ia-fundo img { opacity: .3; }
.sa-ia-centro { inset: clamp(60px, 9vh, 110px) 0 56px 0; --r: min(34vw, 470px); }
.sa-ia-bola { width: min(46vw, 560px); opacity: .32; transform: translate(-50%, -50%) scale(1); }
.sa-ia-bola > span { border-width: 1.5px; border-color: rgba(203,231,0,.5); box-shadow: 0 0 30px rgba(203,231,0,.35), inset 0 0 30px rgba(203,231,0,.2); }
.sa-ia-bola > span:nth-child(3) { inset: 18%; background: radial-gradient(circle, rgba(246,255,194,.7) 0 8%, rgba(203,231,0,.4) 30%, rgba(203,231,0,0) 70%); animation-duration: 1.1s; }
@keyframes sa-ia-bola-entra { 0%, 70% { opacity: .32; transform: translate(-50%, -50%) scale(1); } 82% { opacity: .75; transform: translate(-50%, -50%) scale(1.08); } 100% { opacity: .32; transform: translate(-50%, -50%) scale(1); } }
.sa-ia-ponto em { font-size: clamp(1rem, .85rem + .6vw, 1.4rem); }
@media (max-width: 767.98px) {
  .sa-ia-fundo { bottom: 56px; }
  .sa-ia-centro { inset: 70px 0 56px 0; --r: 40vw; }
  .sa-ia-bola { width: 80vw; }
}
@media (prefers-reduced-motion: reduce) { .sa-ia-bola > span { animation: none !important; } }
.sa-ia-txt .sa-ia-t { text-wrap: balance; max-width: 18ch; margin-inline: auto; }
.sa-ia-txt .sa-ia-t--longo { max-width: 22ch; }

/* ===== Abertura só texto (21/10/2026): frases no centro, bola de luz fraca atrás ===== */
.sa-topo--texto { display: grid; min-height: 100svh; padding: 0 0 56px; }
.sa-topo--texto .sa-ia { align-self: center; padding-top: clamp(60px, 9vh, 110px); }
.sa-topo--texto .sa-ia > .sa-ia-txt { opacity: 0; filter: blur(12px); transform: translateY(12px) scale(.98); transition: opacity .4s ease, filter .45s ease, transform .55s cubic-bezier(.16,1,.3,1); transition-delay: 0s; }
.sa-topo--texto .sa-ia > .sa-ia-txt.ativo { opacity: 1; filter: blur(0); transform: none; transition-delay: .12s; }
.sa-topo--texto .sa-ia-pal .sa-ia-t { color: var(--brand-lime); }
.sa-topo--texto .sa-ia-pal { transition-duration: .25s, .3s, .4s !important; }
.sa-topo--texto .sa-ia-pal.ativo { transition-delay: .05s !important; }
.sa-topo--texto .sa-letras .pal > span { opacity: 0; filter: blur(10px); transform: translateY(.18em); transition: opacity .4s ease, filter .5s ease, transform .6s cubic-bezier(.16,1,.3,1); transition-delay: 0s; }
.sa-topo--texto .sa-ia-p1.ativo .sa-letras .pal > span { opacity: 1; filter: blur(0); transform: none; transition-delay: calc(.2s + var(--k) * 20ms); }
.sa-topo--texto .sa-ia-p4 .sa-ia-brilho { animation: none; }
.sa-topo--texto .sa-ia-p4.ativo .sa-ia-brilho { animation: sa-ia-varre 1.5s cubic-bezier(.65,0,.35,1) .45s both; }
.sa-topo--texto .sa-ia-centro { position: absolute; inset: clamp(60px, 9vh, 110px) 0 56px 0; z-index: 0; pointer-events: none; }
.sa-topo--texto .sa-ia-bola { position: absolute; left: 50%; top: 50%; width: min(44vw, 540px); opacity: .3; transform: translate(-50%, -50%); animation: none; transition: opacity .3s ease, transform .4s cubic-bezier(.34,1.56,.64,1); }
.sa-topo--texto.sa-fala-forte .sa-ia-bola { opacity: .5; transform: translate(-50%, -50%) scale(1.05); }
.sa-topo--texto .sa-ia-bola > span:nth-child(3) { animation-duration: .9s; }
@media (max-width: 767.98px) { .sa-topo--texto .sa-ia-centro { inset: 70px 0 56px 0; } .sa-topo--texto .sa-ia-bola { width: 82vw; } }
@media (prefers-reduced-motion: reduce) { .sa-topo--texto .sa-letras .pal > span { opacity: 1; filter: none; transform: none; } }
/* sem os anéis: só a luz redonda pulsando */
.sa-topo--texto .sa-ia-bola > span:nth-child(1), .sa-topo--texto .sa-ia-bola > span:nth-child(2) { display: none; }
.sa-topo--texto .sa-ia-bola > span:nth-child(3) { inset: 0; background: radial-gradient(circle, rgba(246,255,194,.55) 0 6%, rgba(203,231,0,.3) 24%, rgba(22,69,187,.18) 46%, rgba(26,18,55,0) 68%); }

/* onda + luz redonda se alternando (21/10/2026) */
.sa-topo--texto .sa-ia-fundo { position: absolute; inset: clamp(60px, 9vh, 110px) 0 56px 0; z-index: 0; overflow: hidden; background: transparent; -webkit-mask-image: none; mask-image: none; }
.sa-topo--texto .sa-ia-fundo img { opacity: 0; }
.sa-topo--texto .sa-ia-fundo video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; opacity: 0; filter: none !important; transform: none !important; transition: opacity .7s ease !important; }
.sa-topo--texto.sa-onda-on .sa-ia-fundo video.toca { opacity: .55; }
.sa-topo--texto .sa-ia-bola { transition: opacity .6s ease, transform .4s cubic-bezier(.34,1.56,.64,1); }
.sa-topo--texto.sa-onda-on .sa-ia-bola { opacity: 0; }
@media (max-width: 767.98px) { .sa-topo--texto .sa-ia-fundo { inset: 70px 0 56px 0; } }
@media (prefers-reduced-motion: reduce) { .sa-topo--texto .sa-ia-fundo img { opacity: .5; } }
/* esfera azul com a luz branca circulando dentro (21/10/2026, referência enviada pelo Dauro) */
.sa-topo--texto .sa-ia-bola { width: min(22vw, 290px); opacity: .92; }
.sa-topo--texto.sa-fala-forte .sa-ia-bola { opacity: 1; transform: translate(-50%, -50%) scale(1.06); }
.sa-topo--texto .sa-ia-bola > span:nth-child(3) { inset: 0; overflow: hidden; border-radius: 50%; isolation: isolate;
  background: radial-gradient(circle at 42% 36%, #7A97F2 0%, #4E70E0 45%, #3456CF 78%, #2B49BE 100%);
  box-shadow: 0 0 50px rgba(78,112,224,.45), 0 0 120px rgba(78,112,224,.25), inset 0 -10px 30px rgba(255,255,255,.12);
  animation: sa-orbe-fala 2.8s ease-in-out infinite; }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::before, .sa-topo--texto .sa-ia-bola > span:nth-child(3)::after { content: ""; position: absolute; border-radius: 50%; }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::before { inset: -18%;
  background: radial-gradient(closest-side at 28% 74%, rgba(255,255,255,.95), rgba(255,255,255,0) 62%), radial-gradient(closest-side at 70% 86%, rgba(255,255,255,.85), rgba(255,255,255,0) 58%), radial-gradient(closest-side at 90% 52%, rgba(255,255,255,.55), rgba(255,255,255,0) 46%);
  filter: blur(9px); animation: sa-orbe-gira 10s linear infinite; }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::after { inset: -8%;
  background: radial-gradient(closest-side at 62% 22%, rgba(255,255,255,.45), rgba(255,255,255,0) 52%), radial-gradient(closest-side at 18% 38%, rgba(255,255,255,.35), rgba(255,255,255,0) 46%);
  filter: blur(12px); animation: sa-orbe-gira 15s linear infinite reverse; }
@keyframes sa-orbe-gira { to { transform: rotate(360deg); } }
@keyframes sa-orbe-fala { 0%, 100% { transform: scale(1); } 18% { transform: scale(1.035); } 34% { transform: scale(.985); } 52% { transform: scale(1.05); } 70% { transform: scale(1); } 84% { transform: scale(1.025); } }
@media (max-width: 767.98px) { .sa-topo--texto .sa-ia-bola { width: 46vw; } }
@media (prefers-reduced-motion: reduce) { .sa-topo--texto .sa-ia-bola > span:nth-child(3), .sa-topo--texto .sa-ia-bola > span:nth-child(3)::before, .sa-topo--texto .sa-ia-bola > span:nth-child(3)::after { animation: none; } }
/* nuvens de luz mais fortes, como na referência */
.sa-topo--texto .sa-ia-bola > span:nth-child(3) { background: radial-gradient(circle at 45% 35%, #6F8EF2 0%, #5677E6 50%, #4566DA 100%); }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::before { inset: -10%;
  background: radial-gradient(closest-side at 26% 82%, #fff, rgba(255,255,255,.85) 30%, rgba(255,255,255,0) 72%), radial-gradient(closest-side at 66% 96%, #fff, rgba(255,255,255,.7) 30%, rgba(255,255,255,0) 64%), radial-gradient(closest-side at 94% 60%, rgba(255,255,255,.9), rgba(255,255,255,0) 52%);
  filter: blur(7px); }
/* fluidez (21/10/2026): sem desfoque animado (pesa no navegador); só opacidade e movimento, que vão direto para a placa de vídeo */
.sa-topo--texto .sa-ia > .sa-ia-txt, .sa-topo--texto .sa-ia > .sa-ia-txt.ativo { filter: none !important; will-change: opacity, transform; }
.sa-topo--texto .sa-ia > .sa-ia-txt { transition: opacity .45s ease, transform .55s cubic-bezier(.16,1,.3,1) !important; }
.sa-topo--texto .sa-ia > .sa-ia-txt.ativo { transition-delay: .1s !important; }
.sa-topo--texto .sa-ia-pal, .sa-topo--texto .sa-ia-pal.ativo { transition: opacity .25s ease, transform .35s cubic-bezier(.16,1,.3,1) !important; }
.sa-topo--texto .sa-letras .pal > span, .sa-topo--texto .sa-ia-p1.ativo .sa-letras .pal > span { filter: none !important; }
.sa-topo--texto .sa-letras .pal > span { transition: opacity .35s ease, transform .5s cubic-bezier(.16,1,.3,1); }
.sa-topo--texto .sa-ia-bola { will-change: transform, opacity; }
.sa-topo--texto .sa-ia-bola > span:nth-child(3) { will-change: transform; box-shadow: 0 0 60px rgba(78,112,224,.4); }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::before, .sa-topo--texto .sa-ia-bola > span:nth-child(3)::after { filter: none !important; will-change: transform; }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::before { background: radial-gradient(closest-side at 26% 82%, rgba(255,255,255,.95), rgba(255,255,255,.6) 35%, rgba(255,255,255,.15) 62%, rgba(255,255,255,0) 80%), radial-gradient(closest-side at 66% 96%, rgba(255,255,255,.9), rgba(255,255,255,.5) 35%, rgba(255,255,255,0) 72%), radial-gradient(closest-side at 94% 60%, rgba(255,255,255,.75), rgba(255,255,255,0) 62%); }
.sa-topo--texto .sa-ia-bola > span:nth-child(3)::after { background: radial-gradient(closest-side at 62% 22%, rgba(255,255,255,.4), rgba(255,255,255,0) 65%), radial-gradient(closest-side at 18% 38%, rgba(255,255,255,.3), rgba(255,255,255,0) 60%); }
.sa-topo--texto .sa-ia-fundo video { will-change: opacity; }

/* ===== Abertura estilo assistente de voz (21/10/2026): luz nas bordas + onda de voz ===== */
.sa-topo--voz { background: #120C2A; }
.sa-topo--voz .sa-ia-centro { display: none; }
.sa-voz-fundo { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.sa-voz-fundo::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 62% 58% at 50% 48%, #120C2A 35%, rgba(18,12,42,.55) 70%, rgba(18,12,42,0) 100%); }
.sa-voz-luz { position: absolute; border-radius: 50%; will-change: transform; }
.sa-voz-luz--a { width: 70vw; height: 70vw; right: -28vw; top: -34vw; background: radial-gradient(closest-side, rgba(22,69,187,.9), rgba(22,69,187,0)); animation: sa-voz-deriva 14s ease-in-out infinite; }
.sa-voz-luz--b { width: 62vw; height: 62vw; left: -26vw; bottom: -30vw; background: radial-gradient(closest-side, rgba(79,123,255,.75), rgba(79,123,255,0)); animation: sa-voz-deriva 17s ease-in-out -6s infinite reverse; }
.sa-voz-luz--c { width: 40vw; height: 40vw; right: -12vw; bottom: -18vw; background: radial-gradient(closest-side, rgba(203,231,0,.32), rgba(203,231,0,0)); animation: sa-voz-deriva 12s ease-in-out -3s infinite; }
@keyframes sa-voz-deriva { 50% { transform: translate(-4vw, 3vw) scale(1.08); } }
.sa-voz-onda { position: absolute; z-index: 1; left: 0; width: 100%; bottom: calc(56px + 6vh); height: clamp(90px, 16vh, 170px); pointer-events: none; }
.sa-topo--voz .sa-ia { z-index: 2; padding-top: clamp(40px, 6vh, 80px); }
.sa-topo--voz .sa-ia-txt .sa-ia-t { text-shadow: 0 0 18px rgba(79,123,255,.55), 0 0 2px rgba(255,255,255,.4); }
.sa-topo--voz .sa-ia-pal .sa-ia-t { color: var(--brand-lime); text-shadow: 0 0 20px rgba(203,231,0,.45); }
@media (max-width: 767.98px) {
  .sa-voz-luz--a { width: 120vw; height: 120vw; right: -60vw; top: -50vw; }
  .sa-voz-luz--b { width: 110vw; height: 110vw; left: -55vw; bottom: -40vw; }
  .sa-voz-luz--c { width: 80vw; height: 80vw; right: -40vw; bottom: -30vw; }
  .sa-voz-onda { height: 110px; bottom: calc(56px + 4vh); }
}
@media (prefers-reduced-motion: reduce) { .sa-voz-luz { animation: none; } }
.sa-voz-onda { height: clamp(150px, 26vh, 250px); bottom: calc(56px + 2vh); }
@media (max-width: 767.98px) { .sa-voz-onda { height: 150px; bottom: calc(56px + 2vh); } }
/* luzes das bordas mais lentas */
.sa-voz-luz--a { animation-duration: 26s; } .sa-voz-luz--b { animation-duration: 32s; } .sa-voz-luz--c { animation-duration: 22s; }

/* escrita ao vivo + selo "Bobby IA" (21/10/2026) */
.sa-topo--voz .sa-ia > .sa-ia-txt { grid-area: 2 / 1; }
.sa-voz-selo { grid-area: 1 / 1; justify-self: center; display: inline-flex; align-items: center; gap: 10px; margin: 0 0 clamp(18px, 3vh, 30px); padding: 8px 16px 8px 12px; border-radius: 999px;
  background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); font: 600 .875rem/1 "DM Sans", var(--font-text); letter-spacing: .06em; color: rgba(255,255,255,.85); }
.sa-voz-ponto { width: 9px; height: 9px; border-radius: 50%; background: var(--brand-lime); box-shadow: 0 0 10px rgba(203,231,0,.8); animation: sa-voz-ponto 2.4s ease-in-out infinite; }
.sa-topo--voz.sa-falando .sa-voz-ponto { animation-duration: .7s; }
@keyframes sa-voz-ponto { 50% { transform: scale(.6); opacity: .55; } }
/* palavras surgindo uma a uma; as letras não animam mais sozinhas */
.sa-topo--voz .sa-letras .pal > span, .sa-topo--voz .sa-ia-p1.ativo .sa-letras .pal > span { opacity: 1 !important; transform: none !important; transition: none !important; }
.sa-topo--voz .w { display: inline-block; opacity: 0; transform: translateY(.12em); transition: opacity .25s ease, transform .35s cubic-bezier(.16,1,.3,1); }
.sa-topo--voz .w.on { opacity: 1; transform: none; }
.sa-voz-cursor { display: inline-block; width: .09em; height: .9em; margin-left: .08em; vertical-align: -.08em; border-radius: 2px; background: var(--brand-lime); box-shadow: 0 0 12px rgba(203,231,0,.7); animation: sa-voz-pisca .9s steps(1) infinite; }
.sa-topo--voz.sa-falando .sa-voz-cursor { animation: none; }
@keyframes sa-voz-pisca { 50% { opacity: 0; } }
.sa-ia-brilho .sa-voz-cursor { -webkit-text-fill-color: initial; }
@media (prefers-reduced-motion: reduce) { .sa-voz-cursor { display: none; } .sa-voz-ponto { animation: none; } }
/* sem sobreposição: a frase anterior sai rápido e só então a próxima começa a ser escrita */
.sa-topo--voz .sa-ia > .sa-ia-txt { transition: opacity .2s ease, transform .3s ease !important; }
.sa-topo--voz .sa-ia > .sa-ia-txt.ativo { transition: opacity .25s ease .2s, transform .35s cubic-bezier(.16,1,.3,1) .2s !important; }
.sa-topo--voz .sa-ia-txt .sa-ia-t { text-shadow: 0 0 14px rgba(79,123,255,.45); }

/* ===== Transições entre seções (21/10/2026, referência AdCentrl) — mesmas cores, só movimento ===== */
.sa-risco { position: absolute; left: 0; right: 0; top: 0; height: 1px; z-index: 3; pointer-events: none; view-timeline: --sa-risco block; }
.sa-risco i { position: absolute; left: 0; top: 0; width: clamp(140px, 16vw, 260px); height: 2px; border-radius: 2px; opacity: 0;
  background: linear-gradient(90deg, rgba(203,231,0,0), rgba(203,231,0,.9) 75%, #F6FFC2); box-shadow: 0 0 10px rgba(203,231,0,.6); transform-origin: right center; }
.sa-risco i:nth-child(2) { width: clamp(90px, 10vw, 170px); background: linear-gradient(90deg, rgba(79,123,255,0), rgba(79,123,255,.95) 75%, #DCE6FF); box-shadow: 0 0 10px rgba(79,123,255,.7); }
.sa-risco i:nth-child(3) { width: clamp(60px, 6vw, 110px); height: 1.5px; opacity: 0; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .sa-risco i { animation: sa-risco-voa linear both; animation-timeline: --sa-risco; }
    .sa-risco i:nth-child(1) { --x0: -20vw; --y0: 34vh; --x1: 70vw; --y1: -16vh; animation-range: cover 10% cover 55%; }
    .sa-risco i:nth-child(2) { --x0: 10vw; --y0: 42vh; --x1: 105vw; --y1: -10vh; animation-range: cover 22% cover 62%; }
    .sa-risco i:nth-child(3) { --x0: 40vw; --y0: 26vh; --x1: 120vw; --y1: -14vh; animation-range: cover 30% cover 66%; }
    @keyframes sa-risco-voa {
      0% { opacity: 0; transform: translate(var(--x0), var(--y0)) rotate(-24deg) scaleX(.4); }
      25% { opacity: 1; }
      75% { opacity: 1; }
      100% { opacity: 0; transform: translate(var(--x1), var(--y1)) rotate(-24deg) scaleX(1); } }
    /* telas entram inclinadas em 3D e se endireitam com a rolagem (paralaxe em relação ao texto) */
    .sa-produto .sa-grid { perspective: 1800px; }
    .sa-produto .sa-aparelhos { view-timeline: --sa-ap block; }
    .sa-produto .sa-aparelhos > * { animation: sa-iso linear both; animation-timeline: --sa-ap; animation-range: cover 0% cover 100%; transform-style: preserve-3d; }
    .sa-produto--escuro .sa-aparelhos > * { animation-name: sa-iso-inv; }
    @keyframes sa-iso { 0% { rotate: 1 -.6 .3 24deg; translate: 0 90px; } 42% { rotate: 1 -.6 .3 0deg; translate: 0 0; } 100% { rotate: 1 -.6 .3 -4deg; translate: 0 -46px; } }
    @keyframes sa-iso-inv { 0% { rotate: 1 .6 -.3 24deg; translate: 0 90px; } 42% { rotate: 1 .6 -.3 0deg; translate: 0 0; } 100% { rotate: 1 .6 -.3 -4deg; translate: 0 -46px; } }
    /* texto sobe um pouco mais devagar que as telas */
    .sa-produto .sa-texto { view-timeline: --sa-tx block; animation: sa-tx linear both; animation-timeline: --sa-tx; animation-range: cover 0% cover 100%; }
    @keyframes sa-tx { from { translate: 0 30px; } to { translate: 0 -20px; } }
    /* fechamento: o painel sobe e cresce levemente ao entrar */
    .sa-fecho-grid { view-timeline: --sa-fc block; animation: sa-fc linear both; animation-timeline: --sa-fc; animation-range: entry 0% cover 40%; }
    @keyframes sa-fc { from { translate: 0 60px; scale: .96; opacity: .4; } to { translate: 0 0; scale: 1; opacity: 1; } }
  }
}
@media (max-width: 767.98px) {
  @supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) {
    @keyframes sa-iso { 0% { rotate: 1 -.6 .3 16deg; translate: 0 50px; } 45% { rotate: 1 -.6 .3 0deg; translate: 0 0; } 100% { rotate: 1 -.6 .3 -2deg; translate: 0 -20px; } }
    @keyframes sa-iso-inv { 0% { rotate: 1 .6 -.3 16deg; translate: 0 50px; } 45% { rotate: 1 .6 -.3 0deg; translate: 0 0; } 100% { rotate: 1 .6 -.3 -2deg; translate: 0 -20px; } }
    .sa-risco i:nth-child(1) { --x0: -40vw; --x1: 110vw; } .sa-risco i:nth-child(2) { --x0: -10vw; --x1: 130vw; }
  } }
}
/* no Gamify o celular fica preso à onda; só os balões ganham paralaxe */
@supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) {
  .sa-produto--gamify .sa-aparelhos > .sa-gm-fone { animation: none; }
  .sa-produto--gamify .sa-aparelhos > .sa-gm-baloes { animation-name: sa-tx; }
} }
/* riscos mais visíveis; nas seções claras o risco principal é azul */
.sa-risco i { height: 3px; }
.sa-produto--claro .sa-risco i:nth-child(1) { background: linear-gradient(90deg, rgba(22,69,187,0), rgba(22,69,187,.9) 75%, #4F7BFF); box-shadow: 0 0 12px rgba(22,69,187,.5); }
.sa-produto--claro .sa-risco i:nth-child(2) { background: linear-gradient(90deg, rgba(150,180,0,0), rgba(170,200,0,.95) 75%, #CBE700); box-shadow: 0 0 10px rgba(203,231,0,.6); }
.sa-risco { display: none !important; }

/* =====================================================================
   Materiais Didáticos e Recursos Pedagógicos (26/10/2026)
   Verde de apoio do manual (#BCC32F) com texto escuro.
   ===================================================================== */
.pagina:has(.md-topo) { --md-v: #BCC32F; --md-v2: #A9B11F; --md-claro: #F3F5E1; --md-claro2: #E6EAC0; background: #fff; }
.masthead:has(.md-topo) { background: var(--md-claro, #F3F5E1); }
.masthead:has(.md-topo) .sheen { display: none; }
.masthead:has(.md-topo) .site-header .nav-list > li > a[aria-current="page"] { background-color: rgba(188,195,47,.35); }
@media (min-width: 1180px) {
  .pagina:has(.md-topo) > section > .container, .masthead:has(.md-topo) .site-footer > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
.md-v { color: var(--md-v2); }
.md-rotulo { margin: 0 0 12px; font: 700 .8125rem/1.2 "DM Sans", var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--md-v2); }
.md-btn { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 26px; border-radius: 999px; background: var(--md-v); color: var(--brand-ink);
  font: 700 1rem/1 "DM Sans", var(--font-text); text-decoration: none; border: 0; cursor: pointer; box-shadow: 0 10px 24px -12px rgba(120,128,10,.8);
  transition: background .3s, transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .3s; }
.md-btn svg { width: 18px; height: 18px; transition: translate .3s; }
.md-btn:hover { background: var(--md-v2); transform: translateY(-2px); }
.md-btn:hover svg { translate: 4px 0; }
.md-btn--branco { background: #fff; }
.md-btn--branco:hover { background: var(--brand-ink); color: #fff; }
.pagina:has(.md-topo) h2 { margin: 0 0 16px; font: 700 clamp(1.9rem, 1.1rem + 2.4vw, 3rem)/1.08 "Sora", var(--font-display); letter-spacing: -.03em; color: var(--brand-ink); }
.pagina:has(.md-topo) h2 .ln { display: block; }
.pagina:has(.md-topo) section p { font-size: clamp(1rem, .95rem + .2vw, 1.125rem); line-height: 1.6; color: #3A3355; margin: 0 0 14px; max-width: 34rem; }

/* fotos pendentes: mesmo formato da foto final, com o nome do que entra */
.md-foto { position: relative; width: 100%; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; display: grid; place-items: center; text-align: center;
  background: radial-gradient(circle at 30% 25%, #fff 0, transparent 55%), linear-gradient(140deg, var(--md-claro2), #D3D98E); }
.md-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.md-foto > span { max-width: 80%; padding: 6px 12px; border-radius: 999px; background: rgba(26,18,55,.08); font: 600 .75rem/1.3 "DM Sans", var(--font-text); letter-spacing: .06em; text-transform: uppercase; color: #5E6420; }

/* 1. abertura */
.md-topo { background: var(--md-claro); overflow: clip; padding-bottom: clamp(32px, 4vw, 56px); }
.md-hero { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.md-topo h1 { max-width: none; margin: 0 0 18px; font: 700 clamp(2.3rem, 1.2rem + 3.4vw, 4.25rem)/1.04 "Sora", var(--font-display); letter-spacing: -.035em; color: var(--brand-ink); }
.md-topo h1 .ln { display: block; }
.md-lede { margin: 0 0 26px; max-width: 30rem; font-size: clamp(1rem, .95rem + .3vw, 1.2rem); line-height: 1.55; color: #3A3355; }
.md-foto--hero { aspect-ratio: 6 / 5; border-radius: 32px; }
.md-folha { position: absolute; z-index: 0; width: clamp(120px, 14vw, 220px); aspect-ratio: 1; border-radius: 0 70% 0 70%; background: var(--md-v); opacity: .35; }
.md-folha--a { left: -60px; bottom: 30px; transform: rotate(-20deg); }
.md-folha--b { right: -40px; top: 120px; transform: rotate(30deg); opacity: .25; }
.md-atalhos { position: relative; z-index: 2; margin-top: clamp(24px, 3vw, 44px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.md-atalhos { background: #fff; border-radius: 999px; padding: 10px; box-shadow: 0 20px 40px -24px rgba(26,18,55,.35); max-width: calc(1290 * var(--u, 1px)); }
.md-atalhos a { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 60px; padding: 0 14px; border-radius: 999px;
  font: 700 .9375rem/1.2 "DM Sans", var(--font-text); color: var(--brand-ink); text-decoration: none; transition: background .3s; }
.md-atalhos a + a { box-shadow: -1px 0 0 rgba(26,18,55,.1); }
.md-atalhos a:hover { background: var(--md-claro); box-shadow: none; }
.md-atalhos svg { flex: none; width: 28px; height: 28px; color: var(--md-v2); }

/* blocos de duas colunas */
.md-duas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.md-figura { margin: 0; }
.md-figura .md-foto { aspect-ratio: 5 / 4; border-radius: 28px; }
.md-saeb, .md-lab, .md-le, .md-recursos { padding-block: clamp(56px, 7vw, 104px); }
.md-icones { list-style: none; margin: 22px 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 14px 28px; }
.md-icones li { display: flex; align-items: center; gap: 10px; max-width: 12rem; font: 500 .9375rem/1.3 "DM Sans", var(--font-text); color: #3A3355; }
.md-icones svg { flex: none; width: 34px; height: 34px; padding: 6px; border-radius: 10px; background: var(--md-claro); color: var(--md-v2); }

/* 3. Lê e Resolve / 6. recursos */
.md-centro { text-align: center; display: grid; justify-items: center; }
.md-centro p { margin-inline: auto; }
.md-le { background: #fff; }
.md-cards { list-style: none; margin: clamp(28px, 3vw, 44px) 0 clamp(28px, 3vw, 40px); padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
.md-cards li { display: flex; flex-direction: column; gap: 10px; padding: 14px 14px 20px; border-radius: 24px; background: var(--md-claro); transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s; }
.md-cards--le li { text-align: center; }
.md-cards h3 { margin: 4px 6px 0; font: 700 1.0625rem/1.25 "Sora", var(--font-display); color: var(--brand-ink); }
.md-cards p { margin: 0 6px !important; font-size: .9375rem !important; line-height: 1.45 !important; }
.md-cards--rec li { background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 14px 32px -18px rgba(26,18,55,.3); }
.md-cards li:hover { transform: translateY(-6px); box-shadow: 0 24px 44px -22px rgba(26,18,55,.35); }

/* 4. Educação Digital: faixa verde com bordas onduladas */
.md-digital { position: relative; background: var(--md-v); padding-block: clamp(70px, 8vw, 120px); }
.md-onda { position: absolute; left: 0; width: 100%; height: clamp(30px, 4vw, 60px); fill: #fff; }
.md-onda--topo { top: -1px; transform: scaleY(-1); }
.md-onda--base { bottom: -1px; transform: scaleY(-1); fill: #fff; }
.md-digital .md-rotulo { color: var(--brand-ink); }
.md-digital p { color: rgba(26,18,55,.85) !important; }
.md-duas--digital { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.md-redondos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 24px); }
.md-redondos li { display: grid; justify-items: center; gap: 12px; text-align: center; font: 700 .9375rem/1.25 "Sora", var(--font-display); color: var(--brand-ink); }
.md-foto--redonda { aspect-ratio: 1; border-radius: 50%; border: 6px solid #fff; box-shadow: 0 18px 34px -18px rgba(26,18,55,.5); }

/* 5. laboratório */
.md-duas--inv { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
.md-recursos { background: var(--md-claro); }

/* 7. fechamento */
.md-fecho { position: relative; overflow: clip; background: linear-gradient(180deg, #fff, var(--md-claro)); padding-block: clamp(56px, 7vw, 100px); }
.md-fecho-linha { position: absolute; left: -2%; bottom: 10%; width: 46%; pointer-events: none; }
.md-fecho-linha path { fill: none; stroke: var(--md-v); stroke-width: 6; stroke-linecap: round; opacity: .55; stroke-dasharray: 1; }
.md-duas--fecho { position: relative; z-index: 1; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
.md-form { display: grid; gap: 12px; padding: clamp(22px, 2.4vw, 34px); border-radius: 28px; background: #fff; box-shadow: 0 24px 50px -26px rgba(26,18,55,.4); }
.md-form h3 { margin: 0 0 6px; font: 700 1.5rem/1.2 "Sora", var(--font-display); color: var(--brand-ink); }
.md-form input[type=text] { width: 100%; min-height: 52px; padding: 0 20px; border: 1.5px solid transparent; border-radius: 999px; background: #F2F3EE; font: 500 1rem "DM Sans", var(--font-text); color: var(--brand-ink); }
.md-form input[type=text]:focus { outline: none; border-color: var(--md-v2); background: #fff; }
.md-form .md-btn { justify-content: center; margin-top: 6px; }
.sa-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* animações: cards e fotos redondas em sequência, linha do fechamento se desenhando, folhas flutuando */
@media (prefers-reduced-motion: no-preference) {
  .js-reveal .md-cards:not(.in) li, .js-reveal .md-redondos:not(.in) li, .js-reveal .md-icones:not(.in) li { opacity: 0; transform: translateY(26px); }
  .js-reveal .md-cards li, .js-reveal .md-redondos li, .js-reveal .md-icones li { transition: opacity .6s ease, transform .8s cubic-bezier(.16,1,.3,1), box-shadow .45s; }
  .js-reveal :is(.md-cards, .md-redondos, .md-icones) li:nth-child(2) { transition-delay: .1s; }
  .js-reveal :is(.md-cards, .md-redondos, .md-icones) li:nth-child(3) { transition-delay: .2s; }
  .js-reveal :is(.md-cards, .md-redondos, .md-icones) li:nth-child(4) { transition-delay: .3s; }
  :is(.md-cards, .md-redondos, .md-icones).feito li { transition-delay: 0s !important; }
  .md-folha--a { animation: md-folha 9s ease-in-out infinite; } .md-folha--b { animation: md-folha 11s ease-in-out -4s infinite reverse; }
  @keyframes md-folha { 50% { translate: 0 -14px; rotate: 6deg; } }
  .md-redondos li .md-foto--redonda { transition: transform .5s cubic-bezier(.34,1.56,.64,1); }
  .md-redondos li:hover .md-foto--redonda { transform: scale(1.05) rotate(-3deg); }
  .md-fecho-linha path { stroke-dashoffset: 1; transition: stroke-dashoffset 2.4s cubic-bezier(.16,1,.3,1); }
  .md-fecho:has(.in) .md-fecho-linha path { stroke-dashoffset: 0; }
  @supports (animation-timeline: view()) {
    .md-figura, .md-hero-figura { animation: md-sobe linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    @keyframes md-sobe { from { translate: 0 40px; } to { translate: 0 -30px; } }
  }
}

@media (max-width: 1023.98px) {
  .md-hero, .md-duas, .md-duas--digital, .md-duas--inv, .md-duas--fecho { grid-template-columns: 1fr; }
  .md-duas--inv .md-figura { order: 2; }
  .md-atalhos { grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 24px; gap: 4px; }
  .md-atalhos a + a { box-shadow: none; }
  .md-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599.98px) {
  .md-atalhos a { justify-content: flex-start; min-height: 52px; font-size: .875rem; }
  .md-redondos li { font-size: .8125rem; }
  .md-cards h3 { font-size: .9375rem; }
  .md-btn { width: 100%; justify-content: center; }
}
/* ajustes de encaixe (26/10/2026) */
.md-topo h1 { font-size: clamp(2.2rem, 1rem + 3vw, 3.6rem); }
.pagina:has(.md-topo) h2 { font-size: clamp(1.8rem, 1rem + 2vw, 2.6rem); }
@media (min-width: 1180px) {
  .md-topo h1 .ln, .pagina:has(.md-topo) h2 .ln { white-space: nowrap; }
  .pagina:has(.md-topo) > section > nav.md-atalhos { width: calc(1290 * var(--u)); padding: 10px; margin-inline: auto; }
  .md-icones { flex-wrap: nowrap; }
}
@media (min-width: 1180px) {
  .pagina:has(.md-topo) h2 .ln { white-space: normal; }
  .md-topo { padding-top: calc(230 * var(--u)); }
}
.md-atalhos a + a { box-shadow: none !important; position: relative; }
.md-atalhos a + a::before { content: ""; position: absolute; left: 0; top: 30%; bottom: 30%; width: 1px; background: rgba(26,18,55,.12); }
@media (max-width: 1023.98px) { .md-atalhos a + a::before { display: none; } }

/* Abertura com a imagem do caminho (26/10/2026): o menino começa a trilha, a bandeira é a conquista */
.masthead:has(.md-topo) { background: #B7C22E; }
.md-topo { background: #B7C22E; position: relative; overflow: clip; }
.md-caminho { position: absolute; z-index: 0; right: 0; bottom: 0; height: 74%; aspect-ratio: 1916 / 821; pointer-events: none; }
.md-caminho img { display: block; width: 100%; height: 100%; object-fit: cover; }
.md-hero { grid-template-columns: minmax(0, 1fr); }
.md-hero-texto { position: relative; z-index: 2; max-width: 33rem; }
.md-topo .md-rotulo { color: var(--brand-ink); opacity: .8; }
.md-branco { color: #fff; }
.md-topo .md-lede { color: rgba(26,18,55,.88); }
.md-topo .md-btn { background: var(--brand-ink); color: #fff; box-shadow: 0 12px 24px -12px rgba(26,18,55,.6); }
.md-topo .md-btn:hover { background: #fff; color: var(--brand-ink); }
.md-atalhos { position: relative; z-index: 3; }
@media (min-width: 1180px) {
  .md-topo { min-height: calc(900 * var(--u)); padding-bottom: calc(40 * var(--u)) !important; display: flex; flex-direction: column; justify-content: space-between; }
  .md-caminho { height: calc(600 * var(--u)); bottom: calc(70 * var(--u)); }
  .md-hero-texto { max-width: calc(520 * var(--u)); }
}
@media (prefers-reduced-motion: no-preference) {
  .md-caminho img { animation: md-cam-entra 2.2s cubic-bezier(.16,1,.3,1) both, md-cam-respira 14s ease-in-out 2.2s infinite; transform-origin: 75% 80%; }
  @keyframes md-cam-entra { from { opacity: 0; transform: scale(1.06) translateX(30px); clip-path: inset(0 0 0 70%); } to { opacity: 1; transform: none; clip-path: inset(0 0 0 0); } }
  @keyframes md-cam-respira { 50% { transform: scale(1.025); } }
}
@media (max-width: 1179.98px) {
  .md-topo { padding-bottom: 28px; }
  .md-caminho { position: relative; right: auto; bottom: auto; display: block; width: 130%; height: auto; margin: 18px 0 0 -30%; }
  .md-hero-texto { max-width: none; }
}
@media (min-width: 768px) and (max-width: 1179.98px) { .md-caminho { width: 110%; margin-left: -10%; } }
/* texto não encosta no caminho; borda da imagem some no verde */
.md-caminho { -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 14%), linear-gradient(to right, transparent 0, #000 8%); -webkit-mask-composite: source-in; mask-image: linear-gradient(to bottom, transparent 0, #000 14%), linear-gradient(to right, transparent 0, #000 8%); mask-composite: intersect; }
@media (min-width: 1180px) {
  .md-caminho { height: calc(540 * var(--u)); right: calc(-30 * var(--u)); bottom: calc(60 * var(--u)); }
  .md-topo h1 { font-size: calc(52 * var(--u)); }
  .md-hero-texto { max-width: calc(470 * var(--u)); }
  .md-topo .md-lede { font-size: calc(17.5 * var(--u)); }
}
/* textos distribuídos: "Novos caminhos para ensinar." à esquerda, "Mais possibilidades de aprender." à direita, acima do menino */
@media (min-width: 1180px) {
  .md-hero { position: relative; }
  .md-hero-texto { position: static; max-width: calc(500 * var(--u)); }
  .md-hero-texto > * { position: relative; z-index: 2; }
  .md-topo h1 { position: static !important; }
  .md-h1-dir { position: absolute; z-index: 2; right: 0; top: calc(-10 * var(--u)); text-align: right; }
  .md-h1-dir .ln { white-space: nowrap; }
}
@media (min-width: 1180px) {
  .md-hero { position: static; }
  .md-h1-dir { right: calc(85 * var(--u)); top: calc(300 * var(--u)); font-size: calc(46 * var(--u)); }
}
@media (min-width: 1180px) { .md-h1-dir { right: calc((100% - 1440 * var(--u)) / 2 + 75 * var(--u)); } }
/* "Mais possibilidades de aprender." à esquerda do menino, sobre o caminho (posição aprovada 26/10) */
@media (min-width: 1180px) { .md-h1-dir { right: calc((100% - 1440 * var(--u)) / 2 + 300 * var(--u)); top: calc(330 * var(--u)); } }
/* barra de atalhos na divisa verde/branco; abertura mais baixa (26/10) */
.md-topo { overflow-x: clip; overflow-y: visible; z-index: 2; }
.md-atalhos { margin-bottom: 0; transform: translateY(50%); }
.md-saeb { padding-top: calc(clamp(56px, 7vw, 104px) + 40px); }
@media (min-width: 1180px) {
  .md-topo { min-height: calc(740 * var(--u)); padding-bottom: 0 !important; }
  .md-caminho { height: calc(500 * var(--u)); bottom: 0; }
  .md-atalhos { margin-top: calc(24 * var(--u)); }
}
@media (max-width: 1179.98px) { .md-topo { padding-bottom: 0; } .md-caminho { margin-bottom: -10px; } }
/* a animação de entrada mexia no transform e a barra voltava para dentro do verde: desce com "translate", independente */
.md-atalhos { transform: none; translate: 0 50%; }
.md-topo h1, .md-topo h1 .ln { color: #fff; }
/* posição aprovada (26/10 17:54): bloco da esquerda recuado, título da direita menor sobre a bandeira; Sora nos títulos, DM Sans no apoio */
.md-topo h1, .md-topo h1 .ln, .md-h1-dir .ln { font-family: "Sora", var(--font-display) !important; font-weight: 700; }
.md-topo .md-lede { font-family: "DM Sans", var(--font-text) !important; font-weight: 400; }
@media (min-width: 1180px) {
  .md-hero-texto { margin-left: calc(140 * var(--u)); margin-top: calc(40 * var(--u)); max-width: calc(470 * var(--u)); }
  .md-topo h1 { font-size: calc(54 * var(--u)) !important; line-height: 1.05; }
  .md-topo .md-lede { font-size: calc(19 * var(--u)) !important; line-height: 1.6; max-width: calc(470 * var(--u)); }
  .md-h1-dir { font-size: calc(36 * var(--u)) !important; line-height: 1.05; right: calc((100% - 1440 * var(--u)) / 2 + 345 * var(--u)) !important; top: calc(70 * var(--u)) !important; }
}
@media (min-width: 1180px) { .md-h1-dir { top: calc(300 * var(--u)) !important; } }
@media (min-width: 1180px) { .md-h1-dir { right: calc((100% - 1440 * var(--u)) / 2 + 250 * var(--u)) !important; } }
/* celular/tablet: título 1, subtítulo, título 2 (26/10) */
@media (max-width: 1179.98px) {
  .md-hero-texto { display: flex; flex-direction: column; }
  .md-topo h1 { display: contents; }
  .md-topo h1 > .ln { order: 0; font-size: clamp(2.1rem, 8.6vw, 3rem); line-height: 1.05; letter-spacing: -.03em; }
  .md-topo .md-lede { order: 1; margin: 14px 0 16px !important; font-size: 1rem !important; line-height: 1.55; }
  .md-h1-dir { order: 2; display: block; font-size: clamp(1.7rem, 7vw, 2.4rem); line-height: 1.05; letter-spacing: -.03em; }
  .md-h1-dir .ln { display: block; }
  .md-hero-texto > div[data-reveal]:empty { display: none; }
}
@media (max-width: 1179.98px) {
  .md-h1-dir { align-self: flex-end; text-align: right; margin-top: 6px; }
  .md-caminho { margin-top: 0 !important; margin-bottom: 0 !important; }
  .md-atalhos { margin-top: -24px !important; }
}

/* ===== Abertura com a imagem do lápis (26/10/2026) — fundo no verde atual #B7C22E ===== */
.md-caminho { display: none !important; }
.md-topo { background: #B7C22E; }
.md-hero-texto { display: flex; flex-direction: column; }
.md-topo h1 { display: contents; }
.md-topo h1 > .ln { order: 0; }
.md-topo .md-lede { order: 1; }
.md-h1-dir { order: 2; position: static !important; text-align: left !important; align-self: flex-start !important; margin-top: 4px; }
.md-h1-dir .ln { display: block; white-space: normal !important; }
.md-topo h1 > .ln, .md-h1-dir .ln { text-shadow: 0 2px 18px rgba(60,66,10,.35); }
.md-lapis img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 768px) {
  .md-lapis { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
  .md-lapis img { object-position: 78% 60%; }
  .md-lapis::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #B7C22E 0%, #B7C22E 30%, rgba(183,194,46,.85) 40%, rgba(183,194,46,0) 56%); }
}
@media (min-width: 1180px) {
  .md-hero-texto { margin-left: 0 !important; margin-top: calc(30 * var(--u)) !important; max-width: calc(560 * var(--u)) !important; }
  .md-topo h1 > .ln { font-size: calc(58 * var(--u)) !important; line-height: 1.04; }
  .md-h1-dir { font-size: calc(58 * var(--u)) !important; line-height: 1.04; margin-top: calc(18 * var(--u)); }
  .md-topo .md-lede { margin: calc(18 * var(--u)) 0 0 !important; max-width: calc(470 * var(--u)) !important; }
  .md-topo { min-height: calc(760 * var(--u)); }
}
@media (min-width: 768px) and (max-width: 1179.98px) { .md-hero-texto { max-width: 52%; } .md-topo { min-height: 560px; } }
@media (max-width: 767.98px) {
  .md-lapis { display: block; position: relative; margin: 10px calc(var(--gutter, 20px) * -1) 0; }
  .md-lapis::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 26%; z-index: 1; background: linear-gradient(#B7C22E, rgba(183,194,46,0)); }
  .md-lapis img { aspect-ratio: 900 / 985; height: auto; }
  .md-h1-dir { align-self: flex-start !important; text-align: left !important; }
  .md-atalhos { margin-top: -40px !important; }
}
@media (prefers-reduced-motion: no-preference) {
  .md-lapis img { animation: md-lapis-entra 1.8s cubic-bezier(.16,1,.3,1) both; }
  @keyframes md-lapis-entra { from { opacity: 0; transform: scale(1.04); } to { opacity: 1; transform: none; } }
}
@media (min-width: 1180px) { .md-h1-dir .ln { white-space: nowrap !important; } }
@media (max-width: 767.98px) {
  .md-lapis img { position: relative; z-index: 0; }
  .md-lapis::before { z-index: 2; height: 40%; background: linear-gradient(#B7C22E 0%, rgba(183,194,46,.75) 40%, rgba(183,194,46,0) 100%); }
  .md-lapis { margin-top: -20px; }
}
@media (max-width: 767.98px) {
  .md-lapis { margin-top: 0; z-index: 0; }
  .md-hero-texto { position: relative; z-index: 2; }
  .md-lapis::before { height: 45%; background: linear-gradient(#B7C22E 0%, #B7C22E 8%, rgba(183,194,46,.6) 45%, rgba(183,194,46,0) 100%); }
}
@media (max-width: 767.98px) {
  .md-lapis::before { display: none; }
  .md-lapis img { -webkit-mask-image: linear-gradient(transparent 0%, #000 38%); mask-image: linear-gradient(transparent 0%, #000 38%); }
  .md-lapis { margin-top: -40px; }
}
@media (max-width: 767.98px) { .md-lapis { margin-top: -16px !important; } }
/* imagem do livro (26/10): menino à direita */
@media (min-width: 768px) { .md-lapis img { object-position: 80% 50%; } }
@media (max-width: 767.98px) { .md-lapis img { aspect-ratio: 900 / 968; object-position: 60% 50%; } }
/* abertura no padrão de Quem somos: rótulo pequeno, título, texto e botão, bloco centralizado na altura (26/10) */
.md-rotulo--topo { order: -1; margin: 0 0 14px !important; font: 600 .875rem/1.2 "DM Sans", var(--font-text) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--brand-ink) !important; opacity: .85; }
.md-cta { order: 3; align-self: flex-start; margin-top: 26px; }
.md-cta svg { width: 18px; height: 18px; margin-left: 10px; }
@media (min-width: 1180px) {
  .md-topo .md-hero { flex: 1; display: flex; align-items: center; }
  .md-hero-texto { margin-top: 0 !important; padding-bottom: calc(60 * var(--u)); }
  .md-cta { margin-top: calc(30 * var(--u)); }
}
@media (max-width: 599.98px) { .md-cta { align-self: stretch; justify-content: center; } }
/* parágrafo da abertura centralizado na largura do título (como na home) */
.md-topo .md-lede { text-align: justify; text-align-last: center; hyphens: none; }
@media (min-width: 1180px) {
  .md-hero-texto { width: fit-content; }
  .md-topo .md-lede { width: 0; min-width: 100%; max-width: none !important; }
  .md-cta { align-self: center; }
}
@media (max-width: 1179.98px) { .md-topo .md-lede { text-align: center; } .md-rotulo--topo, .md-topo h1 > .ln { text-align: center; } .md-hero-texto { align-items: center; } .md-cta { align-self: center; } }
.md-topo .md-lede { text-align: center !important; text-wrap: balance; }
.md-topo .md-lede { text-align: justify !important; text-align-last: center; hyphens: auto; -webkit-hyphens: auto; text-wrap: wrap; }
.md-topo .md-lede { text-align-last: left !important; }
.md-figura--saeb .md-foto img { object-position: 50% 0%; }
/* foto do SAEB inteira, sem corte (vertical) */
.md-figura--saeb { justify-self: center; }
.md-figura--saeb .md-foto { aspect-ratio: auto; background: none; }
.md-figura--saeb .md-foto img { position: static; width: 100%; height: auto; max-height: min(620px, 78vh); width: auto; max-width: 100%; margin-inline: auto; display: block; border-radius: 28px; object-fit: contain; }
.md-figura--lab .md-foto { background: none; border-radius: 0; }

/* ===== Materiais Didáticos: animações de rolagem no estilo da referência (26/10/2026) ===== */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    /* imagens entram inclinadas em 3D e se endireitam; depois sobem um pouco mais rápido que o texto (paralaxe) */
    .pagina:has(.md-topo) .md-duas { perspective: 1600px; }
    .md-figura { animation: md-iso linear both !important; animation-timeline: view() !important; animation-range: cover 0% cover 100% !important; transform-style: preserve-3d; }
    .md-duas--inv .md-figura { animation-name: md-iso-inv !important; }
    @keyframes md-iso { 0% { rotate: 1 -.6 .25 22deg; translate: 0 90px; opacity: .3; } 40% { rotate: 1 -.6 .25 0deg; translate: 0 0; opacity: 1; } 100% { rotate: 1 -.6 .25 -3deg; translate: 0 -50px; } }
    @keyframes md-iso-inv { 0% { rotate: 1 .6 -.25 22deg; translate: 0 90px; opacity: .3; } 40% { rotate: 1 .6 -.25 0deg; translate: 0 0; opacity: 1; } 100% { rotate: 1 .6 -.25 -3deg; translate: 0 -50px; } }
    .md-duas > div:not(.md-figura) { animation: md-tx linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    @keyframes md-tx { from { translate: 0 36px; } to { translate: 0 -22px; } }
    /* blocos de cards sobem como painel e crescem ao entrar */
    .md-cards, .md-redondos { animation: md-painel linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
    @keyframes md-painel { from { translate: 0 80px; scale: .95; opacity: .2; } to { translate: 0 0; scale: 1; opacity: 1; } }
    /* fotos dentro dos cards com leve zoom enquanto a pessoa rola */
    .md-cards .md-foto img { animation: md-zoom linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    @keyframes md-zoom { from { scale: 1.12; } to { scale: 1; } }
    /* faixa verde da Educação Digital: as fotos redondas giram de leve ao passar */
    /* o item inteiro sobe e desce (o nome acompanha a foto); só a foto gira */
    .md-redondos li:nth-child(odd) { animation: md-sobe linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    .md-redondos li:nth-child(even) { animation: md-sobe-i linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    .md-redondos li:nth-child(odd) .md-foto--redonda { animation: md-gira linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    .md-redondos li:nth-child(even) .md-foto--redonda { animation: md-gira-i linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    @keyframes md-sobe { from { translate: 0 30px; } to { translate: 0 -20px; } }
    @keyframes md-sobe-i { from { translate: 0 50px; } to { translate: 0 -30px; } }
    @keyframes md-gira { from { rotate: -8deg; } to { rotate: 4deg; } }
    @keyframes md-gira-i { from { rotate: 8deg; } to { rotate: -4deg; } }
    /* fechamento: formulário sobe e cresce */
    .md-form { animation: md-painel linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
    /* abertura: imagem do livro se afasta devagar ao rolar para baixo */
    .md-lapis img { animation: md-lapis-entra 1.8s cubic-bezier(.16,1,.3,1) both, md-lapis-sai linear both; animation-timeline: auto, scroll(root); animation-range: normal, 0 100vh; }
    @keyframes md-lapis-sai { to { scale: 1.08; translate: 0 40px; } }
  }
}
/* sem os 3D da animação de entrada antiga, que brigavam com os novos */
@supports (animation-timeline: view()) { .js-reveal .md-cards:not(.in) li, .js-reveal .md-redondos:not(.in) li { opacity: 1 !important; transform: none !important; } }
@media (max-width: 767.98px) {
  @supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) {
    @keyframes md-iso { 0% { rotate: 1 -.6 .25 14deg; translate: 0 50px; opacity: .3; } 45% { rotate: 1 -.6 .25 0deg; translate: 0 0; opacity: 1; } 100% { translate: 0 -20px; } }
    @keyframes md-iso-inv { 0% { rotate: 1 .6 -.25 14deg; translate: 0 50px; opacity: .3; } 45% { rotate: 1 .6 -.25 0deg; translate: 0 0; opacity: 1; } 100% { translate: 0 -20px; } }
  } }
}
.md-destaque { font-weight: 700; color: #fff; }
.md-destaque { color: inherit !important; font-weight: 700; }
/* destaque verde rotativo (26/10): atalhos e ícones */
.md-atalhos a, .md-icones li { transition: background .45s ease, color .45s ease, transform .5s cubic-bezier(.16,1,.3,1), box-shadow .45s ease; }
.md-atalhos a svg, .md-icones li svg { transition: transform .5s cubic-bezier(.34,1.56,.64,1), background .45s, color .45s; }
.md-atalhos a.ativo { background: var(--brand-lime) !important; color: var(--brand-ink); transform: translateY(-4px); box-shadow: 0 14px 28px -14px rgba(160,180,0,.75) !important; }
.md-atalhos a.ativo svg { color: var(--brand-ink); transform: rotate(-8deg) scale(1.12); }
.md-atalhos a.ativo::before, .md-atalhos a.ativo + a::before { opacity: 0; }
.md-icones li { padding: 8px 14px 8px 8px; border-radius: 999px; }
.md-icones li.ativo { background: var(--brand-lime); color: var(--brand-ink); transform: translateY(-4px); box-shadow: 0 12px 24px -12px rgba(160,180,0,.7); }
.md-icones li.ativo svg { background: rgba(26,18,55,.12); color: var(--brand-ink); transform: rotate(-8deg) scale(1.08); }
@media (prefers-reduced-motion: reduce) { .md-atalhos a, .md-icones li, .md-atalhos a svg, .md-icones li svg { transition: none; } }
.md-saeb .md-icones li, .md-saeb .md-icones li svg { transition-duration: .9s !important; }
/* ícones do SAEB e do Laboratório: sem efeito, texto menor, cartão branco com sombra (26/10) */
.md-icones { gap: 12px; }
.md-icones li, .md-icones li.ativo { transform: none !important; background: #fff !important; color: #3A3355 !important;
  padding: 10px 16px 10px 10px; border-radius: 16px; font-size: .8125rem !important; line-height: 1.25;
  box-shadow: 0 1px 2px rgba(26,18,55,.06), 0 10px 24px -12px rgba(26,18,55,.3) !important; transition: none !important; }
.md-icones li svg, .md-icones li.ativo svg { width: 30px; height: 30px; transform: none !important; background: var(--md-claro) !important; color: var(--md-v2) !important; }
@media (min-width: 1180px) { .md-icones li { max-width: none; white-space: nowrap; } }
@media (min-width: 1180px) { .md-icones { flex-wrap: nowrap; gap: 10px; max-width: 34rem; } .md-icones li { white-space: normal; flex: 1 1 0; padding: 10px 12px 10px 10px; gap: 8px; } }
.md-saeb .md-duas > div > p:not(.md-rotulo) { text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.md-saeb .md-duas > div > p:not(.md-rotulo) { hyphens: manual !important; -webkit-hyphens: manual !important; }
@media (max-width: 599.98px) { .md-saeb .md-duas > div > p:not(.md-rotulo) { hyphens: auto !important; -webkit-hyphens: auto !important; hyphenate-limit-chars: 12 5 5; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 5; } }
.md-cards--rec p { text-align: justify; text-align-last: left; hyphens: manual; }
.md-lab .md-duas > div > p:not(.md-rotulo) { text-align: justify; text-align-last: left; hyphens: manual; }
/* linha da marca no fechamento, de ponta a ponta (26/10) */
.md-fecho-linha { left: 0; right: 0; width: 100%; bottom: 6%; height: clamp(110px, 16vw, 240px); }
.md-fecho-linha path { stroke: var(--md-v); stroke-width: 9; opacity: .6; vector-effect: non-scaling-stroke; }
@media (max-width: 767.98px) { .md-fecho-linha { height: 90px; bottom: 2%; } .md-fecho-linha path { stroke-width: 6; } }
.md-fecho { padding-bottom: clamp(120px, 12vw, 180px); }
.md-fecho-linha { bottom: 10px; height: clamp(90px, 10vw, 150px); }
.md-fecho-linha path { stroke: #CBE700 !important; opacity: 1 !important; }

/* =====================================================================
   Formações, Assessorias e Mentorias (26/10/2026), fiel ao mockup aprovado.
   Fundo em brand-ink (o azul índigo da paleta), luz azul da marca ao fundo e lime como destaque.
   ===================================================================== */
.masthead:has(.fa-topo) { background: var(--brand-ink); }
.masthead:has(.fa-topo) .sheen { display: none; }
.pagina:has(.fa-topo) { background: var(--brand-ink); color: var(--ui-white); --fa-card: #241B4A; --fa-borda: rgba(167,189,213,.18); --fa-suave: rgba(255,255,255,.74); }
.masthead:has(.fa-topo) .site-header .brand { color: var(--brand-lime); }
.masthead:has(.fa-topo) .menu-toggle { background: var(--brand-lime); color: var(--brand-ink); }
@media (min-width: 1180px) {
  .masthead:has(.fa-topo) .nav-list > li > a, .masthead:has(.fa-topo) .nav-sub-btn { color: rgba(255,255,255,.86); }
  .masthead:has(.fa-topo) .site-header .nav-list > li > a:hover, .masthead:has(.fa-topo) .site-header .nav-sub-btn:hover,
  .masthead:has(.fa-topo) .site-header .nav-sub-btn[aria-expanded="true"] { background-color: rgba(203,231,0,.16); color: var(--brand-lime); }
  .masthead:has(.fa-topo) .nav-actions .btn--light { background: transparent; color: var(--ui-white); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.4); }
  .masthead:has(.fa-topo) .nav-actions .btn--ink { background: var(--brand-lime); color: var(--brand-ink); }
  .pagina:has(.fa-topo) > section > .container, .masthead:has(.fa-topo) .site-footer > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}

/* base */
.fa-rotulo { margin: 0 0 14px; font: 700 .78rem/1.3 var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--brand-lime); }
.pagina .fa-h2 { font: 600 clamp(1.75rem, 1.2rem + 1.8vw, 2.5rem)/1.08 var(--font-display); letter-spacing: -.025em; margin: 0; text-wrap: balance; }
.pagina .fa-h2--grande { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem); }
.fa-v { color: var(--brand-lime); }
.fa-texto { margin: 16px 0 0; max-width: 34rem; font-size: clamp(1rem, .95rem + .25vw, 1.125rem); line-height: 1.55; color: var(--fa-suave); }
.fa-texto--largo { max-width: 46rem; }
.fa-btn { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; padding: 6px 8px 6px 22px; border-radius: 999px; background: var(--brand-lime); color: var(--brand-ink); font: 700 .95rem/1 var(--font-text); text-decoration: none; transition: background-color .25s ease, color .25s ease, box-shadow .25s ease; }
.fa-btn svg { width: 30px; height: 30px; flex: none; transition: translate .3s var(--ease-out); }
.fa-btn:hover { background: #DDF53A; }
.fa-btn:hover svg { translate: 3px 0; }
.fa-btn--contorno { background: transparent; color: var(--ui-white); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); }
.fa-btn--contorno:hover { background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1.5px var(--brand-lime); }
.fa-btn--ink { background: var(--brand-ink); color: var(--ui-white); }
.fa-btn--ink:hover { background: var(--brand-blue); }
.fa-btn--peq { min-height: 42px; font-size: .875rem; }
.fa-btn:focus-visible, .fa-frente a:focus-visible, .fa-temas a:focus-visible, .fa-nav:focus-visible { outline: 3px solid var(--brand-lime); outline-offset: 3px; }
.fa-seta { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--ui-white); color: var(--brand-ink); flex: none; transition: translate .3s var(--ease-out); }
.fa-seta svg { width: 16px; height: 16px; }

/* 1. abertura */
.fa-topo { background: var(--brand-ink); color: var(--ui-white); overflow: clip; padding-bottom: clamp(48px, 5vw, 72px); }
.fa-topo::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(60% 50% at 78% 22%, rgba(22,69,187,.6), transparent 70%), radial-gradient(40% 30% at 10% 90%, rgba(22,69,187,.3), transparent 70%); }
.fa-topo h1 .ln { display: block; }
.fa-lede { margin: 20px 0 0; max-width: 31rem; font-size: clamp(1rem, .95rem + .3vw, 1.1875rem); line-height: 1.5; color: rgba(255,255,255,.86); }

/* 2. as quatro frentes */
.fa-frentes { position: relative; z-index: 1; list-style: none; margin-top: clamp(28px, 3vw, 44px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.4vw, 20px); }
.fa-frente a { container-type: inline-size; position: relative; display: flex; flex-direction: column; height: 100%; padding: 0 0 18px; border-radius: 20px; overflow: hidden; background: var(--fa-card); box-shadow: inset 0 0 0 1px var(--fa-borda); color: var(--ui-white); text-decoration: none; transition: box-shadow .3s ease, translate .3s var(--ease-out); }
.fa-frente a:hover { box-shadow: inset 0 0 0 1.5px var(--brand-lime); translate: 0 -3px; }
.fa-frente a:hover .fa-seta { translate: 3px 0; }
.fa-frente-foto { position: relative; display: block; aspect-ratio: 332 / 176; }
.fa-frente-foto img { width: 100%; height: 100%; object-fit: cover; }
.fa-frente-icone { position: absolute; z-index: 1; left: 0; top: 24.5cqw; display: grid; place-items: center; width: 36cqw; height: 32cqw; border-radius: 0 6cqw 6cqw 0; background: var(--fa-card); color: var(--brand-lime); }
.fa-frente-icone svg { width: 13cqw; height: 13cqw; }
.fa-frente strong { margin: 6cqw 18px 0; font: 600 clamp(1.1rem, .95rem + .45vw, 1.35rem)/1.15 var(--font-display); letter-spacing: -.015em; max-width: 12ch; }
.fa-frente-txt { margin: 8px 18px 16px; font-size: .875rem; line-height: 1.45; color: var(--fa-suave); }
.fa-frente .fa-seta { margin: auto 18px 0; }
.fa-frente--lime a { background: var(--brand-lime); color: var(--brand-ink); box-shadow: none; }
.fa-frente--lime a:hover { box-shadow: 0 0 0 2px var(--ui-white); }
.fa-frente--lime .fa-frente-foto { position: absolute; top: 0; right: 0; width: 54%; height: 60cqw; aspect-ratio: auto; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%), linear-gradient(0deg, transparent, #000 30%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent, #000 30%), linear-gradient(0deg, transparent, #000 30%); mask-composite: intersect; }
.fa-frente--lime .fa-frente-icone { position: relative; top: auto; left: auto; width: auto; height: auto; margin: 22cqw 0 0 18px; place-items: start; background: none; border-radius: 0; color: var(--brand-ink); }
.fa-frente--lime .fa-frente-icone svg { width: 14cqw; height: 14cqw; }
.fa-frente--lime strong { margin-top: 4cqw; position: relative; }
.fa-frente--lime .fa-frente-txt { position: relative; margin-top: 10px; }
.fa-frente--lime .fa-frente-txt { color: #2B2450; }
.fa-frente--lime .fa-seta { background: var(--brand-ink); color: var(--brand-lime); }

/* 3. faixa */
/* Relevo no lugar de fios: luz azul na borda de cima; a sombra nas vizinhas vem de sections.css (por dentro delas, sem subir camada) */
.fa-relevo { --relevo-luz: inset 0 18px 40px -28px rgba(120,150,255,.22); box-shadow: var(--relevo-cima, 0 0 #0000), var(--relevo-baixo, 0 0 #0000), var(--relevo-luz); }
.fa-faixa { background: radial-gradient(70% 120% at 50% 0%, rgba(22,69,187,.28), transparent 60%), linear-gradient(180deg, #221849, #1A1237 75%); padding-block: clamp(48px, 6vw, 88px); }
.fa-faixa-grade { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.fa-faixa .fa-texto { margin-top: 0; max-width: 36rem; }
.fa-ganhos { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.fa-ganhos li { display: flex; align-items: center; gap: 12px; font-size: .875rem; line-height: 1.35; color: var(--fa-suave); }
.fa-anel { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--brand-lime); color: var(--brand-lime); }
.fa-anel svg { width: 24px; height: 24px; }

/* 4. públicos e carrosséis */
.fa-publicos { padding-block: clamp(56px, 6vw, 96px) clamp(40px, 4vw, 64px); }
.fa-publicos::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(50% 60% at 95% 10%, rgba(22,69,187,.35), transparent 70%); }
.fa-publicos .fa-texto { margin-bottom: clamp(24px, 3vw, 36px); }
.fa-carrossel { position: relative; }
.fa-trilho, .fa-depo-trilho { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.fa-trilho::-webkit-scrollbar, .fa-depo-trilho::-webkit-scrollbar { display: none; }
.fa-trilho { grid-auto-columns: calc((100% - 3 * 16px) / 4); gap: 16px; }
.fa-publico { scroll-snap-align: start; border-radius: 18px; overflow: hidden; background: var(--fa-card); box-shadow: inset 0 0 0 1px var(--fa-borda); }
.fa-publico img { width: 100%; height: auto; aspect-ratio: 336 / 164; object-fit: cover; }
.fa-publico div { padding: 16px 18px 20px; }
.fa-publico h3 { display: flex; align-items: center; gap: 12px; margin: 0; font: 600 1.05rem/1.2 var(--font-display); letter-spacing: -.01em; }
.fa-publico h3 svg { width: 30px; height: 30px; flex: none; color: var(--brand-lime); }
.fa-publico p { margin: 8px 0 0 42px; font-size: .8125rem; line-height: 1.45; color: var(--fa-suave); }
.fa-nav { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); color: var(--ui-white); cursor: pointer; transition: background-color .25s ease, opacity .25s ease; }
.fa-nav:hover:not(:disabled) { background: var(--brand-lime); color: var(--brand-ink); }
.fa-nav:disabled { opacity: .35; cursor: default; }
.fa-nav svg { width: 20px; height: 20px; }
.fa-carrossel > .fa-nav { position: absolute; top: 34%; z-index: 2; }
.fa-nav--ant { left: -56px; } .fa-nav--prox { right: -56px; }
.fa-pontos { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }
.fa-pontos span { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.3); transition: background-color .3s ease, width .3s var(--ease-out); }
.fa-pontos span.ativo { background: var(--brand-lime); }
.fa-sem-nav .fa-nav, .fa-sem-nav .fa-pontos { visibility: hidden; }

/* 5. áreas e temas */
.fa-areas { background: radial-gradient(60% 110% at 20% 0%, rgba(22,69,187,.24), transparent 60%), linear-gradient(180deg, #221849, #1C1340 80%); padding-block: clamp(48px, 5vw, 80px); }
.fa-areas-topo { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: clamp(16px, 2.4vw, 36px); align-items: end; margin-bottom: clamp(24px, 3vw, 36px); }
.fa-areas-txt { margin: 0 0 6px; max-width: 26rem; font-size: .9375rem; }
.fa-temas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.fa-temas a { display: flex; align-items: center; gap: 14px; min-height: 76px; padding: 14px 16px; border-radius: 14px; background: var(--ui-white); color: var(--brand-ink); text-decoration: none; font: 500 .9375rem/1.25 var(--font-text); transition: box-shadow .25s ease, translate .3s var(--ease-out); }
.fa-temas a:hover { box-shadow: 0 0 0 3px var(--brand-lime); translate: 0 -2px; }
.fa-temas svg { width: 32px; height: 32px; flex: none; color: var(--brand-blue); }
.fa-temas small { display: block; font-size: inherit; }
.fa-temas span { flex: 1; }
.fa-temas i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px currentColor; font-style: normal; font-size: .85rem; flex: none; transition: translate .3s var(--ease-out); }
.fa-temas a:hover i { translate: 3px 0; }

/* 6. assessoria */
.fa-assessoria { padding: 0; background: var(--brand-ink); }
.fa-assessoria-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.fa-assessoria-foto { margin: 0; }
.fa-assessoria-foto img { width: 100%; aspect-ratio: 760 / 338; object-fit: cover; border-radius: 0 22px 22px 0; }
.fa-assessoria-txt { padding: clamp(40px, 5vw, 72px) var(--gutter) clamp(40px, 5vw, 72px) clamp(28px, 4vw, 60px); max-width: 640px; }
.fa-assessoria-txt .fa-btn { margin-top: 26px; }

/* 7. mentoria */
.fa-mentoria { padding-block: clamp(56px, 6vw, 96px); }
.fa-mentoria-grade { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.fa-mentoria .fa-btn { margin-top: 26px; }
.fa-passos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fa-passos li { display: flex; flex-direction: column; gap: 14px; min-height: 120px; padding: 16px; border-radius: 16px; background: var(--fa-card); box-shadow: inset 0 0 0 1px var(--fa-borda); font-size: .9rem; line-height: 1.35; color: var(--fa-suave); }
.fa-num { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--brand-lime); color: var(--brand-ink); font: 700 .8rem/1 var(--font-display); }

/* 8. impacto */
.fa-impacto { padding-block: clamp(40px, 4vw, 72px) clamp(56px, 6vw, 96px); }
.fa-impacto-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.fa-depo { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; }
.fa-depo-trilho { grid-auto-columns: 100%; }
.fa-depo-item { scroll-snap-align: start; }
.fa-depo figure { margin: 0; padding: clamp(22px, 2.4vw, 32px); border-radius: 20px; background: var(--fa-card); box-shadow: inset 0 0 0 1px var(--fa-borda); }
.fa-depo blockquote { margin: 0; font-size: clamp(1rem, .95rem + .3vw, 1.125rem); line-height: 1.55; text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.fa-depo figcaption { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.fa-depo figcaption strong { display: block; font-weight: 600; }
.fa-depo figcaption small { color: var(--fa-suave); font-size: .8125rem; }
.fa-depo-selo { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--ui-white); color: var(--brand-blue); flex: none; }
.fa-depo-selo svg { width: 24px; height: 24px; }
.fa-depo-foto { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; box-shadow: 0 0 0 2px var(--brand-lime); }
.fa-depo .fa-pontos { grid-column: 1 / -1; margin-top: 4px; }

/* 9. convite */
.fa-convite { padding-block: 0 clamp(56px, 6vw, 96px); }
.fa-convite-painel { position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: stretch; border-radius: 28px; overflow: hidden; background: var(--brand-lime); color: var(--brand-ink); }
.fa-convite-txt { padding: clamp(28px, 4vw, 56px); }
.fa-convite .fa-rotulo { color: #3F4A00; }
.fa-convite .fa-texto { color: #2B2450; max-width: 32rem; }
.fa-convite .fa-btn { margin-top: 26px; }
.fa-convite-foto { width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 22%); mask-image: linear-gradient(90deg, transparent, #000 22%); }

/* tablet e celular */
@media (max-width: 1179.98px) {
  .fa-nav--ant { left: -8px; } .fa-nav--prox { right: -8px; }
  .fa-trilho { grid-auto-columns: calc((100% - 16px) / 2.2); }
  .fa-areas-topo { grid-template-columns: minmax(0, 1fr) auto; }
  .fa-areas-txt { grid-column: 1 / -1; grid-row: 2; margin: 0; }
  .fa-temas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fa-ganhos { grid-template-columns: 1fr; }
}
@media (max-width: 899.98px) {
  .fa-faixa-grade, .fa-mentoria-grade, .fa-impacto-grade, .fa-assessoria-grade { grid-template-columns: 1fr; }
  .fa-frentes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fa-assessoria-foto img { border-radius: 0; }
  .fa-convite-painel { grid-template-columns: 1fr; }
  .fa-convite-foto { aspect-ratio: 4 / 3; object-position: 60% 10%; -webkit-mask-image: linear-gradient(0deg, #000 70%, transparent); mask-image: linear-gradient(0deg, #000 70%, transparent); }
}
@media (max-width: 599.98px) {
  .fa-frentes { grid-template-columns: 1fr; }
  .fa-trilho { grid-auto-columns: 82%; }
  .fa-carrossel > .fa-nav { display: none; }
  .fa-temas { grid-template-columns: 1fr; }
  .fa-passos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fa-areas-topo { grid-template-columns: 1fr; }
  .fa-areas-topo .fa-btn { justify-self: start; }
  .fa-depo { grid-template-columns: minmax(0, 1fr); }
  .fa-depo > .fa-nav { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .fa-btn svg, .fa-seta, .fa-frente a, .fa-temas a, .fa-temas i { transition: none; }
  .fa-frente a:hover, .fa-temas a:hover { translate: none; }
}

/* Formações: experiência (26/10/2026). Linhas da marca no scroll e formulário no convite */
.pagina:has(.fa-topo) section[id] { scroll-margin-top: 84px; }

.fa-linha { position: absolute; z-index: 0; pointer-events: none; overflow: visible; }
.fa-linha path { fill: none; stroke: var(--brand-lime); stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; stroke-width: 3px; opacity: .55; }
.fa-linhas-js .fa-linha path { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--p, 0)); }
.fa-linha--faixa { left: -6%; bottom: -12%; width: 112%; height: 44%; }
.fa-faixa { padding-bottom: clamp(110px, 11vw, 160px); }
.fa-linha--areas { right: -12%; top: -30%; width: min(760px, 60%); }
.fa-linha--mentoria { right: -4%; top: 50%; translate: 0 -50%; width: min(620px, 50%); }
.fa-linha--mentoria path { opacity: .4; }
.fa-faixa, .fa-areas, .fa-mentoria { overflow-x: clip; overflow-y: visible; }   /* o traço atravessa para as seções vizinhas; só a sobra lateral é cortada */
.fa-faixa > .container, .fa-areas > .container, .fa-mentoria > .container { position: relative; z-index: 1; }
@media (max-width: 899.98px) {
  .fa-linha--areas { width: 90%; top: -10%; }
  .fa-linha--mentoria { width: 120%; right: -40%; top: auto; bottom: -6%; translate: none; }
}

.fa-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 10px; margin-top: 26px; max-width: 40rem; }
.fa-form input[type=text] { width: 100%; min-height: 50px; padding: 0 20px; border: 1.5px solid transparent; border-radius: 999px; background: rgba(255,255,255,.72); font: 500 1rem var(--font-text); color: var(--brand-ink); transition: background-color .2s ease, border-color .2s ease; }
.fa-form input[type=text]::placeholder { color: #4A4466; }
.fa-form input[type=text]:focus { outline: none; background: var(--ui-white); border-color: var(--brand-ink); }
.fa-convite .fa-form .fa-btn { margin-top: 0; min-height: 50px; }
.fa-form-nota { margin: 10px 0 0; font-size: .8125rem; color: #3F4A00; }
@media (max-width: 1179.98px) { .fa-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .fa-form .fa-btn { grid-column: 1 / -1; justify-self: start; } }
@media (max-width: 599.98px) { .fa-form { grid-template-columns: 1fr; } .fa-form .fa-btn { justify-self: stretch; justify-content: space-between; } }

/* Formações: capa (27/10/2026). Cartão com foto ao fundo, cabeçalho dentro dele e fileira de mini-cards no pé */
.fa-topo { padding-top: 12px; }
@media (min-width: 1180px) { .pagina-topo.fa-topo { padding-top: 12px; } }
.masthead:has(.fa-topo) .site-header { position: absolute; top: 12px; left: 12px; right: 12px; }
@media (min-width: 1180px) { .masthead:has(.fa-topo) .site-header .container { height: calc(116 * var(--u)); } }
.fa-capa { --cab: var(--header-h, 76px); --tira-h: clamp(140px, 13vw, 192px); position: relative; z-index: 1; isolation: isolate; margin: 0 12px; min-height: calc(100svh - 24px); padding: calc(var(--cab) + clamp(20px, 3vw, 44px)) 0 calc(var(--tira-h) + clamp(36px, 3.4vw, 56px)); border-radius: 28px; overflow: clip;
  background: radial-gradient(70% 90% at 80% 10%, #1D3FA6 0%, transparent 70%), linear-gradient(100deg, #1A1237 0%, #17205E 48%, #1645BB 100%); }
@media (min-width: 1180px) { .fa-capa { --cab: calc(116 * var(--u)); max-height: none; } }
/* foto do evento: o palestrante fica logo à direita do texto, o auditório ocupa o resto */
.fa-capa-foto { position: absolute; z-index: -1; top: 0; right: 0; width: 58%; height: 84%; }
.fa-capa-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 0% 55%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 11%), linear-gradient(0deg, transparent 0, #000 16%, #000 76%, rgba(0,0,0,.35)); -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 11%), linear-gradient(0deg, transparent 0, #000 16%, #000 76%, rgba(0,0,0,.35)); mask-composite: intersect; }
.fa-capa-txt { position: relative; }
@media (min-width: 1180px) { .fa-capa-txt { max-width: calc(1440 * var(--u)); padding-inline: calc(75 * var(--u)); } }
.pagina .fa-capa h1 { margin: 0; max-width: 13ch; font: 500 clamp(2rem, 1rem + 2.6vw, 3.25rem)/1.06 var(--font-display); letter-spacing: -.035em; color: var(--ui-white); }
.fa-capa h1 .ln { display: block; }
.fa-claro { color: var(--brand-lime-soft); }
.fa-capa .fa-lede { margin: 20px 0 0; max-width: 30rem; font-size: clamp(.95rem, .9rem + .25vw, 1.0625rem); line-height: 1.5; color: rgba(255,255,255,.86); }
.fa-capa-cta { display: inline-flex; align-items: center; gap: 14px; margin-top: 30px; min-height: 50px; padding: 5px 5px 5px 22px; border-radius: 999px; background: var(--brand-lime); color: var(--brand-ink); font: 600 .8125rem/1 var(--font-text); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; transition: background-color .25s ease; }
.fa-capa-cta > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--brand-ink); color: var(--brand-lime); transition: rotate .35s var(--ease-out); }
.fa-capa-cta svg { width: 18px; height: 18px; }
.fa-capa-cta:hover { background: #DDF53A; }
.fa-capa-cta:hover > span { rotate: 45deg; }
.fa-capa-cta:focus-visible { outline: 3px solid var(--brand-lime); outline-offset: 3px; }
.fa-prova { display: flex; align-items: center; gap: 12px; margin-top: 26px; }
.fa-rostos { display: flex; }
.fa-rostos img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #1A2466; }
.fa-rostos img + img { margin-left: -9px; }
.fa-prova p { margin: 0; font-size: .875rem; line-height: 1.35; color: rgba(255,255,255,.78); }
.fa-prova strong { color: var(--ui-white); font-weight: 600; }

/* fileira de mini-cards: as das pontas ficam cortadas pela borda do cartão */
.fa-tira { --mini-w: clamp(200px, 18vw, 280px); --mini-g: clamp(8px, 1vw, 14px); position: absolute; left: 0; right: 0; bottom: clamp(14px, 1.6vw, 22px); height: var(--tira-h); overflow: hidden; }
.fa-tira-trilho { list-style: none; margin: 0; padding: 0; display: flex; width: max-content; height: 100%; }
.fa-tira-trilho > li { flex: none; width: var(--mini-w); margin-right: var(--mini-g); }
/* loop: o trilho tem os cards duas vezes; andar metade dele cai exatamente no começo da cópia */
.fa-tira--loop .fa-tira-trilho { animation: fa-tira 48s linear infinite; }
.fa-tira--loop:hover .fa-tira-trilho, .fa-tira--loop:focus-within .fa-tira-trilho, .fa-tira--fora .fa-tira-trilho { animation-play-state: paused; }
@keyframes fa-tira { to { translate: -50% 0; } }
@media (prefers-reduced-motion: reduce) { .fa-tira--loop .fa-tira-trilho { animation: none; } }
.fa-mini { position: relative; overflow: hidden; border-radius: 18px; padding: clamp(12px, 1.2vw, 18px); background: var(--ui-white); color: var(--brand-ink); box-shadow: 0 18px 40px -20px rgba(5,3,20,.7); display: flex; flex-direction: column; }
.fa-mini small { font-size: .75rem; color: #5B5677; }
.fa-mini--ponta { background: linear-gradient(160deg, rgba(167,189,213,.55), rgba(228,236,155,.45)); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); justify-content: center; align-items: flex-end; gap: 12px; }
.fa-mini--ponta-dir { align-items: flex-start; }
.fa-pilula { display: inline-flex; align-items: center; gap: 8px; padding: 7px 8px 7px 12px; border-radius: 999px; background: rgba(255,255,255,.92); font-size: .75rem; font-weight: 500; box-shadow: 0 6px 16px -8px rgba(5,3,20,.5); }
.fa-pilula b { padding: 2px 7px; border-radius: 999px; background: var(--brand-lime); font-size: .625rem; font-weight: 700; }
.fa-mini--temas { background: #EEF0F5; }
.fa-nuvem { display: flex; flex-wrap: wrap; gap: 6px; width: 150%; margin-left: -18%; }
.fa-nuvem span { padding: 6px 12px; border-radius: 999px; background: var(--ui-white); font-size: .75rem; white-space: nowrap; }
.fa-nuvem span:nth-child(2) { background: var(--brand-lime); }
.fa-mini-rot { margin-top: auto; font-size: .8125rem; color: #3A3355; }
.fa-mini-num { font: 600 clamp(1.4rem, 1rem + 1.4vw, 2.2rem)/1 var(--font-display); letter-spacing: -.03em; margin-top: 4px; }
.fa-mini--foto { padding: 0; }
.fa-mini--foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 10%; }
.fa-mini-painel { position: absolute; left: 10px; right: 10px; bottom: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.95); }
.fa-mini-painel small { display: block; font-size: .6875rem; }
.fa-mini-painel b { font: 600 clamp(.9rem, .75rem + .4vw, 1.1rem)/1.1 var(--font-display); }
.fa-mini--escuro { background: var(--brand-ink); color: var(--ui-white); justify-content: center; }
.fa-mini--escuro p { margin: 0; font: 500 clamp(.9rem, .7rem + .55vw, 1.2rem)/1.32 var(--font-display); letter-spacing: -.01em; }
.fa-mini--escuro p > span:not(.fa-ponto) { color: rgba(255,255,255,.5); }
.fa-ponto { display: inline-block; width: .7em; height: .7em; border-radius: 50%; background: var(--brand-lime); box-shadow: inset 0 0 0 .18em var(--brand-ink); vertical-align: -.05em; }
.fa-mini--plano strong { margin-top: 4px; font: 600 clamp(1.1rem, .9rem + .7vw, 1.5rem)/1 var(--font-display); letter-spacing: -.02em; }
.fa-mini--plano strong span { color: #A4A1B5; font-weight: 500; }
.fa-barra { display: block; height: 6px; margin: 10px 0 8px; border-radius: 6px; background: #E6E8F0; overflow: hidden; }
.fa-barra i { display: block; height: 100%; border-radius: inherit; background: var(--brand-blue); }
.fa-mini--plano ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.fa-mini--plano li { display: flex; align-items: center; gap: 7px; padding: 5px 8px; border-radius: 8px; background: #F3F4F8; font-size: .75rem; }
.fa-mini--plano li svg { width: 14px; height: 14px; flex: none; padding: 2px; border-radius: 50%; background: var(--brand-ink); color: var(--brand-lime); }
.fa-mini--plano em { margin-left: auto; font-style: normal; color: #6B6680; }
@media (max-height: 780px) and (min-width: 1180px) { .fa-mini--plano li:nth-child(3) { display: none; } }

.fa-frentes { margin-top: clamp(28px, 3vw, 44px); }

@media (max-width: 1179.98px) {
  .fa-mini--plano li:nth-child(n+3) { display: none; }
}
@media (max-width: 899.98px) {
  .fa-capa { min-height: 0; padding: calc(var(--cab) + 56vw) 0 24px; }
  .fa-capa-foto { width: 100%; height: 82vw; }
  .fa-capa-foto img { object-position: 30% 60%; -webkit-mask-image: linear-gradient(0deg, transparent 0, #000 40%); mask-image: linear-gradient(0deg, transparent 0, #000 40%); }
  .fa-tira { position: relative; bottom: auto; --tira-h: 168px; --mini-w: 210px; margin-top: 32px; }
}
@media (max-width: 599.98px) {
  .fa-capa { margin: 0 8px; border-radius: 22px; }
  .masthead:has(.fa-topo) .site-header { left: 8px; right: 8px; }
  .fa-capa-cta { width: 100%; justify-content: space-between; }
}
@media (prefers-reduced-motion: reduce) { .fa-capa-cta, .fa-capa-cta > span { transition: none; } .fa-capa-cta:hover > span { rotate: none; } }

/* Capa (27/10/2026, ajuste do Dauro): no desktop cabe inteira na tela (tudo medido em --u, que acompanha largura e altura)
   e os mini-cards somem nas mesmas margens do texto e do cabeçalho */
/* os cards entram pela borda direita do cartão e somem à esquerda, no alinhamento do texto */
.fa-tira { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 48px); mask-image: linear-gradient(90deg, transparent 0, #000 48px); }
@media (min-width: 1180px) {
  .fa-capa { --tira-h: calc(196 * var(--u)); min-height: calc(100svh - 24px); padding: calc(var(--cab) + 34 * var(--u)) 0 0; }
  .pagina .fa-capa h1 { font-size: calc(56 * var(--u)); }
  .fa-capa .fa-lede { margin-top: calc(18 * var(--u)); max-width: calc(480 * var(--u)); font-size: calc(17 * var(--u)); }
  .fa-capa-cta { margin-top: calc(26 * var(--u)); min-height: calc(50 * var(--u)); padding: calc(5 * var(--u)) calc(5 * var(--u)) calc(5 * var(--u)) calc(22 * var(--u)); font-size: calc(13 * var(--u)); gap: calc(14 * var(--u)); }
  .fa-capa-cta > span { width: calc(40 * var(--u)); height: calc(40 * var(--u)); }
  .fa-prova { margin-top: calc(22 * var(--u)); }
  .fa-prova p { font-size: calc(14 * var(--u)); }
  .fa-rostos img { width: calc(32 * var(--u)); height: calc(32 * var(--u)); }
  .fa-tira { --mini-w: calc(262 * var(--u)); --mini-g: calc(14 * var(--u)); bottom: calc(22 * var(--u));
    left: max(calc(75 * var(--u)), calc((100% - 1440 * var(--u)) / 2 + 75 * var(--u)));
    right: 0; }
  .fa-capa-txt { padding-bottom: calc(var(--tira-h) + 56 * var(--u)); }
  .fa-mini { padding: calc(16 * var(--u)); border-radius: calc(18 * var(--u)); }
}
@media (min-width: 900px) and (max-width: 1179.98px) { .fa-tira { left: var(--gutter); right: 0; } }
@media (max-width: 899.98px) { .fa-tira { margin-left: var(--gutter); } }

/* Capa (27/10/2026): destaque dos botões do cabeçalho ao passar o mouse ou focar pelo teclado */
.masthead:has(.fa-topo) .nav-actions .btn { transition: background-color .25s ease, color .25s ease, box-shadow .25s ease; }
.masthead:has(.fa-topo) .nav-actions .btn--ink:hover, .masthead:has(.fa-topo) .nav-actions .btn--ink:focus-visible {
  background: var(--brand-blue); color: var(--ui-white); box-shadow: 0 0 0 4px rgba(22,69,187,.35), 0 10px 28px -8px rgba(22,69,187,.8); }
.masthead:has(.fa-topo) .nav-actions .btn--light:hover, .masthead:has(.fa-topo) .nav-actions .btn--light:focus-visible {
  background: var(--ui-white); color: var(--brand-ink); box-shadow: 0 0 0 4px rgba(255,255,255,.22), 0 10px 28px -10px rgba(255,255,255,.5); }
@media (prefers-reduced-motion: reduce) { .masthead:has(.fa-topo) .nav-actions .btn { transition: none; } }

/* ===== Formações e Assessorias: transições de rolagem no estilo de Materiais Didáticos (02/11/2026) =====
   Reusa os keyframes md-iso, md-tx, md-painel, md-zoom e md-sobe (definidos acima, no bloco de Materiais).
   Só onde o navegador tem animação por rolagem; com movimento reduzido nada se mexe. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    /* abertura: a foto do palco se afasta devagar ao rolar */
    .fa-capa-foto img { animation: md-lapis-sai linear both; animation-timeline: scroll(root); animation-range: 0 100vh; }
    /* foto da assessoria entra inclinada em 3D e se endireita; texto ao lado em paralaxe */
    .fa-assessoria-grade { perspective: 1600px; }
    .fa-assessoria-foto { animation: md-iso linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; transform-style: preserve-3d; }
    .fa-assessoria-txt, .fa-faixa-grade > *, .fa-mentoria-grade > div:first-child, .fa-impacto-grade > div:first-child, .fa-areas-topo { animation: md-tx linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    /* blocos de cards sobem como painel e crescem ao entrar */
    .fa-frentes, .fa-carrossel, .fa-temas, .fa-passos, .fa-depo, .fa-convite-painel { animation: md-painel linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
    /* fotos dentro dos cards com leve zoom enquanto a pessoa rola */
    .fa-publico img, .fa-frente-foto img { animation: md-zoom linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    /* etapas da mentoria: colunas alternadas em velocidades diferentes */
    .fa-passos li:nth-child(odd) { animation: md-sobe linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    .fa-passos li:nth-child(even) { animation: md-sobe-i linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
  }
}


/* ===== Blog: página do artigo (02/11/2026) ===== */
/* artigo: barra de progresso da leitura e compartilhar */
.leitura-barra { position: fixed; z-index: 200; inset: 0 0 auto 0; height: 4px; pointer-events: none; }
.leitura-barra i { display: block; height: 100%; background: var(--brand-lime); transform-origin: 0 50%; scale: var(--lido, 0) 1; }
.artigo-meta { font-size: .9375rem; }
.artigo-compartilhar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px; margin-top: 48px; padding: 20px 22px; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px rgba(26,18,55,.08); }
.artigo-compartilhar p { margin: 0 !important; font: 600 1rem/1.3 var(--font-display); }
.artigo-compartilhar div { display: flex; flex-wrap: wrap; gap: 8px; }
.artigo-compartilhar a, .artigo-compartilhar button { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: rgba(26,18,55,.06); color: var(--brand-ink) !important; font: 600 .875rem/1 var(--font-text); text-decoration: none; cursor: pointer; transition: background .2s; }
.artigo-compartilhar a:hover, .artigo-compartilhar button:hover { background: var(--brand-lime); }
.artigo-compartilhar button.copiado { background: var(--brand-lime); }

/* página do artigo: o mesmo verde da abertura de Materiais Didáticos (#B7C22E), no topo e atrás do cabeçalho */
.masthead:has(.artigo-topo) { background: #B7C22E; }
.masthead:has(.artigo-topo) .sheen { display: none; }
.artigo-topo { background: #B7C22E; }
/* título do artigo menor (02/11/2026) */
.artigo-topo h1 { font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.5rem); line-height: 1.12; max-width: 24ch; }
.artigo-topo h1 { color: #fff; text-shadow: 0 2px 18px rgba(60,66,10,.35); }

/* ===== Blog: lista clara com o mascote (02/11/2026, referência "Hedgie") =====
   Fundo lavanda bem claro com formas suaves, título à esquerda, Bob acenando por trás da barra de busca,
   peças flutuantes com brilho, três atalhos de categoria e cards brancos. Versão escura anterior em
   _backup-2026-10-18/blog-versao-escura-2026-11-02/. */
.pagina:has(.blog-topo) { background: #FCFCFF; color: var(--brand-ink); --bl-suave: #5E5878; --bl-borda: rgba(26,18,55,.08); }
.masthead:has(.blog-topo) { background: #F4F3FE; }
.masthead:has(.blog-topo) .sheen { display: none; }

/* topo */
.blog-topo { position: relative; isolation: isolate; overflow: clip; background: linear-gradient(180deg, #F4F3FE 0%, #F2F4FF 60%, #FCFCFF 100%); padding-bottom: clamp(40px, 5vw, 64px); }
.blog-luz { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.blog-luz i { position: absolute; border-radius: 50%; }
.blog-luz i:nth-child(1) { width: 62vw; height: 62vw; left: 34%; top: 14%; background: radial-gradient(closest-side, rgba(170,195,255,.55), rgba(205,220,255,.35) 60%, transparent); }
.blog-luz i:nth-child(2) { width: 40vw; height: 40vw; right: -14vw; bottom: -16vw; background: radial-gradient(closest-side, rgba(150,170,255,.45), transparent); }
.blog-luz i:nth-child(3) { width: 38vw; height: 38vw; left: -14vw; bottom: -22vw; background: radial-gradient(closest-side, rgba(203,231,0,.22), transparent); }
.blog-palco { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; min-height: clamp(460px, 42vw, 600px); padding-bottom: 110px; }
.blog-hero-txt { position: relative; z-index: 2; padding-bottom: 40px; }
.blog-selo { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 20px; padding: 5px 14px 5px 5px; border-radius: 999px; background: rgba(255,255,255,.75); box-shadow: 0 1px 2px rgba(26,18,55,.06), inset 0 0 0 1px rgba(26,18,55,.06); font-size: .8125rem; color: var(--bl-suave); }
.blog-selo b { padding: 4px 10px; border-radius: 999px; background: var(--brand-ink); color: var(--brand-lime); font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; }
.blog-topo h1 { max-width: none; margin: 0 0 18px; color: var(--brand-ink); font-family: var(--font-display); font-weight: 700; font-size: clamp(2.2rem, 1.2rem + 3vw, 4rem); line-height: 1.04; letter-spacing: -.04em; }
.blog-topo h1 .ln { display: block; }
.blog-grad { background: linear-gradient(90deg, #1645BB, #5B6CF0 60%, #7B5CF0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.blog-topo .pagina-intro { max-width: 26rem; margin: 0; color: var(--bl-suave); font-size: clamp(1.05rem, 1rem + .4vw, 1.35rem); line-height: 1.45; }

/* mascote: espia por trás da barra de busca */
.blog-bob { position: absolute; z-index: 1; left: 56%; bottom: 40px; width: clamp(260px, 30vw, 430px); translate: -50% 0; pointer-events: none; }
.blog-bob img { display: block; width: 100%; height: auto; filter: drop-shadow(0 24px 40px rgba(60,70,160,.18)); }
.blog-bob i { position: absolute; right: -8%; width: 13%; height: 4.5%; min-height: 6px; border-radius: 999px; background: #6B7BF0; }
.blog-bob i:nth-child(2) { top: 14%; rotate: -55deg; right: -2%; }
.blog-bob i:nth-child(3) { top: 22%; rotate: -25deg; }
.blog-bob i:nth-child(4) { top: 30%; rotate: 0deg; width: 10%; }
.blog-pergunta { position: absolute; z-index: 3; left: 50%; bottom: 0; translate: -50% 0; width: min(780px, 100%); display: flex; align-items: center; gap: 12px; padding: 12px 12px 12px 14px; border-radius: 999px; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.06), 0 24px 60px -24px rgba(60,70,160,.35); }
.blog-pergunta-ic { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #EEF0FF; color: #5B6CF0; }
.blog-pergunta-ic svg { width: 22px; height: 22px; }
.blog-pergunta input { flex: 1; min-width: 0; min-height: 52px; border: 0; background: transparent; color: var(--brand-ink); font: 400 clamp(1rem, .95rem + .3vw, 1.2rem)/1.2 var(--font-text); outline: none; }
.blog-pergunta input::placeholder { color: #8C88A3; }
.blog-pergunta button { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border: 0; border-radius: 50%; background: #1645BB; color: #fff; cursor: pointer; box-shadow: 0 10px 22px -10px rgba(22,69,187,.8); transition: scale .25s, background .25s; }
.blog-pergunta button svg { width: 22px; height: 22px; }
.blog-pergunta button:hover { scale: 1.06; background: #1A3FA6; }
.blog-pergunta:focus-within { box-shadow: 0 0 0 3px rgba(22,69,187,.35), 0 24px 60px -24px rgba(60,70,160,.35); }
.blog-pergunta button:focus-visible { outline: 3px solid var(--brand-ink); outline-offset: 3px; }

/* peças flutuantes */
.blog-peca { position: absolute; z-index: 0; display: grid; place-items: center; border-radius: 26%; pointer-events: none; }
.blog-peca svg { width: 44%; height: 44%; color: #fff; }
.blog-peca--a { width: clamp(64px, 6vw, 96px); aspect-ratio: 1; left: 8%; bottom: 22%; rotate: 14deg; background: linear-gradient(135deg, #F2F7B5, #DDEA6A); box-shadow: 0 20px 40px -18px rgba(150,170,0,.6); }
.blog-peca--b { width: clamp(80px, 8vw, 130px); aspect-ratio: 1; right: 5%; top: 30%; rotate: -10deg; background: linear-gradient(135deg, #E9E3FF, #CFC4FF); box-shadow: 0 24px 48px -20px rgba(110,90,220,.5); opacity: .9; }
@media (prefers-reduced-motion: no-preference) {
  .blog-peca--a { animation: blog-flutua 7s ease-in-out infinite; }
  .blog-peca--b { animation: blog-flutua 9s ease-in-out -3s infinite; }
  .blog-bob img { animation: blog-respira 6s ease-in-out infinite; transform-origin: 50% 100%; }
  @keyframes blog-flutua { 50% { translate: 0 -14px; } }
  @keyframes blog-respira { 50% { translate: 0 -6px; } }
}

/* atalhos */
.blog-atalhos-sec { background: #FCFCFF; padding: clamp(36px, 4vw, 56px) 0 0; }
.blog-atalhos { list-style: none; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.blog-atalho { display: flex; align-items: flex-end; gap: 16px; height: 100%; padding: 22px 22px 24px; border-radius: 22px; color: var(--brand-ink); text-decoration: none; box-shadow: inset 0 0 0 1px rgba(26,18,55,.05); transition: translate .3s var(--ease-out, ease), box-shadow .3s; flex-wrap: wrap; }
.blog-atalho--a { background: linear-gradient(135deg, #FBFDE8, #fff 70%); }
.blog-atalho--b { background: linear-gradient(135deg, #F5F2FF, #fff 70%); }
.blog-atalho--c { background: linear-gradient(135deg, #EEF4FF, #fff 70%); }
.blog-atalho:hover { translate: 0 -3px; box-shadow: inset 0 0 0 1px rgba(26,18,55,.06), 0 20px 40px -24px rgba(60,70,160,.35); }
.blog-atalho:focus-visible { outline: 3px solid #1645BB; outline-offset: 3px; }
.blog-atalho-ic { flex-basis: 100%; display: grid; place-items: center; width: 60px; height: 60px; max-width: 60px; border-radius: 16px; }
.blog-atalho-ic svg { width: 28px; height: 28px; }
.blog-atalho--a .blog-atalho-ic { background: #EEF5B5; color: #6F8000; }
.blog-atalho--b .blog-atalho-ic { background: #E8E1FF; color: #6C4CE0; }
.blog-atalho--c .blog-atalho-ic { background: #DCE8FF; color: #1645BB; }
.blog-atalho-txt { flex: 1; display: flex; flex-direction: column; gap: 6px; margin-top: 18px; }
.blog-atalho-txt strong { font: 600 1.25rem/1.15 var(--font-display); letter-spacing: -.015em; }
.blog-atalho-txt span { font-size: .9375rem; line-height: 1.45; color: var(--bl-suave); max-width: 22ch; }
.blog-atalho-seta { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; transition: translate .3s; }
.blog-atalho-seta svg { width: 18px; height: 18px; }
.blog-atalho--a .blog-atalho-seta { background: #EEF5B5; color: #6F8000; }
.blog-atalho--b .blog-atalho-seta { background: #E8E1FF; color: #6C4CE0; }
.blog-atalho--c .blog-atalho-seta { background: #DCE8FF; color: #1645BB; }
.blog-atalho:hover .blog-atalho-seta { translate: 4px 0; }

/* grade */
.blog-corpo { background: #FCFCFF; padding-top: clamp(40px, 5vw, 64px); }
.blog-cab { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 20px; margin-bottom: 16px; }
.blog-cab h2 { margin: 0; color: var(--brand-ink); font: 700 clamp(1.5rem, 1.1rem + 1.2vw, 2.1rem)/1.1 var(--font-display); letter-spacing: -.025em; }
.blog-total { margin: 0; font-size: .875rem; color: var(--bl-suave); }
.blog-filtros { display: flex; gap: 8px; margin-bottom: 28px; overflow-x: auto; scrollbar-width: none; padding: 2px; }
.blog-filtros[hidden] { display: none; }
.blog-filtros::-webkit-scrollbar { display: none; }
.blog-filtros.tem-mais { -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.blog-filtros button { flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 16px; border: 0; border-radius: 999px; background: #fff; color: var(--brand-ink); font: 500 .875rem/1 var(--font-text); cursor: pointer; box-shadow: inset 0 0 0 1px rgba(26,18,55,.1); transition: background .2s, color .2s, box-shadow .2s; }
.blog-filtros button svg { width: 17px; height: 17px; color: #5B6CF0; }
.blog-filtros button:hover { box-shadow: inset 0 0 0 1px rgba(22,69,187,.45); }
.blog-filtros button[aria-pressed="true"] { background: var(--brand-ink); color: #fff; box-shadow: none; }
.blog-filtros button[aria-pressed="true"] svg { color: var(--brand-lime); }
.blog-filtros button:focus-visible, .blog-limpar:focus-visible, .post-card:focus-visible { outline: 3px solid #1645BB; outline-offset: 2px; }
.post-grade { list-style: none; margin: 0; padding: 0; display: grid; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .post-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .post-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.post-grade > li[hidden] { display: none; }
.post-card { display: flex; flex-direction: column; height: 100%; border-radius: 22px; overflow: hidden; background: #fff; color: var(--brand-ink); text-decoration: none; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 14px 36px -22px rgba(60,70,160,.3), inset 0 0 0 1px rgba(26,18,55,.05); transition: translate .35s var(--ease-out, ease), box-shadow .35s; }
.post-card:hover { translate: 0 -4px; box-shadow: 0 2px 4px rgba(26,18,55,.05), 0 26px 50px -24px rgba(60,70,160,.42), inset 0 0 0 1px rgba(22,69,187,.18); }
.post-capa { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #EEF0FF; }
.post-capa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale .6s var(--ease-out, ease); }
.post-card:hover .post-capa img { scale: 1.05; }
.post-capa img.post-capa-vazia { inset: 50% auto auto 50%; width: 26%; height: auto; translate: -50% -50%; object-fit: contain; opacity: .45; }
.post-cat { position: absolute; left: 14px; top: 14px; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--brand-ink); font: 600 .75rem/1 var(--font-text); box-shadow: 0 4px 14px -6px rgba(26,18,55,.3); }
.post-corpo { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 18px 20px 20px; }
.post-dados { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .78rem; color: var(--bl-suave, #5E5878); }
.post-tempo { display: inline-flex; align-items: center; gap: 6px; }
.post-tempo svg { width: 14px; height: 14px; }
.post-card h2 { margin: 0; font: 600 1.15rem/1.28 var(--font-display); letter-spacing: -.012em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.post-resumo { margin: 0; font-size: .9rem; line-height: 1.55; color: var(--bl-suave, #5E5878); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.post-autor { display: flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 12px; border-top: 1px solid rgba(26,18,55,.07); font-size: .8125rem; color: var(--bl-suave, #5E5878); }
.post-autor img { width: 28px; height: 28px; padding: 5px; border-radius: 50%; background: var(--brand-lime); }
.post-grade > li.post-entra { animation: post-entra .45s cubic-bezier(.16,1,.3,1) both; }
@keyframes post-entra { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
.blog-nada { padding: 48px 0 24px; text-align: center; }
.blog-nada[hidden] { display: none; }
.blog-nada p { margin: 0 0 16px; font-size: 1.125rem; color: var(--bl-suave); }
.blog-limpar { min-height: 44px; padding: 0 20px; border: 0; border-radius: 999px; background: var(--brand-ink); color: #fff; font: 600 .9375rem/1 var(--font-text); cursor: pointer; }

/* celular e tablet */
@media (min-width: 900px) { .blog-topo h1 .ln { white-space: nowrap; } }
@media (max-width: 999.98px) {
  .blog-palco { grid-template-columns: 1fr; min-height: 0; padding-bottom: 0; }
  .blog-hero-txt { padding-bottom: 0; text-align: left; }
  .blog-bob { position: relative; left: auto; bottom: auto; translate: none; width: min(320px, 72%); margin: 20px auto -64px; }
  .blog-pergunta { position: relative; left: auto; translate: none; width: 100%; }
  .blog-peca--a { left: auto; right: 6%; bottom: auto; top: 46%; }
  .blog-peca--b { top: 20%; right: -20px; }
  .blog-atalhos { grid-template-columns: 1fr; }
}
@media (max-width: 599.98px) {
  .blog-pergunta { padding: 8px 8px 8px 10px; gap: 8px; }
  .blog-pergunta-ic { width: 40px; height: 40px; }
  .blog-pergunta button { width: 46px; height: 46px; }
  .blog-pergunta input { min-height: 46px; font-size: 1rem; }
  .blog-peca--b { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .post-card, .post-capa img, .blog-atalho, .blog-pergunta button { transition: none; }
  .post-card:hover, .blog-atalho:hover { translate: none; }
  .post-card:hover .post-capa img { scale: none; }
  .post-grade > li.post-entra { animation: none; }
}
/* ajuste: título não encosta no mascote */
.blog-topo h1 { font-size: clamp(2.1rem, 1rem + 2.8vw, 3.3rem); }
@media (min-width: 1000px) { .blog-bob { left: 71%; width: clamp(260px, 27vw, 400px); } }
/* o corte reto da imagem some por trás da barra */
.blog-bob img { -webkit-mask-image: linear-gradient(180deg, #000 82%, transparent 99%); mask-image: linear-gradient(180deg, #000 82%, transparent 99%); }
@media (min-width: 1000px) { .blog-bob { bottom: 14px; } .blog-pergunta { width: min(860px, 100%); } }
/* sem drop-shadow no mascote: com a máscara, ele desenhava um retângulo claro em volta */
.blog-bob img { filter: none; }
/* atalhos em grid: ícone em cima, texto e seta embaixo (no celular, tudo numa linha) */
.blog-atalho { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ic ic" "txt seta"; align-items: end; gap: 18px 16px; }
.blog-atalho-ic { grid-area: ic; flex-basis: auto; }
.blog-atalho-txt { grid-area: txt; margin-top: 0; }
.blog-atalho-seta { grid-area: seta; }
@media (max-width: 999.98px) {
  .blog-atalho { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ic txt seta"; align-items: center; padding: 16px; }
  .blog-atalho-ic { width: 52px; height: 52px; }
  .blog-atalho-txt span { max-width: none; }
}
/* topo do blog cabe inteiro na tela (02/11/2026): a área do mascote e da busca usa a altura que sobra depois do cabeçalho;
   o título acompanha a largura do palco para nunca encostar no mascote */
@media (min-width: 1000px) {
  .blog-topo { --bl-h: clamp(380px, calc(100svh - 150px), 620px); padding-bottom: 28px; }
  .blog-palco { container-type: inline-size; height: var(--bl-h); min-height: 0; padding-bottom: 100px; }
  .blog-topo h1 { font-size: min(3.4rem, 3.45cqi, 7svh); }
  .blog-topo .pagina-intro { font-size: min(1.3rem, 1.6cqi, 3.2svh); }
  .blog-selo { margin-bottom: min(20px, 2svh); }
  .blog-hero-txt { padding-bottom: 20px; }
  .blog-bob { left: 72%; width: min(27vw, 400px, calc((var(--bl-h) - 30px) * .8)); }
  .blog-peca--b { top: 24%; }
}
@media (min-width: 1180px) {
  .blog-topo { --bl-h: clamp(380px, calc(100svh - 200 * var(--u, 1px) - 28px), 640px); }
}
/* blog alinhado à grade do cabeçalho: o texto começa na mesma linha do logo "Bobby" (como em Materiais e Formações) */
@media (min-width: 1180px) {
  .pagina:has(.blog-topo) > section > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
/* título do blog maior; mascote um pouco mais à direita para manter a folga */
@media (min-width: 1000px) {
  .blog-topo h1 { font-size: min(4rem, 3.85cqi, 8svh); }
  .blog-bob { left: 75%; }
}

/* =====================================================================
   Itinerários Pedagógicos Personalizados (02/11/2026), mockup "Com IA e validação humana":
   topo claro com notebook (HTML/CSS), folhas do itinerário e cartões flutuantes; "Como funciona?" em azul
   com 5 passos; "Personalização em escala" com foto da equipe e ganhos.
   ===================================================================== */
.pagina:has(.ip-topo) { background: #fff; color: var(--brand-ink); --ip-suave: #4A4566; --ip-azul: #1645BB; }
.masthead:has(.ip-topo) { background: #F4F5FF; }
.masthead:has(.ip-topo) .sheen { display: none; }
@media (min-width: 1180px) {
  .pagina:has(.ip-topo) > section > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}

/* topo */
.ip-topo { position: relative; isolation: isolate; overflow: clip; background: linear-gradient(180deg, #F4F5FF 0%, #F7F8FF 55%, #fff 100%); padding-bottom: clamp(48px, 6vw, 88px); }
.ip-luz { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ip-luz i { position: absolute; border-radius: 50%; }
.ip-luz i:nth-child(1) { width: 56vw; height: 56vw; right: -12vw; top: -6vw; background: radial-gradient(closest-side, rgba(150,175,255,.42), rgba(190,205,255,.2) 60%, transparent); }
.ip-luz i:nth-child(2) { width: 34vw; height: 34vw; left: -12vw; bottom: -16vw; background: radial-gradient(closest-side, rgba(203,231,0,.2), transparent); }
.ip-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.ip-selo { display: inline-block; margin: 0 0 20px; padding: 8px 18px; border-radius: 999px; background: #E6F08A; color: var(--brand-ink); font: 600 clamp(.85rem, .8rem + .25vw, 1rem)/1.2 var(--font-display); }
.ip-topo h1 { max-width: none; margin: 0 0 22px; color: var(--brand-ink); font-family: var(--font-display); font-weight: 700; font-size: clamp(2.1rem, 1.1rem + 2.9vw, 3.6rem); line-height: 1.08; letter-spacing: -.035em; }
.ip-topo h1 .ln { display: block; }
.ip-marca { display: inline-block !important; margin-top: 6px; padding: 0 .28em .06em; border-radius: .35em; background: var(--brand-lime); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.ip-lede { max-width: 34rem; margin: 0 0 28px; color: var(--ip-suave); font-size: clamp(1rem, .96rem + .25vw, 1.15rem); line-height: 1.6; }
.ip-btn { display: inline-flex; align-items: center; gap: 12px; min-height: 54px; padding: 0 26px 0 12px; border-radius: 12px; background: var(--ip-azul); color: #fff; font: 600 1.0625rem/1 var(--font-text); text-decoration: none; box-shadow: 0 14px 28px -14px rgba(22,69,187,.75); transition: translate .3s var(--ease-out, ease), box-shadow .3s, background .3s; }
.ip-btn-ic { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #fff; color: var(--ip-azul); }
.ip-btn-ic svg { width: 18px; height: 18px; }
.ip-btn:hover { translate: 0 -2px; background: #1A3FA6; box-shadow: 0 18px 34px -14px rgba(22,69,187,.85); }
.ip-btn:focus-visible, .ip-btn-contorno:focus-visible { outline: 3px solid var(--brand-ink); outline-offset: 3px; }
.ip-numeros { list-style: none; margin: 32px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 16px 0; }
.ip-numeros li { display: flex; align-items: center; gap: 12px; padding-right: 28px; }
.ip-numeros li + li { padding-left: 28px; border-left: 1px solid rgba(26,18,55,.14); }
.ip-numeros svg { width: 30px; height: 30px; color: var(--ip-azul); flex: none; }
.ip-numeros span { display: flex; flex-direction: column; font-size: .8125rem; color: var(--ip-suave); }
.ip-numeros strong { font: 700 1.6rem/1.1 var(--font-display); color: var(--brand-ink); letter-spacing: -.02em; }

/* palco: notebook + folhas + cartões */
.ip-palco { position: relative; aspect-ratio: 1.12; }
.ip-note { position: absolute; right: 0; top: 13%; width: 80%; }
.ip-tela { position: relative; aspect-ratio: 1.6; padding: 7% 6% 6%; border: clamp(7px, .8vw, 12px) solid #1B1838; border-bottom-width: clamp(12px, 1.3vw, 18px); border-radius: 18px 18px 6px 6px; background: linear-gradient(180deg, #1645BB 0 30%, #F3F5FF 30%); box-shadow: 0 30px 60px -30px rgba(26,18,55,.55); overflow: hidden; }
.ip-tela-marca { position: absolute; left: 6%; top: 6%; margin: 0; color: #fff; font: 700 clamp(.8rem, .6rem + .5vw, 1.15rem)/1 var(--font-display); letter-spacing: -.02em; }
.ip-tela-marca b { color: var(--brand-lime); }
.ip-tela-titulo { position: relative; margin: 11% 0 0; padding: 4% 5% 0; border-radius: 10px 10px 0 0; background: #fff; color: var(--brand-ink); font: 700 clamp(.7rem, .5rem + .55vw, 1.1rem)/1.2 var(--font-display); }
.ip-tela-grade { display: grid; grid-template-columns: 1.15fr 1fr; gap: 5%; height: 56%; padding: 4% 5% 5%; border-radius: 0 0 10px 10px; background: #fff; }
.ip-grafico { display: flex; align-items: flex-end; gap: 7%; padding: 0 3% 0; border-bottom: 1px solid #E3E6F3; background: repeating-linear-gradient(180deg, transparent 0 24%, #EEF0F8 24% calc(24% + 1px)); }
.ip-grafico span { position: relative; flex: 1; height: calc(var(--b) * 100%); border-radius: 3px 3px 0 0; background: linear-gradient(180deg, var(--brand-lime) 0 calc((1 - var(--a) / var(--b)) * 100%), var(--ip-azul) 0); }
.ip-habilidades { padding: 6% 7%; border-radius: 8px; box-shadow: 0 0 0 1px #E3E6F3; }
.ip-habilidades p { margin: 0 0 8%; font: 700 clamp(.5rem, .35rem + .4vw, .8rem)/1.2 var(--font-display); color: var(--brand-ink); }
.ip-habilidades ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10%; }
.ip-habilidades li { display: flex; align-items: center; gap: 6px; font-size: clamp(.42rem, .3rem + .32vw, .68rem); color: var(--ip-suave); }
.ip-habilidades li::before { content: ""; flex: none; width: 1.2em; height: 1.2em; border-radius: 50%; background: #7DB72F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6.5 12.5 3.5 3.5 7.5-8' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 80% no-repeat; }
.ip-note-base { width: 114%; margin-left: -7%; height: clamp(10px, 1.2vw, 16px); border-radius: 0 0 22px 22px; background: linear-gradient(180deg, #D9DCE8, #AEB2C2); box-shadow: 0 18px 30px -16px rgba(26,18,55,.45); }
.ip-folhas { position: absolute; left: -2%; bottom: 0; width: 52%; height: auto; border-radius: 10px; rotate: -6deg; box-shadow: 0 30px 50px -24px rgba(26,18,55,.5); }
.ip-cartao { position: absolute; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 16px; background: #fff; box-shadow: 0 18px 40px -18px rgba(26,18,55,.35), 0 0 0 1px rgba(26,18,55,.05); color: var(--brand-ink); font: 600 clamp(.8rem, .7rem + .3vw, 1rem)/1.25 var(--font-display); }
.ip-cartao strong { display: block; font-size: 1.35em; line-height: 1.1; }
.ip-cartao > span:last-child { max-width: 15ch; }
.ip-cartao-ic { flex: none; display: grid; place-items: center; width: clamp(40px, 3.6vw, 54px); height: clamp(40px, 3.6vw, 54px); }
.ip-cartao-ic svg { width: 100%; height: 100%; }
.ip-cartao--ia { right: 2%; top: 0; }
.ip-cartao--ia .ip-cartao-ic { color: #3FA34D; }
.ip-cartao--ok { right: 0; bottom: 6%; }
.ip-cartao--ok .ip-cartao-ic { color: #3FA34D; }
@media (prefers-reduced-motion: no-preference) {
  .ip-cartao--ia { animation: ip-flutua 7s ease-in-out infinite; }
  .ip-cartao--ok { animation: ip-flutua 8s ease-in-out -3s infinite; }
  @keyframes ip-flutua { 50% { translate: 0 -10px; } }
}

/* como funciona */
.ip-como { background: var(--ip-azul); color: #fff; }
.ip-como-grade { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 2.1fr); gap: clamp(28px, 4vw, 56px); align-items: center; }
.ip-como h2 { margin: 0 0 14px; color: #fff; font: 700 clamp(1.9rem, 1.2rem + 2vw, 2.8rem)/1.08 var(--font-display); letter-spacing: -.03em; }
.ip-como-txt p { margin: 0 0 30px; max-width: 22rem; color: rgba(255,255,255,.88); font-size: clamp(1rem, .95rem + .3vw, 1.2rem); line-height: 1.5; }
.ip-btn-contorno { display: inline-flex; align-items: center; min-height: 52px; padding: 0 30px; border-radius: 12px; box-shadow: inset 0 0 0 2px rgba(255,255,255,.85); color: #fff; font: 600 1rem/1 var(--font-text); text-decoration: none; transition: background .25s, color .25s; }
.ip-btn-contorno:hover { background: #fff; color: var(--ip-azul); }
.ip-passos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.ip-passo { grid-column: span 2; display: flex; flex-direction: column; gap: 8px; padding: 20px 20px 22px; border-radius: 18px; background: #fff; color: var(--brand-ink); box-shadow: 0 18px 36px -24px rgba(0,0,0,.5); }
.ip-passo:nth-child(n+4) { grid-column: span 3; }
.ip-passo-ic { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 6px; border-radius: 12px; color: #fff; }
.ip-passo-ic svg { width: 26px; height: 26px; }
.ip-passo--azul .ip-passo-ic { background: #1F5BE0; }
.ip-passo--verde-agua .ip-passo-ic { background: #11968E; }
.ip-passo--lima .ip-passo-ic { background: #8DBB12; }
.ip-passo--roxo .ip-passo-ic { background: #9B5DE5; }
.ip-passo--laranja .ip-passo-ic { background: #F07F1F; }
.ip-passo h3 { margin: 0; font: 700 clamp(1rem, .9rem + .35vw, 1.2rem)/1.2 var(--font-display); letter-spacing: -.015em; }
.ip-passo p { margin: 0; font-size: .9rem; line-height: 1.45; color: var(--ip-suave); }

/* personalização em escala */
.ip-escala { background: #fff; }
.ip-escala-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.ip-escala-foto { position: relative; margin: 0 0 0 4%; }
.ip-arco { position: absolute; inset: -6% -6% 10% -8%; border: 2px solid rgba(22,69,187,.35); border-radius: 48% 48% 26px 26px / 34% 34% 26px 26px; background: radial-gradient(closest-side at 50% 40%, rgba(170,190,255,.35), transparent); }
.ip-escala-foto img { position: relative; display: block; width: 100%; height: auto; aspect-ratio: 1.1; object-fit: cover; border-radius: 42% 42% 24px 24px / 32% 32% 24px 24px; box-shadow: 0 30px 60px -30px rgba(26,18,55,.45); }
.ip-selo-escala { position: absolute; left: -6%; bottom: -8%; display: flex; align-items: center; gap: 14px; max-width: 78%; padding: 18px 22px; border-radius: 20px; background: #fff; box-shadow: 0 24px 50px -22px rgba(26,18,55,.4); color: var(--brand-ink); font: 700 clamp(1rem, .85rem + .6vw, 1.45rem)/1.15 var(--font-display); letter-spacing: -.02em; }
.ip-selo-escala svg { flex: none; width: clamp(40px, 4vw, 56px); height: clamp(40px, 4vw, 56px); color: #7DB72F; }
.ip-escala h2 { margin: 0 0 16px; color: var(--brand-ink); font: 700 clamp(1.9rem, 1.1rem + 2.3vw, 3.1rem)/1.06 var(--font-display); letter-spacing: -.035em; }
.ip-escala h2 .ln { display: block; }
.ip-escala-txt > p { max-width: 36rem; margin: 0 0 28px; color: var(--ip-suave); font-size: clamp(1rem, .96rem + .25vw, 1.15rem); line-height: 1.55; }
.ip-ganhos { list-style: none; margin: 0 0 32px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 28px; }
.ip-ganhos li { display: flex; align-items: center; gap: 14px; font: 600 clamp(.95rem, .9rem + .2vw, 1.075rem)/1.3 var(--font-display); color: var(--brand-ink); }
.ip-ganhos li::before { content: ""; flex: none; width: 34px; height: 34px; border-radius: 50%; background: #7DB72F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6.5 12.5 3.5 3.5 7.5-8' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 62% no-repeat; }

/* celular e tablet */
@media (max-width: 999.98px) {
  .ip-hero, .ip-como-grade, .ip-escala-grade { grid-template-columns: 1fr; }
  .ip-palco { max-width: 620px; width: 100%; margin: 8px auto 0; }
  .ip-passos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ip-passo, .ip-passo:nth-child(n+4) { grid-column: span 1; }
  .ip-passo:last-child { grid-column: span 2; }
  .ip-escala-foto { margin: 0 6% 40px; }
}
@media (max-width: 599.98px) {
  .ip-passos { grid-template-columns: 1fr; }
  .ip-passo:last-child { grid-column: span 1; }
  .ip-ganhos { grid-template-columns: 1fr; gap: 16px; }
  .ip-numeros li { padding-right: 18px; }
  .ip-numeros li + li { padding-left: 18px; }
  .ip-cartao { padding: 10px 12px; gap: 8px; }
  .ip-selo-escala { left: -4%; padding: 14px 16px; }
}
@media (prefers-reduced-motion: reduce) { .ip-btn { transition: none; } .ip-btn:hover { translate: none; } }
/* título do topo em 3 linhas como no mockup: o tamanho acompanha a coluna do texto */
@media (min-width: 1000px) {
  .ip-hero-txt { container-type: inline-size; }
  .ip-topo h1 { font-size: min(3.8rem, 7cqi); }
  .ip-topo h1 .ln { white-space: nowrap; }
}
@media (max-width: 599.98px) {
  .ip-numeros { flex-wrap: nowrap; }
  .ip-numeros li { padding-right: 14px; gap: 8px; }
  .ip-numeros li + li { padding-left: 14px; }
  .ip-numeros svg { width: 24px; height: 24px; }
  .ip-numeros strong { font-size: 1.3rem; }
  .ip-numeros span { font-size: .75rem; }
  .ip-cartao { font-size: .75rem; }
}
/* foto do manual da marca (crianças escrevendo em sala, vertical): recorte quase quadrado, foco na mão e no caderno */
.ip-escala-foto img { aspect-ratio: 1; object-position: 50% 62%; }
.ip-lede { margin-bottom: 0; }
/* tela do notebook: mapa de habilidades do Bobby Analytics (redesenho do print enviado por Dauro, sem dados de rede).
   Linhas = complexidade, colunas = domínio; Priorizar, Retomar, Complementar, Aprofundar. Tamanhos em cqi da própria tela. */
.ip-tela { container-type: inline-size; display: flex; flex-direction: column; padding: 0; background: #F3F5FF; }
.ip-tela-marca { position: static; flex: none; display: flex; align-items: center; height: 15cqi; padding: 0 4cqi; background: #1645BB; font-size: 3.4cqi; }
.ip-tela-titulo { margin: 0; padding: 2.6cqi 4cqi 1.4cqi; border-radius: 0; background: none; font-size: 3.2cqi; }
.ip-mapa { flex: 1; min-height: 0; display: grid; grid-template-columns: 11cqi repeat(3, minmax(0, 1fr)); grid-template-rows: auto repeat(3, minmax(0, 1fr)); gap: 1.2cqi; padding: 0 4cqi 3cqi; }
.ip-mapa-col { align-self: end; text-align: center; font: 700 1.9cqi/1.1 var(--font-display); color: var(--brand-ink); }
.ip-mapa-lin { align-self: center; display: flex; flex-direction: column; font: 700 1.9cqi/1.15 var(--font-display); color: var(--brand-ink); }
.ip-mapa-lin small { font: 400 1.5cqi/1.2 var(--font-text); color: var(--ip-suave); }
.ip-cel { display: flex; flex-wrap: wrap; align-content: flex-start; gap: .9cqi; padding: 1.6cqi 1.8cqi; border-radius: 1.6cqi; }
.ip-cel b { flex-basis: 100%; margin-bottom: .4cqi; font: 700 2cqi/1.1 var(--font-display); }
.ip-cel i { width: 7.4cqi; height: 2.4cqi; border-radius: 99px; background: rgba(255,255,255,.92); box-shadow: inset 1.2cqi 0 0 -.4cqi #3B6FE0; }
.ip-cel--p { background: #DC2626; color: #fff; }
.ip-cel--r { background: #FF6A00; color: var(--brand-ink); }
.ip-cel--c { background: #FBE41F; color: var(--brand-ink); }
.ip-cel--a { background: #4CB400; color: var(--brand-ink); }
.ip-cel { overflow: hidden; }
/* etapas numeradas em sequência (02/11/2026): "1." no título e o número grande e suave no canto de cada card */
.ip-passos { counter-reset: ip-etapa; }
.ip-passo { position: relative; counter-increment: ip-etapa; }
.ip-passo::after { content: "0" counter(ip-etapa); position: absolute; top: 14px; right: 18px; font: 700 clamp(2rem, 1.5rem + 1.4vw, 2.9rem)/1 var(--font-display); letter-spacing: -.04em; color: rgba(22,69,187,.1); pointer-events: none; }
.ip-passo-n { color: var(--ip-azul); }

/* ===== Itinerários: experiência do site de 10k, igual a Formações (02/11/2026) =====
   Traços da marca que se desenham com o scroll (.fa-linha + script da página) e as mesmas transições de rolagem
   (keyframes md-* do bloco de Materiais). */
.ip-como, .ip-escala { position: relative; isolation: isolate; overflow: clip; }
.ip-hero, .ip-como-grade, .ip-escala-grade { position: relative; z-index: 1; }
.ip-linha--como { left: -6%; bottom: -14%; width: 112%; height: 48%; }
.ip-linha--como path { opacity: .45; }
.ip-linha--escala { right: -8%; top: -12%; width: min(640px, 48%); }
.ip-linha--escala path { stroke: #BCC32F; opacity: .55; }
@media (max-width: 999.98px) {
  .ip-linha--escala { width: 110%; right: -40%; top: auto; bottom: -10%; }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    /* topo: o notebook se afasta devagar ao rolar */
    .ip-palco { animation: md-lapis-sai linear both; animation-timeline: scroll(root); animation-range: 0 100vh; }
    /* foto entra inclinada em 3D e se endireita; textos em paralaxe */
    .ip-escala-grade { perspective: 1600px; }
    .ip-escala-foto { animation: md-iso linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; transform-style: preserve-3d; }
    .ip-como-txt, .ip-escala-txt { animation: md-tx linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    /* blocos sobem como painel e crescem ao entrar */
    .ip-passos, .ip-ganhos { animation: md-painel linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
    /* etapas em colunas alternadas, como as etapas da mentoria */
    .ip-passo:nth-child(odd) { animation: md-sobe linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    .ip-passo:nth-child(even) { animation: md-sobe-i linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    /* foto com leve zoom enquanto a pessoa rola */
    .ip-escala-foto img { animation: md-zoom linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
  }
}

/* passagem entre seções com profundidade (02/11/2026): cada seção sobe como uma camada sobre a anterior,
   com cantos arredondados em cima e sombra projetada para cima */
.ip-topo { z-index: 1; }
.ip-como, .ip-escala { --ip-sobe: clamp(28px, 3.2vw, 52px); margin-top: calc(var(--ip-sobe) * -1); border-radius: var(--ip-sobe) var(--ip-sobe) 0 0; }
.ip-como { z-index: 2; box-shadow: 0 -28px 60px -26px rgba(26,18,55,.5), inset 0 1px 0 rgba(255,255,255,.18); }
.ip-escala { z-index: 3; box-shadow: 0 -30px 60px -24px rgba(8,20,90,.55); }
/* textos justificados (02/11/2026), como na abertura de Materiais: última linha à esquerda e hifenização em português */
.ip-lede, .ip-como-txt p, .ip-passo p, .ip-escala-txt > p { text-align: justify; text-align-last: left; hyphens: auto; -webkit-hyphens: auto; }

/* Materiais: seção de Itinerários Pedagógicos Personalizados depois do SAEB (02/11/2026).
   Mesmo desenho das seções de duas colunas; foto à esquerda (alterna com o SAEB) e fundo verde bem claro. */
.md-itin { padding-block: clamp(56px, 7vw, 104px); background: var(--md-claro, #F3F5E1); }
.md-itin .md-foto { border-radius: 28px; }
.md-itin .md-duas > div > p:not(.md-rotulo) { text-align: justify; text-align-last: left; hyphens: auto; -webkit-hyphens: auto; }
.md-itin .md-foto { aspect-ratio: 4 / 3.2; }
.md-itin .md-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 40% 50%; }
/* seção de Itinerários mais compacta (02/11/2026): fontes menores e menos altura */
.md-itin { padding-block: clamp(40px, 5vw, 72px); }
.md-itin .md-duas { align-items: center; }
.md-itin .md-rotulo { font-size: .75rem; margin-bottom: 10px; }
.pagina:has(.md-topo) .md-itin h2 { font-size: clamp(1.5rem, 1rem + 1.5vw, 2.25rem); line-height: 1.1; margin-bottom: 14px; }
.md-itin .md-duas > div > p:not(.md-rotulo) { font-size: clamp(.95rem, .9rem + .2vw, 1.05rem); line-height: 1.55; margin-bottom: 10px; }
.md-itin .md-icones { margin-top: 18px; margin-bottom: 22px; }
.md-itin .md-icones li { font-size: .875rem; }
.md-itin .md-foto { aspect-ratio: 4 / 3; max-height: 440px; }
/* "Com IA e validação humana" sempre numa linha; sem os cards de ícones; texto justificado em todas as larguras */
.md-itin h2 .ln { white-space: normal; }
.md-itin h2 .ln.md-v { white-space: nowrap; }
@media (max-width: 479.98px) { .pagina:has(.md-topo) .md-itin h2 { font-size: min(1.5rem, 6.9vw); } }
.md-itin .md-duas > div > p:not(.md-rotulo) { text-align: justify !important; text-align-last: left !important; hyphens: auto; -webkit-hyphens: auto; }
.md-itin .md-btn { margin-top: 12px; }
/* seção de Itinerários: fontes ainda menores (02/11/2026) */
.pagina:has(.md-topo) .md-itin h2 { font-size: clamp(1.3rem, .95rem + 1.05vw, 1.85rem); }
.md-itin .md-duas > div > p:not(.md-rotulo) { font-size: clamp(.9rem, .87rem + .12vw, .98rem); }
.md-itin .md-rotulo { font-size: .6875rem; }
@media (max-width: 479.98px) { .pagina:has(.md-topo) .md-itin h2 { font-size: min(1.3rem, 6.3vw); } }
/* Materiais: profundidade na passagem das seções em volta de Itinerários (02/11/2026), igual à página de Itinerários:
   a seção sobe sobre a anterior, com cantos arredondados em cima e sombra projetada para cima */
.md-itin, .md-le, .md-recursos, .md-fecho { --md-sobe: clamp(28px, 3.2vw, 52px); position: relative; margin-top: calc(var(--md-sobe) * -1); border-radius: var(--md-sobe) var(--md-sobe) 0 0; }
.md-itin { z-index: 3; box-shadow: 0 -26px 56px -26px rgba(26,18,55,.32); }
.md-le { z-index: 4; box-shadow: 0 -26px 56px -24px rgba(60,66,10,.34); }
.md-saeb { position: relative; z-index: 2; }
/* camadas com sombra nas passagens de Materiais (02/11/2026). Ficam como eram: abertura → SAEB (barra de atalhos)
   e a Educação Digital com as ondas, junto com a entrada do Laboratório. */
.md-recursos { z-index: 7; box-shadow: 0 -26px 56px -26px rgba(26,18,55,.3); }
.md-fecho { z-index: 8; box-shadow: 0 -26px 56px -26px rgba(26,18,55,.3); }
/* parágrafo da abertura de Materiais maior (02/11/2026) */
.md-topo .md-lede { font-size: clamp(1.125rem, 1.02rem + .45vw, 1.35rem) !important; line-height: 1.55; }
@media (min-width: 1180px) { .md-topo .md-lede { font-size: calc(22 * var(--u)) !important; max-width: calc(540 * var(--u)) !important; } }
/* parágrafo da abertura de Materiais no azul profundo exato da marca (#1A1237, manual p. 55) */
.pagina:has(.md-topo) .md-topo .md-lede, .pagina:has(.md-topo) .md-topo .md-lede strong { color: #1A1237 !important; }
/* rótulo "Materiais didáticos" da abertura no mesmo azul profundo da marca do parágrafo (#1A1237), sem transparência */
.pagina:has(.md-topo) .md-topo .md-rotulo--topo { color: #1645BB !important; }
/* Sistemas: frase de destaque do Bobby Analytics (02/11/2026) */
.sa-lema strong { color: var(--brand-lime); font-weight: 700; }
.sa-desc + .sa-desc { margin-top: 12px !important; }
/* Bobby Analytics: subtítulo-título menor (02/11/2026) */
.sa-produto--escuro .sa-sub { max-width: 34ch; font-size: clamp(1.05rem, .92rem + .5vw, 1.35rem); line-height: 1.3; }
/* Bobby Analytics: parágrafos e destaque um pouco menores (02/11/2026) */
.sa-produto--escuro .sa-desc { font-size: clamp(.95rem, .9rem + .22vw, 1.09rem); }
/* Bobby Analytics (02/11/2026): cantos arredondados só na entrada (em cima); embaixo o bloco termina reto.
   Mantém a abertura na largura ao rolar. Parágrafos justificados. */
.sa-produto--escuro::before { clip-path: inset(0 0 round 72px 72px 0 0); }
@keyframes sa-abre { from { clip-path: inset(0 6% round 40px 40px 0 0); } to { clip-path: inset(0 0 round 72px 72px 0 0); } }
@media (max-width: 1023.98px) {
  .sa-produto--escuro::before { clip-path: inset(0 0 round 36px 36px 0 0); }
  @keyframes sa-abre { from { clip-path: inset(0 4% round 28px 28px 0 0); } to { clip-path: inset(0 0 round 36px 36px 0 0); } }
}
.sa-produto--escuro .sa-desc { text-align: justify; text-align-last: left; hyphens: auto; -webkit-hyphens: auto; }

/* =====================================================================
   Trabalhe com a Bobby (07/11/2026)
   ===================================================================== */
.pagina:has(.tc-topo) { background: #F6F7FB; }
.masthead:has(.tc-topo) { background: #EEF1FA; }
.masthead:has(.tc-topo) .sheen { display: none; }
@media (min-width: 1180px) {
  .pagina:has(.tc-topo) > section > .container, .masthead:has(.tc-topo) .site-footer > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
.tc-topo { background: #EEF1FA; overflow: clip; padding-bottom: clamp(40px, 5vw, 72px); }
.tc-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.tc-rotulo { margin: 0 0 12px; font: 600 .8125rem/1.2 "DM Sans", var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--brand-blue); }
.tc-topo h1 { max-width: none; margin: 0 0 16px; font: 700 clamp(2.1rem, 1.1rem + 2.8vw, 3.5rem)/1.06 "Sora", var(--font-display); letter-spacing: -.03em; color: var(--brand-blue); }
.tc-lede { margin: 0; max-width: 34rem; font-size: clamp(1rem, .95rem + .3vw, 1.2rem); line-height: 1.55; color: #3A3355; }
.tc-hero-foto { position: relative; margin: 0; }
.tc-hero-foto::before { content: ""; position: absolute; inset: -6% -8% -6% 10%; z-index: 0; border-radius: 48% 52% 46% 54% / 55% 48% 52% 45%; background: #DCE4F8; }
.tc-hero-foto img { position: relative; z-index: 1; display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 28px; box-shadow: 0 30px 60px -30px rgba(26,18,55,.45); }

.tc-corpo { padding-block: clamp(36px, 4vw, 64px) clamp(56px, 6vw, 96px); }
.tc-grade { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(20px, 2.4vw, 32px); align-items: start; }

/* formulário */
.tc-form { padding: clamp(20px, 2.4vw, 34px); border-radius: 24px; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 20px 50px -30px rgba(26,18,55,.35); }
.tc-form fieldset { margin: 0; padding: 0 0 22px; border: 0; border-bottom: 1px solid #E8EAF2; }
.tc-form fieldset + fieldset { padding-top: 22px; }
.tc-form legend { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 14px; float: left; width: 100%; margin-bottom: 16px; padding: 0; font: 700 1.25rem/1.2 "Sora", var(--font-display); color: var(--brand-blue); }
.tc-form legend small { grid-column: 2; margin-top: 2px; font: 400 .875rem/1.3 "DM Sans", var(--font-text); color: #5A5478; }
.tc-form legend b, .tc-form label b { color: #D33B3B; font-weight: 700; }
.tc-form legend + * { clear: both; }
.tc-ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #EEF1FA; color: var(--brand-blue); }
.tc-ic svg { width: 22px; height: 22px; }
.tc-linha { display: grid; gap: 14px 16px; }
.tc-linha--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tc-linha--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tc-form label { display: grid; gap: 6px; font: 600 .875rem/1.3 "DM Sans", var(--font-text); color: var(--brand-ink); }
.tc-form label i { font-style: normal; font-weight: 400; color: #6B6585; }
.tc-form input[type=text], .tc-form input[type=tel], .tc-form input[type=email], .tc-form input[type=url], .tc-form select, .tc-form textarea {
  width: 100%; min-height: 46px; padding: 10px 14px; border: 1.5px solid #DEE1EC; border-radius: 10px; background: #fff;
  font: 400 .9375rem/1.4 "DM Sans", var(--font-text); color: var(--brand-ink); transition: border-color .2s, box-shadow .2s; }
.tc-form textarea { resize: vertical; min-height: 84px; }
.tc-form select { appearance: none; padding-right: 40px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%231A1237' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center / 18px; }
.tc-form :is(input, select, textarea):focus { outline: none; border-color: var(--brand-blue); box-shadow: 0 0 0 3px rgba(22,69,187,.15); }
.tc-form ::placeholder { color: #9A96AE; }
.tc-campo { position: relative; display: block; }
.tc-campo svg { position: absolute; left: 13px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: #6B6585; pointer-events: none; }
.tc-campo input { padding-left: 40px !important; }
.tc-erro :is(input, select, textarea), .tc-aceite.tc-erro { border-color: #D33B3B !important; }
.tc-aceite.tc-erro span { color: #D33B3B; }
.tc-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.tc-aceite { display: flex !important; align-items: flex-start; gap: 10px; margin: 20px 0 0; font-weight: 400 !important; color: #3A3355 !important; }
.tc-aceite input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--brand-blue); }
.tc-aceite a { color: var(--brand-blue); }
.tc-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 22px; }
.tc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 30px; border: 0; border-radius: 12px; cursor: pointer;
  background: #9DB21E; color: #fff; font: 700 1rem/1 "DM Sans", var(--font-text); box-shadow: 0 12px 24px -12px rgba(120,140,0,.8); transition: background .25s, transform .3s; }
.tc-btn svg { width: 20px; height: 20px; }
.tc-btn:hover { background: #869A12; transform: translateY(-2px); }
.tc-btn:disabled { opacity: .6; cursor: wait; transform: none; }
.tc-status { margin: 0; font-size: .9375rem; color: #D33B3B; }

/* coluna lateral */
.tc-lado { display: grid; gap: 18px; }
.tc-card { margin: 0; padding: clamp(20px, 2.2vw, 28px); border-radius: 22px; background: #F3F6E3; list-style: none; }
.tc-porque h2 { margin: 0 0 18px; font: 700 clamp(1.4rem, 1.1rem + .8vw, 1.75rem)/1.15 "Sora", var(--font-display); color: var(--brand-blue); }
.tc-porque ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.tc-porque li { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; }
.tc-porque .tc-ic { background: #fff; color: #8DA012; }
.tc-porque h3 { margin: 0 0 3px; font: 700 1rem/1.25 "Sora", var(--font-display); color: var(--brand-blue); }
.tc-porque p { margin: 0; font-size: .875rem; line-height: 1.45; color: #3A3355; }
.tc-numeros { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-inline: 10px; }
.tc-numeros li { display: grid; justify-items: center; align-content: start; gap: 6px; padding: 4px 10px; text-align: center; font: 500 .875rem/1.3 "DM Sans", var(--font-text); color: var(--brand-ink); }
.tc-numeros li + li { border-left: 1px solid rgba(26,18,55,.12); }
.tc-numeros svg { width: 30px; height: 30px; color: #8DA012; }
.tc-numeros strong { font: 700 1.6rem/1 "Sora", var(--font-display); color: var(--brand-ink); }

/* confirmação */
.tc-ok { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(26,18,55,.55); }
.tc-ok[hidden] { display: none; }
.tc-ok-caixa { max-width: 440px; padding: 30px; border-radius: 22px; background: #fff; text-align: center; box-shadow: 0 30px 80px -20px rgba(0,0,0,.5); }
.tc-ok-caixa h2 { margin: 0 0 10px; font: 700 1.5rem/1.2 "Sora", var(--font-display); color: var(--brand-blue); }
.tc-ok-caixa p { margin: 0 0 20px; color: #3A3355; line-height: 1.5; }

@media (prefers-reduced-motion: no-preference) {
  .js-reveal .tc-porque:not(.in) li { opacity: 0; transform: translateY(18px); }
  .js-reveal .tc-porque li { transition: opacity .6s ease, transform .8s cubic-bezier(.16,1,.3,1); }
  .js-reveal .tc-porque li:nth-child(2) { transition-delay: .1s; } .js-reveal .tc-porque li:nth-child(3) { transition-delay: .2s; } .js-reveal .tc-porque li:nth-child(4) { transition-delay: .3s; }
}
@media (max-width: 1023.98px) {
  .tc-hero, .tc-grade { grid-template-columns: 1fr; }
  .tc-hero-foto { max-width: 560px; }
}
@media (max-width: 699.98px) {
  .tc-linha--3, .tc-linha--2 { grid-template-columns: 1fr; }
  .tc-numeros { grid-template-columns: 1fr; gap: 10px; }
  .tc-numeros li + li { border-left: 0; border-top: 1px solid rgba(26,18,55,.12); padding-top: 12px; }
  .tc-btn { width: 100%; }
}
/* rótulos: asterisco e "(opcional)" na mesma linha do nome do campo */
.tc-form label:not(.tc-aceite) { display: flex; flex-wrap: wrap; align-content: start; gap: 6px 4px; }
.tc-form label > :is(input, select, textarea, .tc-campo) { flex: 0 0 100%; }
.tc-form legend { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; }
.tc-form legend b { margin-left: -10px; }
.tc-form legend small { flex: 0 0 100%; padding-left: 56px; margin-top: -4px; }
.tc-form .tc-aceite > input { flex: 0 0 20px; } .tc-form .tc-aceite > span { flex: 1; }

/* =====================================================================
   Seja parceiro (07/11/2026)
   ===================================================================== */
.pagina:has(.sp-topo) { background: #F6F7FB; }
.masthead:has(.sp-topo) { background: #F6F7FB; }
.masthead:has(.sp-topo) .sheen { display: none; }
@media (min-width: 1180px) {
  .pagina:has(.sp-topo) > section > .container, .masthead:has(.sp-topo) .site-footer > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
.sp-v { color: var(--brand-lime); }
.sp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 28px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--brand-lime); color: var(--brand-ink); font: 700 1rem/1 "DM Sans", var(--font-text); text-decoration: none; transition: background .25s, transform .3s; }
.sp-btn svg { width: 18px; height: 18px; transition: translate .3s; }
.sp-btn:hover { background: #DDF53A; transform: translateY(-2px); }
.sp-btn:hover svg { translate: 3px 0; }
.sp-btn:disabled { opacity: .6; cursor: wait; }

/* abertura */
.sp-topo { position: relative; overflow: clip; background: #0F2A6B; color: #fff; padding-bottom: clamp(48px, 6vw, 90px); }
.sp-topo-foto { position: absolute; inset: 0 0 0 38%; display: grid; place-items: center;
  background: linear-gradient(90deg, #0F2A6B 0%, rgba(15,42,107,.2) 30%, rgba(15,42,107,0) 60%), radial-gradient(circle at 60% 40%, #2E4FA8, #142F72); }
.sp-topo-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sp-topo-foto::after { content: attr(data-foto-pendente); position: relative; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.12); font: 600 .75rem/1 "DM Sans", var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.sp-topo-foto:has(img)::after { display: none; }
.sp-faixa { position: absolute; z-index: 1; left: -10%; bottom: -30%; width: 70%; aspect-ratio: 1; border-radius: 50%; border: clamp(18px, 2.4vw, 34px) solid var(--brand-lime); clip-path: inset(0 0 50% 0); transform: rotate(-20deg); opacity: .95; }
.sp-hero { position: relative; z-index: 2; }
.sp-hero-texto { max-width: 34rem; }
.sp-rotulo { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; font: 600 .875rem/1 "DM Sans", var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.9); }
.sp-rotulo::after { content: ""; width: 24px; height: 2px; background: var(--brand-lime); }
.sp-topo h1 { max-width: none; margin: 0 0 18px; font: 700 clamp(2.2rem, 1.1rem + 3vw, 3.75rem)/1.04 "Sora", var(--font-display); letter-spacing: -.03em; color: #fff; }
.sp-topo h1 .ln { display: block; }
.sp-lede { margin: 0 0 26px; max-width: 28rem; font-size: clamp(1rem, .95rem + .3vw, 1.2rem); line-height: 1.55; color: rgba(255,255,255,.88); }

/* por que */
.sp-porque { padding-block: clamp(48px, 6vw, 80px) clamp(20px, 3vw, 36px); }
.sp-centro { display: grid; justify-items: center; text-align: center; }
.pagina:has(.sp-topo) h2 { margin: 0; font: 700 clamp(1.7rem, 1rem + 1.8vw, 2.4rem)/1.15 "Sora", var(--font-display); letter-spacing: -.02em; color: #12307F; }
.sp-traco { display: block; width: 56px; height: 4px; margin: 16px 0 18px; border-radius: 4px; background: var(--brand-lime); }
.sp-porque p { margin: 0; max-width: 46rem; font-size: clamp(1rem, .95rem + .2vw, 1.125rem); line-height: 1.6; color: #3A3355; }

/* tipos */
.sp-tipos-sec { padding-block: clamp(20px, 3vw, 36px); }
.sp-tipos-caixa { padding: clamp(22px, 2.6vw, 36px); border-radius: 28px; background: #EEF1F8; }
.sp-tipos { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 22px); }
.sp-tipo { display: flex; flex-direction: column; gap: 14px; padding: clamp(20px, 2vw, 28px); border-radius: 20px; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 14px 32px -20px rgba(26,18,55,.3); transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s; }
.sp-tipo:hover { transform: translateY(-6px); box-shadow: 0 26px 44px -22px rgba(26,18,55,.4); }
.sp-tipo-topo { display: flex; align-items: center; gap: 14px; }
.sp-tipo h3 { margin: 0; font: 700 1.125rem/1.2 "Sora", var(--font-display); color: var(--brand-ink); }
.sp-tipo p { margin: 0; font-size: .9375rem; line-height: 1.5; color: #3A3355; }
.sp-ic { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; }
.sp-ic svg { width: 26px; height: 26px; }
.sp-ic--azul { background: #12307F; color: #fff; }
.sp-ic--verde { background: var(--brand-lime); color: var(--brand-ink); }
.sp-ic--claro { background: #EEF4C9; color: #6F8000; }
.sp-pill { align-self: flex-start; margin-top: auto; display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 18px; border-radius: 999px; background: #EEF4C9; color: var(--brand-ink); font: 700 .875rem/1 "DM Sans", var(--font-text); text-decoration: none; transition: background .25s; }
.sp-pill svg { width: 16px; height: 16px; transition: translate .3s; }
.sp-pill:hover { background: var(--brand-lime); }
.sp-pill:hover svg { translate: 3px 0; }

/* benefícios */
.sp-ben { padding-block: clamp(36px, 4vw, 60px); }
.sp-ben-lista { list-style: none; margin: 24px 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.sp-ben-lista li { display: grid; justify-items: center; align-content: start; gap: 8px; padding: 6px clamp(10px, 1.4vw, 22px); text-align: center; }
.sp-ben-lista li + li { border-left: 1px solid #DDE1EC; }
.sp-ben-lista h3 { margin: 4px 0 0; font: 700 1rem/1.2 "Sora", var(--font-display); color: #12307F; }
.sp-ben-lista p { margin: 0; font-size: .875rem; line-height: 1.45; color: #3A3355; }

/* conversa */
.sp-conversa { padding-block: clamp(20px, 3vw, 40px) clamp(56px, 6vw, 96px); scroll-margin-top: 20px; }
.sp-conv-caixa { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); border-radius: 24px; overflow: hidden; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 24px 50px -30px rgba(26,18,55,.4); }
.sp-conv-painel { position: relative; overflow: hidden; padding: clamp(28px, 3.4vw, 48px); background: #12307F; color: #fff; display: flex; flex-direction: column; justify-content: center; }
.sp-conv-ic { width: 64px; height: 64px; margin-bottom: 20px; color: var(--brand-lime); }
.sp-conv-ic svg { width: 100%; height: 100%; }
.sp-conv-painel h2 { color: #fff !important; font-size: clamp(2rem, 1.2rem + 2vw, 2.8rem) !important; line-height: 1.05 !important; }
.sp-conv-painel h2 span { display: block; color: var(--brand-lime); }
.sp-conv-painel p { position: relative; z-index: 1; margin: 18px 0 0; font-size: 1rem; line-height: 1.55; color: rgba(255,255,255,.88); }
.sp-conv-faixa { position: absolute; left: -20%; bottom: -55%; width: 120%; aspect-ratio: 1; border-radius: 50%; border: 30px solid var(--brand-lime); clip-path: inset(0 0 60% 0); transform: rotate(-12deg); }
.sp-form { padding: clamp(22px, 2.6vw, 36px); display: grid; gap: 16px; }
.sp-linha { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.sp-inteira { grid-column: 1 / -1; }
.sp-form label { display: flex; flex-wrap: wrap; align-content: start; gap: 6px 4px; font: 600 .875rem/1.3 "DM Sans", var(--font-text); color: var(--brand-ink); }
.sp-form label > :is(input:not([type=checkbox]), textarea) { flex: 0 0 100%; }
.sp-form b { color: #D33B3B; }
.sp-form input:not([type=checkbox]), .sp-form textarea { width: 100%; min-height: 44px; padding: 10px 16px; border: 1.5px solid #DEE1EC; border-radius: 999px; background: #fff; font: 400 .9375rem/1.4 "DM Sans", var(--font-text); color: var(--brand-ink); }
.sp-form textarea { border-radius: 14px; resize: vertical; min-height: 84px; }
.sp-form :is(input, textarea):focus { outline: none; border-color: #12307F; box-shadow: 0 0 0 3px rgba(18,48,127,.15); }
.sp-form ::placeholder { color: #9A96AE; }
.sp-tipos-campo { margin: 0; padding: 0; border: 0; display: grid; gap: 8px; }
.sp-tipos-campo legend { margin-bottom: 8px; padding: 0; font: 600 .875rem/1.3 "DM Sans", var(--font-text); color: var(--brand-ink); }
.sp-tipos-campo label, .sp-aceite { flex-wrap: nowrap !important; align-items: flex-start; gap: 10px !important; font-weight: 400 !important; color: #3A3355 !important; }
.sp-form input[type=checkbox] { flex: 0 0 18px; width: 18px; height: 18px; margin: 1px 0 0; accent-color: #12307F; }
.sp-aceite a { color: #12307F; }
.sp-erro :is(input, textarea) { border-color: #D33B3B !important; }
.sp-erro, .sp-erro span, .sp-erro legend { color: #D33B3B !important; }
.sp-acoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px 18px; }
.sp-status { margin: 0; color: #D33B3B; font-size: .9375rem; }
#sp-ok .sp-btn { background: var(--brand-lime); }

@media (prefers-reduced-motion: no-preference) {
  .js-reveal :is(.sp-tipos, .sp-ben-lista):not(.in) li { opacity: 0; transform: translateY(24px); }
  .js-reveal :is(.sp-tipos, .sp-ben-lista) li { transition: opacity .6s ease, transform .8s cubic-bezier(.16,1,.3,1), box-shadow .45s; }
  .js-reveal :is(.sp-tipos, .sp-ben-lista) li:nth-child(2) { transition-delay: .08s; } .js-reveal :is(.sp-tipos, .sp-ben-lista) li:nth-child(3) { transition-delay: .16s; }
  .js-reveal .sp-ben-lista li:nth-child(4) { transition-delay: .24s; } .js-reveal .sp-ben-lista li:nth-child(5) { transition-delay: .32s; }
  :is(.sp-tipos, .sp-ben-lista).feito li { transition-delay: 0s !important; }
  .sp-faixa { animation: sp-faixa 2s cubic-bezier(.16,1,.3,1) .3s both; }
  @keyframes sp-faixa { from { transform: rotate(-60deg); opacity: 0; } }
}
@media (max-width: 1023.98px) {
  .sp-topo-foto { position: relative; inset: auto; height: 260px; margin-bottom: 0; order: 2; }
  .sp-topo { display: flex; flex-direction: column; padding-bottom: 0; }
  .sp-hero { order: 1; padding-bottom: 28px; }
  .sp-tipos { grid-template-columns: 1fr; }
  .sp-ben-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 0; }
  .sp-ben-lista li + li { border-left: 0; }
  .sp-conv-caixa { grid-template-columns: 1fr; }
}
@media (max-width: 599.98px) {
  .sp-linha { grid-template-columns: 1fr; }
  .sp-ben-lista { grid-template-columns: 1fr; }
  .sp-btn { width: 100%; }
}
/* cabeçalho claro sobre a abertura azul */
.masthead:has(.sp-topo) { background: #0F2A6B; }
.masthead:has(.sp-topo) .site-header .brand { color: #fff; }
.masthead:has(.sp-topo) .menu-toggle { background: var(--brand-lime); color: var(--brand-ink); }
@media (min-width: 1180px) {
  .masthead:has(.sp-topo) .nav-list > li > a, .masthead:has(.sp-topo) .nav-sub-btn { color: rgba(255,255,255,.9); }
  .masthead:has(.sp-topo) .site-header .nav-list > li > a:hover, .masthead:has(.sp-topo) .site-header .nav-sub-btn:hover, .masthead:has(.sp-topo) .site-header .nav-sub-btn[aria-expanded="true"] { background-color: rgba(203,231,0,.16); color: var(--brand-lime); }
  .masthead:has(.sp-topo) .nav-actions .btn--light { background: var(--brand-lime); color: var(--brand-ink); }
  .masthead:has(.sp-topo) .nav-actions .btn--ink { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5); }
}
.sp-topo-foto::after { z-index: 2; }
.sp-form label i { font-style: normal; font-weight: 400; color: #6B6585; }
/* foto da parceria: lado direito, fundindo no azul pela esquerda */
.sp-topo-foto { background: #0F2A6B; }
.sp-topo-foto picture { position: absolute; inset: 0; }
.sp-topo-foto img { object-position: 70% 30%; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%); mask-image: linear-gradient(90deg, transparent 0%, #000 34%); }
.sp-faixa { z-index: 2; }
@media (max-width: 1023.98px) { .sp-topo-foto { height: 300px; } .sp-topo-foto img { object-position: 60% 25%; -webkit-mask-image: linear-gradient(transparent 0%, #000 22%); mask-image: linear-gradient(transparent 0%, #000 22%); } }
/* menu legível sobre a foto clara; arco verde fora do rosto */
.sp-topo-foto picture::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,42,107,.92) 0%, rgba(15,42,107,.55) 16%, rgba(15,42,107,0) 34%), linear-gradient(90deg, rgba(15,42,107,.35), rgba(15,42,107,0) 60%); }
.sp-faixa { left: -24%; bottom: -46%; width: 52%; }
@media (max-width: 1023.98px) { .sp-topo-foto picture::after { background: linear-gradient(180deg, #0F2A6B 0%, rgba(15,42,107,0) 30%); } .sp-faixa { left: -30%; bottom: -70%; width: 80%; } }
/* foto recortada, sem fundo, menor e apoiada na base da abertura, com o arco verde atrás (como no mockup) */
.sp-topo { background: radial-gradient(circle at 75% 40%, #1F3F95 0%, #0F2A6B 60%); }
.sp-topo-foto { inset: auto 0 0 auto; width: 56%; height: 100%; background: none !important; display: block; }
.sp-topo-foto picture { inset: auto 0 0 0; height: auto; }
.sp-topo-foto picture::after { display: none; }
.sp-topo-foto img { position: relative !important; display: block; width: 100%; height: auto; max-height: 92%; object-fit: contain; object-position: right bottom; -webkit-mask-image: none !important; mask-image: none !important; z-index: 1; }
.sp-topo-foto picture { position: absolute; bottom: 0; right: 0; display: flex; align-items: flex-end; justify-content: flex-end; z-index: 1; }
.sp-faixa { z-index: 0 !important; left: 4%; bottom: -55%; width: 90%; }
@media (min-width: 1180px) { .sp-topo-foto { width: calc(760 * var(--u)); } }
@media (max-width: 1023.98px) {
  .sp-topo-foto { position: relative; width: 100%; height: auto; aspect-ratio: 3 / 2; }
  .sp-topo-foto picture { inset: 0; }
  .sp-topo-foto img { max-height: none; }
  .sp-faixa { left: -10%; bottom: -80%; width: 110%; }
}
@media (min-width: 1024px) { .sp-faixa { left: 10% !important; bottom: -38% !important; width: 95% !important; } }
@media (min-width: 1180px) { .sp-topo-foto { width: calc(880 * var(--u)); } .sp-topo-foto img { max-height: 100%; } }
.sp-topo h1 { font-size: clamp(1.9rem, 1rem + 2.3vw, 3rem) !important; }
/* linha da marca (laço) atrás da foto, no lugar do arco (07/11) */
.sp-faixa { display: none !important; }
.sp-laco { position: absolute; z-index: 0; left: -8%; top: 4%; width: 112%; height: auto; overflow: visible; pointer-events: none; }
.sp-laco path { fill: none; stroke: var(--brand-lime); stroke-width: 34; stroke-linecap: butt; stroke-dasharray: 1; stroke-dashoffset: 0; }
@media (prefers-reduced-motion: no-preference) {
  .sp-laco path { animation: sp-linha 3.4s cubic-bezier(.22,1,.36,1) .8s both; }
  @keyframes sp-linha { from { stroke-dashoffset: 1; } }
}
@media (max-width: 1023.98px) { .sp-laco { left: -10%; top: 0; width: 120%; } }

/* por que + tipos numa seção só (07/11) */
.sp-porque { padding-block: clamp(32px, 4vw, 56px) clamp(16px, 2vw, 28px); }
.sp-porque .sp-tipos-caixa { padding: clamp(28px, 3vw, 44px) clamp(20px, 2.6vw, 36px) clamp(20px, 2.6vw, 36px); }
.sp-porque .sp-traco { margin: 12px 0 14px; }
.sp-porque .sp-centro p { max-width: 52rem; }
.sp-porque .sp-tipos { margin-top: clamp(22px, 2.4vw, 32px); }
.sp-porque .sp-tipo { gap: 12px; padding: clamp(18px, 1.8vw, 24px); }
.sp-porque .sp-pill { white-space: nowrap; font-size: .8125rem; padding: 0 16px; min-height: 40px; }
@media (max-width: 1023.98px) { .sp-porque .sp-pill { white-space: normal; } }

/* formulário parceiro mais compacto (07/11) */
.sp-form { gap: 12px; padding: clamp(20px, 2.2vw, 30px); }
.sp-linha { gap: 10px 16px; }
.sp-form label, .sp-tipos-campo legend { font-size: .8125rem; gap: 4px 4px; }
.sp-form input:not([type=checkbox]), .sp-form textarea { min-height: 38px; padding: 7px 14px; font-size: .875rem; border-width: 1.25px; }
.sp-form textarea { min-height: 70px; border-radius: 12px; }
.sp-tipos-campo { gap: 6px; }
.sp-tipos-campo legend { margin-bottom: 6px; }
.sp-tipos-campo label, .sp-aceite { font-size: .8125rem !important; gap: 8px !important; }
.sp-form input[type=checkbox] { flex: 0 0 16px; width: 16px; height: 16px; }
.sp-conv-ic { width: 52px; height: 52px; margin-bottom: 14px; }
.sp-conv-painel h2 { font-size: clamp(1.8rem, 1.1rem + 1.6vw, 2.4rem) !important; }
.sp-conv-painel p { font-size: .9375rem; }

/* boas práticas das outras páginas aplicadas em Seja parceiro e Trabalhe conosco (07/11) */
.pagina:has(:is(.sp-topo, .tc-topo)) :is(h1, h2, h3) { text-wrap: balance; }
.sp-lede, .tc-lede, .sp-tipo p, .sp-conv-painel p, .tc-porque p, .tc-ok-caixa p {
  text-align: justify; text-align-last: left; text-justify: inter-word; hyphens: manual; -webkit-hyphens: manual; }
.sp-porque .sp-centro p { text-align: justify; text-align-last: center; text-justify: inter-word; hyphens: manual; -webkit-hyphens: manual; }
.sp-ben-lista p, .tc-numeros li { text-wrap: pretty; }
@media (max-width: 599.98px) {
  .sp-lede, .tc-lede, .sp-tipo p, .sp-conv-painel p, .tc-porque p, .sp-porque .sp-centro p {
    hyphens: auto; -webkit-hyphens: auto; hyphenate-limit-chars: 12 5 5; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 5; }
}
/* cards estreitos: justificado abria buracos entre palavras; alinhado à esquerda com quebra equilibrada */
.sp-tipo p, .tc-porque p { text-align: left; text-wrap: pretty; }
@media (max-width: 599.98px) { .sp-porque .sp-centro p { text-align: center; text-wrap: pretty; } }

/* ===== Seja parceiro: efeitos de rolagem (07/11) =====
   1. foto do topo abre de um card arredondado até a borda; caixas "Por que" e "Vamos conversar" abrem até a borda na rolagem
   2. benefícios sobem em alturas diferentes (onda)
   3. cards de tipos de parceria entram um depois do outro */
.pagina:has(.sp-topo) { overflow-x: clip; }
.pagina:has(.sp-topo) { --sp-g: var(--gutter, 20px); }
@media (min-width: 1024px) { .pagina:has(.sp-topo) { --sp-g: calc(75 * var(--u) + max(0px, (100vw - 1440 * var(--u)) / 2)); } }

@media (prefers-reduced-motion: no-preference) {
  /* 1a. foto do topo: abre ao carregar */
  .sp-topo-foto picture { animation: sp-foto-abre 2.8s cubic-bezier(.22,1,.36,1) .2s both; transform-origin: 60% 60%; }
  @keyframes sp-foto-abre { from { clip-path: inset(10% 8% 10% 8% round 36px); scale: 1.08; } to { clip-path: inset(0 0 0 0 round 0); scale: 1; } }
}

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    /* 1b. caixas abrem até a borda: a caixa ocupa a largura toda e o recorte vai do tamanho do container até a borda */
    .sp-porque .sp-tipos-caixa, .sp-conv-caixa {
      margin-inline: calc(-1 * var(--sp-g));
      animation: sp-abre linear both; animation-timeline: view(); animation-range: entry 10% cover 50%; }
    .sp-porque .sp-tipos-caixa { padding-inline: calc(var(--sp-g) + clamp(20px, 2.6vw, 36px)); }
    .sp-porque .sp-tipos-caixa, .sp-conv-caixa { border-radius: 0; }
    .sp-conv-caixa { padding-inline: var(--sp-g); background: linear-gradient(90deg, #12307F calc(var(--sp-g) + 2px), #fff 0); box-shadow: none; }
    @media (max-width: 1023.98px) { .sp-conv-caixa { margin-inline: 0; padding-inline: 0; background: #fff; border-radius: 24px; animation: none; } }
    @keyframes sp-abre { from { clip-path: inset(0 var(--sp-g) round 28px); } to { clip-path: inset(0 0 round 0); } }

    /* 3. tipos de parceria: um depois do outro */
    .js-reveal .sp-porque .sp-tipos li { opacity: 1; transform: none; transition: box-shadow .45s; }
    .sp-porque .sp-tipos li { animation: sp-entra linear both; animation-timeline: view(); }
    .sp-porque .sp-tipos li:nth-child(1) { animation-range: entry 0% entry 70%; }
    .sp-porque .sp-tipos li:nth-child(2) { animation-range: entry 15% entry 85%; }
    .sp-porque .sp-tipos li:nth-child(3) { animation-range: entry 30% entry 100%; }
    @keyframes sp-entra { from { opacity: 0; translate: 0 90px; } to { opacity: 1; translate: 0 0; } }

    /* 2. benefícios em onda */
    @media (min-width: 768px) {
      .js-reveal .sp-ben-lista li { opacity: 1; transform: none; transition: none; }
      .sp-ben-lista { view-timeline: --sp-ben; }
      .sp-ben-lista li { animation: sp-onda linear both; animation-timeline: --sp-ben; animation-range: entry 0% cover 60%; }
      .sp-ben-lista li:nth-child(1), .sp-ben-lista li:nth-child(5) { --o: 110px; }
      .sp-ben-lista li:nth-child(2), .sp-ben-lista li:nth-child(4) { --o: 70px; }
      .sp-ben-lista li:nth-child(3) { --o: 30px; }
      @keyframes sp-onda { from { opacity: 0; translate: 0 var(--o); } 60% { opacity: 1; } to { opacity: 1; translate: 0 0; } }
    }
  }
}

/* lede do topo: coluna estreita, justificado abria buracos */
.sp-lede, .tc-lede { text-align: left; text-wrap: pretty; }
/* sombra suave nas pessoas do topo, efeito 3D leve (07/11) */
.sp-topo-foto img { filter: drop-shadow(-14px 18px 22px rgba(4, 14, 44, .32)) drop-shadow(0 2px 4px rgba(4, 14, 44, .18)); }

/* sombra entre as seções, efeito de camadas 3D leve (07/11) */
.pagina:has(.sp-topo) > section:not(.sp-topo) { position: relative; background: #F6F7FB; }
.sp-porque { z-index: 2; margin-top: -36px; border-radius: 36px 36px 0 0; box-shadow: 0 -18px 36px -18px rgba(4, 14, 44, .35); }
.sp-ben { z-index: 3; box-shadow: 0 -16px 32px -22px rgba(4, 14, 44, .22); }
.sp-conversa { z-index: 4; box-shadow: 0 -16px 32px -22px rgba(4, 14, 44, .22); }
.sp-topo { z-index: 1; }
@media (max-width: 767.98px) { .sp-porque { margin-top: -24px; border-radius: 24px 24px 0 0; } }
/* sombra entre seções mais suave e sem cantos arredondados (07/11) */
.sp-porque { margin-top: 0; border-radius: 0; box-shadow: 0 -10px 24px -14px rgba(4, 14, 44, .22); }
.sp-ben, .sp-conversa { box-shadow: 0 -10px 24px -18px rgba(4, 14, 44, .14); }
@media (max-width: 767.98px) { .sp-porque { margin-top: 0; border-radius: 0; } }

/* ===== Páginas legais: Política de Privacidade e Política de Cookies (07/11) ===== */
.pagina:has(.lg-topo) { background: #F6F7FB; }
.masthead:has(.lg-topo) { background: #EEF1FA; }
.masthead:has(.lg-topo) .sheen { display: none; }
@media (min-width: 1024px) {
  .pagina:has(.lg-topo) > section > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
.lg-topo { padding-block: clamp(36px, 5vw, 72px) clamp(28px, 3vw, 44px); background: #EEF1FA; border-bottom: 1px solid #E1E4EE; }
.lg-cab { display: grid; gap: 14px; }
.lg-meta { margin: 0; font: 600 .8125rem/1.2 "DM Sans", var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: #5A5478; }
.lg-topo h1 { margin: 0; font: 700 clamp(2rem, 1.2rem + 2.4vw, 3.25rem)/1.06 "Sora", var(--font-display); letter-spacing: -.03em; color: #12307F; text-wrap: balance; }
.lg-lede { margin: 0; max-width: 46rem; font-size: clamp(1rem, .95rem + .3vw, 1.175rem); line-height: 1.6; color: #3A3355; text-wrap: pretty; }
.lg-btn { min-height: 44px; padding: 0 22px; border: 1.5px solid #12307F; border-radius: 999px; background: #fff; color: #12307F; font: 700 .875rem/1 "DM Sans", var(--font-text); cursor: pointer; transition: background .2s, color .2s; }
.lg-btn:hover { background: #12307F; color: #fff; }
.lg-link { padding: 0; border: 0; background: none; color: #12307F; font: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }

.lg-corpo { padding-block: clamp(36px, 4vw, 64px) clamp(56px, 6vw, 96px); }
.lg-grade { display: grid; grid-template-columns: minmax(200px, 260px) minmax(0, 760px); gap: clamp(32px, 5vw, 80px); align-items: start; }
.lg-sumario { position: sticky; top: 96px; padding: 20px 22px; border-radius: 18px; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 14px 32px -22px rgba(26,18,55,.3); }
.lg-sumario > p { margin: 0 0 10px; font: 700 .8125rem/1.2 "DM Sans", var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: #5A5478; }
.lg-sumario ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.lg-sumario a { display: block; padding: 6px 10px; border-radius: 10px; font-size: .875rem; line-height: 1.35; color: #3A3355; text-decoration: none; }
.lg-sumario a:hover { background: #EEF4C9; color: var(--brand-ink); }

.lg-texto { font-size: 1rem; line-height: 1.7; color: #3A3355; }
.lg-texto h2 { margin: 40px 0 12px; scroll-margin-top: 100px; font: 700 clamp(1.25rem, 1.05rem + .6vw, 1.5rem)/1.25 "Sora", var(--font-display); letter-spacing: -.015em; color: #12307F; text-wrap: balance; }
.lg-texto h2:first-child, .lg-texto > p:first-child + h2 { margin-top: 0; }
.lg-texto > p:first-child { margin-top: 0; }
.lg-texto p, .lg-texto li { text-wrap: pretty; }
.lg-texto p { margin: 0 0 14px; }
.lg-texto ul, .lg-texto ol { margin: 0 0 16px; padding-left: 1.25rem; display: grid; gap: 6px; }
.lg-texto li::marker { color: #12307F; }
.lg-texto ol.lg-letras { list-style: upper-alpha; }
.lg-texto strong { color: var(--brand-ink); }
.lg-texto a { color: #12307F; text-underline-offset: 2px; }
.lg-texto code { padding: 2px 6px; border-radius: 6px; background: #EEF1FA; font-size: .875em; color: var(--brand-ink); }
.lg-links { list-style: none; padding: 0 !important; display: flex !important; flex-wrap: wrap; gap: 8px 10px !important; }
.lg-links a { display: inline-block; padding: 8px 14px; border-radius: 999px; background: #fff; border: 1px solid #DEE1EC; text-decoration: none; font-weight: 600; font-size: .875rem; }
.lg-links a:hover { border-color: #12307F; }

.lg-tabela { margin: 6px 0 18px; overflow-x: auto; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05), 0 14px 32px -24px rgba(26,18,55,.3); }
.lg-tabela table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .875rem; line-height: 1.5; }
.lg-tabela th { padding: 12px 16px; background: #12307F; color: #fff; text-align: left; font: 700 .8125rem/1.3 "DM Sans", var(--font-text); }
.lg-tabela td { padding: 12px 16px; border-top: 1px solid #E8EAF2; vertical-align: top; }
.lg-tabela td:first-child { font-weight: 600; color: var(--brand-ink); }

.lg-dpo { display: grid; gap: 4px; margin-top: 8px; padding: 22px 24px; border-radius: 18px; background: #12307F; color: rgba(255,255,255,.9); }
.lg-dpo p { margin: 0; }
.lg-dpo a { color: var(--brand-lime); font-weight: 700; }
.lg-dpo-nome { font: 700 1.125rem/1.3 "Sora", var(--font-display); color: #fff; }
.lg-dpo-end { margin-top: 8px !important; font-size: .8125rem; line-height: 1.5; color: rgba(255,255,255,.7); }

@media (max-width: 1023.98px) {
  .lg-grade { grid-template-columns: 1fr; }
  .lg-sumario { position: static; }
  .lg-sumario ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599.98px) { .lg-sumario ol { grid-template-columns: 1fr; } }

/* rodapé: botão de preferências com cara de link */
.site-footer .ck-rodape { padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.site-footer .ck-rodape:hover { text-decoration: underline; }
@media (min-width: 1180px) { .lg-topo { padding-top: calc(190 * var(--u)); } }
.lg-topo h1 { max-width: none; }
.site-footer .ck-rodape { display: inline-flex; min-height: 32px; align-items: center; }
.footer-legal a { color: inherit; }
/* mensagens de validação dos formulários (07/11) */
.campo-msg { flex: 0 0 100%; display: block; margin-top: 2px; font: 500 .75rem/1.35 "DM Sans", var(--font-text); color: #C23030; }
form [aria-invalid="true"] { border-color: #D33B3B !important; }

/* ===== Educação Digital: landing page de campanha (08/11) ===== */
.pagina:has(.ed-topo) { background: #fff; overflow-x: clip; --ed-roxo: #1A1237; --ed-azul: #1645BB; --ed-lav: #F1EEFB; }
.masthead:has(.ed-topo) { background: var(--brand-ink); }
.masthead:has(.ed-topo) > .sheen { display: none; }
.masthead:has(.ed-topo) .site-header .brand { color: #fff; cursor: default; }
.masthead:has(.ed-topo) .site-header .container { justify-content: space-between; }
.masthead:has(.ed-topo) .site-footer nav[aria-label="Institucional"] { display: none; }
@media (min-width: 1024px) {
  .pagina:has(.ed-topo) > section > .container { max-width: calc(1440 * var(--u)); padding-left: calc(75 * var(--u)); padding-right: calc(75 * var(--u)); }
}
.pagina:has(.ed-topo) h2 { margin: 0; font: 700 clamp(1.75rem, 1.1rem + 1.9vw, 2.75rem)/1.1 "Sora", var(--font-display); letter-spacing: -.03em; color: var(--brand-ink); text-wrap: balance; }
.pagina:has(.ed-topo) mark { background: none; color: inherit; box-shadow: inset 0 -.42em 0 var(--brand-lime); padding: 0 .08em; }

/* botões */
.ed-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; border: 0; border-radius: 999px; background: var(--brand-lime); color: var(--brand-ink); font: 700 1rem/1.1 "DM Sans", var(--font-text); text-decoration: none; cursor: pointer; transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, background .2s; box-shadow: 0 10px 24px -12px rgba(203,231,0,.7); }
.ed-btn:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -12px rgba(203,231,0,.85); }
.ed-btn svg { width: 22px; height: 22px; flex: none; }
.ed-btn--escuro { background: var(--brand-ink); color: #fff; box-shadow: 0 12px 26px -14px rgba(26,18,55,.7); }
.ed-btn--escuro:hover { background: var(--ed-azul); box-shadow: 0 16px 30px -14px rgba(22,69,187,.7); }
.ed-btn--g { min-height: 60px; padding: 0 34px; font-size: 1.0625rem; }
.ed-btn--hd { min-height: 44px; padding: 0 20px; font-size: .9375rem; }
.ed-btn:focus-visible, .ed-link:focus-visible, .ed-video-capa:focus-visible, .ed-faq summary:focus-visible { outline: 3px solid var(--brand-lime); outline-offset: 3px; }

/* topo */
.ed-topo { position: relative; overflow: clip; background: radial-gradient(90% 70% at 85% 30%, #2C1F66 0%, var(--brand-ink) 60%); color: #fff; padding: 28px 0 clamp(48px, 5vw, 80px); }
@media (min-width: 1180px) { .ed-topo { padding-top: calc(190 * var(--u)); } }
.ed-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.ed-selo { display: inline-flex; gap: 8px; align-items: center; margin: 0 0 22px; padding: 7px 14px; border-radius: 999px; background: rgba(203,231,0,.14); color: var(--brand-lime); font: 600 .8125rem/1 "DM Sans", var(--font-text); letter-spacing: .02em; }
.ed-selo i, .ed-mini i { font-style: normal; opacity: .6; }
.ed-topo h1 { max-width: none; margin: 0 0 22px; font: 800 clamp(2.4rem, 1.2rem + 3.7vw, 4.4rem)/1.02 "Sora", var(--font-display); letter-spacing: -.045em; color: #fff; }
.ed-topo h1 .ln { display: block; }
.ed-lima { color: var(--brand-lime); }
.ed-topo h1 em { font-style: normal; color: var(--brand-lime); }
.ed-lede { margin: 0 0 28px; max-width: 34rem; font-size: clamp(1.05rem, .95rem + .35vw, 1.25rem); line-height: 1.55; color: rgba(255,255,255,.86); text-wrap: pretty; }
.ed-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.ed-link { display: inline-flex; align-items: center; gap: 10px; color: #fff; font: 600 .9375rem/1 "DM Sans", var(--font-text); text-decoration: none; }
.ed-link span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.5); transition: background .2s, color .2s, border-color .2s; }
.ed-link svg { width: 15px; height: 15px; margin-left: 2px; }
.ed-link:hover span { background: #fff; color: var(--brand-ink); border-color: #fff; }
.ed-mini { margin: 22px 0 0; font-size: .875rem; color: rgba(255,255,255,.7); display: flex; gap: 8px; flex-wrap: wrap; }

/* arte do topo: tela de blocos + protótipo */
.ed-hero-arte { position: relative; min-height: 420px; }
.ed-laco { position: absolute; z-index: 0; left: -14%; top: 6%; width: 70%; height: auto; overflow: visible; opacity: .9; }
.ed-laco path { fill: none; stroke: var(--brand-lime); stroke-width: 26; stroke-dasharray: 1; stroke-dashoffset: 0; }
.ed-tela { position: relative; z-index: 1; margin-left: 10%; border-radius: 18px; background: #fff; box-shadow: 0 40px 80px -30px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.1); overflow: hidden; transform: perspective(1400px) rotateY(-8deg) rotateX(3deg); }
.ed-tela-barra { display: flex; align-items: center; gap: 6px; padding: 12px 16px; background: #EEF0F8; border-bottom: 1px solid #E1E4EE; }
.ed-tela-barra i { width: 10px; height: 10px; border-radius: 50%; background: #F47C7C; }
.ed-tela-barra i:nth-child(2) { background: #F4C552; } .ed-tela-barra i:nth-child(3) { background: #7FD08A; }
.ed-tela-barra span { margin-left: 10px; font: 600 .75rem/1 "DM Sans", var(--font-text); color: #5A5478; }
.ed-tela-corpo { display: grid; grid-template-columns: 54px 1fr; min-height: 300px; }
.ed-paleta { display: grid; align-content: start; gap: 10px; padding: 18px 12px; background: #F6F7FB; border-right: 1px solid #E8EAF2; }
.ed-paleta b { display: block; height: 22px; border-radius: 6px; }
.c1 { background: #F7A33B; } .c2 { background: #4C97FF; } .c3 { background: #9966FF; } .c4 { background: #59C059; } .c5 { background: #FF6680; } .c6 { background: #CBE700; }
.ed-blocos { display: grid; align-content: start; gap: 6px; padding: 24px clamp(16px, 2vw, 28px); background-image: radial-gradient(#E4E7F0 1px, transparent 1px); background-size: 18px 18px; }
.ed-bloco { display: inline-flex; align-items: center; gap: 10px; justify-self: start; min-height: 46px; padding: 0 18px; border-radius: 10px; color: #fff; font: 700 clamp(.85rem, .75rem + .3vw, 1.05rem)/1 "DM Sans", var(--font-text); box-shadow: 0 3px 0 rgba(0,0,0,.18); }
.ed-bloco svg { width: 18px; height: 18px; }
.ed-bloco em { font-style: normal; font-weight: 600; padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,.25); font-size: .8em; }
.b-evento { background: #F7A33B; border-radius: 18px 10px 10px 10px; }
.b-repita { background: #FFAB19; }
.b-se { background: #4C97FF; }
.b-acao { background: #9966FF; }
.b-acao2 { background: #FF6680; }
.ed-dentro { margin-left: 22px; } .ed-dentro2 { margin-left: 44px; }
.ed-prot { position: absolute; z-index: 2; left: 0; bottom: -6px; width: 42%; margin: 0; border-radius: 16px; overflow: hidden; border: 4px solid #fff; box-shadow: 0 24px 50px -20px rgba(0,0,0,.6); transform: rotate(-3deg); }
.ed-prot img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.ed-prot figcaption { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: rgba(26,18,55,.85); font: 600 .6875rem/1 "DM Sans", var(--font-text); color: #fff; }
.ed-prot figcaption i { width: 7px; height: 7px; border-radius: 50%; background: #59C059; box-shadow: 0 0 0 3px rgba(89,192,89,.3); }
@media (prefers-reduced-motion: no-preference) {
  .ed-laco path { animation: ed-laco 2.6s cubic-bezier(.22,1,.36,1) .3s both; }
  @keyframes ed-laco { from { stroke-dashoffset: 1; } }
  .ed-bloco { animation: ed-bloco .7s cubic-bezier(.2,1.4,.4,1) both; }
  .ed-bloco:nth-child(1) { animation-delay: .5s; } .ed-bloco:nth-child(2) { animation-delay: .8s; } .ed-bloco:nth-child(3) { animation-delay: 1.1s; } .ed-bloco:nth-child(4) { animation-delay: 1.4s; } .ed-bloco:nth-child(5) { animation-delay: 1.7s; }
  @keyframes ed-bloco { from { opacity: 0; transform: translate(-40px, -14px) rotate(-4deg); } }
  .b-acao svg { animation: ed-som 1.6s ease-in-out 2.4s infinite; }
  @keyframes ed-som { 50% { transform: scale(1.25); } }
  .ed-prot { animation: ed-prot 1s cubic-bezier(.16,1,.3,1) 1.9s both; }
  @keyframes ed-prot { from { opacity: 0; transform: translateY(30px) rotate(-8deg); } }
}

/* benefícios */
.ed-beneficios { background: var(--ed-lav); border-bottom: 1px solid #E3DEF5; }
.ed-beneficios ul { list-style: none; margin: 0 auto; padding-top: 22px; padding-bottom: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 24px; }
.ed-beneficios li { display: flex; align-items: center; justify-content: center; gap: 12px; font: 700 1rem/1.25 "DM Sans", var(--font-text); color: var(--brand-ink); }
.ed-beneficios li + li { border-left: 1px solid #DCD5F2; }
.ed-check { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 50%; background: var(--brand-lime); }
.ed-check svg { width: 18px; height: 18px; fill: none; stroke: var(--brand-ink); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }

/* diferencial + vídeos */
.ed-dif { padding-block: clamp(56px, 6vw, 96px) clamp(36px, 4vw, 56px); }
.ed-dif-grade { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 2fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.ed-dif-txt p { margin: 18px 0 0; font-size: 1.0625rem; line-height: 1.6; color: #3A3355; }
.ed-dif-txt .ed-forte { font-weight: 700; color: var(--brand-ink); }
.ed-videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.ed-video h3 { margin: 16px 0 4px; font: 700 1.25rem/1.2 "Sora", var(--font-display); color: var(--brand-ink); }
.ed-video p { margin: 0; font-size: .9375rem; color: #4A4366; }
.ed-video-capa, .ed-video-frame { position: relative; display: block; width: 100%; aspect-ratio: 16/10; padding: 0; border: 0; border-radius: 18px; overflow: hidden; background: #2f2848; cursor: pointer; }
.ed-video-capa img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.ed-video-capa::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26,18,55,0) 40%, rgba(26,18,55,.45)); }
.ed-video-capa:hover img { transform: scale(1.05); }
.ed-play { position: absolute; z-index: 1; left: 50%; top: 50%; display: grid; place-items: center; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%; background: rgba(255,255,255,.95); color: var(--brand-ink); box-shadow: 0 0 0 10px rgba(255,255,255,.25); transition: transform .3s cubic-bezier(.16,1,.3,1), background .2s; }
.ed-play svg { width: 30px; height: 30px; margin-left: 4px; }
.ed-video-capa:hover .ed-play { transform: scale(1.1); background: var(--brand-lime); }
.ed-temas { display: grid; gap: 18px; margin-top: 30px; }
.ed-nota { margin: 0; font-size: .8125rem; font-style: italic; color: #6B6585; text-align: center; }
.ed-temas ul { list-style: none; margin: 0; padding: 18px 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 36px; border-top: 1px solid #E8EAF2; }
.ed-temas li { display: inline-flex; align-items: center; gap: 10px; font: 600 .9375rem/1.2 "DM Sans", var(--font-text); color: var(--brand-ink); }
.ed-temas svg { width: 22px; height: 22px; fill: none; stroke: var(--ed-azul); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* eixos */
.ed-eixos { background: var(--ed-azul); color: #fff; padding-block: clamp(52px, 5.5vw, 88px); }
.ed-eixos-grade { display: grid; grid-template-columns: minmax(0, 1.15fr) repeat(3, minmax(0, 1fr)); gap: 28px; align-items: start; }
.pagina .ed-eixos h2 { color: #fff; }
.ed-eixos h2 span { color: var(--brand-lime); }
.ed-eixo { padding-left: 24px; border-left: 1px solid rgba(255,255,255,.25); }
.ed-eixo-ic { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 14px; border-radius: 14px; background: rgba(203,231,0,.16); }
.ed-eixo-ic svg { width: 26px; height: 26px; fill: none; stroke: var(--brand-lime); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ed-eixo h3 { margin: 0 0 8px; font: 700 1.2rem/1.2 "Sora", var(--font-display); color: #fff; }
.ed-eixo p { margin: 0; font-size: .9375rem; line-height: 1.5; color: rgba(255,255,255,.85); }
.ed-passos { list-style: none; margin: 40px 0 0; padding: 14px 20px; display: flex; justify-content: space-between; gap: 10px; border: 1.5px solid rgba(255,255,255,.4); border-radius: 999px; counter-reset: p; }
.ed-passos li { flex: 1; display: flex; align-items: center; justify-content: center; gap: 12px; font: 700 1rem/1.2 "Sora", var(--font-display); color: #fff; }
.ed-passos li + li::before { content: "→"; margin-right: auto; padding-right: 12px; color: var(--brand-lime); font-weight: 400; }
.ed-eixos-leg { margin: 14px 0 0; text-align: center; font-size: .8125rem; font-style: italic; color: rgba(255,255,255,.75); }

/* jornada + livros */
.ed-jornada { background: var(--ed-lav); padding-block: clamp(56px, 6vw, 96px); }
.ed-jornada-cab { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 48px; align-items: end; margin-bottom: clamp(32px, 3.5vw, 52px); }
.ed-jornada-cab p { margin: 0; font-size: 1.0625rem; line-height: 1.6; color: #3A3355; }
.ed-livros { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); }
.ed-livros li { display: grid; justify-items: start; }
.ed-livros img { width: min(240px, 78%); height: auto; aspect-ratio: 3/4; object-fit: cover; border-radius: 14px; box-shadow: 18px 22px 40px -22px rgba(26,18,55,.55), 0 0 0 1px rgba(26,18,55,.06); transform: rotate(-2deg); transition: transform .5s cubic-bezier(.16,1,.3,1); margin-bottom: 22px; }
.ed-livros li:nth-child(2) img { transform: rotate(1.5deg); }
.ed-livros li:hover img { transform: rotate(0) translateY(-6px); }
.ed-etapa { display: inline-block; padding: 5px 12px; border-radius: 999px; background: var(--brand-lime); font: 700 .8125rem/1 "DM Sans", var(--font-text); color: var(--brand-ink); }
.ed-livros strong { margin: 10px 0 6px; font: 700 1.4rem/1.1 "Sora", var(--font-display); color: var(--brand-ink); }
.ed-livros p { margin: 0; font-size: .9375rem; line-height: 1.5; color: #3A3355; max-width: 28ch; }
.ed-kit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 28px; align-items: center; margin-top: clamp(40px, 4vw, 60px); padding: 14px; border-radius: 22px; background: #fff; box-shadow: 0 20px 44px -28px rgba(26,18,55,.4); }
.ed-kit img { width: 100%; aspect-ratio: 16/8; object-fit: cover; border-radius: 14px; }
.ed-kit p { margin: 0; padding-right: 20px; font-size: .9375rem; line-height: 1.55; color: #4A4366; }
.ed-kit strong { display: block; margin-bottom: 8px; font: 700 1.2rem/1.3 "Sora", var(--font-display); color: var(--brand-ink); }

/* implementação */
.ed-impl { padding-block: clamp(56px, 6vw, 96px); }
.ed-impl-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.ed-impl-grade > div > p { margin: 18px 0 0; font-size: 1.0625rem; line-height: 1.6; color: #3A3355; max-width: 32rem; }
.ed-pilula { display: inline-block; padding: 10px 18px; border-radius: 999px; background: var(--ed-lav); font-weight: 700; color: var(--brand-ink) !important; }
.ed-impl-lista { list-style: none; margin: 0; padding: 0; }
.ed-impl-lista li { display: flex; gap: 18px; padding: 22px 0; border-bottom: 1px solid #E8EAF2; }
.ed-impl-lista li:first-child { border-top: 1px solid #E8EAF2; }
.ed-impl-ic { display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: 16px; background: var(--ed-lav); }
.ed-impl-ic svg { width: 26px; height: 26px; fill: none; stroke: var(--ed-azul); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ed-impl-lista h3 { margin: 2px 0 4px; font: 700 1.15rem/1.2 "Sora", var(--font-display); color: var(--brand-ink); }
.ed-impl-lista p { margin: 0; font-size: .9375rem; color: #4A4366; }

/* preço */
.ed-preco { padding-block: 0 clamp(56px, 6vw, 96px); }
.ed-preco-caixa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); border-radius: 28px; overflow: hidden; background: var(--brand-ink); color: #fff; box-shadow: 0 40px 80px -40px rgba(26,18,55,.7); }
.ed-preco-valor { padding: clamp(28px, 3.5vw, 52px); background: radial-gradient(80% 90% at 0% 100%, #2C1F66, transparent 70%); }
.ed-preco-rot { margin: 0 0 14px; font: 700 .8125rem/1 "DM Sans", var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--brand-lime); }
.pagina .ed-preco h2 { color: #fff; display: grid; gap: 4px; }
.ed-preco h2 small { font: 500 1.0625rem/1.3 "DM Sans", var(--font-text); letter-spacing: 0; color: rgba(255,255,255,.8); }
.ed-preco h2 span { font: 800 clamp(3.4rem, 2rem + 4.5vw, 5.6rem)/1 "Sora", var(--font-display); letter-spacing: -.05em; color: var(--brand-lime); }
.ed-preco-obs { margin: 22px 0 0; font-size: .8125rem; line-height: 1.5; color: rgba(255,255,255,.65); max-width: 30rem; }
.ed-preco-itens { padding: clamp(28px, 3.5vw, 52px); background: #fff; color: var(--brand-ink); }
.ed-preco-itens > p { margin: 0 0 14px; font: 700 1.1rem/1.2 "Sora", var(--font-display); }
.ed-preco-itens ul { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 12px; }
.ed-preco-itens li { position: relative; padding-left: 32px; font-size: 1rem; line-height: 1.4; color: #3A3355; }
.ed-preco-itens li::before { content: ""; position: absolute; left: 0; top: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--brand-lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4L18 8.5' fill='none' stroke='%231A1237' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat; }

/* faq */
.ed-faq { background: var(--ed-lav); padding-block: clamp(56px, 6vw, 96px); }
.ed-faq-grade { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.5fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.ed-faq-lista { display: grid; gap: 10px; }
.ed-faq details { border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(26,18,55,.05); }
.ed-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 22px; list-style: none; cursor: pointer; font: 700 1.0625rem/1.3 "Sora", var(--font-display); color: var(--brand-ink); }
.ed-faq summary::-webkit-details-marker { display: none; }
.ed-faq summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--ed-lav); font: 500 1.3rem/1 "DM Sans", var(--font-text); transition: transform .3s, background .2s; }
.ed-faq details[open] summary::after { transform: rotate(45deg); background: var(--brand-lime); }
.ed-faq details p { margin: 0; padding: 0 22px 20px; font-size: 1rem; line-height: 1.6; color: #3A3355; }

/* final */
.ed-final { position: relative; overflow: hidden; isolation: isolate; background: var(--brand-lime); text-align: center; padding: clamp(64px, 7vw, 110px) 0; }
.ed-final .container { position: relative; z-index: 1; display: grid; justify-items: center; gap: 18px; }
.pagina .ed-final h2 { max-width: 20ch; font-size: clamp(2rem, 1.2rem + 2.6vw, 3.4rem); }
.ed-final p { margin: 0; max-width: 34rem; font-size: 1.125rem; line-height: 1.55; color: var(--brand-ink); }
.ed-final .ed-btn { margin-top: 8px; }
.ed-final-prova { font-size: .875rem !important; opacity: .75; }
.ed-final-linha { position: absolute; z-index: 0; left: 50%; top: 50%; width: min(1500px, 118%); transform: translate(-50%, -48%); opacity: .35; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 22%, transparent 34%, transparent 66%, #000 78%, #000 100%); mask-image: linear-gradient(90deg, #000 0, #000 22%, transparent 34%, transparent 66%, #000 78%, #000 100%); }
.ed-final-linha path { fill: none; stroke: var(--brand-paper); stroke-width: 30; }

/* botão fixo do celular */
.ed-wa-fixo { display: none; }
@media (max-width: 899px) {
  .ed-wa-fixo { position: fixed; z-index: 70; left: 12px; right: 12px; bottom: 12px; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; border-radius: 999px; background: #25D366; color: #0B2E17; font: 800 1rem/1 "DM Sans", var(--font-text); text-decoration: none; box-shadow: 0 14px 30px -10px rgba(0,0,0,.45); transform: translateY(140%); transition: transform .4s cubic-bezier(.16,1,.3,1); }
  .ed-wa-fixo svg { width: 22px; height: 22px; }
  .ed-wa-fixo.on { transform: none; }
  .pagina:has(.ed-topo) { padding-bottom: 76px; }
}

/* revelação ao rolar (mesma linguagem das outras páginas) */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .ed-video-capa { animation: ed-rev linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
    .ed-video-capa img { animation: ed-zoom linear both; animation-timeline: view(); animation-range: entry 0% cover 60%; }
    .ed-livros img { animation: ed-sobe linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
    .ed-kit img { animation: ed-rev linear both; animation-timeline: view(); animation-range: entry 0% cover 45%; }
    @keyframes ed-rev { from { clip-path: inset(100% 0 0 0 round 18px); } to { clip-path: inset(0 0 0 0 round 18px); } }
    @keyframes ed-zoom { from { transform: scale(1.25); } }
    @keyframes ed-sobe { from { opacity: 0; translate: 0 60px; } }
  }
}

/* telas menores */
@media (max-width: 1179px) { .ed-eixos-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ed-eixos-grade h2 { grid-column: 1 / -1; } }
@media (max-width: 1023px) {
  .ed-hero, .ed-dif-grade, .ed-impl-grade, .ed-faq-grade, .ed-jornada-cab, .ed-kit { grid-template-columns: 1fr; }
  .ed-hero-arte { min-height: 0; padding-bottom: 40px; }
  .ed-beneficios ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ed-beneficios li { justify-content: flex-start; }
  .ed-beneficios li + li { border-left: 0; }
  .ed-preco-caixa { grid-template-columns: 1fr; }
}
@media (max-width: 599px) {
  .ed-topo h1 { font-size: clamp(2.1rem, 9.6vw, 2.8rem); }
  .ed-btn { width: 100%; }
  .ed-btn--hd { width: auto; min-height: 40px; padding: 0 16px; font-size: .875rem; }
  .ed-tela { margin-left: 0; transform: none; }
  .ed-tela-corpo { grid-template-columns: 38px 1fr; min-height: 0; }
  .ed-paleta { padding: 14px 8px; }
  .ed-bloco { min-height: 38px; padding: 0 12px; }
  .ed-dentro { margin-left: 12px; } .ed-dentro2 { margin-left: 24px; }
  .ed-prot { width: 46%; left: auto; right: 8px; bottom: 0; }
  .ed-laco { width: 100%; left: -30%; }
  .ed-videos, .ed-livros, .ed-eixos-grade { grid-template-columns: 1fr; }
  .ed-beneficios ul { grid-template-columns: 1fr; gap: 10px; }
  .ed-eixo { padding-left: 16px; }
  .ed-passos { flex-direction: column; border-radius: 22px; align-items: flex-start; }
  .ed-passos li { justify-content: flex-start; }
  .ed-passos li + li::before { content: "↓"; margin-right: 0; }
  .ed-livros li { justify-items: center; text-align: center; }
  .ed-livros img { width: 62%; }
  .ed-kit p { padding: 0 6px 6px; }
  .ed-temas ul { justify-content: flex-start; }
}
.masthead:has(.ed-topo) .site-header .nav-panel, .masthead:has(.ed-topo) .site-header .menu-toggle { display: none !important; }
.ed-prot img, .ed-kit img, .ed-livros img { height: auto; }
.ed-prot { bottom: -20px; }
.ed-passos li { gap: 18px; }
.ed-passos li + li::before { margin-right: 0; padding-right: 0; }
/* Sora carregada só em 600/700: evita negrito sintético */
.ed-topo h1, .ed-preco h2 span { font-weight: 700; }
@media (max-width: 899px) { body:has(.ed-topo) .barra-acao { display: none !important; } }
/* título do topo menor, cada frase em uma linha (08/11) */
.ed-topo h1 { font-size: clamp(2rem, 1rem + 2.6vw, 3.4rem); line-height: 1.06; }
.ed-topo h1 .ln { white-space: nowrap; }
.ed-lede { font-size: clamp(1rem, .95rem + .25vw, 1.15rem); }
@media (max-width: 599px) { .ed-topo h1 { font-size: clamp(1.7rem, 8.6vw, 2.3rem); } }
/* fundo do topo em roxo/azul vibrante, como a referência (08/11) */
.ed-topo { background:
  radial-gradient(60% 55% at 78% 40%, rgba(124, 92, 255, .55) 0%, transparent 70%),
  radial-gradient(70% 60% at 10% 100%, rgba(58, 40, 200, .55) 0%, transparent 70%),
  linear-gradient(160deg, #2A1A8C 0%, #3B2BC4 45%, #2B1E9E 100%); }
.masthead:has(.ed-topo) { background: #2A1A8C; }
.ed-topo::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(255,255,255,.35) 1px, transparent 1.5px); background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(70% 70% at 70% 40%, #000, transparent); mask-image: radial-gradient(70% 70% at 70% 40%, #000, transparent); }
.ed-topo > .container { position: relative; z-index: 1; }
.ed-selo { background: rgba(203,231,0,.18); }
/* topo com a arte BNCC e Pensamento Computacional (08/11) */
.ed-hero-arte--img { min-height: 0; display: flex; justify-content: center; }
.ed-hero-arte--img img { display: block; width: 100%; max-width: min(520px, 100%); height: auto; max-height: calc(100svh - 200px); object-fit: contain; border-radius: 26px;
  box-shadow: 0 40px 80px -36px rgba(10,6,40,.8), 0 0 0 1px rgba(255,255,255,.12); }
@media (prefers-reduced-motion: no-preference) {
  .ed-hero-arte--img img { animation: ed-arte 1.1s cubic-bezier(.16,1,.3,1) .2s both; }
  @keyframes ed-arte { from { opacity: 0; transform: translateY(30px) scale(.97); } }
}
@media (max-width: 1023px) { .ed-hero-arte--img img { max-height: none; max-width: 460px; } }

/* topo integrado às cores da arte: azul-violeta neon, a imagem se funde no fundo (08/11) */
.ed-topo { background:
  radial-gradient(45% 55% at 74% 45%, rgba(46, 2, 202, .9) 0%, transparent 70%),
  radial-gradient(40% 45% at 60% 60%, rgba(1, 88, 218, .55) 0%, transparent 70%),
  radial-gradient(50% 60% at 95% 10%, rgba(140, 40, 220, .45) 0%, transparent 70%),
  radial-gradient(60% 70% at 0% 100%, rgba(24, 17, 181, .7) 0%, transparent 70%),
  linear-gradient(160deg, #140271 0%, #1B0890 45%, #22028F 100%); }
.masthead:has(.ed-topo) { background: #140271; }
.ed-hero-arte--img img { border-radius: 0; box-shadow: none; max-width: min(600px, 100%);
  -webkit-mask-image: radial-gradient(75% 72% at 50% 48%, #000 62%, transparent 100%);
          mask-image: radial-gradient(75% 72% at 50% 48%, #000 62%, transparent 100%); }
.ed-hero-arte--img::before { content: ""; position: absolute; inset: 10% 5%; z-index: -1; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(203,231,0,.22), rgba(1,88,218,.25) 55%, transparent); filter: blur(30px); }
.ed-hero-arte--img { position: relative; isolation: isolate; }
.ed-selo { background: rgba(203,231,0,.16); box-shadow: inset 0 0 0 1px rgba(203,231,0,.35); }
.ed-topo h1 { text-shadow: 0 0 40px rgba(46,2,202,.6); }
.ed-beneficios { background: linear-gradient(180deg, #E9E4FF, #F1EEFB); }
/* bordas da arte somem no fundo (máscara nos quatro lados) */
.ed-hero-arte--img img {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 7%, #000 90%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%), linear-gradient(180deg, transparent 0, #000 7%, #000 90%, transparent 100%);
  mask-composite: intersect; }
/* arte recortada: sem fundo, sem moldura, sem sombra e sem máscara; flutua no azul da seção */
.ed-hero-arte--img img { -webkit-mask-image: none; mask-image: none; border-radius: 0; box-shadow: none; filter: none; max-width: min(620px, 100%); }
.ed-hero-arte--img::before { inset: 22% 8% 6%; background: radial-gradient(closest-side, rgba(1,88,218,.35), transparent); filter: blur(40px); }

/* ===== Educação Digital v2: página inteira em azul-violeta + verde, com efeito de vidro (08/11) ===== */
body:has(.ed-topo) { --edv: #1B0890; --edv-esc: #140271; --edv-txt: rgba(235,232,255,.82); --vidro: rgba(255,255,255,.07); --vidro-borda: rgba(255,255,255,.16); background: var(--edv-esc); }
.pagina:has(.ed-topo) { position: relative; isolation: isolate; color: #fff;
  background:
    radial-gradient(50% 35% at 85% 18%, rgba(46,2,202,.85), transparent 70%),
    radial-gradient(45% 30% at 5% 42%, rgba(1,88,218,.45), transparent 70%),
    radial-gradient(55% 30% at 95% 66%, rgba(110,30,210,.45), transparent 70%),
    radial-gradient(60% 30% at 10% 92%, rgba(46,2,202,.7), transparent 70%),
    linear-gradient(180deg, #140271 0%, #1B0890 30%, #1A0A8A 60%, #140271 100%); }
.pagina:has(.ed-topo) > section, .ed-topo, .ed-beneficios, .ed-eixos, .ed-jornada, .ed-faq, .ed-final { background: transparent !important; }
.ed-topo::before { display: none; }
.pagina:has(.ed-topo) h2, .pagina:has(.ed-topo) h3 { color: #fff !important; }
.pagina:has(.ed-topo) p, .pagina:has(.ed-topo) li { color: var(--edv-txt); }
.pagina:has(.ed-topo) mark { color: #fff; box-shadow: inset 0 -.36em 0 rgba(203,231,0,.85); }
.pagina:has(.ed-topo) .ed-forte, .ed-livros strong, .ed-kit strong { color: #fff !important; }

/* sombras de folha: a linha da marca desfocada passando atrás do vidro */
.ed-sombras { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.ed-sombras svg { position: absolute; width: 70vw; max-width: 1100px; height: auto; overflow: visible; filter: blur(28px); opacity: .55; }
.ed-sombras path { fill: none; stroke: #07013D; stroke-width: 70; }
.ed-sombras svg:nth-child(1) { right: -18vw; top: 900px; transform: rotate(-12deg); }
.ed-sombras svg:nth-child(2) { left: -20vw; top: 2300px; transform: rotate(20deg); }
.ed-sombras svg:nth-child(3) { right: -25vw; top: 3900px; transform: rotate(8deg); }
@media (prefers-reduced-motion: no-preference) {
  .ed-sombras svg { animation: ed-folha 18s ease-in-out infinite alternate; }
  .ed-sombras svg:nth-child(2) { animation-duration: 23s; } .ed-sombras svg:nth-child(3) { animation-duration: 27s; }
  @keyframes ed-folha { to { translate: -60px 40px; rotate: 4deg; } }
}

/* vidro: base comum */
.ed-painel, .ed-beneficios ul, .ed-eixo, .ed-passos, .ed-kit, .ed-impl-lista li, .ed-preco-caixa, .ed-faq details, .ed-temas ul, .ed-livros li {
  background: var(--vidro); border: 1px solid var(--vidro-borda);
  -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 30px 60px -36px rgba(5,0,40,.9); }

/* 1. painel que sobe no fim do topo */
.ed-painel-box { position: relative; z-index: 3; margin-top: clamp(28px, 4vw, 56px); }
.ed-painel { border-radius: 26px; padding: 18px; background: rgba(255,255,255,.1); transform-origin: 50% 0; }
.ed-painel-cab { display: flex; align-items: center; gap: 14px; padding: 4px 6px 16px; }
.ed-painel-cab strong { font: 700 1rem/1.2 "Sora", var(--font-display); color: #fff; }
.ed-painel-pt { display: inline-flex; gap: 6px; } .ed-painel-pt i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.3); } .ed-painel-pt i:first-child { background: var(--brand-lime); }
.ed-painel-tag { margin-left: auto; padding: 6px 12px; border-radius: 999px; background: rgba(203,231,0,.16); color: var(--brand-lime); font: 600 .75rem/1 "DM Sans", var(--font-text); }
.ed-painel-grade { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ed-painel-grade li { display: grid; gap: 6px; padding: 18px; border-radius: 18px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.1); }
.ed-painel-grade span { font: 600 .75rem/1 "DM Sans", var(--font-text); letter-spacing: .08em; text-transform: uppercase; color: rgba(235,232,255,.6) !important; }
.ed-painel-grade strong { font: 700 clamp(1.05rem, .9rem + .5vw, 1.35rem)/1.15 "Sora", var(--font-display); color: #fff; }
.ed-painel-grade small { font-size: .8125rem; color: rgba(235,232,255,.7); }
.ed-painel-grade .ed-painel-preco { background: var(--brand-lime); border-color: var(--brand-lime); }
.ed-painel-grade .ed-painel-preco span, .ed-painel-grade .ed-painel-preco strong, .ed-painel-grade .ed-painel-preco small { color: var(--brand-ink) !important; }
.ed-painel-trilha { display: flex; align-items: center; gap: 12px; padding: 16px 8px 4px; }
.ed-painel-trilha span { font: 600 .8125rem/1 "DM Sans", var(--font-text); color: rgba(235,232,255,.8); white-space: nowrap; }
.ed-painel-trilha i { flex: 1; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--brand-lime), rgba(203,231,0,.15)); }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .ed-painel { animation: ed-painel linear both; animation-timeline: view(); animation-range: entry 0% cover 45%; }
    @keyframes ed-painel { from { transform: perspective(1400px) translateY(90px) rotateX(18deg) scale(.86); opacity: .55; } to { transform: none; opacity: 1; } }
  }
}

/* 2. benefícios em vidro */
.ed-beneficios { border: 0; padding: 26px 0 0; }
.ed-beneficios ul { border-radius: 999px; padding: 18px 28px; }
.ed-beneficios li { color: #fff !important; }
.ed-beneficios li + li { border-left-color: rgba(255,255,255,.15); }

/* 3. vídeos: cards largos e altos, texto sobre a imagem */
.ed-dif-grade { grid-template-columns: 1fr; gap: 28px; }
.ed-dif-txt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px 56px; align-items: end; }
.ed-dif-txt h2 { grid-row: span 2; }
.ed-dif-txt p { margin: 0 !important; }
.ed-videos { gap: 18px; }
.ed-video { position: relative; border-radius: 24px; overflow: hidden; }
.ed-video-capa { aspect-ratio: 4/3.2; border-radius: 24px; }
.ed-video-capa::after { background: linear-gradient(180deg, rgba(20,2,113,0) 35%, rgba(20,2,113,.92) 100%); }
.ed-video h3, .ed-video p { position: absolute; left: 28px; right: 28px; z-index: 2; pointer-events: none; }
.ed-video h3 { bottom: 58px; margin: 0; font-size: clamp(1.4rem, 1rem + 1.2vw, 2rem) !important; }
.ed-video p { bottom: 26px; margin: 0; color: rgba(235,232,255,.85) !important; }
.ed-play { top: 42%; background: rgba(255,255,255,.18); color: #fff; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 0 0 1px rgba(255,255,255,.35); }
.ed-video-capa:hover .ed-play { background: var(--brand-lime); color: var(--brand-ink); }
.ed-nota { color: rgba(235,232,255,.6) !important; }
.ed-temas ul { border-radius: 999px; padding: 16px 24px; justify-content: space-around; }
.ed-temas li { color: #fff !important; }
.ed-temas svg { stroke: var(--brand-lime); }

/* 4. eixos em vidro */
.ed-eixos-grade { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.ed-eixos-grade h2 { grid-column: 1 / -1; margin-bottom: 10px !important; }
.ed-eixo { padding: 28px; border-radius: 24px; border-left: 1px solid var(--vidro-borda); }
.ed-passos { border-radius: 999px; }
.ed-eixos-leg { color: rgba(235,232,255,.6) !important; }

/* 5. livros: cards largos de vidro */
.ed-jornada-cab p { color: var(--edv-txt) !important; }
.ed-livros { gap: 18px; }
.ed-livros li { padding: 28px 28px 30px; border-radius: 26px; justify-items: center; text-align: center; }
.ed-livros img { width: min(220px, 72%); margin-bottom: 24px; box-shadow: 0 30px 50px -24px rgba(0,0,0,.7); }
.ed-livros p { color: var(--edv-txt) !important; max-width: 30ch; }
.ed-kit { background: var(--vidro); }
.ed-kit p { color: var(--edv-txt) !important; }

/* 6. implementação */
.ed-pilula { background: rgba(203,231,0,.16) !important; color: var(--brand-lime) !important; }
.ed-impl-lista li, .ed-impl-lista li:first-child { border: 1px solid var(--vidro-borda); border-radius: 20px; padding: 20px; margin-bottom: 12px; }
.ed-impl-ic { background: rgba(203,231,0,.14); }
.ed-impl-ic svg { stroke: var(--brand-lime); }

/* 7. preço em vidro */
.ed-preco-caixa { background: var(--vidro); }
.ed-preco-valor { background: radial-gradient(80% 90% at 0% 100%, rgba(46,2,202,.7), transparent 70%); }
.ed-preco-itens { background: rgba(255,255,255,.05); border-left: 1px solid var(--vidro-borda); }
.ed-preco-itens > p { color: #fff !important; }
.ed-preco-itens li { color: var(--edv-txt) !important; }
.ed-btn--escuro { background: var(--brand-lime); color: var(--brand-ink); box-shadow: 0 12px 28px -12px rgba(203,231,0,.6); }
.ed-btn--escuro:hover { background: #fff; color: var(--brand-ink); }

/* 8. perguntas em vidro */
.ed-faq details { border-radius: 18px; }
.ed-faq summary { color: #fff; }
.ed-faq summary::after { background: rgba(255,255,255,.12); color: #fff; }
.ed-faq details[open] summary::after { color: var(--brand-ink); }
.ed-faq details p { color: var(--edv-txt) !important; }

/* 9. final + rodapé no mesmo azul, com "Educação Digital" gigante atrás */
.ed-final { padding-bottom: clamp(140px, 16vw, 260px); }
.pagina .ed-final h2 { color: #fff !important; }
.ed-final p { color: var(--edv-txt) !important; }
.ed-final-linha { display: none; }
.ed-gigante { position: absolute; z-index: 0; left: 50%; bottom: -0.18em; transform: translateX(-50%); margin: 0; width: 100%; text-align: center; white-space: nowrap; pointer-events: none;
  font: 700 clamp(4.5rem, 2rem + 13vw, 15rem)/.86 "Sora", var(--font-display); letter-spacing: -.06em; color: transparent !important;
  background: linear-gradient(180deg, rgba(255,255,255,.2) 0%, rgba(255,255,255,.04) 75%); -webkit-background-clip: text; background-clip: text;
  -webkit-text-stroke: 1px rgba(255,255,255,.14); }
.ed-final .container { position: relative; z-index: 1; }
.masthead:has(.ed-topo) .site-footer { background: transparent; position: relative; z-index: 1; }
body:has(.ed-topo) .masthead { background: transparent !important; }
body:has(.ed-topo) .site-footer .brand { color: var(--brand-lime); }
.ed-final-prova { color: rgba(235,232,255,.6) !important; }

/* telas menores */
@media (max-width: 1023px) {
  .ed-painel-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ed-dif-txt { grid-template-columns: 1fr; }
  .ed-dif-txt h2 { grid-row: auto; }
  .ed-preco-itens { border-left: 0; border-top: 1px solid var(--vidro-borda); }
}
@media (max-width: 599px) {
  .ed-painel { padding: 12px; border-radius: 20px; }
  .ed-painel-grade { grid-template-columns: 1fr 1fr; gap: 8px; }
  .ed-painel-grade li { padding: 14px; }
  .ed-painel-trilha { display: none; }
  .ed-painel-tag { display: none; }
  .ed-beneficios ul { border-radius: 22px; padding: 16px 18px; }
  .ed-eixos-grade { grid-template-columns: 1fr; }
  .ed-video h3 { left: 18px; bottom: 50px; } .ed-video p { left: 18px; right: 18px; bottom: 18px; font-size: .875rem; }
  .ed-video-capa { aspect-ratio: 4/4.4; }
  .ed-temas ul { border-radius: 22px; }
  .ed-sombras svg { width: 140vw; }
}
/* ajustes v2 */
.ed-final .ed-gigante { position: absolute; font-size: clamp(4.5rem, 2rem + 13vw, 15.5rem); line-height: .86; max-width: none; color: transparent !important; }
.ed-final { overflow: hidden; }
body:has(.ed-topo) .barra-acao { background: rgba(20,2,113,.72); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid rgba(255,255,255,.12); }
body:has(.ed-topo) .barra-acao .brand { color: #fff; }
/* painel aparece "espiando" na base do topo */
@media (min-width: 1024px) {
  .ed-topo { padding-bottom: 0; }
  .ed-hero-arte--img img { max-height: calc(100svh - 300px); }
  .ed-painel-box { margin-top: 8px; }
}
/* fundo único do topo ao rodapé (sem emenda entre o convite e o rodapé) */
body:has(.ed-topo) { background:
    radial-gradient(50% 30% at 85% 10%, rgba(46,2,202,.85), transparent 70%),
    radial-gradient(45% 25% at 5% 38%, rgba(1,88,218,.4), transparent 70%),
    radial-gradient(55% 25% at 95% 60%, rgba(110,30,210,.4), transparent 70%),
    radial-gradient(70% 25% at 50% 96%, rgba(46,2,202,.65), transparent 70%),
    linear-gradient(180deg, #140271 0%, #1B0890 35%, #1A0A8A 65%, #140271 100%); }
.pagina:has(.ed-topo) { background: transparent; }
/* "Educação Digital" gigante: sem contorno, encostado no rodapé */
.ed-final .ed-gigante { -webkit-text-stroke: 0; bottom: -.22em; background: linear-gradient(180deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.03) 80%); -webkit-background-clip: text; background-clip: text; }
.ed-final { padding-bottom: clamp(200px, 22vw, 360px); }

/* seções brancas como quebra entre os blocos azuis: diferencial, implementação e preço (08/11) */
.pagina:has(.ed-topo) > .ed-dif, .pagina:has(.ed-topo) > .ed-impl, .pagina:has(.ed-topo) > .ed-preco { background: #fff !important; position: relative; z-index: 1; }
.ed-dif, .ed-impl, .ed-preco { --edv-txt: #3A3355; }
.ed-dif h2, .ed-impl h2, .ed-impl h3, .ed-dif .ed-forte { color: var(--brand-ink) !important; }
.ed-dif p, .ed-impl p, .ed-dif li, .ed-impl li { color: #3A3355; }
.ed-dif mark, .ed-impl mark { color: var(--brand-ink); box-shadow: inset 0 -.38em 0 var(--brand-lime); }
.ed-dif .ed-video h3 { color: #fff !important; }
.ed-dif .ed-video p { color: rgba(235,232,255,.88) !important; }
.ed-dif .ed-nota { color: #6B6585 !important; }
.ed-dif .ed-temas ul { background: #F3F1FF; border-color: #E4E0FA; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.ed-dif .ed-temas li { color: var(--brand-ink) !important; }
.ed-dif .ed-temas svg { stroke: #2E02CA; }
.ed-impl .ed-pilula { background: #F3F1FF !important; color: var(--brand-ink) !important; }
.ed-impl .ed-impl-lista li { background: #fff; border-color: #E4E0FA; box-shadow: 0 14px 30px -24px rgba(27,8,144,.5); -webkit-backdrop-filter: none; backdrop-filter: none; }
.ed-impl .ed-impl-ic { background: #F3F1FF; }
.ed-impl .ed-impl-ic svg { stroke: #2E02CA; }
.ed-impl .ed-impl-lista p { color: #4A4366 !important; }
.ed-preco { padding-top: 0; }
.ed-preco-caixa { background: linear-gradient(135deg, #140271 0%, #1B0890 50%, #2E02CA 100%); border: 0; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 40px 80px -40px rgba(27,8,144,.8); }
.ed-preco-itens { background: rgba(255,255,255,.06); }
.ed-impl { padding-bottom: clamp(36px, 4vw, 56px); }
/* títulos e textos legíveis nas seções brancas */
.pagina:has(.ed-topo) .ed-dif h2, .pagina:has(.ed-topo) .ed-impl h2, .pagina:has(.ed-topo) .ed-impl h3 { color: var(--brand-ink) !important; }
.pagina:has(.ed-topo) .ed-dif .ed-forte { color: var(--brand-ink) !important; }
.pagina:has(.ed-topo) .ed-dif mark, .pagina:has(.ed-topo) .ed-impl mark { color: var(--brand-ink); }
.pagina:has(.ed-topo) .ed-dif .ed-video h3 { color: #fff !important; }
.pagina:has(.ed-topo) .ed-dif-txt p, .pagina:has(.ed-topo) .ed-impl-grade > div > p:not(.ed-pilula) { color: #3A3355 !important; }
.pagina:has(.ed-topo) .ed-preco-obs { color: rgba(235,232,255,.7) !important; }
.pagina:has(.ed-topo) .ed-preco-itens li { color: rgba(235,232,255,.88) !important; }

/* kits: montagem com as fotos reais (08/11) */
.ed-kit2 { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr); gap: clamp(28px, 4vw, 64px); align-items: center; margin-top: clamp(44px, 5vw, 80px);
  padding: clamp(24px, 3vw, 44px); border-radius: 30px; background: var(--vidro); border: 1px solid var(--vidro-borda);
  -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 30px 60px -36px rgba(5,0,40,.9); }
.ed-kit2-rot { margin: 0 0 12px; font: 600 .75rem/1 "DM Sans", var(--font-text); letter-spacing: .12em; text-transform: uppercase; color: var(--brand-lime) !important; }
.ed-kit2 h3 { margin: 0 0 14px; font: 700 clamp(1.35rem, 1rem + 1vw, 1.9rem)/1.2 "Sora", var(--font-display); letter-spacing: -.02em; color: #fff; text-wrap: balance; }
.ed-kit2-txt > p:not(.ed-kit2-rot) { margin: 0 0 18px; font-size: 1rem; line-height: 1.6; color: var(--edv-txt); }
.ed-kit2-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ed-kit2-lista li { position: relative; padding-left: 30px; font-size: .9375rem; color: #fff !important; }
.ed-kit2-lista li::before { content: ""; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--brand-lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4L18 8.5' fill='none' stroke='%231A1237' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/13px no-repeat; }
.ed-kit2-mosaico { position: relative; display: grid; grid-template-columns: 1fr 1.15fr; grid-template-rows: 1fr 1fr; gap: 14px; aspect-ratio: 1.12; }
.ed-k { position: relative; margin: 0; overflow: hidden; border-radius: 22px; box-shadow: 0 24px 44px -24px rgba(5,0,40,.9); }
.ed-k img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.16,1,.3,1); }
.ed-k:hover img { transform: scale(1.05); }
.ed-k--caixa { grid-row: 1 / 3; }
.ed-k--caixa img { object-position: 50% 60%; }
.ed-k--livros img { object-position: 30% 50%; }
.ed-k figcaption { position: absolute; left: 12px; bottom: 12px; padding: 7px 12px; border-radius: 999px; background: rgba(20,2,113,.72); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  font: 600 .75rem/1 "DM Sans", var(--font-text); color: #fff; }
.ed-k-comp { position: absolute; z-index: 3; width: 46%; height: auto; right: -6%; bottom: -12%; filter: drop-shadow(0 26px 30px rgba(5,0,40,.65)); transform: rotate(-6deg); pointer-events: none; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .ed-k { animation: ed-rev linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
    .ed-k--livros { animation-range: entry 8% cover 46%; } .ed-k--infantil { animation-range: entry 16% cover 52%; }
    .ed-k-comp { animation: ed-comp linear both; animation-timeline: view(); animation-range: entry 10% cover 55%; }
    @keyframes ed-comp { from { opacity: 0; transform: translate(60px, 60px) rotate(8deg) scale(.85); } to { opacity: 1; transform: rotate(-6deg); } }
  }
}
@media (max-width: 1023px) { .ed-kit2 { grid-template-columns: 1fr; } .ed-k-comp { right: -2%; bottom: -8%; width: 42%; } }
@media (max-width: 599px) { .ed-kit2 { padding: 18px; border-radius: 24px; } .ed-kit2-mosaico { gap: 8px; } .ed-k { border-radius: 16px; } .ed-k figcaption { font-size: .625rem; padding: 5px 8px; left: 8px; bottom: 8px; } .ed-k-comp { width: 48%; bottom: -10%; } }
/* componentes flutuando na coluna de texto, sem cobrir as fotos */
.ed-kit2-txt { position: relative; }
.ed-k-comp { position: relative; display: block; width: min(320px, 78%); right: auto; bottom: auto; margin: 22px 0 -20px auto; transform: rotate(-5deg); }
@media (max-width: 1023px) { .ed-k-comp { width: 60%; margin: 18px auto 0; right: auto; bottom: auto; } }
/* fotos do kit: revelação termina quando a foto entra inteira na tela */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .ed-k { animation-range: entry 0% entry 80% !important; }
    .ed-k--livros { animation-range: entry 10% entry 90% !important; }
    .ed-k--infantil { animation-range: entry 0% entry 85% !important; }
    .ed-k img { animation: none; }
  }
}
/* teste: arte sem o título BNCC */
.ed-hero-arte--img img { max-width: min(640px, 100%); max-height: none; }

/* tela de blocos do detector de gás, montada no site sobre a arte (poucas cores: violeta, lima e lavanda) (08/11) */
.ed-arte { position: relative; width: 100%; max-width: min(640px, 100%); }
.ed-arte img { display: block; width: 100%; height: auto; }
.ed-codigo { position: absolute; z-index: 2; left: 4%; top: 7%; width: 56%; border-radius: 14px; background: #fff; overflow: hidden;
  box-shadow: 0 30px 50px -24px rgba(5,0,40,.75), 0 0 0 1px rgba(255,255,255,.4); transform: rotate(-1.5deg); font-family: "DM Sans", var(--font-text); }
.ed-codigo-barra { display: flex; align-items: center; gap: 5px; padding: 8px 12px; background: #F1EEFF; border-bottom: 1px solid #E2DDFB; }
.ed-codigo-barra i { width: 8px; height: 8px; border-radius: 50%; background: #CFC8F5; }
.ed-codigo-barra i:first-child { background: var(--brand-lime); }
.ed-codigo-barra span { margin-left: 8px; font-weight: 700; font-size: clamp(.55rem, .4rem + .35vw, .78rem); color: #2E1A8C; }
.ed-codigo-corpo { display: grid; grid-template-columns: auto 1fr; }
.ed-codigo-cat { list-style: none; margin: 0; padding: 10px 8px; display: grid; align-content: start; gap: 6px; background: #F7F5FF; border-right: 1px solid #ECE8FD; }
.ed-codigo-cat li { padding: 4px 8px; border-radius: 6px; font-weight: 600; font-size: clamp(.5rem, .35rem + .3vw, .7rem); color: #6B62A8 !important; }
.ed-codigo-cat li.on { background: #2E02CA; color: #fff !important; }
.ed-cb { padding: 10px 12px 12px; background-image: radial-gradient(#E9E5FB 1px, transparent 1px); background-size: 14px 14px;
  font-size: clamp(.55rem, .38rem + .42vw, .86rem); font-weight: 700; line-height: 1; }
.cb { display: inline-flex; align-items: center; gap: 6px; min-height: 2.3em; padding: 0 .9em; border-radius: 7px; white-space: nowrap; margin-bottom: 3px; }
.cb svg { width: 1em; height: 1em; }
.cb b { font-weight: 700; padding: .25em .55em; border-radius: 99px; background: rgba(255,255,255,.22); }
.cb-ev, .cb-ct { background: #2E02CA; color: #fff; }
.cb-ev { border-radius: 14px 7px 7px 7px; }
.cb-se { background: var(--brand-lime); color: var(--brand-ink); }
.cb-se b { background: rgba(26,18,55,.12); }
.cb-ac { background: #E6E1FF; color: #2E1A8C; }
.cb-ac b { background: #fff; }
.cb-cond { background: var(--brand-lime) !important; color: var(--brand-ink); }
.cb-c { display: grid; justify-items: start; }
.cb-in { margin-left: .9em; padding-left: .9em; border-left: .55em solid #2E02CA; display: grid; justify-items: start; margin-top: -3px; margin-bottom: -3px; padding-top: 3px; padding-bottom: 3px; }
.cb-pe { width: 4.5em; height: .8em; border-radius: 0 0 7px 7px; background: #2E02CA; margin-bottom: 3px; }
@media (prefers-reduced-motion: no-preference) {
  .ed-cb .cb { animation: ed-cb .55s cubic-bezier(.2,1.3,.4,1) both; }
  .ed-cb .cb:nth-of-type(1) { animation-delay: .4s; }
  .ed-cb > .cb-c .cb { animation-delay: .7s; }
  .ed-cb .cb-in .cb { animation-delay: 1s; }
  .ed-cb .cb-in .cb-in .cb { animation-delay: 1.3s; }
  @keyframes ed-cb { from { opacity: 0; transform: translateX(-24px); } }
}
@media (max-width: 599px) { .ed-codigo { width: 60%; left: 2%; top: 5%; border-radius: 10px; } .ed-codigo-cat { display: none; } .ed-codigo-corpo { grid-template-columns: 1fr; } }
/* tela menor: não cobre a foto do protótipo */
.ed-codigo { top: 2%; width: 54%; }
.ed-cb { font-size: clamp(.5rem, .32rem + .36vw, .74rem); padding: 8px 10px 10px; }
.cb { min-height: 2.05em; margin-bottom: 2px; }
.ed-codigo-cat { gap: 4px; padding: 8px 6px; }
@media (max-width: 599px) { .ed-codigo { width: 58%; top: 1%; } }
.ed-cb { font-size: clamp(.58rem, .38rem + .46vw, .9rem); padding: 10px 12px 12px; }
.ed-codigo { width: 56%; top: 1%; }
/* tela sobe e encolhe um pouco: protótipo fica todo visível */
.ed-codigo { top: -9%; width: 53%; }
.ed-cb { font-size: clamp(.54rem, .36rem + .42vw, .82rem); }
.ed-arte { margin-top: 6%; }
@media (max-width: 599px) { .ed-codigo { top: -6%; width: 56%; } .ed-arte { margin-top: 10%; } }

/* volta o título BNCC na arte; tela de código no lugar da janela original (08/11) */
.ed-arte { margin-top: 0; max-width: min(560px, 100%); }
.ed-arte img { max-height: calc(100svh - 150px); width: auto; max-width: 100%; margin-inline: auto; }
.ed-codigo { top: 39%; left: 3%; width: 56%; transform: rotate(-1.5deg); }
.ed-cb { font-size: clamp(.5rem, .32rem + .36vw, .74rem); padding: 7px 9px 9px; }
.ed-codigo-barra { padding: 6px 10px; }
.ed-codigo-cat { gap: 3px; padding: 6px 5px; }
.ed-codigo-cat li { padding: 3px 6px; font-size: clamp(.45rem, .32rem + .26vw, .64rem); }
@media (max-width: 599px) { .ed-codigo { top: 38%; width: 58%; } .ed-arte { margin-top: 0; } }

/* título BNCC menor na arte; tela de blocos maior */
.ed-codigo { top: 27%; width: 58%; }
.ed-cb { font-size: clamp(.54rem, .36rem + .42vw, .82rem); }
@media (max-width: 599px) { .ed-codigo { top: 26%; width: 60%; } }
.ed-codigo { top: 26.5%; width: 58%; } @media (max-width: 599px) { .ed-codigo { top: 25.5%; } }
.ed-codigo { left: -7%; width: 55%; } @media (max-width: 599px) { .ed-codigo { left: 0; width: 56%; } }

/* LED verde piscando sobre o "Protótipo funcionando" (08/11) */
.ed-led { position: absolute; z-index: 3; left: 9.35%; top: 91.85%; width: 2.3%; aspect-ratio: 1; margin: -1.15% 0 0 -1.15%; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #B8FF9E, #2EDB4B 55%, #149E2C); box-shadow: 0 0 10px 3px rgba(46,219,75,.75); }
@media (prefers-reduced-motion: no-preference) {
  .ed-led { animation: ed-led 1.1s ease-in-out infinite; }
  @keyframes ed-led { 0%, 100% { opacity: 1; box-shadow: 0 0 12px 4px rgba(46,219,75,.85); } 50% { opacity: .25; box-shadow: 0 0 0 0 rgba(46,219,75,0); } }
}

/* código sendo digitado; as linhas azuis de encaixe se formam no final */
.ed-cb .cb { animation: none !important; }
.ed-cb.ed-digitando .cb { opacity: 0; }
.ed-cb.ed-digitando .cb.on { opacity: 1; }
.ed-cb.ed-digitando .cb.on:not(.ed-cb.ed-pronto .cb)::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 2px; background: currentColor; animation: ed-cursor .6s steps(1) infinite; }
@keyframes ed-cursor { 50% { opacity: 0; } }
.ed-cb .cb { position: relative; }
.ed-cb .cb::after { content: none; }
.ed-cb.ed-digitando .cb.on:last-of-type::after, .ed-cb.ed-digitando .cb.on::after { content: ""; }
.cb-in { position: relative; border-left-color: transparent !important; }
.cb-in::before { content: ""; position: absolute; left: -.55em; top: 0; bottom: 0; width: .55em; background: #2E02CA; transform-origin: 50% 0; transform: scaleY(1); transition: transform .9s cubic-bezier(.22,1,.36,1); }
.cb-pe { transform-origin: 0 50%; transition: transform .6s cubic-bezier(.22,1,.36,1) .7s; }
.ed-cb.ed-digitando .cb-in::before { transform: scaleY(0); transition: none; }
.ed-cb.ed-digitando .cb-pe { transform: scaleX(0); transition: none; }
.ed-cb .cb::after { content: none !important; }
.ed-cb.ed-digitando .cb.atual::after { content: "" !important; display: inline-block; width: 2px; height: 1em; margin-left: 1px; background: currentColor; animation: ed-cursor .6s steps(1) infinite; }

/* lâmpada desenhada no site, encaixada na cabeça do estudante (08/11) */
.ed-lampada { position: absolute; z-index: 3; left: 65.5%; top: 20.3%; width: 11.5%; height: auto; overflow: visible; transform: rotate(14deg); transform-origin: 50% 95%; }
.ed-bulbo { fill: #FFD43B; stroke: #F59F00; stroke-width: 3; filter: drop-shadow(0 0 10px rgba(255,212,59,.85)); }
@media (prefers-reduced-motion: no-preference) {
  .ed-bulbo { animation: ed-acende 2.4s ease-in-out infinite; }
  .ed-raios { animation: ed-raios 2.4s ease-in-out infinite; }
  @keyframes ed-acende { 0%, 100% { filter: drop-shadow(0 0 6px rgba(255,212,59,.6)); } 50% { filter: drop-shadow(0 0 18px rgba(255,212,59,1)); } }
  @keyframes ed-raios { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
}

/* camadas da arte: cruzes e pontos de luz no fundo, piscando devagar */
.ed-hero-arte--img { overflow: visible; }
.ed-brilhos { position: absolute; inset: -6% -4% 0 -8%; z-index: 0; pointer-events: none; }
.ed-brilhos i { position: absolute; display: block; }
.ed-brilhos .x { width: 20px; height: 20px; }
.ed-brilhos .x::before, .ed-brilhos .x::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 3px; margin: -1.5px 0 0 -50%; border-radius: 3px; background: currentColor; box-shadow: 0 0 10px currentColor; }
.ed-brilhos .x::after { transform: rotate(90deg); }
.x1 { left: 92%; top: 30%; color: #9C7BFF; } .x2 { left: 90%; top: 52%; color: #6FD8FF; width: 16px !important; height: 16px !important; }
.x3 { left: 2%; top: 44%; color: #6FD8FF; width: 14px !important; height: 14px !important; } .x4 { left: 46%; top: 6%; color: #9C7BFF; width: 14px !important; height: 14px !important; }
.ed-brilhos .p { width: 7px; height: 7px; border-radius: 50%; background: #8FB4FF; box-shadow: 0 0 12px 4px rgba(120,160,255,.7); }
.p1 { left: 97%; top: 64%; } .p2 { left: 8%; top: 20%; } .p3 { left: 60%; top: 3%; width: 5px !important; height: 5px !important; } .p4 { left: 4%; top: 78%; } .p5 { left: 98%; top: 12%; width: 5px !important; height: 5px !important; }
@media (prefers-reduced-motion: no-preference) {
  .ed-brilhos i { animation: ed-pisca 3.2s ease-in-out infinite; }
  .ed-brilhos i:nth-child(2n) { animation-duration: 4.1s; animation-delay: .8s; }
  .ed-brilhos i:nth-child(3n) { animation-duration: 2.7s; animation-delay: 1.4s; }
  @keyframes ed-pisca { 0%, 100% { opacity: .25; transform: scale(.7); } 50% { opacity: 1; transform: scale(1); } }
}
.ed-arte { position: relative; z-index: 1; }
.ed-lampada { left: 70%; top: 23.5%; width: 17%; transform: rotate(-12deg); } @media (max-width: 599px) { .ed-lampada { left: 70%; top: 23.5%; width: 17%; } }

/* camada de brilhos também do lado esquerdo do topo (08/11) */
.ed-brilhos-esq { position: absolute; z-index: 0; left: 0; top: 0; bottom: 0; width: 50%; pointer-events: none; }
.ed-brilhos-esq i { position: absolute; display: block; }
.ed-brilhos-esq .x { width: 18px; height: 18px; }
.ed-brilhos-esq .x::before, .ed-brilhos-esq .x::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 3px; margin: -1.5px 0 0 -50%; border-radius: 3px; background: currentColor; box-shadow: 0 0 10px currentColor; }
.ed-brilhos-esq .x::after { transform: rotate(90deg); }
.ed-brilhos-esq .x1 { left: 3%; top: 30%; color: #9C7BFF; }
.ed-brilhos-esq .x2 { left: 44%; top: 20%; color: #6FD8FF; width: 14px; height: 14px; }
.ed-brilhos-esq .x3 { left: 48%; top: 86%; color: #9C7BFF; width: 14px; height: 14px; }
.ed-brilhos-esq .p { width: 6px; height: 6px; border-radius: 50%; background: #8FB4FF; box-shadow: 0 0 12px 4px rgba(120,160,255,.7); }
.ed-brilhos-esq .p1 { left: 1.5%; top: 62%; } .ed-brilhos-esq .p2 { left: 30%; top: 17%; width: 4px; height: 4px; }
.ed-brilhos-esq .p3 { left: 54%; top: 46%; } .ed-brilhos-esq .p4 { left: 22%; top: 93%; width: 5px; height: 5px; }
.ed-topo::after { content: ""; position: absolute; z-index: 0; left: -10%; top: 20%; width: 45%; height: 70%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(110,60,255,.35), transparent); filter: blur(20px); }
@media (prefers-reduced-motion: no-preference) {
  .ed-brilhos-esq i { animation: ed-pisca 3.6s ease-in-out infinite; }
  .ed-brilhos-esq i:nth-child(2n) { animation-duration: 4.4s; animation-delay: 1.1s; }
  .ed-brilhos-esq i:nth-child(3n) { animation-duration: 2.9s; animation-delay: .5s; }
}
@media (max-width: 599px) { .ed-brilhos-esq { width: 100%; } .ed-brilhos-esq .x2, .ed-brilhos-esq .p3 { display: none; } }
/* arte um pouco menor (08/11) */ .ed-arte { max-width: min(500px, 100%); } .ed-arte img { max-height: calc(100svh - 190px); }
.ed-arte { container-type: inline-size; } .ed-cb { font-size: clamp(.45rem, 2.4cqi, .82rem); } .ed-codigo-barra span { font-size: clamp(.5rem, 2.2cqi, .78rem); } .ed-codigo-cat li { font-size: clamp(.42rem, 1.9cqi, .66rem); }
.ed-cb { font-size: 1.95cqi; } .ed-codigo-barra span { font-size: 2cqi; } .ed-codigo-cat li { font-size: 1.7cqi; }
/* LED em cima da bolinha verde da arte atual */ .ed-led { left: 9.38%; top: 92.04%; width: 2.2%; margin: -1.1% 0 0 -1.1%; }

/* ===== TESTE: página toda no azul índigo da Bobby #1A1237 (só em /educacao-digital-indigo/) ===== */
body:has(.ed-indigo) { background:
    radial-gradient(50% 30% at 82% 8%, rgba(60,45,130,.55), transparent 70%),
    radial-gradient(45% 22% at 5% 35%, rgba(50,38,110,.4), transparent 70%),
    radial-gradient(55% 22% at 95% 62%, rgba(60,45,130,.35), transparent 70%),
    radial-gradient(60% 20% at 10% 90%, rgba(50,38,110,.35), transparent 70%),
    #1A1237 !important; }
body:has(.ed-indigo) .ed-topo { background: transparent !important; }
body:has(.ed-indigo) .ed-topo::after { background: radial-gradient(closest-side, rgba(90,70,170,.28), transparent) !important; }
body:has(.ed-indigo) .masthead:has(.ed-topo) { background: transparent !important; }
body:has(.ed-indigo) .barra-acao { background: rgba(26,18,55,.78) !important; }
body:has(.ed-indigo) .ed-hero-arte--img::before { background: radial-gradient(closest-side, rgba(90,70,170,.4), transparent) !important; }
body:has(.ed-indigo) .ed-topo h1 { text-shadow: none; }
body:has(.ed-indigo) .ed-preco-caixa { background: linear-gradient(135deg, #1A1237 0%, #251A4D 60%, #2E2260 100%) !important; }
body:has(.ed-indigo) .ed-preco-valor { background: radial-gradient(80% 90% at 0% 100%, rgba(60,45,130,.5), transparent 70%) !important; }
body:has(.ed-indigo) .ed-video-capa::after { background: linear-gradient(180deg, rgba(26,18,55,0) 35%, rgba(26,18,55,.92) 100%) !important; }
body:has(.ed-indigo) .cb-ev, body:has(.ed-indigo) .cb-ct, body:has(.ed-indigo) .cb-pe, body:has(.ed-indigo) .ed-codigo-cat li.on { background: #1A1237 !important; }
body:has(.ed-indigo) .cb-in::before { background: #1A1237 !important; }
body:has(.ed-indigo) .ed-codigo-barra span, body:has(.ed-indigo) .cb-ac { color: #1A1237 !important; }
body:has(.ed-indigo) .cb-ac { background: #ECEAF3 !important; }
body:has(.ed-indigo) .ed-codigo-barra { background: #F3F2F8 !important; }
body:has(.ed-indigo) .ed-codigo-cat li { color: #6B6585 !important; }
body:has(.ed-indigo) .ed-impl .ed-impl-ic svg, body:has(.ed-indigo) .ed-dif .ed-temas svg { stroke: #1A1237 !important; }
body:has(.ed-indigo) .ed-dif .ed-temas ul, body:has(.ed-indigo) .ed-impl .ed-pilula, body:has(.ed-indigo) .ed-impl .ed-impl-ic { background: #F3F2F8 !important; border-color: #E4E2EC !important; }
body:has(.ed-indigo) .ed-impl .ed-impl-lista li { border-color: #E4E2EC !important; box-shadow: 0 14px 30px -24px rgba(26,18,55,.45) !important; }
body:has(.ed-indigo) .ed-sombras path { stroke: #0D0820; }
body:has(.ed-indigo) .ed-k figcaption, body:has(.ed-indigo) .ed-painel-tag { background: rgba(26,18,55,.75); }
body:has(.ed-indigo) .ed-codigo-cat li.on { color: #fff !important; }
.pagina:has(.ed-topo) .ed-preco-rot { color: var(--brand-lime) !important; }
/* sombras da linha da marca atrás das seções: mais claras (08/11) */ .ed-sombras path { stroke: #6F5CFF !important; } .ed-sombras svg { opacity: .32; filter: blur(34px); }
.pagina:has(.ed-topo) .ed-kit2-txt > p:not(.ed-kit2-rot) { text-align: justify; text-align-last: left; hyphens: manual; -webkit-hyphens: manual; }

/* Seja parceiro: abertura em verde-lima no lugar do azul (09/11) */
.sp-topo { background: radial-gradient(circle at 75% 40%, #D8F02A 0%, var(--brand-lime) 60%) !important; color: var(--brand-ink); }
.masthead:has(.sp-topo) { background: var(--brand-lime) !important; }
.sp-topo h1 { color: var(--brand-ink) !important; }
.sp-topo .sp-v { color: #1645BB; }
.sp-lede { color: #2B2350 !important; }
.sp-topo .sp-btn { background: var(--brand-ink); color: #fff; }
.sp-topo .sp-btn:hover { background: #1645BB; }
.sp-laco path { stroke: #fff !important; }
.sp-topo-foto img { filter: drop-shadow(-14px 18px 22px rgba(26,18,55,.28)) drop-shadow(0 2px 4px rgba(26,18,55,.15)); }
/* cabeçalho escuro sobre o verde */
.masthead:has(.sp-topo) .site-header .brand { color: var(--brand-ink) !important; }
.masthead:has(.sp-topo) .menu-toggle { background: var(--brand-ink) !important; color: #fff !important; }
@media (min-width: 1180px) {
  .masthead:has(.sp-topo) .nav-list > li > a, .masthead:has(.sp-topo) .nav-sub-btn { color: var(--brand-ink) !important; }
  .masthead:has(.sp-topo) .site-header .nav-list > li > a:hover, .masthead:has(.sp-topo) .site-header .nav-sub-btn:hover, .masthead:has(.sp-topo) .site-header .nav-sub-btn[aria-expanded="true"] { background-color: rgba(26,18,55,.08) !important; color: var(--brand-ink) !important; }
  .masthead:has(.sp-topo) .nav-actions .btn--light { background: #fff !important; color: var(--brand-ink) !important; }
  .masthead:has(.sp-topo) .nav-actions .btn--ink { background: var(--brand-ink) !important; color: #fff !important; box-shadow: none !important; }
}
.sp-porque { box-shadow: 0 -10px 24px -14px rgba(26,18,55,.18) !important; }
/* foto começa abaixo do menu */
@media (min-width: 1180px) {
  .sp-topo-foto { top: auto !important; height: calc(100% - 190 * var(--u)) !important; width: calc(720 * var(--u)) !important; }
  .sp-topo-foto picture { top: 0; }
  .sp-topo-foto img { max-height: 100% !important; width: auto !important; max-width: 100%; }
}

/* Seja parceiro: painel "Vamos conversar?" em verde-lima (09/11) */
.sp-conv-painel { background: var(--brand-lime) !important; color: var(--brand-ink) !important; }
.sp-conv-caixa { background: linear-gradient(90deg, var(--brand-lime) calc(var(--sp-g, 0px) + 2px), #fff 0) !important; }
@media (max-width: 1023.98px) { .sp-conv-caixa { background: #fff !important; } }
.sp-conv-painel h2 { color: var(--brand-ink) !important; }
.sp-conv-painel h2 span { color: #1645BB !important; }
.sp-conv-ic { color: var(--brand-ink) !important; }
.sp-conv-painel p { color: #2B2350 !important; text-align: left !important; text-wrap: pretty; }
.sp-conv-faixa { border-color: #fff !important; opacity: .7; }

/* Trabalhe conosco: botões e menus verdes passam para o azul índigo da Bobby #1A1237 (09/11) */
.tc-btn { background: #1A1237 !important; color: #fff !important; box-shadow: 0 12px 26px -14px rgba(26,18,55,.6) !important; }
.tc-btn:hover { background: #1645BB !important; }
body:has(.tc-topo) .barra-acao .btn--lime { background: #1A1237 !important; color: #fff !important; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35); }
body:has(.tc-topo) .barra-acao .btn--lime:hover { background: #1645BB !important; }
body:has(.tc-topo) .site-header .btn--lime, body:has(.tc-topo) .site-header .btn--light { background: #1A1237 !important; color: #fff !important; }

/* Trabalhe conosco: barra fixa do menu e rodapé em verde-lima, textos e botões em índigo (09/11) */
body:has(.tc-topo) .barra-acao { background: rgba(203,231,0,.96) !important; box-shadow: 0 10px 30px -18px rgba(26,18,55,.45); }
body:has(.tc-topo) .barra-acao .brand { color: #1A1237 !important; }
body:has(.tc-topo) .barra-acao .barra-link { color: #1A1237 !important; }
body:has(.tc-topo) .barra-acao .btn--lime { box-shadow: none !important; }
.masthead:has(.tc-topo) .site-footer { background: var(--brand-lime) !important; color: #1A1237 !important; }
.masthead:has(.tc-topo) .site-footer .brand { color: #1A1237 !important; }
.masthead:has(.tc-topo) .site-footer h2, .masthead:has(.tc-topo) .site-footer a, .masthead:has(.tc-topo) .site-footer p,
.masthead:has(.tc-topo) .site-footer address, .masthead:has(.tc-topo) .site-footer span, .masthead:has(.tc-topo) .site-footer button { color: #1A1237 !important; }
.masthead:has(.tc-topo) .footer-legal { border-top-color: rgba(26,18,55,.18) !important; color: rgba(26,18,55,.75) !important; }
.masthead:has(.tc-topo) .site-footer *:focus-visible { outline-color: #1A1237; }
@media (min-width: 600px) { .sp-topo h1 .ln:first-child { white-space: nowrap; } }