#fw-section-custom-html-2beb6ea3-baf8-46e8-8820-7fe16c80e88b {

h4 {
  color: #2266ff;
}

img {
  transition: transform 0.3s ease-in-out;
}

img:hover {
  transform: scale(1.05);
}
}

#fw-section-custom-html-7c58e284-1248-4e46-b348-20e43f68ac71 {

#fw-section-custom-html-7c58e284-1248-4e46-b348-20e43f68ac71 {
    padding: 0 !important;
}

.custom-html--fw-section-custom-html-7c58e284-1248-4e46-b348-20e43f68ac71 {
    padding: 0 !important;
}

.banner-container {
  padding-top: 20px;
  position: relative;
  width: 100%;
  max-width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
  overflow: hidden;
}

.banner {
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  object-fit: cover;
  max-height: 75vh; /* Prevents it from taking up too much space */
  border-radius: 10px;
  display: block;
}

.banner-overlay {
  position: absolute;
  background: linear-gradient(0deg,rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 50%);
  width: calc(100% - 40px);
  height: 100%;
  object-fit: cover;
  max-height: 75vh; /* Prevents it from taking up too much space */
  border-radius: 10px;
}

.banner-text {
  position: absolute;
  bottom: 0;
  padding: 20px;
}

.banner-header, .banner-desc {
  color: #ffffff;
  position: static; /* Let them flow normally */
  margin: 0; /* Optional: Remove default spacing if needed */
}

/* Adjust aspect ratio on smaller screens */
@media (max-aspect-ratio: 3 / 4) {
  .banner {
    aspect-ratio: 3 / 4;
  }
}
}
#fw-section-announcement-bar-042cad1b-8c15-4d03-ba3b-19a22ded0501 {

.announcement-bar {
margin-top: 20px;
}
}
#fw-section-text-carousel-7bfaef21-298d-4ea6-8c66-8ccb24ece06c {
--color-primary: #ccddff;
--color-primary-rgb: 204, 221, 255;
--color-background: #ccddff;
--color-background-rgb: 204, 221, 255;
--color-on-background: #151520;
--color-on-background-rgb: 21, 21, 32;
--color-on-primary: #151520;
--color-on-primary-rgb: 21, 21, 32;
--color-product-image-background: #acccff;
--color-background-brightness: 220;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #ccddff;
--primary-btn-text: #151520;
--primary-btn-border-color: #ccddff;
--secondary-btn-bg: transparent;
--secondary-btn-text: #151520;
--secondary-btn-border-color: #151520;

}

#fw-section-text-carousel-c883dbcd-cfa4-4bdd-b732-3a1c2b8b7dad {
--color-primary: #ccddff;
--color-primary-rgb: 204, 221, 255;
--color-background: #ccddff;
--color-background-rgb: 204, 221, 255;
--color-on-background: #151520;
--color-on-background-rgb: 21, 21, 32;
--color-on-primary: #151520;
--color-on-primary-rgb: 21, 21, 32;
--color-product-image-background: #acccff;
--color-background-brightness: 220;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #ccddff;
--primary-btn-text: #151520;
--primary-btn-border-color: #ccddff;
--secondary-btn-bg: transparent;
--secondary-btn-text: #151520;
--secondary-btn-border-color: #151520;

}
#fw-section-featured-collection-caa4b48f-bc35-4391-9bb7-96da941f0f6a {

.tile__heading {
    font-size: calc(var(--font-body-scale) * 1.2rem);
    font-weight: 700;
}
}

#fw-section-text-carousel-ac509fd4-2163-4abb-9224-728f3c8d14ff {
--color-primary: #ccddff;
--color-primary-rgb: 204, 221, 255;
--color-background: #ccddff;
--color-background-rgb: 204, 221, 255;
--color-on-background: #151520;
--color-on-background-rgb: 21, 21, 32;
--color-on-primary: #151520;
--color-on-primary-rgb: 21, 21, 32;
--color-product-image-background: #acccff;
--color-background-brightness: 220;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #ccddff;
--primary-btn-text: #151520;
--primary-btn-border-color: #ccddff;
--secondary-btn-bg: transparent;
--secondary-btn-text: #151520;
--secondary-btn-border-color: #151520;

}
.index #fw-section-header {
--color-primary: #4b83ff;
--color-primary-rgb: 75, 131, 255;
--color-background: #1d2434;
--color-background-rgb: 29, 36, 52;
--color-on-background: #ffffff;
--color-on-background-rgb: 255, 255, 255;
--color-on-primary: #ffffff;
--color-on-primary-rgb: 255, 255, 255;
--color-product-image-background: #acccff;
--color-background-brightness: 36;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #1d2434;
--primary-btn-text: #ffffff;
--primary-btn-border-color: #4b83ff;
--secondary-btn-bg: transparent;
--secondary-btn-text: #ffffff;
--secondary-btn-border-color: #ffffff;
.header {
  padding-left: 2em;
  padding-right: 2em;
  padding-top: 20px;
  font-weight: 700;
}
}