/* ============================================================
   assessoria.css — só o que é DESTA página.
   Componentes compartilhados: tribo-componentes.css.
   Escala tipográfica (h1, h2, lead, h3): tokens na tribo-base.css.
   Ordem de carga: base → componentes → esta. O que estiver aqui vence.
   ============================================================ */
::selection{background:rgba(164,151,112,.35);color:#141414}
/* O .skip-link mudou-se para o tribo-base.css, ao lado do cabecalho que o
   usa: ele e de todas as paginas, nao so desta. (21/09/2026) */
/* ============================================================
   O RECUO DA ANCORA VEM DE UM LUGAR SO          (21/09/2026)

   Aqui havia main section[id]{scroll-margin-top:90px}. Saiu porque
   scroll-padding-top e scroll-margin-top NAO sao alternativas: o primeiro
   fica na caixa de rolagem e o segundo no alvo, e o navegador aplica OS
   DOIS. No celular isso dava 78 + 90 = 168px de recuo contra um cabecalho
   de 64px: 104px de vazio acima de toda secao alcancada por ancora, e o
   que o visitante via primeiro era uma faixa da secao ANTERIOR.

   Os quatro numeros do projeto (88, 78, 90, 84) foram escritos cada um
   como "altura do cabecalho mais uma folga", em momentos diferentes. Por
   isso a folga estava sendo cobrada duas vezes.

   A fonte unica passa a ser o html{scroll-padding-top} da tribo-base.css:
   88px no desktop (72 de cabecalho + 16) e 78px no celular (64 + 14). E o
   mecanismo certo porque vale para ancora, para scrollIntoView e para a
   navegacao por teclado, que o scroll-margin do alvo nao cobre sozinho.

   Nao e invencao: o sites.css ja resolveu assim de proposito, na secao
   "Anchor scroll offset", zerando o scroll-margin de todo [id].
   ============================================================ */

.sl-f-bottom a{color:rgba(245,242,236,.7)}
.section-header p{margin-top:4px}
.qs-content,.mp-form-aside{counter-increment:sec}
.eyebrow::before{display:none}
.qs-content .eyebrow,.mp-form-aside .eyebrow{gap:12px}
.qs .qs-content .eyebrow::before,.mp-form-aside .eyebrow::before{display:inline-block;content:counter(sec,decimal-leading-zero);
  width:auto;height:auto;background:none;border-radius:var(--r-sm);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1;padding:4px 7px;
  color:var(--sl-olive-text);border:1px solid rgba(164,151,112,.5)}
.qs .qs-content .eyebrow::before,.mp-form-aside .eyebrow::before{color:var(--sl-amber-light);border-color:rgba(201,194,171,.4);background:none}
.btn svg{transition:transform var(--dur) var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.tb-stagger.sl-in > :nth-child(n+7){transition-delay:400ms}
@media (prefers-reduced-motion:reduce){
  .tb-stagger > *{opacity:1;transform:none;transition:none}
  .btn-primary::after{display:none}
}
.mp-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.mp-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.mp-apoio .ico,.mp-pilar-intro .ico{width:48px;height:48px;border-radius:var(--r-xl);background:var(--sl-sage);display:flex;align-items:center;justify-content:center;color:var(--sl-olive-text);margin-bottom:20px;flex-shrink:0;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}
.mp-apoio .ico svg,.mp-pilar-intro .ico svg{width:23px;height:23px}
.mp-apoio .ico{background:var(--sl-olive);color:#fff}
.mp-apoio .ico svg{stroke-width:1.9}
.mp-micro{text-align:center;font-size:14px;color:var(--fg-muted);max-width:760px;margin:40px auto 0;line-height:1.6}
.mp-micro.on-dark{color:rgba(245,242,236,.6)}
/* duas linhas micro seguidas sao um bloco so: os 40px sao a distancia do
   conteudo da secao, nao de uma linha para a outra (a de guias por
   especialidade entrou antes da da reuniao em 25/09/2026) */
.mp-micro + .mp-micro{margin-top:10px}
@media (max-width:960px){
  .mp-grid-3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .mp-grid-3,.mp-grid-2{grid-template-columns:1fr}
}
.mp-hero{position:relative;overflow:hidden;background:#141414;color:#fff;padding:96px 0 104px;isolation:isolate}
.mp-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:
  radial-gradient(60% 70% at 85% 30%,rgba(164,151,112,.22),transparent 60%),
  radial-gradient(50% 60% at 10% 90%,rgba(164,151,112,.10),transparent 60%),
  linear-gradient(180deg,#141414 0%,#0e0e0e 100%)}
.mp-hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.35;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.mp-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:72px;align-items:center}
.mp-hero .eyebrow{color:var(--sl-amber-light)}
.mp-hero h1{color:#fff;font-size:var(--fs-h1);font-weight:800;letter-spacing:var(--ls-h1);line-height:var(--lh-h1);margin:24px 0 24px}
.mp-hero h1 em{font-style:normal;color:var(--sl-amber-light);position:relative;white-space:nowrap}
.mp-hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:2px;background:linear-gradient(90deg,var(--sl-amber-light),transparent);transform:scaleX(0);transform-origin:left;animation:mp-rule 1s .9s var(--ease) forwards}
.mp-hero-lead{font-size:var(--fs-lead);line-height:var(--lh-lead);color:rgba(245,242,236,.78);max-width:560px}
.mp-hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}
.mp-hero-micro{margin-top:18px;font-size:13.5px;color:rgba(245,242,236,.6);display:flex;align-items:center;gap:8px}
.mp-hero-micro svg{width:16px;height:16px;color:var(--sl-amber-light);flex-shrink:0}
.mp-hero-proofs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px;padding-top:30px;border-top:1px solid rgba(245,242,236,.12)}
.mp-hero-proofs div{display:flex;flex-direction:column;gap:3px;position:relative;padding-left:14px}
.mp-hero-proofs div::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:1px;background:var(--sl-olive)}
.mp-hero-proofs b{font-size:22px;font-weight:800;letter-spacing:-0.02em;color:#fff}
.mp-hero-proofs span{font-size:12.5px;color:rgba(245,242,236,.6)}
.mp-hero-text > *{animation:mp-rise .8s var(--ease) both}
.mp-hero-text > :nth-child(1){animation-delay:.05s}
.mp-hero-text > :nth-child(2){animation-delay:.15s}
.mp-hero-text > :nth-child(3){animation-delay:.28s}
.mp-hero-text > :nth-child(4){animation-delay:.40s}
.mp-hero-text > :nth-child(5){animation-delay:.50s}
.mp-hero-text > :nth-child(6){animation-delay:.60s}
.mp-hero-art{position:relative;display:flex;justify-content:center;animation:mp-rise 1s .25s var(--ease) both}
.mp-hero-ring{position:absolute;width:min(118%,620px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(164,151,112,.22);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.mp-hero-ring::before{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid transparent;border-top-color:rgba(201,194,171,.55);animation:mp-spin 14s linear infinite}
.mp-hero-photo{position:relative;width:min(100%,520px);aspect-ratio:1;border-radius:28px;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.8),0 0 0 1px rgba(245,242,236,.08)}
.mp-hero-photo::before{content:"";position:absolute;inset:-2px;border-radius:30px;padding:2px;background:linear-gradient(135deg,rgba(164,151,112,.9),rgba(164,151,112,0) 45%,rgba(164,151,112,.35));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:2}
.mp-hero-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease)}
.mp-hero-art:hover .mp-hero-photo img{transform:scale(1.03)}
.mp-hero-badge{position:absolute;left:-18px;bottom:28px;background:var(--sl-forest);border:1px solid rgba(164,151,112,.5);border-radius:var(--r-xl);padding:12px 16px;box-shadow:var(--sl-shadow-lg);max-width:290px;animation:mp-rise .8s .7s var(--ease) both}
.mp-hero-badge b{display:block;color:var(--sl-amber-light);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:4px}
.mp-hero-badge span{font-size:13px;color:rgba(245,242,236,.8);line-height:1.4}
.mp-hero-chip{position:absolute;right:-14px;top:36px;display:flex;align-items:center;gap:10px;background:rgba(20,20,20,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(164,151,112,.45);border-radius:var(--r-pill);padding:10px 16px 10px 14px;box-shadow:var(--sl-shadow-lg);animation:mp-rise .8s .85s var(--ease) both}
.mp-hero-chip b{font-size:22px;font-weight:800;letter-spacing:-0.03em;color:var(--sl-amber-light);line-height:1}
.mp-hero-chip span{font-size:11px;line-height:1.25;color:rgba(245,242,236,.75)}
@keyframes mp-rise{
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:none}
}
@keyframes mp-rule{
  to{transform:scaleX(1)}
}
@media (prefers-reduced-motion:reduce){
  .mp-hero-text > *,.mp-hero-art,.mp-hero-badge,.mp-hero-chip{animation:none}
  .mp-hero h1 em::after{transform:none;animation:none}
  .mp-hero-ring::before{animation:none}
  /* o pontinho que pulsa dentro da seta. A seta EM SI e tratada logo
     abaixo da sua propria regra-base, e o porque esta escrito la. */
  .mp-scroll-cue span{animation:none}
}
@media (max-width:960px){
  .mp-hero{padding:56px 0 64px}
  .mp-hero-grid{grid-template-columns:1fr;gap:44px}
  .mp-hero-art{order:-1}
  .mp-hero-photo{width:min(80vw,380px)}
  .mp-hero-ring{display:none}
  .mp-hero-badge{left:auto;right:0;bottom:-14px;max-width:240px;padding:10px 14px}
  .mp-hero-chip{right:auto;left:0;top:-12px;padding:8px 12px 8px 10px}
  .mp-hero-chip b{font-size:18px}
  .mp-hero-cta .btn{width:100%}
  .mp-hero-proofs{grid-template-columns:1fr;gap:16px}
}
.mp-dores{background:#fff}
.mp-dores-grid{display:grid;grid-template-columns:340px 1fr;gap:36px;align-items:start}
.mp-dores-grid > .mp-grid-2{grid-column:2;grid-row:1}
.mp-dores .tb-card{background:var(--sl-off-white)}
.mp-dores-aside{grid-column:1;grid-row:1;position:sticky;top:100px}
.mp-founder{margin:0;background:var(--sl-forest);border-radius:var(--r-xl);padding:0;color:#fff;position:relative;overflow:hidden}
.mp-founder::after{content:"";position:absolute;inset:auto -40px -40px auto;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(164,151,112,.38),transparent 70%);pointer-events:none}
.mp-founder img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 12%;border:0;border-radius:0;margin:0}
.mp-founder-txt{position:relative;padding:22px 26px 26px}
.mp-founder-txt::before{content:"“";position:absolute;right:20px;top:-6px;font-size:84px;line-height:1;font-weight:800;color:rgba(164,151,112,.22);pointer-events:none}
.mp-founder blockquote{margin:0 0 16px;font-size:17px;line-height:1.5;font-weight:600;color:#fff;position:relative;padding-right:42px}
.mp-founder figcaption{font-size:13px;color:rgba(245,242,236,.65);position:relative}
.mp-founder figcaption b{display:block;color:var(--sl-amber-light);font-size:14px;margin-bottom:2px}
@media (max-width:960px){
  .mp-dores-grid{grid-template-columns:1fr}
  .mp-dores-grid > .mp-grid-2,.mp-dores-aside{grid-column:auto;grid-row:auto}
  .mp-dores-aside{position:static;max-width:420px}
  .mp-founder img{aspect-ratio:16/10;object-position:50% 18%}
}
/* A superfície escura vem da base (.on-dark): malha, ruído e filete.
   Aqui ficam só as medidas desta seção. (14/09/2026) 

   ESTA REGRA ESTEVE MORTA DE 14/09 A 21/09/2026 por um caractere. O
   comentario acima foi gravado com as quebras de linha como TEXTO (a
   barra invertida seguida de n, dois caracteres) em vez de quebras
   reais, e a ultima caiu DEPOIS do fecha-comentario, colada no seletor.
   Em CSS a barra invertida seguida de n e um escape que vale a letra n,
   entao o seletor virava n.mp-metodo: um elemento chamado "n" com a
   classe, que nao existe em HTML nenhum. Conferido no od -c. */
.mp-metodo{color:#fff}
.mp-metodo .container{position:relative}
/* As abas nascem ESCONDIDAS e so aparecem quando o JS declara que assumiu
   o modo de abas. Sem ele elas seriam cinco botoes que nao fazem nada, ao
   lado de um acordeao que funciona. (22/09/2026) */
.mp-tabs{display:none;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:22px}
.mp-tabs.js-abas{display:grid}
.mp-tab{position:relative;background:rgba(245,242,236,.04);border:1px solid rgba(245,242,236,.12);border-radius:var(--r-xl);padding:16px 16px 18px;color:rgba(245,242,236,.75);cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;overflow:hidden;transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}
.mp-tab::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:2px;background:var(--sl-amber-light);transform:scaleX(0);transform-origin:left;transition:transform var(--dur) var(--ease)}
.mp-tab .n{font-size:11px;letter-spacing:.14em;color:var(--sl-amber-light);font-weight:700}
.mp-tab .t{font-size:16px;font-weight:700;color:#fff}
.mp-tab:hover{background:rgba(245,242,236,.08);transform:translateY(-1px)}
.mp-tab.is-active{background:var(--sl-olive);border-color:var(--sl-olive);color:#fff}
.mp-tab.is-active::after{transform:scaleX(1);background:#141414}
.mp-tab.is-active .n{color:rgba(20,20,20,.75)}
.mp-tab.is-active .t{color:#141414}
.mp-pilares{display:block}
.mp-pilar{background:rgba(245,242,236,.04);border:1px solid rgba(245,242,236,.12);border-radius:20px;overflow:hidden}
/* O SUMMARY NASCE VISIVEL                            (22/09/2026)

   Era display:none aqui e display:flex so abaixo de 960px. No desktop, quem
   escondia os pilares nao-ativos era o @media de 961px — e quem punha a
   classe .is-active era o JavaScript. Se ele nao chegasse (falha de rede,
   bloqueador, erro antes), o desktop ficava com o pilar 01 aberto e os
   outros QUATRO invisiveis, sem summary para clicar: quatro quintos do
   metodo sumiam sem deixar rastro.

   Agora o padrao e o acordeao nativo, que funciona sem script nenhum, e
   quem PEDE o modo de abas e o proprio JS, pela classe .js-abas. */
.mp-pilar summary{display:flex;list-style:none;cursor:pointer;padding:18px 20px;align-items:center;gap:14px}
.mp-pilar summary::-webkit-details-marker{display:none}
/* O anel de foco global (3px, 3px de afastamento) era recortado: o .mp-pilar
   tem overflow:hidden e o <summary> ocupa o content box inteiro, entao o anel
   caia fora da caixa de recorte. Em vez de mexer no overflow, que e quem
   arredonda o cartao, o anel passa a ser desenhado para DENTRO. (21/09/2026) */
.mp-pilar summary:focus-visible{outline-offset:-3px}
.mp-pilar summary .n{font-size:11px;letter-spacing:.14em;color:var(--sl-amber-light);font-weight:700}
/* O .t virou <h3> em 21/09/2026 (era <span>). Duas propriedades seguram a
   aparencia, e as duas foram descobertas medindo, nao no olho:
     margin:0        senao herda a margem do titulo padrao do navegador
     line-height     o <span> herdava 1,6 do corpo e dava 27,2px; o <h3> traz
                     1,15 proprio e dava 19,55px. O cabecalho do cartao
                     encolhia de 63px para 58px de altura. */
.mp-pilar summary .t{font-size:17px;font-weight:700;color:#fff;flex:1;margin:0;line-height:inherit}
.mp-pilar summary .chev{width:22px;height:22px;color:var(--sl-amber-light);transition:transform var(--dur) var(--ease)}
.mp-pilar summary .chev svg{width:22px;height:22px}
.mp-pilar[open] summary .chev{transform:rotate(180deg)}
.mp-pilar-body{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;padding:40px 40px 44px}
.mp-pilar.is-active .mp-pilar-body{animation:mp-fade .45s var(--ease) both}
@keyframes mp-fade{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}
.mp-pilar-intro{position:relative}
.mp-pilar-intro::before{content:attr(data-n);position:absolute;right:0;top:-28px;font-size:150px;line-height:1;font-weight:800;letter-spacing:-0.06em;color:rgba(164,151,112,.09);pointer-events:none;user-select:none}
.mp-pilar-intro .ico{background:rgba(164,151,112,.15);color:var(--sl-amber-light)}
.mp-pilar-intro h3{color:#fff;font-size:28px;margin-bottom:14px;letter-spacing:-0.02em;position:relative}
.mp-pilar-intro p{font-size:16.5px;line-height:1.68;color:rgba(245,242,236,.75);position:relative}
.mp-pilar-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.mp-pilar-list li{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;background:rgba(245,242,236,.04);border:1px solid rgba(245,242,236,.08);border-radius:var(--r-lg);transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}
@media (hover:hover){
  .mp-pilar-list li:hover{background:rgba(245,242,236,.07);border-color:rgba(164,151,112,.4);transform:translateX(3px)}
}
.mp-pilar-list svg{width:20px;height:20px;flex-shrink:0;color:var(--sl-amber-light);margin-top:2px}
.mp-pilar-list b{display:block;color:#fff;font-size:15px;margin-bottom:2px}
.mp-pilar-list span{font-size:14px;color:rgba(245,242,236,.7);line-height:1.5}
.mp-metodo-nota{max-width:760px;margin:32px auto 0;text-align:center;font-size:14.5px;color:rgba(245,242,236,.65);line-height:1.6}
@media (min-width:961px){
  .mp-pilares.js-abas .mp-pilar:not(.is-active){display:none}
  .mp-pilares.js-abas .mp-pilar summary{display:none}
}
@media (max-width:960px){
  .mp-tabs{display:none}
  .mp-pilares{display:flex;flex-direction:column;gap:10px}
  .mp-pilar-body{grid-template-columns:1fr;gap:22px;padding:6px 20px 24px}
  .mp-pilar.is-active .mp-pilar-body{animation:none}
  .mp-pilar-intro::before{display:none}
  .mp-pilar-intro h3{display:none}
  .mp-pilar-intro .ico{display:none}
  /* o scroll-margin daqui saiu junto com o de main section[id]: somava com
     o scroll-padding-top e empurrava o pilar recem-aberto 162px para
     baixo, com ~98px de vazio escuro em cima. O assessoria.js dispara um
     scrollIntoView a cada abertura no celular, entao isso acontecia nos
     cinco toques da secao. (21/09/2026) */
}
/* ============================================================
   O MOSTRADOR DO MÉTODO (05/10/2026)

   Os cinco pilares numa órbita e, no centro, o que eles geram para o
   médico. Desenho em SVG (viewBox 1000 x 1000, contas no index.php) com os
   botões dos pilares em HTML por cima, posicionados em % pelas MESMAS
   contas: os dois caem no mesmo ponto em qualquer largura.

   Estado padrão = estado final: tudo aceso, anel fechado. É o que fica sem
   JS e com movimento reduzido. O assessoria.js troca as classes:
     .is-preparo / .is-entrando   montagem, na primeira vez que aparece
     .is-vivo                     o ponto de luz está correndo
     .is-completo                 os cinco juntos, anel fechado
     .is-foco                     a pessoa escolheu um pilar
     .is-limpando                 fim do ciclo, apagando para recomeçar
   Nos pilares: .is-on (aceso) e .is-atual (onde o ponto está).

   Os traços do SVG são em unidades do desenho, e não em pixel: no celular
   o palco tem ~340px e cada unidade vale um terço de pixel. Por isso as
   espessuras sobem no bloco do celular, lá embaixo. */
.mp-orb{--circ:64px;position:relative;max-width:620px;margin:0 auto 56px;padding:44px 0 0}
.mp-orb-palco{position:relative;aspect-ratio:1/1}
.mp-orb-svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.mp-orb-brilho{opacity:.35;transition:opacity 1.2s var(--ease)}
.mp-orb-tiques{fill:none;stroke:rgba(245,242,236,.2);stroke-width:2;transition:opacity .9s var(--ease)}
.mp-orb-orbita{fill:none;stroke:rgba(245,242,236,.15);stroke-width:1.8;stroke-dasharray:100 100}
.mp-orb-trilha{fill:none;stroke:var(--sl-olive);stroke-width:3.4;stroke-linecap:round;stroke-dasharray:100 100;stroke-dashoffset:0;transition:stroke-dashoffset 1.1s cubic-bezier(.65,0,.35,1),opacity .6s var(--ease)}
.mp-orb-raio{stroke:rgba(245,242,236,.12);stroke-width:1.8;transition:stroke .6s var(--ease),opacity .8s var(--ease)}
.mp-orb-raio.is-on{stroke:rgba(164,151,112,.55)}
.mp-orb-pulso{fill:none;stroke:#efe8d4;stroke-width:4.5;stroke-linecap:round;stroke-dasharray:16 140;stroke-dashoffset:16;opacity:0}
.mp-orb-pulso.is-pulso{animation:mp-orb-pulso .95s cubic-bezier(.45,0,.55,1) both}
@keyframes mp-orb-pulso{0%{stroke-dashoffset:16;opacity:0}15%{opacity:1}100%{stroke-dashoffset:-100;opacity:.3}}
.mp-orb-medalha{fill:#191918;stroke:rgba(245,242,236,.1);stroke-width:1.8;transition:stroke .9s var(--ease),opacity .8s var(--ease)}
.mp-orb-seg-trilho{fill:none;stroke:rgba(245,242,236,.07);stroke-width:8;stroke-dasharray:66 360;transition:opacity .8s var(--ease)}
.mp-orb-seg{fill:none;stroke:var(--sl-olive);stroke-width:8;stroke-dasharray:66 360;stroke-dashoffset:66;transition:stroke-dashoffset .9s cubic-bezier(.22,.61,.36,1) .25s}
.mp-orb-seg.is-on{stroke-dashoffset:0}
.mp-orb-cometa{opacity:0;transform-box:view-box;transform-origin:50% 50%;transform:rotate(var(--ang,0deg));transition:transform 1.1s cubic-bezier(.65,0,.35,1),opacity .5s var(--ease)}
.mp-orb-nucleo{fill:#f3eddc}
.mp-orb.is-vivo .mp-orb-cometa{opacity:1}
.mp-orb.is-completo .mp-orb-brilho{opacity:1}
.mp-orb.is-completo .mp-orb-medalha{stroke:rgba(201,194,171,.55)}
.mp-orb.is-foco .mp-orb-trilha,.mp-orb.is-limpando .mp-orb-trilha{opacity:0}
.mp-orb.sem-transicao .mp-orb-trilha{transition:none}
/* no ciclo, o anel e a frase esperam o pulso chegar ao centro; no clique,
   a resposta vem logo (está mais abaixo, ganha da de cima) */
.mp-orb.is-vivo .mp-orb-seg{transition-delay:.55s}
.mp-orb.is-vivo .mp-orb-res.is-vis{transition-delay:.6s}
.mp-orb.is-foco .mp-orb-seg,.mp-orb.is-foco .mp-orb-res.is-vis{transition-delay:.1s}

/* os pilares: o círculo cai no ponto da órbita e o nome vem embaixo; no
   de cima (meio-dia) o nome vai em cima, para não cruzar a linha */
.mp-orb-est{position:absolute;left:var(--x);top:var(--y);z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;width:136px;margin:0;padding:0;border:0;background:none;color:inherit;text-align:center;cursor:pointer;transform:translate(-50%,calc(var(--circ) / -2));-webkit-tap-highlight-color:transparent}
.mp-orb-est--topo{flex-direction:column-reverse;transform:translate(-50%,calc(var(--circ) / 2 - 100%))}
.mp-orb-est--dir,.mp-orb-est--esq{flex-direction:row;gap:13px;width:auto}
.mp-orb-est--dir{transform:translate(calc(var(--circ) / -2),-50%)}
.mp-orb-est--dir .mp-orb-rot{align-items:flex-start;text-align:left}
.mp-orb-est--esq{flex-direction:row-reverse;transform:translate(calc(var(--circ) / 2 - 100%),-50%)}
.mp-orb-est--esq .mp-orb-rot{align-items:flex-end;text-align:right}
.mp-orb-est:disabled{cursor:default}
.mp-orb-circ{position:relative;display:grid;place-items:center;width:var(--circ);height:var(--circ);border-radius:50%;background:#1b1b1a;border:1px solid rgba(245,242,236,.16);color:var(--sl-amber-light);transition:background-color .55s var(--ease),border-color .55s var(--ease),color .55s var(--ease),box-shadow .55s var(--ease),transform .55s var(--ease),opacity .55s var(--ease)}
.mp-orb-circ svg{width:40%;height:40%}
.mp-orb-circ::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--sl-amber-light);opacity:0;pointer-events:none}
.mp-orb-rot{display:flex;flex-direction:column;align-items:center;gap:3px;line-height:1.15;transition:opacity .55s var(--ease)}
.mp-orb-n{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--sl-amber-light);font-variant-numeric:tabular-nums}
.mp-orb-nome{font-size:15px;font-weight:700;color:rgba(245,242,236,.74);transition:color .55s var(--ease)}
.mp-orb-est.is-on .mp-orb-circ{background:var(--sl-olive);border-color:var(--sl-olive);color:#141414;box-shadow:0 0 0 6px rgba(164,151,112,.13),0 12px 32px -8px rgba(164,151,112,.6)}
.mp-orb-est.is-on .mp-orb-nome{color:#fff}
.mp-orb-est.is-atual .mp-orb-circ{transform:scale(1.08)}
.mp-orb-est.is-atual .mp-orb-circ::after,.mp-orb.is-completo .mp-orb-est.is-on .mp-orb-circ::after{animation:mp-orb-onda 1.7s cubic-bezier(.22,.61,.36,1) both}
@keyframes mp-orb-onda{0%{opacity:.85;transform:scale(1)}100%{opacity:0;transform:scale(1.75)}}
@media (hover:hover){
  .mp-orb-est:not(:disabled):not(.is-on):hover .mp-orb-circ{border-color:rgba(201,194,171,.7);background:#222220}
  .mp-orb-est:not(:disabled):hover .mp-orb-nome{color:#fff}
}
.mp-orb-est:focus-visible{outline:none}
.mp-orb-est:focus-visible .mp-orb-circ{outline:3px solid var(--sl-amber-light);outline-offset:4px}

/* o centro: as seis frases empilhadas na mesma célula da grade, para a
   troca não mexer na altura de nada */
.mp-orb-centro{position:absolute;left:50%;top:50%;z-index:1;display:grid;width:37%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;transition:opacity .8s var(--ease)}
.mp-orb-res{grid-area:1/1;align-self:center;display:flex;flex-direction:column;align-items:center;gap:9px;margin:0;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .45s var(--ease),transform .45s var(--ease),visibility 0s linear .45s}
.mp-orb-res.is-vis{opacity:1;visibility:visible;transform:none;transition:opacity .55s var(--ease) .2s,transform .55s var(--ease) .2s,visibility 0s}
.mp-orb-res-de{font-size:12.5px;font-weight:700;letter-spacing:.08em;color:var(--sl-amber-light)}
.mp-orb-res-gera{font-size:clamp(15px,2.9vw,23px);line-height:1.2;font-weight:800;letter-spacing:-.02em;color:#fff;text-wrap:balance}

.mp-orb-ctrl{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px;margin-top:22px}
.mp-orb-btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px 0 15px;border-radius:var(--r-pill);border:1px solid rgba(245,242,236,.22);background:rgba(245,242,236,.04);color:#f5f2ec;font-size:14px;font-weight:600;cursor:pointer;transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.mp-orb-btn:hover{background:rgba(245,242,236,.09);border-color:rgba(201,194,171,.5)}
.mp-orb-btn-ico{position:relative;flex-shrink:0;width:10px;height:12px}
.mp-orb-btn-ico::before,.mp-orb-btn-ico::after{content:"";position:absolute;top:0;bottom:0;width:3px;border-radius:1px;background:var(--sl-amber-light)}
.mp-orb-btn-ico::before{left:0}
.mp-orb-btn-ico::after{right:0}
.mp-orb-btn[data-acao="seguir"] .mp-orb-btn-ico::before{width:10px;border-radius:0;clip-path:polygon(0 0,100% 50%,0 100%)}
.mp-orb-btn[data-acao="seguir"] .mp-orb-btn-ico::after{display:none}
.mp-orb-ctrl .mp-orb-dica{margin:0;font-size:14px;color:rgba(245,242,236,.62)}
.mp-orb-btn[hidden],.mp-orb-ctrl .mp-orb-dica[hidden]{display:none}

/* montagem: só na primeira vez que o mostrador aparece na tela */
.mp-orb.is-preparo .mp-orb-orbita{stroke-dashoffset:100}
.mp-orb.is-preparo .mp-orb-tiques,.mp-orb.is-preparo .mp-orb-raio,.mp-orb.is-preparo .mp-orb-seg-trilho,.mp-orb.is-preparo .mp-orb-medalha,.mp-orb.is-preparo .mp-orb-centro,.mp-orb.is-preparo .mp-orb-rot{opacity:0}
.mp-orb.is-preparo .mp-orb-circ{opacity:0;transform:scale(.6)}
.mp-orb.is-entrando .mp-orb-orbita{transition:stroke-dashoffset 1.3s cubic-bezier(.65,0,.35,1)}
.mp-orb.is-entrando .mp-orb-tiques{transition-delay:.35s}
.mp-orb.is-entrando .mp-orb-circ,.mp-orb.is-entrando .mp-orb-rot{transition-delay:calc(var(--k) * 90ms + 250ms)}
.mp-orb.is-entrando .mp-orb-raio,.mp-orb.is-entrando .mp-orb-seg-trilho{transition-delay:.6s}
.mp-orb.is-entrando .mp-orb-centro{transition-delay:.5s}

/* abaixo de 760px não cabe nome para fora nas laterais: ele volta para baixo
   do círculo, e um halo da cor da seção em volta das letras apaga a órbita só
   onde ela passaria por trás delas (um fundo retangular virava etiqueta) */
@media (max-width:760px){
  .mp-orb-est--dir,.mp-orb-est--esq{flex-direction:column;gap:10px;width:136px;transform:translate(-50%,calc(var(--circ) / -2))}
  .mp-orb-est--dir .mp-orb-rot,.mp-orb-est--esq .mp-orb-rot{align-items:center;text-align:center;text-shadow:0 0 3px var(--sl-forest),0 0 6px var(--sl-forest),0 0 10px var(--sl-forest),0 0 14px var(--sl-forest)}
}
@media (max-width:600px){
  .mp-orb{--circ:46px;margin-bottom:40px;padding-top:34px}
  .mp-orb-est{gap:7px;width:96px}
  .mp-orb-n{font-size:10px}
  .mp-orb-nome{font-size:12.5px}
  .mp-orb-res{gap:6px}
  .mp-orb-res-de{font-size:11px}
  .mp-orb-res-gera{font-size:14.5px}
  .mp-orb-tiques{stroke-width:3}
  .mp-orb-orbita,.mp-orb-raio,.mp-orb-medalha{stroke-width:3}
  .mp-orb-trilha{stroke-width:5.5}
  .mp-orb-seg,.mp-orb-seg-trilho{stroke-width:11}
  .mp-orb-pulso{stroke-width:7}
  .mp-orb-ctrl{flex-direction:column;gap:10px;margin-top:18px}
  .mp-orb-ctrl .mp-orb-dica{font-size:13.5px;text-align:center}
}
@media (prefers-reduced-motion:reduce){
  .mp-orb *,.mp-orb *::before,.mp-orb *::after{transition:none!important;animation:none!important}
}
/* ============================================================
   OS FILETES DE COSTURA ENTRE SECOES CLARAS     (21/09/2026)

   A home alterna claro e escuro quase toda, mas em alguns pontos caem duas
   secoes claras seguidas cujos cremes sao praticamente o mesmo:
     tribo  #faf9f5 -> para-quem     #f5f2ec   1,06:1
     para-quem #f5f2ec -> investimento #fff    1,12:1
   Nenhuma dessas fronteiras se enxerga. O leitor rolava mais de mil pixels
   sem saber que trocou de assunto.

   A receita e a que a casa ja usa: o filete dourado de 1px que o
   .mp-form-sec::before (tribo-componentes.css) e o .on-dark::after
   (tribo-base.css) desenham. Mudar o FUNDO seria a outra saida, mas
   mexeria na paleta; o filete custa uma linha e nao muda cor nenhuma.

   Em 05/10/2026 a secao "O que esta incluso" (#inclui) saiu da home: repetia
   as entregas dos 5 pilares do metodo. O "Como funciona" passou a vir logo
   depois do metodo, que e escuro, e o filete dele saiu junto: a troca de
   cor ja faz a fronteira.
   ============================================================ */
.mp-como{background:var(--sl-sage);position:relative}
.mp-timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;position:relative}
.mp-timeline::before{content:"";position:absolute;left:4%;right:4%;top:44px;height:1px;background:linear-gradient(90deg,transparent,var(--sl-gray-300) 10%,var(--sl-gray-300) 90%,transparent);z-index:0}
.mp-timeline li{position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);padding:26px 22px 24px;z-index:1;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.mp-timeline li:hover{transform:translateY(-4px);box-shadow:var(--sl-shadow-md);border-color:var(--sl-amber-light)}
.mp-timeline .n{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--sl-forest);color:var(--sl-amber-light);font-weight:800;font-size:15px;margin-bottom:18px;box-shadow:0 0 0 6px var(--sl-sage)}
.mp-timeline h3{font-size:17px;margin-bottom:8px}
.mp-timeline p{font-size:14px;line-height:1.6;color:var(--sl-gray-600)}
.mp-apoio{display:flex;gap:20px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-left:3px solid var(--sl-olive);border-radius:var(--r-xl);padding:28px 30px;margin:32px auto 0;max-width:900px}
.mp-apoio .ico{margin-bottom:0}
.mp-apoio h3{font-size:18px;margin-bottom:8px}
.mp-apoio p{font-size:15px;line-height:1.65;color:var(--sl-gray-600)}
@media (max-width:1100px){
  .mp-timeline{grid-template-columns:repeat(3,1fr)}
  .mp-timeline::before{display:none}
}
@media (max-width:640px){
  .mp-timeline{grid-template-columns:1fr;gap:14px;padding-left:22px}
  .mp-timeline::before{display:block;left:0;right:auto;top:10px;bottom:10px;width:1px;height:auto;background:linear-gradient(180deg,var(--sl-olive),var(--sl-gray-300))}
  .mp-timeline li::before{content:"";position:absolute;left:-26px;top:32px;width:9px;height:9px;border-radius:50%;background:var(--sl-olive);box-shadow:0 0 0 4px var(--sl-sage)}
  .mp-apoio{flex-direction:column;padding:22px}
}
.mp-cases{color:#fff}
.mp-cases .container{position:relative}
.mp-cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.mp-case{position:relative;background:rgba(245,242,236,.04);border:1px solid rgba(245,242,236,.1);border-radius:var(--r-xl);padding:26px;display:flex;flex-direction:column;gap:16px;transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),background var(--dur) var(--ease)}
.mp-case:hover{border-color:rgba(164,151,112,.55);transform:translateY(-3px);background:rgba(245,242,236,.06)}
.mp-case header{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:center}
.mp-case header img,.mp-case-ini{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:top;border:1px solid rgba(164,151,112,.5)}
.mp-case-ini{display:flex;align-items:center;justify-content:center;background:rgba(164,151,112,.18);color:var(--sl-amber-light);font-weight:800;font-size:18px}
.mp-case h3{font-size:16px;color:#fff;line-height:1.25}
.mp-case header > div > span{font-size:12.5px;color:rgba(245,242,236,.6)}
.mp-canal{grid-column:1 / -1;justify-self:start;font-style:normal;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--sl-amber-light);border:1px solid rgba(164,151,112,.45);border-radius:var(--r-pill);padding:4px 10px;display:inline-flex;align-items:center;gap:7px}
.mp-canal::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sl-amber-light)}
.mp-canal.c-google-ads::before,.mp-canal.c-site-google-ads::before{background:#e6c56b}
.mp-canal.c-instagram-meta-ads::before,.mp-canal.c-meta-ads::before{background:#d59aa6}
.mp-canal.c-google-meu-negocio::before{background:#7fc8a9}
.mp-case-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mp-case-metrics div{background:rgba(245,242,236,.05);border-radius:var(--r-lg);padding:12px 14px;border:1px solid rgba(245,242,236,.05)}
.mp-case-metrics b{display:block;font-size:24px;font-weight:800;letter-spacing:-0.025em;color:var(--sl-amber-light);line-height:1.1;font-variant-numeric:tabular-nums}
.mp-case-metrics span{font-size:12px;color:rgba(245,242,236,.65);line-height:1.35;display:block;margin-top:3px}
.mp-case-ctx{font-size:14px;color:rgba(245,242,236,.75);line-height:1.55}
.mp-case blockquote{margin:0;padding:12px 14px;border-left:2px solid var(--sl-olive);font-size:13.5px;line-height:1.5;color:rgba(245,242,236,.85);font-style:italic}
.mp-case-art{margin-top:auto;align-self:flex-start;min-height:44px;background:none;border:1px solid rgba(245,242,236,.2);color:rgba(245,242,236,.8);border-radius:var(--r-pill);padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all var(--dur-fast) var(--ease)}
.mp-case-art svg{width:16px;height:16px}
.mp-case-art:hover{border-color:var(--sl-olive);color:#fff;background:rgba(164,151,112,.12)}
@media (max-width:1024px){
  .mp-cases-grid{grid-template-columns:repeat(2,1fr)}
}
.mp-swipe-hint{display:none}
@media (max-width:640px){
  .mp-swipe-hint{display:block;text-align:center;font-size:12.5px;color:rgba(245,242,236,.55);margin:-24px 0 14px}
  .mp-cases-grid{display:flex;overflow-x:auto;gap:14px;padding:4px 4px 14px;margin:0 -20px;padding-left:20px;padding-right:20px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .mp-cases-grid::-webkit-scrollbar{display:none}
  .mp-case{flex:0 0 86%;scroll-snap-align:start}
  .mp-cases-grid.tb-stagger > *{opacity:1;transform:none}
}
.mp-medicos{background:#fff}
.mp-tribo{background:var(--sl-off-white);position:relative}
.mp-tribo::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--sl-gray-200),transparent)}
.mp-tribo-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:start}
.mp-tribo .section-header{margin-bottom:28px}
@media (max-width:960px){
  .mp-tribo-grid{grid-template-columns:1fr;gap:32px}
}
.mp-quem{background:var(--sl-sage);position:relative}
.mp-quem::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(164,151,112,.6),transparent)}
.mp-quem-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:24px;align-items:start}
.mp-quem-col{border-radius:var(--r-xl);padding:34px 32px;position:relative;overflow:hidden}
.mp-quem-col h3{font-size:19px;margin:0 0 20px;letter-spacing:-.01em;position:relative}
.mp-quem-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px;position:relative}
.mp-quem-col li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.55}
.mp-quem-col li span,.mp-trust li span{flex:1;min-width:0}
.mp-quem-col svg{width:21px;height:21px;flex-shrink:0;margin-top:1px}
.mp-quem-col a{text-decoration:underline;text-underline-offset:2px}
.mp-quem-col.sim{background:var(--sl-forest);border:1px solid rgba(164,151,112,.3);color:#fff}
.mp-quem-col.sim::after{content:"";position:absolute;inset:auto -60px -60px auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(164,151,112,.3),transparent 70%);pointer-events:none}
.mp-quem-col.sim h3{color:#fff}
.mp-quem-col.sim li{color:rgba(245,242,236,.84)}
.mp-quem-col.sim svg{color:var(--sl-amber-light)}
.mp-quem-col.nao{background:#fff;border:1px solid var(--border)}
.mp-quem-col.nao h3{color:var(--sl-gray-600)}
.mp-quem-col.nao li{color:var(--sl-gray-500)}
.mp-quem-col.nao svg{color:var(--sl-gray-500);opacity:.65}
.mp-quem-col.nao a{color:var(--sl-olive-text)}
@media (max-width:820px){
  .mp-quem-grid{grid-template-columns:1fr}
}
.mp-invest{background:#fff;position:relative}
.mp-invest::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(164,151,112,.6),transparent)}
.mp-invest .tb-card{background:var(--sl-off-white)}

.mp-wa{position:fixed;right:20px;bottom:20px;z-index:45;display:flex;align-items:center;gap:10px;background:#1a8754;color:#fff;border-radius:var(--r-pill);padding:12px 18px 12px 14px;font-weight:700;font-size:14px;box-shadow:0 12px 30px -10px rgba(0,0,0,.45);opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease),background var(--dur-fast) var(--ease)}
.mp-wa::before{content:"";position:absolute;inset:-4px;border-radius:inherit;border:1px solid rgba(26,135,84,.55);animation:mp-pulse 2.6s ease-out infinite}
.mp-wa svg{width:22px;height:22px}
.mp-wa.is-on{opacity:1;transform:none;pointer-events:auto}
.mp-wa:hover{background:#166f45;color:#fff}
@keyframes mp-pulse{
  0%{transform:scale(1);opacity:.7}
  70%,100%{transform:scale(1.25);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .mp-wa::before{animation:none;display:none}
}
@media (max-width:640px){
  .mp-wa span{display:none}
  .mp-wa{padding:14px;right:16px;bottom:16px}
}
.mp-lightbox{border:none;border-radius:var(--r-xl);padding:0;background:#fff;max-width:min(92vw,520px);box-shadow:0 30px 80px -20px rgba(0,0,0,.7)}
.mp-lightbox[open]{animation:mp-fade .3s var(--ease)}
.mp-lightbox::backdrop{background:rgba(14,14,14,.82);backdrop-filter:blur(4px)}
.mp-lightbox img{display:block;width:100%;height:auto}
.mp-lightbox-close{position:absolute;top:8px;right:8px;width:36px;height:36px;border-radius:50%;border:none;background:rgba(20,20,20,.75);color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:background var(--dur-fast) var(--ease)}
.mp-lightbox-close:hover{background:var(--sl-olive)}
.mp-scroll-cue{position:absolute;left:calc(50% - 13px);bottom:18px;width:26px;height:42px;border:1.5px solid rgba(245,242,236,.28);border-radius:var(--r-xl);display:flex;justify-content:center;padding-top:7px;opacity:0;animation:mp-rise .8s 1.3s var(--ease) both;transition:border-color var(--dur-fast) var(--ease)}
.mp-scroll-cue span{width:3px;height:7px;border-radius:2px;background:var(--sl-amber-light);animation:mp-cue 1.8s ease-in-out infinite}
.mp-scroll-cue:hover{border-color:var(--sl-amber-light)}
/* ============================================================
   A SETA DO HEROI, DUAS CORRECOES                    (22/09/2026)

   1. ELA NAO ESTAVA CENTRADA. A regra-base centra com
      left:50% + transform:translateX(-50%), mas a animacao mp-rise
      termina em transform:none e, com fill-mode both, esse "none" fica
      valendo depois que ela acaba — apagando a centralizacao. A seta
      repousava 13px a direita do centro. Agora o left ja desconta a
      metade da largura (26px), e nao ha transform para a animacao
      atropelar. O keyframe NAO foi tocado: ele e compartilhado com o
      .mp-hero-text e outros.

   2. O MOVIMENTO REDUZIDO NAO A ALCANCAVA, e a tentativa de 21/09 nao
      podia funcionar. O bloco la de cima desligava so o pontinho, e o
      opacity:1 que estava ao lado era letra morta por DOIS motivos
      independentes: animacao em curso vence declaracao do autor, e
      mesmo sem animacao ele perdia para o opacity:0 desta regra-base,
      que vem depois no arquivo com a mesma especificidade — media query
      nao soma especificidade. Por isso o desligamento mudou-se para
      DEPOIS da regra-base, onde a ordem de fonte trabalha a favor.
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  .mp-scroll-cue{animation:none;opacity:1}
}
@keyframes mp-cue{
  0%{transform:translateY(0);opacity:1}
  70%{transform:translateY(14px);opacity:0}
  100%{transform:translateY(0);opacity:0}
}
@media (max-width:960px){
  .mp-scroll-cue{display:none}
}
.mp-marquee{background:#0e0e0e;border-top:1px solid rgba(245,242,236,.06);border-bottom:1px solid rgba(245,242,236,.06);overflow:hidden;padding:14px 0;position:relative}
.mp-marquee::before,.mp-marquee::after{content:"";position:absolute;top:0;bottom:0;width:120px;z-index:2;pointer-events:none}
.mp-marquee::before{left:0;background:linear-gradient(90deg,#0e0e0e,transparent)}
.mp-marquee::after{right:0;background:linear-gradient(270deg,#0e0e0e,transparent)}
.mp-marquee-track{display:flex;width:max-content;animation:mp-marquee 48s linear infinite}
.mp-marquee:hover .mp-marquee-track{animation-play-state:paused}
.mp-marquee ul{list-style:none;margin:0;padding:0;display:flex;gap:0;flex-shrink:0}
.mp-marquee li{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:rgba(245,242,236,.55);padding:0 22px;display:flex;align-items:center;gap:22px;white-space:nowrap}
.mp-marquee li::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--sl-olive);opacity:.8}
@keyframes mp-marquee{
  to{transform:translateX(-50%)}
}
@media (prefers-reduced-motion:reduce){
  .mp-marquee-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
  .mp-marquee ul[aria-hidden="true"]{display:none}
  .mp-marquee ul{flex-wrap:wrap;justify-content:center;row-gap:8px}
}
.mp-grid-2,.mp-grid-3{counter-reset:card}
.mp-grid-2 > .tb-card,.mp-grid-3 > .tb-card{counter-increment:card}
.mp-grid-2 > .tb-card::after,.mp-grid-3 > .tb-card::after{content:counter(card,decimal-leading-zero);position:absolute;top:26px;right:26px;font-size:11px;letter-spacing:.14em;font-weight:800;color:var(--sl-gray-300);transition:color var(--dur) var(--ease)}
.tb-card:hover::after{color:var(--sl-olive)}
.mp-filtros{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:-24px 0 32px}
.mp-filtros button{background:rgba(245,242,236,.05);border:1px solid rgba(245,242,236,.14);color:rgba(245,242,236,.8);border-radius:var(--r-pill);padding:11px 16px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:40px;transition:all var(--dur-fast) var(--ease)}
.mp-filtros button span{font-size:11px;font-weight:800;color:var(--sl-amber-light);background:rgba(164,151,112,.14);border-radius:var(--r-pill);padding:2px 7px}
.mp-filtros button:hover{border-color:rgba(164,151,112,.55);color:#fff}
.mp-filtros button.is-active{background:var(--sl-olive);border-color:var(--sl-olive);color:#141414}
.mp-filtros button.is-active span{color:#141414;background:rgba(20,20,20,.12)}
.mp-case[hidden]{display:none}
.mp-cases-grid.is-filtering > *{animation:mp-fade .4s var(--ease) both}
@media (max-width:640px){
  .mp-filtros{margin:-16px -20px 20px;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding:2px 20px 6px;scrollbar-width:none}
  .mp-filtros::-webkit-scrollbar{display:none}
  .mp-filtros button{flex-shrink:0}
}
.mp-lightbox{max-width:min(92vw,560px);width:min(92vw,560px);background:#141414;color:#fff}
.mp-lightbox img{max-height:70vh;object-fit:contain;background:#fff}
.mp-lightbox-cap{display:grid;grid-template-columns:1fr auto;gap:2px 14px;padding:14px 18px 16px;font-size:13px;color:rgba(245,242,236,.7)}
.mp-lightbox-cap b{color:#fff;font-size:15px;grid-column:1}
.mp-lightbox-cap span{grid-column:1}
.mp-lightbox-cap em{grid-column:2;grid-row:1 / span 2;align-self:center;font-style:normal;font-size:12px;letter-spacing:.12em;color:var(--sl-amber-light);font-weight:700}
.mp-lightbox-nav{position:absolute;top:calc(50% - 40px);width:42px;height:42px;border-radius:50%;border:1px solid rgba(245,242,236,.25);background:rgba(20,20,20,.75);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.mp-lightbox-nav svg{width:18px;height:18px}
.mp-lightbox-nav.prev{left:10px;transform:rotate(180deg)}
.mp-lightbox-nav.next{right:10px}
.mp-lightbox-nav:hover{background:var(--sl-olive);border-color:var(--sl-olive)}
.mp-medicos{overflow:hidden}
.mp-medicos .section-header{margin-bottom:28px}
.mp-cli{position:relative;display:flex;flex-direction:column;padding:10px 0;mask-image:linear-gradient(90deg,transparent 0,#000 80px,#000 calc(100% - 80px),transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 80px,#000 calc(100% - 80px),transparent 100%)}
.mp-cli-row{display:flex;overflow-x:clip;overflow-y:visible;padding:10px 0}
.mp-cli-track{display:flex;gap:18px;width:max-content;will-change:transform;animation:mp-cli-scroll 70s linear infinite}
.mp-cli-row--rtl .mp-cli-track{animation-direction:reverse;animation-duration:80s}
.mp-cli-row:nth-of-type(3) .mp-cli-track{animation-duration:62s}
@keyframes mp-cli-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
/* No iOS o :hover gruda no elemento tocado ate o proximo toque em algo
   hoveravel. Esta faixa e aria-hidden e nao tem link nenhum, entao o estado
   nao tinha para onde migrar: o cartao ficava ampliado e a esteira parada.
   (21/09/2026) */
.mp-cli-card{flex:0 0 78px;width:78px;height:78px;border-radius:50%;overflow:hidden;background:var(--sl-sage);border:1.5px solid var(--sl-gray-200);transition:transform .35s cubic-bezier(.22,.61,.36,1),border-color .3s ease,box-shadow .35s ease;cursor:default;position:relative}
.mp-cli-card img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;filter:grayscale(85%);transition:filter .35s ease}
@media (hover:hover){
  .mp-cli:hover .mp-cli-track{animation-play-state:paused}
  .mp-cli-card:hover{transform:scale(1.18);border-color:var(--sl-olive);box-shadow:0 14px 36px rgba(164,151,112,.3),0 0 0 4px rgba(164,151,112,.12);z-index:2}
  .mp-cli-card:hover img{filter:none}
}
@media (max-width:760px){
  .mp-cli-card{flex:0 0 74px;width:74px;height:74px}
  .mp-cli-track{gap:14px}
  .mp-cli-row{padding:8px 0}
}
@media (max-width:480px){
  .mp-cli-card{flex:0 0 68px;width:68px;height:68px}
  .mp-cli-track{gap:12px}
  .mp-cli-row{padding:7px 0}
}
.mp-micro-exclusivo{max-width:680px;margin-top:32px;line-height:1.7}
.mp-micro-exclusivo b{color:var(--sl-forest);font-weight:700}
@media (hover:none){
  .mp-cli-card img{filter:grayscale(40%)}
}
@media (prefers-reduced-motion:reduce){
  .mp-cli-track{animation:none}
}
@media (max-width:640px){
  .mp-tribo .mp-grid-2{grid-template-columns:1fr 1fr;gap:12px}
  .mp-tribo .tb-card{padding:18px 16px 18px}
  .mp-tribo .tb-card .ico{width:38px;height:38px;border-radius:var(--r-lg);margin-bottom:14px}
  .mp-tribo .tb-card .ico svg{width:19px;height:19px}
  .mp-tribo .tb-card h3{font-size:15px;line-height:1.25;margin-bottom:8px}
  .mp-tribo .tb-card p{font-size:13px;line-height:1.5}
  .mp-tribo .tb-card::after{top:16px;right:14px;font-size:10px}
}
