/* ===== PROPOSTA: destaques verdes leves + animações ===== */
:root{--g:#22c55e;--g-soft:rgba(34,197,94,.14);--g-line:rgba(34,197,94,.38)}
::selection{background:rgba(34,197,94,.35);color:inherit}
:focus-visible{outline:2px solid var(--g);outline-offset:3px}

/* barra de progresso de rolagem */
.pgbar{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,transparent,var(--g));z-index:60;pointer-events:none}

/* primeira dobra: brilho verde flutuando + arcos que "respiram" */
.hero::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(560px 380px at 22% 30%,rgba(34,197,94,.12),transparent 70%),radial-gradient(520px 360px at 80% 72%,rgba(34,197,94,.09),transparent 70%);
  animation:drift 16s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(3%,2%,0) scale(1.08)}}
.arcs i{border-color:rgba(34,197,94,.13);animation:breathe 6s ease-in-out infinite}
.arcs i:nth-child(2n){animation-delay:-1.2s}.arcs i:nth-child(3n){animation-delay:-2.6s}.arcs i:nth-child(5){animation-delay:-4s}
@keyframes breathe{0%,100%{opacity:.35}50%{opacity:1}}

/* botão principal: anel pulsando + brilho que passa */
.hero .btn-lg{position:relative;overflow:hidden;animation:ring 3.2s ease-out infinite}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(34,197,94,.45)}70%,100%{box-shadow:0 0 0 16px rgba(34,197,94,0)}}
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);transition:transform .8s var(--ease);pointer-events:none}
.btn:hover::after{transform:translateX(120%)}

/* números: o "+" em verde */
.stats .num::first-letter{color:var(--g)}

/* eyebrows com ponto verde pulsando */
.eyebrow{display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--g);box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:dot 2.4s ease-out infinite;flex:none}
.cta .eyebrow,.hero .eyebrow{justify-content:center}
@keyframes dot{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}80%,100%{box-shadow:0 0 0 9px rgba(34,197,94,0)}}

/* frases-chave: sublinhado verde que se desenha ao entrar na tela */
.mk{background:linear-gradient(var(--g),var(--g)) 0 100% / 0% .11em no-repeat;transition:background-size 1.1s var(--ease) .35s;padding-bottom:.04em}
.head.in .mk,.rv.in .mk,.in .mk{background-size:100% .11em}

/* numeração em verde */
.card .n,.step .n{color:var(--g);font-weight:500}
.step .n{transition:color .6s,transform .6s var(--ease)}
.step.in::before{background:linear-gradient(90deg,var(--g-line),var(--hair) 38%,transparent 100%)}

/* cartões: contorno verde + luz que segue o mouse */
.win,.dif,.tm,.stack .card{position:relative}
.stack .card{position:sticky}
.win::after,.dif::after,.tm::after,.stack .card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .45s;
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(34,197,94,.15),transparent 62%)}
.win:hover::after,.dif:hover::after,.tm:hover::after,.stack .card:hover::after{opacity:1}
.win:hover,.dif:hover,.tm:hover,.stack .card:hover{box-shadow:0 0 0 1px var(--g-line) inset,0 28px 60px -30px rgba(34,197,94,.35)}
.win:hover .arr{background:var(--g)}
.win .arr{transition:transform .35s var(--ease),background .35s}

/* faixas e clientes */
.clients .tr span:hover,.clients .tr span.hot{color:var(--g)}

/* links do menu */
.nav .nav-links a:hover{color:var(--g)}
.nav .theme:hover{color:var(--g)}

@media(prefers-reduced-motion:reduce){.hero::after,.arcs i,.hero .btn-lg,.eyebrow::before{animation:none}.mk{background-size:100% .11em;transition:none}}