@font-face { font-family: "Lexend"; font-weight: 600; font-style: normal; font-display: swap; src: url("fontes/lexend-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 400; font-style: normal; font-display: swap; src: url("fontes/dm-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 500; font-style: normal; font-display: swap; src: url("fontes/dm-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 600; font-style: normal; font-display: swap; src: url("fontes/dm-sans-latin-600-normal.woff2") format("woff2"); }

/* Site institucional Tiscuto (25/10). Layout: site institucional em faixas. Faixas claras (Papel) para ler; faixas escuras com foto de fundo para afirmar.
   Texto alinhado à esquerda, coluna de leitura estreita, sem cartões repetidos. */
:root {
  --papel: #F0E9E0;
  --papel-2: #E8DFD3;
  --branco: #FFFDFB;
  --ameixa: #40224D;
  --ameixa-fundo: #2A1636;
  --violeta: #73579C;
  --lavanda: #D9CFE8;
  --damasco: #E59D74;
  --tinta: #40224D;
  --tinta-suave: #6B5A73;
  --linha: #DCD1C4;
  --sobre-escuro: #F0E9E0;
  --sobre-escuro-suave: rgba(240, 233, 224, .78);
  --titulo: "Lexend", "DM Sans", system-ui, sans-serif;
  --texto: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --largura: 1180px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --papel: #1E1424; --papel-2: #261A2E; --branco: #2A1E31; --tinta: #F0E9E0; --tinta-suave: #BCADC5; --linha: #3D2E46;
    --violeta: #C3B2DE; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --papel: #1E1424; --papel-2: #261A2E; --branco: #2A1E31; --tinta: #F0E9E0; --tinta-suave: #BCADC5; --linha: #3D2E46;
  --violeta: #C3B2DE; color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
img { max-width: 100%; }
body { background: var(--papel); color: var(--tinta); font: 400 17px/1.6 var(--texto); }
h1, h2, h3 { font-family: var(--titulo); font-weight: 600; line-height: 1.12; letter-spacing: -.02em; margin: 0; text-wrap: balance; }
p { margin: 0; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--damasco); outline-offset: 3px; }

.faixa { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.dentro { max-width: var(--largura); margin-inline: auto; }
.sobretitulo { font: 600 .78rem/1.2 var(--texto); letter-spacing: .12em; text-transform: uppercase; color: var(--violeta); }
.escura .sobretitulo { color: var(--damasco); }

/* Botões */
.botao { display: inline-flex; align-items: center; gap: .5rem; font: 600 .98rem/1 var(--texto); padding: .95rem 1.35rem; border-radius: 6px; text-decoration: none; border: 1.5px solid transparent; }
.botao.principal { background: var(--damasco); color: #2A1636; }
.botao.principal:hover { background: #EDB08D; }
.botao.contorno { border-color: rgba(240, 233, 224, .55); color: var(--sobre-escuro); }
.botao.contorno:hover { border-color: var(--sobre-escuro); }

/* Topo */
.topo { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 10; background: var(--ameixa-fundo); color: var(--sobre-escuro); padding-block: 14px; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 11; background: var(--ameixa-fundo); }
.topo .dentro { display: flex; align-items: center; gap: 32px; }
.topo img { width: 132px; height: auto; display: block; }
.topo nav { display: flex; gap: 26px; font-size: .94rem; margin-left: auto; }
.topo nav a { text-decoration: none; color: var(--sobre-escuro-suave); }
.topo nav a:hover { color: var(--sobre-escuro); }
.topo .acoes-topo { display: flex; gap: 12px; align-items: center; }
.topo .relatar { font-size: .9rem; color: var(--sobre-escuro-suave); text-decoration: none; border-bottom: 1px solid rgba(240,233,224,.35); }
.topo .botao { padding: .7rem 1rem; font-size: .9rem; }

/* Faixas com foto de fundo */
.escura { position: relative; isolation: isolate; color: var(--sobre-escuro); background: var(--ameixa-fundo); overflow: hidden; }
.escura > .fundo { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.escura::after { content: ""; position: absolute; inset: 0; z-index: -1; }

/* Abertura */
.abertura { padding-block: clamp(80px, 12vw, 150px) clamp(64px, 9vw, 110px); }
.abertura > .fundo { object-position: 85% 40%; }
.abertura::after { background: linear-gradient(90deg, rgba(42,22,54,.96) 0%, rgba(42,22,54,.86) 38%, rgba(42,22,54,.35) 70%, rgba(42,22,54,.15) 100%), linear-gradient(0deg, rgba(42,22,54,.6), transparent 40%); }
.abertura .dentro { display: flex; flex-direction: column; gap: 28px; }
.abertura h1 { font-size: clamp(2.5rem, 6vw, 4.6rem); max-width: 13ch; }
.abertura .lide { font-size: clamp(1.08rem, 1.6vw, 1.25rem); max-width: 34rem; color: var(--sobre-escuro-suave); }
.abertura .acoes { display: flex; gap: 14px; flex-wrap: wrap; }
.abertura .base-legal { display: flex; gap: 10px 28px; flex-wrap: wrap; padding-top: 24px; margin-top: 12px; border-top: 1px solid rgba(240,233,224,.18); max-width: 40rem; font-size: .9rem; color: var(--sobre-escuro-suave); }
.abertura .base-legal strong { color: var(--sobre-escuro); font-weight: 600; }

/* Bloco de texto padrão */
.secao { padding-block: clamp(72px, 9vw, 120px); }
.cabeca-secao { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 24px 64px; align-items: end; margin-bottom: 56px; }
.cabeca-secao h2 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); }
.cabeca-secao p { color: var(--tinta-suave); max-width: 36rem; }

/* Três públicos: linhas, não cartões */
.publicos { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--linha); }
.publico { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 5fr) minmax(0, 3fr); gap: 16px 48px; padding-block: 30px; border-bottom: 1px solid var(--linha); align-items: baseline; }
.publico h3 { font-size: 1.35rem; }
.publico .quem { font-size: .92rem; color: var(--tinta-suave); margin-top: 6px; }
.publico p { color: var(--tinta-suave); }
.publico .frase { font-family: var(--titulo); font-weight: 500; color: var(--violeta); font-size: 1.05rem; }

/* Como funciona: sequência real */
.etapas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: etapa; }
.etapas li { padding: 28px 28px 8px 0; border-top: 2px solid var(--tinta); counter-increment: etapa; display: flex; flex-direction: column; gap: 10px; }
.etapas li + li { padding-left: 28px; border-left: 1px solid var(--linha); }
.etapas li::before { content: counter(etapa, decimal-leading-zero); font: 600 .85rem/1 var(--texto); color: var(--violeta); letter-spacing: .08em; }
.etapas h3 { font-size: 1.15rem; }
.etapas p { color: var(--tinta-suave); font-size: .97rem; }
.etapas .prazo { font-size: .85rem; color: var(--tinta); font-weight: 600; }

/* Para quem decide: faixa com foto */
.decide { padding-block: clamp(80px, 10vw, 130px); }
.decide > .fundo { object-position: 70% 30%; }
/* Texto à esquerda, gente à direita (como nas outras faixas com foto). */
.decide::after { background: linear-gradient(90deg, rgba(42,22,54,.97) 0%, rgba(42,22,54,.9) 42%, rgba(42,22,54,.35) 72%, rgba(42,22,54,.15) 100%); }
.decide .dentro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; }
.decide .conteudo { grid-column: 1; display: flex; flex-direction: column; gap: 26px; }
.decide h2 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); }
.decide .lide { color: var(--sobre-escuro-suave); }
.provas { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.provas li { display: grid; grid-template-columns: 12px minmax(0, 1fr); gap: 14px; padding-block: 14px; border-top: 1px solid rgba(240,233,224,.16); }
.provas li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--damasco); margin-top: .55em; }
.provas strong { font-weight: 600; color: var(--sobre-escuro); }
.provas span { color: var(--sobre-escuro-suave); }

/* Anonimato: o que a empresa nunca vê */
.sigilo .dentro { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px 72px; }
.sigilo h2 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); }
.sigilo .lado p { color: var(--tinta-suave); margin-top: 18px; max-width: 30rem; }
.tabela-sigilo { width: 100%; border-collapse: collapse; font-size: .97rem; }
.tabela-sigilo th { text-align: left; font: 600 .76rem/1.2 var(--texto); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-suave); padding: 0 0 12px; border-bottom: 2px solid var(--tinta); }
.tabela-sigilo td { padding: 16px 16px 16px 0; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela-sigilo td:first-child { font-weight: 600; width: 38%; }
.tabela-sigilo td:last-child { color: var(--tinta-suave); }

/* Parceiros: faixa com foto */
.parceiros { padding-block: clamp(80px, 10vw, 130px); }
.parceiros > .fundo { object-position: 65% 12%; }
.parceiros::after { background: linear-gradient(90deg, rgba(42,22,54,.97) 0%, rgba(42,22,54,.88) 42%, rgba(42,22,54,.35) 75%, rgba(42,22,54,.2) 100%); }
.parceiros .dentro { display: flex; flex-direction: column; gap: 24px; }
.parceiros h2 { font-size: clamp(2rem, 4.2vw, 3.3rem); max-width: 15ch; }
.parceiros .lide { max-width: 34rem; color: var(--sobre-escuro-suave); }
.parceiros .perfis { display: flex; flex-wrap: wrap; gap: 10px 26px; font-size: .95rem; color: var(--sobre-escuro); max-width: 36rem; }
.parceiros .perfis span { display: inline-flex; align-items: center; gap: 10px; }
.parceiros .perfis span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--damasco); }

/* Trilha educativa */
.trilha .artigos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.artigo { display: flex; flex-direction: column; gap: 12px; padding-top: 22px; border-top: 1px solid var(--linha); text-decoration: none; }
.artigo .tema { font: 600 .76rem/1.2 var(--texto); letter-spacing: .1em; text-transform: uppercase; color: var(--violeta); }
.artigo h3 { font-size: 1.25rem; }
.artigo p { color: var(--tinta-suave); font-size: .97rem; }
.artigo:hover h3 { text-decoration: underline; text-underline-offset: 4px; }

/* Chamada final */
.final { background: var(--branco); padding-block: clamp(64px, 8vw, 100px); }
.final .dentro { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px 64px; align-items: center; }
.final h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
.final p { color: var(--tinta-suave); margin-top: 14px; }
.final .acoes { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.final .botao.principal { background: var(--ameixa); color: #F0E9E0; }
.final .botao.principal:hover { background: #4E2B5E; }
.final .relato { font-size: .92rem; color: var(--tinta-suave); }

/* Rodapé */
.rodape { background: var(--ameixa-fundo); color: var(--sobre-escuro-suave); padding-block: 56px 40px; font-size: .92rem; }
.rodape .dentro { display: grid; grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 2fr)); gap: 32px; }
.rodape img { width: 124px; height: auto; display: block; margin-bottom: 14px; }
.rodape h3 { font: 600 .76rem/1.2 var(--texto); letter-spacing: .1em; text-transform: uppercase; color: var(--sobre-escuro); margin-bottom: 12px; }
.rodape ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rodape a { text-decoration: none; }
.rodape a:hover { color: var(--sobre-escuro); }
.rodape .legal { grid-column: 1 / -1; border-top: 1px solid rgba(240,233,224,.14); padding-top: 22px; margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: .85rem; }

.topo .marca-topo { display: block; }
.topo .entrar { font-size: .9rem; font-weight: 600; color: var(--sobre-escuro); text-decoration: none; }
.topo .entrar:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Entrar */
.pagina-entrar { padding-block: clamp(56px, 8vw, 96px); }
.entrar-cabeca { display: flex; flex-direction: column; gap: 12px; margin-bottom: 40px; }
.entrar-cabeca h1 { font-size: clamp(2.2rem, 4.4vw, 3.2rem); }
.entrar-cabeca p { color: var(--tinta-suave); }
.entradas { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); max-width: 980px; gap: 24px; align-items: start; }
.entrada { display: flex; flex-direction: column; gap: 12px; padding: 28px; border: 1px solid var(--linha); border-radius: 8px; }
.entrada.principal { background: var(--branco); }
.entrada h2 { font-size: 1.35rem; }
.entrada p { color: var(--tinta-suave); }
.entrada .botao { align-self: flex-start; margin-top: 6px; }
.form-empresa { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.form-empresa label { font-weight: 600; font-size: .95rem; }
.campo-endereco { display: flex; align-items: stretch; border: 1px solid var(--tinta-suave); border-radius: 6px; background: var(--branco); overflow: hidden; }
.campo-endereco:focus-within { outline: 2px solid var(--violeta); outline-offset: 2px; }
.campo-endereco .prefixo { display: flex; align-items: center; padding-inline: 12px; background: var(--papel-2); color: var(--tinta-suave); font-size: .95rem; white-space: nowrap; }
.campo-endereco input { flex: 1; min-width: 0; border: 0; padding: .8rem .9rem; font: 400 1rem/1.4 var(--texto); color: var(--tinta); background: transparent; outline: none; }
.ajuda-site { font-size: .88rem; color: var(--tinta-suave); }
.erro-site { font-size: .92rem; color: #A5281F; }
.botao.escuro { background: var(--ameixa); color: #F0E9E0; border: 0; cursor: pointer; }
.botao.escuro:hover { background: #4E2B5E; }
.botao.contorno-escuro { border-color: var(--tinta); color: var(--tinta); }
.botao.contorno-escuro:hover { background: var(--papel-2); }
.aviso-relato { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--linha); color: var(--tinta-suave); max-width: 44rem; }
.aviso-relato strong { color: var(--tinta); }

@media (max-width: 960px) {
  .topo nav { display: none; }
  .topo .acoes-topo { margin-left: auto; }
  .topo .relatar { display: none; }
  .entradas { grid-template-columns: minmax(0, 1fr); }
  .cabeca-secao, .sigilo .dentro, .final .dentro, .decide .dentro { grid-template-columns: minmax(0, 1fr); }
  .decide .conteudo { grid-column: 1; }
  .decide::after { background: rgba(42,22,54,.86); }
  .publico { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .etapas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 28px; }
  .etapas li:nth-child(3) { padding-left: 0; border-left: 0; }
  .trilha .artigos { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .rodape .dentro { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .rodape .dentro > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .etapas { grid-template-columns: minmax(0, 1fr); }
  .etapas li + li { padding-left: 0; border-left: 0; }
  .abertura::after, .parceiros::after { background: rgba(42,22,54,.82); }
  .tabela-sigilo td:first-child { width: auto; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* Fundos em movimento (pedido de 25/10): zoom lento, de aproximar e afastar; na abertura, três fotos se revezam.
   Quem pede menos movimento no sistema vê a primeira foto parada. */
.escura > .fundo { will-change: transform; animation: aproximar 28s ease-in-out infinite alternate; }
.decide > .fundo { animation-duration: 32s; animation-direction: alternate-reverse; }
.parceiros > .fundo { animation-duration: 30s; }
@keyframes aproximar { from { transform: scale(1.02); } to { transform: scale(1.12); } }
.abertura > .fundo { opacity: 0; animation: revezar 24s ease-in-out infinite; }
.abertura > .fundo:nth-of-type(1) { animation-delay: 0s; }
.abertura > .fundo:nth-of-type(2) { animation-delay: -16s; }
.abertura > .fundo:nth-of-type(3) { animation-delay: -8s; }
@keyframes revezar {
  0% { opacity: 1; transform: scale(1.02); }
  28% { opacity: 1; }
  34% { opacity: 0; transform: scale(1.1); }
  96% { opacity: 0; transform: scale(1.02); }
  100% { opacity: 1; transform: scale(1.02); }
}
@media (prefers-reduced-motion: reduce) {
  .escura > .fundo { animation: none; transform: none; }
  .abertura > .fundo:nth-of-type(1) { opacity: 1; }
}