/**
 * MobiLux Elementor promotional banners.
 * Single / double / quad responsive commercial banner system.
 */
.mobilux-banner-grid{
  width:100%;
  margin-inline:auto;
  --mobilux-banner-lift:6px;
  --mobilux-banner-zoom:1.035;
}
.mobilux-banner-grid__items{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:stretch;
  min-width:0;
}
.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:repeat(2,minmax(0,1fr));}
.mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(4,minmax(0,1fr));}
.mobilux-banner-grid__card{
  position:relative;
  display:block;
  min-width:0;
  isolation:isolate;
  overflow:hidden;
  background:#f7f4ff;
  color:inherit;
  text-decoration:none;
  border:1px solid #ede9ff;
  border-radius:24px;
  box-shadow:0 14px 42px rgba(31,30,57,.075),0 4px 14px rgba(99,71,217,.04);
  transform:translateZ(0);
  transition:transform .36s cubic-bezier(.2,.75,.25,1),box-shadow .36s ease,border-color .36s ease;
}
/* Adaptive mode follows the real source ratio so designed banner artwork is never cropped. */
.mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-natural.mobilux-banner-grid--single .mobilux-banner-grid__card,
.mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-natural.mobilux-banner-grid--double .mobilux-banner-grid__card{
  height:auto;
  min-height:0;
  aspect-ratio:var(--mobilux-banner-desktop-ratio,8/1);
}
/* Explicit backwards-compatible option for layouts that intentionally relied on the old crop. */
.mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-legacy150.mobilux-banner-grid--single .mobilux-banner-grid__card,
.mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-legacy150.mobilux-banner-grid--double .mobilux-banner-grid__card{height:150px;aspect-ratio:auto;}
.mobilux-banner-grid--size-adaptive.mobilux-banner-grid--quad .mobilux-banner-grid__card{aspect-ratio:1/1;}
.mobilux-banner-grid__picture{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  overflow:hidden;
}
.mobilux-banner-grid__image,
.mobilux-banner-grid__picture .mobilux-banner-grid__image{
  position:absolute;
  inset:0;
  width:100%;
  max-width:none;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  z-index:0;
  transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .4s ease;
}
.mobilux-banner-grid__placeholder{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#f6f3ff,#eef3ff);
  color:#7057ff;
  font-size:clamp(28px,4vw,58px);
  z-index:0;
}
.mobilux-banner-grid__overlay{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(18,20,40,.62) 0%,rgba(18,20,40,.28) 52%,rgba(18,20,40,0) 100%);
}
.mobilux-banner-grid__content{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  pointer-events:none;
}
.mobilux-banner-grid__content-inner{
  display:flex;
  flex-direction:column;
  gap:8px;
  width:max-content;
  pointer-events:auto;
}
.mobilux-banner-grid__content--top-start{align-items:flex-start;justify-content:flex-start;}
.mobilux-banner-grid__content--top-center{align-items:flex-start;justify-content:center;}
.mobilux-banner-grid__content--top-end{align-items:flex-start;justify-content:flex-end;}
.mobilux-banner-grid__content--center-start{align-items:center;justify-content:flex-start;}
.mobilux-banner-grid__content--center-center{align-items:center;justify-content:center;}
.mobilux-banner-grid__content--center-end{align-items:center;justify-content:flex-end;}
.mobilux-banner-grid__content--bottom-start{align-items:flex-end;justify-content:flex-start;}
.mobilux-banner-grid__content--bottom-center{align-items:flex-end;justify-content:center;}
.mobilux-banner-grid__content--bottom-end{align-items:flex-end;justify-content:flex-end;}
.mobilux-banner-grid__badge{
  display:inline-flex;
  width:max-content;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  color:#5b47e8;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.5);
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  box-shadow:0 6px 18px rgba(17,24,39,.08);
}
.mobilux-banner-grid__title{
  display:block;
  color:#fff;
  font-size:clamp(20px,2.2vw,36px);
  font-weight:900;
  line-height:1.35;
  text-wrap:balance;
}
.mobilux-banner-grid--quad .mobilux-banner-grid__title{font-size:clamp(17px,1.65vw,26px);}
.mobilux-banner-grid__description{
  display:block;
  color:rgba(255,255,255,.88);
  font-size:14px;
  line-height:1.9;
}
.mobilux-banner-grid__button{
  display:inline-flex;
  width:max-content;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:4px;
  padding:10px 16px;
  border:0;
  border-radius:12px;
  color:#fff;
  background:#6b4eff;
  text-decoration:none;
  font-size:13px;
  font-weight:800;
  line-height:1;
  box-shadow:0 9px 22px rgba(71,51,200,.22);
  transition:transform .25s ease,background .25s ease,color .25s ease,box-shadow .25s ease;
}
.mobilux-banner-grid__button:hover{
  color:#fff;
  background:#4f36e6;
  transform:translateY(-1px);
  box-shadow:0 12px 26px rgba(71,51,200,.3);
}
.mobilux-banner-grid__button-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1;}
.mobilux-banner-grid__button-icon svg{width:1em;height:1em;fill:currentColor;}
.mobilux-banner-grid__card::after{
  content:"";
  position:absolute;
  inset:-10%;
  z-index:4;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.32) 46%,transparent 67%);
  transform:translateX(135%) skewX(-12deg);
}
@media (hover:hover) and (pointer:fine){
  .mobilux-banner-grid--hover-lift .mobilux-banner-grid__card:hover,
  .mobilux-banner-grid--hover-lift-zoom .mobilux-banner-grid__card:hover,
  .mobilux-banner-grid--hover-lift-zoom-shine .mobilux-banner-grid__card:hover{
    transform:translateY(calc(-1 * var(--mobilux-banner-lift)));
    box-shadow:0 24px 58px rgba(84,61,190,.15),0 10px 24px rgba(17,24,39,.08);
  }
  .mobilux-banner-grid--hover-zoom .mobilux-banner-grid__card:hover .mobilux-banner-grid__image,
  .mobilux-banner-grid--hover-lift-zoom .mobilux-banner-grid__card:hover .mobilux-banner-grid__image,
  .mobilux-banner-grid--hover-lift-zoom-shine .mobilux-banner-grid__card:hover .mobilux-banner-grid__image{
    transform:scale(var(--mobilux-banner-zoom));
  }
  .mobilux-banner-grid--hover-shine .mobilux-banner-grid__card:hover::after,
  .mobilux-banner-grid--hover-lift-zoom-shine .mobilux-banner-grid__card:hover::after{
    opacity:1;
    animation:mobilux-banner-shine .8s ease both;
  }
}
@keyframes mobilux-banner-shine{
  from{transform:translateX(135%) skewX(-12deg);}
  to{transform:translateX(-135%) skewX(-12deg);}
}
@media (prefers-reduced-motion:reduce){
  .mobilux-banner-grid__card,
  .mobilux-banner-grid__image,
  .mobilux-banner-grid__button{transition:none!important;animation:none!important;}
  .mobilux-banner-grid__card::after{display:none!important;}
}
@media (max-width:1024px){
  .mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mobilux-banner-grid__card{border-radius:22px;}
}
@media (max-width:767px){
  .mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:minmax(0,1fr);}
  .mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mobilux-banner-grid__card{border-radius:16px;}
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-natural.mobilux-banner-grid--single .mobilux-banner-grid__card,
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-natural.mobilux-banner-grid--double .mobilux-banner-grid__card{
    height:auto;
    min-height:0;
    aspect-ratio:var(--mobilux-banner-mobile-ratio,var(--mobilux-banner-desktop-ratio,8/1));
  }
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-legacy150.mobilux-banner-grid--single .mobilux-banner-grid__card,
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-legacy150.mobilux-banner-grid--double .mobilux-banner-grid__card{height:150px;aspect-ratio:auto;}
  .mobilux-banner-grid__card--hide-mobile{display:none!important;}
  .mobilux-banner-grid__content-inner{gap:6px;}
  .mobilux-banner-grid__description{font-size:12px;line-height:1.75;}
  .mobilux-banner-grid__button{font-size:12px;padding:8px 12px;}
  .mobilux-banner-grid__badge{font-size:10px;padding:5px 8px;}
}

/* Reflow also follows the actual Elementor column, not only the viewport. */
@container mobilux-widget (max-width:1024px){
  .mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mobilux-banner-grid__card{border-radius:22px;}
}
@container mobilux-widget (max-width:767px){
  .mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:minmax(0,1fr);}
  .mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mobilux-banner-grid__card{border-radius:16px;}
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-natural.mobilux-banner-grid--single .mobilux-banner-grid__card,
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-natural.mobilux-banner-grid--double .mobilux-banner-grid__card{
    height:auto;
    min-height:0;
    aspect-ratio:var(--mobilux-banner-mobile-ratio,var(--mobilux-banner-desktop-ratio,8/1));
  }
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-legacy150.mobilux-banner-grid--single .mobilux-banner-grid__card,
  .mobilux-banner-grid--size-adaptive.mobilux-banner-grid--adaptive-legacy150.mobilux-banner-grid--double .mobilux-banner-grid__card{height:150px;aspect-ratio:auto;}
  .mobilux-banner-grid__card--hide-mobile{display:none!important;}
  .mobilux-banner-grid__content-inner{gap:6px;}
  .mobilux-banner-grid__description{font-size:12px;line-height:1.75;}
  .mobilux-banner-grid__button{font-size:12px;padding:8px 12px;}
  .mobilux-banner-grid__badge{font-size:10px;padding:5px 8px;}
}

/* v1.0.44: component-specific responsive layout. */
.mobilux-banner-grid__card,.mobilux-banner-grid__content{min-width:0;max-width:100%}

@media(max-width:767px){.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:minmax(0,1fr)}
.mobilux-banner-grid__content{max-width:100%;padding:16px}
.mobilux-banner-grid__title{font-size:clamp(18px,5vw,26px);line-height:1.6}
}
@container mobilux-widget (max-width:767px){.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:minmax(0,1fr)}
.mobilux-banner-grid__content{max-width:100%;padding:16px}
.mobilux-banner-grid__title{font-size:clamp(18px,5vw,26px);line-height:1.6}
}

/* v1.0.44: component-specific responsive layout. */
.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:repeat(var(--ml-banner-grid-double-columns,2),minmax(0,1fr))}
@media(max-width:1024px){.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-double-columns,2),2),minmax(0,1fr))}}
@container mobilux-widget (max-width:1024px){.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-double-columns,2),2),minmax(0,1fr))}}
@media(max-width:767px){.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-double-columns,1),2),minmax(0,1fr))}}
@container mobilux-widget (max-width:767px){.mobilux-banner-grid--double .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-double-columns,1),2),minmax(0,1fr))}}

/* Responsive refinements verified against the widget templates. */
.mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(var(--ml-banner-grid-quad-columns,4),minmax(0,1fr))}
@media(max-width:1024px){.mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-quad-columns,2),2),minmax(0,1fr))}}
@container mobilux-widget (max-width:1024px){.mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-quad-columns,2),2),minmax(0,1fr))}}
@media(max-width:767px){.mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-quad-columns,2),2),minmax(0,1fr))}}
@container mobilux-widget (max-width:767px){.mobilux-banner-grid--quad .mobilux-banner-grid__items{grid-template-columns:repeat(min(var(--ml-banner-grid-quad-columns,2),2),minmax(0,1fr))}}
