/* WRAPPER GERAL */
.ff-destaques-home{position:relative;width:100%;display:flex;flex-direction:column;}
.desktop-only{display:block;}
.mobile-only{display:none;}

/* PAGINAÇÃO DESKTOP */
.ff-destaques-topbar{order:2;display:flex;justify-content:flex-end;align-items:center;margin-top:18px;}
.ff-destaques-controls{display:flex;align-items:center;justify-content:flex-end;gap:14px;width:100%;}
.ff-destaques-dots{display:flex;align-items:center;justify-content:center;gap:8px;}
.ff-destaques-dot{width:10px !important;height:10px !important;padding:0 !important;border:0 !important;border-radius:999px !important;background:#b9ddf4 !important;cursor:pointer !important;transition:width .25s ease, background-color .25s ease, transform .25s ease !important;}
.ff-destaques-dot:hover{transform:scale(1.05);}
.ff-destaques-dot.is-active{width:28px !important;background:#16a7e6 !important;}
.ff-destaques-home .ff-destaques-arrows{display:flex !important;align-items:center !important;gap:10px !important;}
.ff-destaques-home .ff-destaques-arrow{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  outline:none !important;
  border-radius:999px !important;
  background:rgba(31,111,178,.92) !important;
  color:#ffffff !important;
  box-shadow:none !important;
  cursor:pointer !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  line-height:1 !important;
  font-size:0 !important;
  transition:transform .2s ease, opacity .2s ease, background-color .2s ease !important;
}
.ff-destaques-home .ff-destaques-arrow .ff-destaques-arrow-icon{
  display:block !important;
  color:#ffffff !important;
  font-size:28px !important;
  font-weight:700 !important;
  line-height:1 !important;
  transform:translateY(-1px) !important;
  pointer-events:none !important;
}
.ff-destaques-home .ff-destaques-arrow:hover{background:rgba(21,90,145,1) !important;transform:scale(1.05) !important;}
.ff-destaques-home .ff-destaques-arrow:focus{background:rgba(21,90,145,1) !important;}
.ff-destaques-home .ff-destaques-arrow.is-disabled{opacity:.42 !important;cursor:not-allowed !important;pointer-events:none !important;transform:none !important;}

/* DESKTOP */
.ff-destaques-desktop{order:1;width:100%;}
.ff-destaques-viewport{width:100%;overflow:hidden;min-height:420px;position:relative;isolation:isolate;}
.ff-destaques-track{display:flex;width:calc(var(--ff-pages, 1) * 100%);transform:translate3d(calc(var(--ff-current-page, 0) * -100% / var(--ff-pages, 1)),0,0);transition:transform .7s cubic-bezier(.22,.61,.36,1);will-change:transform;}
.ff-page{flex:0 0 calc(100% / var(--ff-pages, 1));max-width:calc(100% / var(--ff-pages, 1));min-width:calc(100% / var(--ff-pages, 1));box-sizing:border-box;}

/* CONTAINER PRINCIPAL */
.cards-expansiveis{display:flex;flex-wrap:nowrap !important;gap:12px;width:100%;min-height:420px;align-items:stretch;}

/* CADA CARD */
.cards-expansiveis .card-expansivel{position:relative;width:0;flex:1 1 0%;min-width:0;overflow:hidden;border-radius:22px;transition:flex .45s ease, transform .35s ease;cursor:pointer;display:flex;align-items:flex-end;background-size:cover;background-position:center;background-repeat:no-repeat;}
.cards-expansiveis .ff-card-placeholder{visibility:hidden;pointer-events:none;background:transparent !important;}
.cards-expansiveis .card-expansivel::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.38) 35%,rgba(0,0,0,.12) 60%,rgba(0,0,0,.06) 100%);z-index:1;transition:background .35s ease;}
.cards-expansiveis:hover .card-expansivel{flex:0.82;}
.cards-expansiveis:hover .card-expansivel:hover{flex:2.7;}
.cards-expansiveis .card-overlay{position:relative;z-index:2;width:100%;min-height:100%;padding:20px 16px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;}
.cards-expansiveis .ff-card-link-wrap{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;transform:translateY(10px);opacity:0;transition:opacity .35s ease, transform .35s ease;}
.cards-expansiveis .ff-card-link-wrap:hover{color:#fff;}
.ff-icon-circle{width:34px;height:34px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#0c7fd1;color:#fff;font-size:18px;line-height:1;flex-shrink:0;}
.cards-expansiveis .card-titulo{margin:0;color:#fff;line-height:1.1;}
.cards-expansiveis .card-titulo h3{margin:0;color:#fff;font-size:24px;line-height:1.05;}
.cards-expansiveis .card-extra{max-height:0;opacity:0;overflow:hidden;transform:translateY(10px);transition:max-height .45s ease, opacity .35s ease, transform .35s ease, margin-top .35s ease;margin-top:0;}
.cards-expansiveis .card-extra p{margin:0;color:#fff;font-size:13px;line-height:1.45;}
.cards-expansiveis .card-expansivel:hover .ff-card-link-wrap{opacity:1;transform:translateY(0);}
.cards-expansiveis .card-expansivel:hover .card-extra{max-height:240px;opacity:1;transform:translateY(0);margin-top:10px;}
.cards-expansiveis:hover .card-expansivel:not(:hover) .card-extra{max-height:0;opacity:0;margin-top:0;}
.cards-expansiveis .card-expansivel:hover::before{background:linear-gradient(to top,rgba(0,0,0,.80) 0%,rgba(0,0,0,.42) 38%,rgba(0,0,0,.12) 65%,rgba(0,0,0,.04) 100%);}


@media (min-width:1280px){
  .cards-expansiveis{gap:14px;}
  .cards-expansiveis .card-titulo h3{font-size:26px;}
}

@media (max-width:1024px){
  .ff-destaques-viewport{min-height:360px;}
  .cards-expansiveis{min-height:360px;gap:10px;}
  .cards-expansiveis:hover .card-expansivel{flex:1;}
  .cards-expansiveis .card-expansivel:hover{flex:2.1;}
  .cards-expansiveis .card-titulo h3{font-size:22px;}
  .ff-destaques-controls{gap:10px;}
  .ff-destaques-home .ff-destaques-arrow{width:32px !important;height:32px !important;min-width:32px !important;min-height:32px !important;}
  .ff-destaques-home .ff-destaques-arrow .ff-destaques-arrow-icon{font-size:24px !important;}
}

@media (max-width:767px){
  .desktop-only{display:none;}
  .mobile-only{display:block;}
  .ff-destaques-home{display:block;}
  .ff-destaques-mobile{width:100%;overflow:hidden;padding-bottom:36px;position:relative;}
  .ff-destaques-mobile .swiper-slide{height:auto;}
  .ff-destaques-mobile .card-expansivel{position:relative;min-height:240px;overflow:hidden;border-radius:22px;display:flex;align-items:flex-end;background-size:cover;background-position:center;background-repeat:no-repeat;}
  .ff-destaques-mobile .card-expansivel::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.38) 35%,rgba(0,0,0,.12) 60%,rgba(0,0,0,.06) 100%);z-index:1;}
  .ff-destaques-mobile .card-overlay{position:relative;z-index:2;width:100%;min-height:100%;padding:18px 16px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;}
  .ff-destaques-mobile .ff-card-link-wrap{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;opacity:1;transform:none;}
  .ff-destaques-mobile .ff-card-link-wrap h3{margin:0;color:#fff;font-size:20px;line-height:1.08;}
  .ff-destaques-mobile .card-extra{max-height:220px;opacity:1;overflow:visible;transform:none;margin-top:12px;}
  .ff-destaques-mobile .card-extra p{margin:0;color:#fff;font-size:13px;line-height:1.45;}

  /* DOTS MOBILE */
  .ff-mobile-pagination{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;gap:8px;}
  .ff-mobile-pagination .swiper-pagination-bullet{width:10px;height:10px;opacity:1;background:#b9ddf4;margin:0 !important;border-radius:999px;transition:width .25s ease, background-color .25s ease, transform .25s ease;}
  .ff-mobile-pagination .swiper-pagination-bullet-active{width:28px;border-radius:999px;background:#16a7e6;}
}



/* Setas desktop com ícone SVG igual ao restante do site */
.carousel-arrow svg,
.carousel-arrow .e-font-icon-svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    fill: #ffffff !important;
    color: #ffffff !important;
    flex: 0 0 22px !important;
    pointer-events: none !important;
}

.carousel-arrow path {
    fill: currentColor !important;
}

.carousel-arrow .carousel-arrow-icon {
    display: none !important;
}


/* SVG das setas igual ao restante do site */
.ff-destaques-arrow svg,
.ff-destaques-arrow .e-font-icon-svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    fill: #ffffff !important;
    color: #ffffff !important;
    flex: 0 0 22px !important;
    pointer-events: none !important;
}

.ff-destaques-arrow path {
    fill: currentColor !important;
}
