@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');


body{
    direction: ltr;
    font-family: 'Roboto Slab', sans-serif !important;
    font-size: 14px;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}


*, *::before, *::after {
    box-sizing: border-box;
  }

  :root {
    --dark: #52057B;
    --color: #949cdf;
    --light: #d8ac9c;
  }
  
  .lead-element-box {
    width: 100%;
    padding-right: 17px;
    padding-left: 17px;
    max-width: 1313px;
	  margin: 0 auto;
  }
  
  button {
    border: none;
  }
  
  p {
    padding: 7px 0;
    margin: 0;
  }

  li {
    padding-left: 7px;
  }
  
  
  ul {
    padding: 0;
    margin-left: 7px;
  }
  
  img {
    max-width: 100%;
    display: block;
  }

  
.button-1 {
  overflow: hidden;
  position: relative;
  padding: 17px;
  color: #FFF;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 2px;
  background-color: #212121;
  transition: all 0.5s;
  border: none;
}
.button-1::before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(29, 255, 86, 0.281);
  border-radius: 6px;
  transition: all 0.3s;
  z-index: 1;
}
.button-1:hover::before {
  opacity: 0;
  transform: scale(0.7,0.7);
}
.button-1::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.4s;
  border: 1px solid rgba(29, 255, 86, 0.281);
  border-radius: 6px;
  transform: scale(1.5,1.5);
  opacity: 0;
  z-index: 1;
}
.button-1:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
.button-2 {
  padding: 7px 13px;
  border: 1px solid #bbb;
  color: #222;
  font-weight: 500;
  cursor: pointer;
  border-radius: 6px;
  box-shadow: 0 13px 17px rgba(0,0,0,0.2);
  transition: all .3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.button-2:hover {
  background-color: #007ffe;
  color: #fff;
  box-shadow: -17px 44px 44px rgba(0,0,0,0.2);
  border: none;
  padding: 13px 17px;
}
.button-3 {
  padding: 13px;
  padding-left: 28px;
  padding-right: 28px;
  border-radius: 15px;
  font-weight: 500;
  transition: .4s ease-in-out;
  box-shadow: inset 2px 7px 13px rgba(0,0,0,0.2);
  letter-spacing: 0.2em;
  border: none;
}
.button-3:hover {
  letter-spacing: 0.5em;
  transform: translateY(-0.2em);
  background: #171717;
  color: white;
}
.button-3:active {
  letter-spacing: 0.4em;
  transition: 0.1s all;
  transform: translateY(-0.6em);
  background: #171717;
  color: white;
}
.button-4 {
  color: #000;
  border: 1px solid black;
  padding: 13px;
  border-radius: 28px;
  background-color: pink;
  font-weight: 500;
  font-size: 14px;
  -webkit-box-shadow: 0px 0px 1px;
  box-shadow: 0px 0px 1px;
  -webkit-transform: all 2s esase;
  -ms-transform: all 2s esase;
  transform: all 2s esase;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;
}

.button-4:hover {
  transform: translateY(-7px);
  -webkit-box-shadow: 0px 7px 1px rgb(0, 0, 0);
  box-shadow: 0px 7px 1px rgb(0, 0, 0);
  border: 1px solid black;
}

.button-4:active {
  -webkit-transform: translateY( 13px);
  -ms-transform: translateY( 13px);
  transform: translateY( 13px);
  -webkit-box-shadow: 0px 0px 1px;
  box-shadow: 0px 0px 1px;
}

.button-5 {
  position: relative;
  cursor: pointer;
  padding: 13px 17px;
  border: 0;
  border-radius: 6px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
  background: radial-gradient(
    ellipse at bottom,
    rgba(71, 81, 92, 1) 0%,
    rgba(11, 21, 30, 1) 45%
  );
  color: rgb(255, 255, 255, 0.66);
  transition: all 1s cubic-bezier(0.15, 0.83, 0.66, 1);
}

.button-5::before {
  content: "";
  width: 70%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 15%;
  background: rgb(255, 255, 255);
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  opacity: 0.2;
  transition: all 1s cubic-bezier(0.15, 0.83, 0.66, 1);
}

.button-5:hover {
  color: rgb(255, 255, 255, 1);
  transform: scale(1.1) translateY(-3px);
}

.button-5:hover::before {
  opacity: 1;
}

.contact-map iframe{
  border: none;
}

  .top-header-navigation-bg {
    background-color: var(--color);
  }

  .top-header-navigation {
    flex-wrap: wrap;
    padding-top: 17px;
    padding-bottom: 17px;
    display: flex;
    justify-content: space-between;
    gap: 17px;
    flex-direction: row;
    align-items: center;
  }

  .ui-logo {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 7px;
  }

  .ui-logo img {
    object-fit: contain;
    height: 57px;
    width: 57px;
  }

  .ui-logo h3 {
    margin: 0;
    color: var(--light);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.4;
    text-transform: inherit;
  }

  .ui-link-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 13px;
    align-items: baseline;
  }
  
  .ui-link {
    position: relative;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 1px;
    color: var(--light);
    transition: all 0.2s ease-in-out;
  }

  .ui-link::after {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #fff;
    content: '';
    opacity: 0;
    transition: height 0.3s, opacity 0.3s, transform 0.3s;
    transform: translateY(-13px);
  }

  .ui-link:hover:after {
    height: 1px;
    opacity: 1;
    transform: translateY(7px);
}

  .ui-dropdown {
    display: inline-block;
    position: relative;
    text-align: center;
  }
  
  .ui-dropdown input[type="checkbox"]  {
    display: none;
  }
  
  .ui-dropdown input[type="checkbox"]:checked ~ .ui-dropdown-list {
    opacity: 1;
    max-height: 305px;
    padding: 7px 0;
  }
  
  .ui-dropdown input[type="checkbox"]:checked ~ .ui-dropdown-btn {
    z-index: 99;
    box-shadow: 0 0 0 2px #e2e3e3ba;
    position: relative;
  }
  
  .ui-dropdown-btn {
    font-weight: 500;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--light);
    transition: all 0.2s ease-in-out;
    position: relative;    
    display: inline-block;
    cursor: pointer;
  }

  .ui-dropdown-btn:after {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #fff;
    content: '';
    opacity: 0;
    transition: height 0.3s, opacity 0.3s, transform 0.3s;
    transform: translateY(-13px);
  }

    .ui-dropdown-btn:hover:after {
    height: 1px;
    opacity: 1;
    transform: translateY(7px);
    }
  
  
  .ui-dropdown-list {
    position: absolute;
    top: calc(100% + 0.4rem);
    width: 275px;
    padding: 0;
    margin: 0;
    transition: all 0.3s ease;
    background: #f8fff7;
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    z-index: 99;
  }
  
  .ui-dropdown-link {
    list-style: none;
  }
  
  .ui-dropdown-link a {
    display: block;
    color: #555;
    text-decoration: none;
    padding: 7px;
    transition: all 0.3s ease;
  }
  
  .ui-dropdown-link a:hover {
    background: #eee;
  }

     
  .welcome-showcase-section {
    padding-bottom: 75px;
    background-color: #00000007;
  }

  .welcome-showcase {
    align-items: flex-start;
    display: flex;
    height: 364px;
    background-image: url("pic/illustration_header_6880ff462a6975.64882947.jpg");
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    justify-content: center;
    width: 100%;
  }

  .welcome-showcase-slogan {
    background-color: #EF214359;
    color: #fff;
    font-size: 49px;
    font-weight: 500;
    margin: 100px 28px 0 28px;
    border: 6px solid #fff;
    padding: 7px;
    text-transform: uppercase;
  }

  .welcome-showcase-content {
    width: 80%;
    padding: 28px 36px;
    background: #FFF;
    border-radius: 6px;
    box-shadow: 0 13px 17px rgba(0,0,0,0.19), 0 7px 7px rgba(0,0,0,0.23);
    display: flex;
    flex-direction: row;
    gap: 17px;
    align-items: center;
    margin: -95px auto 28px auto;
    line-height: 1.4;
  }

  .welcome-showcase-title {
    width: 60%;
  }

  .welcome-showcase-title h2 {
    font-size: 24px;
    line-height: 1.4;
  }

  .welcome-showcase-decor {
    width: 38%;
    display: flex;
    justify-content: center;
    position: relative;
  }

  .welcome-showcase-img {
      border-radius: 50%;
      width: 305px;
      height: 305px;
      overflow: hidden;
  }  
  
  .welcome-showcase-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .welcome-showcase-discont {
    position: absolute;
    bottom: -30px;
    right: 0px;
    width: 159px;
    height: 159px;
    border-radius: 50%;
    background-color: #EF214399;
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 7px;
  }

  .welcome-showcase-disconttxt {
    font-size: 35px;
    font-weight: 500;
    color: var(--dark);
    text-align: start;
    font-style: italic;
  }

  .welcome-showcase-discontnum {
    font-size: 53px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--dark);
    text-align: end;
    font-style: italic;
  }

  .pros-showcase-bg {
    background-color: var(--dark);
    padding-top: 75px;
    padding-bottom:  36px;
}

.pros-showcase-title {
  font-size: 27px;
  font-weight: 500;
  color: var(--light);
  margin: 0;
  margin-bottom: 28px;
  text-align: center;
}

.pros-showcase-entry {
  display: block;
  font-size: 16px;
  text-align: center;
  color: var(--light);
  margin-bottom: 17px;
}

.pros-showcase-outro {
  display: none;
  font-size: 14px;
  text-align: center;
  color: var(--light);
  margin-top: 17px;
}

.benefit-showcase {
	width: 100%;
}

.benefit-showcase input {
	display: none;
}

.benefit-showcase-list {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	min-height: 364px;
	perspective: 1000px;
	overflow: hidden;
}

.benefit-showcase-item {
	width: 25%;
	padding: 28px;
	border-radius: 6px;
	background: rgba(255,255,255,0.9); color: #222;
	position: absolute;
	top: 0;
	box-sizing: border-box;
	text-align: center;
	transition: transform 0.4s;
	box-shadow: 0 0 13px rgba(0,0,0,0.3);
	user-select: none;
	cursor: pointer;
}

.benefit-showcase-item img {
	width: 95px;
	height: 95px;
	object-fit: cover;
	border-radius: 50%;
   border: 6px solid var(--dark);
}

.benefit-showcase-item h2 {
	font-size: 14px;
    color: #EF2143;
}

.benefit-showcase-item p {
  font-size:  18px;
}

.dots {
  display: flex;
  justify-content: center;
  align-items: center;
}

.dots label {
  height: 13px;
  width: 13px;
  border-radius: 50%;
  cursor: pointer;
  background-color: #626262;
  margin:  7px;
  transition-duration: 0.2s;
}

#bsi-1:checked ~ .dots label[for="bsi-1"],
#bsi-2:checked ~ .dots label[for="bsi-2"],
#bsi-3:checked ~ .dots label[for="bsi-3"],
#bsi-4:checked ~ .dots label[for="bsi-4"],
#bsi-5:checked ~ .dots label[for="bsi-5"] {
  transform: scale(2);
  background-color: #fff;
}

#bsi-1:checked ~ .dots label[for="bsi-2"],
#bsi-2:checked ~ .dots label[for="bsi-1"],
#bsi-2:checked ~ .dots label[for="bsi-3"],
#bsi-3:checked ~ .dots label[for="bsi-2"],
#bsi-3:checked ~ .dots label[for="bsi-4"],
#bsi-4:checked ~ .dots label[for="bsi-3"],
#bsi-4:checked ~ .dots label[for="bsi-5"],
#bsi-5:checked ~ .dots label[for="bsi-4"] {
  transform: scale(1.5);
}
#bsi-1:checked ~ .benefit-showcase-list label[for="bsi-5"] {
  transform: translate3d(1200px, 0, -357px) rotateY(-45deg);
}
#bsi-1:checked ~ .benefit-showcase-list label[for="bsi-4"],
#bsi-2:checked ~ .benefit-showcase-list label[for="bsi-5"] {
  transform: translate3d(900px, 0, -275px) rotateY(-35deg);
  z-index: 1;
}
#bsi-1:checked ~ .benefit-showcase-list label[for="bsi-3"],
#bsi-2:checked ~ .benefit-showcase-list label[for="bsi-4"],
#bsi-3:checked ~ .benefit-showcase-list label[for="bsi-5"] {
  transform: translate3d(600px, 0, -175px) rotateY(-25deg);
  z-index: 2;
}
#bsi-1:checked ~ .benefit-showcase-list label[for="bsi-2"],
#bsi-2:checked ~ .benefit-showcase-list label[for="bsi-3"],
#bsi-3:checked ~ .benefit-showcase-list label[for="bsi-4"],
#bsi-4:checked ~ .benefit-showcase-list label[for="bsi-5"] {
  transform: translate3d(300px, 0, -92px) rotateY(-15deg);
  z-index: 3;
}
#bsi-2:checked ~ .benefit-showcase-list label[for="bsi-1"],
#bsi-3:checked ~ .benefit-showcase-list label[for="bsi-2"],
#bsi-4:checked ~ .benefit-showcase-list label[for="bsi-3"],
#bsi-5:checked ~ .benefit-showcase-list label[for="bsi-4"] {
  transform: translate3d(-300px, 0, -92px) rotateY(15deg);
  z-index: 3;
}
#bsi-3:checked ~ .benefit-showcase-list label[for="bsi-1"],
#bsi-4:checked ~ .benefit-showcase-list label[for="bsi-2"],
#bsi-5:checked ~ .benefit-showcase-list label[for="bsi-3"] {
  transform: translate3d(-600px, 0, -175px) rotateY(25deg);
}
#bsi-5:checked ~ .benefit-showcase-list label[for="bsi-2"],
#bsi-4:checked ~ .benefit-showcase-list label[for="bsi-1"] {
  transform: translate3d(-900px, 0, -275px) rotateY(35deg);
}
#bsi-5:checked ~ .benefit-showcase-list label[for="bsi-1"] {
  transform: translate3d(-1200px, 0, -357px) rotateY(45deg);
}
#bsi-1:checked ~ .benefit-showcase-list label[for="bsi-1"],
#bsi-2:checked ~ .benefit-showcase-list label[for="bsi-2"],
#bsi-3:checked ~ .benefit-showcase-list label[for="bsi-3"],
#bsi-4:checked ~ .benefit-showcase-list label[for="bsi-4"],
#bsi-5:checked ~ .benefit-showcase-list label[for="bsi-4"],
#bsi-5:checked ~ .benefit-showcase-list label[for="bsi-5"] {
  z-index: 4;
}


.main-wrappper {
  display: flex;
  flex-direction:  column;
}

.catalogue-overview {
  padding-top: 75px;
  padding-bottom: 36px;
}

.catalogue-overview-title, .synergy-title, .clarity-corner-title, .lead-showcase-title, .prod-discus-title, .reach-us-cont-title {
  margin-bottom: 36px;
  padding-left:  13px;
}

.catalogue-overview-title h2, .synergy-title h2, .clarity-corner-title h2, .lead-showcase-title h2, .prod-discus-title h2, .reach-us-cont-title h2 {
  font-size: 44px;
  color: #000;
  font-weight: 500;
  margin: 0;
  position: relative;
}

.synergy-title h2 {
  color: var(--light);
}

.clarity-corner-title h2, .prod-discus-title h2 {
  text-align: center;
}

.catalogue-overview-title h2::before, .synergy-title h2::before, .clarity-corner-title h2::before, .lead-showcase-title h2::before, .prod-discus-title h2::before, .reach-us-cont-title h2::before {
  content: '';
  height: 4px;
  width: 223px;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: var(--color);
}

.synergy-title h2::before {
  background-color: var(--light);
}

.clarity-corner-title h2::before, .prod-discus-title h2::before {
  top: 125%;
  left: 50%;
  transform: translateX(-50%);
}

.catalogue-overview-title h2::after, .lead-showcase-title h2::after {
  content: '';
  height: 4px;
  width: 95px;
  position: absolute;
  top: 100%;
  left: 0;
  margin-top:  7px;
  background-color: var(--color);
}

.catalogue-overview-list {
  display: flex;
  flex-direction: row;
  gap: 28px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.prod-card {
  transition: all .4s cubic-bezier(0.175, 0.885, 0, 1);
  background-color: #fff;
  width: 30%;
  position: relative;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0px 13px 13px -7px rgba(0, 0, 0,0.1);
}

.prod-card-info {
  position: absolute;
  padding: 17px;
  width: 100%;
  opacity: 0;
  top: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 17px;
}

.prod-card:hover .prod-card-info {
  opacity: 1;
}

.prod-card-info-item {
  display: inline;
}

.prod-card-info-item svg {
  width: 39px;
  height: 39px;
}

.prod-card-info-item p {
  font-size: 13px;
  font-weight: {font_weight_bold};
}

.prod-card-img {
  display: flex;
  transition: 0.2s all ease-out;
  width: 100%;
  height: 305px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  top: 0;
}

.prod-card-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.prod-card:hover .prod-card-img {
  opacity: 0.3;
  scale: 2.3;
}

.prod-card:hover {
  box-shadow: 0px 28px 17px -7px rgba(0, 0, 0,0.1);
  transform: scale(1.10, 1.10);
}

.prod-card:hover .prod-card-content {
  background-color: transparent;
  position: relative;
}

.prod-card-content {
  z-index: 2;
  background-color: var(--light);
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  padding: 17px 23px 23px 23px;
}

.prod-card-prodcode, .prod-card-price {
    text-transform: uppercase;
    margin-bottom: 7px;
    text-align: end;
    font-size: 13px;
    letter-spacing: 2px;
    font-weight: 500;
    color: #3d3737;
}

.prod-card-title h4 {
  font-size: 14px;
  font-weight: 500;
  margin: 0;
  margin-bottom: 17px;
}

.prod-card-txt {
  font-size: 16px;
  margin-bottom: 7px;
}

.prod-card-btn {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 13px;
  align-items: center;
  justify-content: space-between;
}

.prod-card-content-wpapper {
  display: flex;
  flex-direction: column;
}

.synergy-section{
  background-color: var(--color);
  padding-top: 36px;
  padding-bottom: 36px;
}

.synergy {
  display: flex;
  flex-direction: column;
  gap: 17px;
}

.synergy-list {
  display: flex;
  gap: 28px;
  margin: auto;
}

.synergy-item {
  background: #d8ac9c29;
  width: 18%;
  height: 95px;
  border-bottom: 3px solid #fff;
  border-top: 3px solid #fff;
  transition: transform 0.3s ease;
}

.synergy-list img{
  width: 100%;
  height: 100%;
  object-fit: contain;  
}

.synergy-item:hover{
  transform: translateY(-17px);
}

.clarity-corner-bg {
  padding-top: 95px;
  padding-bottom: 75px;
  background: #06060619;
}

.clarity-corner-form {
  display: flex;
  flex-direction: row;
  gap: 28px;
}

.clarity-corner {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 23px;
  align-items: center;
}

.clarity-corner-img {
  display: none;
  margin: auto;
  margin-top: 17px;
  width: 100%;
  height: 305px;
  object-fit: contain;
}

.clarity-corner-list {
  display: flex;
  flex-direction: column;
}

.cci-input:checked ~ .cci-answer {
  max-height: 1000px;
  padding-top: 17px;
  margin-bottom: 17px;
  transition: max-height 1s ease-in, margin .3s ease-in, padding .3s ease-in;
}

.cci-input:checked ~ .cci-label > .cci-label span {
  transform: rotate(0);
}
.cci-label span {
  display: block;
  width: 28px;
  position: absolute;
  top: calc(50% - 6px);
  right: 0;
  pointer-events: none;
  transition: transform .3s ease;
  transform: rotate(-180deg);
  text-align: center;
  font-size: 13px;
  line-height: 1;
}
.cci-answer {
  max-height: 0;
  margin-bottom: 0;
  overflow: hidden;
  transition: max-height .15s ease-out, margin-bottom .3s ease-out, padding .3s ease-out;
}
.cci-input {
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  margin: -1;
  overflow: hidden;
  position: absolute;
  left: -9999px;
}

.cci-label {
  background: var(--light);
  border-bottom: 1px solid var(--color);
  border-radius: 6px;
  cursor: pointer;
  display: block;
  font-size: 21px;
  letter-spacing: -.0225rem;
  line-height: 1.4;
  margin-bottom: 13px;
  padding: 17px 7px;
  position: relative;
  transition: all 0.35s ease;
}
.cci-label:hover {
  background: var(--color);
  color: var(--light);
  cursor: pointer;
}
.cci-label::before {
  content: "\276f";
  font-size: 21px;
  float: left;
  line-height: 1.4;
  margin: 0 13px 0 7px;
  transition: all 0.15s ease;
  color: var(--color);
}
.cci-label:hover::before {
  color: var(--light);
  opacity: 0.4;
  transform: rotate(90deg);
}
.cci-answer {
  background: var(--light);
  line-height: 1.4;
  margin-bottom: 23px;
  margin-top: -17px;
  border-top: 1px dashed #eee;
  border-radius: 15px
}
.cci-answer p {
  margin: 0;
  padding: 23px 23px;
}

.order-guide-bg {
  background-image: url(pic/photograph_header_6880ff462a8e57.76690181.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.order-guide-bgoverlay {
  background: linear-gradient(to bottom, #1F1D36 0%, rgba(0, 0, 0, 0) 100%);
  padding-top: 36px;
  padding-bottom: 36px;
}

.order-guide-btitle {
  font-size: 35px;
  font-weight: {font_weight_bold};
  margin: 0;
  text-align: end;
  color: var(--light);
}

.order-guide-cont {
  position: relative;
  min-height: 228px;
}

.order-guide-list {
  border-radius: 0px;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
  position: absolute;
  top: 92px;
  left: 0;
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 28px;
  justify-content: space-between;
  padding: 23px 36px;
  background-color: var(--light);
}

.order-guide-item {
  width: 31%;
  display: flex;
  flex-direction: column;
  gap: 17px;
  align-items: center;
}

.order-guide-img {
  width: 95px;
  height: 95px;
  border-radius: 50%;
  border: 1px #000 dashed;
  display: flex;
  align-items: center;
  justify-content: center;
}

.order-guide-img svg {
  width: 57px;
  height: 57px;
  fill: #000;
}

.order-guide-title {
  margin: 0;
  font-size: 16px;
}

.order-guide-txt {
  text-align: center;
  font-size: 14px;
}


.bottom-sheet-bg {
  background-color:  var(--dark);
  padding-top: 36px;
}

.bottom-sheet-con {
  display: flex;
  justify-content: space-between;
  gap: 28px;
}

.bottom-sheet-logocol {
  width: 22%;
  display: flex;
  flex-direction: column;
  gap: 17px;
}

.bsh-logo {
  display: flex;
  flex-direction: row;
  gap: 17px;
  align-items: center;
  justify-content: flex-start;
  border-left:  3px solid #EF2143;
  padding-left: 7px;
}

.bsh-logo img {
  width: 39px;
  height: 39px;
}

.bsh-logo h3 {
  font-size:  21px;
  font-weight: 500;
  text-transform: uppercase;
  margin: 0;
  color: var(--light);
}

.bsh-social {
  display: flex;
  flex-direction: row;
  gap: 13px;
  align-items: center;
  justify-content: center;
}

.bsh-social svg {
  width: 39px;
  height: 39px;
  fill: var(--light);
}

.bsh-social a {
 color: var(--light);
 font-size: 16px;
}

.bsh-payimg {
  display: flex;
  flex-direction: row;
  gap: 17px;
  justify-content: center;
}

.bsh-payimg img {
  width: 95px;
  object-fit: contain;
}

.bottom-sheet-navcol {
  width: 38%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 23px;
}

.bsh-nav-title, .bsh-formtitle{ 
  font-size:  27px;
  color: #000;
  border-left:  3px solid #EF2143;
  padding-left: 23px;
  height: fit-content;
}

.bsh-nav-list, .bsh-nav-list2 { 
  padding-left: 13px;
  color: var(--light);
  font-size: 13px;
  line-height: 1.4;
  margin-top: 7px;
}

.bsh-nav-list2 {
  padding-top: 23px;
}

.bsh-nav-item{ 
  margin: 7px 0;
  cursor: pointer;
  color: var(--light);
  list-style: none;
  font-size: 16px;
}

.bsh-nav-item:hover{
  color: #EF2143;
}

.bsh-cop{
  padding: 17px 0;
  margin-top: 28px;
  background: rgba(255,255,255,0.9); color: #222;
  text-align: center;
}

.bsh-formcol{
  display: flex;
  flex-direction: column;
  width: 40%;
}

.bsh-formbody {
  display: flex;
  flex-direction: column;
  margin-top: 13px;
  margin-top: calc(7px * calc(1 - 0));
  margin-bottom: calc(7px * 0);
  padding-left: 23px;
}

.bsh-formbody label {
  color: #1F1D36;
}

 .input-custom_rowblock{
  height: 57px;
  color: #000;
  background: #fff;
  margin-bottom:  13px;
  border: none;
  padding: 0  13px;
  font-weight: 500;
  font-size:  14px;
  color: #4B4B4B;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 28px 60px -13px inset, #EF214359 0px 17px 39px -17px inset;

}

  .textarea-custom_rowblock {
  height: 95px;
  color: #000;
  background: #fff;
  margin-bottom:  13px;
  border: none;
  padding: 0  13px;
  font-weight: 500;
  font-size:  14px;
  color: #4B4B4B;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 28px 57px -12px inset, #EF214359 0px 17px 36px -17px inset;
}

.bsh-check {
  margin: 13px 0;
}

.lead-showcase-bg {
  padding-top: 75px;
  padding-bottom: 75px;
  background-color: #00000007;
}

.lead-showcase-img {
  float: right;
  width: 50%;
  height: 444px;
  margin: 0 17px 17px 17px;
  padding: 17px;
  border-radius: 15px;
  background: linear-gradient(to bottom, var(--color) 0%, var(--dark) 100%);
}

.lead-showcase-imgpic {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.lead-showcase-infotab {
  display: flex;
  flex-direction: column-reverse;
  justify-content: space-between;
  flex-wrap: wrap;
}

.psh-infotab-item {
  padding: 13px;
  display: flex;
  flex-direction: row;
  gap: 13px;
  border-bottom: 1px solid #555;
  color: #171717;
  font-size: 14px;
  text-align: center;
  align-items: center;
}

.psh-infotab-item svg {
  width: 39px;
  height: 39px;
  fill: #171717;
}

.psh-descr {
  font-size: 16px;
  font-weight: {font_weight_bold};
  letter-spacing: 2px;
  margin: 17px;
}

.psh-txt {
  font-size: 18px;
  padding-left: 13px;
  margin-bottom: 17px;
}

.psh-orderform {
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: 13px;
  padding: 28px 36px;
  width: 80%;
  border-radius: 15px;
  box-shadow: 7px 7px 13px rgba(0, 0, 0, 1), 1px 1px 13px rgba(255, 255, 255, 0.6), inset 2px 2px 13px rgba(0, 0, 0, 1), inset -1px -1px 5px rgba(255, 255, 255, 0.6);
}

.psh-orderform .input-l25964240, .psh-orderform .textarea-l25964240 {
  min-height: 44px;
  color: var(--light);
  outline: none;
  transition: 0.35s;
  padding: 0px 7px;
  background-color: var(--color);
  border-radius: 3px;
  border: 1px solid #212121;
  box-shadow: 7px 7px 13px rgba(0,0,0,1), 1px 1px 13px rgba(255, 255, 255, 0.6);
}

.psh-orderform .input-l25964240:focus {
  transform: scale(1.05);
  box-shadow: 7px 7px 13px rgba(0, 0, 0, 1), 1px 1px 13px rgba(255, 255, 255, 0.6), inset 2px 2px 13px rgba(0, 0, 0, 1), inset -1px -1px 7px rgba(255, 255, 255, 0.6);
}

.lead-showcase-ordering {
  display: flex;
  justify-content: center;
}

.prod-discus-bg {
  padding-top:  36px;
  padding-bottom: 95px;
  background-color: #00000007;
}

.prod-discus-list {
  display: flex;
  flex-direction: column-reverse;
  gap:  36px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.prod-discus-card {
  flex: 1;
  position: relative;
  padding: 75px 31px 31px;
  border-radius: 8px 8px 8px 0px;
  border: 1px solid #EBE6DE;
  box-shadow: 0px 13px 39px 0px rgba(0, 0, 0, 0.06);
  background-color: #fff;
  margin-top: 28px;
  transition: all 0.4s ease-in-out;
}

.prod-discus-card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -39px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 39px 57px 0 0;
  border-color: #EBE6DE transparent transparent transparent;
  transition: all 0.4s ease-in-out;
}
.prod-discus-card:hover {
  background-color:#EF2143;
}
.prod-discus-card:hover::after {
  border-color: #EF2143 transparent transparent transparent;
}
.prod-discus-card:hover .prod-discus-comm {
  color: #fff;
}
.prod-discus-card:hover .prod-discus-autor {
  background-color: var(--color);
}
.prod-discus-card:hover .prod-discus-autor::after {
  border-color: transparent transparent transparent var(--color);
}

.prod-discus-card-img {
  position: absolute;
  top: -39px;
  right: 39px;
  width: 57px;
  height: 57px;
  border-radius: 50%;
  overflow: hidden;
  z-index: 1;
}
.prod-discus-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.prod-discus-autor {
  position: absolute;
  top: 23px;
  right: -13px;
  text-align: center;
  padding:  7px 28px 7px 17px;
  background-color: #EF2143;
  border-radius: 6px 0px 0px 6px;
  transition: all 400ms ease;
}
.prod-discus-autor p {
  font-size: 16px;
  color: #fff;
  line-height: 1.4;
  margin-bottom: 0;
  transition: all 400ms ease;
}

.prod-discus-autor::after {
  content: "";
  position: absolute;
  top: -23px;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 23px 0 0 13px;
  border-color: transparent transparent transparent #EF2143;
  transition: all 0.4s ease-in-out;
}
.prod-discus-comm {
  margin-top: 36px;
  transition: all 0.4s ease-in-out;
  font-size: 14px;
}

.get-in-tought-section {
  padding-top: 75px;
  display: flex;
  flex-direction: column;
  gap: 75px;
  background-color: #00000007;
}

.get-in-tought {
  display: flex;
  padding-bottom: 28px;
  flex-direction: row;
  gap: 36px;

}

.reach-us-formblock {
  width: 60%;
}

.reach-us-form-title {
  font-size: 16px;
  font-weight: 500;
  text-transform:  uppercase;
  margin: 28px;
  line-height: 1.4;
}

.reach-us-form {
  margin-top:  28px;
  display: flex;
  flex-direction: column;
  padding-bottom: 28px;
}

.reach-us-form-input {
  height: 57px;
  border-radius: 6px;
  background: white;
  margin-bottom:  13px;
  border: none;
  padding: 0  13px;
  font-weight: 500;
  font-size:  14px;
  color: #4B4B4B;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 28px 57px -13px inset, #EF214359 0px 17px 39px -17px inset;
}

.reach-us-form-check, .reach-us-form-btn {
  gap: 7px;
  margin-top: 13px;
  display: flex;
  justify-content: center;
}

.reach-us-contact {
  width: 38%;
}

.reach-us-cont-list {
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.reach-us-cont-item {
  padding-left: 13px;
  border-left: 2px solid #EF2143;
}

.reach-us-cont-item h4 {
  word-break: break-all;
  margin: 0;
  margin-bottom: 13px;
}

.reach-us-cont-item p, .reach-us-cont-item a {
  word-break: break-all; 
}

.polit-page-sect-bg {
  padding-top: 36px;
  padding-bottom: 36px;
  background-color: #00000007;
}

.polit-page-sect {
  overflow: hidden;
  word-break: break-all;
}

.pps-title {
  font-size:  27px;
  font-weight:  500;
  margin: 0;
  margin-bottom: 28px;
  text-align: center;
}

.pps-txt {
  word-break: break-all;
}

.reach-us-contact-img {
  width: 100%;
  height: 364px;
  object-fit: cover;
  display: none;
}

@media (max-width: 1200px) {
  .main-layout-land {
    max-width: 1139px;
  }

  .order-guide-list {
    width: 90%;
    top: 57px;
  }

  .prod-card-content {
    height: 100%;
  }
}

@media (max-width: 992px) {
  .main-layout-land {
    max-width: 957px;
  }

  .welcome-showcase-slogan {
    font-size: 27px;
  }

  .welcome-showcase-content {
    width: 100%;
  }

  .welcome-showcase-img {
    width: 253px;
    height: 253px;
  }

  .welcome-showcase-discont {
    width: 190px;
    height: 190px;
  }

  .welcome-showcase-discont span{
    font-size: 24px;
    line-height: 1;
  }

  .benefit-showcase-item {
    width: 40%;
  }

  .catalogue-overview-list {
    justify-content: center !important;
  }

  .order-guide-list {
    position: relative !important;
  }

  .order-guide-item {
    width: 100%;
  }

  .bottom-sheet-con{
    flex-wrap: wrap;
  }

  .bottom-sheet-navcol {
    width: 60%;
  }
}

@media(max-width: 767px)  {
  .top-header-navigation {
    flex-direction: column;
    justify-content: center;
  }
  .main-layout-land {
    max-width: 717px;
  }

  .welcome-showcase-content {
    flex-direction: column;
  }

  .welcome-showcase-title, .welcome-showcase-decor {
    width: 100%;
  }

  .welcome-showcase-content {
    margin-top: -175px;
  }

  .welcome-showcase-slogan {
    font-size:  21px;
    margin-top: 44px;
}

.benefit-showcase-item {
  width: 55%;
}

.prod-card {
  width: 100% !important;
}

.prod-card:hover {
  transform: scale(1);
}

.synergy {
  flex-direction: column !important;
}

.synergy-list {
  flex-wrap: wrap;
  justify-content: center;
}

.synergy-item {
  width: 25%;
}

.bsh-payimg {
  flex-direction: column;
  align-items: center;
  margin: auto;
}

.order-guide-btitle {
  margin-bottom: 17px;
}

.order-guide-list {
  width: 100% !important;
}

.order-guide-img {
  width: 44px;
  height: 57px;
}

.order-guide-img svg {
  width: 28px;
  height: 28px;
}

.prod-discus-list {
  flex-direction: column;
}

.lead-showcase-img {
  float: none;
  margin: 0;
  margin-bottom: 17px;
  width: 100%;
}

.catalogue-overview-title h2, .synergy-title h2, .clarity-corner-title h2, .lead-showcase-title h2, .prod-discus-title h2, .reach-us-cont-title h2 {
  font-size:  21px;
}

.get-in-tought {
  flex-direction: column;
}

.reach-us-formblock, .reach-us-contact {
   width: 100%;
}

.clarity-corner-form {
  flex-direction: column;
}

.clarity-corner, .bsh-formcol {
  width: 100%;
}
.order-guide-list {
  flex-direction: column;
  text-align: center;
}
}

@media(max-width: 576px) {
  .lead-showcase-img {
    height: auto;
  }

 .main-layout-land {
    max-width: 539px;
  }

  .welcome-showcase-slogan {
    font-size: 16px;
  }

  .welcome-showcase-section {
    padding-bottom: 28px;
  }

  .ui-link, .ui-dropdown-btn {
    font-size: 13px;
  }

  .welcome-showcase-title h2 {
    font-size: 16px;
  }

  .welcome-showcase-content {
    padding: 17px;
  }

  .benefit-showcase-item {
    width: 100%;
} 

.benefit-showcase-list {
  min-height: 328px;
}

.synergy-item {
  width: 40%;
}

.bsh-nav-item {
  font-size: 13px;
}

.psh-infotab-item {
  width: 100%;
}

.bottom-sheet-navcol, .bsh-logo {
  width: 100%;
}

.dots label {
  width: 17px;
  height: 17px;
}

.ui-dropdown-list {
  max-width: 175px;
}

.ui-dropdown-link a {
  padding: 3px;
  font-size: 13px;
}


.top-header-navigation {
  flex-direction: column;
  gap: 17px;
}
}
@media(max-width: 420px) {

.ui-link-bar {
  flex-direction: column;
}
}
.bsh-nav-title {
  color: #EBE6DE !important;
}

#market-{rclass_basket}-main-basket-1 svg {
  color: #fff !important;
  fill: #fff !important;
}

#market-{rclass_basket}-main-basket-1 svg {
color: #fff !important;
fill: #fff !important;
}
.cart-icon-2 svg {
fill: #fff !important;
}