/* ============================================================
   FZZ Group — estilos compartilhados (redesign 2026)
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{-webkit-font-smoothing:antialiased;background:#fff;line-height:1.5;}
img{max-width:100%;}
::selection{background:#2A6FDB;color:#fff;}

/* ---------- keyframes ---------- */
@keyframes fzzPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.35;transform:scale(.65);}}
@keyframes fzzMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes leapMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes fzzRise{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@keyframes fzzFlow{0%{background-position:0% 0;}100%{background-position:200% 0;}}
@keyframes fzzReveal{from{opacity:0;transform:translateY(18px) scale(.985);}to{opacity:1;transform:none;}}
@keyframes fzzProg{from{width:0;}to{width:100%;}}
@keyframes ccFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-14px);}}
@keyframes leapPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}

/* ---------- marquees ---------- */
.fzz-track,.cc-track,.jr-track,.leap-track{display:flex;width:max-content;}
.fzz-track:hover,.cc-track:hover,.jr-track:hover,.leap-track:hover{animation-play-state:paused;}

/* ---------- logo marquees (esteiras de logos) ---------- */
.logo-marquee{position:relative;width:100%;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);}
.lm-track{display:flex;width:max-content;}
.lm-track:hover{animation-play-state:paused;}
.lm-row{display:flex;align-items:center;gap:52px;padding-right:52px;flex:0 0 auto;}
.lm-logo{height:34px;width:auto;max-width:160px;display:block;flex:0 0 auto;object-fit:contain;}
/* monocromatico uniforme: mesmos logos brancos em todo o site.
   fundo claro -> tinta escura (brightness 0); fundo escuro -> branco */
.logo-marquee.light .lm-logo{filter:brightness(0);opacity:.5;transition:opacity .3s ease;}
.logo-marquee.light .lm-logo:hover{opacity:.85;}
.logo-marquee.dark .lm-logo{opacity:.5;transition:opacity .3s ease;}
.logo-marquee.dark .lm-logo:hover{opacity:.9;}

/* ---------- nav underline ---------- */
.navu{position:relative;}
.navu::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:#2A6FDB;transform:scaleX(0);transform-origin:left;transition:transform .28s cubic-bezier(.2,.7,.2,1);}
.navu-red::after{background:#E2001A;}
.navu-cyan::after{background:#1FA8C6;}
.navu:hover::after{transform:scaleX(1);}

/* ---------- dropdown Empresas ---------- */
.emp-wrap{position:relative;display:flex;align-items:center;}
.emp-menu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(6px);min-width:250px;background:#fff;border:1px solid #E2E6EE;border-radius:16px;padding:8px;box-shadow:0 26px 60px rgba(20,39,91,0.16);opacity:0;visibility:hidden;transition:opacity .22s ease,transform .22s ease;z-index:90;}
/* ponte invisivel que cobre o vao entre "Empresas" e o menu, para o hover nao se perder */
.emp-menu::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px;}
.emp-wrap:hover .emp-menu,.emp-menu:hover{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
/* mantem o menu aberto por um instante apos sair do gatilho, evitando fechamento abrupto */
.emp-menu{transition:opacity .22s ease .12s,transform .22s ease .12s,visibility 0s linear .34s;}
.emp-wrap:hover .emp-menu,.emp-menu:hover{transition:opacity .18s ease,transform .18s ease,visibility 0s;}
.emp-item{display:flex;align-items:center;gap:13px;padding:10px 13px;border-radius:11px;text-decoration:none;transition:background .18s;}
.emp-item:hover{background:#F4F6FA;}
.emp-item img{height:22px;width:34px;object-fit:contain;display:block;}

/* ---------- hovers de cards ---------- */
.fzz-stage{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s ease,border-color .4s ease;}
.fzz-stage:hover{transform:translateY(-5px);border-color:#C7D2E8;box-shadow:0 24px 54px rgba(20,39,91,0.10);}
.jr-card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;}
.jr-card:hover{transform:translateY(-6px);border-color:#F3B9C0;box-shadow:0 26px 56px rgba(226,0,26,0.12);}
.vi-card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;}
.vi-card:hover{transform:translateY(-6px);border-color:#C7D2E8;box-shadow:0 26px 56px rgba(20,39,91,0.12);}
.jr-shot,.vi-shot{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s ease;}
.jr-shot:hover,.vi-shot:hover{transform:translateY(-5px);box-shadow:0 30px 64px rgba(11,23,54,0.22);}

/* ---------- hovers de botões ---------- */
.bh-blue{transition:background .2s;}
.bh-blue:hover{background:#1E5BC0 !important;}
.bh-navy{transition:background .2s;}
.bh-navy:hover{background:#2A6FDB !important;}
.bh-red{transition:background .2s;}
.bh-red:hover{background:#B80016 !important;}
.bh-outline{transition:border-color .2s;}
.bh-outline:hover{border-color:#fff !important;}
.bh-arrow{transition:border-color .2s;}
.bh-arrow:hover{border-color:#1D1D1F !important;}
.wa-float{transition:transform .2s,box-shadow .2s;}
.wa-float:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(0,0,0,0.34) !important;}

/* ---------- footer ---------- */
.ft-social{width:40px;height:40px;border-radius:11px;border:1px solid #1E3057;display:flex;align-items:center;justify-content:center;color:#B6C4E0;text-decoration:none;transition:.2s;}
.ft-social:hover{background:var(--ft-accent,#2A6FDB);color:#fff;border-color:var(--ft-accent,#2A6FDB);}
.ft-link{font-size:14.5px;color:#B6C4E0;text-decoration:none;transition:color .2s;}
.ft-link:hover{color:#fff;}

/* ---------- spotlight (home) ---------- */
.fzz-tab{position:relative;display:flex;align-items:center;gap:14px;text-align:left;border-radius:16px;padding:15px 18px;cursor:pointer;overflow:hidden;font-family:inherit;transition:border-color .3s,background .3s,box-shadow .3s;border:1.5px solid #E2E6EE;background:#fff;box-shadow:none;}
.fzz-tab.on{box-shadow:0 14px 30px rgba(20,39,91,0.10);}

/* ---------- carrossel Leap ---------- */
.leap-ptab{flex:1 1 200px;text-align:left;cursor:pointer;background:transparent;border:none;padding:6px 2px 0;font-family:inherit;outline:none;}

/* ---------- responsivo ---------- */
@media (max-width: 960px){
  .nav-links{display:none !important;}
  .grid-stats{grid-template-columns:repeat(2,1fr) !important;}
  .grid-stats > div:nth-child(2n){border-right:none !important;}
  .grid-split,.grid-split-r{grid-template-columns:1fr !important;}
  .grid-chain{grid-template-columns:repeat(3,1fr) !important;row-gap:34px !important;}
  .chain-line{display:none !important;}
  .grid-spot{grid-template-columns:1fr !important;}
  .spot-tabs{flex-direction:row !important;flex-wrap:wrap;}
  .spot-tabs .fzz-tab{flex:1 1 45%;}
  .grid-fly{grid-template-columns:repeat(2,1fr) !important;row-gap:36px !important;}
  .grid-flow{grid-template-columns:repeat(2,1fr) !important;row-gap:36px !important;}
  .fly-line,.flow-line{display:none !important;}
  .grid-3{grid-template-columns:1fr !important;}
  .ft-grid{grid-template-columns:1fr 1fr !important;row-gap:34px !important;}
}
@media (max-width: 560px){
  .grid-stats{grid-template-columns:1fr 1fr !important;}
  .grid-chain{grid-template-columns:repeat(2,1fr) !important;}
  .grid-fly,.grid-flow{grid-template-columns:1fr !important;}
  .ft-grid{grid-template-columns:1fr !important;}
  .spot-tabs .fzz-tab{flex:1 1 100%;}
}