/**
 * BoxBuilder Architecture
 *
 * Copyright (c) Niup Technologies
 * 
 * SCSS of application herotitle

 **/
.hero-title {
  background-color: var(--c-scale-1_bg);
  padding: clamp(20px, 4vw, 45px) clamp(40px, 6.5vw, 125px);
}
.hero-title.full-width {
  padding: 0;
}
.hero-title.full-width .hero-title__wrapper {
  border-radius: 0;
}
.hero-title__wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border-radius: 20px;
  min-height: 679px;
  overflow: hidden;
}
.hero-title__img, .hero-title__noimg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-color: var(--c-scale-5_bg);
}
.hero-title__img.desktop {
  display: flex;
}
.hero-title__img.tablet, .hero-title__img.mobile {
  display: none;
}
.hero-title__text {
  z-index: 1;
  display: flex;
  position: relative;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 40px 20px;
}
.hero-title__text.show-next {
  min-height: 769px;
  padding: 40px 20px 220px;
}
.hero-title__title {
  max-width: 568px;
  width: 100%;
  text-align: center;
  word-break: break-word;
  color: var(--c-scale-1_txt);
  font-size: var(--font_size_1);
}
.hero-title__scrollto {
  max-width: 568px;
  width: 100%;
  margin-top: 40px;
  bottom: 90px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  transition: ease-in-out transform 0.2s;
  cursor: pointer;
}
.hero-title__scrollto:hover .hero-title__label {
  color: var(--primary_txt);
}
.hero-title__scrollto:hover .svg {
  transform: translateY(10px);
}
.hero-title__scrollto:hover .svg path {
  stroke: var(--primary_fill);
}
.hero-title__label {
  font-size: var(--font_size_8);
  font-weight: var(--font_weight_semibold);
  color: var(--c-scale-1_txt);
  text-transform: uppercase;
  transition: ease-in-out transform 0.2s;
}
.hero-title .arrow-down {
  transition: ease-in-out all 0.2s;
}
.hero-title .arrow-down path {
  stroke: var(--c-scale-1_fill);
}

/* @container **/
.c-s-max-width-768 .hero-title__img.tablet {
  display: flex;
}
.c-s-max-width-768 .hero-title__img.desktop, .c-s-max-width-768 .hero-title__img.mobile {
  display: none;
}

/* container@ **/
/* @container **/
.c-s-max-width-480 .hero-title__img.mobile {
  display: flex;
}
.c-s-max-width-480 .hero-title__img.desktop, .c-s-max-width-480 .hero-title__img.tablet {
  display: none;
}

/* container@ **/