/* Camada de movimento Elite (GSAP + Lenis). Só vale com .motion no <html>; sem JS ou com movimento reduzido, o site fica estático e legível. */
:root{
  --gold-1:#e6c77a;
  --gold-2:#c9a34e;
  --gold-3:#7d5f1f;
  --depth:1200px;
  --cursor:34px;
}

/* ---------- Barra de progresso ---------- */
.mx-progress{position:fixed;inset:0 0 auto 0;height:2px;z-index:200;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--gold-3),var(--gold-1),var(--gold-2));pointer-events:none}

/* ---------- Cursor dourado ---------- */
.mx-cursor,.mx-dot{position:fixed;top:0;left:0;z-index:300;pointer-events:none;border-radius:50%;opacity:0;transition:opacity .3s}
.mx-cursor{width:var(--cursor);height:var(--cursor);margin:calc(var(--cursor) / -2) 0 0 calc(var(--cursor) / -2);border:1px solid var(--gold-2);mix-blend-mode:difference;transition:opacity .3s,width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s}
.mx-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--gold-1)}
.motion.has-cursor .mx-cursor,.motion.has-cursor .mx-dot{opacity:1}
.mx-cursor.is-hover{--cursor:72px;background:rgba(201,163,78,.15)}
@media (hover:none){.mx-cursor,.mx-dot{display:none}}

/* ---------- Header que some ao descer e volta ao subir ---------- */
.motion .site-header{transition:transform .5s var(--ease),background .4s}
.motion .site-header.is-hidden{transform:none}

/* ---------- HERO com profundidade ---------- */
.motion .hero{overflow:hidden;perspective:var(--depth)}
.mx-hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.mx-blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;will-change:transform}
.mx-blob--1{width:52vw;height:52vw;left:-12vw;top:-18vw;background:radial-gradient(circle,rgba(201,163,78,.55),transparent 65%)}
.mx-blob--2{width:40vw;height:40vw;right:-10vw;top:10vh;background:radial-gradient(circle,rgba(125,95,31,.7),transparent 65%)}
.mx-blob--3{width:34vw;height:34vw;left:30vw;top:45vh;background:radial-gradient(circle,rgba(230,199,122,.35),transparent 65%)}
.mx-grid{position:absolute;left:-50%;right:-50%;bottom:-10%;height:70%;transform:rotateX(72deg);transform-origin:50% 100%;
  background-image:linear-gradient(rgba(201,163,78,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(201,163,78,.18) 1px,transparent 1px);
  background-size:80px 80px;-webkit-mask-image:linear-gradient(to top,#000 10%,transparent 85%);mask-image:linear-gradient(to top,#000 10%,transparent 85%);animation:mx-grid 6s linear infinite}
@keyframes mx-grid{to{background-position:0 80px,0 0}}
.mx-canvas{position:absolute;inset:0;width:100%;height:100%}
.mx-grain{position:absolute;inset:-50%;opacity:.07;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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:mx-grain 1.2s steps(6) infinite}
@keyframes mx-grain{0%{transform:translate(0,0)}20%{transform:translate(-5%,3%)}40%{transform:translate(4%,-6%)}60%{transform:translate(-3%,5%)}80%{transform:translate(6%,2%)}100%{transform:translate(0,0)}}
.motion .hero > .container{position:relative;z-index:1}
.motion .hero__title{transform-style:preserve-3d}
.mx-char{display:inline-block;transform-origin:50% 100% -20px;will-change:transform,opacity}
.mx-wordwrap{display:inline-block;white-space:nowrap}
.motion .hero__title em .mx-char{background:linear-gradient(100deg,var(--gold-3),var(--gold-1) 40%,var(--gold-2) 60%,var(--gold-1));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:mx-shine 4s linear infinite}
@keyframes mx-shine{to{background-position:-200% 0}}
.motion .hero__media{perspective:var(--depth)}
.motion .hero__frame{transform-style:preserve-3d;transform-origin:50% 0;box-shadow:0 60px 120px -30px rgba(0,0,0,.8),0 0 0 1px rgba(201,163,78,.35)}

/* ---------- Faixa de palavras em movimento ---------- */
.mx-marquee{position:relative;z-index:1;overflow:hidden;padding-block:clamp(1.5rem,1rem + 2vw,3rem);border-block:1px solid var(--line-soft);background:var(--bg)}
.mx-marquee__track{display:flex;width:max-content;gap:3rem;will-change:transform}
.mx-marquee__item{font:400 clamp(2.5rem,1.5rem + 5vw,6rem)/1 var(--font-display);white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(201,163,78,.55);display:flex;align-items:center;gap:3rem}
.mx-marquee__item:nth-child(even){color:var(--gold-2);-webkit-text-stroke:0}
.mx-marquee__item::after{content:"";width:.35em;height:.35em;transform:rotate(45deg);background:var(--gold-2);display:inline-block}

/* ---------- Cards 3D com reflexo ---------- */
.motion .areas,.motion .pillars,.motion .partners,.motion .steps{perspective:var(--depth)}
.motion [data-tilt]{transform-style:preserve-3d;will-change:transform}
.motion [data-tilt] > *{transform:translateZ(0)}
.motion [data-tilt] .area__num,.motion [data-tilt] .step__num{transform:translateZ(40px)}
.motion [data-tilt] .area__title,.motion [data-tilt] h3,.motion [data-tilt] h4{transform:translateZ(28px)}
.mx-glare{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,236,190,.22),transparent 55%);mix-blend-mode:soft-light}
.motion [data-tilt]:hover .mx-glare{opacity:1}
.motion .area{transition:border-color .3s,box-shadow .4s var(--ease)}
.motion .area:hover{box-shadow:0 40px 80px -30px rgba(0,0,0,.75),0 0 0 1px var(--gold-2)}
.motion .area--light:hover{box-shadow:0 40px 80px -30px rgba(60,40,15,.35),0 0 0 1px var(--light-accent)}
.motion .area__num{font-size:clamp(2rem,1.5rem + 2vw,3.25rem);transition:color .3s}
.motion .pillar{position:relative;padding:var(--space-3);border:1px solid var(--line-soft);background:linear-gradient(160deg,rgba(201,163,78,.08),transparent 60%)}

/* ---------- Bolhas de situação (Previdenciário) ---------- */
.motion .situation{position:relative;border-radius:18px 18px 18px 4px;box-shadow:0 18px 40px -20px rgba(60,40,15,.35)}
.motion .situation:nth-child(even){border-radius:18px 18px 4px 18px}
.mx-typing{display:inline-flex;gap:4px;padding:.65rem .9rem;border-radius:14px;background:rgba(125,95,31,.12);margin-bottom:.5rem}
.mx-typing i{width:6px;height:6px;border-radius:50%;background:var(--light-accent);animation:mx-dot 1s infinite ease-in-out}
.mx-typing i:nth-child(2){animation-delay:.15s}.mx-typing i:nth-child(3){animation-delay:.3s}
@keyframes mx-dot{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-5px);opacity:1}}

/* ---------- Etapas em rolagem horizontal fixada (computador) ---------- */
.mx-hscroll{position:relative}
@media (min-width:1024px){
  .motion #atendimento{overflow:hidden}
  .motion #atendimento .steps{display:flex;gap:var(--space-4);width:max-content;padding-right:30vw}
  .motion #atendimento .step{width:min(34vw,460px);min-height:340px;padding:var(--space-4);border:1px solid var(--line);background:linear-gradient(160deg,var(--surface),var(--bg));position:relative}
  .motion #atendimento .step__num{font:400 clamp(4rem,3rem + 4vw,8rem)/1 var(--font-display);color:transparent;-webkit-text-stroke:1px var(--gold-2);display:block;margin-bottom:var(--space-3)}
}
.mx-line{height:1px;background:var(--line-soft);margin-top:var(--space-4);position:relative;overflow:hidden}
.mx-line span{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--gold-3),var(--gold-1))}

/* ---------- Sócios: foto revelada e em paralaxe ---------- */
.motion .partner__photo{position:relative}
.motion .partner__photo img{transform:scale(1.18);will-change:transform}
.motion .partner__photo::after{content:"";position:absolute;inset:0;background:var(--gold-2);transform-origin:100% 50%;transform:scaleX(var(--wipe,1));pointer-events:none}

/* ---------- Avaliações em faixas contínuas ---------- */
.motion .quotes.mx-rows{display:block;max-width:none;margin-inline:calc(var(--gutter) * -1);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mx-row{display:flex;gap:var(--space-3);width:max-content;padding-block:var(--space-2);will-change:transform}
.mx-row:hover{animation-play-state:paused}
.motion .mx-row .quote{width:min(82vw,420px);flex:none;text-align:left;padding:var(--space-4) var(--space-3);border:1px solid var(--line);background:linear-gradient(160deg,var(--surface),var(--bg));position:relative;display:flex;flex-direction:column;justify-content:space-between}
.motion .mx-row .quote[hidden]{display:flex}
.motion .mx-row .quote blockquote p{font-size:var(--step-1);text-align:left;margin:0 0 var(--space-3)}
.motion .mx-row .quote::before{content:"\201C";position:absolute;top:-.15em;right:.2em;font:400 7rem/1 var(--font-display);color:rgba(201,163,78,.25)}
.mx-stars{display:flex;gap:2px;color:var(--gold-2);margin-bottom:var(--space-2)}
.mx-stars svg{width:16px;height:16px;fill:currentColor;stroke:none}
.motion .quotes__nav{display:none!important}
.motion .rating__score{display:inline-block;min-width:2.2ch}

/* ---------- Botões magnéticos e brilho ---------- */
.motion .btn{position:relative;overflow:hidden;will-change:transform}
.motion .btn-primary::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);animation:mx-sweep 3.5s ease-in-out infinite}
@keyframes mx-sweep{0%,60%{left:-60%}100%{left:130%}}

/* ---------- Títulos com linha dourada ---------- */
.motion .eyebrow{position:relative;padding-left:2.75rem}
.motion .eyebrow::before{content:"";position:absolute;left:0;top:50%;width:2rem;height:1px;background:currentColor;transform-origin:0 50%;transform:scaleX(var(--ln,0));transition:transform 1s var(--ease)}
.motion .eyebrow.is-in::before{--ln:1}

/* Desliga a cascata CSS antiga onde o GSAP assume */
.motion .hero__sub.reveal,.motion .creds.reveal,.motion .hero .actions.reveal,.motion .area.reveal,.motion .step.reveal,.motion .partner.reveal,.motion .pillar.reveal,.motion .situation.reveal,.motion .quote.reveal{transition:none;opacity:1;transform:none}

@media not all and (min-width:768px){
  .mx-hero-bg,.mx-cursor,.mx-dot,.mx-progress{display:none}
  .mx-marquee__track{animation:none}
}

/* ---------- Cortina de entrada e transição entre páginas ---------- */
.mx-curtain,.mx-page{display:none}
.motion .mx-curtain{display:grid;place-items:center;position:fixed;inset:0;z-index:400;background:linear-gradient(160deg,#0e0d0c,#1d1a16);pointer-events:none}
.mx-curtain__logo{width:min(220px,50vw);opacity:0;transform:translateY(20px)}
.mx-page{position:fixed;inset:0;z-index:400;background:linear-gradient(160deg,var(--gold-3),var(--gold-2) 50%,var(--gold-1));pointer-events:none}
.motion .band--light,.motion .band--beige{will-change:clip-path}
.mx-w{transition:none}

/* Abertura */
.mx-intro{display:none}
.motion .mx-intro{display:block;position:fixed;inset:0;z-index:500;background:radial-gradient(circle at 50% 45%,#1a1713,#0b0a09 70%)}
.mx-intro canvas{position:absolute;inset:0;width:100%;height:100%}
.mx-intro__text{position:absolute;left:0;right:0;bottom:12vh;text-align:center;padding-inline:var(--gutter)}
.mx-intro__cap{font:400 clamp(1.75rem,1.2rem + 2.4vw,3rem)/1.1 var(--font-display);color:var(--text);margin:0 0 .5rem}
.mx-intro__cap,.mx-intro__sub{max-width:none;margin-inline:auto}
.mx-intro__sub{font-size:var(--step--1);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);margin:0}
.mx-intro__skip{position:absolute;right:var(--gutter);top:var(--gutter);min-height:44px;padding:.6rem 1rem;background:transparent;border:1px solid rgba(201,163,78,.5);color:var(--text);font:500 .875rem var(--font-body);border-radius:999px;cursor:pointer}
.mx-intro__skip:hover{background:rgba(201,163,78,.15)}

/* Portal animado */
.motion .portal{background:var(--bg)}
.motion .portal__pin{height:100vh;min-height:0;padding:0}
.motion .portal__amp{display:block;position:absolute;left:50%;top:50%;font:400 clamp(10rem,6rem + 14vw,20rem)/1 var(--font-display);color:var(--gold-2);transform:translate(-50%,-55%);will-change:transform;z-index:1}
.motion .portal__eyebrow{position:absolute;top:14vh;left:0;right:0;color:var(--gold-2);z-index:2}
.motion .portal__hint{display:block;position:absolute;bottom:10vh;left:0;right:0;font-size:var(--step--1);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0;z-index:2}
.motion .portal__name{position:relative;z-index:3;opacity:0}
.mx-portal-bg{position:absolute;inset:0;background:var(--beige);opacity:0;z-index:2}
/* Família em rolagem horizontal fixada (computador) */
@media (min-width:1024px){
  .motion #areas{overflow:hidden}
  .motion #areas .areas{display:flex;gap:var(--space-3);width:max-content;padding-right:20vw}
  .motion #areas .area{width:min(30vw,400px);min-height:440px;flex:none}
}
.motion [data-draw] *{stroke-dasharray:var(--len,120);stroke-dashoffset:var(--len,120)}

/* Avaliações em cartões brancos, no estilo do Google */
.motion .mx-row .quote{background:#fff;border:1px solid #e6e1d8;border-radius:14px;box-shadow:0 18px 40px -22px rgba(0,0,0,.55);color:#202124;padding:var(--space-3)}
.motion .mx-row .quote::before{display:none}
.motion .mx-row .quote blockquote p{color:#3c4043;font:400 1rem/1.6 var(--font-body);order:2}
.motion .mx-row .quote figcaption{order:-1;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:.25rem .75rem;margin-bottom:.75rem}
.motion .mx-row .mx-stars{order:0;color:#fbbc04;margin:0 0 .5rem}
.motion .mx-row .mx-stars svg{width:15px;height:15px}
.quote__avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;grid-column:1;grid-row:1}
.quote__who{display:flex;flex-direction:column;grid-column:2;grid-row:1}
.motion .mx-row .quote__name{font:600 .9375rem/1.3 var(--font-body);color:#202124}
.quote__when{font-size:.8125rem;color:#70757a}
.quote__g{width:22px;height:22px;grid-column:3;grid-row:1}
.motion .mx-row .quote__src{grid-column:1 / -1;grid-row:2;font-size:.75rem;color:#70757a;margin-top:.35rem}
.motion .mx-row .quote{flex-direction:column;justify-content:flex-start}
/* Cursor sutil: um losango dourado e um brilho suave que segue com atraso */
.mx-cursor{width:0;height:0;margin:0;border:0;background:none;mix-blend-mode:normal}
.mx-cursor::before{content:"";position:absolute;left:-4px;top:-4px;width:8px;height:8px;background:var(--gold-1);transform:rotate(45deg);transition:transform .35s var(--ease),background .3s,box-shadow .3s}
.mx-cursor.is-hover{--cursor:0px;background:none}
.mx-cursor.is-hover::before{transform:rotate(0deg) scale(2.2);background:transparent;box-shadow:inset 0 0 0 1px var(--gold-1)}
.mx-dot{width:140px;height:140px;margin:-70px 0 0 -70px;background:radial-gradient(circle,rgba(230,199,122,.12),transparent 65%);border-radius:50%}

/* Faixas mais estreitas (prevalece sobre as regras acima) */
.mx-marquee{padding-block:.85rem}
.mx-marquee__track{gap:1.5rem}
.mx-marquee__item{font-size:clamp(1.15rem,.95rem + .9vw,1.6rem);gap:1.5rem;letter-spacing:.02em}
.mx-marquee__item::after{width:.3em;height:.3em}
.motion .manifesto,.manifesto{padding-top:var(--space-5)}
.manifesto__box{margin-top:0 !important}
.manifesto{margin-top:0 !important;background:var(--bg)}

/* Faixas finas com fonte sem serifa, em maiúsculas espaçadas */
.mx-marquee,.shift{padding-block:1.05rem;border-block:1px solid var(--line-soft);background:#0b0a09;overflow:hidden}
.mx-marquee__item,.mx-marquee__item:nth-child(even),.shift__item{font:500 clamp(.8rem,.72rem + .3vw,.95rem)/1 var(--font-body);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2);-webkit-text-stroke:0;display:flex;align-items:center;gap:2rem;white-space:nowrap}
.mx-marquee__item:nth-child(even),.shift__item:nth-child(even){color:var(--muted)}
.mx-marquee__item::after,.shift__item::after{content:"";width:5px;height:5px;transform:rotate(45deg);background:var(--gold-2);display:inline-block;flex:none}
.mx-marquee__track,.shift__track{gap:2rem}
.shift__track{display:flex;width:max-content;padding-left:0;font:inherit}

/* Avaliações menores, com "Ver mais" nos comentários longos */
.mx-row{align-items:flex-start}
.motion .mx-row .quote{width:min(78vw,320px);padding:1.1rem 1.25rem}
.motion .mx-row .quote figcaption{grid-template-columns:40px 1fr auto;margin-bottom:.5rem}
.quote__avatar{width:40px !important;height:40px !important}
.motion .mx-row .quote__name{font-size:.875rem}
.quote__when,.motion .mx-row .quote__src{font-size:.75rem}
.motion .mx-row .quote blockquote p{font-size:.9rem;line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;text-align:left}
.motion .mx-row .quote.is-open blockquote p{-webkit-line-clamp:unset;display:block}
.quote__more{margin-top:.5rem;padding:0;background:none;border:0;font:600 .8125rem var(--font-body);color:#1a73e8;cursor:pointer;min-height:32px}
.quote__more:hover{text-decoration:underline}
.quote__more{align-self:flex-start}

/* Desempenho: efeitos que repintavam a tela o tempo todo */
.mx-grain{animation:none !important}
.mx-grid{animation:none !important}
@keyframes h1-wave{0%,82%,100%{color:var(--accent)}88%{color:#fff3cf}}
.motion .h1__b .mx-char{animation-iteration-count:3}
@media (max-width:767px){.mx-blob,.mx-grain{display:none}}
.mx-grain{display:none !important}

/* A abertura só cobre a tela quando realmente vai tocar */
.motion .mx-intro{display:none}
.motion.intro .mx-intro{display:block}