/* Walk Productions · site v4, versão 5 (espinha: creativecue.co)
   Medidas tiradas da captura em 1920 px (container de 1440, grade de 5 colunas de 288).
   Cor e vozes: material-site/identidade.md. Contraste de cada par no README. */

@font-face { font-family: "Switzer"; src: url("../fonts/switzer-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("../fonts/switzer-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("../fonts/inter-var-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Cormorant Upright"; src: url("../fonts/cormorant-upright-500-latin.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("../fonts/dm-mono-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("../fonts/dm-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  /* cor (identidade.md) */
  --fundo: #08080a;
  --fundo-2: #101014;
  --linha: #1e1e22;
  --tinta: #fafafa;
  --tinta-2: #a1a1a6;
  --bone: #f2efe6;
  --sinal: #EE3A0C;
  --fio: rgba(255, 255, 255, .1);      /* as linhas de 1 px da referência: branco a 10% */
  --fantasma: rgba(71, 71, 71, .2);    /* número (01) de 144 px: #474747 a 20%, medido */

  /* vozes */
  --afirma: "Switzer", "Helvetica Neue", Arial, sans-serif;           /* no lugar da Neue Haas */
  --corpo: "Inter Display", "Inter", system-ui, sans-serif;           /* Inter, eixo opsz 32 */
  --emocao: "Cormorant Upright", "Cormorant", Georgia, serif;         /* no lugar da Hermaiona */
  --mono: "DM Mono", ui-monospace, monospace;

  /* grade */
  --largura: 1440px;
  --calha: 48px;
  --col: calc(var(--caixa) / 5);
  --caixa: min(var(--largura), 100vw - var(--calha) * 2);

  /* movimento (movimento.md / identidade.md) */
  --entra: cubic-bezier(.215, .61, .355, 1);   /* featureIn medido */
  --curva: cubic-bezier(.9, 0, .1, 1);         /* Varredura da Walk */
  --macia: cubic-bezier(.16, 1, .3, 1);

  --mx: -999px; --my: -999px;   /* posição do ponteiro, para o brilho das linhas */
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--tinta);
  font-family: var(--afirma);
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img, video, canvas, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
::selection { background: var(--sinal); color: var(--fundo); }
:focus-visible { outline: 1px solid var(--sinal); outline-offset: 4px; }

.hud { font-family: var(--mono); font-weight: 400; font-size: 11px; line-height: 16px; letter-spacing: .06em; text-transform: uppercase; color: var(--tinta-2); }
.sinal { color: var(--sinal); }
em { font-family: var(--emocao); font-style: normal; font-weight: 500; color: var(--sinal); font-size: 1.16em; letter-spacing: 0; line-height: .8; }

.pular { position: absolute; left: 16px; top: -60px; z-index: 3000; background: var(--sinal); color: var(--fundo); padding: 8px 12px; font: 500 14px var(--corpo); }
.pular:focus { top: 16px; }

/* ---------- 01 · linhas fixas ---------- */
.linhas { position: fixed; inset: 0; width: var(--caixa); margin: 0 auto; display: flex; justify-content: space-between; pointer-events: none; z-index: 1050; }
.linhas span { width: 1px; height: 100%; background:
  radial-gradient(280px circle at 0 var(--my), rgba(255,255,255,.35), transparent 70%),
  var(--fio); }

.linha-h { display: block; height: 1px; width: 100%; background:
  radial-gradient(280px circle at var(--lx, -999px) 0, rgba(255,255,255,.4), transparent 70%),
  var(--fio); }

/* ---------- CTA (texto sublinhado + ícone de pontos) ---------- */
.cta { position: relative; display: inline-flex; align-items: center; gap: 12px; width: 288px; max-width: 100%; padding: 8px 6px; font: 500 14px/24px var(--corpo); color: var(--tinta); flex: none; align-self: flex-end; }
.cta::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--fio); }
.cta::before { content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%; background: var(--sinal); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--curva); z-index: 1; }
.cta:hover::before, .cta:focus-visible::before { transform: scaleX(1); }
.cta__icone { position: relative; width: 24px; height: 24px; flex: none; background:
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 11px 1px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 18px 4px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 21px 11px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 18px 18px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 11px 21px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 4px 18px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 1px 11px / 2px 2px no-repeat,
  radial-gradient(circle, var(--tinta) 1px, transparent 1.5px) 4px 4px / 2px 2px no-repeat;
  animation: gira 20s linear infinite; }
.cta__icone::after { content: ""; position: absolute; left: 8px; top: 11px; width: 8px; height: 2px; background: var(--sinal); transition: transform .3s var(--macia); }
.cta:hover .cta__icone::after { transform: translateX(3px); }
@keyframes gira { to { transform: rotate(360deg); } }

/* ---------- 03 · botão flutuante ---------- */
.flutua { position: fixed; left: 50%; bottom: 24px; z-index: 1100; transform: translate(-50%, 140%); transition: transform .8s var(--macia); }
.flutua.visivel { transform: translate(-50%, 0); }
.flutua__dentro { display: flex; align-items: center; padding: 18px 36px; background: rgba(0,0,0,.2); border: 1px solid rgba(255,255,255,.08); -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2); }
.flutua__simbolo { width: 40px; height: 40px; margin-right: 36px; }
.flutua__simbolo svg, .assina__simbolo svg { width: 100%; height: 100%; fill: var(--bone); }

.hamburguer { position: relative; z-index: 1300; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 7px; width: 36px; height: 36px; }
.hamburguer i { display: block; height: 1px; width: 36px; background: var(--tinta); border-radius: 9999px; transition: transform .5s var(--curva), width .5s var(--curva); }
.hamburguer i + i { width: 22px; }
.menu-aberto .hamburguer i:first-child { transform: translateY(4px) rotate(45deg); }
.menu-aberto .hamburguer i + i { width: 36px; transform: translateY(-4px) rotate(-45deg); }

/* ---------- 04 · cabeçalho ---------- */
.topo { position: absolute; top: 0; left: 0; right: 0; z-index: 1200; }
.topo__dentro { width: var(--caixa); margin: 0 auto; height: 100px; padding-top: 64px; display: flex; justify-content: space-between; align-items: flex-start; }
.topo__logo { display: flex; align-items: center; gap: 10px; height: 16px; margin-top: 10px; }
.topo__logo svg { width: 16px; height: 16px; fill: var(--bone); }
.topo__logo span { font: 500 16px/16px var(--afirma); letter-spacing: .32em; color: var(--tinta); }
.topo__acoes { display: flex; align-items: center; gap: 36px; height: 36px; }
.topo__link { display: flex; align-items: center; gap: 36px; padding: 8px 6px; font: 400 14px/20px var(--corpo); color: #bdbdbd; color: var(--tinta-2); transition: color .3s; }
.topo__link:hover { color: var(--tinta); }
.topo__idioma { color: var(--tinta-2); }
.menu-aberto .topo__link { opacity: 0; pointer-events: none; }

/* ---------- 02 · menu em tela cheia ---------- */
.menu { position: fixed; inset: 0; z-index: 1150; background: rgba(8,8,10,.94); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); opacity: 0; visibility: hidden; transition: opacity .5s var(--entra), visibility 0s .5s; }
.menu-aberto .menu { opacity: 1; visibility: visible; transition: opacity .5s var(--entra); }
.menu__dentro { width: var(--caixa); height: 100%; margin: 0 auto; padding: 164px 0 36px; display: flex; flex-direction: column; justify-content: space-between; }
.menu__links { display: flex; flex-direction: column; gap: 16px; }
.menu__links a { font: 500 44px/44px var(--afirma); letter-spacing: -.01em; width: max-content; opacity: 0; transform: translateY(24px); transition: opacity .4s var(--entra), transform .6s var(--entra), color .3s; }
.menu__links a:hover { color: var(--sinal); }
.menu-aberto .menu__links a { opacity: 1; transform: none; }
.menu-aberto .menu__links a:nth-child(2) { transition-delay: .04s; } .menu-aberto .menu__links a:nth-child(3) { transition-delay: .08s; }
.menu-aberto .menu__links a:nth-child(4) { transition-delay: .12s; } .menu-aberto .menu__links a:nth-child(5) { transition-delay: .16s; }
.menu-aberto .menu__links a:nth-child(6) { transition-delay: .2s; } .menu-aberto .menu__links a:nth-child(7) { transition-delay: .24s; }

.assina { display: flex; align-items: center; gap: 40px; padding: 24px 32px; }
.assina__simbolo { width: 40px; height: 40px; flex: none; margin-right: 120px; }
.assina__texto { max-width: 380px; font: 500 14px/20px var(--corpo); letter-spacing: -.005em; color: #767676; color: var(--tinta-2); }
.assina__redes { margin-left: auto; display: flex; gap: 24px; }
.assina__redes a { opacity: .8; transition: opacity .3s, color .3s; }
.assina__redes a:hover { opacity: 1; color: var(--tinta); }

/* ---------- cabeçalho de seção (número fantasma + título + descrição em 3 camadas) ---------- */
.secao { width: var(--caixa); margin: 0 auto; display: flex; flex-direction: column; padding-top: 72px; }
.cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 64px; margin-bottom: 72px; }
.cab__conteudo { position: relative; display: flex; flex-direction: column; gap: 24px; padding-top: 80px; flex: 1; min-width: 0; }
.cab__num { position: absolute; left: -4px; top: 0; font: 500 144px/120px var(--afirma); letter-spacing: -.01em; color: var(--fantasma); pointer-events: none; user-select: none; z-index: -1; }
.cab__titulo { position: relative; max-width: 600px; font: 500 42px/46px var(--afirma); letter-spacing: -.01em; text-wrap: balance; }
.cab--largo .cab__titulo { max-width: 700px; }
.desc { display: grid; position: relative; }
.desc > p { grid-area: 1 / 1; max-width: 440px; font: 400 14px/20px var(--corpo); letter-spacing: -.01em; color: var(--tinta-2); }
.desc__fantasma { opacity: .1; transform: translate(55px, 31px); pointer-events: none; user-select: none; }
.desc__fantasma--2 { transform: translate(110px, -15.5px); }
.cab--largo .desc > p { max-width: 527px; }

/* ---------- 05 · hero ---------- */
.hero { position: relative; height: max(996px, 100svh); display: flex; overflow: hidden; }
.hero__leque { position: absolute; left: 50%; top: 132px; width: var(--largura); height: 948px; transform: translateX(-50%) translateX(216px); perspective: 1600px; pointer-events: none; }
.leque { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; }
.leque img { position: absolute; left: 720px; top: 341px; width: 700px; height: auto; transform-origin: 0 0; will-change: transform; backface-visibility: hidden; box-shadow: 0 0 0 1px rgba(255,255,255,.04); }
.hero__dentro { position: relative; z-index: 2; width: var(--caixa); margin: auto auto 0; padding-bottom: 72px; display: flex; flex-direction: column; }
.hero__status { display: flex; align-items: center; gap: 10px; margin-bottom: 36px; }
.rec { position: relative; width: 6px; height: 6px; border-radius: 9999px; background: var(--sinal); }
.rec::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; border-radius: 9999px; background: var(--sinal); transform: translate(-50%, -50%); animation: ping 3s ease-in-out infinite; }
@keyframes ping { 0% { opacity: .6; transform: translate(-50%,-50%) scale(1); } 70%, 100% { opacity: 0; transform: translate(-50%,-50%) scale(2.5); } }
.hero__titulo { max-width: 493px; margin-bottom: 24px; font: 500 42px/49px var(--afirma); letter-spacing: -.01em; }
.hero__linha { max-width: 421px; margin-bottom: 36px; font: 400 14px/20px var(--corpo); letter-spacing: -.01em; color: var(--tinta-2); }
.hero .cta { align-self: flex-start; }

/* ---------- 06 · clientes ---------- */
.clientes { width: var(--caixa); margin: 0 auto; padding: 72px 0; display: grid; grid-template-columns: calc(var(--col) * 1) 1fr; gap: 0; }
.clientes__rotulo { max-width: 180px; font: 400 14px/20px var(--corpo); color: var(--tinta-2); }
.clientes__grade { display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 40px; column-gap: 24px; align-items: center; }
.clientes__grade li { font: 500 19px/22px var(--afirma); letter-spacing: -.01em; color: var(--tinta); opacity: .82; }
.clientes__grade li.hud { font-size: 11px; line-height: 16px; opacity: 1; }

/* ---------- 07 · equipe + 8 fatos ---------- */
.fatos { display: flex; flex-wrap: wrap; gap: 72px; margin-bottom: 72px; }
.fato { width: 300px; display: flex; flex-direction: column; }
.fato__glifo { height: 200px; position: relative; opacity: .7; }
.fato__glifo svg { position: absolute; left: 0; top: 50px; width: 76px; height: 76px; fill: var(--bone); }
.fato__num { font: 500 14px/20px var(--afirma); color: var(--tinta); opacity: .4; margin-bottom: 4px; }
.fato__titulo { font: 500 28px/32.68px var(--afirma); letter-spacing: -.01em; margin-bottom: 20px; }
.fato__texto { max-width: 250px; font: 400 14px/20px var(--corpo); letter-spacing: -.01em; color: var(--tinta-2); }

/* ---------- 08 · processo ---------- */
.processo .cab { margin-bottom: 72px; }
.etapas { display: flex; flex-direction: column; }
.etapa { position: relative; display: flex; min-height: 350px; }
.etapa__texto { position: relative; width: calc(var(--col) * 2); flex: none; padding: 136px 64px 96px 0; background: var(--fundo); }
.etapa--inversa .etapa__texto { padding-left: 72px; padding-right: 0; }
.etapa__num { position: absolute; top: 96px; left: -4px; font: 500 72px/72px var(--afirma); color: var(--fantasma); z-index: 0; }
.etapa--inversa .etapa__num { left: 68px; }
.etapa__hud { position: relative; margin-bottom: 10px; }
.etapa__titulo { position: relative; max-width: 305px; margin-bottom: 24px; font: 500 28px/32px var(--afirma); letter-spacing: -.01em; }
.etapa__linha { position: relative; max-width: 352px; font: 400 14px/20px var(--corpo); letter-spacing: -.01em; color: var(--tinta-2); }
.etapa__visual { position: relative; flex: 1; min-width: 0; overflow: hidden; }
.etapa__grade { position: absolute; inset: 0; width: 40%; background: repeating-linear-gradient(90deg, rgba(255,255,255,.07) 0 1px, transparent 1px 12px); -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%, #000 60%, transparent); mask-image: linear-gradient(90deg, transparent, #000 40%, #000 60%, transparent); }
.etapa--inversa .etapa__grade { left: auto; right: 0; }
.painel { position: absolute; left: 170px; top: 40px; width: min(562px, calc(100% - 210px)); background: var(--fundo-2); border: 1px solid rgba(255,255,255,.08); padding: 24px 28px; font: 400 14px/20px var(--corpo); }
.etapa--inversa .painel { left: 182px; }
.painel__topo { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.08); }
.painel__nome { display: flex; flex-direction: column; gap: 4px; font: 500 18px/24px var(--afirma); }
.painel__nome small { font-size: 10px; }
.painel__tag { font-size: 10px; color: var(--tinta-2); border: 1px solid rgba(255,255,255,.12); padding: 2px 8px; }
.painel__tag--base { display: inline-block; margin-top: 16px; }
.painel__linhas li { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.06); color: var(--tinta); }
.painel__linhas li:last-child { border-bottom: 0; }
.doc { display: grid; gap: 0; }
.doc div { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.doc div:last-child { border-bottom: 0; }
.doc dd { margin: 0; color: var(--tinta); }
.anel { position: relative; width: 48px; height: 48px; border-radius: 9999px; background: conic-gradient(var(--sinal) calc(var(--p) * 360deg), rgba(255,255,255,.1) 0); display: grid; place-items: center; flex: none; }
.anel::before { content: ""; position: absolute; inset: 3px; border-radius: 9999px; background: var(--fundo-2); }
.anel b { position: relative; font: 500 10px var(--mono); color: var(--tinta); }
.painel--imagem { padding: 0; }
.painel--imagem img { width: 100%; height: auto; opacity: .9; }
.painel__chip { position: absolute; left: 16px; bottom: 16px; background: var(--fundo); color: var(--tinta); padding: 6px 10px; border: 1px solid rgba(255,255,255,.12); }

/* ---------- 09 · serviços ---------- */
.servicos .cab { margin-bottom: 80px; }
.servicos__video { position: relative; overflow: hidden; }
.servicos__quadro { position: relative; aspect-ratio: 1440 / 860; overflow: hidden; transform-origin: 50% 0; }
.servicos__quadro video { width: 100%; height: 100%; object-fit: cover; }
.servicos__legenda { position: absolute; left: 16px; bottom: 14px; color: var(--tinta); background: rgba(8,8,10,.7); padding: 4px 8px; }
.verbos { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); padding-bottom: 144px; }
.verbo { position: relative; padding: 0 28px 0 28px; border-left: 1px solid var(--fio); min-height: 100%; }
.verbo:first-child { border-left: 0; padding-left: 0; }
.verbo__corpo { margin-top: calc(72px + var(--i) * 132px); padding-top: 40px; }
.verbo__num { display: block; font: 500 14px/20px var(--afirma); opacity: .4; margin-bottom: 6px; }
.verbo__titulo { font: 500 42px/46px var(--afirma); letter-spacing: -.01em; margin-bottom: 56px; }
.verbo__lista li { display: flex; gap: 8px; padding: 2px 0; font: 400 14px/20.6px var(--corpo); color: var(--tinta); }
.verbo__lista li span { flex: none; font-family: var(--corpo); font-size: 10px; color: var(--tinta-2); padding-top: 1px; }
.servicos__fecho { display: flex; justify-content: flex-end; padding-bottom: 72px; }

/* ---------- 10 · trabalho ---------- */
.cartoes { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.cartao { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 560px; background: var(--fundo-2); outline: 1px solid rgba(255,255,255,.06); outline-offset: -1px; overflow: hidden; isolation: isolate; }
.cartao__midia { position: absolute; inset: 0; z-index: -1; }
.cartao__midia img { position: absolute; left: 0; top: -17px; width: 100%; height: 82%; object-fit: cover; object-position: top; filter: grayscale(1); opacity: .5; transition: filter .6s var(--entra), opacity .6s var(--entra), transform .9s var(--macia); }
.cartao__midia::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(16,16,20,0) 20%, var(--fundo-2) 78%); }
a.cartao:hover .cartao__midia img, a.cartao:focus-visible .cartao__midia img { filter: grayscale(0); opacity: .75; transform: translateX(6px); }
.cartao--sistema .cartao__midia::after { display: none; }
.modulos { position: absolute; left: 40px; top: 40px; right: 40px; display: flex; flex-direction: column; gap: 10px; color: var(--tinta-2); }
.modulos li::before { content: "▪ "; color: var(--sinal); }
.cartao__conteudo { display: flex; flex-direction: column; }
.cartao__linha { padding: 32px 40px 0; max-width: 640px; font: 400 14px/20px var(--corpo); letter-spacing: -.01em; color: var(--tinta-2); }
.cartao__base { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 32px 40px; }
.cartao__quem h3 { max-width: 420px; font: 500 14px/20px var(--afirma); color: var(--tinta); margin-bottom: 4px; }
.cartao__quem .hud { font-size: 10px; }
.cartao__verbos { flex: none; text-align: right; color: var(--tinta); }
.trabalho__rodape { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; padding: 64px 0 72px; }
.ferramentas p:first-child { font: 400 14px/20px var(--corpo); color: var(--tinta-2); margin-bottom: 12px; }
.ferramentas .hud { color: var(--tinta); font-size: 12px; }

/* ---------- 11 · formatos ---------- */
.cab--cheio .cab__titulo { max-width: 560px; }
.cab--cheio .desc > p { max-width: 420px; }
.formatos .cab { margin-bottom: 72px; }
.planos { display: flex; border-top: 1px solid var(--fio); border-bottom: 1px solid var(--fio); }
.plano { position: relative; display: flex; flex-direction: column; padding: 72px; overflow: hidden; isolation: isolate; }
.plano--largo { flex: 996 1 0; border-right: 1px solid var(--fio); }
.plano--estreito { flex: 443 1 0; }
.plano__fita { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.plano__fita--topo { bottom: auto; height: 381px; }
.plano__trilho { display: flex; gap: 16px; width: max-content; height: 100%; opacity: .6; animation: fita 1800s linear infinite; }
.plano__trilho--lento { animation-duration: 2400s; }
.plano__tira { display: flex; gap: 16px; height: 100%; }
.plano__tira img { height: 100%; width: auto; max-width: none; object-fit: cover; filter: grayscale(.2); }
@keyframes fita { to { transform: translate3d(calc(-33.333% - 5.33px), 0, 0); } }
.plano--estreito .plano__trilho { animation-name: fita2; }
@keyframes fita2 { to { transform: translate3d(calc(-50% - 8px), 0, 0); } }
.plano__veu { position: absolute; inset: 0; background: linear-gradient(90deg, var(--fundo) 30%, rgba(8,8,10,.7) 55%, rgba(8,8,10,.25)), linear-gradient(0deg, var(--fundo), transparent 45%); }
.plano--estreito .plano__veu { background: linear-gradient(0deg, var(--fundo) 8%, rgba(8,8,10,.7) 60%, rgba(8,8,10,.45)); }
.plano__conteudo { position: relative; display: flex; flex-direction: column; max-width: 852px; }
.plano--estreito .plano__conteudo { max-width: 299px; }
.plano__tag { margin-bottom: 18px; color: var(--tinta); }
.plano__titulo { font: 500 42px/46.4px var(--afirma); letter-spacing: -.01em; }
.plano__itens { display: flex; flex-direction: column; gap: 4px; margin-top: 48px; }
.plano__itens li { display: flex; gap: 12px; font: 400 14px/23px var(--corpo); letter-spacing: -.01em; color: var(--tinta-2); }
.plano__itens li::before { content: ""; flex: none; width: 6px; height: 6px; margin: 8px 6px 0; background: var(--bone); opacity: .7; }
.plano__valor { display: flex; align-items: baseline; gap: 6px; margin-top: 48px; height: 48px; }
.plano__valor b { font: 500 40px/48px var(--afirma); letter-spacing: -.01em; }
.plano__valor span { font: 500 14px var(--afirma); color: var(--tinta-2); }
.plano .cta { width: 260px; margin-top: 32px; align-self: flex-start; }
.js .plano__itens li { opacity: 0; transform: translateY(20px); }
.plano__itens.dentro li { animation: itemEntra .5s var(--entra) forwards; }
.plano__itens.dentro li:nth-child(2) { animation-delay: .06s; } .plano__itens.dentro li:nth-child(3) { animation-delay: .12s; }
.plano__itens.dentro li:nth-child(4) { animation-delay: .18s; } .plano__itens.dentro li:nth-child(5) { animation-delay: .24s; }
@keyframes itemEntra { to { opacity: 1; transform: none; } }

/* ---------- 12 · contato + campo ASCII ---------- */
.contato { position: relative; overflow: hidden; isolation: isolate; }
.contato__campo { position: absolute; inset: 0; z-index: -1; }
.contato__campo canvas { width: 100%; height: 100%; }
.contato__campo video { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.contato__campo.sem-gl { background: var(--fundo) url("../media/video/walk-hero-poster.jpg") center / cover; filter: grayscale(1) brightness(.25); }
.contato__veu { position: absolute; inset: 0; pointer-events: none; background:
  radial-gradient(ellipse 42% 38% at 50% 55%, rgba(8,8,10,.7), rgba(8,8,10,.15) 75%, transparent),
  linear-gradient(var(--fundo), transparent 10%, transparent 90%, var(--fundo)); }
.contato__dentro { width: var(--caixa); margin: 0 auto; padding: 72px 0 120px; display: flex; flex-direction: column; align-items: center; }
.contato__cab { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; margin-bottom: 72px; }
.contato__cab .cab__titulo { max-width: 600px; }
.contato__linha { max-width: 380px; font: 400 14px/20px var(--corpo); color: var(--tinta-2); }
.contato__hud { color: var(--tinta); }

.balcao { display: grid; grid-template-columns: 240px 1fr 240px; width: min(962px, 100%); background: rgba(16,16,20,.92); border: 1px solid rgba(255,255,255,.1); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); font-family: var(--corpo); }
.balcao > * { padding: 20px; }
.balcao__porta { border-right: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column; }
.balcao__fotos { margin: -20px -20px 16px; height: 80px; overflow: hidden; }
.balcao__fotos img { width: 100%; height: 100%; object-fit: cover; }
.balcao__marca { color: var(--tinta-2); margin-bottom: 8px; }
.balcao__titulo { font: 600 20px/28px var(--corpo); margin-bottom: 14px; }
.balcao__texto { font: 400 14px/20px var(--corpo); color: var(--tinta-2); margin-bottom: 20px; }
.balcao__texto--form { margin-bottom: 16px; }
.balcao__meta { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; color: var(--tinta); }
.balcao__meta li::before { content: "▪ "; color: var(--sinal); }
.balcao__porta .botao { margin-top: auto; }
.balcao__form { border-right: 1px solid rgba(255,255,255,.08); }
.balcao__lado { display: flex; flex-direction: column; gap: 14px; }
.botao { display: inline-flex; justify-content: center; align-items: center; height: 40px; padding: 0 16px; font: 500 14px var(--corpo); color: var(--tinta); border: 1px solid rgba(255,255,255,.18); background: transparent; transition: background .3s, border-color .3s, color .3s; }
.botao:hover { border-color: var(--tinta); }
.botao--sinal { background: var(--sinal); border-color: var(--sinal); color: var(--fundo); }
.botao--sinal:hover { background: var(--tinta); border-color: var(--tinta); color: var(--fundo); }
.campos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.campo { display: flex; flex-direction: column; gap: 6px; font: 500 12px/16px var(--corpo); color: var(--tinta); }
.campo--cheio { grid-column: 1 / -1; }
.campo small { font-weight: 400; color: var(--tinta-2); font-size: 11px; }
.campo input, .campo textarea { width: 100%; font: 400 14px/20px var(--corpo); color: var(--tinta); background: var(--fundo); border: 1px solid rgba(255,255,255,.14); padding: 9px 10px; resize: vertical; border-radius: 0; }
.campo input:focus, .campo textarea:focus { outline: none; border-color: var(--sinal); }
.campo input::placeholder { color: #6e6e73; }
.escolhas, .prazos { border: 0; margin: 0 0 14px; padding: 0; min-width: 0; }
.escolhas legend, .prazos legend { padding: 0; margin-bottom: 8px; font: 500 12px/16px var(--corpo); color: var(--tinta); }
.escolhas legend small { margin-left: 8px; font-weight: 400; color: var(--tinta-2); font-size: 11px; }
.escolhas__grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.escolhas label, .prazos label { position: relative; display: block; cursor: pointer; }
.escolhas input, .prazos input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.escolhas span { display: grid; place-items: center; height: 44px; background: #26262b; font: 500 13px var(--corpo); color: var(--tinta); transition: background .2s, color .2s; text-align: center; padding: 0 4px; }
.escolhas input:checked + span { background: var(--tinta); color: var(--fundo); }
.escolhas input:focus-visible + span, .prazos input:focus-visible + span { outline: 1px solid var(--sinal); outline-offset: 2px; }
.prazos { display: flex; flex-direction: column; gap: 8px; }
.prazos span { display: grid; place-items: center; height: 36px; border: 1px solid rgba(255,255,255,.18); font: 500 13px var(--corpo); transition: background .2s, color .2s; }
.prazos input:checked + span { background: var(--tinta); color: var(--fundo); border-color: var(--tinta); }
.balcao__aviso { min-height: 0; font: 400 13px/18px var(--corpo); color: var(--tinta); }
.balcao__aviso:empty { display: none; }
.balcao__nota { font-size: 10px; line-height: 15px; }

/* ---------- 13 · perguntas ---------- */
.perguntas { width: var(--caixa); margin: 0 auto; display: flex; position: relative; }
.perguntas__lado { width: 50%; flex: none; }
.perguntas__cab { position: sticky; top: 0; display: flex; flex-direction: column; padding: 144px 0 64px; min-height: 100svh; }
.perguntas__cab .cab__num { top: 64px; }
.perguntas__cab .cab__titulo { max-width: 450px; }
.colagem { position: relative; width: 450px; max-width: 100%; height: 400px; margin: 16px 0; }
.colagem img { position: absolute; object-fit: cover; filter: grayscale(1) contrast(1.05); opacity: .85; }
.colagem__a { left: 0; top: 80px; width: 160px; height: 195px; }
.colagem__b { left: 135px; top: 40px; width: 340px; height: 322px; z-index: -1; opacity: .6 !important; }
.colagem__c { left: 360px; top: 106px; width: 178px; height: 225px; }
.perguntas__desc { max-width: 450px; margin-bottom: 64px; font: 400 14px/20px var(--corpo); color: var(--tinta-2); }
.perguntas .cta { align-self: flex-start; width: 260px; }
.perguntas__lista { width: 50%; padding-top: 540px; padding-bottom: 144px; border-left: 1px solid var(--fio); }
.pergunta { border-bottom: 1px solid var(--fio); background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0)); }
.pergunta:first-child { border-top: 1px solid var(--fio); }
.pergunta summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 28px; font: 500 18px/32px var(--afirma); letter-spacing: -.01em; cursor: pointer; }
.pergunta summary::-webkit-details-marker { display: none; }
.pergunta summary i { position: relative; width: 12px; height: 12px; flex: none; }
.pergunta summary i::before, .pergunta summary i::after { content: ""; position: absolute; left: 0; top: 5.5px; width: 12px; height: 1px; background: var(--tinta); transition: transform .4s var(--curva); }
.pergunta summary i::after { transform: rotate(90deg); }
.pergunta[open] summary i::after { transform: rotate(0); }
.pergunta p { max-width: 90%; padding: 8px 28px 28px; font: 400 14px/20px var(--corpo); color: rgba(255,255,255,.7); }

/* ---------- 14 · arquivo + rodapé ---------- */
.arquivo { position: relative; }
.arquivo__ano { position: sticky; top: 24px; z-index: 5; width: var(--caixa); margin: 0 auto; padding-top: 144px; color: var(--tinta); }
.arquivo__lista { width: var(--caixa); margin: 0 auto; padding: 144px 0 144px; display: flex; flex-direction: column; gap: 288px; }
.peca { width: var(--w); max-width: 100%; }
.peca img { width: 100%; height: auto; }
.peca figcaption { margin-top: 12px; }
.peca--esq { align-self: flex-start; }
.peca--centro { align-self: center; }
.peca--dir { align-self: flex-end; }
.peca--grande { align-self: center; }
.arquivo__nota { max-width: 560px; }

.rodape { width: var(--caixa); margin: 0 auto; display: flex; flex-direction: column; }
.rodape__marca { padding: 36px 0; }
.rodape__marca img { width: 100%; height: auto; opacity: .08; }
.rodape__legal { display: flex; align-items: center; gap: 20px; padding: 24px; font: 400 14px/20px var(--corpo); color: var(--tinta-2); flex-wrap: wrap; }
.rodape__legal a:hover, .rodape__baixar a:hover { color: var(--tinta); }
.separa { width: 12px; height: 12px; fill: var(--tinta-2); }
.rodape__coord { margin-left: auto; }
.rodape__baixar { padding: 24px; font: 500 14px/20px var(--corpo); color: var(--tinta-2); }
.rodape__fim { height: 120px; }

/* ---------- movimento: estado inicial (só com JS) ---------- */
.motion [data-revela] { opacity: 0; transform: translateY(36px); }
.motion [data-revela].dentro { opacity: 1; transform: none; transition: opacity .8s var(--entra), transform .8s var(--entra); }
.js [data-revela] { transition: opacity .8s var(--entra), transform .8s var(--entra); }
.js [data-revela]:not(.dentro) { opacity: 0; transform: translateY(36px); }

/* ---------- até 1280 ---------- */
@media (max-width: 1280px) {
  :root { --calha: 40px; }
  .hero__leque { transform: translateX(-50%) translateX(260px) scale(.85); transform-origin: 0 0; }
  .fatos { gap: 48px 32px; }
  .fato { width: calc((100% - 96px) / 4); }
  .verbo { padding: 0 16px; }
  .verbo__titulo { font-size: 34px; line-height: 38px; }
  .painel, .etapa--inversa .painel { left: 40px; width: calc(100% - 80px); }
}

/* ---------- até 1024 ---------- */
@media (max-width: 1024px) {
  .cab { flex-direction: column; align-items: stretch; gap: 32px; }
  .cab .cta { align-self: flex-start; }
  .fato { width: calc((100% - 32px) / 2); }
  .etapa, .etapa--inversa { flex-direction: column; }
  .etapa--inversa .etapa__visual { order: 2; }
  .etapa__texto, .etapa--inversa .etapa__texto { width: 100%; padding: 96px 0 40px; }
  .etapa--inversa .etapa__num { left: -4px; }
  .etapa__num { top: 64px; }
  .etapa__visual { min-height: 380px; margin-bottom: 40px; }
  .painel, .etapa--inversa .painel { position: relative; left: auto; right: auto; top: auto; margin: 20px auto 0; width: min(562px, 100%); }
  .verbos { grid-template-columns: repeat(3, 1fr); row-gap: 56px; padding-bottom: 96px; }
  .verbo, .verbo:first-child { padding: 0 20px; border-left: 1px solid var(--fio); }
  .verbo__corpo { margin-top: 48px; }
  .planos { flex-direction: column; }
  .plano--largo, .plano--estreito { flex: none; }
  .plano--largo { border-right: 0; border-bottom: 1px solid var(--fio); }
  .plano--estreito .plano__conteudo { max-width: 520px; }
  .plano--estreito { padding-top: 220px; }
  .plano__fita--topo { height: 260px; }
  .balcao { grid-template-columns: 1fr 1fr; }
  .balcao__porta { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .perguntas { flex-direction: column; }
  .perguntas__lado, .perguntas__lista { width: 100%; }
  .perguntas__cab { position: relative; min-height: 0; padding-bottom: 48px; }
  .perguntas__lista { padding-top: 0; border-left: 0; }
  .assina { flex-wrap: wrap; gap: 24px; padding: 24px 0; }
  .assina__simbolo { margin-right: 24px; }
  .clientes { grid-template-columns: 1fr; gap: 32px; }
}

/* ---------- celular ---------- */
@media (max-width: 700px) {
  :root { --calha: 16px; }
  .linhas { display: none; }
  .topo__dentro { padding-top: 28px; height: 72px; }
  .topo__idioma { display: none; }
  .topo__acoes, .topo__link { gap: 16px; }
  .hero { height: auto; min-height: 100svh; }
  .hero__leque { top: 80px; left: 0; transform: scale(.42); transform-origin: 0 0; opacity: .9; }
  .hero__dentro { padding-top: 420px; padding-bottom: 48px; }
  .hero__titulo, .cab__titulo { font-size: 32px; line-height: 36px; }
  .cab__num { font-size: 96px; line-height: 84px; }
  .cab__conteudo { padding-top: 56px; }
  .desc__fantasma { display: none; }
  .secao { padding-top: 48px; }
  .cab { margin-bottom: 48px !important; }
  .clientes__grade { grid-template-columns: 1fr 1fr; row-gap: 24px; }
  .clientes__grade li { font-size: 16px; }
  .fatos { gap: 40px; }
  .fato { width: 100%; }
  .fato__glifo { height: 110px; }
  .fato__glifo svg { top: 10px; width: 56px; height: 56px; }
  .etapa__visual { min-height: 0; }
  .painel { padding: 18px; }
  .doc div { grid-template-columns: 1fr; gap: 4px; }
  .verbos { grid-template-columns: 1fr; row-gap: 40px; }
  .verbo, .verbo:first-child { border-left: 0; border-top: 1px solid var(--fio); padding: 0; }
  .verbo__corpo { margin-top: 0; padding-top: 24px; }
  .verbo__titulo { margin-bottom: 24px; }
  .cartoes { grid-template-columns: 1fr; }
  .cartao { min-height: 460px; }
  .cartao__linha { padding: 24px 20px 0; }
  .cartao__base { padding: 20px; flex-direction: column; align-items: flex-start; }
  .cartao__verbos { text-align: left; }
  .modulos { left: 20px; right: 20px; top: 24px; }
  .trabalho__rodape { flex-direction: column; align-items: flex-start; }
  .plano { padding: 40px 20px; }
  .plano--estreito { padding-top: 200px; }
  .plano__veu, .plano--estreito .plano__veu { background: linear-gradient(0deg, var(--fundo) 30%, rgba(8,8,10,.84)); }
  .plano__titulo { font-size: 34px; line-height: 40px; }
  .contato__dentro { padding-bottom: 72px; }
  .contato__cab { margin-bottom: 40px; }
  .balcao { grid-template-columns: 1fr; }
  .balcao__form { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .campos { grid-template-columns: 1fr; }
  .escolhas__grade { grid-template-columns: 1fr 1fr; }
  .colagem { height: 260px; }
  .colagem__a { top: 50px; width: 104px; height: 127px; }
  .colagem__b { left: 80px; top: 20px; width: 200px; height: 190px; }
  .colagem__c { left: 230px; top: 70px; width: 116px; height: 147px; }
  .perguntas__cab { padding-top: 96px; }
  .perguntas__cab .cab__num { top: 40px; }
  .pergunta summary { padding: 20px 0; font-size: 17px; line-height: 26px; }
  .pergunta p { padding: 0 0 20px; max-width: none; }
  .arquivo__ano { padding-top: 96px; }
  .arquivo__lista { gap: 96px; padding: 72px 0 96px; }
  .peca, .peca--grande { width: 100%; align-self: stretch; }
  .peca--dir, .peca--esq { width: 82%; }
  .peca--dir { align-self: flex-end; }
  .peca--esq { align-self: flex-start; }
  .assina__simbolo { margin-right: 0; }
  .assina__redes { margin-left: 0; }
  .rodape__legal { padding: 24px 0; }
  .rodape__coord { margin-left: 0; }
  .rodape__baixar { padding: 24px 0; }
  .flutua { bottom: 16px; }
  .flutua__dentro { padding: 12px 24px; }
  .flutua__simbolo { width: 32px; height: 32px; margin-right: 24px; }
  .menu__dentro { padding-top: 120px; }
  .menu__links a { font-size: 36px; line-height: 40px; }
}

/* ---------- sem movimento ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .js [data-revela]:not(.dentro), .motion [data-revela] { opacity: 1; transform: none; }
  .js .plano__itens li { opacity: 1; transform: none; }
}