.elementor-kit-5{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-a77d422:#0F172A;--e-global-color-9b669b6:#1E2A44;--e-global-color-08ca846:#F97316;--e-global-color-8d74063:#25D366;--e-global-color-9199b21:#FFF7ED;--e-global-color-1f17384:#667085;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-5 button,.elementor-kit-5 input[type="button"],.elementor-kit-5 input[type="submit"],.elementor-kit-5 .elementor-button{background-color:var( --e-global-color-primary );}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* Planos - versÃ£o tablet vertical / mobile */

.cd-plans-mobile-section {
  padding: 60px 20px !important;
  overflow: visible !important;
}

/* Card base */
.cd-plan-mobile-card {
  width: 100% !important;
  max-width: 520px !important;
  margin: 0 auto 24px auto !important;
  padding: 32px 28px !important;
  border: 1px solid rgba(15, 45, 90, 0.22) !important;
  border-radius: 24px !important;
  background: rgba(255, 250, 242, 0.92) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12) !important;
  text-align: left !important;
  position: relative !important;
  z-index: 5 !important;
  overflow: hidden !important;
  
}

/* Card Profissional destacado */
.cd-plan-featured-mobile {
  z-index: 20 !important;
  border: 2px solid #ff6b00 !important;
  box-shadow: 0 18px 42px rgba(255, 107, 0, 0.22) !important;
  transform: scale(1.03) !important;
  margin-top: -34px !important;
  margin-bottom: -34px !important;
}

/* TÃ­tulos */
.cd-plan-mobile-card h3,
.cd-plan-mobile-card h2 {
  font-size: clamp(28px, 6vw, 42px) !important;
  line-height: 1.05 !important;
  margin-bottom: 18px !important;
  text-align: center !important;
}

/* Textos */
.cd-plan-mobile-card p,
.cd-plan-mobile-card li,
.cd-plan-mobile-card .elementor-widget-text-editor {
  font-size: clamp(16px, 3.5vw, 20px) !important;
  line-height: 1.45 !important;
  text-align: left !important;
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.cd-plan-mobile-card .elementor-widget-container {
  max-width: 100% !important;
  
}

/* Imagens */
.cd-plan-mobile-card img {
  max-width: 110px !important;
  margin: 24px auto 0 auto !important;
  display: block !important;
  
}

/* Tablet vertical */
@media (min-width: 768px) and (max-width: 1024px) {
  .cd-plan-mobile-card {
    max-width: 560px !important;
    padding: 34px 34px !important;
    margin-bottom: -2px !important;
    
  }

  .cd-plan-featured-mobile {
    margin-top: -36px !important;
    margin-bottom: -36px !important;
    transform: scale(1.03) !important;
  }
}

/* Mobile horizontal */
@media (max-width: 880px) and (orientation: landscape) {
  .cd-plans-mobile-section {
    padding: 40px 24px !important;
  }

  .cd-plan-mobile-card {
    max-width: 620px !important;
    padding: 26px 30px !important;
    margin-bottom: 22px !important;
  }

  .cd-plan-featured-mobile {
    margin-top: -56px !important;
    margin-bottom: -26px !important;
    transform: scale(1.02) !important;
  }
}

/* Mobile vertical */
@media (max-width: 767px) {
  .cd-plans-mobile-section {
    padding: 48px 16px !important;
  }

  .cd-plan-mobile-card {
    max-width: 92vw !important;
    padding: 32px 24px !important;
    margin-bottom: 22px !important;
    border-radius: 22px !important;
  }

  .cd-plan-featured-mobile {
    margin-top: -48px !important;
    margin-bottom: -48px !important;
    transform: scale(1.015) !important;
  }

  .cd-plan-mobile-card img {
    max-width: 88px !important;
  }
}

/* Remove borda/sombra externa que estÃ¡ descolada dos cards */
@media (max-width: 1024px) {
  .cd-plans-frame {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .cd-plans-frame > .e-con-inner,
  .cd-plans-frame > .elementor-container {
    padding: 0 !important;
  }
}

.card-essencial,
.card-premium {
  border: 1px solid rgba(15,45,90,.22) !important;
  border-radius: 24px !important;
  box-shadow: 0 10px 25px rgba(15,23,42,.08) !important;
  overflow: hidden !important;
}

.card-profissional {
  border: 2px solid #ff6b00 !important;
  border-radius: 24px !important;
  box-shadow: 0 20px 48px rgba(255,107,0,.18) !important;
  overflow: hidden !important;
}

.cd-faq-section {
  position: relative;
  overflow: hidden;
  background-size: cover !important;
  background-position: center center !important;
  background-attachment: fixed;
  padding: 90px 20px !important;
}

/* Card branco maior */
.cd-faq-card {
  width: 100% !important;
  max-width: 920px !important;
  margin: 0 auto !important;
  padding: 48px 56px !important;
  background: rgba(255, 255, 255, 0.88) !important;
  border-radius: 32px !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.14) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Accordion dentro do card */
.cd-faq-card .elementor-widget-container {
  width: 100% !important;
  max-width: 720px !important;
  margin: 0 auto !important;
}

/* Tablet */
@media (max-width: 1024px) {
  .cd-faq-section {
    background-attachment: scroll;
    padding: 70px 18px !important;
  }

  .cd-faq-card {
    max-width: 82vw !important;
    padding: 38px 34px !important;
    border-radius: 28px !important;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .cd-faq-card {
    max-width: 92vw !important;
    padding: 28px 20px !important;
    border-radius: 22px !important;
  }
}

#scrollTopBtn {
    position: fixed;
    bottom: 110px;
    right: 32px;

    width: 52px;
    height: 52px;

    border: none;
    border-radius: 50%;

    background: #ff6b00;
    color: #fff;

    font-size: 24px;
    font-weight: 700;

    cursor: pointer;

    box-shadow: 0 8px 20px rgba(0,0,0,.18);

    opacity: 0;
    visibility: hidden;

    transition: all .3s ease;

    z-index: 9999;
}

#scrollTopBtn.show {
    opacity: 1;
    visibility: visible;
}

#scrollTopBtn:hover {
    transform: translateY(-3px);
}

/* Ajuste da seta no mobile */
@media (max-width: 767px) {
  #scrollTopBtn {
    width: 50px;
    height: 50px;

    right: 18px;
    bottom: 86px;

    font-size: 24px;
    font-weight: 500;
    z-index: 9998;
  }
}


/* Mobile horizontal */
@media (max-width: 767px) and (orientation: landscape) {
  #scrollTopBtn {
    display: none !important;
  }
}

/* Tablet horizontal */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  #scrollTopBtn {
    display: none !important;
  }
}



.cd-menu-hero {
  min-height: 520px;
  display: flex;
  align-items: center;
  background-position: center right !important;
  background-size: cover !important;
  position: relative;
  overflow: hidden;
}

.cd-menu-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(36, 20, 5, 0.72) 0%,
    rgba(79, 43, 12, 0.52) 38%,
    rgba(255, 122, 0, 0.12) 62%,
    rgba(0, 0, 0, 0.05) 100%
  );
  z-index: 0;
}

.cd-menu-hero > * {
  position: relative;
  z-index: 1;
}

.cd-menu-hero h1,
.cd-menu-hero h2 {
  color: #ffffff !important;
  line-height: 1.05 !important;
  letter-spacing: -0.04em;
}

.cd-menu-hero p {
  color: rgba(255,255,255,.92) !important;
  line-height: 1.35 !important;
  max-width: 620px;
}

.cd-menu-hero .elementor-button {
  background: #20c965 !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  padding: 14px 32px !important;
  box-shadow: 0 14px 30px rgba(32,201,101,.28);
}

/* Ajuste fino Hero do CardÃ¡pio */
.cd-menu-hero::before {
  background: linear-gradient(
    90deg,
    rgba(20, 12, 4, 0.82) 0%,
    rgba(55, 30, 8, 0.62) 34%,
    rgba(255, 122, 0, 0.18) 58%,
    rgba(0, 0, 0, 0.05) 100%
  ) !important;
}

/* SubtÃ­tulo menor */
.cd-menu-hero p {
  line-height: 1.35 !important;
  max-width: 540px !important;
}

/* TÃ­tulo um pouco mais elegante */
.cd-menu-hero h1,
.cd-menu-hero h2 {
  line-height: 1.05 !important;
  max-width: 620px !important;
}

/* Selo superior: deixa de parecer botÃ£o */
.cd-menu-hero .hero-badge,
.cd-menu-hero .elementor-button:first-child {
  background: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  border-radius: 999px !important;
  padding: 8px 18px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  pointer-events: none !important;
}

/* BotÃ£o principal */
.cd-menu-hero .elementor-button:last-child {
  background: #20c965 !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  padding: 13px 30px !important;
  box-shadow: 0 14px 30px rgba(32, 201, 101, 0.28) !important;
}

/* InformaÃ§Ãµes: mais legÃ­veis */
.cd-menu-hero .elementor-icon-list-text,
.cd-menu-hero .elementor-icon-list-icon i,
.cd-menu-hero .elementor-icon-list-icon svg {
  color: rgba(255, 255, 255, 0.92) !important;
  fill: rgba(255, 255, 255, 0.92) !important;
}

/* Remove repetiÃ§Ã£o visual se houver segundo parÃ¡grafo */
.cd-menu-hero p + p {
  font-size: 16px !important;
  opacity: 0.9 !important;
  max-width: 480px !important;
}


/* HERO CARDÃPIO - ajustes responsivos */

/* Desktop: refina sem mudar muito */
.cd-menu-hero h1,
.cd-menu-hero h2 {
  line-height: 1.05 !important;
}

.cd-menu-hero p {
  max-width: 560px !important;
}

/* Tablet vertical */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .cd-menu-hero {
    min-height: 520px !important;
    background-position: 68% center !important;
  }

  .cd-menu-hero h1,
  .cd-menu-hero h2 {
    line-height: 1.08 !important;
    max-width: 520px !important;
  }

  .cd-menu-hero p {
    line-height: 1.4 !important;
    max-width: 480px !important;
  }
}

/* Mobile vertical */
@media (max-width: 767px) and (orientation: portrait) {
  .cd-menu-hero {
    min-height: 470px !important;
    background-position: 72% center !important;
    align-items: flex-end !important;
    padding: 0 !important;
  }

  .cd-menu-hero::before {
    background: linear-gradient(
      180deg,
      rgba(0,0,0,0.05) 0%,
      rgba(35,20,8,0.45) 38%,
      rgba(25,14,5,0.86) 100%
    ) !important;
  }

  .cd-menu-hero h1,
  .cd-menu-hero h2 {
    font-size: 30px !important;
    line-height: 1.05 !important;
    max-width: 310px !important;
    margin-bottom: 14px !important;
  }

  .cd-menu-hero p {
    font-size: 16px !important;
    line-height: 1.35 !important;
    max-width: 310px !important;
    margin-bottom: 14px !important;
  }

  .cd-menu-hero .elementor-button {
    padding: 11px 22px !important;
    font-size: 14px !important;
  }

  .cd-menu-hero .elementor-icon-list-text {
    font-size: 13px !important;
  }
}

/* Mobile horizontal: esconder se ficar apertado */
@media (max-width: 880px) and (orientation: landscape) {
  .cd-menu-hero {
    min-height: 390px !important;
  
  }

  .cd-menu-hero h1,
  .cd-menu-hero h2 {
    font-size: 34px !important;
  }

  .cd-menu-hero p {
    font-size: 16px !important;
    max-width: 420px !important;
  }
}


@media (max-width: 767px) and (orientation: portrait) {
  .cd-menu-hero {
    min-height: 350px !important;
    padding: 24px 20px !important;
    background-position: center right !important;
    background-size: cover !important;
    align-items: flex-end !important;
  }

  .cd-menu-hero h1,
  .cd-menu-hero h2 {
    font-size: 30px !important;
    line-height: 1.05 !important;
    max-width: 310px !important;
    margin-bottom: 10px !important;
  }

  .cd-menu-hero p {
    font-size: 15px !important;
    line-height: 1.35 !important;
    max-width: 310px !important;
    margin-bottom: 12px !important;
  }

  .cd-menu-hero .elementor-button {
    font-size: 14px !important;
    padding: 11px 22px !important;
  }
}



/* CONTROLE DOS HEROS */
@media (min-width: 768px) {
  .cd-mobile-hero-wrap {
    display: none !important;
  }
}

@media (max-width: 767px) and (orientation: portrait) {
  .cd-desktop-hero-wrap {
    display: none !important;
  }

.cd-mobile-hero-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 410px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  position: relative !important;
}

  .cd-mobile-hero-wrap .cd-mobile-hero {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 410px !important;
  margin: 0 !important;
  padding: 24px 22px !important;
  display: flex !important;
  align-items: flex-end !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  position: relative !important;
  overflow: visible !important;
}

  .cd-mobile-hero-wrap .cd-mobile-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      180deg,
      rgba(0,0,0,0.08) 0%,
      rgba(25,14,5,0.42) 45%,
      rgba(20,10,4,0.82) 100%
    );
    z-index: 0;
  }

  .cd-mobile-hero-wrap .cd-mobile-hero > * {
    position: relative !important;
    z-index: 1 !important;
  }
}

@media (min-width: 768px) {
  .cd-mobile-hero-new {
    display: none !important;
  }
}

@media (max-width: 767px) and (orientation: portrait) {
  .cd-mobile-hero-new {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 420px !important;
  background-size: cover !important;
  background-position: 80% center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
  position: relative !important;
}

  .cd-mobile-hero-new::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      180deg,
      rgba(0,0,0,.08) 0%,
      rgba(20,10,4,.35) 45%,
      rgba(20,10,4,.72) 100%
    );
    z-index: 0;
  }

  .cd-mobile-hero-new > * {
    position: relative !important;
    z-index: 1 !important;
  }
}

@media (max-width: 767px) and (orientation: portrait) {
  .cd-mobile-hero-new,
  .cd-mobile-hero-new.e-con,
  .cd-mobile-hero-new.e-flex {
    height: auto !important;
    min-height: 420px !important;
    max-height: none !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .cd-mobile-hero-new > .e-con-inner {
    min-height: 420px !important;
    padding-top: 0 !important;
  }
}

@media (max-width: 767px) and (orientation: portrait) {
  .cd-mobile-hero-parent {
    height: auto !important;
    min-height: 420px !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}



.cd-mobile-hero-new::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
       90deg,
rgba(18,10,6,.55) 0%,
rgba(18,10,6,.45) 35%,
rgba(18,10,6,.30) 60%,
rgba(18,10,6,.12) 80%,
rgba(18,10,6,0) 100%
    );
    z-index:0;
}


.cd-mobile-hero-new > *{
    position:relative;
    z-index:1;
}


/* ==========================================================
   CARDÃPIO DIGITAL
   Controle dos Heroes por viewport

   Objetivo:
   Garantir que o Hero mobile vertical nÃ£o ocupe espaÃ§o
   nos viewports desktop, notebook, tablet e mobile horizontal.

   Estrutura:
   - cd-desktop-hero-wrap  = Hero usado em desktop, notebook,
                             tablet e mobile horizontal.
   - cd-mobile-hero-parent = Hero exclusivo do mobile vertical.
   ========================================================== */

/* Desktop, notebook, tablet e mobile horizontal:
   mantÃ©m o Hero desktop ativo e remove totalmente o Hero mobile vertical */
@media (min-width: 768px),
       (max-width: 767px) and (orientation: landscape) {

  .cd-desktop-hero-wrap {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .cd-mobile-hero-parent,
  .cd-mobile-hero-parent *,
  .cd-mobile-hero-new,
  .cd-mobile-hero-new *,
  .cd-mobile-hero-wrap,
  .cd-mobile-hero-wrap * {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}

/* Mobile vertical:
   remove totalmente o Hero desktop e mantÃ©m apenas o Hero mobile */
@media (max-width: 767px) and (orientation: portrait) {

  .cd-desktop-hero-wrap,
  .cd-desktop-hero-wrap * {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .cd-mobile-hero-parent {
    display: block !important;
    height: auto !important;
    min-height: 420px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }
}


@media (max-width: 767px) and (orientation: portrait) {

  .cd-mobile-hero-btn .elementor-button {
    min-height: 50px !important;
    padding: 0 28px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    line-height: 1 !important;
    border-radius: 999px !important;

    background: linear-gradient(
      135deg,
      #25D366 0%,
      #32E56F 100%
    ) !important;

    box-shadow:
      0 8px 20px rgba(37,211,102,.22);

    transition:
      transform .25s ease,
      box-shadow .25s ease,
      filter .25s ease;
  }

  .cd-mobile-hero-btn .elementor-button:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);

    box-shadow:
      0 12px 28px rgba(37,211,102,.30);
  }

  .cd-mobile-hero-btn .elementor-button:active {
    transform: translateY(0);
  }

  .cd-mobile-hero-btn .elementor-button-text {
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: -.01em;
  }

}

.cd-plan-card {
  display: flex !important;
  flex-direction: column !important;
}

.cd-plan-icon {
  margin-top: auto !important;
  align-self: center !important;
  text-align: center !important;
  width: 100% !important;
  overflow: visible !important;
}

.cd-plan-icon img {
  width: 120px !important;
  max-width: 120px !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  display: inline-block !important;
}

.cd-plan-label {
  margin-top: 18px !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

.cd-plan-label * {
  font-size: inherit !important;
  line-height: inherit !important;
}



.cd-plan-star-fix,
.cd-plan-star-fix *,
.cd-plan-label,
.cd-plan-label * {
  font-size: 15px !important;
  line-height: 1.2 !important;
}

.cd-plan-star-fix img,
.cd-plan-star-fix svg {
  width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  max-height: 16px !important;
  object-fit: contain !important;
}


@media (min-width: 768px) {
  .cd-mobile-hero-parent,
  .cd-mobile-hero-wrap,
  .cd-mobile-hero-new {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}


@media (max-width: 767px) and (orientation: portrait) {
  .cd-desktop-hero-wrap {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}


@media (max-width: 767px) {
  .elementor-post__card .favorite,
  .jet-listing-dynamic-post .favorite,
  .cd-favorite,
  .favorite-button {
    top: 18px !important;
    right: 18px !important;
    width: 54px !important;
    height: 54px !important;
  }
}



/* Categorias antigas removidas: .cd-category-menu / .eael-filter-gallery-control / .filterable-gallery-menu.
   Motivo: substituÃ­das pelo bloco oficial do Taxonomy Filter com Ã­cones. */


@media (max-width: 767px) {
  #scrollTopBtn {
    right: 22px !important;
    bottom: 128px !important;
    width: 48px !important;
    height: 48px !important;
    font-size: 24px !important;
  }
}


/* Regras antigas do .elementor-taxonomy-filter no mobile removidas.
   Motivo: conflitavam com o layout novo de categorias com Ã­cones. */




/*cd-hero-whatsapp-btn */

.cd-menu-hero .cd-hero-whatsapp-btn .elementor-button {

    pointer-events: auto !important;

    cursor: pointer !important;

    position: relative !important;

    z-index: 30 !important;

}

/* ==========================================================
   CARDÃPIO DIGITAL
   PÃGINA CARDÃPIO / APP
   Categorias - Taxonomy Filter com Ã­cones

   Objetivo:
   Estilizar a barra de categorias com Ã­cones Lucide acima
   dos nomes, estado ativo/hover em laranja e linha inferior
   animada, sem alterar o funcionamento do filtro.

   Escopo:
   Apenas o widget Elementor Taxonomy Filter da pÃ¡gina CardÃ¡pio.

   Estrutura:
   - Container externo: .cd-category-section
   - Widget/filtro: .elementor-taxonomy-filter
   - BotÃµes: .e-filter-item
   - IdentificaÃ§Ã£o de categoria: data-filter

   ObservaÃ§Ã£o:
   Os SVGs estÃ£o na Biblioteca de MÃ­dia e foram baixados
   com cor fixa #667085. O estado ativo/hover usa filter CSS
   para simular o laranja #E85D04.
   ========================================================== */

.cd-category-section {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.elementor-taxonomy-filter .e-filter-item {
  position: relative !important;

  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;

  min-width: 90px !important;
  min-height: 46px !important;

  padding: 8px 12px 12px !important;
  line-height: 1.15 !important;

  color: var(--cd-cor-secundaria) !important;

  transition:
    color .25s ease,
    transform .25s ease !important;
}

.elementor-taxonomy-filter .e-filter-item::before {
  content: "" !important;

  width: 30px !important;
  height: 30px !important;
  min-height: 20px !important;

  display: block !important;
  margin-bottom: 4px !important;
  transform: translateY(-2px);

  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;

  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  opacity: .9;

  transition:
    transform .25s ease,
    opacity .25s ease,
    filter .25s ease !important;
}

.elementor-taxonomy-filter .e-filter-item::after {
  content: "" !important;

  position: absolute !important;
  left: 50% !important;
  bottom: 4px !important;

  width: 0 !important;
  height: 2px !important;

  background: var(--cd-cor-principal) !important;
  border-radius: 999px !important;

  transform: translateX(-50%) !important;
  transition: width .25s ease !important;
}

.elementor-taxonomy-filter .e-filter-item:hover,
.elementor-taxonomy-filter .e-filter-item[aria-pressed="true"] {
  color: var(--cd-cor-principal) !important;
    
}


.elementor-taxonomy-filter .e-filter-item:hover::after,
.elementor-taxonomy-filter .e-filter-item[aria-pressed="true"]::after {
  width: 28px !important;
}

.elementor-taxonomy-filter .e-filter-item:hover::before,
.elementor-taxonomy-filter .e-filter-item[aria-pressed="true"]::before {
  filter:
    brightness(0)
    saturate(100%)
    invert(17%)
    sepia(19%)
    saturate(661%)
    hue-rotate(87deg)
    brightness(92%)
    contrast(91%) !important;
}

.elementor-taxonomy-filter .e-filter-item:hover,
.elementor-taxonomy-filter .e-filter-item[aria-pressed="true"] {
  color: var(--cd-cor-principal) !important;
  font-weight: 700 !important;
}

/* Ãcones por categoria */
.elementor-taxonomy-filter .e-filter-item[data-filter="__all"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/layout-list_2.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="bebidas"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/cup-soda_2.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="refeicoes"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/utensils_2.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="queijos"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/sandwich.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="congelados"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/snowflake.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="padaria-mineira"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/croissant.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="molhos-artesanais"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/utensils_2.svg") !important;
}

.elementor-taxonomy-filter .e-filter-item[data-filter="sobremesas"]::before {
  background-image: url("https://casabento.webampo.de/wp-content/uploads/2026/06/cake-slice_2.svg") !important;
}



/* ==========================================================
   CARDÁPIO DIGITAL
   Favoritos + neutralização global do All
   ========================================================== */

/* Favoritos base */
.cd-favorites-filter {
  position: relative !important;
  color: var(--cd-cor-secundaria) !important;
  font-weight: 500 !important;
  background: transparent !important;
}

/* Coração base */
.cd-favorites-filter .fav-heart {
  color: var(--cd-cor-secundaria) !important;
}

/* Favoritos ativo */
html body.cd-favorites-mode .cd-favorites-filter,
.cd-favorites-filter.is-active {
  color: var(--cd-cor-principal) !important;
  font-weight: 700 !important;
  background: transparent !important;
}

html body.cd-favorites-mode .cd-favorites-filter .fav-heart,
.cd-favorites-filter.is-active .fav-heart {
  color: var(--cd-cor-principal) !important;
}

/* Linha superior do Favoritos */
.cd-favorites-filter::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: -8px !important;
  width: 0 !important;
  height: 2px !important;
  background: var(--cd-cor-principal) !important;
  border-radius: 999px !important;
  transform: translateX(-50%) !important;
  transition: width .25s ease !important;
}

/* Linha aparece somente quando Favoritos está ativo */
html body.cd-favorites-mode .cd-favorites-filter::after,
.cd-favorites-filter.is-active::after {
  width: 28px !important;
}

/* Neutraliza o All quando Favoritos está ativo */
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"],
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"] *,
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"][aria-pressed="true"],
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"][aria-pressed="true"] * {
  color: #667085 !important;
  font-weight: 500 !important;
}



/* Remove linha ativa do All durante Favoritos */
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"]::after,
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="_all"]::after {
  width: 0 !important;
  opacity: 0 !important;
}


/* Mantém o ícone do All neutro durante Favoritos */
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"]::before,
html body.cd-favorites-mode .elementor-taxonomy-filter .e-filter-item[data-filter="__all"][aria-pressed="true"]::before {
  filter: none !important;
  opacity: .9 !important;
}


/* CARDÁPIO DIGITAL - Cor dinâmica do preço */
.cd-preco .elementor-heading-title {
    color: var(--cd-cor-principal) !important;
}

/* CARDÁPIO DIGITAL - Ícones sociais dinâmicos */

.cd-social-footer .elementor-social-icon{
    background: var(--cd-cor-principal) !important;
}




/* ==========================================================
   CASA BENTO
   Cards informativos abaixo do Hero
   Avisos Casa Bento - Loop Carousel compacto
   ========================================================== */

/* ==================================================

BACKUP — LOOP CAROUSEL DE AVISOS (CASA BENTO)

Data: 29/06/2026

Este código foi utilizado na primeira versão da seção
de avisos da Casa Bento utilizando Elementor Loop Carousel,
CPT "Avisos" e campos dinâmicos via ACF.

A implementação foi substituída por uma versão estática
com scroll horizontal no mobile, por apresentar maior
controle visual, melhor desempenho e permitir destaque
individual dos cards.

O template do Loop Carousel foi mantido salvo no Elementor
para possível reutilização futura em banners, promoções,
depoimentos ou avisos dinâmicos.

Caso seja necessário reativar esta funcionalidade,
basta restaurar o widget Loop Carousel na página e
remover os comentários deste bloco.

.cb-aviso-banner {
  width: 100% !important;
  min-height: 105px !important;
  padding: 14px 18px 13px !important;
  background: #fffdf9 !important;
  border: 1px solid rgba(150, 46, 30, 0.14) !important;
  border-top: 0 !important;
  border-radius: 0 0 20px 20px !important;
  box-shadow: 0 10px 28px rgba(35, 49, 39, 0.08) !important;
  transition: transform .28s ease, box-shadow .28s ease !important;
}

.cb-aviso-banner:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 14px 36px rgba(35, 49, 39, 0.12) !important;
}

.cb-aviso-banner .elementor-icon {
  color: #9a2f22 !important;
  fill: #9a2f22 !important;
  font-size: 26px !important;
  margin-bottom: 5px !important;
}

.cb-aviso-banner h2,
.cb-aviso-banner h3 {
  margin: 0 0 5px !important;
  font-size: 20px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  color: #0f6334 !important;
  text-align: center !important;
}

.cb-aviso-banner p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  color: #756963 !important;
  text-align: center !important;
}

@media (max-width: 767px) {
  .cb-aviso-banner {
    min-height: 96px !important;
    padding: 12px 16px 11px !important;
    border-radius: 0 0 18px 18px !important;
  }

  .cb-aviso-banner .elementor-icon {
    font-size: 23px !important;
    margin-bottom: 4px !important;
  }

  .cb-aviso-banner h2,
  .cb-aviso-banner h3 {
    font-size: 19px !important;
    margin-bottom: 4px !important;
  }

  .cb-aviso-banner p {
    font-size: 13px !important;
    line-height: 1.25 !important;
  }

  .elementor-widget-loop-carousel .swiper-slide {
    width: 86% !important;
  }
}

.cb-avisos-loop {
  margin-top: -1px !important;
}
================================================== */


/* ==========================================================
   CASA BENTO
   Cards informativos Estáticos abaixo do Hero 
   ========================================================== */
   
   
   .cb-avisos-static {
  display: flex !important;
  gap: 14px !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  padding: 0 8px 12px !important;
  margin-top: -1px !important;
  scrollbar-width: none !important;
}

.cb-avisos-static::-webkit-scrollbar {
  display: none !important;
}

.cb-aviso-card {
  flex: 1 1 0 !important;
  min-height: 105px !important;
  padding: 14px 18px 13px !important;
  background: #fffdf9 !important;
  border: 1px solid rgba(150, 46, 30, 0.14) !important;
  border-top: 0 !important;
  border-radius: 0 0 20px 20px !important;
  box-shadow: 0 10px 28px rgba(35, 49, 39, 0.08) !important;
  text-align: center !important;
  scroll-snap-align: start !important;
}

.cb-aviso-destaque {
  background: #0f6334 !important;
  border-color: #0f6334 !important;
  box-shadow: 0 12px 32px rgba(15, 99, 52, 0.22) !important;
}

.cb-aviso-destaque h2,
.cb-aviso-destaque h3,
.cb-aviso-destaque p,
.cb-aviso-destaque .elementor-icon {
  color: #fffaf4 !important;
  fill: #fffaf4 !important;
}

@media (max-width: 767px) {
  .cb-aviso-card {
    flex: 0 0 86% !important;
  }
}

/* Avisos Casa Bento - Efeitos e Sombras */

.cb-aviso-card {
  position: relative !important;
  box-shadow:
    0 10px 24px rgba(35, 49, 39, 0.08),
    0 24px 55px rgba(35, 49, 39, 0.06) !important;
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease !important;
  will-change: transform !important;
}

.cb-aviso-card:hover {
  transform: translateY(-6px) !important;
  box-shadow:
    0 16px 34px rgba(35, 49, 39, 0.12),
    0 32px 70px rgba(35, 49, 39, 0.10) !important;
  border-color: rgba(150, 46, 30, 0.22) !important;
}

.cb-aviso-destaque {
  box-shadow:
    0 14px 34px rgba(15, 99, 52, 0.22),
    0 32px 70px rgba(15, 99, 52, 0.14) !important;
}

.cb-aviso-destaque:hover {
  transform: translateY(-6px) !important;
  box-shadow:
    0 18px 40px rgba(15, 99, 52, 0.28),
    0 38px 80px rgba(15, 99, 52, 0.18) !important;
}/* End custom CSS */