/* Site Aclari — proposta B1 (Bricolage Grotesque + Hanken Grotesk). Fonte: propostas/gen_b.py */
:root {
    --bg: #ffffff; --papel: #f1f6f4; --fg: #0f1c19; --fg-2: #4f625d; --fg-3: #93a6a1; --linha: #dfe8e5;
    --verde: #0a3d35; --menta: #3fd9ab; --menta-2: #d9f7ed; --coral: #e8453c;
    --faixa: 1140px; --gut: max(20px, env(safe-area-inset-left, 0px)); --r: 24px;
    color-scheme: light;
  }
  @media (min-width: 1440px) { :root { --faixa: 1400px; } html { font-size: 17.5px; } }
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: var(--bg); color: var(--fg); font-family: var(--corpo); font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: clip; }
  h1, h2, h3, p { margin: 0; } h1, h2, h3 { font-family: var(--disp); text-wrap: balance; }
  a { color: inherit; text-decoration: none; } img { max-width: 100%; display: block; }
  a:focus-visible, button:focus-visible { outline: 2px solid var(--verde); outline-offset: 3px; }
  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } html { scroll-behavior: auto; } }
  .in { max-width: var(--faixa); margin: 0 auto; padding-left: var(--gut); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
  .tag { display: inline-block; font-size: .78rem; font-weight: 600; letter-spacing: .02em; padding: 6px 12px; border-radius: 999px; background: var(--menta-2); color: var(--verde); }
  .sec { padding-block: clamp(64px, 8vw, 120px); }
  .sec h2 { font-size: clamp(1.8rem, 3.4vw, 2.8rem); font-weight: 600; line-height: 1.05; margin-top: 16px; max-width: 20ch; letter-spacing: -.025em; }
  .sec h2 i { font-style: normal; color: var(--fg-3); font-weight: 400; }
  .cab { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 32px; align-items: end; }
  .lede { color: var(--fg-2); font-size: 1.05rem; max-width: 48ch; }
  .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 22px; border-radius: 999px; font-weight: 600; font-size: .95rem; border: 1.5px solid transparent; cursor: pointer; font-family: var(--corpo); white-space: nowrap; transition: transform .25s cubic-bezier(.2,.7,.2,1), background .2s, color .2s; }
  .btn:hover { transform: translateY(-2px); }
  .btn.preto { background: var(--verde); color: #fff; box-shadow: 0 10px 24px -12px rgba(10,61,53,.6); } .btn.preto:hover { background: #0f5247; }
  .btn.linha { border-color: var(--fg); color: var(--fg); } .btn.linha:hover { background: var(--verde); color: #fff; }
  .btn.menta { background: var(--menta); color: var(--verde); }
  .btn.branco { background: #fff; color: var(--fg); }
  .btn svg { width: 18px; height: 18px; }
  .foto { border-radius: var(--r); overflow: hidden; background: var(--papel); }
  .foto img { width: 100%; height: 100%; object-fit: cover; }

  .topo { position: sticky; top: 0; z-index: 10; background: #ffffffe8; backdrop-filter: blur(12px); }
  .topo .in { display: flex; align-items: center; gap: 24px; min-height: 72px; }
  .marca { display: inline-flex; align-items: center; gap: 8px; font-family: var(--disp); font-weight: 800; font-size: 1.35rem; letter-spacing: -.03em; }
  .marca img { width: 26px; height: 26px; }
  .menu { margin-left: auto; display: flex; gap: 4px; }
  .menu a { padding: 8px 14px; border-radius: 999px; font-weight: 600; font-size: .9rem; color: var(--fg-2); }
  .menu a:hover { background: var(--papel); color: var(--fg); }
  .topo .btn { padding: 10px 18px; font-size: .88rem; }
  .hamb { display: none; margin-left: auto; background: var(--papel); border: 0; width: 42px; height: 42px; border-radius: 50%; font-size: 18px; cursor: pointer; }
  @media (max-width: 900px) {
    .menu { display: none; position: absolute; top: 72px; left: var(--gut); right: var(--gut); background: #fff; border: 1px solid var(--linha); border-radius: 20px; flex-direction: column; padding: 10px; box-shadow: 0 30px 60px -30px #0f1c1940; margin: 0; }
    .topo.aberto .menu { display: flex; } .hamb { display: block; } .topo > .in > .btn { display: none; }
  }

  /* pilares */
  .pilares { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 44px; }
  .pilar { border-radius: var(--r); padding: 28px; background: var(--papel); min-height: 280px; display: flex; flex-direction: column; }
  .pilar .num { font-family: var(--disp); font-size: 2.6rem; font-weight: 800; letter-spacing: -.05em; color: var(--fg-3); line-height: 1; }
  .pilar h3 { margin-top: auto; font-size: 1.35rem; font-weight: 600; letter-spacing: -.02em; }
  .pilar p { margin-top: 8px; color: var(--fg-2); font-size: .95rem; }
  .pilar.on { background: var(--verde); color: #fff; } .pilar.on .num { color: var(--menta); } .pilar.on p { color: #ffffffcc; }

  /* areas */
  .trilho { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 44px; }
  .cartao-area { border: 1.5px solid var(--linha); border-radius: var(--r); padding: 24px; min-height: 230px; display: flex; flex-direction: column; gap: 8px; background: #fff; transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .2s; }
  .cartao-area:hover { transform: translateY(-6px); border-color: var(--fg); }
  .cartao-area .tag { align-self: flex-start; }
  .cartao-area h3 { font-size: 1.3rem; font-weight: 600; line-height: 1.1; margin-top: auto; letter-spacing: -.02em; }
  .cartao-area p { color: var(--fg-2); font-size: .92rem; }
  .cartao-area .ir { font-weight: 600; color: var(--verde); margin-top: 6px; font-size: .95rem; }
  .cartao-area.on { background: var(--verde); color: #fff; border-color: var(--verde); }
  .cartao-area.on p { color: #ffffffcc; } .cartao-area.on .ir { color: var(--menta); } .cartao-area.on .tag { background: var(--menta); }
  .dica { display: none; color: var(--fg-3); font-size: .85rem; margin-top: 10px; }
  @media (max-width: 760px) {
    .trilho { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin-left: calc(-1 * var(--gut)); margin-right: calc(-1 * var(--gut)); padding: 4px var(--gut) 16px; scrollbar-width: none; margin-top: 20px; }
    .trilho::-webkit-scrollbar { display: none; }
    .cartao-area { flex: 0 0 78vw; scroll-snap-align: start; min-height: 210px; }
    .dica { display: block; }
  }

  /* passos */
  .tempo { margin-top: 48px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; position: relative; }
  .tempo::before { content: ""; position: absolute; left: 0; right: 0; top: 7px; height: 1.5px; background: var(--linha); }
  .ponto { position: relative; padding-top: 28px; }
  .ponto::before { content: ""; position: absolute; top: 0; left: 0; width: 15px; height: 15px; border-radius: 50%; background: var(--menta); border: 3px solid #fff; box-shadow: 0 0 0 1.5px var(--fg); }
  .ponto h3 { font-size: 1.2rem; font-weight: 600; } .ponto p { margin-top: 6px; color: var(--fg-2); font-size: .95rem; }

  /* quem somos com fotos */
  .quem { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: start; }
  .galeria { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .galeria .foto:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
  .galeria .foto { aspect-ratio: 4 / 5; position: relative; }
  .galeria .foto figcaption { position: absolute; left: 12px; right: 12px; bottom: 12px; background: #ffffffe6; backdrop-filter: blur(8px); border-radius: 12px; padding: 10px 14px; font-size: .85rem; }
  .galeria .foto figcaption b { display: block; font-family: var(--disp); font-size: 1rem; }
  .lista { border-top: 1.5px solid var(--fg); margin-top: 24px; }
  .lista div { display: grid; grid-template-columns: 1fr auto; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--linha); align-items: center; font-family: var(--disp); font-weight: 600; font-size: 1.05rem; letter-spacing: -.01em; }
  .lista div span { font-family: var(--corpo); font-size: .8rem; font-weight: 600; color: var(--verde); background: var(--menta-2); padding: 4px 10px; border-radius: 999px; }

  /* cta */
  .cta { background: var(--verde); color: #fff; border-radius: 40px 40px 40px 8px; padding: clamp(32px, 5vw, 64px); text-align: center; position: relative; overflow: hidden; }
  .cta::after { content: ""; position: absolute; width: 420px; height: 420px; right: -160px; bottom: -240px; border-radius: 50%; background: radial-gradient(circle, #3fd9ab55, transparent 65%); pointer-events: none; }
  .cta > * { position: relative; }
  .cta h2, .cta .lede { color: #fff; } .cta .lede { color: #ffffffcc; } .cta .tag { background: #ffffff1f; color: var(--menta); }
  .cta .chip { background: transparent; border-color: #ffffff40; color: #fff; } .cta .chip:hover { background: #ffffff14; } .cta .chip[aria-pressed="true"] { background: var(--menta); color: var(--verde); border-color: var(--menta); }
  .cta .btn.preto { background: var(--menta); color: var(--verde); box-shadow: 0 12px 28px -12px rgba(63,217,171,.8); } .cta .btn.preto:hover { background: #5be3ba; }
  .cta .nota, .cta .nota a { color: #ffffffb3; }
  .cta h2 { margin: 14px auto 0; max-width: 18ch; }
  .cta .lede { margin: 16px auto 0; }
  .chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 20px; }
  .chip { font-family: var(--corpo); font-weight: 600; font-size: .88rem; padding: 10px 16px; border-radius: 999px; border: 1.5px solid var(--linha); background: #fff; color: var(--fg-2); cursor: pointer; }
  .chip[aria-pressed="true"] { background: var(--verde); color: #fff; border-color: var(--verde); }
  .cta .btn.preto { margin-top: 24px; padding: 18px 30px; font-size: 1.05rem; }
  .cta .nota { margin-top: 12px; font-size: .85rem; color: var(--fg-3); }

  .pe { padding-block: 40px 28px; }
  .pe .in { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; font-size: .85rem; color: var(--fg-2); align-items: center; }
  .pe nav { display: flex; gap: 18px; flex-wrap: wrap; } .pe nav a:hover { color: var(--verde); }
  .boia { position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); bottom: max(16px, env(safe-area-inset-bottom, 0px)); z-index: 9; box-shadow: 0 16px 40px -12px #0f1c1966; }

  @media (max-width: 1000px) { .pilares, .tempo { grid-template-columns: 1fr 1fr; } .tempo::before { display: none; } .quem { grid-template-columns: 1fr; gap: 28px; } }
  @media (max-width: 760px) { .cab, .pilares, .tempo { grid-template-columns: 1fr; } .pilar { min-height: 0; } .boia span { display: none; } }

  :root { --disp: "Bricolage Grotesque", "Arial Black", sans-serif; --corpo: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif; }
  .hero { padding-block: clamp(32px, 5vw, 72px) clamp(48px, 6vw, 88px); }
  .hero .in { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 40px; align-items: center; }
  .hero h1 { margin-top: 18px; font-size: clamp(2.4rem, 5.2vw, 4.6rem); font-weight: 800; line-height: .95; letter-spacing: -.045em; }
  .hero h1 .u { position: relative; display: inline-block; }
  .hero h1 .u::after { content: ""; position: absolute; left: 0; right: 0; bottom: .08em; height: .16em; background: var(--menta); z-index: -1; border-radius: 4px; }
  .hero .lede { margin-top: 20px; }
  .hero .acoes { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }
  .hero .foto { aspect-ratio: 5 / 4; position: relative; border-radius: 32px; }
  .hero .selo { position: absolute; left: 16px; bottom: 16px; background: var(--verde); color: #fff; border-radius: 18px; padding: 14px 18px; max-width: 260px; transform: rotate(-2deg); }
  .hero .selo b { display: block; font-family: var(--disp); font-size: 1.9rem; color: var(--menta); letter-spacing: -.04em; line-height: 1; }
  .hero .selo span { font-size: .85rem; color: #ffffffd9; }
  .marquise { border: 0; background: linear-gradient(90deg, #0a3d35 0%, #0f5247 50%, #0a3d35 100%); color: #fff; overflow: hidden; white-space: nowrap; font-family: var(--disp); font-weight: 600; font-size: 1.05rem; letter-spacing: -.01em; padding: 16px 0; }
  .marquise span { display: inline-block; padding-right: 48px; animation: rolar 28s linear infinite; }
  .marquise i { font-style: normal; color: var(--menta); margin-right: 18px; }
  @keyframes rolar { to { transform: translateX(-50%); } }
  @media (max-width: 900px) { .hero .in { grid-template-columns: 1fr; } .hero .foto { aspect-ratio: 4 / 3; } }

/* páginas internas */
.pular { position: absolute; left: -9999px; } .pular:focus { left: 16px; top: 8px; background: var(--verde); color: #fff; padding: 8px 12px; z-index: 99; }
.doc { max-width: 720px; } .doc h2 { margin-top: 12px; } .doc h3 { margin-top: 28px; font-size: 1.1rem; font-weight: 600; } .doc p { margin-top: 8px; color: var(--fg-2); }
.callout { padding: 14px 18px; background: var(--papel); border-left: 3px solid var(--menta); border-radius: 0 12px 12px 0; font-size: .95rem; margin-top: 20px; }
.callout.atencao { background: #fdf7ec; border-left-color: #c98a2b; } .callout .t { font-weight: 600; color: var(--verde); } .callout.atencao .t { color: #8a5c10; }

/* seção do diagnóstico (home) */
.btn .mini { font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: var(--menta); color: var(--verde); border-radius: 999px; padding: 3px 8px; margin-left: 2px; }
.diag-chamada { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; align-items: center; background: var(--papel); border-radius: 32px; padding: clamp(28px, 4vw, 56px); }
.diag-txt h2 { max-width: 16ch; }
.diag-txt .lede { margin-top: 16px; }
.diag-lista { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.diag-lista li { display: grid; gap: 2px; padding-left: 22px; position: relative; }
.diag-lista li::before { content: ""; position: absolute; left: 0; top: .5em; width: 10px; height: 10px; border-radius: 50%; background: var(--menta); box-shadow: 0 0 0 3px var(--menta-2); }
.diag-lista b { font-family: var(--disp); font-weight: 600; font-size: 1.02rem; }
.diag-lista span { color: var(--fg-2); font-size: .92rem; }
.diag-txt .acoes { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 26px; }
.diag-nota { font-size: .85rem; color: var(--fg-3); }
.diag-previa { display: block; background: #fff; border-radius: 24px; padding: 22px; border: 1.5px solid var(--linha); box-shadow: 0 30px 60px -40px #0f1c1966; transform: rotate(1.5deg); transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.diag-previa:hover { transform: rotate(0) translateY(-4px); }
.dp-topo { display: flex; justify-content: space-between; align-items: center; font-size: .8rem; font-weight: 600; color: var(--fg-3); }
.dp-topo i { width: 44%; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--menta) 0 60%, var(--linha) 60%); }
.dp-q { margin-top: 14px; font-family: var(--disp); font-weight: 600; font-size: 1.25rem; letter-spacing: -.02em; line-height: 1.15; }
.dp-ops { display: grid; gap: 6px; margin-top: 14px; }
.dp-ops span { border: 1.5px solid var(--linha); border-radius: 12px; padding: 9px 12px; font-size: .9rem; font-weight: 600; color: var(--fg-2); }
.dp-ops span.on { border-color: var(--verde); background: var(--menta-2); color: var(--fg); }
.dp-res { margin-top: 14px; background: var(--verde); color: #fff; border-radius: 14px; padding: 12px 14px; display: grid; gap: 2px; }
.dp-res b { font-family: var(--disp); font-weight: 600; font-size: .98rem; }
.dp-res span { font-size: .8rem; color: var(--menta); }
@media (max-width: 900px) { .diag-chamada { grid-template-columns: 1fr; } .diag-previa { transform: none; max-width: 420px; } }

/* fotos reais (retrato): hero em 4/5 e foco no rosto */
.hero .foto { aspect-ratio: 4 / 5; max-height: 600px; }
.hero .foto img { object-position: center 30%; }
.galeria .foto:first-child img { object-position: center 60%; }
.galeria .foto img { object-position: center 25%; }
@media (max-width: 900px) { .hero .foto { aspect-ratio: 4 / 5; max-height: 520px; max-width: 420px; } }

/* 7 áreas: a última ocupa a linha inteira no notebook e na tela larga */
@media (min-width: 761px) {
  .trilho .cartao-area:last-child { grid-column: 1 / -1; min-height: 0; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; }
  .trilho .cartao-area:last-child h3 { margin-top: 0; }
  .trilho .cartao-area:last-child p { flex: 1 1 320px; }
  .trilho .cartao-area:last-child .ir { margin-top: 0; }
}
.hero .foto img { object-position: center 40%; }

/* Como funciona: faixa com fundo, três passos, quem faz o quê */
.faixa-passos { background: linear-gradient(180deg, #eaf6f1 0%, var(--papel) 100%); padding-block: clamp(64px, 8vw, 120px) !important; margin-block: clamp(16px, 2vw, 24px) 0; }
.passos3 { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: p; }
.passo3 { background: #fff; border-radius: var(--r); padding: 26px; display: flex; flex-direction: column; gap: 12px; min-width: 0; border: 1.5px solid #fff; transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .2s; }
.passo3:hover { transform: translateY(-4px); border-color: var(--menta); }
.p-topo { display: flex; justify-content: space-between; align-items: center; }
.p-num { width: 44px; height: 44px; border-radius: 50%; background: var(--verde); color: var(--menta); font-family: var(--disp); font-weight: 800; font-size: 1.25rem; display: grid; place-items: center; }
.p-tempo { font-size: .78rem; font-weight: 600; color: var(--verde); background: var(--menta-2); border-radius: 999px; padding: 6px 12px; white-space: nowrap; }
.passo3 h3 { font-size: 1.35rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; }
.passo3 > p { color: var(--fg-2); font-size: .95rem; }
.passo3 dl { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--linha); display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; font-size: .88rem; }
.passo3 dt { font-weight: 600; color: var(--fg-3); text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; padding-top: 3px; }
.passo3 dd { margin: 0; color: var(--fg); }
.passos-pe { margin-top: 20px; background: var(--verde); color: #fff; border-radius: var(--r); padding: 22px 26px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 28px; align-items: center; font-size: .98rem; }
.passos-pe b { color: var(--menta); font-weight: 600; }
.passos-pe .acoes { display: flex; gap: 10px; flex-wrap: wrap; }
.passos-pe .btn.preto { background: var(--menta); color: var(--verde); }
.passos-pe .btn.linha { border-color: #ffffff66; color: #fff; }
.passos-pe .btn.linha:hover { background: #fff; color: var(--verde); }
.passos-pe .btn.linha .mini { background: #fff; }
@media (max-width: 1000px) { .passos3 { grid-template-columns: 1fr; } .passos-pe { grid-template-columns: 1fr; } }

/* Área do cliente */
.topo .btn.cliente { margin-left: 0; }
.menu .so-celular { display: none; color: var(--verde); }
@media (max-width: 900px) { .menu .so-celular { display: block; } }
.area-cliente { background: var(--verde); color: #fff; padding-block: clamp(64px, 8vw, 120px) !important; position: relative; overflow: hidden; }
.area-cliente::before { content: ""; position: absolute; right: -10%; top: -30%; width: 55vw; height: 55vw; max-width: 720px; max-height: 720px; border-radius: 50%; background: radial-gradient(circle, #3fd9ab2e, transparent 62%); pointer-events: none; }
.area-cliente .in { position: relative; }
.ac-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 48px; align-items: center; }
.area-cliente .tag { background: #ffffff1f; color: var(--menta); }
.area-cliente h2 { color: #fff; } .area-cliente h2 i { color: #ffffff80; }
.area-cliente .lede { color: #ffffffd9; margin-top: 16px; max-width: 52ch; }
.ac-lista { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 14px; }
.ac-lista li { display: grid; grid-template-columns: 28px 1fr; gap: 14px; align-items: start; }
.ac-ico { width: 28px; height: 28px; border-radius: 50%; background: var(--menta); color: var(--verde); display: grid; place-items: center; margin-top: 2px; }
.ac-ico svg { width: 14px; height: 14px; }
.ac-lista b { display: block; font-family: var(--disp); font-weight: 600; font-size: 1.05rem; letter-spacing: -.01em; }
.ac-lista b em { font-style: normal; font-family: var(--corpo); font-size: .7rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--verde); background: var(--menta); border-radius: 999px; padding: 3px 8px; margin-left: 8px; vertical-align: 2px; white-space: nowrap; }
.ac-lista span:not(.ac-ico) { color: #ffffffb8; font-size: .92rem; }
.ac-txt .acoes { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 30px; }
.area-cliente .btn.preto { background: var(--menta); color: var(--verde); }
.area-cliente .btn.preto:hover { background: #5be3ba; }
.ac-nota { font-size: .9rem; color: #ffffffb8; } .ac-nota a { color: #fff; }
.ac-previa { display: block; background: #fff; color: var(--fg); border-radius: 24px; padding: 18px; box-shadow: 0 40px 80px -40px #00000080; transform: rotate(1.5deg); transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.ac-previa:hover { transform: rotate(0) translateY(-4px); }
.ac-barra { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--linha); font-size: .85rem; color: var(--fg-2); }
.ac-marca { display: inline-flex; align-items: center; gap: 8px; font-family: var(--disp); font-weight: 700; color: var(--fg); }
.ac-marca img { width: 20px; height: 20px; }
.ac-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.ac-kpis div { background: var(--papel); border-radius: 14px; padding: 12px; min-width: 0; }
.ac-kpis small { display: block; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--fg-3); }
.ac-kpis b { display: block; font-family: var(--disp); font-size: 1.15rem; font-weight: 700; letter-spacing: -.02em; margin-top: 4px; font-variant-numeric: tabular-nums; }
.ac-kpis i { display: block; font-style: normal; font-size: .72rem; color: #1f9e7c; margin-top: 2px; }
.ac-linhas { margin-top: 12px; display: grid; gap: 6px; }
.ac-linha { display: grid; grid-template-columns: 10px 1fr auto; gap: 10px; align-items: center; font-size: .85rem; padding: 9px 12px; border-radius: 12px; border: 1px solid var(--linha); }
.ac-linha em { font-style: normal; font-size: .75rem; color: var(--fg-3); }
.ac-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--menta); }
.ac-botoes { display: flex; gap: 6px; margin-top: 12px; flex-wrap: wrap; }
.ac-botoes span { font-size: .78rem; font-weight: 600; padding: 8px 12px; border-radius: 999px; background: var(--verde); color: #fff; }
.ac-botoes span + span { background: var(--papel); color: var(--fg); }
@media (max-width: 1000px) { .ac-grid { grid-template-columns: 1fr; gap: 36px; } .ac-previa { transform: none; max-width: 480px; } }
@media (max-width: 480px) { .ac-kpis { grid-template-columns: 1fr 1fr; } .ac-kpis div:last-child { grid-column: 1 / -1; } .ac-lista b em { display: inline-block; margin: 4px 0 0; } }

/* Embaixadores */
.trilho.embaixadores { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.emb { display: flex; flex-direction: column; gap: 14px; padding: 18px; border-radius: var(--r); border: 1.5px solid var(--linha); background: #fff; min-width: 0; transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .2s; }
.emb:hover { transform: translateY(-6px); border-color: var(--fg); }
.emb .foto { aspect-ratio: 4 / 5; border-radius: 18px; }
.emb .foto img { object-position: center 25%; }
.emb .papel { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--verde); }
.emb h3 { font-size: 1.15rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; margin-top: -8px; }
.emb q { display: block; quotes: "\201C" "\201D"; color: var(--fg-2); font-size: .92rem; line-height: 1.55; }
.emb q::before { content: open-quote; color: var(--menta); font-family: var(--disp); font-weight: 800; }
.emb q::after { content: close-quote; color: var(--menta); font-family: var(--disp); font-weight: 800; }
.emb .desde { margin-top: auto; font-size: .8rem; color: var(--fg-3); }
.emb-vazio { grid-column: 1 / -1; border: 1.5px dashed var(--linha); border-radius: var(--r); padding: 28px; text-align: center; color: var(--fg-3); }
@media (max-width: 1000px) { .trilho.embaixadores { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .emb { flex: 0 0 72vw; } }

/* Benefícios */
.beneficios { background: linear-gradient(180deg, #fff 0%, var(--papel) 100%); }

/* zap */
.zap { background: #e9efec; border-radius: 22px; padding: 10px; display: flex; flex-direction: column; min-height: 380px; }
.zap-topo { display: flex; align-items: center; gap: 10px; background: var(--verde); color: #fff; border-radius: 14px 14px 4px 4px; padding: 10px 12px; }
.zap-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--menta); color: var(--verde); font-weight: 800; display: grid; place-items: center; font-family: var(--disp); }
.zap-topo b { display: block; font-size: .9rem; } .zap-topo small { font-size: .72rem; color: var(--menta); }
.zap-corpo { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 12px 6px; }
.bolha { max-width: 86%; padding: 9px 12px; border-radius: 14px; font-size: .84rem; line-height: 1.45; background: #fff; opacity: 0; transform: translateY(8px) scale(.98); transition: opacity .35s, transform .35s; }
.bolha.on { opacity: 1; transform: none; }
.bolha.eu { align-self: flex-end; background: #d9fdd3; border-bottom-right-radius: 4px; }
.bolha.ela { align-self: flex-start; border-bottom-left-radius: 4px; }
.bolha.digitando { display: inline-flex; gap: 4px; padding: 12px 14px; }
.bolha.digitando span { width: 6px; height: 6px; border-radius: 50%; background: var(--fg-3); animation: pisca 1s infinite; }
.bolha.digitando span:nth-child(2) { animation-delay: .2s; } .bolha.digitando span:nth-child(3) { animation-delay: .4s; }
.bolha.digitando.some { display: none; }
@keyframes pisca { 0%, 60%, 100% { opacity: .3; } 30% { opacity: 1; } }
.pdf { display: flex; align-items: center; gap: 10px; background: var(--papel); border-radius: 10px; padding: 8px 10px; margin-bottom: 8px; }
.pdf i { font-style: normal; font-size: .62rem; font-weight: 800; color: #fff; background: #e8453c; border-radius: 6px; padding: 8px 6px; }
.pdf b { display: block; font-size: .82rem; } .pdf small { color: var(--fg-2); font-size: .72rem; }
.zap-pe { display: flex; align-items: center; justify-content: space-between; background: #fff; border-radius: 999px; padding: 8px 8px 8px 14px; font-size: .8rem; color: var(--fg-3); }
.zap-pe i { width: 30px; height: 30px; border-radius: 50%; background: var(--verde); }

/* gráfico */
.grafico { background: var(--papel); border-radius: 20px; padding: 16px; }
.g-topo { display: flex; justify-content: space-between; align-items: baseline; font-size: .78rem; color: var(--fg-2); }
.g-topo b { font-family: var(--disp); font-size: 1.2rem; color: var(--fg); font-variant-numeric: tabular-nums; }
.g-barras { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; align-items: end; height: 150px; margin-top: 14px; }
.g-barras div { position: relative; height: var(--h); background: var(--verde); border-radius: 8px 8px 4px 4px; transition: height .8s cubic-bezier(.2,.7,.2,1); }
.g-barras div i { position: absolute; left: 0; right: 0; bottom: 0; height: var(--i); background: var(--menta); border-radius: 0 0 4px 4px; transition: height .8s cubic-bezier(.2,.7,.2,1); }
.g-barras div:last-child { box-shadow: 0 0 0 3px #3fd9ab55; }
.g-legenda { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-top: 8px; font-size: .72rem; color: var(--fg-3); text-align: center; }
.g-nota { margin-top: 12px; font-size: .8rem; padding: 10px 12px; background: #fff; border-left: 3px solid var(--menta); border-radius: 0 10px 10px 0; color: var(--fg-2); }

/* moedas */
.moedas { position: relative; height: 200px; display: flex; align-items: flex-end; justify-content: center; }
.moeda { position: absolute; width: 64px; height: 64px; border-radius: 50%; background: var(--menta); color: var(--verde); font-family: var(--disp); font-weight: 800; display: grid; place-items: center; box-shadow: inset 0 -6px 0 #1f9e7c, 0 12px 24px -10px #0008; animation: cai 4.5s infinite cubic-bezier(.2,.7,.2,1); }
.moeda.m1 { left: 18%; animation-delay: 0s; } .moeda.m2 { left: 42%; animation-delay: .9s; } .moeda.m3 { left: 66%; animation-delay: 1.8s; }
@keyframes cai { 0% { top: -70px; opacity: 0; } 12% { opacity: 1; } 40% { top: 70px; } 48% { top: 62px; } 55% { top: 70px; } 85% { top: 70px; opacity: 1; } 100% { top: 70px; opacity: 0; } }
.saldo { background: #fff; color: var(--fg); border-radius: 16px; padding: 12px 18px; text-align: center; min-width: 200px; position: relative; z-index: 1; }
.saldo small { display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-3); font-weight: 600; }
.saldo b { font-family: var(--disp); font-size: 1.5rem; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }

/* e mais */

@media (prefers-reduced-motion: reduce) { .bolha { opacity: 1; transform: none; } .moeda { animation: none; top: 70px; } .bolha.digitando { display: none; } }

/* ───── Ritmo entre seções: cores, formatos e transições ───── */
.banda-clara { background: #eaf6f1; }
.banda-menta { background: var(--menta-2); }
.banda-escura { background: var(--verde) !important; color: #fff; }
.banda-escura .tag { background: #ffffff1f; color: var(--menta); }
.banda-escura h2 { color: #fff; } .banda-escura h2 i { color: #ffffff80; }
.banda-escura .lede { color: #ffffffcc; }
.banda-escura .passo3 { border-color: transparent; }
.banda-escura .passos-pe { background: #fff; color: var(--fg); }
.banda-escura .passos-pe b { color: var(--verde); }
.banda-escura .passos-pe .btn.preto { background: var(--verde); color: #fff; }
.banda-escura .passos-pe .btn.linha { border-color: var(--fg); color: var(--fg); }
.banda-escura .passos-pe .btn.linha:hover { background: var(--fg); color: #fff; }
.banda-escura .passos-pe .btn.linha .mini { background: var(--menta); }
.banda-escura.faixa-passos { background: linear-gradient(160deg, var(--verde) 0%, #0f5247 100%) !important; }

/* formatos */
.inclinada { clip-path: polygon(0 0, 100% clamp(28px, 4vw, 64px), 100% 100%, 0 100%); padding-top: calc(clamp(64px, 8vw, 120px) + clamp(28px, 4vw, 64px)) !important; margin-top: -1px; }
.arredondada { border-radius: clamp(32px, 6vw, 80px) clamp(32px, 6vw, 80px) 0 0; margin-top: clamp(16px, 3vw, 40px); }
.arredondada + .sec { position: relative; }
.arredondada + .sec::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: clamp(32px, 6vw, 80px); background: var(--verde); z-index: -1; }
.arredondada + .sec > .in { position: relative; background: #fff; border-radius: clamp(32px, 6vw, 80px) 0 0 0; margin-top: calc(-1 * clamp(64px, 8vw, 120px)); padding-top: clamp(64px, 8vw, 120px); max-width: none; }
.arredondada + .sec > .in > * { max-width: var(--faixa); margin-left: auto; margin-right: auto; }
.canto { border-radius: 0 clamp(48px, 8vw, 120px) 0 0; background: linear-gradient(180deg, #f6faf8 0%, var(--papel) 100%) !important; }
.onda { position: relative; padding-top: calc(clamp(64px, 8vw, 120px) + 48px) !important; }
.onda::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 64px; background: #fff; clip-path: ellipse(60% 100% at 50% 0%); }
.banda-menta .card { border-color: transparent; }
#conversa { padding-top: 0; }
#trabalhe-conosco { padding-top: 0; }

/* transições ao rolar (só com JS; sem JS tudo fica visível) */
.js .reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.js .reveal.in { opacity: 1; transform: none; }
.js .pilares.reveal > *, .js .trilho.reveal > *, .js .passos3.reveal > *, .js .ben-grid.reveal > *, .js .cards.reveal > * { transition-delay: calc(var(--k, 0) * 80ms); }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; transition: none; } }

/* Onde estamos */
.onde { background: #fff; }
.onde-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 48px; align-items: center; }
.onde-hist { margin-top: 24px; padding: 20px 22px; border-left: 3px solid var(--menta); background: var(--papel); border-radius: 0 18px 18px 0; }
.onde-hist h3 { font-size: 1.05rem; font-weight: 600; letter-spacing: -.01em; }
.onde-hist p { margin-top: 10px; color: var(--fg-2); font-size: .95rem; }
.onde-nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.onde-nums div { border: 1.5px solid var(--linha); border-radius: 18px; padding: 14px 16px; }
.onde-nums b { display: block; font-family: var(--disp); font-size: 2rem; font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--verde); }
.onde-nums span { display: block; font-size: .8rem; color: var(--fg-2); margin-top: 4px; }
.onde-fonte { margin-top: 14px; font-size: .78rem; color: var(--fg-3); }
.onde-mapa { position: relative; background: linear-gradient(180deg, #eaf6f1 0%, var(--papel) 100%); border-radius: 32px; padding: clamp(16px, 3vw, 32px); }
.mapa-br { width: 100%; height: auto; display: block; }
.mapa-br .uf { fill: #d7e4df; stroke: #fff; stroke-width: 1.2; transition: fill .25s, transform .25s; cursor: default; }
.mapa-br .uf.on { fill: var(--verde); }
.mapa-br .uf:not(.on) { cursor: pointer; }
@media (max-width: 480px) { .mapa-dica { white-space: normal; text-align: center; width: max-content; max-width: 88%; } }
.mapa-br .uf:hover, .mapa-br .uf:focus { fill: var(--menta); outline: none; }
.mapa-br .uf.on:hover { fill: #1f9e7c; }
.mapa-br .sede circle { fill: var(--menta); stroke: #fff; stroke-width: 2; }
.mapa-br .sede .halo { fill: #3fd9ab55; stroke: none; animation: pulsa 2.4s infinite; transform-origin: 391px 418px; }
@keyframes pulsa { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(1.8); opacity: 0; } }
.mapa-legenda { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 12px; font-size: .8rem; color: var(--fg-2); }
.mapa-legenda i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; background: #d7e4df; margin-right: 6px; vertical-align: -1px; }
.mapa-legenda i.on { background: var(--verde); } .mapa-legenda i.sede { background: var(--menta); border-radius: 50%; }
.mapa-dica { position: absolute; left: 50%; top: 14px; transform: translateX(-50%); background: var(--fg); color: #fff; font-size: .82rem; font-weight: 600; padding: 7px 12px; border-radius: 999px; white-space: nowrap; pointer-events: none; opacity: .9; }
@media (max-width: 1000px) { .onde-grid { grid-template-columns: 1fr; gap: 28px; } .onde-mapa { max-width: 560px; margin: 0 auto; } }

@media (prefers-reduced-motion: reduce) { .mapa-br .sede .halo { animation: none; } }

.banda-escura .passo3 { color: var(--fg); }
.banda-escura .passo3 > p { color: var(--fg-2); }

/* Detalhes em coral — o laranja do "A" da marca, só em pontos pequenos */
:root { --coral: #e8453c; }
.fim { color: var(--verde); }
.tag::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--coral); margin-right: 8px; vertical-align: 2px; }
.marquise i { color: var(--coral); }
.mapa-br .sede circle { fill: var(--coral); }
.mapa-br .sede .halo { fill: #e8453c55; }
.mapa-legenda i.sede { background: var(--coral); }
.passo3 .p-num::after, .rec-n::after { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--coral); margin-left: 4px; vertical-align: top; }
.passo3 .p-num { position: relative; } .passo3 .p-num::after { position: absolute; right: -2px; top: -2px; margin: 0; width: 10px; height: 10px; border: 2px solid #fff; }
.pe .in > span:first-child::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 2px; background: var(--coral); margin-right: 8px; vertical-align: 0; }
.boia::after { content: ""; position: absolute; top: -3px; right: -3px; width: 12px; height: 12px; border-radius: 50%; background: var(--coral); border: 2px solid #fff; }

/* "Onde estamos" vive dentro de "Quem somos" */
.onde-bloco { margin-top: clamp(48px, 6vw, 80px); padding-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--linha); }
.onde-bloco h2 { font-size: clamp(1.6rem, 2.8vw, 2.3rem); }

/* Nosso time (dentro de Quem somos) */
.time-bloco { margin-top: clamp(48px, 6vw, 80px); padding-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--linha); }
.time-bloco h2 { font-size: clamp(1.6rem, 2.8vw, 2.3rem); }
.time-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-top: 32px; }
.membro { margin: 0; min-width: 0; }
.membro .foto { aspect-ratio: 3 / 4; border-radius: 22px; overflow: hidden; background: var(--papel); transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.membro .foto img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; display: block; }
.membro:hover .foto { transform: translateY(-5px) rotate(-1deg); }
.membro figcaption { padding: 10px 4px 0; }
.membro b { display: block; font-family: var(--disp); font-weight: 600; font-size: .98rem; letter-spacing: -.01em; }
.membro span { display: block; font-size: .8rem; color: var(--fg-2); }
.js .time-grid.reveal > * { transition-delay: calc(var(--k, 0) * 60ms); }
@media (max-width: 1000px) { .time-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .time-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .membro .foto { border-radius: 16px; } }

/* Time: fotos redondas, tamanhos e alturas embaralhados */
.time-grid { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 18px 22px; margin-top: 40px; padding-inline: 4px; }
.membro { flex: 0 0 auto; text-align: center; --d: 150px; --y: 0px; width: var(--d); transform: translateY(var(--y)); }
.membro .foto { aspect-ratio: 1 / 1; width: var(--d); height: var(--d); border-radius: 50%; border: 4px solid #fff; box-shadow: 0 14px 30px -14px rgba(10,61,53,.45), 0 0 0 1.5px var(--linha); }
.membro .foto img { object-position: center 18%; }
.membro:hover .foto { transform: translateY(-6px) scale(1.04); }
.membro:nth-child(6n+1) { --d: 170px; --y: 10px; }
.membro:nth-child(6n+2) { --d: 128px; --y: -22px; }
.membro:nth-child(6n+3) { --d: 156px; --y: 16px; }
.membro:nth-child(6n+4) { --d: 140px; --y: -10px; }
.membro:nth-child(6n+5) { --d: 182px; --y: 6px; }
.membro:nth-child(6n+6) { --d: 132px; --y: -18px; }
.membro:nth-child(odd) .foto { border-color: #fff; } .membro:nth-child(3n) .foto { box-shadow: 0 14px 30px -14px rgba(10,61,53,.45), 0 0 0 1.5px var(--menta); }
.membro:nth-child(5n) .foto { box-shadow: 0 14px 30px -14px rgba(10,61,53,.45), 0 0 0 1.5px var(--coral); }
.membro figcaption { padding-top: 8px; }
.js .time-grid.reveal > * { transition-property: opacity, transform; }
.js .time-grid.reveal:not(.in) > * { opacity: 0; transform: translateY(calc(var(--y) + 20px)); }
@media (max-width: 1000px) { .time-grid { display: flex; gap: 14px 16px; } .membro { --d: 120px !important; } .membro:nth-child(even) { --y: -14px; } .membro:nth-child(odd) { --y: 8px; } }
@media (max-width: 600px) { .time-grid { display: flex; } .membro { --d: 96px !important; } .membro .foto { border-width: 3px; } }

/* ───── Gradiente laranja (o fundo das fotos do time) para dar vida ───── */
:root { --lar-1: #ffbe85; --lar-2: #f28a45; --lar-3: #d3602a; }
/* hero: brilho laranja atrás da foto, no lugar do menta */
.hero::before { background:
  radial-gradient(42% 55% at 78% 30%, #f28a4555, transparent 70%),
  radial-gradient(30% 40% at 10% 90%, #ffbe8540, transparent 70%); }
.hero .foto { box-shadow: 0 40px 80px -40px #d3602a80; }
/* nosso time: o mesmo fundo das fotos, como um palco */
.time-bloco { border-top: 0; margin-top: clamp(40px, 5vw, 64px); padding: clamp(40px, 5vw, 64px) clamp(16px, 3vw, 40px) clamp(32px, 4vw, 48px); border-radius: 32px;
  background: radial-gradient(70% 60% at 50% 38%, var(--lar-1) 0%, var(--lar-2) 48%, var(--lar-3) 100%); color: #fff; }
.time-bloco .tag { background: #ffffff2e; color: #fff; } .time-bloco .tag::before { background: #fff; }
.time-bloco h2 { color: #fff; } .time-bloco h2 i { color: #ffffffb3; }
.time-bloco .lede { color: #fff2e8; }
.time-bloco .membro .foto { border-color: #fff; box-shadow: 0 18px 40px -16px #7a2e0a99; }
.time-bloco .membro:nth-child(3n) .foto, .time-bloco .membro:nth-child(5n) .foto { box-shadow: 0 18px 40px -16px #7a2e0a99, 0 0 0 1.5px #fff; }
.time-bloco .membro b { color: #fff; } .time-bloco .membro span { color: #fff2e8; }
.onde-bloco { border-top: 0; }
/* diagnóstico: um sol laranja no canto do cartão */
.diag-chamada { position: relative; overflow: hidden; }
.diag-chamada::before { content: ""; position: absolute; width: 520px; height: 520px; right: -200px; top: -260px; border-radius: 50%; background: radial-gradient(circle, #f28a4559, transparent 62%); pointer-events: none; }
.diag-chamada > * { position: relative; }
/* CTA final e faixa escura: brilho quente em vez de menta */
.cta::after { background: radial-gradient(circle, #f28a4566, transparent 65%); }
.banda-escura.faixa-passos { background: radial-gradient(60% 50% at 100% 0%, #f28a4533, transparent 70%), linear-gradient(160deg, var(--verde) 0%, #0f5247 100%) !important; }
/* afiliados: moedas e brilho laranja */
.moeda { background: linear-gradient(160deg, var(--lar-1), var(--lar-2)); color: #7a2e0a; box-shadow: inset 0 -6px 0 var(--lar-3), 0 12px 24px -10px #0008; }
/* banda do blog: menta → pêssego suave */
.banda-menta { background: linear-gradient(180deg, #fff1e6 0%, #ffe3cf 100%); }
/* embaixadores: anel laranja nos cartões */
.emb .foto { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--lar-2); border-radius: 50%; aspect-ratio: 1 / 1; width: 72%; margin: 6px auto 0; }
.emb .foto img { object-position: center 20%; }
.emb { text-align: center; } .emb h3 { margin-top: 0; }
.emb q { text-align: center; }
/* time: laranja mais suave */
.time-bloco { background: radial-gradient(70% 60% at 50% 38%, #ffd9bd 0%, #f9b586 50%, #ef9a63 100%); color: var(--fg); }
.time-bloco .tag { background: #ffffff66; color: #8a3a12; } .time-bloco .tag::before { background: var(--coral); }
.time-bloco h2 { color: var(--fg); } .time-bloco h2 i { color: #8a3a12b3; }
.time-bloco .lede { color: #4a2a1a; }
.time-bloco .membro b { color: var(--fg); } .time-bloco .membro span { color: #5a3626; }
.time-bloco .membro .foto { box-shadow: 0 14px 30px -14px #7a2e0a66; }
.time-bloco .membro:nth-child(3n) .foto, .time-bloco .membro:nth-child(5n) .foto { box-shadow: 0 14px 30px -14px #7a2e0a66, 0 0 0 1.5px #fff; }

/* Diagnóstico: contador que sobe, explode e revela a mensagem */
.diag-previa.exp { padding: 0; overflow: hidden; background: var(--verde); border-color: var(--verde); transform: rotate(1.5deg); }
.exp-palco { position: relative; min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 28px 22px; color: #fff;
  background: radial-gradient(60% 50% at 50% 60%, #f28a4533, transparent 70%), var(--verde); }
.exp-rot { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: var(--menta); }
.exp-num { margin-top: 10px; font-family: var(--disp); font-weight: 800; font-size: clamp(2.6rem, 6vw, 4.2rem); letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; color: #fff; transition: color .3s; will-change: transform; }
.exp-num.quente { color: var(--lar-1); }
.exp-num.tremer { animation: tremer .12s infinite; color: var(--lar-2); }
.exp-num.explode { animation: estourar .55s cubic-bezier(.2,.7,.2,1) forwards; }
.exp-num.some { opacity: 0; }
@keyframes tremer { 0% { transform: translate(0,0) rotate(0); } 25% { transform: translate(-3px,2px) rotate(-1deg); } 50% { transform: translate(3px,-2px) rotate(1deg); } 75% { transform: translate(-2px,-2px) rotate(-.5deg); } 100% { transform: translate(2px,2px) rotate(.5deg); } }
@keyframes estourar { 0% { transform: scale(1); opacity: 1; filter: blur(0); } 60% { transform: scale(1.5); opacity: .6; filter: blur(1px); } 100% { transform: scale(2.2); opacity: 0; filter: blur(6px); } }
.exp-part { position: absolute; inset: 0; pointer-events: none; }
.exp-part i { position: absolute; left: 50%; top: 52%; width: var(--s, 8px); height: var(--s, 8px); border-radius: var(--r, 50%); background: var(--c, var(--menta)); opacity: 0; transform: translate(-50%, -50%); }
.exp-part.vai i { animation: voar .9s cubic-bezier(.1,.8,.3,1) forwards; }
@keyframes voar { 0% { opacity: 1; transform: translate(-50%, -50%) scale(.4); } 100% { opacity: 0; transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) scale(1) rotate(var(--rot, 0deg)); } }
.exp-msg { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 28px; opacity: 0; transform: translateY(10px) scale(.96); transition: opacity .5s, transform .5s cubic-bezier(.2,.7,.2,1); pointer-events: none; }
.exp-msg.on { opacity: 1; transform: none; }
.exp-msg b { font-family: var(--disp); font-weight: 700; font-size: clamp(1.3rem, 2.4vw, 1.7rem); letter-spacing: -.025em; line-height: 1.12; color: #fff; max-width: 16ch; }
.exp-msg span { display: inline-block; font-weight: 600; font-size: .9rem; color: var(--verde); background: var(--menta); border-radius: 999px; padding: 10px 16px; }
.exp-palco.revelado .exp-rot { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .exp-num { display: none; } .exp-msg { opacity: 1; transform: none; } .exp-rot { opacity: 0; } }

/* Diagnóstico: dados de pesquisa */
.diag-txt h2 { max-width: 20ch; }
.dados-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.dado { background: #fff; border-radius: 16px; padding: 14px 16px; border: 1.5px solid #fff; min-width: 0; position: relative; }
.dado::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 3px; background: var(--coral); }
.dado b { display: block; font-family: var(--disp); font-size: clamp(1.6rem, 2.6vw, 2.1rem); font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--verde); font-variant-numeric: tabular-nums; }
.dado span { display: block; font-size: .82rem; color: var(--fg-2); margin-top: 6px; line-height: 1.4; }
.dado small { display: block; font-size: .68rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-3); margin-top: 6px; }
.diag-lista { margin-top: 22px; }
.fontes { margin-top: 14px; font-size: .72rem; color: var(--fg-3); line-height: 1.5; }
.fontes a { text-decoration: underline; text-underline-offset: 2px; } .fontes a:hover { color: var(--verde); }
@media (max-width: 480px) { .dados-grid { grid-template-columns: 1fr; } }

/* Manchetes: cartões de notícia, sem link; a origem aparece ao passar o mouse */
.manchetes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.manchete { position: relative; background: #fff; border-radius: 16px; padding: 14px 16px 16px; border: 1.5px solid var(--linha); min-width: 0; cursor: default; transition: transform .25s cubic-bezier(.2,.7,.2,1), border-color .2s, box-shadow .25s; }
.manchete:hover, .manchete:focus-visible { transform: translateY(-3px); border-color: var(--verde); box-shadow: 0 16px 30px -20px rgba(10,61,53,.4); outline: none; }
.m-topo { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--fg-3); }
.m-fonte { color: var(--coral); padding-left: 10px; position: relative; }
.m-fonte::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--coral); }
.manchete h3 { margin-top: 8px; font-family: var(--disp); font-weight: 700; font-size: 1.02rem; letter-spacing: -.02em; line-height: 1.2; color: var(--fg); }
.manchete p { margin-top: 6px; font-size: .8rem; color: var(--fg-2); line-height: 1.45; }
.manchete::after { content: attr(data-url); position: absolute; left: 12px; right: 12px; bottom: calc(100% + 8px); background: var(--fg); color: #fff; font-size: .72rem; line-height: 1.4; padding: 8px 10px; border-radius: 10px; opacity: 0; transform: translateY(6px); transition: opacity .2s, transform .2s; pointer-events: none; z-index: 3; }
.manchete::before { content: ""; position: absolute; left: 24px; bottom: calc(100% + 2px); border: 6px solid transparent; border-top-color: var(--fg); opacity: 0; transition: opacity .2s; pointer-events: none; z-index: 3; }
.manchete:hover::after, .manchete:focus-visible::after, .manchete:hover::before, .manchete:focus-visible::before { opacity: 1; transform: none; }
@media (max-width: 480px) { .manchetes { grid-template-columns: 1fr; } }
/* o gancho do diagnóstico em laranja */
.diag-txt h2 i { font-style: normal; font-weight: 700; color: var(--lar-2); background: linear-gradient(90deg, #e8453c 0%, #f28a45 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* diagnóstico enxuto */
.manchete h3 { font-size: .98rem; }
.manchete { padding: 12px 14px 14px; }
.diag-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.diag-chips span { font-size: .78rem; font-weight: 600; padding: 6px 11px; border-radius: 999px; background: #fff; border: 1.5px solid var(--linha); color: var(--fg-2); }
.diag-chips span::before { content: "✓ "; color: var(--menta-texto, #1f9e7c); }

/* causas que vão somando no bloco da explosão */
.exp-palco { justify-content: flex-start; padding-top: 26px; min-height: 400px; }
.exp-num { margin-top: 6px; }
.exp-causas { list-style: none; margin: 16px 0 0; padding: 0; width: 100%; max-width: 300px; display: grid; gap: 6px; }
.exp-causas li { display: flex; justify-content: space-between; gap: 12px; align-items: center; font-size: .82rem; padding: 8px 12px; border-radius: 10px; background: #ffffff14; color: #fff; opacity: 0; transform: translateX(-12px); transition: opacity .35s, transform .35s cubic-bezier(.2,.7,.2,1); }
.exp-causas li.on { opacity: 1; transform: none; }
.exp-causas li b { font-family: var(--disp); font-weight: 700; color: var(--lar-1); white-space: nowrap; font-variant-numeric: tabular-nums; }
.exp-causas li i { font-style: normal; display: inline-flex; width: 16px; height: 16px; border-radius: 50%; background: var(--coral); color: #fff; font-size: .62rem; font-weight: 800; align-items: center; justify-content: center; margin-right: 8px; flex: none; }
.exp-causas.explode li { animation: estourar .5s forwards; }
.exp-palco.revelado .exp-causas { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .exp-causas { display: none; } }
/* selo de verificação verde-limão em Psicólogos no letreiro */
.marquise .selo-ok { width: 1.05em; height: 1.05em; vertical-align: -0.18em; margin-left: .22em; color: #b6ff3b; filter: drop-shadow(0 0 6px #b6ff3b80); }
/* letreiro: loop contínuo, separador discreto, gradiente verde */
.marquise { background: linear-gradient(90deg, #0a3d35 0%, #156a5b 50%, #0a3d35 100%) !important; padding: 0 !important; }
.marquise .trilha { display: flex; width: max-content; animation: rolar 32s linear infinite; }
.marquise .trilha span { display: flex; flex: none; padding: 16px 0; animation: none; }
.marquise em { font-style: normal; white-space: nowrap; padding: 0 28px; position: relative; display: inline-flex; align-items: center; }
.marquise em::before { content: ""; position: absolute; left: -2px; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: #ffffff66; transform: translateY(-50%); }
.marquise:hover .trilha { animation-play-state: paused; }
@keyframes rolar { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquise .trilha { animation: none; } }
/* botão Área do cliente: contorno, cadeado e texto em laranja degradê */
.topo .btn.cliente { border: 1.5px solid transparent; background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #e8453c, #f28a45) border-box; color: #ee6a3e; }
.topo .btn.cliente:hover { background: linear-gradient(#fff5ee, #fff5ee) padding-box, linear-gradient(90deg, #e8453c, #f28a45) border-box; color: #ee6a3e; }
.topo .btn.cliente .grad { background: linear-gradient(90deg, #e8453c, #f28a45); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.topo .btn.cliente svg { color: #ee6a3e; }


/* ───── Efeito vidro (glass) ───── */
:root { --vidro-bg: rgba(255,255,255,.62); --vidro-borda: rgba(255,255,255,.85); --vidro-sombra: 0 10px 30px -18px rgba(10,61,53,.35), inset 0 1px 0 rgba(255,255,255,.9); }
/* cabeçalho */
.topo { background: rgba(255,255,255,.55); backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5); border-bottom: 1px solid rgba(255,255,255,.7); box-shadow: 0 1px 0 rgba(15,28,25,.06); }
.topo .btn.linha { background: rgba(255,255,255,.6); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
/* selo sobre a foto do hero */
.hero .selo { background: rgba(10,61,53,.62); backdrop-filter: blur(14px) saturate(1.4); -webkit-backdrop-filter: blur(14px) saturate(1.4); border: 1px solid rgba(255,255,255,.25); box-shadow: 0 20px 40px -20px rgba(0,0,0,.5); }
/* diagnóstico: manchetes e chips sobre o cartão com o sol laranja */
.manchete { background: var(--vidro-bg); backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4); border-color: var(--vidro-borda); box-shadow: var(--vidro-sombra); }
.diag-chips span { background: var(--vidro-bg); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-color: var(--vidro-borda); }
.diag-chamada::before { width: 680px; height: 680px; right: -260px; top: -300px; background: radial-gradient(circle, #f28a4573, transparent 62%); }
.exp-causas li { background: rgba(255,255,255,.1); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.14); }
/* pilares (banda clara inclinada) */
.banda-clara .pilar { background: var(--vidro-bg); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--vidro-borda); box-shadow: var(--vidro-sombra); }
.banda-clara .pilar.on { background: var(--verde); border-color: transparent; }
/* como funciona: vidro escuro sobre o verde */
.banda-escura .passo3 { background: rgba(255,255,255,.1); backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3); border: 1px solid rgba(255,255,255,.22); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 20px 40px -30px rgba(0,0,0,.6); }
.banda-escura .passo3 > p { color: #ffffffcc; }
.banda-escura .passo3 dl { border-top-color: rgba(255,255,255,.18); }
.banda-escura .passo3 dt { color: var(--menta); } .banda-escura .passo3 dd { color: #fff; }
.banda-escura .passo3 .p-num { background: var(--menta); color: var(--verde); }
.banda-escura .passo3 .p-tempo { background: rgba(255,255,255,.14); color: #fff; }
.banda-escura .passos-pe { background: rgba(255,255,255,.12); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,.22); color: #fff; }
.banda-escura .passos-pe b { color: var(--menta); }
.banda-escura .passos-pe .btn.preto { background: var(--menta); color: var(--verde); }
.banda-escura .passos-pe .btn.linha { border-color: rgba(255,255,255,.6); color: #fff; }
.banda-escura .passos-pe .btn.linha:hover { background: #fff; color: var(--verde); }
/* quem somos: legendas da galeria, mapa e balão */
.galeria .foto figcaption { background: rgba(255,255,255,.6); backdrop-filter: blur(14px) saturate(1.4); -webkit-backdrop-filter: blur(14px) saturate(1.4); border: 1px solid rgba(255,255,255,.8); }
.time-bloco .membro .foto { border-color: rgba(255,255,255,.75); }
.onde-nums div { background: var(--vidro-bg); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-color: var(--vidro-borda); }
.onde-mapa { border: 1px solid rgba(255,255,255,.8); box-shadow: var(--vidro-sombra); }
.mapa-dica { background: rgba(15,28,25,.72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.18); }
/* benefícios (banda clara) */
.zap { background: rgba(233,239,236,.7); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.saldo { background: rgba(255,255,255,.88); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
/* embaixadores */
.emb { background: var(--vidro-bg); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-color: var(--vidro-borda); }
/* blog (banda pêssego) */
.banda-menta .card { background: rgba(255,255,255,.7); backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3); border: 1px solid var(--vidro-borda); box-shadow: var(--vidro-sombra); }
/* conversa: chips de vidro sobre o verde */
.cta .chip { background: rgba(255,255,255,.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-color: rgba(255,255,255,.3); }
.cta .chip[aria-pressed="true"] { background: var(--menta); border-color: var(--menta); }
/* flutuante */
.boia { background: rgba(63,217,171,.85); backdrop-filter: blur(12px) saturate(1.4); -webkit-backdrop-filter: blur(12px) saturate(1.4); border: 1px solid rgba(255,255,255,.6); }
/* sem suporte a backdrop-filter, os fundos ficam mais opacos */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root { --vidro-bg: rgba(255,255,255,.92); }
  .topo { background: rgba(255,255,255,.95); }
  .banda-escura .passo3, .banda-escura .passos-pe { background: rgba(255,255,255,.16); }
}

/* leitura neural: Como trabalhamos no branco, CTA final com gancho laranja */
#metodo { padding-top: 0; }
.cta h2 i { font-style: normal; font-weight: 400; color: var(--lar-1); }
#passos.arredondada { margin-top: 0; }

/* Logo oficial: completa no cabeçalho e no rodapé */
.marca .logo { height: 34px; width: auto; display: block; }
.topo .marca { font-size: 0; }
.pe .in { align-items: center; }
.pe-marca .logo { height: 30px; }
.pe .in { display: grid; grid-template-columns: auto 1fr auto; gap: 16px 24px; align-items: center; }
@media (max-width: 760px) { .pe .in { grid-template-columns: 1fr; } .marca .logo { height: 28px; } }
/* rodapé com a logo: razão social respira, uma coluna em telas médias e pequenas */
.marca .logo { height: 38px; }
.pe .in { grid-template-columns: auto minmax(0, 1fr) auto; }
.pe .in > span { min-width: 0; }
@media (max-width: 1000px) { .pe .in { grid-template-columns: 1fr; gap: 12px; } .pe nav { gap: 14px; } }
/* ponto final do hero: verde, sem o anel do timeline (classe .ponto era compartilhada) */
.fim { color: var(--verde); }

/* Faixa minimalista: comércio e indústria */
.faixa-outros { background: #07211d; color: #fff; }
.faixa-outros .in { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 22px; flex-wrap: wrap; }
.faixa-outros p { font-size: 1.02rem; color: #ffffffd9; max-width: 62ch; }
.faixa-outros p b { color: var(--menta); font-weight: 600; }
.faixa-outros .btn { padding: 11px 18px; font-size: .9rem; white-space: nowrap; }
.faixa-outros .btn svg { width: 16px; height: 16px; }
#metodo { padding-top: clamp(64px, 8vw, 120px); }

/* ───── Benefícios: vitrine, uma cena por vez ───── */
.vitrine { margin-top: 40px; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 20px; align-items: stretch; }
.vit-lista { display: grid; gap: 10px; align-content: center; }
.vit-item { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; padding: 18px 18px 20px; border-radius: 20px; border: 1.5px solid transparent; color: var(--fg); position: relative; overflow: hidden; transition: background .3s, border-color .3s, box-shadow .3s; }
.vit-item:hover { background: #ffffff80; }
.vit-item:focus-visible { outline: 2px solid var(--menta); outline-offset: 2px; }
.vit-item.ativo { background: var(--vidro-bg); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-color: var(--vidro-borda); box-shadow: var(--vidro-sombra); }
.vit-ico { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: #e6f4ef; color: var(--verde); flex: none; transition: background .3s, color .3s; }
.vit-ico svg { width: 22px; height: 22px; display: block; }
.vit-item.ativo .vit-ico { background: var(--verde); color: var(--menta); }
.vit-item b { display: block; font-family: var(--disp); font-weight: 600; font-size: 1.08rem; letter-spacing: -.02em; line-height: 1.15; }
.vit-item span { display: block; margin-top: 4px; font-size: .9rem; line-height: 1.4; color: var(--fg-2); }
.vit-item em { position: absolute; right: 14px; top: 14px; font-style: normal; font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; background: var(--menta); color: var(--verde); border-radius: 999px; padding: 3px 8px; }
.vit-item .barra { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--menta), var(--lar-2)); transform-origin: left; transform: scaleX(0); }
.vit-item.ativo .barra { animation: vit-prog var(--vit-dur, 9s) linear forwards; }
.vitrine.pausa .barra { animation-play-state: paused; }
@keyframes vit-prog { to { transform: scaleX(1); } }
.vit-palco { position: relative; border-radius: 28px; background: radial-gradient(55% 55% at 85% 0%, #ffbe8545, transparent 70%), radial-gradient(45% 45% at 0% 100%, #3fd9ab33, transparent 70%), linear-gradient(160deg, var(--verde), #0f5247); padding: 32px; min-height: 500px; display: grid; place-items: center; overflow: hidden; box-shadow: 0 40px 80px -40px #0a3d3599; }
.vit-cena { display: none; width: 100%; max-width: 420px; animation: vit-entra .5s cubic-bezier(.2,.7,.2,1) both; }
.vit-cena.ativa { display: block; }
@keyframes vit-entra { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
.vit-cena .legenda { margin: 16px 0 0; text-align: center; color: #ffffffcc; font-size: .88rem; }
.vit-palco .zap { background: #e9efec; backdrop-filter: none; -webkit-backdrop-filter: none; min-height: 360px; box-shadow: 0 30px 50px -30px #000a; }
.vit-palco .grafico { background: #fff; box-shadow: 0 30px 50px -30px #000a; }
.vit-palco .moedas { height: 220px; }
/* e mais: cinco cartões iguais, baixos */
.ben-mais { margin: 20px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.ben-mais li { background: var(--vidro-bg); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1.5px solid var(--vidro-borda); border-radius: 18px; padding: 16px; display: grid; gap: 6px; align-content: start; min-width: 0; }
.ben-mais .vit-ico { width: 36px; height: 36px; border-radius: 11px; margin-bottom: 4px; } .ben-mais .vit-ico svg { width: 18px; height: 18px; }
.ben-mais b { font-family: var(--disp); font-weight: 600; font-size: .95rem; letter-spacing: -.01em; }
.ben-mais span { font-size: .82rem; line-height: 1.4; color: var(--fg-2); }
@media (max-width: 1000px) { .vitrine { grid-template-columns: 1fr; } .vit-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } .vit-item { grid-template-columns: 1fr; gap: 8px; padding: 14px; } .vit-item span { display: none; } .vit-item em { position: static; width: max-content; } .vit-palco { min-height: 0; } .ben-mais { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .vit-lista { grid-template-columns: 1fr; } .vit-item { grid-template-columns: 44px 1fr; gap: 14px; } .vit-item span { display: block; } .vit-item em { position: absolute; } .vit-item:not(.ativo) span { display: none; } .vit-palco { padding: 16px; } .vit-palco .zap { min-height: 0; } .ben-mais { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .ben-mais { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .vit-cena { animation: none; } .vit-item.ativo .barra { animation: none; transform: scaleX(1); } }

/* ───── Diagnóstico: faixa laranja gradiente (no tom das fotos do time) para puxar o olho ───── */
#diagnostico { background: radial-gradient(60% 80% at 100% 0%, #ffd6b3 0%, transparent 60%), radial-gradient(50% 60% at 0% 100%, #ffbe8599 0%, transparent 60%), linear-gradient(135deg, var(--lar-1) 0%, var(--lar-2) 55%, var(--lar-3) 100%); }
#diagnostico .diag-chamada { background: rgba(255,255,255,.9); backdrop-filter: blur(18px) saturate(1.2); -webkit-backdrop-filter: blur(18px) saturate(1.2); border: 1.5px solid rgba(255,255,255,.85); box-shadow: 0 50px 90px -50px #7a2e0a99, inset 0 1px 0 #fff; }
#diagnostico .diag-chamada::before { background: radial-gradient(circle, #ffbe8566, transparent 62%); }
#diagnostico .diag-txt h2 i { background: linear-gradient(90deg, #c6391f 0%, var(--lar-3) 100%); -webkit-background-clip: text; background-clip: text; }
#diagnostico .manchete, #diagnostico .diag-chips span { background: #fff; }
#diagnostico .diag-nota { color: var(--fg-2); }
/* vidro de verdade no cartão do diagnóstico: o laranja aparece por trás */
#diagnostico .diag-chamada { background: linear-gradient(160deg, rgba(255,255,255,.62) 0%, rgba(255,255,255,.42) 100%); backdrop-filter: blur(22px) saturate(1.4); -webkit-backdrop-filter: blur(22px) saturate(1.4); border: 1.5px solid rgba(255,255,255,.7); box-shadow: 0 50px 90px -50px #7a2e0a99, inset 0 1px 0 rgba(255,255,255,.9), inset 0 -1px 0 rgba(255,255,255,.3); }
#diagnostico .diag-chamada::before { display: none; }
#diagnostico .manchete, #diagnostico .diag-chips span { background: rgba(255,255,255,.55); border-color: rgba(255,255,255,.75); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
#diagnostico .manchete:hover, #diagnostico .manchete:focus-visible { background: rgba(255,255,255,.85); }
#diagnostico .diag-txt .lede, #diagnostico .diag-nota { color: #3a2a20; }

/* cena: cobrança de pacientes e clientes */
.cobr { background: #fff; border-radius: 22px; padding: 16px; box-shadow: 0 50px 90px -40px #000c, 0 0 0 1px rgba(255,255,255,.5) inset; }
.c-topo { display: flex; justify-content: space-between; align-items: baseline; font-size: .78rem; color: var(--fg-2); padding: 0 4px; }
.c-topo b { font-family: var(--disp); font-size: 1.05rem; color: var(--fg); }
.c-lista { display: grid; gap: 6px; margin-top: 12px; }
.c-item { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: center; padding: 10px 12px; border-radius: 12px; background: var(--papel); font-size: .82rem; animation: c-entra .5s cubic-bezier(.2,.7,.2,1) both; }
.c-item:nth-child(2) { animation-delay: .35s; } .c-item:nth-child(3) { animation-delay: .7s; } .c-item:nth-child(4) { animation-delay: 1.05s; }
@keyframes c-entra { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
.c-item span { color: var(--fg); font-weight: 500; }
.c-item em { font-style: normal; font-family: var(--disp); font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.c-item i { grid-column: 1 / -1; font-style: normal; font-size: .72rem; font-weight: 600; color: var(--menta-texto, #1f9e7c); }
.c-item i::before { content: "● "; font-size: .6rem; }
.c-item.env i { color: var(--lar-3); } .c-item.nov i { color: var(--fg-3); }
.c-pe { margin-top: 12px; }
.c-barra { display: block; height: 8px; border-radius: 999px; background: #e3ece8; overflow: hidden; }
.c-barra i { display: block; height: 100%; width: var(--p); border-radius: 999px; background: linear-gradient(90deg, var(--menta), var(--menta-texto, #1f9e7c)); animation: c-cresce 1.4s .8s cubic-bezier(.2,.7,.2,1) both; }
@keyframes c-cresce { from { width: 0; } }
.c-pe small { display: block; margin-top: 8px; font-size: .74rem; color: var(--fg-2); line-height: 1.4; }
@media (prefers-reduced-motion: reduce) { .c-item, .c-barra i { animation: none; } }
.vit-item em, .vit-item.ativo em { position: static; display: inline-block; width: max-content; margin-top: 6px; }
@media (max-width: 760px) { .vit-item em { position: static; } }

/* cena: Aclari Educa (player + lista de aulas) */
.educa { background: #fff; border-radius: 22px; padding: 12px; box-shadow: 0 50px 90px -40px #000c, 0 0 0 1px rgba(255,255,255,.5) inset; }
.e-video { position: relative; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; padding: 16px; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; color: #fff; background: radial-gradient(60% 70% at 85% 10%, #f28a4566, transparent 60%), linear-gradient(160deg, #0f5247, var(--verde)); }
.e-tag { position: absolute; left: 14px; top: 14px; font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--verde); background: var(--menta); border-radius: 999px; padding: 4px 9px; }
.e-video b { font-family: var(--disp); font-weight: 700; font-size: 1rem; letter-spacing: -.02em; line-height: 1.15; max-width: 22ch; }
.e-play { position: absolute; left: 50%; top: 46%; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; background: rgba(255,255,255,.92); box-shadow: 0 16px 30px -12px #000a; animation: e-pulsa 2.4s ease-in-out infinite; }
.e-play::after { content: ""; position: absolute; left: 21px; top: 16px; border-left: 16px solid var(--verde); border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
@keyframes e-pulsa { 0%, 100% { box-shadow: 0 16px 30px -12px #000a, 0 0 0 0 #ffffff55; } 50% { box-shadow: 0 16px 30px -12px #000a, 0 0 0 14px #ffffff00; } }
.e-barra { height: 4px; border-radius: 999px; background: #ffffff3d; overflow: hidden; margin-top: 4px; }
.e-barra i { display: block; height: 100%; width: 38%; background: var(--menta); border-radius: 999px; animation: e-toca 9s linear infinite; }
@keyframes e-toca { from { width: 8%; } to { width: 92%; } }
.e-lista { display: grid; gap: 4px; margin-top: 10px; }
.e-item { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; font-size: .82rem; color: var(--fg); animation: c-entra .5s cubic-bezier(.2,.7,.2,1) both; }
.e-item:nth-child(2) { animation-delay: .3s; } .e-item:nth-child(3) { animation-delay: .6s; }
.e-item:hover { background: var(--papel); }
.e-item i { width: 28px; height: 28px; border-radius: 8px; background: var(--papel); position: relative; }
.e-item i::after { content: ""; position: absolute; left: 11px; top: 8px; border-left: 8px solid var(--verde); border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
.e-item em { font-style: normal; font-size: .72rem; color: var(--fg-3); font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { .e-play, .e-barra i, .e-item { animation: none; } }
/* play do Aclari Educa um pouco acima, para não cobrir o título em telas estreitas */
.e-play { top: 38%; }
@media (max-width: 760px) { .e-play { top: 30%; width: 48px; height: 48px; margin: -24px 0 0 -24px; } .e-play::after { left: 18px; top: 13px; } }

/* ───── Quem somos: o que está incluso, em dois lados (CNPJ / Plataforma) que viram ao clicar ───── */
.incluso { margin-top: 24px; perspective: 1600px; }
.inc-abas { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; }
.inc-aba { all: unset; cursor: pointer; font-family: var(--disp); font-weight: 600; font-size: .9rem; padding: 8px 14px; border-radius: 999px; border: 1.5px solid var(--linha); color: var(--fg-2); transition: background .25s, color .25s, border-color .25s; }
.inc-aba:hover { border-color: var(--verde); color: var(--fg); }
.inc-aba:focus-visible { outline: 2px solid var(--menta); outline-offset: 2px; }
.inc-aba.ativo { background: var(--verde); border-color: var(--verde); color: #fff; }
.inc-dica { margin-left: auto; font-size: .74rem; color: var(--fg-3); }
.inc-carta { all: unset; box-sizing: border-box; display: grid; width: 100%; cursor: pointer; position: relative; transform-style: preserve-3d; transition: transform .8s cubic-bezier(.3,.7,.2,1); }
.inc-carta:focus-visible { outline: 2px solid var(--menta); outline-offset: 6px; border-radius: 24px; }
.inc-carta.virada { transform: rotateY(180deg); }
.inc-face { grid-area: 1 / 1; backface-visibility: hidden; -webkit-backface-visibility: hidden; background: var(--vidro-bg); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1.5px solid var(--vidro-borda); box-shadow: var(--vidro-sombra); border-radius: 24px; padding: 20px 22px 8px; }
.inc-face.verso { transform: rotateY(180deg); }
.inc-rot { display: block; font-family: var(--disp); font-weight: 700; font-size: 1.15rem; letter-spacing: -.02em; }
.inc-rot em { font-style: normal; font-family: var(--corpo); font-weight: 600; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-3); margin-left: 8px; }
.inc-face .lista { margin-top: 10px; border-top-color: var(--linha); }
.inc-face .lista div { font-size: 1rem; padding: 12px 0; }
.inc-face .lista div:last-child { border-bottom: 0; }
@media (prefers-reduced-motion: reduce) { .inc-carta { transition: none; } }
.inc-face .lista div.mais { grid-template-columns: 1fr; font-family: var(--corpo); font-weight: 500; font-style: italic; color: var(--fg-2); font-size: .92rem; }

/* embaixadores: @ do Instagram */
.emb .insta { margin-top: auto; align-self: center; font-size: .8rem; font-weight: 600; color: var(--verde); text-decoration: none; padding: 5px 10px; border-radius: 999px; background: var(--menta-2); }
.emb .insta:hover { background: var(--menta); }
.emb .insta + .desde, .emb .desde + .insta { margin-top: 0; }

/* ───── Áreas: Psicólogos em destaque (2×2), os demais cartões menores ───── */
.trilho.areas { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.trilho.areas .cartao-area { min-height: 0; padding: 18px; gap: 6px; border-radius: 20px; }
.trilho.areas .cartao-area h3 { font-size: 1.05rem; margin-top: auto; }
.trilho.areas .cartao-area p { font-size: .82rem; line-height: 1.4; }
.trilho.areas .cartao-area .ir { font-size: .85rem; margin-top: 2px; }
.trilho.areas .cartao-area.destaque { grid-column: span 2; grid-row: span 2; padding: 28px; border-radius: var(--r); background: radial-gradient(60% 60% at 90% 0%, #f28a4540, transparent 70%), var(--verde); }
.trilho.areas .cartao-area.destaque h3 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); letter-spacing: -.03em; }
.trilho.areas .cartao-area.destaque p { font-size: 1rem; max-width: 34ch; }
.trilho.areas .cartao-area.destaque .ir { font-size: 1rem; }
.trilho.areas .cartao-area.largo { grid-column: span 2; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 20px; }
.trilho.areas .cartao-area.largo h3 { margin-top: 0; } .trilho.areas .cartao-area.largo p { flex: 1 1 220px; }
.trilho.areas .cartao-area:last-child { grid-column: span 2; min-height: 0; }
@media (max-width: 1000px) { .trilho.areas { grid-template-columns: 1fr 1fr; } .trilho.areas .cartao-area.destaque { grid-row: auto; min-height: 220px; } }
@media (max-width: 760px) { .trilho.areas .cartao-area { flex: 0 0 68vw; min-height: 170px; } .trilho.areas .cartao-area.destaque { flex-basis: 86vw; min-height: 0; } .trilho.areas .cartao-area.largo { flex-direction: column; align-items: flex-start; } }
/* quem somos: três sócios sob a foto do escritório */
.galeria { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.galeria .foto figcaption { font-size: .78rem; padding: 8px 10px; left: 8px; right: 8px; bottom: 8px; }
.galeria .foto figcaption b { font-size: .92rem; }
@media (max-width: 480px) { .galeria { grid-template-columns: 1fr 1fr; } .galeria .foto:first-child { grid-column: 1 / -1; } }
.emb .historia { font-weight: 600; font-size: .88rem; color: var(--verde); text-decoration: none; } .emb .historia:hover { text-decoration: underline; }

/* embaixador (home): Jan Leonardi */
#embaixador { padding-bottom: 0; }
.embx { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 64px); align-items: center; background: var(--papel); border-radius: 32px; padding: clamp(28px, 4.5vw, 60px); }
.embx-foto { margin: 0; text-align: center; }
.embx-foto .foto { width: min(260px, 70%); aspect-ratio: 1 / 1; margin: 0 auto; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 5px #fff, 0 0 0 8px var(--lar-2, var(--menta)), 0 24px 40px -20px rgba(10,61,53,.45); }
.embx-foto img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; display: block; }
.embx-foto figcaption { margin-top: 22px; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.embx-foto b { font-family: var(--disp); font-size: 1.3rem; font-weight: 600; letter-spacing: -.02em; }
.embx-foto span { color: var(--fg-2); font-size: .88rem; max-width: 30ch; }
.embx-foto .insta { margin-top: 8px; font-size: .8rem; font-weight: 600; color: var(--verde); text-decoration: none; padding: 5px 10px; border-radius: 999px; background: var(--menta-2); }
.embx-foto .insta:hover { background: var(--menta); }
.embx-txt h2 { max-width: 22ch; }
.embx-txt .lede { margin-top: 16px; max-width: 56ch; }
.embx-txt .lede b { color: var(--fg); }
.embx-lista { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.embx-lista li { position: relative; padding-left: 28px; color: var(--fg-2); }
.embx-lista li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--verde); color: var(--menta); font-size: .7rem; font-weight: 700; display: grid; place-items: center; }
.embx .acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
@media (max-width: 860px) { .embx { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .embx .acoes .btn { width: 100%; justify-content: center; } }

/* clientes e parceiros: uma linha só, desliza para o lado */
.trilho.embaixadores { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 16px; margin-top: 16px; padding: 8px 2px 18px; }
.trilho.embaixadores::-webkit-scrollbar { display: none; }
.trilho.embaixadores .emb { flex: 0 0 calc((100% - 48px) / 4); scroll-snap-align: start; }
.emb-nav { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 32px; }
.emb-dica { margin-right: auto; color: var(--fg-3); font-size: .85rem; }
.emb-seta { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--linha); background: #fff; color: var(--fg); font: inherit; font-size: 1.1rem; cursor: pointer; transition: border-color .2s, background .2s, opacity .2s; }
.emb-seta:hover { border-color: var(--fg); }
.emb-seta:disabled { opacity: .35; cursor: default; border-color: var(--linha); }
.emb-seta:focus-visible { outline: 2px solid var(--verde); outline-offset: 2px; }
@media (max-width: 1000px) { .trilho.embaixadores .emb { flex-basis: calc((100% - 32px) / 3); } }
@media (max-width: 760px) { .trilho.embaixadores { margin-top: 8px; padding: 8px var(--gut) 18px; scroll-padding-inline: var(--gut); } .trilho.embaixadores .emb { flex-basis: 72vw; } .emb-seta { display: none; } .emb-nav { margin-top: 20px; } }

/* serviços (home) */
.servicos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 44px; }
.servico { border: 1.5px solid var(--linha); border-radius: var(--r); padding: 24px; background: #fff; display: flex; flex-direction: column; gap: 8px; transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .2s; }
.servico:hover { transform: translateY(-4px); border-color: var(--fg); }
.servico .tag { align-self: flex-start; }
.servico h3 { font-size: 1.2rem; font-weight: 600; line-height: 1.15; letter-spacing: -.02em; }
.servico p { color: var(--fg-2); font-size: .92rem; line-height: 1.5; }
.servico ul { list-style: none; margin: auto 0 0; padding: 10px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.servico li { font-size: .76rem; font-weight: 600; color: var(--verde); background: var(--menta-2); border-radius: 999px; padding: 4px 10px; }
.servico.largo { grid-column: span 2; }
.servico.on { background: var(--verde); color: #fff; border-color: var(--verde); }
.servico.on h3 { font-size: 1.55rem; }
.servico.on p { color: #ffffffcc; font-size: 1rem; }
.servico.on li { background: #ffffff1f; color: var(--menta); }
.servico.on .tag { background: var(--menta); }
.servico.realce { background: var(--papel); border-color: var(--papel); }
.servico.realce li { background: #fff; }
.servicos-mais { margin-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap; border: 1.5px dashed var(--linha); border-radius: var(--r); padding: 20px 24px; }
.servicos-mais p { flex: 1 1 360px; color: var(--fg-2); }
.servicos-mais b { color: var(--fg); }
@media (max-width: 1000px) { .servicos { grid-template-columns: 1fr 1fr; } .servico.realce { grid-column: span 2; } }
@media (max-width: 600px) { .servicos { grid-template-columns: 1fr; } .servico.largo, .servico.realce { grid-column: auto; } .servicos-mais .btn { width: 100%; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .servico { transition: none; } }

/* OFFLINE: o que está fora do ar sem ser apagado. Para religar, remova a linha. (Páginas inteiras: veja também _redirects.) */
a[href$="area-do-cliente.html"] { display: none !important; } /* Área do cliente: botão do topo, menu do celular e rodapés */
#beneficios, a[href$="#beneficios"] { display: none !important; } /* Benefícios: seção da home, item do menu e links */
#incluso { display: none !important; } /* Cartão CNPJ / Pessoa física em "Quem somos" (substituído pela seção Serviços) */
