/* Cana Agro Tech - crédito Atlas no rodapé + animações (portadas do site Thomazini Sports) */

/* ===== Crédito Atlas ===== */
.dev{display:flex;align-items:center;justify-content:center;gap:14px;margin:26px auto 0;width:fit-content;max-width:100%;text-decoration:none;transition:.3s}
.dev img{width:44px;height:auto;flex:none;object-fit:contain;filter:drop-shadow(0 0 10px rgba(34,200,255,.35));transition:transform .6s,filter .3s}
.dev-txt{display:flex;flex-direction:column;line-height:1.35;text-align:left}
.dev-txt strong{font-weight:600;font-size:.82rem;color:#C5D8CC;letter-spacing:.02em;transition:color .3s}
.dev-txt em{font-style:normal;font-size:.74rem;color:#7F9A8A;transition:color .3s}
footer .dev:hover .dev-txt strong,footer .dev:hover .dev-txt em{color:#3fd0ff}
.dev:hover img{transform:rotate(-8deg) scale(1.08);filter:drop-shadow(0 0 14px rgba(34,200,255,.6))}

/* ===== Barra de progresso da rolagem ===== */
.fx-progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--lima,#A6E04B);transform-origin:left;transform:scaleX(0);z-index:70;pointer-events:none}

/* ===== Topo: sombra ao rolar ===== */
header.topo{transition:box-shadow .3s,background .3s}
header.topo.rolou{box-shadow:0 8px 30px rgba(13,53,32,.12)}

/* ===== Menu: página/seção atual ===== */
.nav ul a.ativo,.nav ul a[aria-current="page"]{color:var(--floresta);border-color:var(--folha)}

/* ===== Entrada do topo da página ===== */
@keyframes fxup{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.hero .eyebrow{animation:fxup .9s .1s both}
.hero h1,.ph h1{animation:fxup .9s .25s both}
.hero .sub,.ph .sub,.ph p{animation:fxup .9s .4s both}
.hero .botoes,.ph .botoes{animation:fxup .9s .55s both}
.hero-img{animation:fxup 1.1s .5s both}

/* ===== Brilho no destaque do título principal ===== */
.hero h1 em{background:linear-gradient(100deg,#A6E04B 35%,#F2FFD6 50%,#A6E04B 65%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:fxshine 4s ease-in-out 1.4s infinite}
@keyframes fxshine{0%{background-position:100% 0}55%,100%{background-position:0 0}}

/* ===== Brilho que passa nos botões + seta chamando ===== */
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);transition:left .7s;pointer-events:none}
.btn:hover::after{left:130%}
.hero .btn.pre .ico{animation:fxnudge 1.8s ease-in-out 1.5s infinite}
@keyframes fxnudge{50%{transform:translateX(6px)}}

/* ===== Logo do topo e do rodapé: giro leve ===== */
.logo img{transition:transform .6s}
.logo:hover img{transform:rotate(-8deg) scale(1.08)}

/* ===== Anel pulsante no botão do WhatsApp ===== */
.zap{transition:transform .3s,translate .25s}
.zap::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;animation:fxring 2.4s ease-out infinite;pointer-events:none}
@keyframes fxring{from{transform:scale(1);opacity:.9}to{transform:scale(1.8);opacity:0}}

/* ===== Títulos: palavra por palavra, de baixo para cima ===== */
.fx-split .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .06em .16em;margin:0 -.06em -.16em}
.fx-split .w>span{display:inline-block;translate:0 115%;transition:translate 1s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0)*.07s)}
.fx-split.in .w>span{translate:0 0}

/* ===== Entrada em cascata ===== */
.rv-item{opacity:0;translate:0 40px;transition:opacity .8s ease,translate .9s cubic-bezier(.2,.7,.2,1),transform .4s,border-color .3s,background .3s,box-shadow .3s;transition-delay:var(--d,0s)}
.rv-item.in{opacity:1;translate:0 0}
.rv-item.done{transition-delay:0s}

/* ===== Inclinação 3D ===== */
.fx-tilt{transition:transform .25s ease-out,box-shadow .3s,border-color .3s}

@media (prefers-reduced-motion:reduce){
  .fx-progress{display:none}
  .hero .eyebrow,.hero h1,.ph h1,.hero .sub,.ph .sub,.ph p,.hero .botoes,.ph .botoes,.hero-img,.hero h1 em,.hero .btn.pre .ico,.zap::before{animation:none}
  .fx-split .w>span{translate:none}
  .rv-item{opacity:1;translate:none}
  .btn::after{display:none}
}
