.elementor-193 .elementor-element.elementor-element-6d4b4c5:not(.elementor-motion-effects-element-type-background), .elementor-193 .elementor-element.elementor-element-6d4b4c5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-secondary );}.elementor-193 .elementor-element.elementor-element-6d4b4c5{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-193 .elementor-element.elementor-element-6d4b4c5 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );color:var( --e-global-color-primary );}.elementor-193 .elementor-element.elementor-element-c4daebf.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-193 .elementor-element.elementor-element-c4daebf .elementor-heading-title{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );color:#000000;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-193 .elementor-element.elementor-element-9015e99 .elementor-button{background-color:var( --e-global-color-secondary );font-family:"Poppins", Sans-serif;font-size:16px;font-weight:500;text-transform:uppercase;line-height:1.3em;fill:var( --e-global-color-text );color:var( --e-global-color-text );transition-duration:0.3s;border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-text );border-radius:0px 0px 0px 0px;padding:12px 40px 12px 40px;}.elementor-193 .elementor-element.elementor-element-9015e99 .elementor-button:hover, .elementor-193 .elementor-element.elementor-element-9015e99 .elementor-button:focus{background-color:var( --e-global-color-text );color:var( --e-global-color-accent );border-color:var( --e-global-color-text );}.elementor-193 .elementor-element.elementor-element-9015e99.xpro-widget-bg-overlay:before{transition:background 0.3s;}.elementor-193 .elementor-element.elementor-element-9015e99 .elementor-button:hover svg, .elementor-193 .elementor-element.elementor-element-9015e99 .elementor-button:focus svg{fill:var( --e-global-color-accent );}.elementor-193 .elementor-element.elementor-element-d0f3ceb.xpro-widget-bg-overlay:before{transition:background 0.3s;}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-193 .elementor-element.elementor-element-c4daebf .elementor-heading-title{line-height:var( --e-global-typography-secondary-line-height );}}@media(max-width:767px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-193 .elementor-element.elementor-element-c4daebf .elementor-heading-title{line-height:var( --e-global-typography-secondary-line-height );}}/* Start custom CSS for html, class: .elementor-element-d0f3ceb *//* Container section */
.banner-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 blocks per row */
  grid-template-rows: repeat(2, 1fr);   /* 2 rows total */
  height: 100vh; /* adjust height of hero */
  width: 100%;
  overflow: hidden;
}

/* Individual blocks */
.banner-grid::before,
.banner-grid::after,
.banner-grid div {
  content: '';
}

/* Generate 8 blocks */
.banner-grid > div {
  background: #e5e5e5; /* light grey */
  transition: background 0.6s ease, transform 0.4s ease;
}

/* On hover – subtle animated bg colors */
.banner-grid > div:hover {
  background: linear-gradient(135deg, #ffdee9, #b5fffc);
  transform: scale(1.05);
}

/* Optional: add variety for each block */
.banner-grid > div:nth-child(2):hover {
  background: linear-gradient(135deg, #f6d365, #fda085);
}
.banner-grid > div:nth-child(3):hover {
  background: linear-gradient(135deg, #cfd9df, #e2ebf0);
}
.banner-grid > div:nth-child(4):hover {
  background: linear-gradient(135deg, #84fab0, #8fd3f4);
}
.banner-grid > div:nth-child(5):hover {
  background: linear-gradient(135deg, #a1c4fd, #c2e9fb);
}
.banner-grid > div:nth-child(6):hover {
  background: linear-gradient(135deg, #ffecd2, #fcb69f);
}
.banner-grid > div:nth-child(7):hover {
  background: linear-gradient(135deg, #d4fc79, #96e6a1);
}
.banner-grid > div:nth-child(8):hover {
  background: linear-gradient(135deg, #fccb90, #d57eeb);
}/* End custom CSS */