.elementor-kit-1417{--e-global-color-primary:#003C54;--e-global-color-secondary:#54D0DC;--e-global-color-text:#5B5B5B;--e-global-color-accent:#E33B44;--e-global-color-9ab0624:#FFDF2B;--e-global-color-1e46a60:#00894C;--e-global-color-853369f:#0046A6;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Montserrat";--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Montserrat";--e-global-typography-accent-font-weight:500;font-family:"Montserrat Variable Font", Sans-serif;font-size:1rem;line-height:1.5rem;overscroll-behavior:auto;}.elementor-kit-1417 e-page-transition{background-color:#FFBC7D;}.elementor-kit-1417 a{font-family:"Montserrat Variable Font", Sans-serif;}.elementor-kit-1417 h1{font-family:"Montserrat Variable Font", Sans-serif;}.elementor-kit-1417 h2{font-family:"Montserrat", Sans-serif;}.elementor-kit-1417 h3{font-family:"Montserrat Variable Font", Sans-serif;}.elementor-kit-1417 h4{font-family:"Montserrat Variable Font", Sans-serif;}.elementor-kit-1417 h5{font-family:"Montserrat", Sans-serif;}.elementor-kit-1417 h6{font-family:"Montserrat Variable Font", Sans-serif;}.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 *//* =========================
   0) ACESSIBILIDADE / RESET
   ========================= */
@media (prefers-reduced-motion: reduce){
  .cards-gradiente .card-hover-effect.ap5 *{
    transition-duration:120ms!important;
    animation:none!important;
  }
}
/* Não deixe wrappers cortarem a aba/hover */
.cards-gradiente,
.cards-gradiente .elementor-container,
.cards-gradiente .elementor-column,
.cards-gradiente .elementor-widget-wrap,
.cards-gradiente .elementor-widget-container{ overflow:visible!important; }

/* =========================
   1) VARS PADRÃO DO CARD
   ========================= */
.cards-gradiente .card-hover-effect.ap5{
  --b:2px; --r:20px; --p:30px;
  --tab:70px; --tab-offset:-20px; --lift:10px;
  --dur:550ms; --ease:cubic-bezier(.2,.7,.2,1);
  --bleed:2px; --inner-r:calc(var(--r) - var(--b));
  --g1:#54d0dc; --g2:#003c54; --g3:#e33b44;

  position:relative; isolation:isolate; border-radius:var(--r);
  padding:0!important; overflow:visible;
  transition:transform .26s var(--ease), box-shadow .26s var(--ease);
  will-change:transform;
}
.cards-gradiente .card-hover-effect.ap5:hover,
.cards-gradiente .card-hover-effect.ap5:focus-within{
  transform:translateY(calc(-1*var(--lift)));
  box-shadow:0 12px 30px rgba(0,0,0,.15);
}

/* =========================
   2) MOLDURA / GRADIENTE
   ========================= */
.cards-gradiente .card-hover-effect.ap5 .degrade-1{
  position:relative; overflow:visible; padding:0; border-radius:var(--r);
  background-image:linear-gradient(90deg,var(--g1) 0%,var(--g2) 50%,var(--g3) 100%);
  background-size:200% 200%; background-position:50% 0%;
  transition:background-position var(--dur) var(--ease);
  contain:paint;
}
/* Anel degradê colado via máscara (fallback Safari) */
.cards-gradiente .card-hover-effect.ap5 .degrade-1::before{
  content:""; position:absolute; inset:0; z-index:3; border-radius:var(--r);
  background:inherit; background-position:inherit; background-size:inherit;
  padding:var(--b);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}

/* =========================
   3) CONTEÚDO BRANCO
   ========================= */
.cards-gradiente .card-hover-effect.ap5 .degrade-1 .bg-branco{
  position:relative; z-index:2; background:#fff;
  border-radius:calc(var(--r) - var(--b)); padding:var(--p);
  width:100%; height:100%;
  display:flex; flex-direction:column; gap:16px; align-items:center;
}

/* =========================
   4) ABA EXTERNA + CTA
   ========================= */
.cards-gradiente .card-hover-effect.ap5 .degrade-1::after{
  content:""; position:absolute; z-index:1;
  left:calc(var(--b) - var(--bleed)); right:calc(var(--b) - var(--bleed));
  top:calc(100% + var(--tab-offset) - var(--bleed));
  height:calc(var(--tab) + var(--bleed)); border-radius:0 0 var(--inner-r) var(--inner-r);
  background:inherit; background-position:inherit; background-size:inherit;
  transform:translateY(-100%); transition:transform var(--dur) var(--ease);
  filter:drop-shadow(0 12px 22px rgba(0,0,0,.20)); will-change:transform;
}
.cards-gradiente .card-hover-effect.ap5:hover .degrade-1::after,
.cards-gradiente .card-hover-effect.ap5:focus-within .degrade-1::after{ transform:translateY(0); }
.cards-gradiente .card-hover-effect.ap5:hover .degrade-1,
.cards-gradiente .card-hover-effect.ap5:focus-within .degrade-1{ background-position:50% 100%; }

/* CTA na área visível da aba (suporta offset negativo) */
.cards-gradiente .card-hover-effect.ap5{ --cta-top:calc(100% + max(0px,var(--tab-offset))); --cta-h:calc(var(--tab) + min(0px,var(--tab-offset))); --cta-h-safe:max(0px,var(--cta-h)); }
.cards-gradiente .card-hover-effect.ap5 .degrade-1 .cta-comprar{
  position:absolute; z-index:4; left:var(--b); right:var(--b);
  top:var(--cta-top); height:var(--cta-h-safe);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .24s var(--ease) .12s;
}
.cards-gradiente .card-hover-effect.ap5:hover .degrade-1 .cta-comprar,
.cards-gradiente .card-hover-effect.ap5:focus-within .degrade-1 .cta-comprar{ opacity:1; pointer-events:auto; }
.cards-gradiente .card-hover-effect.ap5 .degrade-1 .cta-comprar .elementor-button,
.cards-gradiente .card-hover-effect.ap5 .degrade-1 .cta-comprar a.elementor-button{
  width:100%; justify-content:center; background:none!important; border:0!important; box-shadow:none!important;
  color:#fff; font-weight:600; line-height:1.2; padding:0; text-decoration:none;
}

/* Valores padrão (podem ir junto das suas VARS do card) */
.cards-gradiente .card-hover-effect.ap5{
  --title-shift-x: 80px;   /* ← / →  (antes você usava --title-shift) */
  --title-shift-y: -10px;   /* ↑ / ↓  (NOVO) */
}


/* =========================
   5) TICKET (opcional)
   ========================= */
.cards-gradiente .card-hover-effect.ap5 .bg-branco .ticket{
  position:relative; overflow:hidden; min-height:120px;
  display:grid; align-items:center; justify-items:start;
  padding-inline:var(--ticket-pad-x,0px);
}
.cards-gradiente .card-hover-effect.ap5 .bg-branco .ticket .ticket-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; pointer-events:none;
}
.cards-gradiente .card-hover-effect.ap5 .bg-branco .ticket .ticket-title{
  margin:0; z-index:1; justify-self:start; transform: translate(var(--title-shift-x), var(--title-shift-y));
}

/* =========================
   6) VARIANTES (3 CARDS)
   ========================= */
.cards-gradiente .card-hover-effect.ap5.card--1{ --g1:#54d0dc; --g2:#003c54; --g3:#e33b44; }
.cards-gradiente .card-hover-effect.ap5.card--2{ --g1:#54d0dc; --g2:#003c54; --g3:#003c54; }
.cards-gradiente .card-hover-effect.ap5.card--3{ --g1:#54d0dc; --g2:#ffdf2b; --g3:#e33b44; }

/* =========================
   7) RESPONSIVO / TOUCH
   ========================= */
@media (max-width:1024px){ .cards-gradiente .card-hover-effect.ap5{ --tab:56px; } }
@media (max-width: 767px){ .cards-gradiente .card-hover-effect.ap5{ --tab:52px; } }
.cards-gradiente .card-hover-effect.ap5:active .degrade-1::after{ transform:translateY(0); }
.cards-gradiente .card-hover-effect.ap5:active .degrade-1{ background-position:50% 100%; }
.cards-gradiente .card-hover-effect.ap5:active .degrade-1 .cta-comprar{ opacity:1; pointer-events:auto; }

/* HOTFIX: permitir que a aba pinte fora do card */
.cards-gradiente .card-hover-effect.ap5 .degrade-1{ contain:none!important; overflow:visible; }

/* GPU no Safari/iOS */
.cards-gradiente .card-hover-effect.ap5 .degrade-1::after{ will-change:transform; transform:translate3d(0,-100%,0); }
.cards-gradiente .card-hover-effect.ap5:hover .degrade-1::after,
.cards-gradiente .card-hover-effect.ap5:focus-within .degrade-1::after{ transform:translate3d(0,0,0); }/* End custom CSS */