/* Cana360 - crédito Atlas no rodapé + efeitos extras (portados do site Thomazini Sports) */

/* ===== Rodapé / crédito Atlas ===== */
.atlas-credit{display:flex;justify-content:center;padding:28px 16px 8px;margin-top:8px}
.atlas-credit--app{padding-bottom:calc(var(--bottom-nav-h,62px) + 16px + var(--safe-bottom,0px))}
.atlas-credit--card{padding:18px 0 0;margin-top:14px;border-top:1px solid var(--color-border,#e5e7eb)}
.atlas-credit--pagina{padding:36px 16px 40px;margin-top:24px;border-top:1px solid var(--color-border,#e5e7eb)}
.atlas-credit .dev{display:flex;align-items:center;justify-content:center;gap:12px;width:fit-content;max-width:100%;text-decoration:none;transition:.3s}
.atlas-credit .dev img{box-sizing:border-box;width:46px;height:auto;flex:none;object-fit:contain;padding:5px;background:#0a1624;border-radius:10px;filter:drop-shadow(0 0 8px rgba(34,200,255,.3));transition:transform .6s,filter .3s}
.atlas-credit .dev-txt{display:flex;flex-direction:column;line-height:1.35;text-align:left}
.atlas-credit .dev-txt strong{font-weight:600;font-size:.78rem;color:var(--color-text,#1f2937);letter-spacing:.02em;transition:color .3s}
.atlas-credit .dev-txt em{font-style:normal;font-size:.72rem;color:var(--color-text-secondary,#6b7280);transition:color .3s}
.atlas-credit .dev:hover .dev-txt strong,.atlas-credit .dev:hover .dev-txt em{color:#0a8fc4}
.atlas-credit .dev:hover img{transform:rotate(-8deg) scale(1.08);filter:drop-shadow(0 0 12px rgba(34,200,255,.6))}
html[data-theme="dark"] .atlas-credit .dev img{background:none;padding:0}
html[data-theme="dark"] .atlas-credit .dev:hover .dev-txt strong,
html[data-theme="dark"] .atlas-credit .dev:hover .dev-txt em{color:#3fd0ff}
@media (max-width:380px){.atlas-credit .dev-txt strong{font-size:.72rem}}

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

/* ===== Entrada suave: abas, cartões e telas de acesso ===== */
@keyframes fxup{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.tab-panel:not([hidden]){animation:fxup .45s cubic-bezier(.2,.7,.2,1) both}
.auth-card{animation:fxup .8s cubic-bezier(.2,.7,.2,1) both}
.fx-rv{opacity:0;translate:0 28px;transition:opacity .7s ease var(--d,0s),translate .8s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.fx-rv.fx-in{opacity:1;translate:0 0}

/* ===== Brilho que passa nos botões principais ===== */
.btn--primary{position:relative;overflow:hidden}
.btn--primary::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);transition:left .7s;pointer-events:none}
.btn--primary:hover::after{left:130%}

/* ===== Inclinação 3D nos cartões de resumo ===== */
.fx-tilt{transition:transform .25s ease-out,box-shadow .3s}

@media (prefers-reduced-motion:reduce){
  .fx-progress{display:none}
  .tab-panel:not([hidden]),.auth-card{animation:none}
  .fx-rv{opacity:1;translate:none;transition:none}
  .btn--primary::after{display:none}
}