@charset "UTF-8";
.extra-bold {
  font-weight: 800;
}

.bold {
  font-weight: 700;
}

.semi-bold {
  font-weight: 600;
}

.medium {
  font-weight: 500;
}

.regular {
  font-weight: 400;
}

.light {
  font-weight: 300;
}

.fs15 {
  font-size: 0.938rem;
}

.fs14 {
  font-size: 0.875rem;
}

.fs18 {
  font-size: 1.125rem;
}

.fs26 {
  font-size: 1.625rem;
}

.black {
  color: 900;
}

.blue {
  color: #3A83FF;
}

.orange {
  color: #F09662;
}

.secondary-text {
  color: #898989;
}

.secondary-black {
  color: #3E3E3E;
}

.slash-grey {
  color: #A1A0A0;
}

.text-grey {
  color: #535353;
}

.text-light-grey {
  color: #7C7C7C;
}

.underline {
  text-decoration: underline;
}

html {
  font-size: 16px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none;
  align-content: flex-start;
}

html {
  scroll-behavior: smooth;
}

::-webkit-scrollbar {
  width: 18px;
}

.hidden {
  display: none;
}

/* Track */
::-webkit-scrollbar-track {
  border-radius: 0;
  background: #ffffff;
  border-left: 1px #FFD7BC solid;
  border-top: 1px #FFD7BC solid;
}

::-webkit-scrollbar-thumb {
  cursor: pointer;
  background-color: #FFD7BC;
  transition: ease-out 0.3s;
  border: 4px solid transparent;
  background-clip: content-box;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background-color: #ffc7a2;
  transition: ease-out 0.3s;
  border: 4px solid transparent;
  background-clip: content-box;
}

html {
  overflow-x: hidden;
}

input:-internal-autofill-selected {
  appearance: menulist-button;
  background-image: none !important;
  background-color: rgba(0, 0, 0, 0) !important;
}

* {
  font-family: "Satoshi", sans-serif;
}

.quiche {
  font-family: "Quiche Sans", sans-serif;
}

@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Black Italic.otf") format("opentype");
  font-weight: 900;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Bold Italic.otf") format("opentype");
  font-weight: 700;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans ExtraBold Italic.otf") format("opentype");
  font-weight: 800;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans ExtraBold.otf") format("opentype");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Italic.otf") format("opentype");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Light Italic.otf") format("opentype");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Medium Italic.otf") format("opentype");
  font-weight: 500;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Thin Italic.otf") format("opentype");
  font-weight: 200;
  font-style: italic;
}
@font-face {
  font-family: "Quiche Sans";
  src: url("./assets/font/Quiche Sans Thin.otf") format("opentype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-BlackItalic.otf") format("opentype");
  font-weight: 900;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-BoldItalic.otf") format("opentype");
  font-weight: 700;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-Italic.otf") format("opentype");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-LightItalic.otf") format("opentype");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-MediumItalic.otf") format("opentype");
  font-weight: 500;
  font-style: italic;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Satoshi";
  src: url("./assets/font/Satoshi-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
.mobile {
  display: none !important;
}

@media only screen and (max-width: 1920px) {
  html {
    font-size: 16px;
  }
}
@media only screen and (max-width: 1820px) {
  html {
    font-size: 15px;
  }
}
@media only screen and (max-width: 1720px) {
  html {
    font-size: 14px;
  }
}
@media only screen and (max-width: 1620px) {
  html {
    font-size: 13px;
  }
}
@media only screen and (max-width: 1520px) {
  html {
    font-size: 12px;
  }
}
@media only screen and (max-width: 1420px) {
  html {
    font-size: 12px;
  }
}
@media only screen and (max-width: 1320px) {
  html {
    font-size: 11px;
  }
}
@media only screen and (max-width: 1220px) {
  html {
    font-size: 10px;
  }
}
@media only screen and (max-width: 1120px) {
  html {
    font-size: 9.5px;
  }
}
@media only screen and (max-width: 1020px) {
  html {
    font-size: 13px;
  }
  .desktop {
    display: none !important;
  }
  .mobile {
    display: flex !important;
  }
}
@media only screen and (max-width: 380px) {
  html {
    font-size: 12px;
  }
}
.loading {
  height: 100vh;
  width: 100%;
  background-color: #18072F;
  position: fixed;
  top: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  animation: fadeOut 0.2s ease-in 1.75s forwards;
}
.loading .center {
  position: relative;
  display: inline-block;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.loading .center .square {
  width: 1.4rem;
  height: 1.4rem;
  transform: rotate(45deg);
  background-color: #F09662;
  position: absolute;
  top: -0.6rem;
}
.loading .center h6 {
  font-size: 3.75rem;
  text-align: center;
  font-weight: 400;
  color: rgb(255, 255, 255);
  position: absolute;
  z-index: 1000;
  font-family: "Quiche Sans", Arial, sans-serif;
}
.loading .center .butterfly {
  position: absolute;
  transform-origin: center;
  animation: moveInCircle 1.6s ease-in-out forwards;
  animation-delay: -0.05s;
}
.loading .center .circle {
  stroke-dasharray: 376.99;
  /* Circumference of the circle (2πr), r=60 */
  stroke-dashoffset: 376.99;
  /* Start with the stroke hidden (fully undrawn) */
  transform: rotate(-90deg) scaleY(-1);
  /* Rotate to start at 12 o'clock and flip horizontally */
  transform-origin: 50% 50%;
  /* Ensure rotation is centered on the circle */
  animation: draw 1.6s ease-in-out forwards;
}
.loading .bottom {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 3.156rem;
  opacity: 1 !important;
}
.loading .bottom .copyright {
  color: rgba(254, 248, 243, 0.5);
  font-weight: 500;
}
.loading .bottom .loading-bar {
  height: 0.5rem;
  width: 100%;
  background: linear-gradient(to right, rgb(240, 150, 98) 50%, rgba(254, 248, 243, 0.25) 50%);
  background-size: 200% 100%;
  background-position: 100% 0;
  animation: loadColor 1.6s ease-in-out forwards;
}

@keyframes loadColor {
  from {
    background-position: right;
  }
  to {
    background-position: left;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  99% {
    opacity: 0;
  }
  100% {
    visibility: hidden;
  }
}
@keyframes draw {
  0% {
    stroke-dashoffset: 376.99;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes moveInCircle {
  0% {
    transform: rotate(270deg) translate(12.813rem, 0rem) rotate(-270deg);
  }
  15% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    transform: rotate(-90deg) translate(12.813rem, 0rem) rotate(90deg);
    opacity: 0;
    /* Fade out to fully transparent at the end */
  }
}
.logo {
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-size: 2.3rem;
  text-transform: uppercase;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 500;
  letter-spacing: 0.32rem;
}

.link {
  color: #18072F;
  transition: ease-out 0.2s;
  font-family: "Quiche Sans", sans-serif;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  cursor: pointer;
  font-weight: 400;
}
.link svg {
  transition: ease-out 0.2s;
}
.link:hover {
  opacity: 0.5;
}
.link:hover svg {
  opacity: 1 !important;
  transform: translateX(0.125rem) translateY(-0.188rem);
}
.link.lang:hover {
  opacity: 1;
  text-decoration: underline;
}
.link {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.938rem;
}

.arrow-link {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.125rem;
  text-decoration: underline;
  color: #FFFFFF;
  font-size: 1.563rem;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  cursor: pointer;
  transition: ease-out 0.2s;
  position: relative;
  z-index: 2;
}
.arrow-link svg {
  transition: ease-out 0.2s;
}
.arrow-link:hover svg {
  transform: translateX(0.375rem);
}
.arrow-link.dark {
  color: #18072F;
}
.arrow-link.back {
  flex-direction: row-reverse;
}
.arrow-link.back svg {
  transform: rotate(180deg);
}
.arrow-link.back:hover svg {
  transform: translateX(-0.375rem) rotate(180deg);
}
.arrow-link.back.active {
  transform: translateX(-0.375rem) rotate(180deg) !important;
}
.arrow-link.orange {
  color: #F09662;
}
.arrow-link.orange svg path {
  stroke: #18072F;
}
.arrow-link.active {
  pointer-events: none;
  text-decoration: underline !important;
}
.arrow-link.active svg {
  transform: translateX(0.375rem);
}

@media only screen and (max-width: 1020px) {
  .arrow-link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0.769rem;
    text-decoration: underline;
    color: #FFFFFF;
    font-size: 1.231rem;
    transition: ease-out 0.2s;
    position: relative !important;
    z-index: 2 !important;
  }
  .arrow-link svg {
    height: 1rem !important;
    width: 0.462rem !important;
  }
}
.renvue {
  font-size: 1rem;
  width: fit-content;
  font-family: "Satoshi", sans-serif;
  color: #18072F;
  font-weight: 500;
  transition: ease-out 0.3s;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.875rem;
  display: inline-flex;
  opacity: 0.25;
}
.renvue:hover {
  opacity: 0.5;
}

.main-btn {
  height: 3.813rem;
  font-size: 1.5rem;
  font-weight: 400;
  color: white;
  font-family: "Quiche Sans", sans-serif;
  padding-inline: 2rem;
  background-color: #F09662;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  transition: ease-out 0.3s;
  border: 0;
  outline: none;
  cursor: pointer;
}
.main-btn:hover {
  background-color: #18072F;
}

.add-btn {
  width: 100%;
  background-color: rgb(24, 7, 47);
  border: 0;
  cursor: pointer;
  transition: ease-out 0.3s;
  height: 3.125rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.add-btn .inner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  position: relative;
}
.add-btn .inner span {
  color: white;
  font-size: 1.125rem;
  text-transform: uppercase;
  font-weight: 400;
  transition: ease-out 0.3s;
  position: relative;
  left: 0;
  transition: left 0.3s ease-out;
}
.add-btn svg {
  opacity: 0;
  transition: ease-out 0.3s;
  position: absolute;
  left: 0;
}
.add-btn:hover {
  background-color: #18072F !important;
}
.add-btn:hover span {
  left: 1rem;
}
.add-btn:hover svg {
  left: -1.438rem;
  opacity: 1;
}

.dark-btn {
  outline: none;
  border: 0;
  outline: 0;
  cursor: pointer;
  background-color: #18072F;
  width: 100%;
  height: 3.125rem;
  text-transform: uppercase;
  font-size: 1rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  font-weight: 400;
  transition: ease-out 0.3s;
  color: white;
  padding-inline: 2.188rem;
  text-wrap: nowrap;
}
.dark-btn:hover {
  background-color: #F09662;
}
.dark-btn.orange {
  background-color: #F09662;
}
.dark-btn.orange:hover {
  background-color: #18072F;
}
.dark-btn.orange-outline {
  background-color: rgba(0, 0, 0, 0);
  color: #18072F;
  border: 2px solid #F09662;
}
.dark-btn.orange-outline:hover {
  background-color: #F09662;
  color: white;
}
.dark-btn.blue-outline {
  background-color: rgba(0, 0, 0, 0);
  color: #18072F;
  border: 2px solid #18072F;
}
.dark-btn.blue-outline:hover {
  background-color: #18072F;
  color: white;
}

.basket-icon {
  position: relative;
}
.basket-icon .items-count {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  position: absolute;
  top: -0.4rem;
  right: 0.1rem;
  width: 0.938rem;
  height: 0.938rem;
  background-color: #F09662;
  border-radius: 50%;
  color: #FAFAFB;
  font-weight: 600;
  font-size: 0.625rem;
  padding-right: 0.5px;
}

@media only screen and (max-width: 1020px) {
  .add-btn {
    height: 3.154rem;
  }
  .main-btn {
    height: 4.692rem;
    font-size: 1.538rem;
    padding-inline: 1.231rem;
  }
  .dark-btn {
    font-size: 1.231rem;
    font-weight: 400;
    height: 3.846rem;
  }
  .basket-icon {
    position: relative;
  }
  .basket-icon .items-count {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    position: absolute;
    top: -0.25rem;
    right: 0.2rem;
    width: 0.6rem;
    height: 0.6rem;
    background-color: #F09662;
    border-radius: 50%;
    color: #F09662;
    font-weight: 600;
    font-size: 0;
  }
}
button.disabled {
  pointer-events: none;
  opacity: 0.3;
}

#cookies {
  position: fixed;
  bottom: 0;
  border-top: #FFD7BC 1px solid;
  width: 100%;
  z-index: 50;
  transition: ease-out 0.3s;
  opacity: 1;
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  padding: 2.375rem 7.3%;
}
#cookies .left {
  width: 66%;
}
#cookies .left h6 {
  margin-bottom: 1rem;
  font-size: 1.125rem;
  font-weight: 600;
  color: #18072F;
}
#cookies .left p {
  color: #18072F;
  opacity: 0.75;
  font-size: 0.938rem;
  max-width: 56.688rem;
  padding-right: 5%;
}
#cookies .right button {
  background-color: #18072F;
  height: 3.125rem;
  border: 0;
  outline: none;
  cursor: pointer;
  padding-inline: 1.813rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  color: #FFFFFF;
  font-size: 1.125rem;
  transition: ease-out 0.3s;
}
#cookies .right button:hover {
  background-color: #F09662;
}
#cookies .right {
  width: 33%;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
  gap: 10%;
}
#cookies .right .arrow-link {
  font-size: 1.375rem;
  color: #18072F;
  text-decoration: none;
}
#cookies.fade {
  opacity: 0;
  transform: translateY(100%);
}

.alert {
  width: fit-content;
  max-width: 95%;
  position: fixed;
  bottom: 5vh;
  z-index: 1100;
  min-height: 3.5rem;
  left: 50%;
  padding: 1rem;
  transform: translateX(-50%);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 3vw;
  padding-inline: 1.25rem;
  transition: ease-out 0.2s;
}
.alert svg {
  flex-shrink: 0;
}
.alert .left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.625rem;
}
.alert .left span {
  font-size: 1.125rem;
  min-width: 18vw;
  max-width: 530px;
}
.alert .close {
  cursor: pointer;
}
.alert.error {
  background-color: rgb(254, 248, 243);
  border-bottom: 1px solid rgb(240, 150, 98);
}
.alert.error span {
  color: #F09662;
}
.alert.success {
  background-color: #f7f6f8;
  border-bottom: 1px solid rgb(24, 7, 47);
}
.alert.success span {
  color: rgb(24, 7, 47);
}
.alert.closed {
  opacity: 0;
  pointer-events: none;
}

.added-item-announcement {
  padding: 2.625rem;
  background-color: #FFFFFF;
  transition: ease-out 0.2s;
  position: absolute;
  display: flex;
  opacity: 0;
  transform: scale(0);
  transform-origin: right top;
}
.added-item-announcement.show {
  opacity: 1;
  transform: scale(1);
}
.added-item-announcement {
  box-shadow: 0px 0px 1.25rem rgba(24, 7, 47, 0.1019607843);
  top: 6rem;
  width: fit-content;
  min-width: 33rem;
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.75rem;
}
.added-item-announcement .top {
  width: 100%;
}
.added-item-announcement .top button {
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  cursor: pointer;
}
.added-item-announcement .top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.added-item-announcement .top h4 {
  font-size: 1.125rem;
  color: #18072F;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
}
.added-item-announcement .item-info {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.25rem;
  height: 5.438rem;
}
.added-item-announcement .item-info .img-wrap {
  width: 5.438rem;
  height: 5.438rem;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.added-item-announcement .item-info .right {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  height: 5.438rem;
}
.added-item-announcement .item-info .right .product-type {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.813rem;
  color: #18072F;
}
.added-item-announcement .item-info .right .product-type .vl {
  height: 0.625rem;
  width: 1px;
  background-color: #F09662;
}
.added-item-announcement .item-info .right .bottom {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.625rem;
}
.added-item-announcement .item-info .right .bottom .name {
  font-size: 1.375rem;
  color: #18072F;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
}
.added-item-announcement .item-info .right .bottom .price {
  font-size: 1rem;
  color: #18072F;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
}
.added-item-announcement .bottom {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.625rem;
}
.added-item-announcement .bottom .shopping-btn, .added-item-announcement .bottom .cart-btn {
  width: 100%;
  height: 2.75rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  cursor: pointer;
  font-size: 1.125rem;
  font-weight: 400;
  transition: ease-out 0.3s;
}
.added-item-announcement .bottom .shopping-btn {
  border: 0;
  background-color: rgba(0, 0, 0, 0);
  color: #18072F;
  box-shadow: inset 0 0 0 1.5px #18072F;
}
.added-item-announcement .bottom .shopping-btn:hover {
  background-color: #18072F;
  color: white;
}
.added-item-announcement .bottom .cart-btn {
  background-color: #18072F;
  color: white;
}
.added-item-announcement .bottom .cart-btn:hover {
  background-color: #F09662;
}

.reservation-container {
  position: fixed;
  top: 0;
  z-index: 20000;
  width: 100vw;
  height: 100dvh;
  opacity: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  background-color: rgba(24, 7, 47, 0.5);
  pointer-events: none;
  transition: ease-out 0.3s;
}
.reservation-container .mobile-wrap {
  background-color: white;
  opacity: 0;
  transform: scale(0);
  transition: ease-out 0.3s;
  width: 100%;
  max-width: 600px;
}
.reservation-container .mobile-wrap .reservation-popup {
  width: 100%;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
  padding: 1.813rem;
}
.reservation-container .mobile-wrap .reservation-popup svg {
  margin-left: auto;
  align-self: flex-end;
  cursor: pointer;
}
.reservation-container .mobile-wrap .reservation-popup h3 {
  align-self: center;
  font-family: "Quiche Sans", sans-serif;
  font-size: 2.5rem;
  font-weight: 400;
  margin-bottom: 3rem;
}
.reservation-container .mobile-wrap .reservation-popup .booking-container {
  width: 100%;
}
.reservation-container .mobile-wrap .reservation-popup .booking-container iframe {
  width: 100%;
  max-width: 580px;
  border: 0 !important;
  box-shadow: none !important;
}
.reservation-container.active {
  pointer-events: all;
  opacity: 1;
}
.reservation-container.active .mobile-wrap {
  opacity: 1;
  transform: scale(1);
}

@media only screen and (max-width: 1330px) {
  .reservation-container .mobile-wrap {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .reservation-container .mobile-wrap .reservation-popup {
    max-width: 590px;
  }
}
@media only screen and (max-width: 1020px) {
  .reservation-container {
    justify-content: flex-end;
  }
  .reservation-container .mobile-wrap {
    max-width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    border-radius: 0.769rem 0.769rem 0px 0px;
    position: absolute;
    bottom: 0;
    transform-origin: bottom center;
    width: 100vw;
    max-width: 100%;
  }
  .reservation-container .mobile-wrap .close {
    margin-bottom: 1rem;
  }
  @media not all and (min-resolution: 0.001dpcm) {
    @supports (-webkit-touch-callout: none) {
      .reservation-container {
        padding-bottom: 4rem !important;
      }
    }
  }
  .alert {
    width: 90vw;
    max-width: 35rem;
  }
  #cookies {
    flex-direction: column;
  }
  #cookies .left {
    width: 100%;
  }
  #cookies .right {
    width: 100%;
    margin-top: 1.923rem;
    justify-content: flex-start;
  }
  .added-item-announcement {
    width: 100%;
    position: fixed;
    display: flex;
    bottom: 0;
    height: fit-content;
    align-self: flex-end;
    min-width: 0;
    transform-origin: bottom center;
    padding: 2.313rem 1.813rem !important;
  }
  .added-item-announcement .top h4 {
    font-size: 1.385rem;
  }
  .added-item-announcement .top svg {
    width: 0.923rem;
    height: 0.923rem;
  }
  .added-item-announcement .bottom .shopping-btn, .added-item-announcement .bottom .cart-btn {
    font-size: 1.154rem;
    text-transform: uppercase;
    height: 3.154rem;
  }
}
#trail-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  pointer-events: none;
  overflow: hidden;
  z-index: 102;
}

@keyframes float {
  0% {
    transform: translate(0, 0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(var(--float-x), var(--float-y)) scale(0);
    opacity: 0;
  }
}
.trail-svg {
  position: absolute;
  pointer-events: none;
  transform-origin: center;
  opacity: 0;
  transform: scale(0);
  transition: transform 0.5s ease-out, opacity 0.5s ease-out;
}

@media only screen and (max-width: 1020px) {
  #trail-container {
    display: none;
  }
}
.butterflies-signature {
  position: relative;
}
.butterflies-signature .blue-b {
  position: absolute;
}
.switch {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  border-bottom: rgba(240, 150, 98, 0.25) 1px solid;
  height: 5.313rem;
}
.switch .vl {
  height: 100%;
  width: 1px;
  background-color: rgba(240, 150, 98, 0.25);
}
.switch button, .switch a {
  height: 100%;
  background-color: rgba(240, 150, 98, 0);
  border: 0;
  color: #18072F;
  outline: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  font-size: 1.375rem;
  width: calc(50% - 0.5px);
  cursor: pointer;
}
.switch button:hover, .switch a:hover {
  text-decoration: underline;
}
.switch button.active, .switch a.active {
  pointer-events: none;
  text-decoration: underline;
}

@media only screen and (max-width: 1020px) {
  .switch {
    height: 5.538rem;
    position: fixed;
    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    top: 5.923rem;
    z-index: 3;
    border-bottom: 1px solid #FFD7BC;
  }
  .switch .vl {
    width: 0.75px;
    background-color: #F09662;
  }
  .switch button, .switch a {
    font-size: 1.154rem;
  }
  .switch button.active, .switch a.active {
    font-weight: 500;
  }
  .switch button svg, .switch a svg {
    width: 2.308rem;
    height: 1.538rem;
  }
}
.check-open {
  width: 100%;
  max-height: 0;
  opacity: 0;
  pointer-events: none;
}
.check-open.active {
  transition: ease-out 0.3s;
  max-height: fit-content;
  opacity: 1;
  pointer-events: all;
}

.inputs-heading label .optional {
  color: #F09662;
  font-size: 1rem;
  font-weight: 300;
}
.inputs-heading {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.625rem;
  width: 100%;
}
.inputs-heading h6 {
  width: 100%;
  font-size: 1.563rem;
  font-weight: 400;
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
}
.inputs-heading .two-inputs {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 2.8%;
  width: 100% !important;
}
.inputs-heading .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
}
.inputs-heading .row .popup-container {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  position: relative;
}
.inputs-heading .row .popup-container svg {
  cursor: pointer;
}
.inputs-heading .row .popup-container .popup-wrap {
  width: 19.688rem;
  height: 7rem;
  position: absolute;
  top: -7rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  z-index: 50;
  opacity: 0;
  pointer-events: none;
  transition: ease-out 0.1s;
  transform: scale(0);
}
.inputs-heading .row .popup-container .popup-wrap .content {
  position: relative;
  width: 100%;
  height: 5rem;
  background-color: rgba(255, 255, 255, 0);
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1019607843);
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.inputs-heading .row .popup-container .popup-wrap .content p {
  z-index: 4;
  position: relative;
  font-size: 0.875rem;
  width: 90%;
  text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1019607843);
  color: #18072F;
}
.inputs-heading .row .popup-container .popup-wrap .content .cover {
  position: absolute;
  bottom: 0;
  z-index: 3;
  width: 5rem;
  height: 2rem;
  background-color: white;
}
.inputs-heading .row .popup-container .popup-wrap .arrow {
  width: 2.25rem;
  height: 2.25rem;
  background-color: white;
  transform: rotate(-45deg);
  box-shadow: -10px 0px 40px rgba(0, 0, 0, 0.1019607843), 0px 10px 40px rgba(0, 0, 0, 0.1019607843); /* Left and bottom only */ /* Bottom shadow */
  position: absolute;
  bottom: 1.2rem;
}
.inputs-heading .row .popup-container svg:hover ~ .popup-wrap {
  opacity: 1;
  transform: scale(1);
}

.select-input {
  width: 100%;
}
.select-input .custom-select {
  width: 100%;
  position: relative;
}
.select-input .custom-select select {
  width: 100%;
  background-color: rgba(24, 7, 47, 0);
  border: 0;
  outline: 0;
  font-size: 1.25rem;
  font-weight: 400;
  border-bottom: 1px solid #18072F;
  color: #F09662;
  height: 2.438rem;
  padding-bottom: 0.688rem;
}
.select-input .custom-select select:has(option:checked[value=""]) {
  color: #18072F;
  font-weight: 300;
}
.select-input .custom-select select {
  appearance: none; /* Standard */
  -webkit-appearance: none; /* Safari & Chrome */
  -moz-appearance: none; /* Firefox */
  cursor: pointer;
}
.select-input .custom-select {
  /* Optional: Hide the dropdown indicator in IE */
}
.select-input .custom-select select::-ms-expand {
  display: none;
}
.select-input .custom-select:focus-within::after {
  transform: translateY(-50%) scale(-1);
}
.select-input .custom-select::after {
  transition: ease-out 0.2s;
  content: "";
  position: absolute;
  top: 40%;
  right: 0;
  transform: translateY(-50%);
  width: 1rem;
  height: 0.769rem;
  background-color: rgb(254, 248, 243);
  background: url('data:image/svg+xml;utf8,<svg width="1.154rem" height="0.769rem" viewBox="0 0 15 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.05762 1.13379L7.55812 8.13379L14.0576 1.13379" stroke="%23F09662" stroke-width="2" stroke-linejoin="round"/></svg>') no-repeat center;
  background-size: contain;
  pointer-events: none;
}
.select-input.error select {
  border-color: #F09662;
}

.phone-input .custom-select {
  width: 30.6%;
  position: relative;
  min-width: 5.769rem;
}
.phone-input .custom-select select {
  width: 100%;
  background-color: rgba(24, 7, 47, 0);
  border: 0;
  outline: 0;
  font-size: 1.25rem;
  font-weight: 400;
  border-bottom: 1px solid #18072F;
  color: #F09662;
  height: 2.438rem;
  padding-bottom: 0.688rem;
}
.phone-input .custom-select select {
  appearance: none; /* Standard */
  -webkit-appearance: none; /* Safari & Chrome */
  -moz-appearance: none; /* Firefox */
  cursor: pointer;
}
.phone-input .custom-select {
  /* Optional: Hide the dropdown indicator in IE */
}
.phone-input .custom-select select::-ms-expand {
  display: none;
}
.phone-input .custom-select:focus-within::after {
  transform: translateY(-50%) scale(-1);
}
.phone-input .custom-select::after {
  transition: ease-out 0.2s;
  content: "";
  position: absolute;
  top: 40%;
  right: 0;
  transform: translateY(-50%);
  width: 1rem;
  height: 0.769rem;
  background-color: rgb(254, 248, 243);
  background: url('data:image/svg+xml;utf8,<svg width="1.154rem" height="0.769rem" viewBox="0 0 15 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.05762 1.13379L7.55812 8.13379L14.0576 1.13379" stroke="%23F09662" stroke-width="2" stroke-linejoin="round"/></svg>') no-repeat center;
  background-size: contain;
  pointer-events: none;
}
.phone-input {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 5%;
  gap: 5%;
}
.phone-input .text-input input {
  font-size: 1.25rem;
  width: 100%;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.phone-input .text-input textarea {
  font-size: 1.25rem;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  width: 100%;
  height: 2.438rem;
  overflow: hidden;
  resize: none;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
  transition: 0.3s ease-out;
}
.phone-input .text-input label {
  font-size: 1.25rem;
  font-weight: 300;
  color: #18072F;
  transition: ease-out 0.2s;
  position: absolute;
  pointer-events: none;
  left: 0;
}
.phone-input .text-input:focus-within label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.phone-input .text-input input:not(:placeholder-shown) ~ label,
.phone-input .text-input textarea:focus ~ label,
.phone-input .text-input textarea:not(:placeholder-shown) ~ label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.phone-input .text-input.error input, .phone-input .text-input.error textarea {
  border-color: #F09662;
}
.phone-input .text-input.error label {
  color: #F09662;
}

.text-input {
  width: 100%;
  position: relative !important;
}
.text-input input {
  font-size: 1.25rem;
  width: 100%;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.text-input textarea {
  font-size: 1.25rem;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  width: 100%;
  height: 2.438rem;
  overflow: hidden;
  resize: none;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.text-input label {
  font-size: 1.25rem;
  font-weight: 300;
  color: #18072F;
  transition: ease-out 0.2s;
  position: absolute;
  pointer-events: none;
  left: 0;
}
.text-input:focus-within label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.text-input input:not(:placeholder-shown) ~ label,
.text-input textarea:focus ~ label,
.text-input textarea:not(:placeholder-shown) ~ label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.text-input.error input, .text-input.error textarea {
  border-color: #F09662;
}
.text-input.error label {
  color: #F09662;
}

.password-input {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.password-input input {
  font-size: 1.25rem;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  width: 100%;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.password-input textarea {
  font-size: 1.25rem;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  width: 100%;
  height: 2.438rem;
  overflow: hidden;
  resize: none;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.password-input .show, .password-input .unshow {
  position: absolute;
  right: 0;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: ease-out 0.1s;
  transform: scale(0);
  bottom: 0.875rem;
}
.password-input .show.active, .password-input .unshow.active {
  opacity: 1;
  pointer-events: all;
  transform: scale(1);
}
.password-input label {
  font-size: 1.25rem;
  font-weight: 300;
  color: #18072F;
  transition: ease-out 0.2s;
  position: absolute;
  pointer-events: none;
  left: 0;
}
.password-input:focus-within label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.password-input input:not(:placeholder-shown) ~ label,
.password-input textarea:focus ~ label,
.password-input textarea:not(:placeholder-shown) ~ label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.password-input.error input, .password-input.error textarea {
  border-color: #F09662;
}
.password-input.error label {
  color: #F09662;
}

.text-input input {
  font-size: 1.25rem;
  width: 100%;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.text-input textarea {
  font-size: 1.25rem;
  font-weight: 400;
  color: #F09662;
  padding-bottom: 0.688rem;
  width: 100%;
  height: 2.438rem;
  overflow: hidden;
  resize: none;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: 0;
  border-bottom: 1px solid #18072F;
}
.text-input label {
  font-size: 1.25rem;
  font-weight: 300;
  color: #18072F;
  transition: ease-out 0.2s;
  position: absolute;
  pointer-events: none;
  left: 0;
}
.text-input:focus-within label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.text-input input:not(:placeholder-shown) ~ label,
.text-input textarea:focus ~ label,
.text-input textarea:not(:placeholder-shown) ~ label {
  transform: translateY(-2rem);
  font-size: 1.125rem;
}
.text-input.error input, .text-input.error textarea {
  border-color: #F09662;
}
.text-input.error label {
  color: #F09662;
}

.announcement {
  height: 40px;
  width: 100%;
  background-color: #F09662;
  position: static;
  top: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0;
  position: sticky;
  top: 1;
  transition: ease-out 0.3s;
}
.announcement .center {
  display: flex;
  text-align: center;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
  pointer-events: none;
  text-transform: uppercase;
  gap: 1rem;
  align-items: center;
}
.announcement .center span, .announcement .center a {
  font-size: 0.875rem;
  font-weight: 500;
  color: white;
}
.announcement .center .vl {
  height: 1.188rem;
  display: flex;
  width: 0;
  border-left: 1px solid white;
  background-color: white;
}
.announcement .center {
  transition: ease-out 0.3s;
  z-index: 2;
  transition: 0.5s ease-out;
  opacity: 0 !important;
}
.announcement .center a {
  transition: 0.3s ease-out;
  text-wrap: nowrap;
}
.announcement .center.active {
  opacity: 1 !important;
  pointer-events: all;
  z-index: 10;
}
.announcement .center.active a:hover {
  opacity: 0.5 !important;
}
.announcement #close-announcement {
  position: relative;
  cursor: pointer;
  z-index: 50;
  pointer-events: all;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #F09662;
  transition: 0.2s ease-out;
}
.announcement #close-announcement svg path {
  transition: 0.2s ease-out;
}
.announcement #close-announcement:hover {
  background-color: #FFD7BC;
}
.announcement #close-announcement:hover svg path {
  fill: #F09662;
}
.announcement.hide-announcement {
  transform: translateY(-100%);
  opacity: 0;
  max-height: 0;
}

@media only screen and (max-width: 1020px) {
  .announcement span, .announcement a {
    font-size: 1rem !important;
  }
}
.discount-span {
  text-transform: uppercase;
  color: #F09662;
  font-weight: 400;
  position: absolute;
}

footer {
  width: 100%;
  position: relative;
  z-index: 2;
}
footer .pre-footer {
  width: 100%;
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-inline: 7.3%;
}
footer .pre-footer a {
  font-size: 1.563rem;
  height: 16rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.25rem;
  color: #18072F;
  text-transform: uppercase;
  font-family: "Quiche Sans", sans-serif;
}
footer .footer {
  width: 100%;
  background-color: #FFFCFA;
  padding: 4.75rem 0;
}
footer .footer hr {
  margin: 2.313rem 5.4%;
  display: block;
  height: 1px;
  border: 0;
  border-top: 2px solid #F09662;
  opacity: 0.15;
  padding: 0;
}
footer .footer .top, footer .footer .bottom, footer .footer .center {
  padding-inline: 7.3%;
}
footer .footer .top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
footer .footer .top .footer-logo {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 2.375rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-size: 2.3rem;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: 0.32rem;
}
footer .footer .top h3 {
  color: #18072F;
  font-size: 1.563rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
footer .footer .center {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.25rem;
}
footer .footer .center .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.25rem;
}
footer .footer .center .column.bigger-gap {
  gap: 2.875rem;
}
footer .footer .center .column .section .links {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.938rem;
}
footer .footer .center .column .section .links .link {
  font-size: 1rem;
  text-transform: uppercase;
}
footer .footer .center .column .section .links .link.underline {
  text-transform: lowercase;
}
footer .footer .center .column .section .social {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
}
footer .footer .center .column .section .social .icon {
  margin-bottom: 0.938rem;
  width: 3.125rem;
  height: 3.125rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
footer .footer .center .column .section .social .icon svg {
  position: absolute;
  z-index: 2;
}
footer .footer .center .column .section .social .icon .square {
  transition: ease-out 0.2s;
  transform: rotate(45deg);
  width: 2.188rem;
  height: 2.188rem;
  background-color: #18072F;
}
footer .footer .center .column .section .social .icon:hover .square {
  transform: rotate(0deg);
}
footer .footer .center .column .section h6 {
  color: #F09662;
  font-weight: 400;
  font-size: 1.25rem;
  margin-bottom: 1.25rem;
}
footer .footer .center .column .section p {
  max-width: 16rem;
  font-size: 1rem;
  color: #18072F;
}
footer .footer .center .column .section p .grey {
  color: #8C8398;
}
footer .footer .center .column .section {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
footer .footer .bottom {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
footer .footer .bottom .vl {
  height: 1.188rem;
  width: 1px;
  margin-inline: 0.906rem;
  background-color: #FFD7BC;
}
footer .footer .bottom .lang {
  color: #18072F;
  font-weight: 400;
}
footer .footer .bottom .lang:hover .medium {
  text-decoration: underline;
}
footer .footer .bottom .renvue {
  margin-left: auto;
}

.copyright {
  font-size: 1rem;
  color: rgb(24, 7, 47);
  font-weight: 400;
}
.copyright .year {
  font-weight: 500;
}

@media only screen and (max-width: 1020px) {
  .copyright .mobile {
    display: inline-flex !important;
  }
  footer {
    display: flex;
    flex-direction: column;
  }
  footer .pre-footer {
    flex-direction: column;
    gap: 2.308rem;
    padding: 2.308rem 8% 3.462rem 8%;
  }
  footer .pre-footer a {
    height: 1.692rem;
    flex-direction: row;
    width: 100%;
    justify-content: flex-start;
    text-transform: none;
    font-size: 1.385rem;
  }
  footer .pre-footer a .svg-wrap {
    width: 1.538rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  footer .pre-footer a .svg-wrap.num1 svg {
    width: 1.538rem;
    height: 0.923rem;
  }
  footer .pre-footer a .svg-wrap.num3 svg {
    width: 1.308rem;
    height: 1.462rem;
  }
  footer .pre-footer a .svg-wrap.num4 svg {
    width: 0.792rem;
    height: 1.615rem;
  }
  footer .pre-footer a svg.mobile {
    margin-left: auto;
  }
  footer .footer .footer-mobile-section .links {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
    margin: 0;
    opacity: 0;
  }
  footer .footer .footer-mobile-section .links.open {
    max-height: fit-content !important;
    margin: 1.231rem 0 2.538rem 0;
  }
  footer .footer .footer-mobile-section h6 svg {
    transition: transform 0.2s ease;
  }
  footer .footer {
    padding: 3rem 8% !important;
    background-color: #FEF8F3;
  }
  footer .footer hr {
    opacity: 1;
    border-top: 1px solid #F09662;
    margin: 0;
  }
  footer .footer .center {
    padding: 0;
    flex-direction: column !important;
    gap: 0;
  }
  footer .footer .center .column {
    gap: 0 !important;
    width: 100%;
  }
  footer .footer .center .column .section {
    width: 100%;
    border-top: 1px solid #F09662;
  }
  footer .footer .center .column .section h6 {
    margin: 0;
    padding: 1.423rem 0;
    color: #18072F;
    text-transform: uppercase;
    font-size: 1.154rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    width: 100%;
  }
  footer .footer .center .column .section .links {
    width: 100%;
    gap: 1.438rem;
  }
  footer .footer .center .column .section .links .link {
    font-size: 1.077rem;
    text-transform: none;
    font-family: "Satoshi", sans-serif;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    text-decoration: none !important;
  }
  footer .footer .center .column .section.operator {
    border-top: 1px solid #F09662;
    padding-top: 1.462rem;
    padding-bottom: 1.385rem;
  }
  footer .footer .center .column .section.operator p {
    font-size: 1.154rem;
    max-width: 100%;
  }
  footer .footer .center .column .section.follow-us {
    border-top: 1px solid #F09662;
  }
  footer .footer .center .column .section.follow-us .icon {
    margin: 0;
  }
  footer .footer .center .column .section.follow-us h6 {
    text-transform: uppercase;
    color: #F09662;
    font-size: 1.385rem;
    padding: 0;
  }
  footer .footer .center .column .section.follow-us {
    padding: 1.423rem 0;
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  footer .footer .center .column .section.operator h6 {
    text-transform: none;
    color: #F09662;
    font-size: 1.385rem;
    padding: 0;
    margin-bottom: 1.154rem;
  }
  footer .footer .bottom {
    padding: 1.385rem 0;
  }
}
.brand-wrap-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(24, 7, 47, 0.15);
  opacity: 0;
  pointer-events: none;
  transition: 0.3s;
  z-index: 50;
  backdrop-filter: blur(2px); /* ZDE je blur */
  -webkit-backdrop-filter: blur(2px);
}

.brand-wrap-backdrop.active {
  opacity: 1;
  pointer-events: auto;
}

header {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  position: sticky;
  top: 0;
  z-index: 100;
}

.main-header {
  width: 100%;
  height: 6rem;
  background-color: rgb(255, 255, 255);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  position: sticky;
  border-bottom: #FFD7BC 1px solid;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-inline: 3%;
}
.main-header.info-header {
  padding-inline: 7.3%;
}
.main-header.order-header {
  padding-inline: 7.3%;
  position: sticky;
  top: 0;
}
.main-header .link {
  font-size: 1.25rem;
}
.main-header .brand-wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  position: relative;
  height: 100%;
}
.main-header .brand-wrap .brand-btn {
  justify-self: center;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  cursor: pointer;
}
.main-header .brand-wrap .brand-btn svg {
  transition: transform 0.2s ease;
}
.main-header .brand-wrap .brand-btn:hover svg {
  transform: translate(0);
}
.main-header .brand-wrap nav {
  position: absolute;
  top: calc(100% + 0.063rem);
  left: 50%;
  transform: translateX(-50%) scale(0);
  transform-origin: top center;
  opacity: 0;
  pointer-events: none;
  display: flex;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 32px;
  padding: 24px;
  background-color: white;
  transition: transform 0.2s ease-out, opacity 0.1s ease-out;
}
.main-header .brand-wrap nav .emblem {
  width: 124px;
  height: 124px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background-color: #F09662;
}
.main-header .brand-wrap nav .emblem svg {
  width: 77.4%;
}
.main-header .brand-wrap nav .column {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 182px;
}
.main-header .brand-wrap nav .column .heading {
  display: flex;
  gap: 9px;
  align-items: center;
}
.main-header .brand-wrap nav .column .heading .hr {
  width: 100%;
  border: 0;
  height: 1px;
  background-color: #F09662;
}
.main-header .brand-wrap nav .column .heading h6 {
  font-family: "Quiche Sans", Arial, sans-serif;
  font-size: 16px;
  color: #18072F;
  font-weight: 400;
}
.main-header .brand-wrap nav .column .brand-links {
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.main-header .brand-wrap nav .column .brand-links a {
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "Quiche Sans", Arial, sans-serif;
  font-size: 13px;
  color: #18072F;
}
.main-header .brand-wrap nav .column .brand-links a svg rect {
  transition: all 0.3s ease;
}
.main-header .brand-wrap nav .column .brand-links a:hover svg rect {
  fill: #F09662;
}
.main-header .brand-wrap:hover .brand-btn svg {
  transform: scale(-1);
}
.main-header .brand-wrap:hover nav {
  transform: translateX(-50%) scale(1);
  opacity: 1;
  pointer-events: all;
}
.main-header .left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 2.5rem;
}
.main-header .right {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 2.125rem;
}
.main-header .right .links {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 2.5rem;
}
.main-header .right .icons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.main-header .right .icons .icon {
  display: inline-flex;
  align-items: center;
  transition: ease-out 0.3s;
}
.main-header .right .icons .icon.margin {
  margin: 0 1.813rem 0 1.5rem;
}
.main-header .right .icons .icon:hover {
  transform: translateY(-0.375rem);
}
.main-header .right .icons .vl {
  height: 2.063rem;
  width: 1px;
  background-color: #E6E6E6;
  margin-inline: 1.875rem;
}

.butik-popup {
  padding: 0.688rem;
  width: 100vw;
  height: 100dvh;
  position: fixed;
  inset: 0;
  background: rgba(24, 7, 47, 0.15);
  opacity: 0;
  transition: 0.1s ease-out;
  pointer-events: none;
  transition: 0.3s;
  z-index: 101;
  backdrop-filter: blur(2px); /* ZDE je blur */
  -webkit-backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
}
.butik-popup.active {
  opacity: 1;
  pointer-events: all;
}
.butik-popup.active .popup {
  transform: translateX(0);
}
.butik-popup .popup {
  transition: 0.2s ease-out;
  transform: translateX(-120%);
  display: flex;
  flex-direction: column;
  width: 96%;
  padding-inline: 2.625rem;
  max-width: 21.875rem;
  padding-top: 2.7777777778dvh;
  padding-bottom: 4.0740740741dvh;
  background-color: white;
  height: 100%;
}
.butik-popup .popup hr {
  border: 0;
  width: 100%;
  height: 0;
  border-top: 1px solid #FFD7BC;
}
.butik-popup .popup .header #butik-menu-close {
  display: flex;
  font-size: 1.125rem;
  cursor: pointer;
  color: #8C8398;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.butik-popup .popup .links {
  display: flex;
  flex-direction: column;
}
.butik-popup .popup .links h5 {
  margin-bottom: 0.3703703704dvh;
  margin-top: 3.4259259259dvh;
  text-align: center;
  width: 100%;
  font-family: "Quiche Sans";
  text-transform: uppercase;
  font-weight: 400;
  color: #18072F;
  font-size: 1.25rem;
}
.butik-popup .popup .links a {
  font-size: 1.125rem;
  font-family: "Quiche Sans";
  color: #18072F;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5dvh 0;
  margin: -1.5dvh 0;
}
.butik-popup .popup .links a svg rect {
  transition: ease-out 0.2s;
}
.butik-popup .popup .links a:hover svg rect {
  fill: #F09662;
}
.butik-popup .popup .links {
  gap: 2.962962963dvh;
}
.butik-popup .popup .slider-wrap {
  margin-top: auto;
  position: relative;
  max-height: fit-content;
  overflow: hidden;
  display: flex;
}
.butik-popup .popup .slider-wrap .indicator-wrap {
  background-color: rgba(24, 7, 47, 0.4);
  width: calc(100% - 0.5rem);
  align-items: center;
  height: 0.625rem;
  display: flex;
  align-items: center;
  padding-inline: 0.125rem;
  position: absolute;
  bottom: 0.25rem;
  left: 50%;
  overflow: hidden;
  transform: translateX(-50%);
}
.butik-popup .popup .slider-wrap .indicator-wrap .butik-indicator {
  width: 0%;
  height: 0.313rem;
  background-color: white;
  display: block;
}
.butik-popup .popup .image-slider {
  display: flex;
  width: 100%;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  aspect-ratio: 264/364;
  margin-top: auto;
  max-height: 33.7037037037dvh;
  position: relative;
  margin-top: 3.4dvh;
}
.butik-popup .popup .image-slider .category {
  scroll-snap-align: start;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  flex-shrink: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.butik-popup .popup .image-slider .category h6 {
  text-transform: uppercase;
  font-size: 2rem;
  color: white;
  font-family: "Quiche Sans";
  position: relative;
  z-index: 105;
  font-weight: 400;
  text-align: center;
  padding-inline: 3%;
  width: 100%;
}
.butik-popup .popup .image-slider .category::before {
  background-color: rgba(24, 7, 47, 0.2);
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.butik-popup .popup .image-slider {
  /* Firefox */
  scrollbar-width: none;
  /* IE + starší Edge */
  -ms-overflow-style: none;
}
.butik-popup .popup .image-scrollbar::-webkit-scrollbar {
  display: none;
}

.mobile-popup {
  display: none;
}
.mobile-popup.welcome {
  position: relative;
  overflow: hidden;
  z-index: 200 !important;
  background-color: rgba(24, 7, 47, 0.25);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  width: 100%;
  height: 100dvh;
  position: fixed;
  z-index: 150;
  top: 0;
  opacity: 0;
  pointer-events: none;
  outline: none;
  position: fixed;
  z-index: 100;
  border: 0;
  top: 0;
  opacity: 0;
  transition: ease-out 0.2s;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.mobile-popup.welcome.open {
  opacity: 1;
}
.mobile-popup.welcome.open #mobile-menu {
  transform: translateX(0);
}
.mobile-popup.welcome.open {
  pointer-events: all;
}
.mobile-popup.welcome #mobile-menu {
  transition: ease-out 0.3s;
  border-radius: 0 10px 10px 0;
  transform: translateX(-100%);
  height: 100dvh !important;
  width: 97% !important;
  display: flex;
  max-width: 500px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  background-color: rgba(255, 255, 255, 0.99);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  transition: ease-out 0.15s;
}
.mobile-popup.welcome #mobile-menu .header {
  height: 5.923rem;
  padding-inline: 6%;
  width: 100%;
  margin-bottom: 0.615rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.mobile-popup.welcome #mobile-menu .header #mobile-menu-close {
  cursor: pointer;
  color: #18072F;
  font-size: 1rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.6rem;
}
.mobile-popup.welcome #mobile-menu .links {
  width: 88%;
  margin-inline: 6%;
  border-bottom: rgba(240, 150, 98, 0.7529411765) 0.5px solid;
  margin-bottom: 1.462rem;
  padding-bottom: 1.462rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.462rem;
}
.mobile-popup.welcome #mobile-menu .links .link {
  font-size: 1.154rem;
  font-family: "Satoshi", sans-serif;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.769rem;
}
.mobile-popup.welcome #mobile-menu .links .link svg {
  margin-left: auto;
}
.mobile-popup.welcome #mobile-menu .links .link svg.no-margin {
  margin-left: 0;
}
.mobile-popup.welcome #mobile-menu .links .link:hover svg {
  transform: none;
}
.mobile-popup.welcome #mobile-menu .mobile-lang {
  margin-bottom: 1rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 88%;
  margin-inline: 6%;
  font-size: 1.154rem;
  color: #8C8398;
}
.mobile-popup.welcome #mobile-menu .mobile-lang .lang {
  color: #18072F;
  text-decoration: underline;
}

@media only screen and (max-width: 1020px) {
  .mobile-menu-show {
    width: 2rem !important;
    height: 2rem !important;
  }
  .icon.basket-icon svg {
    height: 1.385rem;
    width: 1.615rem;
  }
  .butik-popup {
    padding: 0;
    background-color: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .butik-popup .popup {
    width: 97%;
    max-width: 500px;
    padding-inline: 6%;
    padding-top: 0;
    padding-bottom: 3.8626609442dvh;
  }
  .butik-popup .popup .header {
    height: 5.923rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
  }
  .butik-popup .popup .header #butik-menu-close {
    font-size: 1rem;
  }
  .butik-popup .popup .butik-menu-close-mobile {
    display: flex;
    font-size: 1.538rem;
    color: #18072F;
    gap: 1rem;
    align-items: center;
    background-color: rgba(0, 0, 0, 0);
    border: 0;
  }
  .butik-popup .popup .links hr {
    margin: 0.7510729614dvh 0;
  }
  .butik-popup .popup .links {
    gap: 1.3948497854dvh;
  }
  .butik-popup .popup .links a {
    font-size: 1.231rem;
    padding: 1dvh 0;
    margin: -1dvh 0;
    font-size: 1.231rem;
    font-family: "Satoshi";
  }
  .butik-popup .popup .slider-wrap {
    aspect-ratio: 338/424;
    max-height: fit-content;
    overflow: hidden;
    display: flex;
    position: relative;
  }
  .butik-popup .popup .slider-wrap .indicator-wrap {
    bottom: 0;
    width: 100%;
    padding: 3px;
    height: 12px;
  }
  .butik-popup .popup .slider-wrap .indicator-wrap .butik-indicator {
    height: 4px;
  }
  .butik-popup .popup .slider-wrap .image-slider {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    min-height: 0;
    flex: 1;
    overflow: hidden;
    height: auto;
    max-height: fit-content;
    min-height: 0;
  }
  .butik-popup .popup .slider-wrap .image-slider .category {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  .butik-popup .popup .slider-wrap .image-slider .category h6 {
    font-size: 2.462rem;
  }
  .mobile-popup {
    overflow: hidden;
    background-color: rgba(24, 7, 47, 0.25);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    width: 100%;
    height: 100dvh;
    position: fixed;
    z-index: 150;
    top: 0;
    opacity: 0;
    pointer-events: none;
    outline: none;
    position: fixed;
    z-index: 100;
    border: 0;
    top: 0;
    opacity: 0;
    transition: ease-out 0.2s;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
  }
  .mobile-popup.open {
    opacity: 1;
  }
  .mobile-popup.open #mobile-menu {
    transform: translateX(0);
  }
  .mobile-popup.open {
    pointer-events: all;
  }
  .mobile-popup #mobile-menu {
    transition: ease-out 0.3s;
    border-radius: 0;
    transform: translateX(-100%);
    height: 100dvh !important;
    width: 97%;
    max-width: 500px;
    display: flex;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    background-color: rgba(255, 255, 255, 0.99);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    transition: ease-out 0.15s;
  }
  .mobile-popup #mobile-menu .header {
    height: 5.923rem;
    padding-inline: 6%;
    width: 100%;
    margin-bottom: 0.615rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
  .mobile-popup #mobile-menu .header #mobile-menu-close {
    color: #8C8398;
    font-size: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0.6rem;
  }
  .mobile-popup #mobile-menu .links {
    width: 88%;
    margin-inline: 6%;
    border-bottom: rgba(240, 150, 98, 0.7529411765) 0.5px solid;
    margin-bottom: 2.5751072961dvh;
    padding-bottom: 2.5751072961dvh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2.5751072961dvh;
  }
  .mobile-popup #mobile-menu .links.submenu {
    gap: 0;
  }
  .mobile-popup #mobile-menu .links.submenu button {
    border: 0;
    background-color: rgba(0, 0, 0, 0);
  }
  .mobile-popup #mobile-menu .links.submenu button svg {
    transition: all 0.2s ease;
  }
  .mobile-popup #mobile-menu .links.submenu button svg path {
    transition: all 0.2s ease;
  }
  .mobile-popup #mobile-menu .links.submenu button:hover {
    opacity: 1;
  }
  .mobile-popup #mobile-menu .links.submenu .sublinks {
    transition: height 0.1s ease-out, max-height 0.1s ease-out, margin 0.1 ease-out, opacity 0.2s ease-out;
    height: 0;
    max-height: 0;
    pointer-events: none;
    opacity: 0;
    display: flex;
    flex-direction: column;
    gap: 0.692rem;
    width: 100%;
  }
  .mobile-popup #mobile-menu .links.submenu .sublinks .link {
    width: 100%;
  }
  .mobile-popup #mobile-menu .links.submenu.active .sublinks {
    height: auto;
    max-height: 500px;
    pointer-events: all;
    opacity: 1;
    margin-top: 1.538rem;
  }
  .mobile-popup #mobile-menu .links.submenu.active button svg {
    transform: scale(-1);
  }
  .mobile-popup #mobile-menu .links.submenu.active button svg path {
    stroke: #8C8398;
  }
  .mobile-popup #mobile-menu .links.login {
    flex-direction: row;
  }
  .mobile-popup #mobile-menu .links.login a {
    width: 50%;
  }
  .mobile-popup #mobile-menu .links.login form {
    width: 50%;
  }
  .mobile-popup #mobile-menu .links.login form button {
    text-align: right;
    background-color: rgba(0, 0, 0, 0);
    border: 0;
    outline: none;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1.154rem;
  }
  .mobile-popup #mobile-menu .links.login form button svg {
    margin-left: 0;
  }
  .mobile-popup #mobile-menu .links .link {
    font-size: 1.231rem;
    font-family: "Satoshi", sans-serif;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0.769rem;
  }
  .mobile-popup #mobile-menu .links .link svg {
    margin-left: auto;
  }
  .mobile-popup #mobile-menu .links .link svg.no-margin {
    margin-left: 0;
  }
  .mobile-popup #mobile-menu .links .link:hover svg {
    transform: none;
  }
  .mobile-popup #mobile-menu .mobile-lang {
    margin-bottom: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    width: 88%;
    margin-inline: 6%;
    font-size: 1.154rem;
    color: #8C8398;
  }
  .mobile-popup #mobile-menu .mobile-lang .lang {
    color: #18072F;
    text-decoration: underline;
  }
  .main-header {
    height: 5.923rem;
    padding-inline: 6%;
  }
  .main-header .logo {
    height: 1.385rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .main-header .logo svg {
    width: 14.538rem;
    height: 1.385rem;
  }
}
@media only screen and (max-width: 350px) {
  .main-header.order-header .logo {
    left: 60%;
  }
}
main {
  overflow-y: hidden !important;
}

.svg-wrap {
  overflow-y: hidden;
}

body.locked {
  height: 100dvh;
  overflow-x: hidden;
}
body {
  color: #18072F;
}

.home-main .video-banner {
  width: 100%;
  background-color: #FAFAFB;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0;
}
.home-main .video-banner h2 {
  color: #FFFFFF;
  position: relative;
  z-index: 2;
  max-width: 60%;
}
.home-main .video-banner .dots {
  position: absolute;
  right: 7%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
}
.home-main .video-banner .dots svg {
  transition: ease-out 0.2s;
  cursor: pointer;
}
.home-main .video-banner .dots svg path {
  transition: ease-out 0.2s;
}
.home-main .video-banner .dots svg.active {
  transform: scale(1.0458181818);
  pointer-events: none;
}
.home-main .video-banner .dots svg.active .border {
  opacity: 1;
}
.home-main .video-banner .dots svg.active .inner {
  opacity: 1;
}
.home-main .video-banner .dots svg:hover .border {
  opacity: 0.75;
}
.home-main .video-banner .banners {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 85vh;
  transition: transform 1s ease;
}
.home-main .video-banner .banners .banner {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 85vh;
  flex: 0 0 85vh;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
  padding-inline: 7%;
  opacity: 1 !important;
  transition: opacity 0.3s ease;
}
.home-main .video-banner .banners .banner .arrow-link {
  margin-top: 1.125rem;
}
.home-main .video-banner .banners .banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(24, 7, 47, 0.5);
  z-index: 1;
}
.home-main .tea {
  padding-top: 9rem;
  padding-bottom: 0.5rem;
  position: relative;
  background-color: white;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .tea .arrows {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
}
.home-main .tea .arrows svg {
  transition: ease-out 0.15s;
  cursor: pointer;
}
.home-main .tea .arrows svg path {
  transition: ease-out 0.1s;
}
.home-main .tea .arrows svg.disabled {
  pointer-events: none;
}
.home-main .tea .arrows svg.disabled path {
  stroke: #FFD7BC;
}
.home-main .tea .arrows .right:hover {
  transform: translateX(0.375rem);
}
.home-main .tea .arrows .left:hover {
  transform: translateX(-0.375rem);
}
.home-main .tea .vl {
  margin-bottom: 3.813rem;
  height: 17.625rem;
  width: 2px;
  flex: 1.75px 1.75px 1.75px;
  background-color: #F09662;
}
.home-main .tea .dots {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  left: 0.7rem;
  bottom: 3.5rem;
}
.home-main .tea .dots svg {
  transition: ease-out 0.2s;
  cursor: pointer;
}
.home-main .tea .dots svg path {
  transition: ease-out 0.2s;
}
.home-main .tea .dots svg.active {
  transform: scale(1.0458181818);
  pointer-events: none;
}
.home-main .tea .dots svg.active .border {
  opacity: 1;
}
.home-main .tea .dots svg.active .inner {
  opacity: 1;
}
.home-main .tea .dots svg:hover .border {
  opacity: 0.75;
}
.home-main .tea .slides {
  scrollbar-width: none;
}
.home-main .tea .slides::-webkit-scrollbar {
  display: none;
}
.home-main .tea .slides-wrap {
  position: relative;
}
.home-main .tea .slides-wrap .arrows {
  top: calc(100% - 3.5rem);
  right: 13%;
  background-color: rgba(0, 0, 0, 0);
  height: fit-content;
}
.home-main .tea .slides-wrap .slides {
  margin-top: 3.813rem;
  position: relative;
  margin-bottom: 0rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  overflow-x: scroll;
  touch-action: pan-y;
  transition: 0.3s;
}
.home-main .tea .slides-wrap .slides .slide-wrap {
  flex-shrink: 0;
  width: 100%;
  position: relative;
  height: fit-content;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide {
  width: 74%;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .right {
  height: fit-content;
  position: relative;
  top: 2.5rem;
  width: 100%;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .heading {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .heading h6 {
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
  font-size: 1.813rem;
  margin-inline: 1.938rem;
  text-wrap: nowrap;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .heading .vl {
  height: 1.813rem;
  width: 1.5px;
  flex: 0 0 1.5px;
  background-color: #F09662;
  margin: 0;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .heading .hr {
  width: 100%;
  flex: 1.75px 1.75px 1.75px;
  height: 0.1px;
  border-top: 2px solid #F09662;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .border-bottom {
  height: 1px;
  flex: 1px 1px 1px;
  border-bottom: 2px solid #F09662;
  width: 60%;
  position: absolute;
  right: 0;
  bottom: 0;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .border-right {
  width: 1px;
  border-right: 2px solid #F09662;
  background-color: #F09662;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .inner {
  margin-bottom: 5.813rem;
  margin-top: 3.625rem;
  padding-left: 0;
  padding-right: 15%;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .inner h5 {
  font-size: 2.813rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
  margin-bottom: 1.563rem;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide .inner p {
  font-weight: 300;
  color: #18072F;
  font-size: 1.563rem;
  margin-bottom: 2rem;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 6.5%;
}
.home-main .tea .slides-wrap .slides .slide-wrap .slide img {
  position: relative;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 599/739;
  width: 41%;
  flex-shrink: 0;
  top: 0;
}
.home-main {
  overflow-x: hidden;
}
.home-main h1 {
  display: none !important;
}
.home-main {
  width: 100%;
}
.home-main h2 {
  font-size: 4.063rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
}
.home-main h3 {
  font-size: 3.125rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
}
.home-main h4 {
  font-size: 2.188rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
}
.home-main .hero {
  width: 100%;
  background-color: #FAFAFB;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0;
}
.home-main .hero h2 {
  color: #FFFFFF;
  position: relative;
  z-index: 2;
  max-width: 60%;
}
.home-main .hero .dots {
  position: absolute;
  right: 7%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
}
.home-main .hero .dots svg {
  transition: ease-out 0.2s;
  cursor: pointer;
}
.home-main .hero .dots svg path {
  transition: ease-out 0.2s;
}
.home-main .hero .dots svg.active {
  transform: scale(1.0458181818);
  pointer-events: none;
}
.home-main .hero .dots svg.active .border {
  opacity: 1;
}
.home-main .hero .dots svg.active .inner {
  opacity: 1;
}
.home-main .hero .dots svg:hover .border {
  opacity: 0.75;
}
.home-main .hero .banners {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 85vh;
  transition: transform 1s ease;
}
.home-main .hero .banners .banner {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 85vh;
  flex: 0 0 85vh;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
  padding-inline: 7%;
  opacity: 1 !important;
  transition: opacity 0.3s ease;
}
.home-main .hero .banners .banner .arrow-link {
  margin-top: 1.125rem;
}
.home-main .hero .banners .banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(24, 7, 47, 0.5);
  z-index: 1;
}
.home-main .products-slider {
  z-index: 3;
  position: relative;
  background-color: white;
  padding: 3.938rem 0 0 0;
}
.home-main .products-slider.special {
  margin-top: 9rem;
  padding-bottom: 0;
}
.home-main .products-slider.special .btn-wrap {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.home-main .products-slider.special .btn-wrap .main-btn {
  width: fit-content;
  margin-top: 6rem;
  align-self: center;
}
.home-main .products-slider.special h4 {
  text-align: center;
  font-size: 1.375rem;
  font-weight: 400;
  color: #18072F;
  text-transform: uppercase;
  margin-bottom: 1rem;
  font-family: "Satoshi", sans-serif;
}
.home-main .products-slider.special h2 {
  font-size: 3.75rem;
  color: #F09662;
  text-transform: uppercase;
  width: 100%;
  text-align: center;
  margin-bottom: 2.188rem;
}
.home-main .products-slider .heading {
  padding-inline: 7%;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.home-main .products-slider .heading .arrows {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.home-main .products-slider .heading .arrows svg {
  transition: ease-out 0.15s;
  cursor: pointer;
}
.home-main .products-slider .heading .arrows svg path {
  transition: ease-out 0.1s;
}
.home-main .products-slider .heading .arrows svg.disabled {
  pointer-events: none;
}
.home-main .products-slider .heading .arrows svg.disabled path {
  stroke: #FFD7BC;
}
.home-main .products-slider .heading .arrows .right:hover {
  transform: translateX(0.375rem);
}
.home-main .products-slider .heading .arrows .left:hover {
  transform: translateX(-0.375rem);
}
.home-main .products-slider {
  overflow: hidden;
}
.home-main .products-slider .indicator-wrap {
  position: relative;
  margin-top: 3.938rem;
  background-color: #FEF8F3;
  height: 0.188rem;
  margin-left: 7%;
}
.home-main .products-slider .indicator-wrap .scroll-indicator {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 40%;
  height: 0.188rem;
  background-color: black;
  transition: width 0.2s ease;
}
.home-main .products-slider .products {
  scrollbar-width: none;
}
.home-main .products-slider .products::-webkit-scrollbar {
  display: none;
}
.home-main .products-slider .products {
  z-index: 3;
  position: relative;
  background-color: white;
  margin-top: 4.063rem;
  padding-left: 7vw;
  scroll-padding-left: 7vw;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5vw;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  padding-right: 7vw;
}
.home-main .products-slider .products .product, .home-main .products-slider .products .first-product .product {
  scroll-snap-align: start;
  flex-shrink: 0;
  width: 20.625vw;
  z-index: 100;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.home-main .products-slider .products .product .img-wrap, .home-main .products-slider .products .first-product .product .img-wrap {
  width: 100%;
  aspect-ratio: 396/424;
}
.home-main .products-slider .products .product .img-wrap img, .home-main .products-slider .products .first-product .product .img-wrap img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  aspect-ratio: 396/424;
}
.home-main .products-slider .products .product .info, .home-main .products-slider .products .first-product .product .info {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  z-index: 100;
  width: 100%;
  padding-top: 1.5rem;
  padding-inline: 3.2828282828%;
}
.home-main .products-slider .products .product .info h6, .home-main .products-slider .products .first-product .product .info h6 {
  font-size: 1.563rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
  position: relative;
}
.home-main .products-slider .products .product .info h6 .discount-span, .home-main .products-slider .products .first-product .product .info h6 .discount-span {
  bottom: 100%;
  font-size: 1rem;
  opacity: 0;
}
.home-main .products-slider .products .product .info .bottom, .home-main .products-slider .products .first-product .product .info .bottom {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.home-main .products-slider .products .product .info .bottom span, .home-main .products-slider .products .first-product .product .info .bottom span {
  color: #18072F;
  font-size: 1.125rem;
}
.home-main .products-slider .products .product .info .bottom span.right, .home-main .products-slider .products .first-product .product .info .bottom span.right {
  text-transform: uppercase;
}
.home-main .products-slider .products .product.sale .discount-span, .home-main .products-slider .products .first-product .product.sale .discount-span {
  opacity: 1 !important;
}
.home-main .products-slider .products .product.sale .price .original, .home-main .products-slider .products .first-product .product.sale .price .original {
  font-size: 1rem;
  text-decoration: line-through;
  position: absolute;
  bottom: 101.5%;
  right: 0;
}
.home-main .products-slider .products .product.sale .price .discount, .home-main .products-slider .products .first-product .product.sale .price .discount {
  font-size: 1.125rem;
  opacity: 1 !important;
  position: static;
}
.home-main .products-slider .products .product:hover h6, .home-main .products-slider .products .first-product .product:hover h6 {
  text-decoration: underline;
}
.home-main .patisserie-dashboard {
  z-index: 3;
  position: relative;
  margin-top: -1px;
  padding-top: 12rem;
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .patisserie-dashboard h6 {
  font-family: "Satoshi", sans-serif;
  font-size: 1.375rem;
  font-weight: 400;
  margin-bottom: 1rem;
  text-transform: uppercase;
  color: #18072F;
}
.home-main .patisserie-dashboard h2 {
  font-size: 3.75rem;
}
.home-main .patisserie-dashboard .bullets {
  width: 100%;
  margin: 6.25rem 0 7.813rem 0;
  padding-inline: 7%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}
.home-main .patisserie-dashboard .bullets .bullet {
  width: 24.3%;
}
.home-main .patisserie-dashboard .bullets .bullet .img-wrap {
  aspect-ratio: 398/508;
  width: 100%;
  background-color: #FAFAFB;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.home-main .patisserie-dashboard .bullets .bullet .img-wrap .img-container {
  width: 97%;
  aspect-ratio: 398/508;
  mix-blend-mode: multiply;
  background-repeat: no-repeat;
  background-color: rgba(0, 0, 0, 0);
  background-size: contain;
  background-position: center;
}
.home-main .patisserie-dashboard .bullets .bullet h6 {
  font-weight: 500;
  text-transform: uppercase !important;
}
.home-main .patisserie-dashboard .bullets .bullet {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1.563rem;
}
.home-main .patisserie-dashboard .bullets .bullet:hover h6 {
  text-decoration: underline;
}
.home-main .two-categories {
  z-index: 3;
  position: relative;
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  padding: 13rem 7% 14rem 7%;
  margin-top: -1px;
}
.home-main .two-categories .arrow-link {
  color: #18072F !important;
}
.home-main .two-categories .one-category {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.home-main .two-categories .one-category .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
  margin-top: 2.188rem;
  margin-bottom: 2rem;
}
.home-main .two-categories .one-category {
  width: 48.2%;
}
.home-main .two-categories .one-category .img-wrap {
  aspect-ratio: 1/1;
  width: 100%;
  background-color: #FAFAFB;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.home-main .two-categories .one-category .img-wrap .img-container {
  width: 100%;
  aspect-ratio: 1/1;
  mix-blend-mode: multiply;
  background-color: #FAFAFB;
  object-fit: cover;
  background-size: cover;
  background-position: center;
}
.home-main .photos {
  z-index: 3;
  position: relative;
  background-color: white;
  padding-inline: 7%;
}
.home-main .photos .headings {
  width: 75%;
  margin-bottom: 6.875rem;
}
.home-main .photos .headings h6 {
  font-size: 1.563rem;
  text-transform: uppercase;
  font-weight: 400;
  color: #18072F;
  margin-bottom: 1.063rem;
}
.home-main .photos .headings h2, .home-main .photos .headings h3 {
  margin-bottom: 3.875rem;
}
.home-main .photos .headings h4 {
  width: 86%;
}
.home-main .photos .gallery {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 3.125rem;
  width: 100%;
}
.home-main .photos .gallery .top {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.home-main .photos .gallery .top img {
  width: 59%;
  aspect-ratio: 974/611;
  object-fit: cover;
  object-position: center;
}
.home-main .photos .gallery .center {
  width: 85%;
  align-self: flex-end;
  aspect-ratio: 1398/696;
  object-fit: cover;
  object-position: center;
}
.home-main .photos .gallery .bottom {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5.2%;
  padding-left: 4.6%;
  position: relative;
}
.home-main .photos .gallery .bottom svg {
  position: absolute;
  bottom: 0;
}
.home-main .photos .gallery .bottom .right {
  width: 31%;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: center;
}
.home-main .photos .gallery .bottom .left {
  width: 46.5%;
  aspect-ratio: 767/481;
  object-fit: cover;
  object-position: center;
  position: relative;
  transform: translateY(-50%);
}
.home-main .branches {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 7.438rem;
  width: 100%;
  margin-top: 14.375rem;
  margin-bottom: 4.188rem;
}
.home-main .branches h3 {
  text-transform: uppercase;
}
.home-main .branches .row {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
  gap: 0;
  width: 100%;
}
.home-main .branches .row .branch {
  position: relative;
  background-size: cover;
  background-position: center;
  width: 46%;
  aspect-ratio: 897/720;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0;
  padding: 0 4.063rem 3.313rem 4.063rem;
  height: auto;
}
.home-main .branches .row .branch .bottom {
  width: 100%;
  height: 100%;
  position: relative;
}
.home-main .branches .row .branch .bottom .content {
  position: absolute;
  bottom: 0;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0;
}
.home-main .branches .row .branch h6 {
  margin-bottom: 0.75rem;
  font-size: 1.375rem;
  font-weight: 400;
  margin-bottom: 1rem;
  text-transform: uppercase;
  color: white;
  position: relative;
  z-index: 2;
}
.home-main .branches .row .branch h2 {
  color: #FFFFFF;
  position: relative;
  z-index: 2;
  margin-bottom: 1.5rem;
}
.home-main .branches .row .branch svg {
  position: relative;
  z-index: 2;
}
.home-main .branches .row .branch a {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.125rem;
  text-decoration: underline;
  color: #FFFFFF;
  font-size: 1.563rem;
  transition: ease-out 0.2s;
  position: relative;
  z-index: 2;
}
.home-main .branches .row .branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(24, 7, 47, 0) 0%, #18072F 100%) no-repeat padding-box;
  z-index: 1;
}
.home-main .why-come {
  margin-bottom: 12rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .why-come .arrows {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
}
.home-main .why-come .arrows svg {
  transition: ease-out 0.15s;
  cursor: pointer;
}
.home-main .why-come .arrows svg path {
  transition: ease-out 0.1s;
}
.home-main .why-come .arrows svg.disabled {
  pointer-events: none;
}
.home-main .why-come .arrows svg.disabled path {
  stroke: #FFD7BC;
}
.home-main .why-come .arrows .right:hover {
  transform: translateX(0.375rem);
}
.home-main .why-come .arrows .left:hover {
  transform: translateX(-0.375rem);
}
.home-main .why-come .vl {
  margin-bottom: 3.813rem;
  height: 17.625rem;
  width: 2px;
  flex: 1.75px 1.75px 1.75px;
  background-color: #F09662;
}
.home-main .why-come .dots {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
}
.home-main .why-come .dots svg {
  transition: ease-out 0.2s;
  cursor: pointer;
}
.home-main .why-come .dots svg path {
  transition: ease-out 0.2s;
}
.home-main .why-come .dots svg.active {
  transform: scale(1.0458181818);
  pointer-events: none;
}
.home-main .why-come .dots svg.active .border {
  opacity: 1;
}
.home-main .why-come .dots svg.active .inner {
  opacity: 1;
}
.home-main .why-come .dots svg:hover .border {
  opacity: 0.75;
}
.home-main .why-come .slides {
  scrollbar-width: none;
}
.home-main .why-come .slides::-webkit-scrollbar {
  display: none;
}
.home-main .why-come .slides-wrap {
  position: relative;
}
.home-main .why-come .slides-wrap .arrows {
  top: 3.813rem;
  right: 13%;
  background-color: white;
}
.home-main .why-come .slides-wrap .slides {
  margin-top: 3.813rem;
  position: relative;
  margin-bottom: 6.2rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  overflow-x: scroll;
  touch-action: pan-y;
  transition: 0.3s;
}
.home-main .why-come .slides-wrap .slides .slide-wrap {
  flex-shrink: 0;
  width: 100%;
  position: relative;
  height: fit-content;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide {
  width: 74%;
  position: relative;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading {
  top: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading h6 {
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
  font-size: 1.813rem;
  margin-inline: 1.938rem;
  text-wrap: nowrap;
  text-transform: uppercase;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading .vl {
  height: 1.813rem;
  width: 1.5px;
  flex: 0 0 1.5px;
  background-color: #F09662;
  margin: 0;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading .hr {
  width: 100%;
  height: 2px;
  flex: 1.75px 1.75px 1.75px;
  background-color: #F09662;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .border-left {
  width: 1.5px;
  background-color: #F09662;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .border-bottom {
  height: 2px;
  flex: 1.75px 1.75px 1.75px;
  background-color: #F09662;
  width: 30%;
  position: absolute;
  left: 0;
  bottom: 0;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .inner {
  margin-bottom: 5.813rem;
  margin-top: 3.625rem;
  padding-left: 15%;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .inner h5 {
  font-size: 2.813rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
  margin-bottom: 1.563rem;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide .inner p {
  font-weight: 300;
  color: #18072F;
  font-size: 1.563rem;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 6.5%;
}
.home-main .why-come .slides-wrap .slides .slide-wrap .slide img {
  position: relative;
  top: 3.813rem;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 599/459;
  width: 41%;
  margin-bottom: 3.813rem;
  flex-shrink: 0;
}
.home-main .story {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  padding-left: 5%;
  padding-right: 14%;
  margin-bottom: 16.25rem;
}
.home-main .story .left {
  position: relative;
  margin-top: 9rem;
  width: 40%;
  margin-bottom: 9.5rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .story .left .inner {
  width: 100%;
  position: relative;
  left: 25%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.home-main .story .left .inner h6 {
  font-size: 1.375rem;
  font-family: "Satoshi", sans-serif;
  text-transform: uppercase;
  color: #18072F;
  font-weight: 400;
}
.home-main .story .left .inner h3 {
  font-family: "Quiche Sans", sans-serif;
  font-size: 3.75rem;
  margin: 0.938rem 0 2.813rem 0;
}
.home-main .story .left .inner p {
  font-size: 1.563rem;
  font-weight: 300;
}
.home-main .story .left .inner a {
  margin-top: 2.813rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.125rem;
  text-decoration: underline;
  color: #F09662;
  font-size: 1.563rem;
  transition: ease-out 0.2s;
  position: relative;
  z-index: 2;
}
.home-main .story .left .butterfly {
  align-self: flex-start;
  position: absolute;
  bottom: -9.5rem;
}
.home-main .story .right {
  width: 33%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .story .right img {
  width: 100%;
  aspect-ratio: 512/768;
  object-fit: cover;
  object-position: center;
}
.home-main .story .right svg {
  transform: translateY(-33%);
}
.home-main .exclusive-wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  width: 100%;
}
.home-main .white-hr {
  height: 1px;
  width: 100%;
  background-color: white;
  border: 0;
  position: relative;
  z-index: 100;
}
.home-main .exclusive {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 8rem;
  width: 100%;
}
.home-main .exclusive .row .separator {
  width: 1px;
}
.home-main .exclusive .row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.home-main .exclusive .row .service {
  width: 50%;
  aspect-ratio: 960/785;
  background-size: cover;
  background-position: center;
  position: relative;
}
.home-main .exclusive .row .service.bottom-align {
  background-position: bottom center;
}
.home-main .exclusive .row .service a {
  height: fit-content;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  z-index: 3;
  width: 35vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.75rem;
}
.home-main .exclusive .row .service a h4 {
  font-family: "Quiche Sans", sans-serif;
  font-size: 3.75rem;
  color: white;
  width: 100%;
  text-align: center;
}
.home-main .exclusive .row .service a p {
  font-size: 1.563rem;
  font-weight: 300;
  color: white;
  text-align: center;
}
.home-main .exclusive .row .service a svg {
  transition: ease-out 0.2s;
}
.home-main .exclusive .row .service a:hover svg {
  transform: translateX(0.375rem);
}
.home-main .exclusive .row .service::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(240, 181, 137, 0.5) 0%, rgba(24, 7, 47, 0.75) 100%) no-repeat padding-box;
  z-index: 1;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.home-main .newsletter .newsletter-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  width: 100%;
  height: 100%;
}
.home-main .newsletter {
  position: relative;
  background-color: #18072F;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  height: 39.125rem;
}
.home-main .newsletter .content {
  position: relative;
  z-index: 2;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .newsletter .content p {
  margin-top: 2.813rem;
  margin-bottom: 2.813rem;
  color: white;
  font-size: 1.25rem;
  font-weight: 400;
}
.home-main .newsletter .content h5 {
  font-size: 2.813rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  text-transform: uppercase;
  color: white;
}
.home-main .newsletter .content .main-btn {
  cursor: pointer;
  border: 1px solid #F09662;
  position: absolute;
  top: 90%;
  z-index: 2;
  transition: ease-out 0.2s;
}
.home-main .newsletter .content .main-btn:hover {
  background-color: rgba(255, 0, 0, 0);
}
.home-main .newsletter .content .main-btn.fade {
  opacity: 0;
  z-index: 1;
  pointer-events: none;
}
.home-main .newsletter .content form {
  width: 100%;
  top: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.home-main .newsletter .content form .form-wrap {
  align-self: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  max-width: 33.375rem;
  border-bottom: 1px solid #F09662;
}
.home-main .newsletter .content form .form-wrap input {
  font-size: 1.25rem;
  background-color: rgba(255, 0, 0, 0);
  border: 0;
  outline: 0;
  color: #FFFFFF;
  padding-bottom: 0.625rem;
  width: 100%;
  padding-right: 1rem;
}
.home-main .newsletter .content form .form-wrap input::placeholder {
  color: #FFFFFF;
  font-weight: 300;
}
.home-main .newsletter .content form .form-wrap button {
  height: 1.538rem;
  background-color: rgba(255, 0, 0, 0);
  outline: none;
  border: 0;
  cursor: pointer;
  transition: ease-out 0.2s;
}
.home-main .newsletter .content form .form-wrap button:hover {
  transform: translateX(0.308rem);
}
.home-main .newsletter .content form .checkbox-container {
  position: relative;
  align-self: center;
  width: 80%;
  max-width: 72.438rem;
  margin-top: 7.813rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.25rem;
}
.home-main .newsletter .content form .checkbox-container p {
  color: white;
  font-size: 1rem !important;
  width: 100%;
  margin: 0 !important;
  text-align: left !important;
}
.home-main .newsletter .content form .checkbox-container p a {
  color: #F09662;
  font-weight: 500;
  text-decoration: underline;
}
.home-main .newsletter .content form .checkbox-container label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  display: flex;
  position: relative;
  flex-shrink: 0;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem #F09662;
}
.home-main .newsletter .content form .checkbox-container label:hover {
  box-shadow: inset 0 0 0 0.16rem #F09662;
}
.home-main .newsletter .content form .checkbox-container label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.home-main .newsletter .content form .checkbox-container label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.home-main .newsletter .content form .checkbox-container label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.home-main .newsletter .content form .checkbox-container label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.home-main .newsletter .content form .checkbox-container label input:checked + span svg {
  opacity: 1;
}
.home-main .newsletter .content form .checkbox-container label input:checked + span {
  background-color: #F09662;
}
.home-main .newsletter .circle {
  position: absolute;
  bottom: -15%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  gap: 0;
  aspect-ratio: 213/71;
  width: 37%;
  opacity: 0.7;
  align-self: center;
}
.home-main .newsletter .left-b {
  position: absolute;
  top: 7.438rem;
  z-index: 3;
  left: 5%;
}
.home-main .newsletter .right-b {
  position: absolute;
  bottom: 7.438rem;
  z-index: 3;
  right: 5%;
}
.home-main .newsletter::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
}
.home-main .instagram {
  position: relative;
  z-index: 6;
  background-color: white;
}
.home-main .instagram h5 {
  font-size: 2.188rem;
  font-weight: 500;
  font-family: "Quiche Sans", sans-serif;
  text-transform: uppercase;
  color: #18072F;
}
.home-main .instagram p {
  text-align: center;
  color: #F09662;
  font-size: 1.563rem;
  font-weight: 400;
  max-width: 48.688rem;
  margin: 3.063rem 0 5.813rem 0;
}
.home-main .instagram {
  padding: 16.25rem 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.home-main .instagram .posts {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 3.3%;
}
.home-main .instagram .posts a {
  width: 15.5%;
}
.home-main .instagram .posts a img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1/1;
  background-position: center;
}
.home-main .instagram .posts a {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.25rem;
  color: #18072F;
  font-size: 1.563rem;
}
.home-main .home-hr {
  width: 86%;
  border: 0;
  height: 1.5px;
  margin-inline: 7%;
  background-color: #F09662;
}

@media only screen and (max-width: 1020px) {
  .home-main .tea {
    padding-top: 5rem;
  }
  .home-main .tea .mobile-arrows-why-come {
    margin-top: -7vh;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    color: #18072F;
    position: relative;
    z-index: 3;
    font-size: 1.385rem;
  }
  .home-main .tea .mobile-arrows-why-come svg {
    transition: ease-out 0.15s;
    cursor: pointer;
  }
  .home-main .tea .mobile-arrows-why-come svg path {
    transition: ease-out 0.1s;
  }
  .home-main .tea .mobile-arrows-why-come svg.disabled {
    pointer-events: none;
  }
  .home-main .tea .mobile-arrows-why-come svg.disabled path {
    stroke: #FFD7BC;
  }
  .home-main .tea .mobile-arrows-why-come .right:hover {
    transform: translateX(0.375rem);
  }
  .home-main .tea .mobile-arrows-why-come .left:hover {
    transform: translateX(-0.375rem);
  }
  .home-main .tea {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
  }
  .home-main .tea .arrows {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
  }
  .home-main .tea .arrows svg {
    transition: ease-out 0.15s;
    cursor: pointer;
  }
  .home-main .tea .arrows svg path {
    transition: ease-out 0.1s;
  }
  .home-main .tea .arrows svg.disabled {
    pointer-events: none;
  }
  .home-main .tea .arrows svg.disabled path {
    stroke: #FFD7BC;
  }
  .home-main .tea .arrows .right:hover {
    transform: translateX(0.375rem);
  }
  .home-main .tea .arrows .left:hover {
    transform: translateX(-0.375rem);
  }
  .home-main .tea .vl {
    margin-bottom: 3.813rem;
    height: 16.538rem;
    width: 1px;
    flex: 1.75px 1.75px 1.75px;
    background-color: #F09662;
  }
  .home-main .tea .dots {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
  }
  .home-main .tea .dots svg {
    transition: ease-out 0.2s;
    cursor: pointer;
  }
  .home-main .tea .dots svg path {
    transition: ease-out 0.2s;
  }
  .home-main .tea .dots svg.active {
    transform: scale(1.0458181818);
    pointer-events: none;
  }
  .home-main .tea .dots svg.active .border {
    opacity: 1;
  }
  .home-main .tea .dots svg.active .inner {
    opacity: 1;
  }
  .home-main .tea .dots svg:hover .border {
    opacity: 0.75;
  }
  .home-main .tea .slides {
    width: 100vw !important;
    scrollbar-width: none;
  }
  .home-main .tea .slides::-webkit-scrollbar {
    display: none;
  }
  .home-main .tea .slides-wrap {
    width: 100vw !important;
    min-width: 0;
    position: relative;
  }
  .home-main .tea .slides-wrap .arrows {
    left: 0 !important;
    background-color: white;
    position: absolute;
    bottom: 0 !important;
    height: fit-content;
  }
  .home-main .tea .slides-wrap .slides {
    width: 100vw !important;
    margin-top: 3.813rem;
    position: relative;
    margin-bottom: 6.2rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    width: 100%;
    overflow-x: scroll;
    min-width: 0;
    touch-action: pan-y;
    transition: 0.3s;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap {
    height: 80vh;
    flex-shrink: 0;
    width: 100%;
    position: relative;
    height: fit-content;
    min-width: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    padding-bottom: 40%;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide {
    height: 100%;
    min-width: 0;
    width: 93%;
    margin-top: 0;
    position: relative;
    flex-direction: column-reverse !important;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .heading {
    top: 0;
    left: 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .heading h6 {
    font-family: "Quiche Sans", sans-serif;
    color: #18072F;
    font-weight: 400;
    font-size: 1.231rem;
    margin-inline: 1.308rem;
    text-wrap: nowrap;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .heading .vl {
    height: 1.077rem;
    width: 1.5px;
    flex: 0 0 1.5px;
    background-color: #F09662;
    margin: 0;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .heading .hr {
    width: 100%;
    height: 1.5px;
    flex: 1.5px 1.5px 1.5px;
    background-color: #F09662;
    margin-left: 12%;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .border-left {
    width: 1.5px;
    background-color: #F09662;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .border-bottom {
    height: 1.5px;
    flex: 1.5px 1.5px 1.5px;
    background-color: #F09662;
    width: 15%;
    position: absolute;
    right: 0;
    bottom: 0;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .inner {
    margin-bottom: 25%;
    margin-top: 2.154rem;
    padding-left: 12%;
    padding-right: 12%;
    min-width: 0;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .inner h5 {
    font-size: 1.615rem;
    font-family: "Quiche Sans", sans-serif;
    color: #18072F;
    font-weight: 400;
    margin-bottom: 1.563rem;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide .inner p {
    font-weight: 300;
    color: #18072F;
    font-size: 1.154rem;
    margin-bottom: 1.5rem;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 6.5%;
  }
  .home-main .tea .slides-wrap .slides .slide-wrap .slide img {
    position: relative;
    top: 0 !important;
    margin-top: -50%;
    right: 22%;
    transform: translateY(50%);
    object-fit: cover;
    margin-bottom: 50%;
    object-position: center;
    aspect-ratio: 302/336;
    width: 75%;
    margin-bottom: 0rem;
    align-self: flex-end;
  }
  .home-main .hero .banners .banner {
    padding-bottom: 12%;
    justify-content: flex-end !important;
    align-items: center !important;
  }
  .home-main .hero .banners .banner h2 {
    font-size: 2.308rem;
    text-align: center;
    max-width: 80%;
  }
  .home-main .hero .banners .banner .arrow-link {
    font-size: 1.231rem !important;
  }
  .home-main .hero .banners .banner .arrow-link svg {
    height: 1rem;
    width: 0.462rem;
  }
  .home-main .products-slider {
    padding-top: 3.231rem;
  }
  .home-main .products-slider .heading h4 {
    font-size: 1.846rem;
  }
  .home-main .products-slider .heading .arrows {
    display: none !important;
  }
  .home-main .products-slider.special h4 {
    font-size: 1.231rem;
  }
  .home-main .products-slider.special h2 {
    font-size: 2.692rem;
  }
  .home-main .products-slider.special .main-btn {
    margin-top: 2.5rem !important;
  }
  .home-main .products-slider .products {
    scroll-snap-type: x mandatory;
    gap: 10% !important;
  }
  .home-main .products-slider .products .first-product {
    max-width: 17.692rem;
    flex: 0 0 65% !important;
    width: 65% !important;
    box-sizing: content-box;
    flex-shrink: 0;
    aspect-ratio: auto !important;
    flex-shrink: 0;
    display: flex;
    scroll-snap-align: start !important;
  }
  .home-main .products-slider .products .first-product .product {
    scroll-snap-align: none !important;
    flex: 1;
    width: 100% !important;
    flex: 0 0 100% !important;
  }
  .home-main .products-slider .products .product {
    scroll-snap-align: start;
    max-width: 17.692rem;
    flex-shrink: 0;
    width: 47.5vw !important;
    aspect-ratio: auto !important;
  }
  .home-main .products-slider .products .product .img-wrap {
    aspect-ratio: 209/232;
  }
  .home-main .products-slider .products .product .img-wrap img {
    aspect-ratio: 209/232;
  }
  .home-main .products-slider .products .product .info {
    padding-top: 1.385rem !important;
    padding-inline: 6.6985645933% !important;
    gap: 0.462rem !important;
  }
  .home-main .products-slider .products .product .info h6 {
    font-size: 1.308rem !important;
    font-family: "Satoshi";
    font-weight: 400;
  }
  .home-main .products-slider .products .product .info .price {
    font-size: 1rem !important;
  }
  .home-main .products-slider .products .product .info .right {
    display: none;
  }
  .home-main .products-slider .products .product .info {
    flex-direction: column !important;
    gap: 0.538rem !important;
    align-items: flex-start !important;
  }
  .home-main .products-slider .products .product .discount-span {
    font-size: 0.923rem;
  }
  .home-main .products-slider .products .product.sale .price {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
  .home-main .products-slider .products .product.sale .price .original {
    font-size: 0.769rem;
    position: static;
  }
  .home-main .products-slider .products .product.sale .price .discount {
    font-size: 1rem;
  }
  .home-main .patisserie-dashboard h6 {
    text-transform: none !important;
    font-size: 1.231rem !important;
  }
  .home-main .patisserie-dashboard h2 {
    font-size: 2.692rem !important;
    text-align: center;
  }
  .home-main .patisserie-dashboard .bullets {
    margin: 3.846rem 0 !important;
    gap: 6%;
    flex-wrap: wrap;
  }
  .home-main .patisserie-dashboard .bullets .bullet {
    width: 47% !important;
  }
  .home-main .patisserie-dashboard .bullets .bullet h6 {
    font-size: 1rem !important;
    text-align: center;
  }
  .home-main .two-categories {
    padding-top: 6rem !important;
    flex-direction: column;
    padding-bottom: 6rem !important;
    gap: 3vh;
    padding-bottom: 0 !important;
  }
  .home-main .two-categories .one-category {
    width: 100%;
  }
  .home-main .two-categories .row {
    flex-wrap: wrap;
  }
  .home-main .two-categories .row h4 {
    font-size: 1.692rem;
  }
  .home-main .two-categories .row .arrow-link {
    color: #18072F !important;
  }
  .home-main .photos .headings {
    padding-left: 0.308rem;
    margin-bottom: 2.692rem !important;
    width: 100%;
  }
  .home-main .photos .headings h6 {
    text-transform: none;
    font-size: 1.231rem;
  }
  .home-main .photos .headings h2 {
    font-size: 1.923rem;
    width: 100%;
    margin-bottom: 2.154rem !important;
  }
  .home-main .photos .headings h3 {
    font-size: 1.538rem;
    width: 100%;
    margin-bottom: 2.154rem !important;
  }
  .home-main .photos .headings h4 {
    font-size: 1.231rem;
    width: 100%;
  }
  .home-main .photos .gallery {
    gap: 1.231rem !important;
  }
  .home-main .photos .gallery .top {
    align-items: center !important;
    gap: 5%;
  }
  .home-main .photos .gallery .top img {
    flex-grow: 1;
    max-width: 100%;
  }
  .home-main .photos .gallery .top svg {
    flex-shrink: 0;
    width: 25%;
    height: auto;
    max-width: 125px;
  }
  .home-main .photos .gallery .center {
    opacity: 1 !important;
    width: 94% !important;
  }
  .home-main .photos .gallery .bottom {
    margin-top: 1.231rem;
    opacity: 1 !important;
    flex-direction: column;
    padding-left: 4% !important;
  }
  .home-main .photos .gallery .bottom .left {
    transform: translateY(0);
    width: 74% !important;
    margin-bottom: -18%;
  }
  .home-main .photos .gallery .bottom .right {
    width: 54.5% !important;
    left: 40% !important;
    position: relative;
    top: 50% !important;
  }
  .home-main .photos .gallery .bottom .orange {
    height: auto;
    width: 14%;
    max-width: 7rem;
    left: 0;
    min-width: 4.25rem;
  }
  .home-main .photos .gallery .bottom .blue {
    position: absolute;
    top: 0;
    left: 82%;
    width: 12%;
    height: auto;
    max-width: 75px;
  }
  .home-main .branches {
    margin-top: 8.846rem;
    gap: 3.769rem !important;
  }
  .home-main .branches h3 {
    text-align: center;
    font-size: 1.923rem;
    padding-inline: 5%;
    max-width: 435px;
  }
  .home-main .branches .row {
    padding-inline: 4%;
    gap: 1.538rem !important;
    flex-direction: column !important;
  }
  .home-main .branches .row .branch {
    width: 100%;
    aspect-ratio: 394/345;
    padding-inline: 9%;
    padding-bottom: 8%;
  }
  .home-main .branches .row .branch svg {
    width: 2.769rem;
    height: 1.846rem;
    flex-shrink: 0;
  }
  .home-main .branches .row .branch h6 {
    font-size: 1.538rem;
    text-transform: none;
  }
  .home-main .branches .row .branch h2 {
    font-size: 2.692rem;
  }
  .home-main .why-come {
    margin-bottom: 6rem;
  }
  .home-main .why-come .mobile-arrows-why-come {
    margin-top: -7vh;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    color: #18072F;
    position: relative;
    z-index: 3;
    font-size: 1.385rem;
  }
  .home-main .why-come .mobile-arrows-why-come svg {
    transition: ease-out 0.15s;
    cursor: pointer;
  }
  .home-main .why-come .mobile-arrows-why-come svg path {
    transition: ease-out 0.1s;
  }
  .home-main .why-come .mobile-arrows-why-come svg.disabled {
    pointer-events: none;
  }
  .home-main .why-come .mobile-arrows-why-come svg.disabled path {
    stroke: #FFD7BC;
  }
  .home-main .why-come .mobile-arrows-why-come .right:hover {
    transform: translateX(0.375rem);
  }
  .home-main .why-come .mobile-arrows-why-come .left:hover {
    transform: translateX(-0.375rem);
  }
  .home-main .why-come {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
  }
  .home-main .why-come .arrows {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
  }
  .home-main .why-come .arrows svg {
    transition: ease-out 0.15s;
    cursor: pointer;
  }
  .home-main .why-come .arrows svg path {
    transition: ease-out 0.1s;
  }
  .home-main .why-come .arrows svg.disabled {
    pointer-events: none;
  }
  .home-main .why-come .arrows svg.disabled path {
    stroke: #FFD7BC;
  }
  .home-main .why-come .arrows .right:hover {
    transform: translateX(0.375rem);
  }
  .home-main .why-come .arrows .left:hover {
    transform: translateX(-0.375rem);
  }
  .home-main .why-come .vl {
    margin-bottom: 3.813rem;
    height: 16.538rem;
    width: 1px;
    flex: 1.75px 1.75px 1.75px;
    background-color: #F09662;
  }
  .home-main .why-come .dots {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
  }
  .home-main .why-come .dots svg {
    transition: ease-out 0.2s;
    cursor: pointer;
  }
  .home-main .why-come .dots svg path {
    transition: ease-out 0.2s;
  }
  .home-main .why-come .dots svg.active {
    transform: scale(1.0458181818);
    pointer-events: none;
  }
  .home-main .why-come .dots svg.active .border {
    opacity: 1;
  }
  .home-main .why-come .dots svg.active .inner {
    opacity: 1;
  }
  .home-main .why-come .dots svg:hover .border {
    opacity: 0.75;
  }
  .home-main .why-come .slides {
    width: 100vw !important;
    scrollbar-width: none;
  }
  .home-main .why-come .slides::-webkit-scrollbar {
    display: none;
  }
  .home-main .why-come .slides-wrap {
    width: 100vw !important;
    min-width: 0;
    position: relative;
  }
  .home-main .why-come .slides-wrap .arrows {
    left: 0 !important;
    background-color: white;
    position: absolute;
    bottom: 0 !important;
    height: fit-content;
  }
  .home-main .why-come .slides-wrap .slides {
    width: 100vw !important;
    margin-top: 3.813rem;
    position: relative;
    margin-bottom: 6.2rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    width: 100%;
    overflow-x: scroll;
    min-width: 0;
    touch-action: pan-y;
    transition: 0.3s;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap {
    height: 80vh;
    flex-shrink: 0;
    width: 100%;
    position: relative;
    height: fit-content;
    min-width: 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 0;
    padding-bottom: 30%;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide {
    height: 100%;
    min-width: 0;
    width: 93%;
    position: relative;
    flex-direction: column !important;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading {
    top: 0;
    left: 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading h6 {
    font-family: "Quiche Sans", sans-serif;
    color: #18072F;
    font-weight: 400;
    font-size: 1.231rem;
    margin-inline: 1.308rem;
    text-wrap: nowrap;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading .vl {
    height: 1.077rem;
    width: 1.5px;
    flex: 0 0 1.5px;
    background-color: #F09662;
    margin: 0;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .heading .hr {
    width: 100%;
    height: 1.5px;
    flex: 1.5px 1.5px 1.5px;
    background-color: #F09662;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .border-left {
    width: 1.5px;
    background-color: #F09662;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .border-bottom {
    height: 1.5px;
    flex: 1.5px 1.5px 1.5px;
    background-color: #F09662;
    width: 15%;
    position: absolute;
    left: 0;
    bottom: 0;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .inner {
    margin-bottom: 25%;
    margin-top: 2.154rem;
    padding-left: 12%;
    padding-right: 12%;
    min-width: 0;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .inner h5 {
    font-size: 1.615rem;
    font-family: "Quiche Sans", sans-serif;
    color: #18072F;
    font-weight: 400;
    margin-bottom: 1.563rem;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide .inner p {
    font-weight: 300;
    color: #18072F;
    font-size: 1.154rem;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 6.5%;
  }
  .home-main .why-come .slides-wrap .slides .slide-wrap .slide img {
    position: relative;
    top: 0 !important;
    margin-top: -50%;
    transform: translateY(50%);
    object-fit: cover;
    margin-bottom: 50%;
    object-position: center;
    aspect-ratio: 302/254;
    width: 75%;
    margin-bottom: 0rem;
    align-self: flex-end;
  }
  .home-main .story {
    margin-bottom: 3rem;
    flex-direction: column !important;
    padding-inline: 7% !important;
  }
  .home-main .story .left {
    margin-top: 0;
    width: 100%;
    position: relative;
    margin-bottom: 3.231rem;
  }
  .home-main .story .left .butterfly {
    width: 17%;
    height: auto;
    top: 0;
    right: 0;
  }
  .home-main .story .left a {
    display: none !important;
  }
  .home-main .story .left .inner {
    left: 0;
  }
  .home-main .story .left .inner h6 {
    font-size: 1.385rem;
    text-transform: none;
  }
  .home-main .story .left .inner h3 {
    font-size: 1.923rem;
    margin: 0.769rem 0 1.846rem 0;
  }
  .home-main .story .left .inner p {
    font-size: 1.538rem;
  }
  .home-main .story .right {
    width: 100%;
  }
  .home-main .story .right svg {
    transform: scale(-1, 1) translateY(-54%);
    width: 41%;
    height: auto;
  }
  .home-main .story .right img {
    aspect-ratio: 358/366;
  }
  .home-main .exclusive {
    gap: 4rem;
  }
  .home-main .exclusive h3 {
    font-size: 1.923rem;
    padding-inline: 5%;
    text-align: center;
  }
  .home-main .exclusive .row {
    flex-direction: column;
    gap: 0 !important;
  }
  .home-main .exclusive .row .separator {
    height: 2px;
    width: 100%;
  }
  .home-main .exclusive .row .service {
    aspect-ratio: 430/348;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    position: relative !important;
    justify-content: center;
    left: 0;
    top: 0;
  }
  .home-main .exclusive .row .service a {
    position: absolute;
    top: 50%;
    left: 50%;
    gap: 4vw;
    width: 75vw;
  }
  .home-main .exclusive .row .service a p {
    font-size: 1.385rem;
    width: 95vw;
  }
  .home-main .exclusive .row .service a h4 {
    font-size: 2.692rem;
    text-align: center;
    padding-inline: 5%;
  }
  .home-main .newsletter {
    overflow: hidden;
    height: 42.692rem;
  }
  .home-main .newsletter .circle {
    width: 50% !important;
    bottom: -2rem;
    max-width: 30rem;
    min-width: 19rem;
  }
  .home-main .newsletter .left-b {
    width: 3.615rem;
    height: 3.615rem;
    left: 4%;
    top: 1.4rem;
  }
  .home-main .newsletter .right-b {
    width: 2.9rem;
    height: 2.9rem;
    transform: rotate(90deg);
    right: 4%;
    bottom: 1.4rem;
  }
  .home-main .newsletter .content {
    padding-inline: 5%;
  }
  .home-main .newsletter .content p {
    font-size: 1.385rem;
    font-weight: 300;
    margin-top: 2.154rem !important;
    margin-bottom: 5rem !important;
    text-align: center;
    width: 100%;
  }
  .home-main .newsletter .content h5 {
    font-size: 2.308rem;
  }
  .home-main .newsletter .content .main-btn {
    z-index: 0;
    pointer-events: none;
    opacity: 0;
  }
  .home-main .newsletter .content .checkbox-container {
    width: 100% !important;
  }
  .home-main .newsletter .content .checkbox-container label {
    width: 2.154rem !important;
    height: 2.154rem !important;
  }
  .home-main .newsletter .content .checkbox-container {
    margin-top: 3.769rem !important;
  }
  .home-main .newsletter .content .checkbox-container p {
    font-weight: 300 !important;
  }
  .home-main .newsletter .content .checkbox-container p a {
    font-weight: 400 !important;
  }
  .home-main .instagram {
    padding: 5rem 0 7rem 0;
  }
  .home-main .instagram p {
    font-size: 1.385rem;
    padding-inline: 8%;
    margin: 2.308rem 0 1.923rem 0;
  }
  .home-main .instagram h5 {
    font-size: 1.923rem;
  }
  .home-main .instagram .posts {
    width: 100%;
    justify-content: flex-start;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    flex-shrink: 0;
    gap: 10%;
    padding-right: 16%;
    position: relative;
    left: 8%;
  }
  .home-main .instagram .posts a {
    flex: 0 0 60%;
    flex-shrink: 0;
    width: 60%;
    scroll-snap-align: start;
    max-width: 15.615rem;
    font-size: 1.154rem;
  }
  .home-main .instagram .posts {
    scrollbar-width: none;
  }
  .home-main .instagram .posts::-webkit-scrollbar {
    display: none;
  }
}
@media only screen and (max-width: 410px) {
  .home-main .instagram p {
    font-size: 1.231rem;
  }
}
@media only screen and (max-width: 365px) {
  .home-main .instagram p {
    font-size: 1.1rem;
  }
}
@keyframes scaleopacity {
  from {
    opacity: 0;
    transform: scale(0);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
.categories-main {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  height: 100%;
}
.categories-main h1 {
  width: 100%;
  text-align: center;
  padding-inline: 5%;
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  margin: 6.313rem 0;
  font-size: 3.125rem;
}
.categories-main .bullets {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: flex-end;
  gap: 0.25%;
  width: 100%;
  height: 100%;
  position: relative;
}
.categories-main .bullets .left-placeholder {
  width: 46%;
}
.categories-main .bullets .bullet {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  width: 49.75%;
  position: relative;
  background-color: #FAFAFB;
}
.categories-main .bullets .bullet svg {
  width: 26%;
  height: auto;
  position: absolute;
  z-index: 3;
  opacity: 0;
  transition: ease-out 0.5s;
}
.categories-main .bullets .bullet h6 {
  position: absolute;
  z-index: 3;
  bottom: 2.5rem;
  text-align: center;
  width: 100%;
  padding-inline: 5%;
  font-weight: 400;
  text-transform: uppercase;
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  transition: ease-out 0.5s;
}
.categories-main .bullets .bullet img {
  width: 75%;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: center;
  mix-blend-mode: multiply;
}
.categories-main .bullets .bullet::before {
  transition: ease-out 0.5s;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.35);
}
.categories-main .bullets .bullet:hover h6 {
  color: #18072F;
}
.categories-main .bullets .bullet:hover svg {
  opacity: 1;
}
.categories-main .bullets .bullet:hover::before {
  opacity: 1;
}
.categories-main .bullets .left {
  flex: 1;
  align-self: stretch;
  width: 46%;
  flex-grow: 1;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  align-items: flex-start;
  gap: 0;
}
.categories-main .bullets .left h6 {
  font-size: 2.188rem;
}
.categories-main .bullets .left .bullet {
  flex: 1;
  flex-grow: 1;
  width: 100%;
  height: 100%;
}
.categories-main .bullets .right {
  flex-wrap: wrap;
  width: 54%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.5%;
  row-gap: 0.5vh;
}
.categories-main .bullets .right .bullet {
  aspect-ratio: 518/554;
}
.categories-main .bullets .right .bullet h6 {
  font-size: 1.563rem;
}
.categories-main .bullets.special {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.2rem;
}
.categories-main .bullets.special .left {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.2rem;
}
.categories-main .bullets.special .left .bullet {
  position: relative;
  aspect-ratio: 960/1000;
}
.categories-main .bullets.special .right {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.2rem;
}
.categories-main .bullets.special .right .bullet {
  width: calc(25% - 0.15rem);
  aspect-ratio: 480/513;
}
.categories-main .accessories {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  width: 100%;
}
.categories-main .accessories .mobile-wrap {
  width: 66.6666666667%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
}
.categories-main .accessories .mobile-wrap .bullet {
  width: calc(50% - 0.125rem);
}
.categories-main .accessories .bullet {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  width: calc(33.333333% - 0.25rem);
  position: relative;
  background-color: #FAFAFB;
  aspect-ratio: 641/704;
}
.categories-main .accessories .bullet svg {
  width: 26%;
  height: auto;
  position: absolute;
  z-index: 3;
  opacity: 0;
  transition: ease-out 0.5s;
}
.categories-main .accessories .bullet h6 {
  position: absolute;
  z-index: 3;
  bottom: 3.75rem;
  font-size: 1.875rem;
  text-align: center;
  width: 100%;
  padding-inline: 5%;
  font-weight: 400;
  text-transform: uppercase;
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  transition: ease-out 0.5s;
}
.categories-main .accessories .bullet img {
  width: 75%;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: center;
  mix-blend-mode: multiply;
}
.categories-main .accessories .bullet::before {
  transition: ease-out 0.5s;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.35);
}
.categories-main .accessories .bullet:hover h6 {
  color: #18072F;
}
.categories-main .accessories .bullet:hover svg {
  opacity: 1;
}
.categories-main .accessories .bullet:hover::before {
  opacity: 1;
}

@media only screen and (max-width: 1020px) {
  .categories-main h1 {
    font-size: 1.923rem;
    margin: 4.615rem 0;
  }
  .categories-main .bullets {
    flex-direction: column !important;
  }
  .categories-main .bullets .bullet {
    justify-content: center;
  }
  .categories-main .bullets .bullet img {
    position: absolute;
    top: 10%;
    width: 83%;
  }
  .categories-main .bullets .bullet {
    aspect-ratio: 215/273 !important;
  }
  .categories-main .bullets .bullet h6 {
    bottom: 1.231rem !important;
    font-size: 1.231rem !important;
    padding-inline: 7%;
  }
  .categories-main .bullets .left {
    width: 100%;
    position: static;
    aspect-ratio: 430/371;
    margin-bottom: 0.5vh;
  }
  .categories-main .bullets .left img {
    top: 5%;
    aspect-ratio: 301/241;
  }
  .categories-main .bullets .left h6 {
    font-size: 1.385rem !important;
    bottom: 2.462rem !important;
  }
  .categories-main .bullets .left-placeholder {
    display: none;
  }
  .categories-main .bullets .right {
    width: 100%;
  }
  .categories-main .bullets.special {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
  }
  .categories-main .bullets.special .left {
    width: 100%;
    position: static;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.2rem;
    aspect-ratio: 430/742;
  }
  .categories-main .bullets.special .left .bullet {
    position: relative !important;
    aspect-ratio: 430/371 !important;
  }
  .categories-main .bullets.special .right {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.2rem;
  }
  .categories-main .bullets.special .right .bullet {
    width: calc(50% - 0.1rem);
    aspect-ratio: 480/513;
  }
  .categories-main .accessories {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.25rem;
    width: 100%;
  }
  .categories-main .accessories .mobile-wrap {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0.25rem;
  }
  .categories-main .accessories .mobile-wrap .bullet {
    width: 50%;
    aspect-ratio: 215/273;
  }
  .categories-main .accessories .mobile-wrap .bullet h6 {
    font-size: 1.231rem !important;
    bottom: 1.231rem;
  }
  .categories-main .accessories .bullet {
    width: 100%;
    aspect-ratio: 430/371;
  }
  .categories-main .accessories .bullet h6 {
    bottom: 2.462rem;
    font-size: 1.385rem;
  }
}
.two-categories-main {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  padding-inline: 7.3%;
}
.two-categories-main h1 {
  width: 100%;
  text-align: center;
  padding-inline: 5%;
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  margin: 6.313rem 0;
  font-size: 3.125rem;
}
.two-categories-main .links {
  width: 100%;
  position: relative;
  padding: 0.75rem 0 8.375rem 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 3%;
  border-bottom: 1px solid #F09662;
}
.two-categories-main .links .left-b {
  position: absolute;
  left: 0;
  top: 50%;
  width: 8.2%;
  height: auto;
}
.two-categories-main .links .right-b {
  position: absolute;
  right: 0;
  top: 0;
  width: 10.2%;
  height: auto;
}
.two-categories-main .links .category {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.563rem;
  width: 33%;
}
.two-categories-main .links .category .img-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  background-color: #FEF8F3;
  width: 100%;
  aspect-ratio: 539/622;
  transition: ease-out 0.5s;
  position: relative;
}
.two-categories-main .links .category .img-wrap img {
  width: 90%;
  mix-blend-mode: multiply;
}
.two-categories-main .links .category .img-wrap svg {
  width: 26%;
  height: auto;
  position: absolute;
  z-index: 3;
  opacity: 0;
  transition: ease-out 0.5s;
}
.two-categories-main .links .category .img-wrap:hover h6 {
  color: #18072F;
}
.two-categories-main .links .category .img-wrap:hover svg {
  opacity: 1;
}
.two-categories-main .links .category .img-wrap:hover::before {
  opacity: 1;
}
.two-categories-main .links .category .img-wrap::before {
  transition: ease-out 0.5s;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.35);
}
.two-categories-main .links .category .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  width: 100%;
}
.two-categories-main .links .category .row h6 {
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-size: 2.188rem;
  font-weight: 400;
}
.two-categories-main .links .category .row .arrow-link {
  color: #18072F;
}

@media only screen and (max-width: 1020px) {
  .two-categories-main h1 {
    font-size: 1.923rem;
    margin: 4.615rem 0;
  }
  .two-categories-main .links {
    flex-direction: column;
    gap: 4.615rem;
  }
  .two-categories-main .links .category .img-wrap {
    aspect-ratio: 336/376;
  }
  .two-categories-main .links .category {
    width: 100%;
  }
  .two-categories-main .links .category h6 {
    font-size: 1.692rem !important;
  }
  .two-categories-main .left-b, .two-categories-main .right-b {
    display: none;
  }
}
.category-nav {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
  height: 4.813rem;
  position: sticky;
  top: 6rem;
  z-index: 50;
  padding-inline: 7.3%;
  background: rgba(255, 255, 255, 0.8);
  /* Semi-transparent background */
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.category-nav .links {
  font-size: 1.125rem;
  background: rgba(255, 255, 255, 0);
  color: #18072F;
}
.category-nav .links a,
.category-nav .links button {
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  color: #18072F;
  font-size: 1.125rem;
}
.category-nav .links a:hover,
.category-nav .links button:hover {
  text-decoration: underline;
}
.category-nav .links .selected {
  color: rgba(24, 7, 47, 0.5);
}
.category-nav .links {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.938rem;
}
.category-nav button {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.75rem;
  background-color: rgba(24, 7, 47, 0);
  border: 0;
  outline: none;
}
.category-nav button span {
  color: #18072F;
  font-weight: 500;
  font-size: 1.25rem;
}
.category-nav button span #filter-number {
  font-weight: 400;
}

.filter-popup::backdrop {
  background: rgba(24, 7, 47, 0.15);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.filter-popup {
  width: 100%;
  height: 100dvh;
  max-width: 100%;
  max-height: 100dvh;
  pointer-events: none;
  outline: none;
  position: fixed;
  z-index: 100;
  border: 0;
  top: 0;
  opacity: 0;
  background: rgba(24, 7, 47, 0.15);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  transition: ease-out 0.2s;
  overflow: hidden;
}
.filter-popup.active {
  opacity: 1;
  pointer-events: all;
}
.filter-popup.active .flex {
  right: 0;
}
.filter-popup .flex {
  padding: 8.2vh 4%;
  transition: 0.3s ease-in-out;
  position: absolute;
  right: -100%;
  width: 100%;
  margin-left: auto;
  background-color: white;
  height: 100%;
  max-width: 38.813rem;
  border-left: 1px solid #FFD7BC;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.filter-popup .flex .heading h6 {
  font-family: "Quiche Sans", sans-serif;
  font-size: 1.875rem;
  font-weight: 400;
}
.filter-popup .flex .heading svg {
  cursor: pointer;
}
.filter-popup .flex .heading {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.filter-popup .flex .filters {
  margin-top: 3.438rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.563rem;
}
.filter-popup .flex .filters .filter {
  transition: 0.3s;
}
.filter-popup .flex .filters .filter.active {
  border-color: rgba(240, 150, 98, 0.25) !important;
}
.filter-popup .flex .filters .filter.active .btn svg {
  transform: scale(-1);
}
.filter-popup .flex .filters .filter.active .options {
  max-height: fit-content;
  pointer-events: all;
  margin-top: 1.25rem;
  margin-bottom: 3.438rem;
  height: 100%;
  transform: scale(1);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.5rem;
  opacity: 1;
}
.filter-popup .flex .filters .filter {
  border-bottom: rgb(240, 150, 98) 1px solid;
  width: 100%;
}
.filter-popup .flex .filters .filter .btn {
  cursor: pointer;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  font-size: 1.125rem;
  font-weight: 500;
  padding-bottom: 0.625rem;
}
.filter-popup .flex .filters .filter .btn svg {
  transition: ease-out 0.2s;
}
.filter-popup .flex .filters .filter .options {
  transform: scale(0);
  width: 100%;
  opacity: 0;
  pointer-events: none;
  transition: max-height 0.3s ease-out, opacity 0.2s ease-out;
  margin: 0;
  opacity: 0;
  max-height: 0;
}
.filter-popup .flex .filters .filter .options .option {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  font-size: 1rem;
  font-weight: 500;
}
.filter-popup .flex .filters .filter .options .option label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.filter-popup .flex .filters .filter .options .option label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.filter-popup .flex .filters .filter .options .option label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.filter-popup .flex .filters .filter .options .option label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.filter-popup .flex .filters .filter .options .option label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.filter-popup .flex .filters .filter .options .option label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.filter-popup .flex .filters .filter .options .option label input:checked + span svg {
  opacity: 1;
}
.filter-popup .flex .filters .filter .options .option label input:checked + span {
  background-color: rgb(24, 7, 47);
}
.filter-popup .flex .top {
  width: 100%;
}
.filter-popup .flex .main-btn {
  align-self: flex-end;
  height: 3.125rem;
  width: 100%;
  bottom: 8.2vh;
  border: 0;
  font-size: 1.125rem;
  padding: 0;
  text-transform: uppercase;
  outline: 0;
  cursor: pointer;
  font-family: "Satoshi", sans-serif;
}

.category-main {
  width: 100%;
  position: relative;
  background-color: white;
}
.category-main .categories-scroll-nav {
  width: 100%;
  display: flex;
  padding-inline: 7.3vw;
  gap: 1.6666666667%;
  justify-content: center;
  background-color: #FEF8F3;
  padding: 1.313rem 0;
  overflow-x: scroll;
}
.category-main .categories-scroll-nav a {
  color: #18072F;
  font-family: "Quiche Sans";
  font-size: 1.125rem;
  text-wrap: nowrap;
}
.category-main .categories-scroll-nav a.selected {
  text-decoration: underline;
  pointer-events: none;
}
.category-main .categories-scroll-nav {
  overflow: auto;
  /* Firefox */
  scrollbar-width: none;
  /* IE + starší Edge */
  -ms-overflow-style: none;
}
.category-main .categories-scroll-nav::-webkit-scrollbar {
  display: none;
}
.category-main .heading {
  background-color: white;
  position: relative;
  padding-bottom: 6rem;
  padding-inline: 7.3%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.category-main .heading h1 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  width: 100%;
  font-weight: 400;
  text-align: center;
  color: #18072F;
  margin: 4rem 0 2rem 0;
}
.category-main .heading .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  align-self: center;
  width: 61vw;
}
.category-main .heading .row p {
  align-self: center;
  font-size: 1.5rem;
  color: #18072F;
}
.category-main .heading .row p .left-b {
  flex-shrink: 0;
  height: auto;
  transform: translate(-70%, 70%);
  margin-right: -2.75%;
  min-width: 2.154rem;
  position: absolute;
  left: 7.3vw;
  top: 4rem;
}
.category-main .heading .right-b {
  position: absolute;
  right: 8.28125vw;
  bottom: 6rem;
}
.category-main .images {
  scrollbar-width: none;
}
.category-main .images::-webkit-scrollbar {
  display: none;
}
.category-main .indicator-wrap {
  position: absolute;
  bottom: 0;
  /* Adjust this to position it correctly */
  left: 0;
  opacity: 0;
  width: 100%;
  transition: ease-out 0.2s;
  /* Full width */
  height: 6px;
  /* Height of the progress indicator */
  background-color: #FFD7BC;
  /* Background of the indicator */
}
.category-main .scroll-indicator {
  height: 100%;
  /* Full height of the indicator wrap */
  background-color: #F09662;
  /* Progress color */
  width: 40%;
  /* Start at 0% width */
  transition: width 0.2s ease-out;
  /* Smooth transition */
  position: relative;
}
.category-main .products {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 23.740234375%);
  gap: 1.6796875%;
  row-gap: 0;
}
.category-main .products .decoration-img {
  background-color: rgb(250, 250, 251);
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  grid-column: span 2;
  /* Span 2 columns */
  grid-row: 2/span 2;
}
.category-main .products .product {
  grid-column: span 1;
  /* Span 2 columns */
  grid-row: span 1;
  /* Span 2 rows */
  background-color: white;
  padding-bottom: 1.6796875vw;
  position: relative;
}
.category-main .products .product:hover .indicator-wrap {
  opacity: 1 !important;
}
.category-main .products .product .discount-span {
  position: absolute;
  opacity: 0;
}
.category-main .products .product .sale {
  position: absolute;
  opacity: 0;
}
.category-main .products .product.sale .category .discount-span {
  opacity: 1;
  position: static;
  color: #F09662;
  font-weight: 1.125rem;
}
.category-main .products .product.sale .category {
  color: #18072F !important;
}
.category-main .products .product.sale .category .vl {
  height: 1.375rem;
  width: 1px;
  background-color: #8C8398;
}
.category-main .products .product.sale .category {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.656rem;
}
.category-main .products .product.sale .price {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.category-main .products .product.sale .price .original {
  font-size: 1rem;
  text-decoration: line-through;
}
.category-main .products .product.sale .price .sale {
  opacity: 1;
  position: static;
  color: #F09662;
  font-size: 1.125rem;
}
.category-main .products .product .images-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  position: relative;
}
.category-main .products .product .images-wrap svg {
  opacity: 0;
  transition: ease-out 0.2s;
}
.category-main .products .product .images-wrap .prev-img {
  position: absolute;
  left: 4.5%;
  z-index: 3;
}
.category-main .products .product .images-wrap .next-img {
  z-index: 3;
  position: absolute;
  right: 4.5%;
}
.category-main .products .product .images-wrap .images {
  scroll-snap-type: x mandatory;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  position: relative;
  aspect-ratio: 448/524;
  overflow-x: scroll;
  overflow-y: hidden;
  gap: 1px;
}
.category-main .products .product .images-wrap .images .img-wrap {
  background-color: white;
  position: relative;
  width: 100%;
  flex-shrink: 0;
  scroll-snap-align: start;
  aspect-ratio: 448/524;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.category-main .products .product .images-wrap .images .img-wrap::before {
  content: "";
  display: flex;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0);
  transition: 0.3s ease-out;
}
.category-main .products .product .images-wrap .images .img-wrap img {
  display: flex;
  mix-blend-mode: multiply;
  width: 100%;
  flex-shrink: 0;
  flex: 1;
  aspect-ratio: 448/524;
  object-fit: cover;
  object-position: center;
}
.category-main .products .product .info {
  width: 100%;
  padding-inline: 4.5%;
  padding-top: 1rem;
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.category-main .products .product .info .top {
  width: 100%;
}
.category-main .products .product .info h6 {
  font-size: 2rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  margin-bottom: 1.5rem;
  color: rgb(24, 7, 47);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100% !important;
  padding-right: 4.5%;
}
.category-main .products .product .info span {
  font-size: 1.125rem;
  color: rgb(24, 7, 47);
  line-height: 2.188rem;
}
.category-main .products .product .info .category {
  font-size: 1rem;
  color: rgb(240, 150, 98);
  line-height: 218%;
}
.category-main .products .product .info .right {
  text-transform: uppercase;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  text-wrap: nowrap;
}
.category-main .products .product .info .bottom {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0;
}
.category-main .products .product:hover .images-wrap svg {
  opacity: 1;
}
.category-main .products .product:hover .images-wrap svg.disabled {
  opacity: 0;
  pointer-events: none;
}
.category-main .products .product:hover .images-wrap .img-wrap::before {
  content: "";
  display: flex;
  background: rgba(0, 0, 0, 0.09);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.category-main .product-counter-wrap {
  background-color: white;
}
.category-main .product-counter-wrap .product-counter {
  width: 100%;
  text-align: center;
  margin: 2.813rem 0;
  margin-top: calc(2.813rem - 1.6796875vw);
  font-size: 1.125rem;
  color: #18072F;
}
.category-main .products-footer {
  width: 100%;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 7.938rem 6%;
  background-size: cover;
  background-position: center;
  position: relative;
}
.category-main .products-footer::before {
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(24, 7, 47, 0.48);
}
.category-main .products-footer a {
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
}
.category-main .products-footer a h4 {
  font-family: "Quiche Sans", sans-serif;
  font-size: 3rem;
  color: white;
  font-weight: 400;
}
.category-main .products-footer a p {
  font-size: 1.5rem;
  font-weight: 300;
  color: white;
  text-align: center;
  line-height: 1.875rem;
  max-width: 43.75rem;
  padding-inline: 6%;
}
.category-main .products-footer a button {
  margin-top: 0.5rem;
  display: flex;
  align-items: center;
  color: white;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  text-decoration: underline;
  font-size: 1.25rem;
  transition: 0.3s ease-out;
  cursor: pointer;
  gap: 0.563rem;
}
.category-main .products-footer a svg {
  transition: ease-out 0.2s;
}
.category-main .products-footer a:hover button {
  opacity: 0.7;
}
.category-main .products-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
}

@media only screen and (max-width: 1020px) {
  .filter-popup {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 0;
  }
  .filter-popup .flex {
    height: 96% !important;
    width: 100%;
    max-width: 97%;
    border: 0;
    border-radius: 10px 0px 0px 10px;
  }
  .filter-popup .flex h6 {
    font-size: 1.538rem !important;
  }
  .filter-popup .flex {
    padding: 4vh 8.6%;
  }
  .filter-popup .flex .main-btn {
    bottom: 4vh;
    right: 8.6%;
    height: 3.154rem !important;
    font-size: 1.154rem !important;
  }
  .filter-popup .flex .filters .filter.active .options {
    margin-top: 1rem;
    margin-bottom: 2.192rem !important;
  }
  .filter-popup .flex .filters .filter .btn {
    font-size: 1.231rem;
    padding-bottom: 1.192rem;
  }
  .filter-popup .flex .filters .filter .options .option {
    font-size: 1rem;
  }
  .filter-popup .flex .filters .filter .options .option label {
    width: 2.154rem;
    height: 2.154rem;
  }
  @media not all and (min-resolution: 0.001dpcm) {
    @supports (-webkit-touch-callout: none) {
      .filter-popup {
        padding-bottom: 4rem !important;
      }
    }
  }
  .category-nav {
    top: 5.923rem;
    height: 5rem;
    padding-inline: 0;
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .category-nav .mobile-wrap {
    position: relative;
    z-index: 60;
    background-color: rgba(255, 255, 255, 0.8);
    width: 100%;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    padding-right: 7.3%;
  }
  .category-nav .links {
    width: 100%;
    border-top: #FFD7BC 0.5px solid;
    position: absolute;
    top: -300%;
    z-index: 10;
    transition: ease-out 0.2s;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1.769rem;
    background-color: white;
    padding: 2.231rem 7.3%;
  }
  .category-nav .links a,
  .category-nav .links button {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    font-size: 1.231rem;
    width: 100%;
  }
  .category-nav .links .slash {
    display: none;
  }
  .category-nav .links .selected {
    display: none;
  }
  .category-nav.active .links {
    top: 100%;
  }
  .category-nav.active #mobile-links-btn svg {
    transform: scale(-1);
  }
  .category-nav #mobile-links-btn {
    margin-left: 7.3%;
    font-size: 1.154rem;
    color: #18072F;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0.769rem;
  }
  .category-nav #mobile-links-btn svg {
    transition: ease-out 0.2s;
  }
  .category-nav button span {
    font-size: 1.385rem !important;
  }
  .category-nav button svg {
    width: 1.077rem;
    height: 1.154rem;
  }
  .category-main .categories-scroll-nav {
    justify-content: flex-start;
    padding-inline: 7.3vw;
    gap: 1.25rem;
  }
  .category-main .heading {
    position: relative;
    padding-inline: 8.5% !important;
    padding-right: 0;
    margin-bottom: 0 !important;
    margin-bottom: 4.923rem;
  }
  .category-main .heading h1 {
    font-size: 2.462rem;
    text-align: center;
    margin-top: 4.923rem;
    margin-bottom: 2.462rem;
  }
  .category-main .heading .right-b {
    position: absolute;
    right: 5.9vw;
    margin: 0;
    bottom: 2.2rem;
    width: 3rem !important;
    height: 3rem !important;
  }
  .category-main .heading .row {
    position: static;
    padding-right: 0 !important;
    padding-left: 0;
    width: 88.6vw;
  }
  .category-main .heading .row .left-b {
    position: absolute;
    top: 3.769rem;
    left: 10.9vw;
    height: auto;
  }
  .category-main .heading .row p {
    font-size: 1.231rem !important;
  }
  .category-main .products {
    gap: 5vw;
    grid-template-columns: repeat(2, calc(50% - 2.5vw));
  }
  .category-main .products .product {
    grid-column: span 1;
    /* Span 2 columns */
    grid-row: span 1;
    aspect-ratio: 215/261 !important;
    padding-bottom: 0;
    background-color: white;
  }
  .category-main .products .product .category,
  .category-main .products .product .right,
  .category-main .products .product .next-img,
  .category-main .products .product .prev-img {
    display: none !important;
  }
  .category-main .products .product .left {
    width: 100%;
  }
  .category-main .products .product .indicator-wrap {
    display: flex;
    opacity: 1;
    bottom: 0;
    height: 3px;
  }
  .category-main .products .product .info {
    padding: 1.385rem 6.6985645933% 2.462rem 6.6985645933%;
  }
  .category-main .products .product .images-wrap {
    aspect-ratio: 209/232;
  }
  .category-main .products .product .images-wrap .images {
    aspect-ratio: 209/232;
  }
  .category-main .products .product .images-wrap .images .img-wrap {
    aspect-ratio: 209/232;
  }
  .category-main .products .product .images-wrap .images .img-wrap img {
    aspect-ratio: 209/232;
  }
  .category-main .products .product h6 {
    font-size: 1.308rem !important;
    margin: 0 !important;
    font-family: "Satoshi", sans-serif !important;
  }
  .category-main .products .product .price {
    font-size: 1rem !important;
    line-height: normal !important;
  }
  .category-main .products .product.sale .price {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    gap: 0;
    width: 100%;
  }
  .category-main .products .product.sale .price .original {
    font-size: 0.769rem;
    text-decoration: line-through;
  }
  .category-main .products .product.sale .price .sale {
    font-size: 1rem;
  }
  .category-main .products .decoration-img {
    display: none;
  }
  .category-main .product-counter-wrap {
    background-color: white;
  }
  .category-main .product-counter-wrap .product-counter {
    margin: 0.615rem 0 3rem 0;
  }
  .category-main .products-footer {
    aspect-ratio: auto !important;
    padding: 3.375rem 0;
  }
  .category-main .products-footer a {
    gap: 1.538rem !important;
  }
  .category-main .products-footer a h4 {
    font-size: 1.846rem !important;
    text-align: center;
    padding-inline: 5%;
  }
  .category-main .products-footer a p {
    font-size: 1.231rem;
    font-weight: 400;
  }
  .category-main .products-footer a button {
    margin: 0 !important;
  }
  .category-main .products-footer a button svg {
    display: none;
  }
}
.product-main {
  width: 100%;
}
.product-main .top {
  width: 100%;
}
.product-main .top .left {
  width: 54%;
}
.product-main .top .left .main-img {
  background-color: white;
  width: 100%;
}
.product-main .top .left .main-img img {
  mix-blend-mode: multiply;
  width: 100%;
  display: flex;
  flex-shrink: 0;
  flex: 1;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: center;
}
.product-main .top .left .about-product hr {
  border: 0;
  margin: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.6392156863);
  margin-top: 1.813rem;
}
.product-main .top .left .about-product h5 {
  font-size: 2.5rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  color: white;
  margin-bottom: 0.938rem;
}
.product-main .top .left .about-product h6 {
  font-size: 1.25rem;
  font-weight: 700;
  color: white;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
  margin: 1.375rem 0 1.313rem 0;
}
.product-main .top .left .about-product p {
  color: white;
  font-size: 1.375rem;
  font-weight: 300;
}
.product-main .top .left .about-product p.fs20 {
  font-size: 1.25rem;
}
.product-main .top .left .about-product {
  padding: 6.125rem 10%;
  width: 100%;
  background-color: #F09662;
}
.product-main .top .left .additional-images {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2px;
  flex-wrap: wrap;
  margin-top: 2px;
}
.product-main .top .left .additional-images .additional-img {
  background-color: #FAFAFB;
  flex: 1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  aspect-ratio: 1/1;
}
.product-main .top .left .additional-images .additional-img img {
  mix-blend-mode: multiply;
  width: 100%;
  display: flex;
  flex-shrink: 0;
  flex: 1;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: center;
}
.product-main .top .left .havent-picked {
  padding: 3.75rem 10%;
  background-color: white;
  position: relative;
  z-index: 5;
}
.product-main .top .left .havent-picked h5 {
  margin-bottom: 1.375rem;
  font-size: 2.5rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
}
.product-main .top .left .havent-picked p {
  font-size: 1.375rem;
  color: #18072F;
}
.product-main .top .left .havent-picked p a {
  color: #F09662;
  text-decoration: underline;
}
.product-main .top .right {
  background-color: white;
  width: 46%;
  position: fixed;
  z-index: 1;
  top: 28.5vh;
  padding: 0 6.6%;
  right: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.product-main .top .right .product-type-row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.product-main .top .right .product-type-row .availability {
  font-size: 1.125rem;
  color: #F09662;
  margin-left: auto;
}
.product-main .top .right .product-type {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.688rem;
  font-size: 1.125rem;
  color: #18072F;
}
.product-main .top .right .product-type .vl {
  width: 1px;
  height: 1.188rem;
  background-color: #F09662;
}
.product-main .top .right .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.313rem;
  padding: 1.5rem 0;
  width: 100%;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
}
.product-main .top .right .row.space-between {
  justify-content: space-between !important;
  align-items: center;
}
.product-main .top .right .row .icon-text svg {
  flex-shrink: 0;
}
.product-main .top .right .row .icon-text {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.938rem;
}
.product-main .top .right .row .icon-text span {
  font-size: 1.125rem;
  color: #18072F;
}
.product-main .top .right .row .icon-text span .bold {
  font-weight: 600;
  text-wrap: nowrap;
}
.product-main .top .right .row .order-icon-text {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.938rem;
}
.product-main .top .right .row .order-icon-text svg {
  flex-shrink: 0;
}
.product-main .top .right .row .order-icon-text span {
  font-size: 1rem;
  color: #18072F;
  max-width: 25.813rem;
}
.product-main .top .right .link {
  font-size: 1.125rem;
  text-decoration: underline;
  font-weight: 500;
  color: #18072F;
  font-family: "Satoshi", sans-serif;
}
.product-main .top .right .add-btn {
  margin: 1.375rem 0 1.563rem 0;
}
.product-main .top .right h1 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  font-weight: 400;
}
.product-main .top .right .price {
  font-size: 1.25rem;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  text-wrap: nowrap;
}
.product-main .top .right .price.orange {
  color: #F09662;
}
.product-main .bottom {
  background-color: white;
  position: relative;
  z-index: 2;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 23.740234375%);
  gap: 1.6796875%;
}
.product-main .bottom .images::-webkit-scrollbar {
  display: none;
}
.product-main .bottom .images {
  scrollbar-width: none;
}
.product-main .bottom .indicator-wrap {
  position: absolute;
  bottom: 0;
  /* Adjust this to position it correctly */
  left: 0;
  opacity: 0;
  width: 100%;
  transition: ease-out 0.2s;
  /* Full width */
  height: 6px;
  /* Height of the progress indicator */
  background-color: #FFD7BC;
  /* Background of the indicator */
}
.product-main .bottom .scroll-indicator {
  height: 100%;
  /* Full height of the indicator wrap */
  background-color: #F09662;
  /* Progress color */
  width: 40%;
  /* Start at 0% width */
  transition: width 0.2s ease-out;
  /* Smooth transition */
  position: relative;
}
.product-main .bottom .product {
  grid-column: span 1;
  /* Span 2 columns */
  grid-row: span 1;
  /* Span 2 rows */
  background-color: white;
  padding-bottom: 1.6796875vw;
  position: relative;
}
.product-main .bottom .product:hover .indicator-wrap {
  opacity: 1 !important;
}
.product-main .bottom .product .discount-span {
  position: absolute;
  opacity: 0;
}
.product-main .bottom .product .sale {
  position: absolute;
  opacity: 0;
}
.product-main .bottom .product.sale .category .discount-span {
  opacity: 1;
  position: static;
  color: #F09662;
  font-weight: 1.125rem;
}
.product-main .bottom .product.sale .category {
  color: #18072F !important;
}
.product-main .bottom .product.sale .category .vl {
  height: 1.375rem;
  width: 1px;
  background-color: #8C8398;
}
.product-main .bottom .product.sale .category {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.656rem;
}
.product-main .bottom .product.sale .price {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.product-main .bottom .product.sale .price .original {
  font-size: 1rem;
  text-decoration: line-through;
}
.product-main .bottom .product.sale .price .sale {
  opacity: 1;
  position: static;
  color: #F09662;
  font-size: 1.125rem;
}
.product-main .bottom .product .images-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  position: relative;
}
.product-main .bottom .product .images-wrap svg {
  opacity: 0;
  transition: ease-out 0.2s;
}
.product-main .bottom .product .images-wrap .prev-img {
  position: absolute;
  left: 4.5%;
  z-index: 3;
}
.product-main .bottom .product .images-wrap .next-img {
  z-index: 3;
  position: absolute;
  right: 4.5%;
}
.product-main .bottom .product .images-wrap .images {
  scroll-snap-type: x mandatory;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  position: relative;
  aspect-ratio: 448/524;
  overflow-x: scroll;
  overflow-y: hidden;
  gap: 1px;
}
.product-main .bottom .product .images-wrap .images .img-wrap {
  background-color: white;
  position: relative;
  width: 100%;
  flex-shrink: 0;
  scroll-snap-align: start;
  aspect-ratio: 448/524;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.product-main .bottom .product .images-wrap .images .img-wrap::before {
  content: "";
  display: flex;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0);
  transition: 0.3s ease-out;
}
.product-main .bottom .product .images-wrap .images .img-wrap img {
  display: flex;
  mix-blend-mode: multiply;
  width: 100%;
  flex-shrink: 0;
  flex: 1;
  aspect-ratio: 448/524;
  object-fit: cover;
  object-position: center;
}
.product-main .bottom .product .info {
  width: 100%;
  padding-inline: 4.5%;
  padding-top: 1rem;
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.product-main .bottom .product .info .top {
  width: 100%;
}
.product-main .bottom .product .info h6 {
  font-size: 2rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  margin-bottom: 1.5rem;
  color: rgb(24, 7, 47);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100% !important;
  padding-right: 4.5%;
}
.product-main .bottom .product .info span {
  font-size: 1.125rem;
  color: rgb(24, 7, 47);
  line-height: 2.188rem;
}
.product-main .bottom .product .info .category {
  font-size: 1rem;
  color: rgb(240, 150, 98);
  line-height: 218%;
}
.product-main .bottom .product .info .right {
  text-transform: uppercase;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  text-wrap: nowrap;
}
.product-main .bottom .product .info .bottom {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0;
}
.product-main .bottom .product:hover .images-wrap svg {
  opacity: 1;
}
.product-main .bottom .product:hover .images-wrap svg.disabled {
  opacity: 0;
  pointer-events: none;
}
.product-main .bottom .product:hover .images-wrap .img-wrap::before {
  content: "";
  display: flex;
  background: rgba(0, 0, 0, 0.09);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.product-main.course .main-img {
  padding: 0 !important;
  aspect-ratio: 5/4 !important;
  height: 100%;
}
.product-main.course .main-img img {
  aspect-ratio: 5/4 !important;
  height: 100%;
}
.product-main.course .images-wrap {
  width: 100%;
}
.product-main.course .images-wrap .img-wrap {
  width: 100%;
  padding: 0 !important;
}
.product-main.course .top .left .about-product {
  background-color: #18072F;
}
.product-main.course .top .left .about-product .p-show-more {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(24, 7, 47, 0.5529411765) 5%, #18072F 65%, #18072F 100%);
}
.product-main.course .top .right .order-icon-text {
  align-items: center;
  width: 100%;
  max-width: 100%;
}
.product-main.course .top .right .order-icon-text span {
  font-size: 1.125rem;
  width: 100%;
  max-width: 100%;
}

@media only screen and (max-width: 1020px) {
  .product-main .mobile-images {
    width: 100%;
    position: relative;
  }
  .product-main .mobile-images .indicator-wrap {
    position: absolute;
    bottom: 0;
    /* Adjust this to position it correctly */
    left: 0;
    display: flex;
    width: 100%;
    /* Full width */
    height: 2px;
    /* Height of the progress indicator */
    background-color: #FFD7BC;
    /* Background of the indicator */
  }
  .product-main .mobile-images .scroll-indicator {
    height: 100%;
    /* Full height of the indicator wrap */
    background-color: #18072F;
    /* Progress color */
    width: 40%;
    /* Start at 0% width */
    transition: width 0.2s ease-out;
    /* Smooth transition */
    position: relative;
  }
  .product-main .mobile-images {
    margin-bottom: 3.25rem;
  }
  .product-main .mobile-images .images-wrap {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    position: relative;
    width: 100% !important;
  }
  .product-main .mobile-images .images-wrap svg {
    opacity: 0;
    transition: ease-out 0.2s;
  }
  .product-main .mobile-images .images-wrap .prev-img {
    position: absolute;
    left: 4.5%;
    z-index: 3;
  }
  .product-main .mobile-images .images-wrap .next-img {
    z-index: 3;
    position: absolute;
    right: 4.5%;
  }
  .product-main .mobile-images .images-wrap .images {
    scrollbar-width: none;
  }
  .product-main .mobile-images .images-wrap .images::-webkit-scrollbar {
    display: none;
  }
  .product-main .mobile-images .images-wrap .images {
    scroll-snap-type: x mandatory;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
    position: relative;
    aspect-ratio: 1/1;
    overflow-x: scroll;
    overflow-y: hidden;
    background-color: #FAFAFB;
  }
  .product-main .mobile-images .images-wrap .images .img-wrap {
    background-color: rgb(250, 250, 251);
    width: 100%;
    flex-shrink: 0;
    scroll-snap-align: start;
  }
  .product-main .mobile-images .images-wrap .images .img-wrap img {
    mix-blend-mode: multiply;
    width: 100%;
    flex-shrink: 0;
    flex: 1;
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: center;
  }
  .product-main .top {
    display: flex;
    flex-direction: column-reverse !important;
  }
  .product-main .top .left {
    width: 100%;
  }
  .product-main .top .left .main-img {
    display: none;
  }
  .product-main .top .left .additional-images {
    display: none;
  }
  .product-main .top .left .about-product {
    position: relative;
  }
  .product-main .top .left .about-product .p-show-more {
    width: 100%;
    height: 7.385rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    position: absolute;
    bottom: 0;
    background: linear-gradient(180deg, rgba(240, 150, 98, 0.55) 0%, rgba(240, 150, 98, 0.55) 5%, rgb(240, 150, 98) 65%, rgb(240, 150, 98) 100%);
    transition: ease-out 0.3s;
    left: 0;
  }
  .product-main .top .left .about-product .p-show-more .show-more, .product-main .top .left .about-product .p-show-more .show-less {
    position: absolute;
    bottom: 1.846rem;
    background-color: rgba(255, 255, 255, 0);
    border: 0;
    height: fit-content;
    font-size: 1.231rem;
    font-weight: 500;
    color: white;
    text-decoration: underline;
  }
  .product-main .top .left .about-product .p-show-more .show-less {
    pointer-events: none;
    opacity: 0;
  }
  .product-main .top .left .about-product {
    max-height: 22.5rem;
  }
  .product-main .top .left .about-product .fade-p {
    height: 0;
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
  }
  .product-main .top .left .about-product.show-more {
    padding-bottom: 4.9rem !important;
    max-height: fit-content;
  }
  .product-main .top .left .about-product.show-more .p-show-more {
    background: rgba(255, 255, 255, 0);
  }
  .product-main .top .left .about-product.show-more .p-show-more .show-more {
    pointer-events: none;
    opacity: 0;
  }
  .product-main .top .left .about-product.show-more .p-show-more .show-less {
    pointer-events: all;
    opacity: 1;
  }
  .product-main .top .left .about-product.show-more .fade-p {
    height: auto;
    -webkit-user-select: text; /* Safari */
    -moz-user-select: text; /* Firefox */
    -ms-user-select: text; /* IE/Edge */
    user-select: text;
    max-height: auto;
  }
  .product-main .top .left .about-product {
    padding: 2.231rem 7.3%;
  }
  .product-main .top .left .about-product h5 {
    font-size: 1.923rem;
  }
  .product-main .top .left .about-product p {
    font-size: 1.231rem;
  }
  .product-main .top .left .about-product h6 {
    margin-bottom: 0.923rem !important;
    font-size: 1.385rem;
    gap: 0.846rem;
    font-weight: 500;
  }
  .product-main .top .left .about-product h6 svg {
    width: 1.077rem;
    height: 1.231rem;
  }
  .product-main .top .left .havent-picked {
    position: relative;
    z-index: 5;
    padding-inline: 7.3% 4rem !important;
  }
  .product-main .top .left .havent-picked h5 {
    font-size: 1.923rem;
  }
  .product-main .top .left .havent-picked p {
    font-size: 1.231rem;
  }
  .product-main .top .right .product-type-row .availability {
    font-size: 1rem;
  }
  .product-main .top .right .product-type {
    font-size: 1rem;
  }
  .product-main .top .right .product-type .vl {
    height: 0.769rem;
  }
  .product-main .top .right h1 {
    font-size: 1.385rem;
  }
  .product-main .top .right .price {
    font-size: 1.154rem;
  }
  .product-main .top .right .row {
    padding: 1.077rem 0;
  }
  .product-main .top .right .row.mobile-row {
    padding: 0;
    flex-direction: column;
    border: 0;
    gap: 0;
  }
  .product-main .top .right .row.mobile-row .icon-text {
    border-bottom: 1px solid rgba(240, 150, 98, 0.25);
    padding: 1.077rem 0;
    width: 100%;
  }
  .product-main .top .right .row.mobile-row .icon-text span {
    font-size: 1rem;
  }
  .product-main .top .right .row.mobile-row .icon-text span .bold {
    font-weight: 500;
  }
  .product-main .top .right .link {
    font-size: 1rem;
  }
  .product-main .top .right .time {
    width: 1rem;
    height: 1.154rem;
  }
  .product-main .top .right .butterfly {
    width: 1.308rem;
    height: 1.308rem;
  }
  .product-main .top .right .spachtle {
    width: 0.923rem;
    height: 1.385rem;
  }
  .product-main .top .right .mapa {
    width: 0.75rem;
    height: 1.438rem;
  }
  .product-main .top .right {
    width: 100%;
    position: static;
    padding-inline: 7.3% !important;
    margin: 0 0 4rem 0;
  }
  .product-main .bottom {
    gap: 5vw;
    grid-template-columns: repeat(2, calc(50% - 2.5vw));
  }
  .product-main .bottom .product {
    grid-column: span 1;
    /* Span 2 columns */
    grid-row: span 1;
    aspect-ratio: 215/261 !important;
    padding-bottom: 0;
    background-color: white;
    margin-bottom: -2.462rem;
  }
  .product-main .bottom .product .category,
  .product-main .bottom .product .right,
  .product-main .bottom .product .next-img,
  .product-main .bottom .product .prev-img {
    display: none !important;
  }
  .product-main .bottom .product .left {
    width: 100%;
  }
  .product-main .bottom .product .indicator-wrap {
    display: flex;
    opacity: 1;
    bottom: 0;
    height: 3px;
  }
  .product-main .bottom .product .info {
    padding: 1.385rem 6.6985645933% 2.462rem 6.6985645933%;
  }
  .product-main .bottom .product .images-wrap {
    aspect-ratio: 209/232;
  }
  .product-main .bottom .product .images-wrap .images {
    aspect-ratio: 209/232;
  }
  .product-main .bottom .product .images-wrap .images .img-wrap {
    aspect-ratio: 209/232;
  }
  .product-main .bottom .product .images-wrap .images .img-wrap img {
    aspect-ratio: 209/232;
  }
  .product-main .bottom .product h6 {
    font-size: 1.308rem !important;
    margin: 0 !important;
    font-family: "Satoshi", sans-serif !important;
  }
  .product-main .bottom .product .price {
    font-size: 1rem !important;
    line-height: normal !important;
  }
  .product-main .bottom .product.sale .price {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    gap: 0;
    width: 100%;
  }
  .product-main .bottom .product.sale .price .original {
    font-size: 0.769rem;
    text-decoration: line-through;
  }
  .product-main .bottom .product.sale .price .sale {
    font-size: 1rem;
  }
  .product-main.course .right .mobile-row {
    margin-bottom: 1.615rem;
  }
}
.voucher-main .add-btn {
  background-color: #F09662;
}
.voucher-main .top {
  padding: 30vh 0 9vh 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 3.125rem;
  position: relative;
  margin-bottom: 8.25rem;
}
.voucher-main .top svg {
  position: absolute;
}
.voucher-main .top .b1 {
  width: 9.6%;
  height: auto;
  top: 13%;
  left: 11%;
}
.voucher-main .top .b2 {
  width: 5.4%;
  height: auto;
  bottom: 0;
  left: 24%;
}
.voucher-main .top .b3 {
  width: 10.4%;
  height: auto;
  right: 11%;
  top: 25%;
}
.voucher-main .top .b4 {
  width: 5.4%;
  height: auto;
  bottom: 0;
  right: 24%;
}
.voucher-main .top h1 {
  font-size: 3.125rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  text-align: center;
}
.voucher-main .top p {
  font-size: 1.563rem;
  text-align: center;
  max-width: 44.125rem;
}
.voucher-main .top .link {
  font-size: 1rem;
  text-decoration: underline;
  font-family: "Satoshi", sans-serif;
  font-weight: 500;
}
.voucher-main .bottom {
  color: #18072F;
  padding: 8.25rem 0 13.563rem 0;
  margin-inline: 5%;
  border-bottom: 1px solid #F09662;
  width: 90%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4.125rem;
  position: relative;
}
.voucher-main .bottom h2 {
  font-size: 2.188rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  text-align: center;
  max-width: 48.313rem;
}
.voucher-main .bottom p {
  max-width: 39.063rem;
  text-align: center;
  font-size: 1.25rem;
}
.voucher-main .bottom p .bold {
  font-weight: 500 !important;
}
.voucher-main .bottom p {
  margin: 3rem 0;
}
.voucher-main .bottom .link {
  font-size: 1rem;
  text-decoration: underline;
  font-family: "Satoshi", sans-serif;
  font-weight: 500;
  margin: 3.75rem 0;
}
.voucher-main .bottom .icon-text {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1.1rem;
}
.voucher-main .bottom .icon-text span {
  font-size: 1.125rem;
  max-width: 34.063rem;
  text-align: center;
}
.voucher-main .bottom .voucher img {
  max-width: 23.875rem;
  aspect-ratio: 1/1;
  width: 61%;
}
.voucher-main .bottom .voucher {
  width: 62%;
  box-shadow: 0px 0px 15px rgba(24, 7, 47, 0.1607843137);
  background-color: white;
  padding: 2rem 7% 6.375rem 7%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.voucher-main .bottom .voucher form {
  transition: ease-out 0.3s;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 3.563rem;
  width: 100%;
  max-width: 39.5rem;
}
.voucher-main .bottom .b1, .voucher-main .bottom .b2 {
  position: absolute;
  width: 6.32%;
  height: auto;
  transform: rotate(90deg);
}
.voucher-main .bottom .b1 {
  left: 7%;
  top: 18%;
}
.voucher-main .bottom .b2 {
  right: 7%;
  bottom: 25%;
}

@media only screen and (max-width: 1020px) {
  .voucher-main .top {
    gap: 1.8rem !important;
    padding-top: 20vh;
    padding-bottom: 10vh;
    margin-bottom: 2rem;
  }
  .voucher-main .top h1 {
    font-size: 1.923rem;
    padding-inline: 5%;
  }
  .voucher-main .top p {
    font-size: 1.231rem;
    width: 100%;
    padding-inline: 7%;
  }
  .voucher-main .top .b1, .voucher-main .top .b3 {
    display: none;
  }
  .voucher-main .top .b2, .voucher-main .top .b4 {
    width: 13.4%;
    max-width: 5rem;
  }
  .voucher-main .top .b4 {
    top: 9vh;
    left: 5%;
  }
  .voucher-main .top .b2 {
    position: absolute;
    bottom: 2.5vh;
    left: 80%;
  }
  .voucher-main .bottom {
    padding-bottom: 11rem !important;
  }
  .voucher-main .bottom .voucher {
    width: 100%;
  }
  .voucher-main .bottom .voucher .whíte {
    width: 110% !important;
  }
  .voucher-main .bottom .voucher {
    padding: 1.5rem 8% 3.5rem 8%;
  }
  .voucher-main .bottom .voucher h2 {
    font-size: 1.692rem;
  }
  .voucher-main .bottom .voucher p {
    margin: 2rem 0 3.5rem 0 !important;
    font-size: 1.231rem !important;
  }
  .voucher-main .bottom .voucher .link {
    margin: 0.8rem 0 4rem 0;
  }
  .voucher-main .bottom .voucher .icon-text span {
    font-size: 1rem;
  }
  .voucher-main .bottom {
    padding: 20vh 0 20vh 0;
  }
  .voucher-main .bottom .b1, .voucher-main .bottom .b2 {
    display: none;
  }
  .voucher-main .bottom .b3, .voucher-main .bottom .b4 {
    width: 15.69%;
    position: absolute;
    height: auto;
    max-width: 5rem;
  }
  .voucher-main .bottom .b3 {
    top: 0%;
    left: 5%;
    transform: rotate(180deg);
  }
  .voucher-main .bottom .b4 {
    bottom: 3.5rem;
    right: 5%;
    transform: rotate(180deg);
  }
  .voucher-main .bottom form {
    transition: ease-out 0.3s;
    width: 100% !important;
  }
}
.cart-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.cart-main .cart {
  padding: 10vh 4% 0 7.3%;
  width: 100%;
}
.cart-main .cart .left {
  min-height: 45rem;
  width: 57%;
}
.cart-main .cart .left h1 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.cart-main .cart .left .shipping {
  margin: 5.375rem 0 0 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.938rem;
}
.cart-main .cart .left .shipping svg {
  flex-shrink: 0;
}
.cart-main .cart .left .shipping .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.938rem;
}
.cart-main .cart .left .shipping .column p {
  font-size: 1.125rem;
  color: #18072F;
}
.cart-main .cart .left .shipping .column p .value {
  font-weight: 500;
}
.cart-main .cart .left .shipping .column a {
  font-size: 1rem;
  font-weight: 500;
  text-decoration: underline;
  color: #18072F;
}
.cart-main .cart .left .items {
  margin-top: 5.375rem;
  width: 100%;
  border-top: 1px solid rgba(240, 150, 98, 0.25);
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
  padding: 3rem 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  gap: 3rem;
}
.cart-main .cart .left .items .item {
  height: 12.5rem;
  width: 100%;
}
.cart-main .cart .left .items .item .mobile-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.cart-main .cart .left .items .item .right-mobile {
  width: 100%;
}
.cart-main .cart .left .items .item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.cart-main .cart .left .items .item .item-img-wrap {
  height: 100%;
  aspect-ratio: 1/1;
  background-color: rgb(250, 250, 251);
  margin-right: 2.313rem;
}
.cart-main .cart .left .items .item .item-img-wrap img {
  width: 100%;
  height: 100%;
  mix-blend-mode: multiply;
  object-fit: cover;
  object-position: center;
}
.cart-main .cart .left .items .item .info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  height: 100%;
}
.cart-main .cart .left .items .item .info .top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
}
.cart-main .cart .left .items .item .info .top .product-type {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.688rem;
  font-size: 1.125rem;
  color: #18072F;
}
.cart-main .cart .left .items .item .info .top .product-type .vl {
  width: 1px;
  height: 1.188rem;
  background-color: #F09662;
}
.cart-main .cart .left .items .item .info .top .price {
  font-family: "Quiche Sans", sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  text-align: right;
  color: #18072F;
}
.cart-main .cart .left .items .item .info .top .price span {
  font-family: "Quiche Sans", sans-serif;
}
.cart-main .cart .left .items .item .info .center {
  margin-top: 1.438rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1rem;
}
.cart-main .cart .left .items .item .info .center h6 {
  font-family: "Quiche Sans", sans-serif;
  font-size: 2.188rem;
  font-weight: 400;
  color: rgb(24, 7, 47);
}
.cart-main .cart .left .items .item .info .center .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.938rem;
}
.cart-main .cart .left .items .item .info .center .row p {
  color: rgb(240, 150, 98);
  font-size: 1rem;
  max-width: 75%;
}
.cart-main .cart .left .items .item .info .bottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
}
.cart-main .cart .left .items .item .info .bottom .counter {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.563rem;
}
.cart-main .cart .left .items .item .info .bottom .counter .text {
  min-width: 8.5rem;
  font-size: 1.125rem;
  font-weight: 500;
  color: rgb(24, 7, 47);
}
.cart-main .cart .left .items .item .info .bottom .counter .text .value, .cart-main .cart .left .items .item .info .bottom .counter .text .light {
  font-weight: 400;
}
.cart-main .cart .left .items .item .info .bottom .counter .buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.688rem;
  position: absolute;
  left: 100%;
}
.cart-main .cart .left .items .item .info .bottom .counter .buttons .plus, .cart-main .cart .left .items .item .info .bottom .counter .buttons .minus {
  width: 14px;
  height: 14px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  cursor: pointer;
}
.cart-main .cart .left .items .item .info .bottom .counter .buttons .plus svg path, .cart-main .cart .left .items .item .info .bottom .counter .buttons .minus svg path {
  transition: ease-out 0.3s;
}
.cart-main .cart .left .items .item .info .bottom .counter .buttons .plus.disabled, .cart-main .cart .left .items .item .info .bottom .counter .buttons .minus.disabled {
  pointer-events: none;
}
.cart-main .cart .left .items .item .info .bottom .counter .buttons .plus.disabled svg path, .cart-main .cart .left .items .item .info .bottom .counter .buttons .minus.disabled svg path {
  stroke: #F09662;
}
.cart-main .cart .left .items .item .info .bottom .counter .buttons .vl {
  height: 1.25rem;
  width: 1px;
  background-color: #E6E6E6;
}
.cart-main .cart .left .items .item .info .bottom .delete {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.688rem;
  color: rgb(24, 7, 47);
  font-size: 1.125rem;
  font-weight: 400;
  border: 0;
  background-color: rgba(24, 7, 47, 0);
  cursor: pointer;
}
.cart-main .cart .left .club-banner {
  background-color: rgb(24, 7, 47);
  padding: 4.813rem 0;
  position: relative;
  overflow: hidden;
  margin: 5.375rem 0;
  /* Add the blur effect */
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.cart-main .cart .left .club-banner .left-b, .cart-main .cart .left .club-banner .right-b, .cart-main .cart .left .club-banner .left-circle, .cart-main .cart .left .club-banner .right-circle {
  position: absolute;
}
.cart-main .cart .left .club-banner .left-b, .cart-main .cart .left .club-banner .right-b {
  width: 5.1%;
  height: auto;
}
.cart-main .cart .left .club-banner .left-circle, .cart-main .cart .left .club-banner .right-circle {
  width: 35%;
  height: auto;
  aspect-ratio: 1/1;
  background: transparent radial-gradient(closest-side at 50% 50%, #F09662 0%, rgba(240, 150, 98, 0) 100%) 0% 0% no-repeat padding-box;
}
.cart-main .cart .left .club-banner .left-b {
  top: 16%;
  transform: rotate(180deg);
  left: 15.6%;
}
.cart-main .cart .left .club-banner .right-b {
  right: 15.6%;
  bottom: 18%;
}
.cart-main .cart .left .club-banner .left-circle {
  left: -16%;
  bottom: -50%;
}
.cart-main .cart .left .club-banner .right-circle {
  right: -16%;
  top: -50%;
}
.cart-main .cart .left .club-banner a {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1.313rem;
}
.cart-main .cart .left .club-banner a h4 {
  color: white;
  font-size: 2.188rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.cart-main .cart .left .club-banner a p {
  color: white;
  font-size: 1.125rem;
  font-weight: 300;
  max-width: 22.5rem;
  text-align: center;
}
.cart-main .cart .left .club-banner a svg {
  transition: ease-out 0.3s;
}
.cart-main .cart .left .club-banner a:hover svg {
  transform: translateX(0.375rem);
}
.cart-main .cart .right {
  top: calc(10vh + 6rem);
  right: 4%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  position: fixed;
  background-color: #FEF8F3;
  width: 33%;
  z-index: 1;
  padding: 1.563rem 0;
}
.cart-main .cart .right .discount-coupon-btn {
  height: 4.063rem;
  width: 100%;
  background-color: rgb(255, 215, 188);
  border: 0;
  margin-top: 1.563rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-inline: 5%;
  cursor: pointer;
}
.cart-main .cart .right .discount-coupon-btn .left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.625rem;
  font-size: 1.125rem;
  color: #18072F;
  text-align: left;
  text-wrap: nowrap;
}
.cart-main .cart .right .discount-coupon-btn svg {
  transition: ease-out 0.2s;
  flex-shrink: 0;
}
.cart-main .cart .right .discount-input-wrap {
  width: 100%;
  padding-inline: 5%;
  background-color: #FFD7BC;
  max-height: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0s ease-out;
  position: relative;
}
.cart-main .cart .right .discount-input-wrap input {
  padding: 0 0 0.625rem 0;
  font-size: 1.25rem;
  font-weight: 400;
  border: 0;
  background-color: rgba(255, 215, 188, 0);
  border-bottom: 1px solid #18072F;
  color: #18072F;
  width: 100%;
  outline: none;
}
.cart-main .cart .right .discount-input-wrap input::placeholder {
  font-weight: 300;
  color: #18072F;
}
.cart-main .cart .right .discount-input-wrap .discount-value {
  position: absolute;
  bottom: 0.625rem;
  right: 0;
  font-size: 1.125rem;
  font-weight: 500;
  color: #18072F;
}
.cart-main .cart .right .discount-input-wrap .relative-wrap {
  position: relative;
  width: 100%;
}
.cart-main .cart .right.discount-input-active .discount-coupon-btn .arrow {
  transform: scale(-1);
}
.cart-main .cart .right.discount-input-active .discount-input-wrap {
  pointer-events: all;
  max-height: fit-content;
  opacity: 1;
  transition: opacity 0.4s ease-out;
  padding: 1.563rem 5% 1.625rem 5%;
}
.cart-main .cart .right .main-btn {
  border: 0;
  width: 90%;
  margin-top: 1.75rem;
  cursor: pointer;
  margin-bottom: 1.938rem;
}
.cart-main .cart .right h6 {
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  width: 90%;
  text-align: left;
  font-size: 1.875rem;
}
.cart-main .cart .right .info {
  width: 90%;
  border-bottom: rgba(240, 150, 98, 0.25) 1px solid;
  padding: 1.75rem 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.75rem;
}
.cart-main .cart .right .info .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
}
.cart-main .cart .right .info .name {
  font-size: 1.125rem;
  font-weight: 400;
  color: #18072F;
}
.cart-main .cart .right .info .value {
  font-size: 1.125rem;
  font-weight: 500;
  color: #18072F;
}
.cart-main .cart .right .info.total .name {
  font-weight: 500;
}
.cart-main .cart .right .info.total .subname {
  font-size: 1rem;
  font-weight: 400;
}
.cart-main .cart .right .info.total {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.cart-main .cart .right .info.total .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.625rem;
}
.cart-main .cart .right .link {
  font-family: "Satoshi", sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: #18072F;
  text-decoration: underline;
}
.cart-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-bottom: #F09662 1px solid;
  align-self: center;
  position: relative;
  z-index: 2;
}

@media only screen and (max-width: 1020px) {
  .cart-main .cart {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    padding: 0;
  }
  .cart-main .cart section.left {
    min-height: 0 !important;
  }
  .cart-main .cart section.left .club-banner {
    align-items: flex-start !important;
    margin: 3rem 0;
  }
  .cart-main .cart section.left .club-banner .left-circle, .cart-main .cart section.left .club-banner .right-circle {
    width: 30%;
  }
  .cart-main .cart section.left .club-banner {
    aspect-ratio: auto;
    padding: 2.692rem 7%;
  }
  .cart-main .cart section.left .club-banner .left-b, .cart-main .cart section.left .club-banner .right-b {
    display: none;
  }
  .cart-main .cart section.left .club-banner a {
    position: relative;
    z-index: 2;
    align-items: flex-start;
    gap: 0.769rem !important;
  }
  .cart-main .cart section.left .club-banner a h4 {
    font-size: 1.692rem;
    text-align: left;
  }
  .cart-main .cart section.left .club-banner a p {
    text-align: left;
    font-size: 1rem;
    font-weight: 300;
  }
  .cart-main .cart section.left .club-banner a .arrow-link {
    margin-top: 0.385rem;
  }
  .cart-main .cart section.left {
    width: 100%;
    padding: 6vh 7.3% 0 7.3%;
  }
  .cart-main .cart section.left h1 {
    font-size: 1.923rem;
  }
  .cart-main .cart section.left .shipping {
    margin: 2rem 0 0 0;
  }
  .cart-main .cart section.left .shipping svg {
    width: 1.538rem;
    height: auto;
  }
  .cart-main .cart section.left .shipping p, .cart-main .cart section.left .shipping a {
    font-size: 1rem !important;
  }
  .cart-main .cart section.left .items {
    margin-top: 2rem;
    gap: 2.154rem;
  }
  .cart-main .cart section.left .items .item {
    height: fit-content;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .item-img-wrap {
    width: 35%;
    height: auto;
    aspect-ratio: 1/1;
    max-width: 10.231rem;
    margin: 0;
    flex-shrink: 0;
  }
  .cart-main .cart section.left .items .item .mobile-wrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4%;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .top .product-type {
    font-size: 1rem !important;
    text-wrap: nowrap;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .top .product-type .vl {
    height: 0.769rem !important;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center {
    gap: 1.308rem;
    margin-top: 0.769rem;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center .price {
    font-family: "Quiche Sans", sans-serif;
    font-weight: 400;
    font-size: 1.154rem;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center .price span {
    font-family: "Quiche Sans", sans-serif;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center h6 {
    font-size: 1.385rem;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center svg {
    width: 0.385rem;
    height: auto;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center p {
    font-size: 0.923rem !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .center .row {
    gap: 0.769rem !important;
  }
  .cart-main .cart section.left .items .item .bottom {
    margin-top: 2.154rem;
  }
  .cart-main .cart .right {
    width: 100%;
    position: static;
  }
  .cart-main .cart .right .discount-coupon-btn {
    padding-inline: 5.5% !important;
  }
  .cart-main .cart .right .discount-coupon-btn .arrow path {
    stroke: rgb(240, 150, 98);
  }
  .cart-main .cart .right .link {
    margin-top: 1.231rem !important;
    font-size: 1.154rem;
  }
  .cart-main .cart .right h6 {
    width: 85.4%;
  }
  .cart-main .cart .right .info {
    width: 85.4%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1.75rem;
  }
  .cart-main .cart .right .info .row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    width: 100%;
  }
  .cart-main .cart .right .info .name {
    font-size: 1.125rem;
    font-weight: 400;
    color: #18072F;
  }
  .cart-main .cart .right .info .value {
    font-size: 1.125rem;
    font-weight: 500;
    color: #18072F;
  }
  .cart-main .cart .right .info.total .name {
    font-weight: 500;
  }
  .cart-main .cart .right .info.total .subname {
    font-size: 1rem;
    font-weight: 400;
  }
  .cart-main .cart .right .info.total {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
  .cart-main .cart .right .info.total .column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.385rem;
  }
  .cart-main .mobile-checkout {
    padding: 1.538rem 7.3% 2.538rem 7.3%;
    position: fixed;
    bottom: 0;
    z-index: 10;
    background-color: white;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    box-shadow: 0px 0px 10px rgba(24, 7, 47, 0.1);
    border-top: rgb(255, 215, 188) 1px solid;
  }
  .cart-main .mobile-checkout .button {
    color: white;
    background-color: #18072F;
    font-size: 1.154rem;
    height: 3.154rem;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    margin-top: 1.462rem;
    border: 0;
    outline: none;
    text-transform: uppercase;
    font-weight: 400;
  }
  .cart-main .mobile-checkout .info {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1.75rem;
  }
  .cart-main .mobile-checkout .info .row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    width: 100%;
  }
  .cart-main .mobile-checkout .info .name {
    font-size: 1.125rem;
    font-weight: 400;
    color: #18072F;
  }
  .cart-main .mobile-checkout .info .value {
    font-size: 1.125rem;
    font-weight: 500;
    color: #18072F;
  }
  .cart-main .mobile-checkout .info.total .name {
    font-weight: 500;
  }
  .cart-main .mobile-checkout .info.total .subname {
    font-size: 1rem;
    font-weight: 400;
  }
  .cart-main .mobile-checkout .info.total {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
  .cart-main .mobile-checkout .info.total .column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.385rem;
  }
}
@media only screen and (max-width: 700px) {
  .cart-main .cart {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    padding: 0;
  }
  .cart-main .cart section.left .club-banner {
    align-items: flex-start !important;
  }
  .cart-main .cart section.left .club-banner .left-circle, .cart-main .cart section.left .club-banner .right-circle {
    width: 35% !important;
  }
}
@media only screen and (max-width: 520px) {
  .cart-main .cart {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    padding: 0;
  }
  .cart-main .cart section.left .club-banner {
    align-items: flex-start !important;
  }
  .cart-main .cart section.left .club-banner .left-circle, .cart-main .cart section.left .club-banner .right-circle {
    width: 50% !important;
  }
}
@media only screen and (max-width: 400px) {
  .cart-main .cart .left .items {
    padding: 2.154rem 0 !important;
  }
  .cart-main .cart .left .items .item .mobile-wrap .top .product-type {
    font-size: 0.923rem !important;
  }
  .cart-main .cart .left .items .item .bottom .counter .text {
    font-size: 1.231rem !important;
  }
  .cart-main .cart .left .items .item .bottom .delete {
    font-size: 1.231rem !important;
  }
  .cart-main .cart section.left .items .item .mobile-wrap .top .product-type {
    font-size: 0.923rem !important;
  }
}
.courses-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  background-color: white;
}
.courses-main .top {
  padding: 6rem 0 0 8.8%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5%;
  position: relative;
}
.courses-main .top .left {
  display: flex;
  flex-direction: column;
}
.courses-main .top .left .main-btn {
  width: fit-content;
}
.courses-main .top .left .b1,
.courses-main .top .left .b2 {
  position: relative;
}
.courses-main .top .left .b1 {
  align-self: flex-end;
  right: 12%;
  margin-top: 30%;
}
.courses-main .top .left .b2 {
  align-self: flex-start;
  margin-top: 25%;
}
.courses-main .top .left h2 {
  text-transform: uppercase;
  font-size: 1.25rem;
  font-weight: 400;
  color: #18072F;
}
.courses-main .top .left h1 {
  margin: 1.25rem 0 3rem 0;
  font-size: 4rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  max-width: 35rem;
  color: #18072F;
}
.courses-main .top .right {
  width: 57%;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.courses-main .top .right p {
  font-size: 1.5rem;
  color: #18072F;
  font-weight: 300;
  width: 100%;
  padding-right: 15%;
}
.courses-main .top .right .slider .bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 84%;
}
.courses-main .top .right .slider .bottom h4 {
  font-size: 1rem;
  color: #8C8398;
  font-weight: 400;
  text-transform: uppercase;
}
.courses-main .top .right .slider .bottom nav {
  display: flex;
  gap: 2.75rem;
}
.courses-main .top .right .slider .bottom nav button {
  cursor: pointer;
  height: auto;
  width: auto;
  display: flex;
  padding: 1rem;
  margin: -1rem;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
}
.courses-main .top .right .slider .bottom nav button svg {
  position: static;
  transition: all 0.2s ease-out;
}
.courses-main .top .right .slider .bottom nav button svg path {
  stroke: #18072F;
  transition: all 0.2s ease-out;
}
.courses-main .top .right .slider .bottom nav button.disabled {
  pointer-events: none;
  cursor: default;
}
.courses-main .top .right .slider .bottom nav button.disabled svg path {
  stroke: #FFD7BC;
}
.courses-main .top .right .slider {
  margin-top: 2.5rem;
  width: 100%;
}
.courses-main .top .right .slider .images img {
  width: 21.6666vw;
  aspect-ratio: 416/464;
  object-fit: cover;
  object-position: center;
  scroll-snap-align: start;
}
.courses-main .top .right .slider .images {
  max-width: 57.69vw;
  width: 100%;
  gap: 1.25rem;
  display: flex;
  overflow-x: scroll;
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  scroll-snap-type: x mandatory;
  /* Internet Explorer 10+ */
}
.courses-main .top .right .slider .images::-webkit-scrollbar {
  /* WebKit */
  width: 0;
  height: 0;
}
.courses-main .top .right .slider .scroll-indicator {
  width: 100%;
  background-color: #FEF8F3;
  height: 0.188rem;
  margin: 2rem 0;
}
.courses-main .top .right .slider .scroll-indicator .indicator {
  width: 44%;
  height: 100%;
  background-color: #18072F;
}
.courses-main .top .right .link {
  margin-top: 1.813rem;
  margin-bottom: 3rem;
}
.courses-main .top svg {
  position: absolute;
}
.courses-main .top .link {
  font-size: 1rem;
  text-decoration: underline;
  font-family: "Satoshi", sans-serif;
  font-weight: 500;
}
.courses-main .lecturers {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 7.8%;
  padding-top: 21.75rem;
  padding-bottom: 21.75rem;
  position: relative;
}
.courses-main .lecturers .b1 {
  position: absolute;
  top: 7.875rem;
  right: 9%;
}
.courses-main .lecturers h6 {
  font-size: 1.375rem;
  margin-bottom: 1rem;
  text-transform: uppercase;
  font-weight: 400;
}
.courses-main .lecturers .left .link {
  font-size: 1rem;
  text-decoration: underline;
  font-family: "Satoshi", sans-serif;
  font-weight: 500;
  color: #8C8398;
}
.courses-main .lecturers .left .link:hover {
  color: #18072F;
  opacity: 1;
}
.courses-main .lecturers .left {
  display: flex;
  flex-direction: column;
  width: 23%;
}
.courses-main .lecturers .left .decor {
  margin-top: 10.5rem;
  align-self: flex-end;
}
.courses-main .lecturers .left h2 {
  font-size: 3rem;
  color: #18072F;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  max-width: 29rem;
}
.courses-main .lecturers .left h2 span {
  color: #8C8398;
  font-family: "Quiche Sans", sans-serif;
}
.courses-main .lecturers .left .main-btn {
  margin: 3rem 0 1rem 0;
  color: #18072F;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #F09662;
  width: fit-content;
}
.courses-main .lecturers .left .main-btn:hover {
  background-color: #F09662;
}
.courses-main .lecturers h5 {
  margin-bottom: 8.75rem;
  font-family: "Quiche Sans", sans-serif;
  font-size: 3.75rem;
  font-weight: 400;
}
.courses-main .lecturers .lecturers-wrap {
  width: 44.2%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.625rem;
}
.courses-main .lecturers .lecturers-wrap h6 {
  text-transform: uppercase;
  color: #8C8398;
  font-weight: 400;
  font-size: 1rem;
}
.courses-main .lecturers .lecturers-wrap .lecturers-slider {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.courses-main .lecturers .lecturers-wrap .lecturer {
  width: 47.3%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.25rem;
  position: relative;
  padding: 2rem;
  min-height: 35.438rem;
  position: relative;
  top: 3rem;
}
.courses-main .lecturers .lecturers-wrap .lecturer h3 {
  font-size: 2rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
}
.courses-main .lecturers .lecturers-wrap .lecturer img {
  width: 100%;
  aspect-ratio: 352/248;
  object-fit: cover;
  object-position: center;
  flex-shrink: 0;
}
.courses-main .lecturers .lecturers-wrap .lecturer p {
  font-size: 1.077rem;
  font-weight: 400;
  color: #8C8398;
}
.courses-main .lecturers .lecturers-wrap .lecturer {
  background-color: #FAFAFB;
}
.courses-main .lecturers .lecturers-wrap .lecturer.special {
  top: 0;
  background-color: #FEF8F3;
}
.courses-main .process {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 7.75rem;
  background-color: #FEF8F3;
  width: 100%;
  padding: 11.875rem 0;
}
.courses-main .process h2 {
  font-family: "Quiche Sans", sans-serif;
  font-size: 3rem;
  font-weight: 400;
  color: #18072F;
  text-align: center;
}
.courses-main .process .bullets {
  display: flex;
  justify-content: center;
  gap: 10%;
  width: 100%;
}
.courses-main .process .bullets article {
  display: flex;
  flex-direction: column;
  max-width: 24.625rem;
  align-items: center;
}
.courses-main .process .bullets article h3 {
  margin: 3rem 0 1.5rem 0;
  font-family: "Quiche Sans", sans-serif;
  font-size: 2.25rem;
  color: #18072F;
  font-weight: 400;
}
.courses-main .process .bullets article p {
  font-size: 1.5rem;
  text-align: center;
  color: #8C8398;
}
.courses-main .courses {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  padding-inline: 8.8%;
  margin-bottom: 4.938rem;
  width: 100%;
}
.courses-main .courses .total-courses {
  font-size: 1.5rem;
  color: #8C8398;
  margin-bottom: 6rem;
  font-weight: 400;
}
.courses-main .courses .total-courses span {
  font-weight: 500;
  color: #18072F;
}
.courses-main .courses .decor1 {
  margin-top: 4.875rem;
  align-self: flex-start;
}
.courses-main .courses .decor2 {
  align-self: flex-end;
  margin: 4.875rem 0;
}
.courses-main .courses h2 {
  font-family: "Quiche Sans", sans-serif;
  margin: 0 0 1rem 0;
  font-size: 3rem;
  text-align: center;
  text-transform: uppercase;
  font-weight: 400;
  width: 100%;
}
.courses-main .courses .courses-wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.6666666667%;
  flex-wrap: wrap;
  row-gap: 3.125rem !important;
  width: 100%;
}
.courses-main .courses .courses-wrap .course:hover .img-wrap .hover-effect {
  opacity: 1;
}
.courses-main .courses .courses-wrap .course {
  width: 23%;
}
.courses-main .courses .courses-wrap .course .desktop-link {
  margin-top: 2.438rem;
}
.courses-main .courses .courses-wrap .course {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 3.9%;
}
.courses-main .courses .courses-wrap .course .right {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.courses-main .courses .courses-wrap .course .right .lecturer-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
  margin: 0.563rem 0 1.375rem 0;
}
.courses-main .courses .courses-wrap .course .right .icon-row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.5rem;
  width: 100%;
}
.courses-main .courses .courses-wrap .course .right h6 {
  font-size: 1.5rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  white-space: nowrap;
  width: 100%;
  margin-top: 1.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.courses-main .courses .courses-wrap .course .right .lecturer {
  font-size: 1rem;
  color: #18072F;
}
.courses-main .courses .courses-wrap .course .right .icon-text {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.813rem;
}
.courses-main .courses .courses-wrap .course .right .icon-text span {
  font-size: 0.875rem;
  text-wrap: nowrap;
  font-weight: 400;
  color: #8C8398;
}
.courses-main .courses .courses-wrap .course .right .price {
  font-size: 1rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
}
.courses-main .courses .courses-wrap .course .img-wrap {
  aspect-ratio: 364/296;
  background-color: #FAFAFB;
  flex-shrink: 0;
  width: 100%;
  position: relative;
}
.courses-main .courses .courses-wrap .course .img-wrap .hover-effect {
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 250, 251, 0.24);
  backdrop-filter: blur(3px);
  /* ZDE je blur */
  -webkit-backdrop-filter: blur(3px);
  opacity: 0;
  transition: all 0.2s ease-out;
}
.courses-main .courses .courses-wrap .course .img-wrap .hover-effect svg {
  position: relative;
  z-index: 5;
}
.courses-main .courses .courses-wrap .course .img-wrap img {
  width: 100%;
  height: 100%;
  aspect-ratio: 364/296;
  object-fit: cover;
  object-position: center;
  mix-blend-mode: multiply;
}
.courses-main .courses .decor3 {
  margin: 4.938rem 0;
  align-self: flex-start;
}
.courses-main .courses .decor4 {
  align-self: flex-end;
}
.courses-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-bottom: #F09662 1px solid;
  align-self: center;
  position: relative;
  z-index: 2;
}

@media only screen and (max-width: 1020px) {
  .courses-main .process {
    padding: 7.385rem 0;
    gap: 7.385rem !important;
  }
  .courses-main .process h2 {
    font-size: 2.769rem;
    width: 100%;
    padding-inline: 7.7%;
  }
  .courses-main .process .bullets {
    flex-direction: column;
    gap: 22.769rem;
    align-items: center;
    gap: 7.385rem;
    padding-inline: 7.7%;
  }
  .courses-main .process .bullets article.bullet1 svg {
    width: 2rem;
    height: 3.231rem;
  }
  .courses-main .process .bullets article.bullet2 svg {
    width: 1.308rem;
    height: 3.077rem;
  }
  .courses-main .process .bullets article.bullet3 svg {
    width: 2.923rem;
    height: 3.077rem;
  }
  .courses-main .process .bullets article h3 {
    font-size: 2.308rem;
    margin: 2.769rem 0 1.231rem 0;
  }
  .courses-main .process .bullets article p {
    font-size: 1.385rem;
  }
  .courses-main .top {
    padding-inline: 0;
    padding-top: 4.846rem;
    flex-direction: column;
  }
  .courses-main .top .left {
    width: 100%;
    padding-inline: 7.7%;
  }
  .courses-main .top .left h2 {
    font-size: 1.077rem;
  }
  .courses-main .top .left h1 {
    width: 100%;
    font-size: 2.769rem;
    padding: 0;
    max-width: 100%;
    margin: 1rem 0 2.769rem 0;
  }
  .courses-main .top .left h1 br {
    display: none;
  }
  .courses-main .top .left .main-btn {
    width: 100%;
    margin-bottom: 2.769rem;
  }
  .courses-main .top .right p {
    font-size: 1.231rem;
    font-weight: 300;
  }
  .courses-main .top .right {
    width: 100%;
  }
  .courses-main .top .right .link {
    padding-inline: 7.7%;
    margin-top: 2.769rem;
    margin-bottom: 6rem;
    font-size: 1.231rem;
    position: relative;
  }
  .courses-main .top .right .link svg {
    position: absolute;
    right: 0;
    top: 0;
    right: 17.5%;
  }
  .courses-main .top .right .slider {
    margin-top: 0;
  }
  .courses-main .top .right .slider .images {
    box-sizing: border-box;
    padding-left: 7.7%;
    padding-right: 1.846rem;
    scroll-padding-left: 7.7%;
    gap: 1.846rem;
    max-width: 100vw;
    width: 100%;
  }
  .courses-main .top .right .slider .images img {
    width: 50vw;
  }
  .courses-main .top .right .slider .scroll-indicator {
    height: 1.5px;
    width: auto;
    margin: 1.846rem 0 1.846rem 7.7%;
  }
  .courses-main .top .right .slider .bottom {
    padding-left: 7.7%;
  }
  .courses-main .top .right .slider .bottom nav {
    display: none;
  }
  .courses-main .top .right .slider .bottom h4 {
    font-size: 1rem;
  }
  .courses-main .top h1 {
    font-size: 1.923rem;
    padding-inline: 5%;
    width: 100%;
    max-width: 40.769rem;
  }
  .courses-main .top p {
    font-size: 1.231rem;
    width: 100%;
    padding-inline: 7%;
    max-width: 100%;
  }
  .courses-main .lecturers {
    flex-direction: column;
    padding-top: 4.692rem;
    padding-bottom: 7.308rem;
  }
  .courses-main .lecturers .b1 {
    align-self: flex-start;
    position: static;
    margin-bottom: 4.231rem;
  }
  .courses-main .lecturers .left {
    width: 100%;
    padding-inline: 7.7%;
  }
  .courses-main .lecturers .left h2 {
    font-size: 2.769rem;
  }
  .courses-main .lecturers .left .main-btn {
    width: 100%;
    margin: 1.846rem 0 1rem 0;
  }
  .courses-main .lecturers .left .link {
    font-size: 1.231rem;
    margin-bottom: 3.462rem;
  }
  .courses-main .lecturers .lecturers-wrap {
    width: 100%;
    gap: 0 !important;
  }
  .courses-main .lecturers .lecturers-wrap .b2 {
    align-self: flex-end;
    position: relative;
    right: 7.3%;
  }
  .courses-main .lecturers .lecturers-wrap .scroll-indicator-lecturers {
    width: 92.3%;
    background-color: #FEF8F3;
    height: 1.5px;
    margin: 1.846rem 0 1.846rem 7.7%;
  }
  .courses-main .lecturers .lecturers-wrap .scroll-indicator-lecturers .indicator {
    width: 55%;
    height: 100%;
    background-color: #18072F;
  }
  .courses-main .lecturers .lecturers-wrap h6 {
    padding-inline: 7.7%;
    font-size: 1rem;
    margin-bottom: 0.385rem;
  }
  .courses-main .lecturers .lecturers-wrap .lecturers-slider {
    scroll-snap-type: x mandatory;
    scroll-padding-left: 7.7%;
    max-width: 100vw;
    padding-left: 7.7%;
    padding-right: 1.538rem;
    gap: 1.538rem;
    overflow-x: scroll;
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    align-items: stretch;
  }
  .courses-main .lecturers .lecturers-wrap .lecturers-slider .lecturer {
    min-height: auto;
    min-width: 17.692rem;
    width: 60vw;
    flex-shrink: 0;
    scroll-snap-align: start;
    position: static;
    padding: 1.538rem;
    gap: 0;
  }
  .courses-main .lecturers .lecturers-wrap .lecturers-slider .lecturer img {
    margin: 0;
  }
  .courses-main .lecturers .lecturers-wrap .lecturers-slider .lecturer h3 {
    font-size: 1.538rem;
    margin: 1.846rem 0 0.692rem 0;
  }
  .courses-main .lecturers .lecturers-wrap .lecturers-slider .lecturer p {
    font-size: 1rem !important;
  }
  .courses-main .lecturers h6 {
    font-size: 1.231rem;
    text-transform: none;
    margin-bottom: 0.462rem;
  }
  .courses-main .lecturers h5 {
    font-size: 2.692rem;
    margin-bottom: 4.615rem;
    text-align: left;
  }
  .courses-main .lecturers .center-h5 {
    text-align: center;
    padding-inline: 5%;
  }
  .courses-main .courses {
    margin-bottom: 3.846rem;
  }
  .courses-main .courses .mobile-decor2 {
    align-self: flex-end;
    margin-top: 3.846rem;
    position: relative;
    right: 3.5%;
  }
  .courses-main .courses {
    padding-inline: 4%;
    margin-bottom: 4.462rem;
    padding-top: 4.462rem;
  }
  .courses-main .courses .mobile-decor1 {
    align-self: flex-start;
    left: 4%;
    position: relative;
  }
  .courses-main .courses h2 {
    font-size: 2.462rem;
    margin: 4.462rem 0 1.846rem 0;
  }
  .courses-main .courses .total-courses {
    font-size: 1.231rem;
  }
  .courses-main .courses .courses-wrap {
    gap: 4% !important;
    row-gap: 1rem !important;
  }
  .courses-main .courses .courses-wrap .course {
    width: 48%;
  }
  .courses-main .courses .courses-wrap .course .right {
    flex: 1;
  }
  .courses-main .courses .courses-wrap .course .right h6 {
    font-size: 1.077rem;
    margin-top: 1.231rem;
  }
  .courses-main .courses .courses-wrap .course .right .lecturer-row {
    margin-top: 0.692rem;
    margin-bottom: 0.692rem;
  }
  .courses-main .courses .courses-wrap .course .right .lecturer {
    font-size: 0.692rem;
    color: #18072F;
    font-weight: 500;
  }
  .courses-main .courses .courses-wrap .course .right .price {
    font-size: 0.692rem;
  }
  .courses-main .courses .courses-wrap .course .right .icon-row {
    gap: 1.231rem !important;
  }
  .courses-main .courses .courses-wrap .course .right .icon-text {
    gap: 0.692rem !important;
  }
  .courses-main .courses .courses-wrap .course .right .icon-text .time {
    width: 0.692rem;
    height: 0.846rem;
  }
  .courses-main .courses .courses-wrap .course .right .icon-text .location {
    width: 0.462rem;
    height: 0.846rem;
  }
  .courses-main .courses .courses-wrap .course .right .icon-text span {
    font-size: 0.692rem;
    text-transform: uppercase;
    font-weight: 500;
  }
  .courses-main .courses .courses-wrap .course .img-wrap {
    aspect-ratio: 196/148;
  }
  .courses-main .courses .courses-wrap .course .img-wrap img {
    aspect-ratio: 196/148;
  }
  .courses-main .courses .courses-wrap .course .img-wrap .hover-effect {
    aspect-ratio: 196/148;
  }
}
.info-header .basket-icon {
  display: none !important;
}

.info-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.info-main .row {
  width: 100%;
  padding: 9vh 7.3% 0 7.3%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5.2%;
}
.info-main .left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.313rem;
}
.info-main .left .info-category .subcategories {
  display: none;
}
.info-main .left .info-category .arrow-link {
  text-decoration: none;
}
.info-main .left .info-category .arrow-link .plus, .info-main .left .info-category .arrow-link .minus {
  display: none;
}
.info-main .left .info-category.active .arrow-link {
  pointer-events: none;
  text-decoration: underline !important;
}
.info-main .left .info-category.active .arrow-link svg {
  transform: translateX(0.375rem);
}
.info-main h3 {
  font-size: 2.5rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  margin-bottom: 3.125rem;
  color: #18072F;
}
.info-main .info-bars {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.563rem;
  width: 100%;
}
.info-main .info-bars .info-bar .btn {
  color: #18072F;
  width: 100%;
  border: 0;
  background-color: white;
  border-bottom: rgba(240, 150, 98, 0.25) 1px solid;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-bottom: 0.938rem;
  font-size: 1.375rem;
  font-weight: 500;
  transition: ease-out 0.3s;
  outline: none;
}
.info-main .info-bars .info-bar .btn svg {
  flex-shrink: 0;
  transition: ease-out 0.2s;
}
.info-main .info-bars .info-bar p {
  font-size: 1.25rem;
  font-weight: 400;
  color: #18072F;
}
.info-main .info-bars .info-bar p.bold {
  font-weight: 500;
}
.info-main .info-bars .info-bar h6 {
  font-size: 1.375rem;
  font-weight: 700;
  color: #18072F;
}
.info-main .info-bars .info-bar {
  width: 100%;
}
.info-main .info-bars .info-bar .content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.25rem;
  max-height: 0;
  opacity: 0;
  pointer-events: none;
}
.info-main .info-bars .info-bar.active .btn {
  border-color: rgb(240, 150, 98);
}
.info-main .info-bars .info-bar.active .btn svg {
  transform: scale(-1);
}
.info-main .info-bars .info-bar.active .content {
  pointer-events: all;
  padding-top: 1.25rem;
  max-height: 100%;
  opacity: 1;
  transition: ease-out 0.3s;
}
.info-main .info-bars .info-bar.active .content .methods-wrap {
  flex-wrap: wrap;
  row-gap: 0.75rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.25rem;
}
.info-main .info-bars .info-bar.active .content .methods-wrap .vl {
  width: 1px;
  height: 1.719rem;
  background-color: #E6E6E6;
}
.info-main .right {
  display: none;
}
.info-main .right.active {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.info-main .right {
  width: 100%;
  max-width: 59.688rem;
}
.info-main hr {
  width: 85.4%;
  border: 0;
  border-bottom: 1px solid #F09662;
  margin: 0;
  margin-top: 14.875rem;
}

@media only screen and (max-width: 1020px) {
  .info-header .basket-icon {
    display: flex !important;
  }
  .info-main {
    padding-inline: 7.3%;
  }
  .info-main hr {
    margin-top: 4.615rem !important;
    width: 100% !important;
  }
  .info-main .row {
    flex-direction: column-reverse;
    padding: 0;
  }
  .info-main .row .right a {
    text-align: center;
    width: 100%;
    color: #18072F;
    font-weight: 500;
    font-size: 1rem;
    text-decoration: underline;
    margin-top: 4.231rem;
    align-self: center;
    display: flex;
    justify-content: center;
  }
  .info-main .row .right p a {
    margin-top: 0 !important;
    display: inline !important;
    text-align: left;
  }
  .info-main .row .right {
    display: none;
  }
  .info-main .row .right.active {
    display: none;
  }
  .info-main .row .right.mobile-active {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
  }
  .info-main .row .right.mobile-active h3 {
    margin-top: 4.615rem;
    font-size: 1.923rem;
    text-align: center;
    width: 100%;
    margin-bottom: 1.154rem;
  }
  .info-main .row .right .info-bars {
    gap: 0;
  }
  .info-main .row .right .info-bars .info-bar .desktop {
    display: none;
  }
  .info-main .row .right .info-bars .info-bar .btn {
    font-size: 1rem;
    font-weight: 400;
    border-color: #F09662;
    padding: 1.077rem 0;
  }
  .info-main .row .right .info-bars .info-bar {
    order: 2;
  }
  .info-main .row .right .info-bars .info-bar.active {
    order: 1;
  }
  .info-main .row .right .info-bars .info-bar.active .btn {
    text-align: center;
    pointer-events: none;
    padding: 0;
    padding-bottom: 2.308rem;
    font-size: 1.154rem;
    text-align: center;
    font-weight: 400;
    justify-content: center;
  }
  .info-main .row .right .info-bars .info-bar.active .btn svg {
    display: none !important;
  }
  .info-main .row .right .info-bars .info-bar.active .content {
    padding-bottom: 2.308rem;
    border-bottom: 1px solid #F09662;
  }
  .info-main .row .right .info-bars .info-bar .content p {
    font-size: 1.154rem;
  }
  .info-main .row .right .info-bars .info-bar .content h6 {
    font-size: 1.308rem;
  }
  .info-main .row .left h1 {
    padding: 4.615rem 0;
    border-bottom: 1px solid #F09662;
    width: 100%;
    text-align: center;
    font-weight: 400;
    font-family: "Quiche Sans", sans-serif;
    font-size: 1.923rem;
    color: #18072F;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .info-main .row .left.hidden {
    display: none !important;
  }
  .info-main .row .left {
    gap: 0;
    width: 100%;
  }
  .info-main .row .left .info-category {
    width: 100%;
    border-bottom: 1px solid rgba(240, 150, 98, 0.6666666667);
  }
  .info-main .row .left .info-category .arrow-link {
    padding: 1.385rem 0 1.462rem 0;
    width: 100%;
    font-size: 1.154rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
  .info-main .row .left .info-category .arrow-link .arrow {
    display: none;
  }
  .info-main .row .left .info-category .arrow-link svg {
    transform: none !important;
  }
  .info-main .row .left .info-category .arrow-link .minus, .info-main .row .left .info-category .arrow-link .plus {
    display: flex;
    position: absolute;
    right: 0;
  }
  .info-main .row .left .info-category .arrow-link .plus {
    width: 1.077rem !important;
    height: 1.077rem !important;
    transition: ease-out 0.2s;
  }
  .info-main .row .left .info-category .arrow-link .minus {
    width: 1.077rem !important;
    height: 0.154rem !important;
    opacity: 0;
    pointer-events: none;
    transition: ease-out 0.2s;
  }
  .info-main .row .left .info-category .subcategories {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1.538rem;
    width: 100%;
    max-height: 0;
    opacity: 0;
  }
  .info-main .row .left .info-category .subcategories .one-subcategory {
    width: 100%;
    font-size: 1rem;
    background-color: rgba(24, 7, 47, 0);
    border: 0;
    outline: 0;
    color: #18072F !important;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    pointer-events: none;
    text-align: left;
  }
  .info-main .row .left .info-category.active .subcategories {
    padding: 0 0.692rem 1.385rem 0.692rem;
    transition: ease-out 0.2s;
    max-height: fit-content;
    opacity: 1;
  }
  .info-main .row .left .info-category.active .subcategories .one-subcategory {
    pointer-events: all;
  }
  .info-main .row .left .info-category.active .arrow-link svg {
    transform: none !important;
  }
  .info-main .row .left .info-category.active .arrow-link {
    text-decoration: none !important;
    pointer-events: all;
  }
  .info-main .row .left .info-category.active .arrow-link .plus {
    opacity: 0;
    pointer-events: none;
  }
  .info-main .row .left .info-category.active .arrow-link .minus {
    opacity: 1;
    pointer-events: all;
  }
}
.gm-style-iw button {
  display: none !important;
}

.gm-ui-hover-effect {
  display: none;
}

.branches-main {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  position: relative;
}
.branches-main .map-wrap {
  width: 62%;
  height: 90vh;
  position: absolute;
  left: 0;
  top: 0;
}
.branches-main .map-wrap #map {
  width: 100%;
  height: 100%;
}
.branches-main .left {
  width: 62%;
}
.branches-main .left .map-placeholder {
  width: 100%;
  height: 90vh;
}
.branches-main .left .about {
  width: 100%;
  background-color: #18072f;
  padding: 9.438rem 8.8%;
  overflow: hidden;
  position: relative;
}
.branches-main .left .about h2, .branches-main .left .about p {
  color: white;
  position: relative;
  z-index: 2;
}
.branches-main .left .about h2 {
  margin-bottom: 2.813rem;
  font-size: 3.75rem;
  max-width: 43.75rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.branches-main .left .about p {
  font-size: 1.563rem;
  font-weight: 300;
}
.branches-main .left .about .c {
  position: absolute;
  width: 30%;
  height: auto;
}
.branches-main .left .about .right-c {
  top: -15%;
  right: -15%;
}
.branches-main .left .about .left-c {
  left: -15%;
  bottom: -15%;
}
.branches-main .left .about::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  backdrop-filter: blur(45px);
  -webkit-backdrop-filter: blur(45px);
}
.branches-main .left .photos {
  gap: 2px !important;
}
.branches-main .left .photos .indicator-wrap {
  display: none;
}
.branches-main .left .photos {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.25rem;
}
.branches-main .left .photos .top {
  width: 100%;
  aspect-ratio: 1189/628;
  object-fit: cover;
  object-position: center;
}
.branches-main .left .photos .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
}
.branches-main .left .photos .row img {
  width: calc(50% - 1px);
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: center;
}
.branches-main .right {
  width: 38%;
  height: 100dvh;
  position: fixed;
  top: 6rem;
  right: 0;
  box-shadow: 0px 0px 10px rgba(24, 7, 47, 0.1019607843);
}
.branches-main .right .info {
  padding-inline: 13%;
  margin-top: 4vh;
}
.branches-main .right .info h6 {
  font-size: 1.375rem;
  margin: 1.7vh 0;
  font-weight: 500;
  color: rgb(24, 7, 47);
}
.branches-main .right .info h2 {
  font-size: 2.188rem;
  text-transform: uppercase;
  font-family: "Quiche Sans", sans-serif;
  color: #18072F;
  margin-bottom: 2vh;
  font-weight: 400;
}
.branches-main .right .info hr {
  border: 0;
  margin: 0;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
}
.branches-main .right .info .icon-text-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2vh;
  margin: 2.3vh 0;
}
.branches-main .right .info .icon-text-wrap .icon-text p {
  font-size: 1rem;
  color: rgb(24, 7, 47);
}
.branches-main .right .info .icon-text-wrap .icon-text .icon-wrap {
  width: 2.375rem;
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.branches-main .right .info .icon-text-wrap .icon-text {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.225rem;
}
.branches-main .right .info .icon-text-wrap .icon-text.bigger p {
  font-size: 1.125rem;
}
.branches-main .right .info .icon-text-wrap .icon-text {
  font-weight: 400;
}
.branches-main .right .info .icon-text-wrap .icon-text .bold {
  font-weight: 500;
}
.branches-main .right .info .icon-text-wrap.more-margin .icon-text {
  gap: 0.7rem;
}
.branches-main .right .info .dark-btn {
  margin: 2.4vh 0;
}
.branches-main .right .info .arrow-link {
  color: #F09662;
  margin-top: 2vh;
}
.branches-main .right .info .links {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  margin: 2.4vh 0;
}
.branches-main .right .info .links .vl {
  height: 2.75rem;
  width: 1px;
  background-color: rgba(240, 150, 98, 0.5);
}
.branches-main .right .info .links .icon-link {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.938rem;
  width: calc(50% - 0.5px);
  height: 2.75rem;
  font-size: 1.25rem;
  font-weight: 500;
  cursor: pointer;
  color: #18072F;
  text-decoration: underline;
}
.branches-main .right .info .links .icon-link.orange {
  justify-content: flex-end;
  color: rgb(240, 150, 98);
}

@media only screen and (max-width: 1020px) {
  .branches-main {
    flex-direction: column-reverse;
    padding-top: 5.538rem;
  }
  .branches-main .map-wrap {
    top: 5.538rem;
    width: 100%;
    aspect-ratio: 430/344;
    display: flex;
    height: auto;
    min-height: 30rem;
  }
  .branches-main .map-wrap iframe {
    width: 100%;
    height: 100%;
  }
  .branches-main .map-placeholder {
    width: 100%;
    aspect-ratio: 430/344;
    min-height: 30rem;
  }
  .branches-main .left {
    width: 100%;
  }
  .branches-main .left .about {
    padding: 2.231rem 7.3%;
  }
  .branches-main .left .about h2 {
    font-size: 1.923rem;
    margin-bottom: 1.538rem;
  }
  .branches-main .left .about p {
    font-size: 1.231rem;
    max-height: 17.692rem;
  }
  .branches-main .left .about .p-show-more {
    width: 100%;
    height: 9.385rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    position: absolute;
    z-index: 3;
    bottom: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(24, 7, 47, 0.5529411765) 5%, #18072F 65%, #18072F 100%);
    transition: ease-out 0.3s;
    left: 0;
  }
  .branches-main .left .about .p-show-more .show-more, .branches-main .left .about .p-show-more .show-less {
    position: absolute;
    bottom: 1.846rem;
    background-color: rgba(255, 255, 255, 0);
    border: 0;
    height: fit-content;
    font-size: 1.231rem;
    font-weight: 500;
    color: white;
    text-decoration: underline;
  }
  .branches-main .left .about .p-show-more .show-less {
    pointer-events: none;
    opacity: 0;
  }
  .branches-main .left .about.show-more {
    padding-bottom: 5.5rem !important;
  }
  .branches-main .left .about.show-more .p-show-more {
    background: rgba(255, 255, 255, 0);
  }
  .branches-main .left .about.show-more .p-show-more .show-more {
    pointer-events: none;
    opacity: 0;
  }
  .branches-main .left .about.show-more .p-show-more .show-less {
    pointer-events: all;
    opacity: 1;
  }
  .branches-main .left .about.show-more p {
    max-height: fit-content;
  }
  .branches-main .left .photos {
    scrollbar-width: none;
  }
  .branches-main .left .photos::-webkit-scrollbar {
    display: none;
  }
  .branches-main .left .photos-wrap {
    position: relative;
  }
  .branches-main .left .photos-wrap .indicator-wrap {
    position: absolute;
    bottom: 0;
    /* Adjust this to position it correctly */
    left: 0;
    display: flex;
    width: 100%;
    /* Full width */
    height: 4px;
    /* Height of the progress indicator */
    background-color: rgba(255, 255, 255, 0.6);
    z-index: 3;
    /* Background of the indicator */
  }
  .branches-main .left .photos-wrap .indicator-wrap .scroll-indicator {
    height: 100%;
    /* Full height of the indicator wrap */
    background-color: rgb(240, 150, 98);
    /* Progress color */
    width: 33%;
    /* Start at 0% width */
    transition: width 0.2s ease-out;
    /* Smooth transition */
    position: relative;
  }
  .branches-main .left .photos-wrap .photos {
    position: relative !important;
    display: flex;
    flex-direction: row !important;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    padding: 0 !important;
    gap: 0;
    width: 100%;
    scroll-padding: 0;
  }
  .branches-main .left .photos-wrap .photos img {
    aspect-ratio: 1/1 !important;
    width: 100% !important;
    flex-shrink: 0;
    scroll-snap-align: start;
  }
  .branches-main .left .photos-wrap .photos .row {
    flex-shrink: 0;
    aspect-ratio: 1/1 !important;
    width: 100% !important;
    gap: 0 !important;
  }
  .branches-main .right {
    height: fit-content;
    width: 100%;
    position: static;
  }
  .branches-main .right .switch {
    height: 5.538rem;
    position: fixed;
    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    top: 5.923rem;
    z-index: 3;
    border-bottom: 1px solid #FFD7BC;
  }
  .branches-main .right .switch .vl {
    width: 0.75px;
    background-color: #F09662;
  }
  .branches-main .right .switch button {
    font-size: 1.154rem;
  }
  .branches-main .right .switch button svg {
    width: 2.308rem;
    height: 1.538rem;
  }
  .branches-main .right .info {
    padding: 0 7.3% 2.846rem 7.3% !important;
    margin: 4.615rem 0 0 0;
    height: fit-content;
  }
  .branches-main .right .info h2 {
    font-size: 1.385rem;
  }
  .branches-main .right .info h6 {
    font-size: 1rem;
  }
  .branches-main .right .info .arrow-link {
    width: 100%;
    align-items: center;
    justify-content: center;
    margin-top: 3.077rem;
  }
  .branches-main .right .info .arrow-link svg {
    height: 1rem !important;
    width: auto !important;
  }
  .branches-main .right .info .icon-text-wrap .icon-text.bigger p {
    font-size: 1rem !important;
  }
  .branches-main .right .info .icon-text-wrap .icon-text .icon-wrap {
    width: 1.308rem;
    height: 1.308rem;
  }
  .branches-main .right .info .icon-text-wrap .icon-text .icon-wrap svg {
    height: 100% !important;
    width: auto !important;
  }
  .branches-main .right .info .icon-text-wrap .icon-text .icon-wrap svg.time {
    max-width: 1rem;
    max-height: 1.154rem;
  }
  .branches-main .right .info .links .icon-link {
    gap: 0.769rem;
    justify-content: center !important;
  }
  .branches-main .right .info .links .icon-link svg {
    height: 1.154rem;
    width: auto;
  }
  .branches-main .right .info .links .icon-link {
    font-weight: 500;
    font-size: 1rem;
  }
  .branches-main .right .info .links .vl {
    color: #F09662;
    width: 1px;
  }
}
.contact-main {
  z-index: 2;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.contact-main .hero {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.contact-main .hero img {
  width: 100%;
  aspect-ratio: 1920/650;
  object-fit: cover;
  object-position: center;
}
.contact-main .hero h1,
.contact-main .hero h4 {
  font-weight: 400;
  color: #18072F;
  text-align: center;
}
.contact-main .hero h4 {
  margin-top: 4.938rem;
  font-size: 1.375rem;
  text-transform: uppercase;
}
.contact-main .hero h1 {
  margin: 1rem 0 5rem 0;
  font-family: "Quiche Sans", sans-serif;
  font-size: 3.75rem;
}
.contact-main .form {
  background-color: #FEF8F3;
  width: 100%;
  padding: 14vh 10%;
}
.contact-main .form .inner {
  position: relative;
}
.contact-main .form .inner .butterflies {
  position: absolute;
  width: 16%;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.contact-main .form .inner .butterflies .black-b {
  width: 55%;
  height: auto;
  bottom: 0;
  left: 0;
}
.contact-main .form .inner .butterflies .orange-b {
  width: 28%;
  height: auto;
}
.contact-main .form .inner {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 4%;
}
.contact-main .form .inner .left {
  width: 31%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.5rem;
}
.contact-main .form .inner .left h3 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.contact-main .form .inner .left p {
  font-size: 1.25rem;
}
.contact-main .form .inner .right {
  width: 65%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.313rem;
}
.contact-main .form .inner .right .inputs-heading {
  width: 100%;
}
.contact-main .form .inner .right .dark-btn {
  max-width: 33.4%;
  align-self: flex-end;
}
.contact-main .form .inner .right .check-wrap {
  margin-top: 0.188rem;
  width: 100%;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.2);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.563rem;
}
.contact-main .form .inner .right .check-wrap span {
  font-size: 1rem;
  font-weight: 400;
  color: rgb(24, 7, 47);
}
.contact-main .form .inner .right .check-wrap span a {
  color: #F09662;
  text-decoration: underline;
  font-weight: 500;
  display: inline !important;
}
.contact-main .form .inner .right .check-wrap label {
  flex-shrink: 0;
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.contact-main .form .inner .right .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.contact-main .form .inner .right .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.contact-main .form .inner .right .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.contact-main .form .inner .right .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.contact-main .form .inner .right .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.contact-main .form .inner .right .check-wrap label input:checked + span svg {
  opacity: 1;
}
.contact-main .form .inner .right .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}
.contact-main .bottom {
  padding: 20vh 7.3% 0 7.3%;
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5%;
  flex-wrap: wrap;
  width: 100%;
  row-gap: 20vh;
}
.contact-main .bottom .info .arrow-link {
  color: #18072F;
}
.contact-main .bottom .info {
  width: 30%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.813rem;
}
.contact-main .bottom .info h5 {
  font-size: 2.813rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  color: #18072F;
  padding-bottom: 1.75rem;
  width: 100%;
  border-bottom: 1px solid #F09662;
}
.contact-main .bottom .info .operator h6 {
  font-size: 1.25rem;
  font-weight: 500;
  color: #F09662;
  margin-bottom: 1.25rem;
}
.contact-main .bottom .info .operator p {
  font-size: 1rem;
  color: #18072F;
}
.contact-main .bottom .info .icon-text {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 4%;
}
.contact-main .bottom .info .icon-text.center {
  align-items: center;
}
.contact-main .bottom .info .icon-text.margin {
  margin-top: 0.753rem;
}
.contact-main .bottom .info .icon-text .icon-wrap {
  flex-shrink: 0;
  width: 1.813rem !important;
}
.contact-main .bottom .info .icon-text .icon-wrap svg {
  max-width: 1.813rem;
}
.contact-main .bottom .info .icon-text .icon-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
}
.contact-main .bottom .info .icon-text .text-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.contact-main .bottom .info .icon-text .text-wrap span {
  font-size: 1.125rem;
  color: #18072F;
}
.contact-main .bottom .info .icon-text .text-wrap span .bold {
  font-weight: 500;
}
.contact-main .bottom .info .icon-text .text-wrap span.bold {
  font-weight: 500;
}
.contact-main .bottom .info .icon-text .text-wrap span a {
  text-decoration: underline;
  font-weight: 500;
  color: #18072F;
}
.contact-main .bottom hr {
  width: 100%;
  margin: 0;
  border: 0;
  border-bottom: 1px solid #F09662;
}

@media only screen and (max-width: 1020px) {
  .contact-main .hero img {
    aspect-ratio: 430/307;
  }
  .contact-main .hero h4 {
    font-size: 1.231rem;
    text-transform: none;
    margin-top: 4.615rem;
  }
  .contact-main .hero h1 {
    font-size: 2.692rem;
    text-align: center;
    padding-inline: 5%;
    margin-bottom: 4.615rem;
  }
  .contact-main .form {
    padding: 8vh 7.3%;
  }
  .contact-main .form .inner {
    flex-direction: column !important;
  }
  .contact-main .form .inner .left h3 {
    font-size: 1.923rem;
  }
  .contact-main .form .inner .left {
    position: relative;
    width: 100%;
  }
  .contact-main .form .inner .left p {
    font-size: 1.231rem;
  }
  .contact-main .form .inner .left .butterflies {
    margin-bottom: 1.154rem;
    position: static;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0;
    flex-direction: row-reverse;
    width: 100%;
    left: 0;
  }
  .contact-main .form .inner .left .butterflies .orange-b {
    transform: rotate(90deg);
    min-width: 2.538rem;
    width: 10%;
  }
  .contact-main .form .inner .left .butterflies .black-b {
    min-width: 5.154rem;
    width: 19%;
  }
  .contact-main .form .inner .right {
    width: 100%;
  }
  .contact-main .form .inner .right .inputs-heading h6 {
    font-size: 1.692rem;
  }
  .contact-main .form .inner .right .inputs-heading {
    gap: 2.538rem !important;
  }
  .contact-main .form .inner .right .inputs-heading .two-inputs {
    flex-direction: column;
    gap: 2.5rem !important;
  }
  .contact-main .form .inner .right .inputs-heading .two-inputs input {
    font-size: 1.385rem;
  }
  .contact-main .form .inner .right .inputs-heading .two-inputs select {
    font-size: 1.385rem;
  }
  .contact-main .form .inner .right .check-wrap {
    gap: 1.231rem !important;
  }
  .contact-main .form .inner .right .check-wrap label {
    width: 2.154rem;
    height: 2.154rem;
  }
  .contact-main .form .inner .right .dark-btn {
    width: 100% !important;
    max-width: 100%;
  }
  .contact-main .bottom {
    padding-top: 8vh;
    flex-direction: column !important;
    gap: 8vh;
  }
  .contact-main .bottom .info {
    width: 100%;
  }
  .contact-main .bottom .info h5 {
    font-size: 2rem;
    text-transform: uppercase;
    padding-bottom: 1.2rem;
  }
  .contact-main .bottom .info span {
    font-size: 1.077rem !important;
  }
}
.loyalty-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.loyalty-main .hero {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.loyalty-main .hero .left, .loyalty-main .hero .right {
  width: 50%;
}
.loyalty-main .hero .left {
  height: 100dvh;
  color: rgb(24, 7, 47);
  padding: 0 9% 0 6.5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
}
.loyalty-main .hero .left h5 {
  font-size: 1.375rem;
  font-weight: 400;
  color: rgb(24, 7, 47);
  text-transform: uppercase;
}
.loyalty-main .hero .left h1 {
  margin: 0.938rem 0 2.813rem 0;
  font-size: 3.75rem;
  font-weight: 400;
  color: rgb(24, 7, 47);
  font-family: "Quiche Sans", sans-serif;
}
.loyalty-main .hero .left p {
  font-size: 1.563rem;
  margin-bottom: 1.688rem;
  font-weight: 300;
}
.loyalty-main .hero .left h6 {
  font-size: 1.563rem;
  margin-bottom: 1.688rem;
  font-weight: 500;
}
.loyalty-main .hero .left .btns {
  padding-top: 1.125rem;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5%;
}
.loyalty-main .hero .left .btns .main-btn {
  flex: 1;
  text-wrap: nowrap;
}
.loyalty-main .hero .left .btns .main-btn.outline {
  flex: 0;
  background-color: rgba(24, 7, 47, 0);
  color: rgb(24, 7, 47);
  border: rgb(24, 7, 47) 1px solid;
  width: fit-content;
  padding-inline: 2.625rem;
}
.loyalty-main .hero .left .btns .main-btn.outline:hover {
  background-color: rgb(24, 7, 47);
  color: white;
}
.loyalty-main .hero .right {
  background-color: #FEF8F3;
  height: calc(100dvh - 6rem);
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 0;
}
.loyalty-main .hero .right img {
  mix-blend-mode: multiply;
  margin-left: 10%;
  width: 70%;
  height: auto;
  object-fit: contain;
  max-height: 90%;
}
.loyalty-main .step {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 69%;
}
.loyalty-main .step.last {
  margin-bottom: 20vh;
}
.loyalty-main .step.padding-top {
  padding-top: 25vh;
}
.loyalty-main .step img {
  width: 45%;
  aspect-ratio: 589/473;
  object-fit: cover;
  object-position: center;
  background-color: #FEF8F3;
}
.loyalty-main .step article {
  width: 45%;
}
.loyalty-main .step article h2 {
  font-size: 3.75rem;
  font-weight: 400;
  color: rgb(24, 7, 47);
  font-family: "Quiche Sans", sans-serif;
  margin-bottom: 6vh;
}
.loyalty-main .step article p {
  font-size: 2.188rem;
  font-weight: 300;
  color: rgb(24, 7, 47);
}
.loyalty-main .path .vl {
  height: 25vh;
  width: 2px;
  background-color: #F09662;
}
.loyalty-main .path {
  margin: 10vh 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5vh;
}
.loyalty-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-bottom: 1px solid #F09662;
}

@media only screen and (max-width: 1020px) {
  .loyalty-main .hero {
    flex-direction: column-reverse !important;
  }
  .loyalty-main .hero .right {
    width: 100%;
    aspect-ratio: 430/440;
    height: auto;
  }
  .loyalty-main .hero .right img {
    height: auto;
  }
  .loyalty-main .hero .left {
    height: auto;
    width: 100%;
    padding: 4.615rem 7.3% 0 7.3%;
  }
  .loyalty-main .hero .left h5 {
    text-transform: none;
    width: 100%;
    font-size: 1.231rem;
    text-align: center;
  }
  .loyalty-main .hero .left h1 {
    font-size: 2.692rem;
    text-align: center;
    width: 100%;
    margin: 0.385rem 0 3.692rem 0;
  }
  .loyalty-main .hero .left p, .loyalty-main .hero .left h6 {
    font-size: 1.231rem;
  }
  .loyalty-main .hero .left .btns {
    padding-top: 2rem;
    flex-direction: column;
    gap: 1.154rem;
    width: 100%;
    height: fit-content;
  }
  .loyalty-main .hero .left .btns .main-btn {
    flex: 0;
    flex-shrink: 0;
    height: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex;
    padding: 1.385rem 0;
  }
  .loyalty-main .step {
    flex-direction: column-reverse;
    gap: 1.538rem;
    width: 100%;
    padding-inline: 7.3%;
  }
  .loyalty-main .step.last {
    margin-bottom: 4.615rem;
  }
  .loyalty-main .step img {
    width: 100%;
    aspect-ratio: 358/288;
  }
  .loyalty-main .step article {
    width: 100%;
  }
  .loyalty-main .step article h2 {
    font-size: 1.692rem !important;
    width: 100%;
    text-align: center;
    margin-bottom: 0.769rem;
  }
  .loyalty-main .step article p {
    font-size: 1.154rem;
    text-align: center;
  }
  .loyalty-main .step.padding-top {
    padding-top: 8.5rem !important;
  }
  .loyalty-main .path {
    margin: 4.615rem 0;
  }
}
.custom-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.custom-main .hero {
  width: 100%;
  padding-inline: 7.3%;
  padding-top: 4.438rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.custom-main .hero .left {
  width: 44%;
}
.custom-main .hero .left h2 {
  text-transform: uppercase;
  font-size: 1.563rem;
  font-weight: 400;
}
.custom-main .hero .left h1 {
  font-size: 4rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  margin: 1rem 0 2.5rem 0;
}
.custom-main .hero .images {
  width: 44%;
  position: relative;
  aspect-ratio: 843/840;
}
.custom-main .hero .images img {
  object-position: center;
  object-fit: cover;
}
.custom-main .hero .images .img1 {
  width: 50%;
  aspect-ratio: 1/1;
  position: absolute;
  z-index: 1;
  left: 0;
  top: 14%;
}
.custom-main .hero .images .img2 {
  aspect-ratio: 539/377;
  width: 64%;
  position: absolute;
  z-index: 3;
  left: 26%;
  bottom: 0;
}
.custom-main .hero .images .img3 {
  width: 43.3%;
  aspect-ratio: 365/515;
  position: absolute;
  z-index: 2;
  right: 0;
  top: 0;
}
.custom-main .form-wrap {
  padding-top: 4.375rem;
  width: 100%;
}
.custom-main .form-wrap .form {
  background-color: #FEF8F3;
  width: 100%;
  padding: 14vh 10%;
}
.custom-main .form-wrap .form .inner {
  position: relative;
}
.custom-main .form-wrap .form .inner .butterflies {
  position: absolute;
  width: 16%;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.custom-main .form-wrap .form .inner .butterflies .black-b {
  width: 55%;
  height: auto;
  bottom: 0;
  left: 0;
}
.custom-main .form-wrap .form .inner .butterflies .orange-b {
  width: 28%;
  height: auto;
}
.custom-main .form-wrap .form .inner {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 4%;
}
.custom-main .form-wrap .form .inner .left {
  width: 31%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.5rem;
}
.custom-main .form-wrap .form .inner .left h3 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.custom-main .form-wrap .form .inner .left p {
  font-size: 1.25rem;
}
.custom-main .form-wrap .form .inner .left p .bold {
  font-weight: 500 !important;
}
.custom-main .form-wrap .form .inner .right {
  width: 65%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.313rem;
}
.custom-main .form-wrap .form .inner .right .inputs-heading {
  width: 100%;
}
.custom-main .form-wrap .form .inner .right .dark-btn {
  max-width: 33.4%;
  align-self: flex-end;
}
.custom-main .form-wrap .form .inner .right .check-wrap {
  margin-top: 0.188rem;
  width: 100%;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.2);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.563rem;
}
.custom-main .form-wrap .form .inner .right .check-wrap span {
  font-size: 1rem;
  font-weight: 400;
  color: rgb(24, 7, 47);
}
.custom-main .form-wrap .form .inner .right .check-wrap span a {
  color: #F09662;
  text-decoration: underline;
  font-weight: 500;
  display: inline !important;
}
.custom-main .form-wrap .form .inner .right .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.custom-main .form-wrap .form .inner .right .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.custom-main .form-wrap .form .inner .right .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.custom-main .form-wrap .form .inner .right .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.custom-main .form-wrap .form .inner .right .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.custom-main .form-wrap .form .inner .right .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.custom-main .form-wrap .form .inner .right .check-wrap label input:checked + span svg {
  opacity: 1;
}
.custom-main .form-wrap .form .inner .right .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}

@media only screen and (max-width: 1020px) {
  .custom-main .hero {
    margin-top: 4.615rem;
    padding: 0;
    flex-direction: column;
  }
  .custom-main .hero .main-btn {
    width: 83.4% !important;
  }
  .custom-main .hero .left {
    width: 100%;
    padding-inline: 7.3%;
  }
  .custom-main .hero .left h2 {
    font-size: 1.231rem;
    text-transform: none;
  }
  .custom-main .hero .left h1 {
    font-size: 2.692rem;
    margin: 0.385rem 0 4.154rem 0;
  }
  .custom-main .images {
    width: 88% !important;
    aspect-ratio: 1/1 !important;
    margin-bottom: 4.154rem;
  }
  .form-wrap .form {
    padding: 8vh 7.3%;
  }
  .form-wrap .form .inner {
    flex-direction: column !important;
  }
  .form-wrap .form .inner .left h3 {
    font-size: 1.923rem;
  }
  .form-wrap .form .inner .left {
    position: relative;
    width: 100% !important;
  }
  .form-wrap .form .inner .left p {
    font-size: 1.231rem;
  }
  .form-wrap .form .inner .left .butterflies {
    margin-bottom: 1.154rem;
    position: static;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0;
    flex-direction: row-reverse;
    width: 100% !important;
    left: 0;
  }
  .form-wrap .form .inner .left .butterflies .orange-b {
    transform: rotate(90deg);
    min-width: 2.538rem;
    width: 10%;
  }
  .form-wrap .form .inner .left .butterflies .black-b {
    min-width: 5.154rem;
    width: 19%;
  }
  .form-wrap .form .inner .right {
    width: 100% !important;
  }
  .form-wrap .form .inner .right .inputs-heading h6 {
    font-size: 1.692rem;
  }
  .form-wrap .form .inner .right .inputs-heading {
    gap: 2.538rem !important;
  }
  .form-wrap .form .inner .right .inputs-heading .two-inputs {
    flex-direction: column;
    gap: 2.5rem !important;
  }
  .form-wrap .form .inner .right .inputs-heading .two-inputs input {
    font-size: 1.385rem;
  }
  .form-wrap .form .inner .right .inputs-heading .two-inputs select {
    font-size: 1.385rem;
  }
  .form-wrap .form .inner .right .check-wrap {
    gap: 1.231rem !important;
  }
  .form-wrap .form .inner .right .check-wrap label {
    width: 2.154rem;
    height: 2.154rem;
  }
  .form-wrap .form .inner .right .dark-btn {
    width: 100% !important;
    max-width: 100% !important;
  }
}
@media only screen and (max-width: 404px) {
  .custom-main .hero .left h1 {
    font-size: 2.1rem !important;
  }
}
.about-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.about-main .hero {
  padding-top: 7.5rem;
  position: relative;
  width: 100%;
  color: #18072F;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  width: 70%;
  align-self: center;
  margin-bottom: 2.5rem;
}
.about-main .hero .butterflies .blue-b {
  position: absolute;
}
.about-main .hero {
  gap: 0;
}
.about-main .hero h6 {
  margin-top: 3.75rem;
  font-size: 1.563rem;
  text-transform: uppercase;
  font-weight: 400;
}
.about-main .hero h1 {
  margin-top: 1rem;
  font-size: 4.063rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-align: center;
}
.about-main .hero p {
  font-size: 1.875rem;
  font-family: "Quiche Sans", sans-serif;
  margin-top: 3.75rem;
  text-align: center;
  margin-bottom: 9.308rem;
}
.about-main .hero .vl {
  width: 1px;
  background-color: rgba(24, 7, 47, 0.9176470588);
  height: 11.25rem;
}
.about-main .hero svg {
  margin-bottom: 0.688rem;
}
.about-main .story {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 5rem;
  width: 70%;
  margin-top: 5rem;
}
.about-main .story .heading {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 2.063rem;
}
.about-main .story .heading h4 {
  font-size: 1.563rem;
  text-transform: uppercase;
  font-weight: 400;
}
.about-main .story .content {
  height: 72vh;
}
.about-main .story .content .img-wrap {
  width: 44%;
  background-size: cover;
  background-position: center;
  background-color: #FAFAFB;
  height: 100%;
}
.about-main .story .content {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.about-main .story .content .vl {
  height: 100%;
  width: 1px;
  border-left: 2px dashed transparent;
  border-image: repeating-linear-gradient(to bottom, #E8996B, #E8996B 8px, transparent 8px, transparent 16px) 1;
}
.about-main .story .content p {
  font-size: 1.375rem;
  width: 44%;
}
.about-main .end {
  margin-top: 5rem;
}
.about-main .end h2 {
  font-size: 4.063rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-align: center;
}
.about-main .end {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 5.063rem;
  width: 100%;
}
.about-main .end img {
  width: 94.7%;
  aspect-ratio: 1819/960;
  object-fit: cover;
  object-position: center;
  background-color: #FAFAFB;
}
.about-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
  margin-top: 7.5rem;
}

@media only screen and (max-width: 1020px) {
  .about-main .hero {
    width: 85.4%;
    padding-top: 4.615rem;
    margin-bottom: 1rem;
  }
  .about-main .hero h6 {
    text-transform: none;
    font-size: 1.231rem;
    margin-top: 2.692rem;
  }
  .about-main .hero h1 {
    font-size: 1.923rem;
    margin-top: 0.385rem;
    text-transform: uppercase;
  }
  .about-main .hero p {
    font-size: 1.231rem;
    margin-top: 1.923rem;
    margin-bottom: 7.692rem;
  }
  .about-main .story {
    width: 85.4%;
    gap: 6.538rem;
  }
  .about-main .story .heading {
    font-size: 1.538rem;
  }
  .about-main .story .content .img-wrap {
    width: 100%;
    aspect-ratio: 375/443;
    order: 0;
  }
  .about-main .story .content {
    height: auto;
    flex-direction: column;
    gap: 2.308rem;
  }
  .about-main .story .content .vl {
    order: 2;
    height: 21.462rem;
    margin: 3.846rem 0 1.538rem 0;
  }
  .about-main .story .content.last .vl {
    display: none;
  }
  .about-main .story .content p {
    width: 100%;
    order: 1;
    font-size: 1.231rem;
  }
  .about-main .end {
    gap: 2.308rem;
  }
  .about-main .end h2 {
    font-size: 1.923rem;
    text-transform: uppercase;
  }
  .about-main .end img {
    width: 100%;
    aspect-ratio: 430/328;
  }
}
.login-main, .forgotten-password-main, .set-new-password-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  color: #18072F;
}
.login-main .hero, .forgotten-password-main .hero, .set-new-password-main .hero {
  padding-top: 3.75rem;
  width: 74%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.login-main .hero .middle h1, .login-main .hero .middle h2, .forgotten-password-main .hero .middle h1, .forgotten-password-main .hero .middle h2, .set-new-password-main .hero .middle h1, .set-new-password-main .hero .middle h2 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.login-main .hero .middle, .forgotten-password-main .hero .middle, .set-new-password-main .hero .middle {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: flex-start;
  gap: 0;
}
.login-main .hero .middle .left, .login-main .hero .middle .right, .forgotten-password-main .hero .middle .left, .forgotten-password-main .hero .middle .right, .set-new-password-main .hero .middle .left, .set-new-password-main .hero .middle .right {
  width: 33%;
  min-width: 30.25rem;
}
.login-main .hero .middle, .forgotten-password-main .hero .middle, .set-new-password-main .hero .middle {
  padding: 6.25rem 0 1.938rem 0;
}
.login-main .hero .middle .left h1, .forgotten-password-main .hero .middle .left h1, .set-new-password-main .hero .middle .left h1 {
  margin-bottom: 0.8rem;
}
.login-main .hero .middle .left .inputs-heading, .forgotten-password-main .hero .middle .left .inputs-heading, .set-new-password-main .hero .middle .left .inputs-heading {
  width: 100%;
}
.login-main .hero .middle .left, .forgotten-password-main .hero .middle .left, .set-new-password-main .hero .middle .left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.5rem;
}
.login-main .hero .middle .left .arrow-link, .forgotten-password-main .hero .middle .left .arrow-link, .set-new-password-main .hero .middle .left .arrow-link {
  align-self: center;
}
.login-main .hero .middle .left .check-wrap, .forgotten-password-main .hero .middle .left .check-wrap, .set-new-password-main .hero .middle .left .check-wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.25rem;
}
.login-main .hero .middle .left .check-wrap span, .forgotten-password-main .hero .middle .left .check-wrap span, .set-new-password-main .hero .middle .left .check-wrap span {
  font-size: 1.125rem;
}
.login-main .hero .middle .left .check-wrap label, .forgotten-password-main .hero .middle .left .check-wrap label, .set-new-password-main .hero .middle .left .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.login-main .hero .middle .left .check-wrap label:hover, .forgotten-password-main .hero .middle .left .check-wrap label:hover, .set-new-password-main .hero .middle .left .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.login-main .hero .middle .left .check-wrap label input, .forgotten-password-main .hero .middle .left .check-wrap label input, .set-new-password-main .hero .middle .left .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.login-main .hero .middle .left .check-wrap label span, .forgotten-password-main .hero .middle .left .check-wrap label span, .set-new-password-main .hero .middle .left .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.login-main .hero .middle .left .check-wrap label span, .forgotten-password-main .hero .middle .left .check-wrap label span, .set-new-password-main .hero .middle .left .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.login-main .hero .middle .left .check-wrap label span svg, .forgotten-password-main .hero .middle .left .check-wrap label span svg, .set-new-password-main .hero .middle .left .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.login-main .hero .middle .left .check-wrap label input:checked + span svg, .forgotten-password-main .hero .middle .left .check-wrap label input:checked + span svg, .set-new-password-main .hero .middle .left .check-wrap label input:checked + span svg {
  opacity: 1;
}
.login-main .hero .middle .left .check-wrap label input:checked + span, .forgotten-password-main .hero .middle .left .check-wrap label input:checked + span, .set-new-password-main .hero .middle .left .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}
.login-main .hero .middle .right p, .forgotten-password-main .hero .middle .right p, .set-new-password-main .hero .middle .right p {
  font-size: 1.25rem;
  margin: 1.8rem 0 2.4rem 0;
}
.login-main .hero .butterflies, .forgotten-password-main .hero .butterflies, .set-new-password-main .hero .butterflies {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.188rem;
}
.login-main .hero .butterflies .big-b, .forgotten-password-main .hero .butterflies .big-b, .set-new-password-main .hero .butterflies .big-b {
  width: 8.313rem;
  height: auto;
}
.login-main .hero .butterflies .small-b, .forgotten-password-main .hero .butterflies .small-b, .set-new-password-main .hero .butterflies .small-b {
  width: 4.125rem;
  height: auto;
}
.login-main .hero .butterflies.top, .forgotten-password-main .hero .butterflies.top, .set-new-password-main .hero .butterflies.top {
  align-items: flex-end;
}
.login-main .hero .butterflies.bottom, .forgotten-password-main .hero .butterflies.bottom, .set-new-password-main .hero .butterflies.bottom {
  align-self: flex-end;
}
.login-main hr, .forgotten-password-main hr, .set-new-password-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
  margin-top: 3.75rem;
}

.forgotten-password-main .middle, .set-new-password-main .middle {
  flex-direction: column !important;
  max-width: 35.875rem;
  width: 70%;
  padding: 3rem 0 !important;
  align-self: center;
  gap: 2.5rem !important;
}
.forgotten-password-main .middle h1, .set-new-password-main .middle h1 {
  text-align: center !important;
  width: 100%;
}
.forgotten-password-main .middle p, .set-new-password-main .middle p {
  font-size: 1.25rem;
}
.forgotten-password-main .middle .inputs-heading, .set-new-password-main .middle .inputs-heading {
  width: 100%;
}
.forgotten-password-main hr, .set-new-password-main hr {
  margin-top: 7.5rem !important;
}

@media only screen and (max-width: 1020px) {
  .login-main .hero {
    padding-top: 4.615rem;
    width: 85.4%;
    flex-direction: column !important;
  }
  .login-main .hero .butterflies {
    display: none;
  }
  .login-main .hero .middle {
    padding-top: 0;
  }
  .login-main .hero .middle h1, .login-main .hero .middle h2 {
    text-align: center;
    width: 100%;
    font-size: 1.923rem;
  }
  .login-main .hero .middle {
    flex-direction: column !important;
    gap: 6.923rem;
  }
  .login-main .hero .middle .left .check-wrap, .login-main .hero .middle .right .check-wrap {
    width: 100%;
    flex-direction: row-reverse;
    justify-content: space-between;
  }
  .login-main .hero .middle .left .check-wrap label, .login-main .hero .middle .right .check-wrap label {
    width: 2.154rem;
    height: 2.154rem;
  }
  .login-main .hero .middle .left, .login-main .hero .middle .right {
    width: 100%;
    min-width: 0 !important;
  }
  .forgotten-password-main .hero {
    width: 100%;
    padding-inline: 7.3%;
    padding-top: 4.615rem;
  }
  .forgotten-password-main .hero .butterflies-signature {
    align-self: center;
  }
  .forgotten-password-main .hero .butterflies-signature .orange-b {
    width: 5.154rem;
    height: auto;
  }
  .forgotten-password-main .hero .butterflies-signature .blue-b {
    width: 1.923rem;
    height: auto;
  }
  .forgotten-password-main .hero .middle {
    padding-top: 0 !important;
    width: 100%;
    gap: 2.5rem;
  }
  .forgotten-password-main .hero .middle p {
    font-size: 1.231rem;
  }
  .forgotten-password-main .hero h1 {
    width: 100%;
    font-size: 1.923rem !important;
  }
  .set-new-password-main .hero {
    padding: 10vh 7.3% 0 7.3% !important;
    width: 100%;
  }
  .set-new-password-main .hero .butterflies-signature {
    align-self: center;
  }
  .set-new-password-main .hero .butterflies-signature .orange-b {
    width: 5.154rem;
    height: auto;
  }
  .set-new-password-main .hero .butterflies-signature .blue-b {
    width: 1.923rem;
    height: auto;
  }
  .set-new-password-main .hero .middle {
    width: 100% !important;
  }
  .set-new-password-main .hero .middle h1 {
    font-size: 1.923rem;
  }
}
.error-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.error-main .hero {
  color: #18072F;
  padding-top: 7.5em;
  width: 74%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.error-main .hero .middle {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  align-self: center;
}
.error-main .hero .middle h1 {
  color: #E8996B;
  font-size: 4.063rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-align: center;
}
.error-main .hero .middle p {
  font-size: 1.25rem;
  text-align: center;
  margin: 1.875rem 0;
  max-width: 28.438rem;
}
.error-main .hero .middle .dark-btn {
  max-width: 21.563rem;
  margin-top: 0.8rem;
}
.error-main .hero .butterflies {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.188rem;
}
.error-main .hero .butterflies .big-b {
  width: 8.313rem;
  height: auto;
}
.error-main .hero .butterflies .small-b {
  width: 4.125rem;
  height: auto;
}
.error-main .hero .butterflies.top {
  align-items: flex-end;
}
.error-main .hero .butterflies.bottom {
  align-self: flex-end;
}
.error-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
  margin-top: 7.5rem;
}

@media only screen and (max-width: 1020px) {
  .error-main .hero {
    padding: 15vh 0 !important;
  }
  .error-main .hero .middle h1 {
    font-size: 3.462rem !important;
  }
  .error-main .hero .middle p {
    font-size: 1.231rem;
    text-align: center;
    margin: 2.308rem 0 2rem 0;
  }
  .error-main .hero .butterflies-signature {
    align-self: center;
    margin-bottom: 2.308rem;
  }
  .error-main .hero .butterflies-signature .orange-b {
    width: 5.154rem;
    height: auto;
  }
  .error-main .hero .butterflies-signature .blue-b {
    width: 1.923rem;
    height: auto;
  }
}
.deploy-main .link {
  font-family: "Satoshi", sans-serif !important;
  font-size: 1.2rem;
}

.success-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.success-main .hero {
  margin: 20vh 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  width: 85.4%;
  position: relative;
  min-height: 58vh;
}
.success-main .hero .left-b {
  width: 8.5%;
  height: auto;
  align-self: flex-end;
}
.success-main .hero .right-b {
  width: 10.3%;
  height: auto;
}
.success-main .hero .middle {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 3.5rem;
  color: #18072F;
  width: 66%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1.5rem;
}
.success-main .hero .middle h1 {
  font-size: 3.125rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-align: center;
  text-transform: uppercase;
}
.success-main .hero .middle p {
  font-size: 1.563rem;
  text-align: center;
  max-width: 37.875rem;
  text-align: center;
}
.success-main .hero .middle p .bold {
  font-weight: 500 !important;
}
.success-main .hero .middle .main-btn {
  max-width: 17.188rem;
  margin-top: 1rem;
}
.success-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
}

@media only screen and (max-width: 1020px) {
  .success-main .hero {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
    padding: 18vh 0 25vh 0;
    margin: 0;
    height: auto;
  }
  .success-main .hero .butterflies-signature {
    align-self: center;
  }
  .success-main .hero .butterflies-signature .orange-b {
    width: 5.154rem;
    height: auto;
  }
  .success-main .hero .butterflies-signature .blue-b {
    width: 1.923rem;
    height: auto;
  }
  .success-main .hero .left-b, .success-main .hero .right-b {
    display: none;
  }
  .success-main .hero .middle {
    position: static;
    transform: translateX(0);
    width: 100%;
  }
  .success-main .hero .middle h1 {
    text-transform: none;
    font-size: 1.923rem;
    width: 100%;
  }
  .success-main .hero .middle p {
    font-size: 1.231rem;
  }
  .success-main .hero .middle .main-btn {
    height: 3.154rem;
    font-size: 1.154rem;
    width: 100%;
    max-width: 100%;
    font-family: "Satoshi", sans-serif !important;
    text-transform: uppercase;
  }
}
.account-introduction-popup {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 1000;
  height: 100dvh;
  background-color: rgba(24, 7, 47, 0.5);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.account-introduction-popup .content {
  background-color: white;
  max-width: 43.5rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  width: 100%;
  padding: 3.25rem;
  color: rgb(24, 7, 47);
}
.account-introduction-popup .content h2 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-align: center;
}
.account-introduction-popup .content h5 {
  font-size: 1.25rem;
  margin-top: 0.313rem;
  margin-bottom: 1.875rem;
  font-weight: 400;
}
.account-introduction-popup .content p {
  font-size: 1.25rem;
}
.account-introduction-popup .content p .bold {
  font-weight: 500 !important;
}
.account-introduction-popup .content p .underline {
  font-weight: 500;
  text-decoration: underline;
}
.account-introduction-popup .content .link {
  background-color: rgba(0, 0, 0, 0);
  color: #F09662;
  border: 0;
  outline: 0;
  align-self: flex-start;
  cursor: pointer;
  font-family: "Satoshi", sans-serif;
  font-size: 1.25rem;
  margin-top: 1rem;
}
.account-introduction-popup .content .link:hover {
  text-decoration: underline;
  opacity: 1;
}
.account-introduction-popup .content .btn {
  margin-top: 1.875rem;
  width: 100%;
  height: 3.125rem;
  border: 2px dashed rgb(240, 150, 98); /* Adjust color as needed */
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  font-size: 1.125rem;
  font-weight: 500;
}
.account-introduction-popup.birthday h2 {
  margin-top: 1.563rem;
  margin-bottom: 2.1875rem;
  text-align: center;
  max-width: 23.125rem;
}
.account-introduction-popup.birthday .subp {
  margin-top: 2.1875rem;
  font-size: 1rem;
  color: #18072F;
}
.account-introduction-popup.birthday .subp .bold {
  font-weight: 500;
}
.account-introduction-popup.birthday .subp .orange {
  color: #F09662;
}
.account-introduction-popup.birthday .decline-btn {
  border: 1px solid #18072F;
  color: #18072F;
  background-color: rgba(0, 0, 0, 0);
  margin-top: 0.9375rem;
}
.account-introduction-popup.birthday .decline-btn:hover {
  background-color: #18072F;
  color: white;
}
.account-introduction-popup.birthday .text-input {
  margin: 2.9rem 0 2.375rem 0;
}
.account-introduction-popup.birthday .dark-btn {
  text-transform: none;
}
.account-introduction-popup.birthday .check-wrap {
  align-items: flex-start;
}
.account-introduction-popup.birthday .check-wrap p {
  font-size: 0.8125rem;
  font-weight: 500;
}
.account-introduction-popup.birthday .check-wrap p a {
  color: #F09662;
  text-decoration: underline;
}
.account-introduction-popup .check-wrap {
  width: 100%;
}
.account-introduction-popup .check-wrap.border-blue {
  border-bottom: 1px solid #18072F;
  margin-bottom: 2.688rem;
}
.account-introduction-popup .check-wrap.border-light {
  padding-bottom: 0.9rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
  margin-bottom: 2.4rem;
}
.account-introduction-popup .check-wrap a {
  color: #F09662;
  text-decoration: underline;
}
.account-introduction-popup .check-wrap.wrap2 {
  margin-top: 2.25rem;
}
.account-introduction-popup .check-wrap.wrap3 {
  margin-top: 2rem;
  margin-bottom: 2.5rem;
}
.account-introduction-popup .check-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
}
.account-introduction-popup .check-wrap span {
  font-size: 1.125rem;
  font-weight: 500;
}
.account-introduction-popup .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.account-introduction-popup .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.account-introduction-popup .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.account-introduction-popup .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.account-introduction-popup .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.account-introduction-popup .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.account-introduction-popup .check-wrap label input:checked + span svg {
  opacity: 1;
}
.account-introduction-popup .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}

.account-main {
  margin-top: 15vh;
  padding: 0 0 18vh 7.3%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  position: relative;
}
.account-main.height {
  min-height: 93.75rem;
}
.account-main .left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.account-main .left .inner {
  min-width: 16.375rem;
}
.account-main .left .inner h1 {
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  font-size: 2.5rem;
  margin-bottom: 2.25rem;
}
.account-main .left .inner .section {
  padding: 1.75rem 0;
  border-top: 1px solid rgba(240, 150, 98, 0.5);
  width: 100%;
}
.account-main .left .inner .section h6 {
  font-size: 1.125rem;
  color: rgba(24, 7, 47, 0.5);
  font-weight: 500;
  margin-bottom: 1rem;
}
.account-main .left .inner .section .arrow-link {
  text-decoration: none;
  width: fit-content;
}
.account-main .left .inner .section .arrow-link.active, .account-main .left .inner .section .arrow-link:hover {
  text-decoration: underline;
}
.account-main .left .inner .section .arrow-link.logout {
  position: relative;
}
.account-main .left .inner .section .arrow-link.logout .open {
  position: absolute;
  right: 0;
  opacity: 0;
}
.account-main .left .inner .section .arrow-link.logout:hover .closed {
  opacity: 0;
}
.account-main .left .inner .section .arrow-link.logout:hover .open {
  opacity: 1;
}
.account-main .left .inner .section .arrow-link.logout:hover svg {
  transform: translateX(0) !important;
}
.account-main .switch {
  display: none !important;
}
.account-main .right-section {
  position: absolute;
  opacity: 0;
  transform: scale(0);
  transition: ease-out 0.3s;
}
.account-main .right-section .dark-btn {
  z-index: 5 !important;
}
.account-main .right-section .heading {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-bottom: 2.25rem;
  border-bottom: rgba(240, 150, 98, 0.5) 1px solid;
  margin-bottom: 2.25rem;
  width: 100%;
}
.account-main .right-section .heading h2 {
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  font-size: 2.5rem;
}
.account-main .right-section .heading h6 {
  font-size: 1.125rem;
  color: rgb(24, 7, 47);
  font-weight: 500;
}
.account-main .right-section .heading h6 span {
  font-weight: 300;
}
.account-main .right-section.active {
  transition: 0 !important;
  opacity: 1;
  transform: scale(1);
}
.account-main .right-section.orders {
  left: 30%;
  width: 100%;
  max-width: 62.25rem;
  height: 20vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.account-main .right-section.orders .no-order-h {
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  font-size: 2.188rem;
  text-align: center;
  width: 100%;
  padding: 4rem 0;
}
.account-main .right-section.orders .orders-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.563rem;
  min-height: 26.563rem;
}
.account-main .right-section.orders .orders-wrap .order {
  width: 100%;
  min-height: 3.125rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  color: rgb(24, 7, 47);
  position: relative;
}
.account-main .right-section.orders .orders-wrap .order .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.1rem;
}
.account-main .right-section.orders .orders-wrap .order .column h5 {
  font-size: 1.125rem;
  font-weight: 500;
}
.account-main .right-section.orders .orders-wrap .order .column h6 {
  color: rgba(24, 7, 47, 0.75);
  font-size: 1rem;
  font-weight: 500;
}
.account-main .right-section.orders .orders-wrap .order .column h6 span {
  font-weight: 400;
}
.account-main .right-section.orders .orders-wrap .order span {
  font-size: 1rem;
  font-weight: 500;
}
.account-main .right-section.orders .orders-wrap .order span.left-span {
  margin-left: 7.1%;
}
.account-main .right-section.orders .orders-wrap .order span span {
  font-weight: 400;
}
.account-main .right-section.orders .orders-wrap .order span.right-span {
  position: absolute;
  right: 24%;
}
.account-main .right-section.orders .orders-wrap .order .dark-btn {
  position: absolute;
  right: 0;
  max-width: 16.76%;
  justify-self: flex-end;
}
.account-main .right-section.orders .orders-wrap svg {
  margin-right: 3%;
}
.account-main .right-section.orders .pages {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.5rem;
  margin-top: 2.25rem;
  align-self: center;
}
.account-main .right-section.orders .pages .page-btn {
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  outline: none;
  color: rgba(24, 7, 47, 0.5);
  transition: ease-out 0.2s;
  font-size: 1.25em;
  font-weight: 500;
}
.account-main .right-section.orders .pages .page-btn.active {
  color: rgb(24, 7, 47);
}
.account-main .right-section.orders .pages .page-btn:hover, .account-main .right-section.orders .pages .page-btn.active {
  text-decoration: underline;
}
.account-main .right-section.membership {
  left: 30%;
  width: 100%;
  max-width: 62.25rem;
}
.account-main .right-section.membership .card {
  margin-top: 2.25rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.account-main .right-section.membership .card img {
  width: 50%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 506/321;
}
.account-main .right-section.membership .card .right {
  width: 46%;
}
.account-main .right-section.membership .card .right h4 {
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  font-size: 2.188rem;
}
.account-main .right-section.membership .card .right p {
  margin: 1.563rem 0 3.125rem 0;
  font-size: 1.125rem;
  color: #18072F;
}
.account-main .right-section.membership .card .right .methods {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.563rem;
  margin-top: 1.563rem;
}
.account-main .right-section.account-detail.active {
  position: relative !important;
}
.account-main .right-section.account-detail {
  left: 10%;
  width: 100%;
  max-width: 62.25rem;
  height: auto;
}
.account-main .right-section.account-detail .details-form .inputs-heading {
  margin-bottom: 2.313rem !important;
  width: 100%;
}
.account-main .right-section.account-detail .details-form {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.account-main .right-section.account-detail .password-form {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.account-main .right-section.account-detail .heading.security {
  margin-top: 2.25rem;
}
.account-main .right-section.account-detail .dark-btn {
  max-width: 12.938rem;
}
.account-main .right-section.account-detail .check-wrap {
  width: 100%;
  padding-bottom: 1.313rem;
}
.account-main .right-section.account-detail .check-wrap.border-blue {
  border-bottom: 1px solid #18072F;
  margin-bottom: 2.688rem;
}
.account-main .right-section.account-detail .check-wrap.border-light {
  padding-bottom: 0.9rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
}
.account-main .right-section.account-detail .check-wrap a {
  color: #F09662;
  text-decoration: underline;
}
.account-main .right-section.account-detail .check-wrap.wrap2 {
  margin-top: 2.25rem;
}
.account-main .right-section.account-detail .check-wrap.wrap3 {
  margin-top: 2rem;
  margin-bottom: 2.5rem;
}
.account-main .right-section.account-detail .check-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
}
.account-main .right-section.account-detail .check-wrap span {
  font-size: 1.125rem;
  font-weight: 500;
}
.account-main .right-section.account-detail .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.account-main .right-section.account-detail .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.account-main .right-section.account-detail .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.account-main .right-section.account-detail .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.account-main .right-section.account-detail .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.account-main .right-section.account-detail .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.account-main .right-section.account-detail .check-wrap label input:checked + span svg {
  opacity: 1;
}
.account-main .right-section.account-detail .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}

.order-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  padding: 11.875rem 0;
}
.order-main .order {
  width: 90%;
  max-width: 62.25rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  color: rgb(24, 7, 47);
}
.order-main .order .heading {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-bottom: 2.313rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.5);
}
.order-main .order .heading h1 {
  font-size: 2.188rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.order-main .order .heading h1 span {
  font-size: 2.188rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.order-main .order .heading span {
  font-size: 1.125rem;
  font-weight: 500;
}
.order-main .order .heading span span {
  font-weight: 400;
}
.order-main .order .info {
  padding: 2rem 0;
  width: 100%;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2rem;
}
.order-main .order .info .row {
  width: 100%;
  font-size: 1.125rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  row-gap: 1rem;
}
.order-main .order .info .row h6 {
  font-weight: 400;
  font-size: 1.125rem;
  text-wrap: nowrap;
}
.order-main .order .info .row .value {
  font-weight: 500;
  text-align: right;
  align-self: flex-end;
  margin-left: auto;
}
.order-main .order .total-price {
  padding: 2rem 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
  border-bottom: rgba(240, 150, 98, 0.5) 1px solid;
}
.order-main .order .total-price .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.625rem;
}
.order-main .order .total-price .column h6 {
  font-weight: 500;
  font-size: 1.125rem;
}
.order-main .order .total-price .column span {
  font-size: 1rem;
  font-weight: 400;
}
.order-main .order .total-price .value {
  font-weight: 500;
  font-size: 1.125rem;
}
.order-main .order .order-status {
  padding: 2rem 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
  border-bottom: rgba(240, 150, 98, 0.5) 1px solid;
}
.order-main .order .order-status h6 {
  font-weight: 500;
  font-size: 1.25rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.625rem;
}
.order-main .order .order-status .value {
  font-weight: 500;
  font-size: 1.125rem;
}
.order-main .order .order-footer {
  padding-top: 2rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
}
.order-main .order .order-footer .support {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.938rem;
}
.order-main .order .order-footer .support .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.625rem;
}
.order-main .order .order-footer .support .column span {
  font-size: 1.125rem;
}
.order-main .order .order-footer .support .column .links {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.938rem;
}
.order-main .order .order-footer .support .column .links a {
  font-size: 1rem;
  font-weight: 500;
  text-decoration: underline;
  color: rgb(24, 7, 47);
}
.order-main .order .order-footer .dark-btn {
  max-width: 13rem;
}
.order-main .order .products {
  padding: 2.938rem 0;
  border-bottom: 1px solid rgba(240, 150, 98, 0.5);
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.563rem;
}
.order-main .order .products .product {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  height: 8rem;
  color: rgb(24, 7, 47) !important;
  position: relative;
}
.order-main .order .products .product .column {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.order-main .order .products .product .column h5 {
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  font-size: 1.563rem;
}
.order-main .order .products .product .column .category {
  font-size: 1.125rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.688rem;
}
.order-main .order .products .product .column .category .vl {
  height: 1.188rem;
  width: 1px;
  background-color: rgb(240, 150, 98);
}
.order-main .order .products .product .column .total {
  font-size: 1.125rem;
  font-weight: 500;
}
.order-main .order .products .product .column .total span {
  font-weight: 400 !important;
}
.order-main .order .products .product .price {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 1.25rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.order-main .order .products .product .img-wrap {
  background-color: rgb(250, 250, 251);
  margin-right: 2.313rem;
  height: 100%;
  aspect-ratio: 1/1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.order-main .order .products .product .img-wrap img {
  aspect-ratio: 1/1;
  width: 100%;
  mix-blend-mode: multiply;
  object-position: center;
  object-fit: cover;
}

@media only screen and (max-width: 1020px) {
  .account-footer {
    margin-bottom: 7rem;
  }
  .account-introduction-popup .dark-btn {
    text-transform: uppercase !important;
  }
  .account-introduction-popup.birthday .present {
    width: 2.769rem;
    height: 3.231rem;
  }
  .account-introduction-popup.birthday h2 {
    margin-top: 1.154rem;
    font-size: 2.462rem !important;
    margin-bottom: 2rem;
  }
  .account-introduction-popup.birthday .check-wrap p {
    font-weight: 400;
  }
  .account-introduction-popup.birthday .subp {
    font-size: 1rem;
    margin-top: 2rem !important;
  }
  .account-introduction-popup.birthday .content {
    padding-bottom: 2.692rem !important;
  }
  .order-main {
    padding: 4.615rem 7.3%;
  }
  .order-main .order {
    width: 100%;
  }
  .order-main .order .info {
    padding: 1.769rem 0 !important;
  }
  .order-main .order .total-price {
    padding: 1.769rem 0 !important;
  }
  .order-main .heading {
    padding-bottom: 1.769rem !important;
  }
  .order-main .heading h1 {
    font-size: 1.692rem !important;
  }
  .order-main .heading h2 {
    color: #18072F;
    font-size: 1.154rem;
    font-weight: 500;
  }
  .order-main .heading span {
    font-size: 1rem !important;
  }
  .order-main .order-footer {
    flex-direction: column !important;
  }
  .order-main .order-footer .support {
    padding-bottom: 1.769rem;
    margin-bottom: 1.769rem;
    border-bottom: 1px solid rgba(240, 150, 98, 0.5);
  }
  .order-main .order-footer .support .column {
    gap: 0.385rem !important;
  }
  .order-main .order-footer span {
    font-size: 1rem !important;
  }
  .order-main .order-footer svg {
    width: 0.462rem !important;
    height: auto !important;
  }
  .order-main .order-footer .dark-btn {
    width: 100%;
    max-width: 100% !important;
  }
  .order-main .products {
    padding: 1.769rem 0 !important;
    gap: 1.154rem;
  }
  .order-main .products .product {
    gap: 6% !important;
  }
  .order-main .products .product .img-wrap {
    margin: 0 !important;
  }
  .order-main .products .product .category {
    font-size: 1rem !important;
  }
  .order-main .products .product h5 {
    font-size: 1.385rem !important;
  }
  .order-main .products .product .total {
    font-size: 1rem !important;
  }
  .order-main .products .product .price {
    bottom: 0;
    font-size: 1.154rem !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 0;
  }
  .account-introduction-popup {
    align-items: flex-end;
  }
  .account-introduction-popup .content {
    width: 100%;
    max-width: 100%;
    border-radius: 10px 10px 0px 0px;
    padding: 4rem 8.3%;
  }
  .account-introduction-popup .content h2 {
    font-size: 2.692rem;
  }
  .account-main {
    padding: 0;
    width: 100%;
    margin-top: 4.615rem;
    flex-direction: column;
    padding-bottom: 2rem;
  }
  .account-main .account-detail.active + .switch {
    display: flex !important; /* Show switch when .account-detail is active */
  }
  .account-main .right-section {
    position: static !important;
    width: 100%;
    max-width: 100% !important;
    height: auto !important;
    overflow: visible;
  }
  .account-main .right-section .heading {
    padding-bottom: 1.769rem;
    margin-bottom: 1.769rem;
  }
  .account-main .right-section .heading h2 {
    font-size: 1.692rem !important;
  }
  .account-main .right-section .heading h6 {
    font-size: 1rem;
  }
  .account-main .right-section {
    max-height: 0;
  }
  .account-main .right-section.account-detail {
    position: static !important;
  }
  .account-main .right-section.account-detail.active {
    position: static !important;
  }
  .account-main .right-section.account-detail .dark-btn {
    width: 100%;
    max-width: 100%;
  }
  .account-main .right-section.account-detail {
    min-height: 0;
  }
  .account-main .right-section.account-detail form {
    pointer-events: none;
    max-height: 0;
    opacity: 0;
    padding-inline: 7.3%;
  }
  .account-main .right-section.account-detail form .heading {
    display: none;
  }
  .account-main .right-section.account-detail form .inputs-heading h6 {
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    width: 100%;
  }
  .account-main .right-section.account-detail form .inputs-heading .row h6 {
    border-bottom: 0;
    width: fit-content;
    padding-bottom: 0;
  }
  .account-main .right-section.account-detail form .inputs-heading .row {
    width: 100%;
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    justify-content: flex-start;
    display: flex;
    flex-direction: row;
  }
  .account-main .right-section.account-detail form .two-inputs {
    flex-direction: column;
    gap: 2.408rem;
  }
  .account-main .right-section.account-detail form .two-inputs.country {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6%;
    row-gap: 2.408rem !important;
  }
  .account-main .right-section.account-detail form .two-inputs.country .select-input {
    min-width: 14.615rem;
    width: 47%;
    flex: 1;
  }
  .account-main .right-section.account-detail form .two-inputs.country .text-input {
    width: 47%;
    min-width: 7.615rem;
    flex: 1;
  }
  .account-main .right-section.account-detail form.details-form {
    margin-top: 5rem;
  }
  .account-main .right-section.account-detail form.active {
    opacity: 1;
    max-height: fit-content;
    transition: ease-out 0.3s;
    pointer-events: all;
  }
  .account-main .right-section.membership {
    padding-inline: 7.3%;
  }
  .account-main .right-section.membership .heading h2 {
    font-size: 1.923rem !important;
    width: 100% !important;
    text-align: center;
  }
  .account-main .right-section.membership .card {
    gap: 1.846rem !important;
    flex-direction: column !important;
  }
  .account-main .right-section.membership .card img {
    width: 100% !important;
  }
  .account-main .right-section.membership .card .right h4 {
    font-size: 1.692rem;
  }
  .account-main .right-section.membership .card .right p {
    font-size: 1.231rem;
    margin: 1.154rem 0 1.846rem 0;
  }
  .account-main .right-section.membership .card .right {
    width: 100%;
  }
  .account-main .right-section.membership .card .methods {
    margin-top: 5.154rem !important;
    justify-content: center !important;
    margin-bottom: 2.769rem;
  }
  .account-main .right-section.orders {
    min-height: 0 !important;
    padding-inline: 7.3%;
  }
  .account-main .right-section.orders .orders-wrap {
    gap: 1.154rem;
    min-height: 0 !important;
  }
  .account-main .right-section.orders .orders-wrap .arrow {
    position: absolute;
    right: 0;
    margin: 0;
  }
  .account-main .right-section.orders .orders-wrap .box {
    height: 1.231rem;
    width: 1.077rem;
    align-self: flex-start;
  }
  .account-main .right-section.orders .orders-wrap .column h5 {
    font-size: 1.154rem !important;
  }
  .account-main .right-section.orders .orders-wrap .column h6 {
    font-size: 1rem !important;
  }
  .account-main .right-section.orders .orders-wrap a {
    position: absolute;
    opacity: 0;
    z-index: 5 !important;
    height: 100%;
    width: 100% !important;
    max-width: 100% !important;
  }
  .account-main .right-section.active {
    max-height: fit-content;
  }
  .account-main .left {
    height: 7rem;
    flex-direction: row;
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 10;
    background-color: #FFFFFF;
    box-shadow: 0px 0px 10px rgba(24, 7, 47, 0.1019607843);
    border-top: 1px solid #FFD7BC;
    left: 0;
  }
  .account-main .left .inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
  .account-main .left .inner .section {
    border: 0;
    width: 33.3333333333%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
    padding: 0;
    height: 100%;
  }
  .account-main .left .inner .section .arrow-link {
    flex-direction: column;
    align-items: center;
    gap: 0.385rem;
    height: 100%;
    justify-content: center;
    border-top: 3px solid rgba(0, 0, 0, 0);
  }
  .account-main .left .inner .section .arrow-link svg {
    transform: translateX(0) !important;
  }
  .account-main .left .inner .section .arrow-link .first-icon {
    width: 1.308rem !important;
    height: 1.538rem !important;
  }
  .account-main .left .inner .section .arrow-link .second-icon {
    width: 1.615rem !important;
    height: 1.615rem !important;
  }
  .account-main .left .inner .section .arrow-link .third-icon {
    width: 0.769rem !important;
    height: 1.692rem !important;
  }
  .account-main .left .inner .section .arrow-link:hover {
    text-decoration: none !important;
  }
  .account-main .left .inner .section .arrow-link.active {
    text-decoration: none !important;
    border-top: 3px solid #F09662;
  }
  @media not all and (min-resolution: 0.001dpcm) {
    @supports (-webkit-touch-callout: none) {
      .account-introduction-popup {
        padding-bottom: 4rem !important;
      }
    }
  }
}
@media only screen and (max-width: 410px) {
  .order-main {
    padding-inline: 6% !important;
  }
  .order-main .products .product .img-wrap {
    width: 6rem;
    height: 6rem;
  }
}
.register-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  padding: 4.25rem 0 0 0;
}
.register-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
}
.register-main .register-form {
  max-width: 62.75rem;
  width: 90%;
  margin-bottom: 12.25rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.register-main .register-form h1 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  margin-bottom: 5.125rem;
}
.register-main .register-form .dark-btn {
  align-self: flex-end;
  width: 48%;
}
.register-main .register-form .inputs-heading {
  margin-bottom: 2.313rem;
}
.register-main .register-form .check-wrap {
  width: 100%;
  padding-bottom: 1.313rem;
}
.register-main .register-form .check-wrap.border-blue {
  border-bottom: 1px solid #18072F;
  margin-bottom: 2.688rem;
}
.register-main .register-form .check-wrap.border-light {
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
}
.register-main .register-form .check-wrap a {
  color: #F09662;
  text-decoration: underline;
}
.register-main .register-form .check-wrap.wrap1 {
  padding: 0;
}
.register-main .register-form .check-wrap.wrap2 {
  margin-top: 2.25rem;
}
.register-main .register-form .check-wrap.wrap3 {
  margin-top: 2rem;
  margin-bottom: 2.5rem;
}
.register-main .register-form .check-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
}
.register-main .register-form .check-wrap span {
  font-size: 1.125rem;
  font-weight: 500;
}
.register-main .register-form .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.register-main .register-form .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.register-main .register-form .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.register-main .register-form .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.register-main .register-form .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.register-main .register-form .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.register-main .register-form .check-wrap label input:checked + span svg {
  opacity: 1;
}
.register-main .register-form .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}

@media only screen and (max-width: 1020px) {
  .register-main {
    padding-top: 4.615rem;
  }
  .register-main .register-form {
    width: 100%;
    padding-inline: 7.3%;
  }
  .register-main .register-form .dark-btn {
    width: 100%;
    max-width: 100%;
  }
  .register-main .register-form h1 {
    font-size: 1.923rem;
    width: 100%;
    text-align: center;
  }
  .register-main .register-form .inputs-heading h6 {
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    width: 100%;
  }
  .register-main .register-form .inputs-heading .row h6 {
    border-bottom: 0;
    width: fit-content;
    padding-bottom: 0;
  }
  .register-main .register-form .inputs-heading .row {
    width: 100%;
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    justify-content: flex-start;
  }
  .register-main .register-form .check-wrap {
    border: 0;
    padding: 0;
  }
  .register-main .register-form .check-wrap.border-blue {
    border: 0;
  }
  .register-main .register-form .two-inputs {
    flex-direction: column;
    gap: 2.408rem;
  }
  .register-main .register-form .two-inputs.country {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6%;
    row-gap: 2.408rem !important;
  }
  .register-main .register-form .two-inputs.country .select-input {
    min-width: 14.615rem;
    width: 47%;
    flex: 1;
  }
  .register-main .register-form .two-inputs.country .text-input {
    width: 47%;
    min-width: 7.615rem;
    flex: 1;
  }
}
.checkout-dashboard-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.checkout-dashboard-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
}
.checkout-dashboard-main .hero {
  padding-top: 6.875rem;
  margin-bottom: 21.688rem;
}
.checkout-dashboard-main .hero h1 {
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  font-size: 3.125rem;
  text-transform: uppercase;
  margin-bottom: 10rem;
}
.checkout-dashboard-main .hero {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.checkout-dashboard-main .hero .b {
  position: absolute;
}
.checkout-dashboard-main .hero .left-b {
  left: 7.8%;
  width: 7.13%;
  height: auto;
  bottom: 1.5%;
}
.checkout-dashboard-main .hero .right-b {
  right: 5.5%;
  width: 8.75%;
  height: auto;
  top: -23%;
}
.checkout-dashboard-main .hero .center {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 2.3%;
  width: 100%;
}
.checkout-dashboard-main .hero .center .orange-option, .checkout-dashboard-main .hero .center .blue-option {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  width: 30%;
  max-width: 33.688rem;
}
.checkout-dashboard-main .hero .center .orange-option .icon-wrap, .checkout-dashboard-main .hero .center .blue-option .icon-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  aspect-ratio: 539/339;
  transition: ease-out 0.3s;
}
.checkout-dashboard-main .hero .center .orange-option .icon-wrap svg, .checkout-dashboard-main .hero .center .blue-option .icon-wrap svg {
  width: 31%;
  height: auto;
}
.checkout-dashboard-main .hero .center .orange-option .bottom, .checkout-dashboard-main .hero .center .blue-option .bottom {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  margin-top: 1.563rem;
}
.checkout-dashboard-main .hero .center .orange-option .bottom h2, .checkout-dashboard-main .hero .center .blue-option .bottom h2 {
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  font-size: 2.188rem;
  color: #18072F;
}
.checkout-dashboard-main .hero .center .orange-option .icon-wrap {
  border: 2px solid #F09662;
}
.checkout-dashboard-main .hero .center .blue-option .icon-wrap {
  border: 2px solid #18072F;
}

.checkout-main .complete-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.313rem;
}
.checkout-main .id-holder {
  height: 0;
  overflow: hidden;
  visibility: hidden;
  position: relative;
  bottom: 10rem;
}
.checkout-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
  margin-top: 16.875rem;
  position: relative;
  z-index: 3;
}
.checkout-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.checkout-main .left .continue-btn-wrap {
  width: 100%;
}
.checkout-main .left {
  padding-left: 7.1%;
  color: #18072F;
  width: 56.888%;
  padding-top: 10vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.313rem;
}
.checkout-main .left .check-open.active.no-margin {
  margin: 0 !important;
}
.checkout-main .left .check-open.active.margin-top {
  margin-top: 2.75rem;
}
.checkout-main .left .inputs-heading {
  margin-bottom: 2.625rem;
}
.checkout-main .left .inputs-heading.no-margin {
  margin: 0 !important;
}
.checkout-main .left .inputs-heading.margin-top {
  margin-top: 2.625rem !important;
}
.checkout-main .left .checkout-section .checks {
  width: 100%;
  border-top: 1px solid rgba(240, 150, 98, 0.25);
  padding-top: 1.938rem;
}
.checkout-main .left .checkout-section .checks .wrap3 {
  margin-bottom: 0 !important;
}
.checkout-main .left .checkout-section.complete {
  position: relative;
  z-index: 3;
  gap: 1.563rem !important;
}
.checkout-main .left .checkout-section.complete .main-btn {
  width: 100%;
  outline: 0;
  border: 0;
}
.checkout-main .left .checkout-section .check-wrap.no-margin {
  margin: 0 !important;
}
.checkout-main .left .checkout-section .check-wrap {
  width: 100%;
  padding-bottom: 1.313rem;
}
.checkout-main .left .checkout-section .check-wrap.border-blue {
  border-bottom: 1px solid #18072F;
  margin-bottom: 2.688rem;
}
.checkout-main .left .checkout-section .check-wrap.border-light {
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
}
.checkout-main .left .checkout-section .check-wrap a {
  color: #F09662;
  text-decoration: underline;
}
.checkout-main .left .checkout-section .check-wrap.wrap1 {
  padding: 0;
}
.checkout-main .left .checkout-section .check-wrap.wrap2 {
  margin-top: 2.25rem;
}
.checkout-main .left .checkout-section .check-wrap.wrap3 {
  margin-top: 2rem;
  margin-bottom: 2.5rem;
}
.checkout-main .left .checkout-section .check-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
}
.checkout-main .left .checkout-section .check-wrap span {
  font-size: 1.125rem;
  font-weight: 500;
}
.checkout-main .left .checkout-section .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.checkout-main .left .checkout-section .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.checkout-main .left .checkout-section .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.checkout-main .left .checkout-section .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.checkout-main .left .checkout-section .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.checkout-main .left .checkout-section .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.checkout-main .left .checkout-section .check-wrap label input:checked + span svg {
  opacity: 1;
}
.checkout-main .left .checkout-section .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}
.checkout-main .left .checkout-section {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.313rem;
}
.checkout-main .left .checkout-section h2 {
  font-size: 2.5rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
}
.checkout-main .left .checkout-section .box.date-time {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  gap: 2.375rem;
}
.checkout-main .left .checkout-section .box.date-time .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2.7%;
}
.checkout-main .left .checkout-section .box.date-time .options {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.checkout-main .left .checkout-section .box.date-time .options .column {
  height: 100%;
}
.checkout-main .left .checkout-section .box.date-time .options .column.time {
  margin-left: 2.7%;
}
.checkout-main .left .checkout-section .box.date-time .date-wrap {
  position: relative;
  width: 100%;
  width: 296px;
  align-self: flex-start;
  left: 0;
  flex: 1;
  text-align: left;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.checkout-main .left .checkout-section .box.date-time .date-wrap .flatpickr-calendar {
  border: 0 !important; /* Orange border */
  box-shadow: none !important; /* Soft shadow */
  position: relative !important;
  font-family: "Quiche Sans", sans-serif !important;
}
.checkout-main .left .checkout-section .box.date-time .date-wrap .flatpickr-current-month {
  font-family: "Quiche Sans", sans-serif !important;
}
.checkout-main .left .checkout-section .box.date-time .date-wrap .flatpickr-current-month input.cur-year {
  font-family: "Quiche Sans", sans-serif !important;
}
.checkout-main .left .checkout-section .box.date-time .date-wrap .flatpickr-current-month .cur-month {
  font-family: "Quiche Sans", sans-serif !important;
}
.checkout-main .left .checkout-section .box.date-time .time-wrap {
  height: 100% !important;
  width: 100% !important;
  position: relative;
  padding: 0 !important;
  padding-top: 2.2rem !important;
  min-height: 10.625rem;
  background-color: white !important;
  border: 1.5px solid white !important;
  transition: ease-out 0.1s;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2.375rem;
}
.checkout-main .left .checkout-section .box.date-time .time-wrap .top {
  width: 100%;
}
.checkout-main .left .checkout-section .box.date-time .time-wrap .top h5 {
  font-size: 1.125rem;
  font-weight: 500;
}
.checkout-main .left .checkout-section .box.date-time .time-wrap .top .custom-select {
  margin-top: 2rem;
  width: 100%;
}
.checkout-main .left .checkout-section .box .main-btn {
  width: 100%;
}
.checkout-main .left .checkout-section .box.address {
  gap: 0;
}
.checkout-main .left .checkout-section .box {
  padding: 2.313rem;
  border: 1px solid #F09662;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.375rem;
}
.checkout-main .left .checkout-section .box .options {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.375rem;
  width: 100%;
}
.checkout-main .left .checkout-section .box .options .column {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.checkout-main .left .checkout-section .box .options .column .row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2.7%;
}
.checkout-main .left .checkout-section .box .options .column .row .option {
  position: relative;
  width: 48.65%;
  min-height: 10.625rem;
  background-color: #FEF8F3;
  border: 1.5px solid #FEF8F3;
  transition: ease-out 0.1s;
  padding: 1.75rem 3%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
  cursor: pointer;
}
.checkout-main .left .checkout-section .box .options .column .row .option.wide {
  width: 100%;
}
.checkout-main .left .checkout-section .box .options .column .row .option.change {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  border: 1px solid #F09662;
  background-color: #FEF8F3;
  transition: ease-out 0.3s;
}
.checkout-main .left .checkout-section .box .options .column .row .option.change h5 {
  font-size: 2rem;
  transition: ease-out 0.3s;
  text-align: center;
  font-weight: 400;
  color: #18072F;
  font-family: "Quiche Sans", sans-serif;
}
.checkout-main .left .checkout-section .box .options .column .row .option.change:hover {
  background-color: #F09662;
}
.checkout-main .left .checkout-section .box .options .column .row .option.change:hover h5 {
  color: white;
}
.checkout-main .left .checkout-section .box .options .column .row .option .square {
  transition: ease-out 0.1s;
  position: absolute;
  top: -0.918rem;
  right: -0.9165rem;
  width: 1.813rem;
  height: 1.813rem;
  transform: rotate(45deg);
  opacity: 0;
  background-color: #18072F;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.checkout-main .left .checkout-section .box .options .column .row .option .square .number {
  transform: rotate(-45deg) translateX(-6%);
  color: white;
  font-family: "Quiche Sans", sans-serif;
}
.checkout-main .left .checkout-section .box .options .column .row .option {
  color: #18072F;
}
.checkout-main .left .checkout-section .box .options .column .row .option .gap-top {
  gap: 0.16rem !important;
}
.checkout-main .left .checkout-section .box .options .column .row .option .top {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.313rem;
}
.checkout-main .left .checkout-section .box .options .column .row .option .top h5 {
  font-size: 1.125rem;
  font-weight: 500;
}
.checkout-main .left .checkout-section .box .options .column .row .option .bottom {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 10%;
}
.checkout-main .left .checkout-section .box .options .column .row .option .bottom .price {
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0.938rem;
}
.checkout-main .left .checkout-section .box .options .column .row .option .bottom h6 {
  font-weight: 500;
  font-size: 1rem;
}
.checkout-main .left .checkout-section .box .options .column .row .option .bottom .date-time {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 6%;
  width: 100%;
}
.checkout-main .left .checkout-section .box .options .column .row input[type=radio]:checked + .option {
  cursor: auto;
  border-color: #18072F;
}
.checkout-main .left .checkout-section .box .options .column .row input[type=radio]:checked + .option .square {
  opacity: 1;
}
.checkout-main .left .checkout-section .box .options .column h3 {
  margin-bottom: 1.688rem;
  font-size: 1.563rem;
  font-family: "Quiche Sans", sans-serif;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.25rem;
  font-weight: 400;
}
.checkout-main {
  min-height: 100dvh;
}
.checkout-main .right {
  top: calc(10vh + 6rem);
  right: 4%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  position: fixed;
  background-color: #FEF8F3;
  width: 33%;
  z-index: 1;
  padding: 1.563rem 0;
}
.checkout-main .right .discount-coupon-btn {
  height: 4.063rem;
  width: 100%;
  background-color: rgb(255, 215, 188);
  border: 0;
  margin-top: 1.563rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  padding-inline: 5%;
  cursor: pointer;
}
.checkout-main .right .discount-coupon-btn .left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.625rem;
  font-size: 1.125rem;
  color: #18072F;
  text-align: left;
  text-wrap: nowrap;
}
.checkout-main .right .discount-coupon-btn svg {
  transition: ease-out 0.2s;
  flex-shrink: 0;
}
.checkout-main .right .discount-input-wrap {
  width: 100%;
  padding-inline: 5%;
  background-color: #FFD7BC;
  max-height: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0s ease-out;
}
.checkout-main .right .discount-input-wrap input {
  padding: 0 0 0.625rem 0;
  font-size: 1.25rem;
  font-weight: 400;
  border: 0;
  background-color: rgba(255, 215, 188, 0);
  border-bottom: 1px solid #18072F;
  color: #18072F;
  width: 100%;
  outline: none;
}
.checkout-main .right .discount-input-wrap input::placeholder {
  font-weight: 300;
  color: #18072F;
}
.checkout-main .right.discount-input-active .discount-coupon-btn .arrow {
  transform: scale(-1);
}
.checkout-main .right.discount-input-active .discount-input-wrap {
  pointer-events: all;
  max-height: fit-content;
  opacity: 1;
  transition: opacity 0.4s ease-out;
  padding: 1.563rem 5% 1.625rem 5%;
}
.checkout-main .right .main-btn {
  border: 0;
  width: 90%;
  margin-top: 1.75rem;
  cursor: pointer;
  margin-bottom: 1.938rem;
}
.checkout-main .right h6 {
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  width: 90%;
  text-align: left;
  font-size: 1.875rem;
}
.checkout-main .right .info {
  width: 90%;
  border-bottom: rgba(240, 150, 98, 0.25) 1px solid;
  padding: 1.75rem 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.75rem;
}
.checkout-main .right .info .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  width: 100%;
}
.checkout-main .right .info .name {
  font-size: 1.125rem;
  font-weight: 400;
  color: #18072F;
}
.checkout-main .right .info .value {
  font-size: 1.125rem;
  font-weight: 500;
  color: #18072F;
}
.checkout-main .right .info.total .name {
  font-weight: 500;
}
.checkout-main .right .info.total .subname {
  font-size: 1rem;
  font-weight: 400;
}
.checkout-main .right .info.total {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.checkout-main .right .info.total .column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.625rem;
}
.checkout-main .right .link {
  font-family: "Satoshi", sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: #18072F;
  text-decoration: underline;
}

@media only screen and (max-width: 1300px) {
  .checkout-main .date-time-section {
    gap: 4.462rem;
  }
  .checkout-main .date-time-section .box {
    border: 0 !important;
    padding: 0 !important;
    border: 0;
    flex-direction: column !important;
  }
  .checkout-main .date-time-section .box .row {
    flex-direction: column !important;
    row-gap: 1.385rem !important;
  }
  .checkout-main .date-time-section .box .row .option, .checkout-main .date-time-section .box .row .time-wrap {
    width: 100% !important;
    padding-bottom: 1rem !important;
    padding-inline: 5% !important;
  }
  .checkout-main .date-time-section .box h3 {
    padding-bottom: 1.154rem;
    border-bottom: 1px solid #F09662;
    width: 100%;
    margin-bottom: 2.308rem !important;
  }
  .checkout-main .date-time-section .box.date-time .date-wrap {
    width: 100%;
    justify-content: center !important;
  }
  .checkout-main .date-time-section .box.date-time .column .time-wrap {
    align-items: center;
    padding-top: 0 !important;
  }
  .checkout-main .date-time-section.complete {
    gap: 4.615rem !important;
  }
  .checkout-main .date-time-section.complete h2 {
    margin-top: 0.6rem;
  }
  .checkout-main .date-time-section .options {
    flex-direction: column !important;
    gap: 4.6rem !important;
  }
  .checkout-main .date-time-section .inputs-heading h6 {
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    width: 100%;
  }
  .checkout-main .date-time-section .inputs-heading .row h6 {
    border-bottom: 0;
    width: fit-content;
    padding-bottom: 0;
  }
  .checkout-main .date-time-section .inputs-heading .row {
    width: 100%;
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    justify-content: flex-start;
    flex-direction: row !important;
  }
  .checkout-main .date-time-section .check-wrap {
    border: 0;
    padding: 0;
  }
  .checkout-main .date-time-section .check-wrap.border-blue {
    border: 0;
  }
  .checkout-main .date-time-section .two-inputs {
    flex-direction: column;
    gap: 2.408rem;
  }
  .checkout-main .date-time-section .two-inputs.country {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6%;
    row-gap: 2.408rem !important;
  }
  .checkout-main .date-time-section .two-inputs.country .select-input {
    min-width: 14.615rem;
    width: 47%;
    flex: 1;
  }
  .checkout-main .date-time-section .two-inputs.country .text-input {
    width: 47%;
    min-width: 7.615rem;
    flex: 1;
  }
}
@media only screen and (max-width: 1020px) {
  .checkout-main .complete-form {
    gap: 4.615rem !important;
  }
  .checkout-main .complete-form .main-btn {
    background-color: #F09662 !important;
  }
  .checkout-main {
    padding: 4.615rem 7.3%;
  }
  .checkout-main .right {
    display: none;
  }
  .checkout-main hr {
    width: 100% !important;
  }
  .checkout-main .left .continue-btn-wrap {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1.563rem 8%;
    background-color: white;
    border-top: 1px solid #FFD7BC;
    z-index: 1000;
  }
  .checkout-main .left .continue-btn-wrap .main-btn {
    height: 3.154rem;
    text-transform: uppercase;
    font-family: "Satoshi", sans-serif;
    font-size: 1.154rem;
    background-color: #18072F;
  }
  .checkout-main .left {
    width: 100%;
    padding: 0;
    gap: 4.615rem;
  }
  .checkout-main .left .checkout-section {
    gap: 4.462rem;
  }
  .checkout-main .left .checkout-section .box {
    border: 0;
    padding: 0;
  }
  .checkout-main .left .checkout-section .box .row {
    flex-direction: column !important;
    row-gap: 1.385rem !important;
  }
  .checkout-main .left .checkout-section .box .row .option, .checkout-main .left .checkout-section .box .row .time-wrap {
    width: 100% !important;
    padding-bottom: 1rem !important;
    padding-inline: 5% !important;
  }
  .checkout-main .left .checkout-section .box .row .time-wrap {
    align-items: center;
  }
  .checkout-main .left .checkout-section .box .change h5 {
    font-size: 1.8rem !important;
  }
  .checkout-main .left .checkout-section .box h3 {
    padding-bottom: 1.154rem;
    border-bottom: 1px solid #F09662;
    width: 100%;
    margin-bottom: 2.308rem !important;
  }
  .checkout-main .left .checkout-section .box.date-time .date-wrap {
    width: 100%;
    justify-content: center !important;
  }
  .checkout-main .left .checkout-section.complete {
    gap: 4.615rem !important;
  }
  .checkout-main .left .checkout-section.complete h2 {
    margin-top: 0.6rem;
  }
  .checkout-main .left .checkout-section .inputs-heading h6 {
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    width: 100%;
  }
  .checkout-main .left .checkout-section .inputs-heading .row h6 {
    border-bottom: 0;
    width: fit-content;
    padding-bottom: 0;
  }
  .checkout-main .left .checkout-section .inputs-heading .row {
    width: 100%;
    padding-bottom: 0.385rem;
    border-bottom: 1px solid #F09662;
    justify-content: flex-start;
    flex-direction: row !important;
  }
  .checkout-main .left .checkout-section .check-wrap {
    border: 0;
    padding: 0;
  }
  .checkout-main .left .checkout-section .check-wrap.border-blue {
    border: 0;
  }
  .checkout-main .left .checkout-section .two-inputs {
    flex-direction: column;
    gap: 2.408rem;
  }
  .checkout-main .left .checkout-section .two-inputs.country {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6%;
    row-gap: 2.408rem !important;
  }
  .checkout-main .left .checkout-section .two-inputs.country .select-input {
    min-width: 14.615rem;
    width: 47%;
    flex: 1;
  }
  .checkout-main .left .checkout-section .two-inputs.country .text-input {
    width: 47%;
    min-width: 7.615rem;
    flex: 1;
  }
  .checkout-main .left .checkout-section h2 {
    text-transform: uppercase;
    font-size: 1.923rem;
    text-align: center;
    width: 100%;
  }
  .checkout-dashboard-main .hero {
    padding-top: 4.615rem;
    margin-bottom: 9.231rem;
  }
  .checkout-dashboard-main .hero .b {
    display: none;
  }
  .checkout-dashboard-main .hero {
    padding-inline: 7.3%;
  }
  .checkout-dashboard-main .hero h1 {
    font-size: 1.923rem;
    text-align: center;
    width: 100%;
    margin-bottom: 4.615rem;
  }
  .checkout-dashboard-main .hero .center {
    row-gap: 2.308rem !important;
    flex-direction: column;
  }
  .checkout-dashboard-main .hero .center a {
    width: 100%;
  }
  .checkout-dashboard-main .hero .center .orange-option, .checkout-dashboard-main .hero .center .blue-option {
    width: 100% !important;
  }
  .checkout-dashboard-main .hero .center .orange-option .bottom, .checkout-dashboard-main .hero .center .blue-option .bottom {
    margin-top: 1.231rem;
  }
  .checkout-dashboard-main .hero .center .orange-option h2, .checkout-dashboard-main .hero .center .blue-option h2 {
    font-size: 1.692rem !important;
  }
}
/* Highlighting the valid dates on hover */
/* Highlight today’s date */
.flatpickr-day.today {
  border: 2px solid #FFD7BC !important;
}

.flatpickr-day.enabled:hover {
  background-color: #F09662 !important;
  color: white;
  cursor: pointer;
}

.flatpickr-day.selected {
  background-color: #F09662 !important; /* Barva pro vybrané datum (např. modrá) */
  color: white; /* Barva textu */
  border-color: #F09662 !important;
}

/* Validní dny (načtené z backendu) */
.flatpickr-day {
  background-color: white !important; /* Oranžová barva pro platné dny */
  color: white; /* Barva textu pro platné dny */
  border-radius: 0 !important;
}

/* Hover efekt pro dny */
.flatpickr-day:hover {
  cursor: pointer; /* Ukazatel na kliknutí */
}

.flatpickr-prev-month:hover svg path {
  fill: #F09662 !important;
}
.flatpickr-prev-month:hover {
  cursor: pointer; /* Optional: to indicate the button is clickable */
}

/* Styling for the next month button */
.flatpickr-next-month:hover svg path {
  fill: #F09662 !important;
}
.flatpickr-next-month:hover {
  cursor: pointer; /* Optional: to indicate the button is clickable */
}

.review-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.review-main .hero {
  color: #18072F;
  padding: 10vh 0 10vh 0;
  width: 74%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.review-main .hero .middle {
  position: relative;
  width: 90%;
  max-width: 37.688rem;
}
.review-main .hero .middle .hr-review {
  width: 100%;
  border: 0;
  height: 1px;
  background-color: #FFD7BC;
  margin: 0.938rem 0 2.2rem 0;
}
.review-main .hero .middle .inputs-heading {
  margin: 3.9rem 0 2.2rem 0;
}
.review-main .hero .middle .dark-btn {
  text-transform: none !important;
  min-width: 15.875rem;
}
.review-main .hero .middle .dark-btn.review {
  width: 100%;
  max-width: 100%;
}
.review-main .hero .middle {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  align-self: center;
}
.review-main .hero .middle h1 {
  color: #E8996B;
  font-size: 2.813rem;
  font-family: "Quiche Sans", sans-serif;
  font-weight: 400;
  text-align: center;
  max-width: 37.688rem;
}
.review-main .hero .middle p {
  font-size: 1.125rem;
  text-align: center;
  margin: 1.875rem 0;
  width: 90%;
  max-width: 30rem;
  margin-bottom: 0;
}
.review-main .hero .middle p .medium {
  font-weight: 500;
}
.review-main .hero .middle p.wider {
  max-width: 45rem;
}
.review-main .hero .middle .subp {
  font-size: 1rem;
  color: #8C8398;
  margin-top: 0;
}
.review-main .hero .middle .butterflies-review {
  margin: 3.75rem 0 4.125rem 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 2.1vw;
  width: auto;
}
.review-main .hero .middle .butterflies-review svg {
  flex-shrink: 0;
}
.review-main .hero .middle .butterflies-review input[type=radio] {
  display: none;
  transition: ease-out 0.3s;
}
.review-main .hero .middle .butterflies-review label {
  cursor: pointer;
}
.review-main .hero .middle .butterflies-review label svg {
  cursor: pointer;
}
.review-main .hero .middle .butterflies-review label svg path {
  transition: ease-out 0.3s;
  transition: stroke 0.2s ease-out, fill 0.2s ease-out;
  fill: white;
  stroke: #F09662;
}
.review-main .hero .middle .butterflies-review label svg:hover path, .review-main .hero .middle .butterflies-review label svg.hovered path, .review-main .hero .middle .butterflies-review label svg.selected path {
  stroke: #18072F;
  fill: #18072F;
}
.review-main .hero .middle .dark-btn {
  max-width: 21.563rem;
  margin-top: 0.8rem;
}
.review-main .hero .middle .buttons-wrap {
  height: 0;
  transform: scale(0);
  transition: ease-out 0.3s;
  opacity: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.938rem;
}
.review-main .hero .middle .buttons-wrap.show {
  transform: scale(1);
  opacity: 1;
  height: auto;
}
.review-main .hero .middle .review {
  position: absolute;
  opacity: 0;
  transform: scale(0);
  transition: ease-out 0.3s;
}
.review-main .hero .middle .rating {
  transition: ease-out 0.3s;
}
.review-main .hero .middle.review .rating {
  position: absolute;
  opacity: 0;
  transform: scale(0);
  display: none;
}
.review-main .hero .middle.review .review {
  position: static;
  opacity: 1;
  transform: scale(1);
  transition: ease-out 0.3s;
}
.review-main .hero .middle.review .rating-row {
  transform: scale(0.37);
  position: absolute;
  bottom: 100%;
  margin: 0;
  margin-bottom: 0.75rem;
}
.review-main .hero .middle.review .rating-row svg path {
  stroke-width: 2px;
}
.review-main .hero .middle .check-wrap {
  width: 100%;
  padding-bottom: 1.313rem;
}
.review-main .hero .middle .check-wrap.border-blue {
  border-bottom: 1px solid #18072F;
  margin-bottom: 2.688rem;
}
.review-main .hero .middle .check-wrap.border-light {
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(240, 150, 98, 0.25);
}
.review-main .hero .middle .check-wrap a {
  color: #F09662;
  text-decoration: underline;
}
.review-main .hero .middle .check-wrap.wrap1 {
  padding: 0;
}
.review-main .hero .middle .check-wrap.wrap2 {
  margin-top: 2.25rem;
}
.review-main .hero .middle .check-wrap.wrap3 {
  margin-top: 2rem;
  margin-bottom: 2.5rem;
}
.review-main .hero .middle .check-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
}
.review-main .hero .middle .check-wrap span {
  font-size: 1.125rem;
  font-weight: 500;
}
.review-main .hero .middle .check-wrap label {
  min-width: 1.75rem;
  height: 1.75rem;
  width: 1.75rem;
  position: relative;
  cursor: pointer;
  transition: ease-out 0.3s;
  box-shadow: inset 0 0 0 0.16rem rgba(226, 226, 162, 0);
}
.review-main .hero .middle .check-wrap label:hover {
  box-shadow: inset 0 0 0 0.16rem rgb(24, 7, 47);
}
.review-main .hero .middle .check-wrap label input {
  height: 100%;
  width: 100%;
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.review-main .hero .middle .check-wrap label span {
  border: 0.125rem solid rgb(24, 7, 47);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  transition: ease-out 0.1s;
}
.review-main .hero .middle .check-wrap label span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.review-main .hero .middle .check-wrap label span svg {
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  opacity: 0;
  transition: ease-out 0.1s;
}
.review-main .hero .middle .check-wrap label input:checked + span svg {
  opacity: 1;
}
.review-main .hero .middle .check-wrap label input:checked + span {
  background-color: rgb(24, 7, 47);
}
.review-main .hero .butterflies {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 2.188rem;
}
.review-main .hero .butterflies .big-b {
  width: 8.313rem;
  height: auto;
}
.review-main .hero .butterflies .small-b {
  width: 4.125rem;
  height: auto;
}
.review-main .hero .butterflies.top {
  align-items: flex-end;
}
.review-main .hero .butterflies.bottom {
  align-self: flex-end;
}
.review-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-top: #E8996B 1px solid;
  align-self: center;
  margin-top: 7.5rem;
}

@media only screen and (max-width: 1020px) {
  .review-main .hero {
    padding: 6vh 0 !important;
    width: 86%;
  }
  .review-main .hero .middle {
    width: 100%;
    max-width: 100%;
    margin: 8vh 0;
  }
  .review-main .hero .middle h1 {
    font-size: 1.923rem !important;
    text-transform: uppercase;
  }
  .review-main .hero .middle p {
    font-size: 1.231rem;
    text-align: center;
    margin: 2rem 0 0 0;
    width: 100%;
  }
  .review-main .hero .middle p .medium {
    text-wrap: nowrap;
  }
  .review-main .hero .middle .buttons-wrap {
    flex-direction: column-reverse;
    gap: 1.154rem;
    width: 100%;
  }
  .review-main .hero .middle .dark-btn {
    text-transform: uppercase !important;
    width: 100%;
    margin: 0;
    max-width: 100%;
  }
  .review-main .hero .middle .rating-row {
    width: 100%;
    gap: 5vw;
    margin-bottom: 3.75rem;
  }
  .review-main .hero .middle .rating-row svg {
    width: 3.3rem;
    height: auto;
  }
  .review-main .hero .middle .rating-row svg path {
    stroke-width: 1.5px;
  }
  .review-main .hero.review .rating-row {
    transform: scale(0.46);
  }
  .review-main .hero.review .rating-row svg path {
    stroke-width: 1.5px;
  }
  .review-main .small-b {
    width: 2.313rem !important;
    height: auto;
  }
  .review-main .big-b {
    width: 4.625rem !important;
    height: auto;
  }
  .review-main .butterflies {
    gap: 1.25rem !important;
  }
}
.welcome-header {
  width: 100%;
  padding-inline: 5.5%;
  height: 6rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
  position: fixed;
  top: 0;
  background: linear-gradient(180deg, rgba(24, 7, 47, 0.5) 0%, rgba(24, 7, 47, 0) 100%);
  background-repeat: no-repeat;
  background-position: 0% 0%;
  background-origin: padding-box;
}
.welcome-header .header-link {
  color: white;
  color: white;
  font-size: 1.375rem;
  font-family: "Quiche Sans", sans-serif;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.125rem;
}
.welcome-header .header-link:hover {
  text-decoration: underline;
}
.welcome-header .right {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 3.125rem;
}
.welcome-header .right .lang {
  color: white;
  font-size: 1.375rem;
}
.welcome-header .logo svg path {
  fill: white;
}
.welcome-header .reserve-btn {
  padding-inline: 1.25rem;
  height: 3.375rem;
  outline: none;
  border: 1px solid white;
  font-size: 1.125rem;
  color: white;
  background-color: rgba(0, 0, 0, 0);
  cursor: pointer;
  transition: ease-out 0.3s;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.welcome-header .reserve-btn:hover {
  background-color: white;
  color: #18072F;
}

.welcome-main h1 {
  transform: translateY(-2000%);
}
.welcome-main {
  height: 100dvh;
  width: 100vw;
  position: fixed;
  top: 0;
  background-color: #c7a1ff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.welcome-main #dotLink {
  padding: 0 2.5rem;
  position: fixed;
  height: 2.75rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  bottom: 29%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
  background-color: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  min-width: 17rem;
  color: white;
  font-size: 1.125rem;
  transition: ease-out 0.3s;
}
.welcome-main #dotLink:hover {
  background-color: #18072F;
}
.welcome-main .dots {
  position: absolute;
  right: 5.5%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
}
.welcome-main .dots svg {
  transition: ease-out 0.2s;
  cursor: pointer;
}
.welcome-main .dots svg path {
  transition: ease-out 0.2s;
}
.welcome-main .dots svg.active {
  transform: scale(1.0458181818);
  pointer-events: none;
}
.welcome-main .dots svg.active .border {
  opacity: 1;
}
.welcome-main .dots svg.active .inner {
  opacity: 1;
}
.welcome-main .dots svg:hover .border {
  opacity: 0.75;
}
.welcome-main .video-wrapper {
  position: fixed;
  inset: 0; /* shorthand for top: 0; left: 0; right: 0; bottom: 0 */
  z-index: 1;
  overflow: hidden;
  touch-action: pan-y;
}
.welcome-main .video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(24, 7, 47, 0.45); /* orange tint with 0.45 opacity */
  pointer-events: none;
  z-index: 1;
}
.welcome-main .video-wrapper video {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.8s ease;
  opacity: 0;
}
.welcome-main .video-wrapper video.active {
  opacity: 1;
}
.welcome-main .time-display {
  display: flex;
  gap: 0.05em;
  justify-content: center;
  align-items: center;
  font-size: 10.313rem;
  position: fixed;
  top: 49%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
}
.welcome-main .digit-column {
  overflow: hidden;
  height: 1em;
  width: 0.6em;
  position: relative;
}
.welcome-main .digit-inner {
  display: flex;
  flex-direction: column;
  transition: transform 0.6s ease-in-out;
}
.welcome-main .digit-inner span {
  height: 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white !important;
  font-family: "Quiche Sans", sans-serif !important;
}
.welcome-main .separator {
  width: 0.4em;
  text-align: center;
  color: white !important;
  font-family: "Quiche Sans", sans-serif !important;
}
.welcome-main .scroll {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: 1.3%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
}
.welcome-main .scroll p {
  color: white;
  font-size: 0.813rem;
  text-align: center;
}

.welcome-footer {
  width: 100%;
}

@media only screen and (max-width: 1020px) {
  .welcome-header {
    width: 100%;
    padding-inline: 5.5%;
    height: 5.923rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    position: fixed;
    top: 0;
    background: linear-gradient(180deg, rgba(24, 7, 47, 0.5) 0%, rgba(24, 7, 47, 0) 100%);
    background-repeat: no-repeat;
    background-position: 0% 0%;
    background-origin: padding-box;
  }
  .welcome-header .header-link {
    color: white;
    color: white;
    font-size: 1.231rem;
    font-family: "Quiche Sans", sans-serif;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 1.125rem;
  }
  .welcome-header .header-link:hover {
    text-decoration: underline;
  }
  .welcome-header .header-link svg {
    width: 1.615rem;
    height: 1.385rem;
  }
  .welcome-header .reserve-btn {
    padding-inline: 1rem;
    height: 2.769rem;
    outline: none;
    border: 1px solid white;
    font-size: 1rem;
    color: white;
    background-color: rgba(0, 0, 0, 0);
    cursor: pointer;
    transition: ease-out 0.3s;
  }
  .welcome-header .reserve-btn:hover {
    background-color: white;
    color: #18072F;
  }
  .welcome-main .lang {
    position: fixed;
    bottom: 2%;
    font-family: "Satoshi", sans-serif;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    color: white;
    font-size: 1.231rem;
  }
  .welcome-main h1 {
    transform: translateY(-2000%);
  }
  .welcome-main {
    height: 100dvh;
    width: 100vw;
    position: fixed;
    top: 0;
    background-color: #c7a1ff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .welcome-main #dotLink {
    padding: 0 2.5rem;
    position: fixed;
    height: 3.154rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    min-width: 17rem;
    color: white;
    font-size: 1.154rem;
    transition: ease-out 0.3s;
  }
  .welcome-main #dotLink:hover {
    background-color: #18072F;
  }
  .welcome-main .dots {
    position: fixed;
    left: 50%;
    z-index: 3;
    transform: translate(-50%, -50%) scale(0.9);
    bottom: calc(6% + 7rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
  }
  .welcome-main .dots svg {
    transition: ease-out 0.2s;
    cursor: pointer;
  }
  .welcome-main .dots svg path {
    transition: ease-out 0.2s;
  }
  .welcome-main .dots svg.active {
    transform: scale(1.0458181818);
    pointer-events: none;
  }
  .welcome-main .dots svg.active .border {
    opacity: 1;
  }
  .welcome-main .dots svg.active .inner {
    opacity: 1;
  }
  .welcome-main .dots svg:hover .border {
    opacity: 0.75;
  }
  .welcome-main .video-wrapper {
    position: fixed;
    inset: 0; /* shorthand for top: 0; left: 0; right: 0; bottom: 0 */
    z-index: 1;
    overflow: hidden;
    touch-action: pan-y;
  }
  .welcome-main .video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(24, 7, 47, 0.45); /* orange tint with 0.45 opacity */
    pointer-events: none;
    z-index: 1;
  }
  .welcome-main .video-wrapper video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.8s ease;
    opacity: 0;
  }
  .welcome-main .video-wrapper video.active {
    opacity: 1;
  }
  .welcome-main .time-display {
    display: flex;
    gap: 0.05em;
    justify-content: center;
    align-items: center;
    font-size: 7.308rem;
    position: fixed;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 43%;
    z-index: 1000;
  }
  .welcome-main .scroll {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    justify-content: center;
    align-items: center;
    position: fixed;
    bottom: 7%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
  }
  .welcome-main .scroll p {
    color: white;
    font-size: 1rem;
    text-align: center;
  }
}
@media only screen and (max-height: 800px) and (max-width: 1020px) {
  .welcome-main .lang {
    position: fixed;
    bottom: 2%;
    font-family: "Satoshi", sans-serif;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    color: white;
    font-size: 1.231rem;
  }
  .welcome-main h1 {
    transform: translateY(-2000%);
  }
  .welcome-main {
    height: 100dvh;
    width: 100vw;
    position: fixed;
    top: 0;
    background-color: #c7a1ff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .welcome-main #dotLink {
    padding: 0 2.5rem;
    position: fixed;
    height: 3.154rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    min-width: 17rem;
    color: white;
    font-size: 1.154rem;
    transition: ease-out 0.3s;
  }
  .welcome-main #dotLink:hover {
    background-color: #18072F;
  }
  .welcome-main .dots {
    position: fixed;
    left: 50%;
    z-index: 3;
    transform: translate(-50%, -50%) scale(0.9);
    bottom: calc(6% + 7rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
  }
  .welcome-main .dots svg {
    transition: ease-out 0.2s;
    cursor: pointer;
  }
  .welcome-main .dots svg path {
    transition: ease-out 0.2s;
  }
  .welcome-main .dots svg.active {
    transform: scale(1.0458181818);
    pointer-events: none;
  }
  .welcome-main .dots svg.active .border {
    opacity: 1;
  }
  .welcome-main .dots svg.active .inner {
    opacity: 1;
  }
  .welcome-main .dots svg:hover .border {
    opacity: 0.75;
  }
  .welcome-main .video-wrapper {
    position: fixed;
    inset: 0; /* shorthand for top: 0; left: 0; right: 0; bottom: 0 */
    z-index: 1;
    overflow: hidden;
    touch-action: pan-y;
  }
  .welcome-main .video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(24, 7, 47, 0.45); /* orange tint with 0.45 opacity */
    pointer-events: none;
    z-index: 1;
  }
  .welcome-main .video-wrapper video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.8s ease;
    opacity: 0;
  }
  .welcome-main .video-wrapper video.active {
    opacity: 1;
  }
  .welcome-main .time-display {
    display: flex;
    gap: 0.05em;
    justify-content: center;
    align-items: center;
    font-size: 7.308rem;
    position: fixed;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 30%;
    z-index: 1000;
  }
  .welcome-main .scroll {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    justify-content: center;
    align-items: center;
    position: fixed;
    bottom: 7%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
  }
  .welcome-main .scroll p {
    color: white;
    font-size: 1rem;
    text-align: center;
  }
}
@media only screen and (max-height: 650px) and (max-width: 1020px) {
  .welcome-main .lang {
    position: fixed;
    bottom: 2%;
    font-family: "Satoshi", sans-serif;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    color: white;
    font-size: 1.231rem;
  }
  .welcome-main h1 {
    transform: translateY(-2000%);
  }
  .welcome-main {
    height: 100dvh;
    width: 100vw;
    position: fixed;
    top: 0;
    background-color: #c7a1ff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
  }
  .welcome-main #dotLink {
    padding: 0 2.5rem;
    position: fixed;
    height: 3.154rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    min-width: 17rem;
    color: white;
    font-size: 1.154rem;
    transition: ease-out 0.3s;
  }
  .welcome-main #dotLink:hover {
    background-color: #18072F;
  }
  .welcome-main .dots {
    position: fixed;
    left: 50%;
    z-index: 3;
    transform: translate(-50%, -50%) scale(0.9);
    bottom: calc(6% + 7rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
  }
  .welcome-main .dots svg {
    transition: ease-out 0.2s;
    cursor: pointer;
  }
  .welcome-main .dots svg path {
    transition: ease-out 0.2s;
  }
  .welcome-main .dots svg.active {
    transform: scale(1.0458181818);
    pointer-events: none;
  }
  .welcome-main .dots svg.active .border {
    opacity: 1;
  }
  .welcome-main .dots svg.active .inner {
    opacity: 1;
  }
  .welcome-main .dots svg:hover .border {
    opacity: 0.75;
  }
  .welcome-main .video-wrapper {
    position: fixed;
    inset: 0; /* shorthand for top: 0; left: 0; right: 0; bottom: 0 */
    z-index: 1;
    overflow: hidden;
    touch-action: pan-y;
  }
  .welcome-main .video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(24, 7, 47, 0.45); /* orange tint with 0.45 opacity */
    pointer-events: none;
    z-index: 1;
  }
  .welcome-main .video-wrapper video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.8s ease;
    opacity: 0;
  }
  .welcome-main .video-wrapper video.active {
    opacity: 1;
  }
  .welcome-main .time-display {
    display: flex;
    gap: 0.05em;
    justify-content: center;
    align-items: center;
    font-size: 7.308rem;
    position: fixed;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 30%;
    z-index: 1000;
  }
  .welcome-main .scroll {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    justify-content: center;
    align-items: center;
    position: fixed;
    bottom: 7%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
  }
  .welcome-main .scroll p {
    color: white;
    font-size: 1rem;
    text-align: center;
  }
}
.partners-main {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.partners-main hr {
  width: 85.4%;
  border: 0;
  margin: 0;
  border-bottom: #F09662 1px solid;
  align-self: center;
  position: relative;
  z-index: 2;
}
.partners-main .hero {
  width: 100%;
  padding-inline: 8.25%;
  padding-top: 5.938rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0;
}
.partners-main .hero .left {
  width: 44%;
}
.partners-main .hero .left h2 {
  text-transform: uppercase;
  font-size: 1rem;
  font-weight: 400;
}
.partners-main .hero .left h1 {
  font-size: 3rem;
  font-weight: 400;
  font-family: "Quiche Sans", sans-serif;
  margin: 1.25rem 0 2rem 0;
}
.partners-main .hero .left p {
  color: #18072F;
  font-weight: 300;
  font-size: 1rem;
}
.partners-main .hero .left a {
  width: fit-content;
  margin-top: 2.25rem;
  text-transform: none;
}
.partners-main .hero .images {
  right: 7.6%;
  width: 35.6666%;
  position: relative;
  aspect-ratio: 565/498;
}
.partners-main .hero .images img {
  object-position: center;
  object-fit: cover;
}
.partners-main .hero .images .img1 {
  width: 45.7%;
  aspect-ratio: 1/1;
  position: absolute;
  z-index: 3;
  left: 0;
  top: 5%;
}
.partners-main .hero .images .img2 {
  aspect-ratio: 348/244;
  width: 61.7%;
  position: absolute;
  z-index: 2;
  left: 25%;
  bottom: 0;
}
.partners-main .hero .images .img3 {
  width: 45.7%;
  aspect-ratio: 258/363;
  position: absolute;
  z-index: 1;
  right: 0;
  top: 0;
}
.partners-main .partners-section {
  width: 100%;
  padding-inline: 8.25%;
  position: relative;
}
.partners-main .partners-section .decor {
  position: absolute;
  right: 8.25%;
  bottom: 8.375rem;
}
.partners-main .partners-section .partners {
  width: 100%;
  display: flex;
  gap: 4%;
}
.partners-main .partners-section .partners .partner {
  width: 12.3%;
  min-width: 12.25rem;
  aspect-ratio: 196/164;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  gap: 1.846rem;
}
.partners-main .partners-section .partners .partner p {
  display: none;
}
.partners-main .partners-section .partners .partner {
  border: 1px solid #F09662;
}
.partners-main .partners-section .partners .partner .butterfly {
  position: absolute;
}
.partners-main .partners-section .partners .partner.partner1 .butterfly {
  top: 0;
  left: 12.2%;
  transform: translateY(-50%);
}
.partners-main .partners-section .partners .partner.partner1 .partner-logo {
  display: flex;
  width: 67.8%;
  height: auto;
}
.partners-main .partners-section .partners .partner.partner2 .butterfly {
  bottom: 0;
  right: 12.2%;
  transform: translateY(50%) rotate(180deg);
}
.partners-main .partners-section .partners .partner.partner2 .partner-logo {
  display: flex;
  width: 74.5%;
  height: auto;
}
.partners-main .partners-section .partners .partner.partner3 .butterfly {
  top: 0;
  left: 12.2%;
  transform: translateY(-50%);
}
.partners-main .partners-section .partners .partner.partner3 .partner-logo {
  display: flex;
  width: 64.3%;
  height: auto;
}
.partners-main .partners-section .partners .partner.partner4 .butterfly {
  bottom: 0;
  right: 12.2%;
  transform: translateY(50%) rotate(180deg);
}
.partners-main .partners-section .partners .partner.partner4 .partner-logo {
  display: flex;
  width: 72%;
  height: auto;
}
.partners-main .partners-section .p {
  margin: 3.5rem 0 8rem 0;
  max-width: 38.188rem;
  font-size: 0.875rem;
  color: #8C8398;
  font-style: italic;
}

@media only screen and (max-width: 1020px) {
  .partners-main .hero {
    margin-top: 4.846rem;
    flex-direction: column;
    padding: 0 7.7%;
  }
  .partners-main .hero .decor {
    margin-bottom: 3.154rem;
    position: relative;
    left: 12%;
  }
  .partners-main .hero .dark-btn {
    text-transform: none;
  }
  .partners-main .hero .left {
    width: 100%;
  }
  .partners-main .hero .left h2 {
    font-size: 1.077rem;
  }
  .partners-main .hero .left h1 {
    margin: 1rem 0 2.769rem 0;
    font-size: 2.769rem;
    font-weight: 400;
  }
  .partners-main .hero .left p {
    font-size: 1.231rem;
  }
  .partners-main .hero .images {
    width: 100%;
    right: 0;
    margin: 2.769rem 0 3.154rem 0;
    aspect-ratio: 372/389;
  }
  .partners-main .hero .images .img1 {
    width: 51%;
    top: 7%;
  }
  .partners-main .hero .images .img2 {
    width: 73%;
    left: 14%;
  }
  .partners-main .hero .images .img3 {
    width: 45.6%;
  }
  .partners-main .partners-section {
    padding-top: 4.462rem;
    padding-bottom: 3.846rem;
  }
  .partners-main .partners-section .p {
    margin: 3.692rem 0 3.846rem 0;
    font-size: 0.846rem;
    font-weight: 400;
  }
  .partners-main .partners-section .mobile-decor1 {
    justify-self: flex-end;
  }
  .partners-main .partners-section .partners {
    margin-top: 6.308rem;
    flex-direction: column;
    gap: 2.462rem;
  }
  .partners-main .partners-section .partners .partner {
    width: 100%;
    aspect-ratio: auto;
    min-height: 14.538rem;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    padding: 2.462rem 1.846rem 1.923rem 1.846rem;
  }
  .partners-main .partners-section .partners .partner p {
    display: flex;
    color: #18072F;
    font-size: 1.077rem;
    font-weight: 300;
  }
  .partners-main .partners-section .partners .partner .butterfly {
    width: 3.692rem;
    height: 3.692rem;
  }
  .partners-main .partners-section .partners .partner.partner1 .partner-logo {
    width: 11.462rem;
    height: 2.231rem;
  }
  .partners-main .partners-section .partners .partner.partner2 .partner-logo {
    width: 11.231rem;
    height: 0.923rem;
  }
  .partners-main .partners-section .partners .partner.partner3 .partner-logo {
    width: 7.846rem;
    height: 2.769rem;
  }
  .partners-main .partners-section .partners .partner.partner4 .partner-logo {
    width: 10.615rem;
    height: 0.923rem;
  }
  .partners-main .partners-section .partners .partner.partner1 .butterfly, .partners-main .partners-section .partners .partner.partner3 .butterfly {
    left: 1.846rem;
  }
  .partners-main .partners-section .partners .partner.partner2 .butterfly, .partners-main .partners-section .partners .partner.partner4 .butterfly {
    right: 1.846rem;
  }
}
.no-transform {
  text-transform: none !important;
}

.indicator-wrap.white .scroll-indicator {
  background-color: white !important;
  width: 100% !important;
}