@keyframes shine {
  from {
    opacity: 0;
    left: 0%;
  }
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    left: 100%;
  }
}
@media only screen and (max-width: 991px) {
  html:has(.home-banner), body:has(.home-banner), main:has(.home-banner) {
    height: 100%;
  }
}
@media only screen and (max-width: 991px) {
  html:has(.home-banner) .home-banner, body:has(.home-banner) .home-banner, main:has(.home-banner) .home-banner {
    height: 100% !important;
  }
}

.home-video-loader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 6;
  width: 100%;
  height: 100%;
  background: url(../../images/home/loader-end-poster.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
@media only screen and (max-width: 991px) {
  .home-video-loader {
    background: url(../../images/home/loader-end-poster-tab.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
}
@media only screen and (max-width: 650px) {
  .home-video-loader {
    background: url(../../images/home/loader-end-poster-mobile.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
}
.home-video-loader video {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: relative;
  z-index: 1;
  opacity: 1;
  transition: 0s ease;
}
.home-video-loader video.active {
  opacity: 0;
}
.home-video-loader .loader-video-thumb {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: 0s ease;
}
.home-video-loader .loader-video-thumb img {
  position: absolute;
  top: 50.3%;
  left: 47.68%;
  translate: -50% -50%;
  z-index: 2;
  transition: all 2s ease, scale 1s ease;
  width: 44.6%;
}
@media only screen and (max-width: 991px) {
  .home-video-loader .loader-video-thumb img {
    left: 14.2%;
    right: 0;
    top: 44.1%;
    width: 64%;
    translate: 0 0;
  }
}
@media only screen and (max-width: 650px) {
  .home-video-loader .loader-video-thumb img {
    left: 7.9%;
    top: 44%;
    width: 81.9%;
  }
}
.home-video-loader .loader-video-thumb.active {
  opacity: 1;
}
.home-video-loader .loader-video-thumb.active img {
  top: var(--headerpadding);
  left: var(--containerfluid);
  translate: 0 0;
  width: 162px;
}
@media only screen and (max-width: 649px) {
  .home-video-loader .loader-video-thumb.active img {
    width: 142px;
  }
}
.home-video-loader .skip-loader-btn {
  position: absolute;
  right: 30px;
  bottom: 30px;
  z-index: 2;
}

.home-banner {
  --beforesize: 33%;
  height: 100vh;
  flex-wrap: wrap;
  background: var(--primary-c);
  flex-direction: column;
  display: flex;
}
@media only screen and (max-width: 520px) {
  .home-banner {
    --beforesize: 60%;
  }
}
.home-banner .bg {
  flex: calc(100% - var(--beforesize));
  max-height: calc(100% - var(--beforesize));
  height: 100%;
  line-height: 0;
  position: relative;
}
.home-banner .bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  background: linear-gradient(180deg, #ECF4FC 0%, rgba(236, 244, 252, 0) 100%);
}
.home-banner .bg::before {
  z-index: 1;
}
.home-banner .bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0.4;
  -o-object-position: top;
     object-position: top;
  mix-blend-mode: luminosity;
}
.home-banner .banner-wrapper {
  flex: 1;
  position: relative;
}
.home-banner .banner-wrapper .wrap-content {
  position: absolute;
  left: 0;
  right: 0;
  top: 70%;
  z-index: 2;
  padding: 0 3rem;
  width: -moz-fit-content;
  width: fit-content;
}
@media only screen and (max-width: 1024px) {
  .home-banner .banner-wrapper .wrap-content {
    padding: 0 1rem;
  }
}
@media only screen and (max-width: 520px) {
  .home-banner .banner-wrapper .wrap-content {
    padding: 0 5px;
    top: 45%;
  }
}
.home-banner .banner-wrapper .wrap-content .sub-banner-title {
  font-size: 60px;
  font-weight: 700;
  line-height: 1;
  color: var(--primary-a);
  margin-bottom: -2rem;
  padding: 0 2rem;
}
@media only screen and (max-width: 1366px) {
  .home-banner .banner-wrapper .wrap-content .sub-banner-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .home-banner .banner-wrapper .wrap-content .sub-banner-title {
    font-size: 32px;
    margin-bottom: -10px;
  }
}
@media only screen and (max-width: 767px) {
  .home-banner .banner-wrapper .wrap-content .sub-banner-title {
    padding: 0 1rem;
    font-size: 28px;
  }
}
@media only screen and (max-width: 520px) {
  .home-banner .banner-wrapper .wrap-content .sub-banner-title {
    font-size: 22px;
    margin-bottom: 8px;
  }
}
.home-banner .banner-wrapper .wrap-content .sub-banner-title span {
  display: inline-block;
  position: relative;
  line-height: 0.95;
}
.home-banner .banner-wrapper .wrap-content .sub-banner-title span::before, .home-banner .banner-wrapper .wrap-content .sub-banner-title span::after {
  content: "";
  height: 0.21em;
  width: 0.21em;
  border-radius: 50%;
  background: var(--secondary);
  position: absolute;
  top: 0;
}
.home-banner .banner-wrapper .wrap-content .sub-banner-title span::before {
  left: 14.4%;
}
.home-banner .banner-wrapper .wrap-content .sub-banner-title span::after {
  right: 25%;
}
.home-banner .banner-wrapper .wrap-content .headline {
  position: relative;
  font-size: 4rem;
  line-height: 2;
  text-transform: uppercase;
  display: inline-block;
  overflow: hidden;
  font-family: "Playfair Display", serif;
  font-size: clamp(24px, 13.4vw, 50rem);
  line-height: 1.3;
  --circlesize: .5em;
  --circle-y: 55%;
  --circle-xleft: 8%;
  --circle-xright: 92%;
  font-weight: 600;
}
@media only screen and (max-width: 675px) {
  .home-banner .banner-wrapper .wrap-content .headline {
    font-size: 13.6vw;
  }
}
.home-banner .banner-wrapper .wrap-content .headline .text-blue, .home-banner .banner-wrapper .wrap-content .headline .text-white {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  padding: 0 2rem;
}
@media only screen and (max-width: 767px) {
  .home-banner .banner-wrapper .wrap-content .headline .text-blue, .home-banner .banner-wrapper .wrap-content .headline .text-white {
    padding: 0 1rem;
  }
}
.home-banner .banner-wrapper .wrap-content .headline .text-blue {
  color: var(--secondary);
}
.home-banner .banner-wrapper .wrap-content .headline .text-white {
  color: white;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--secondary);
  -webkit-clip-path: circle(calc(var(--circlesize) / 4) at 50% var(--circle-y, 50%));
          clip-path: circle(calc(var(--circlesize) / 4) at 50% var(--circle-y, 50%));
}
.home-banner .banner-wrapper .wrap-content .btm-desc {
  margin-left: auto;
  margin-top: 40px;
  text-align: right;
  padding: 0 2.9rem;
}
@media only screen and (max-width: 767px) {
  .home-banner .banner-wrapper .wrap-content .btm-desc {
    padding: 0 1rem;
  }
}
@media only screen and (max-width: 675px) {
  .home-banner .banner-wrapper .wrap-content .btm-desc {
    max-width: 350px;
    margin-top: 32px;
    padding: 0;
    margin-right: 21px;
  }
}
@media only screen and (max-width: 520px) {
  .home-banner .banner-wrapper .wrap-content .btm-desc {
    max-width: 372px;
  }
}
.home-banner .banner-wrapper .wrap-content .btm-desc p {
  color: rgba(0, 0, 0, 0.5803921569);
  font-weight: 500;
  font-size: 18px;
}
@media only screen and (max-width: 991px) {
  .home-banner .banner-wrapper .wrap-content .btm-desc p {
    font-size: 16px;
    line-height: 1.3;
  }
}
@media only screen and (max-width: 345px) {
  .home-banner .banner-wrapper .wrap-content .btm-desc p {
    font-size: 15px;
  }
}
@media only screen and (max-width: 320px) {
  .home-banner .banner-wrapper .wrap-content .btm-desc p {
    font-size: 14px;
  }
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div {
  margin-top: 10px;
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn {
  background: none;
  --padding: 0;
  font-weight: 600;
  color: var(--primary-a);
  overflow: initial;
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn::before, .home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn::after {
  display: none;
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn .ico {
  background: var(--primary-a);
  color: var(--white);
  line-height: 0;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  transition: 0.5s ease;
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn .ico svg {
  width: 6px;
  height: auto;
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn:hover {
  color: var(--secondary);
}
.home-banner .banner-wrapper .wrap-content .btm-desc .btn-div .btn:hover .ico {
  background: var(--secondary);
  transform: translateX(7px);
}
.home-banner.active .banner-wrapper .wrap-content .headline .text-white {
  animation: zoomOut 1s linear forwards, moveLeftRight 12s linear 1.5s, zoomIn 1s linear 13.8s forwards;
}
@keyframes zoomOut {
  0% {
    -webkit-clip-path: circle(calc(var(--circlesize) / 4) at 50% var(--circle-y, 50%));
            clip-path: circle(calc(var(--circlesize) / 4) at 50% var(--circle-y, 50%));
  }
  100% {
    -webkit-clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
  }
}
@keyframes moveLeftRight {
  0% {
    -webkit-clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
  }
  25% {
    -webkit-clip-path: circle(var(--circlesize) at var(--circle-xleft, 8%) var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at var(--circle-xleft, 8%) var(--circle-y, 50%));
  }
  50% {
    -webkit-clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
  }
  75% {
    -webkit-clip-path: circle(var(--circlesize) at var(--circle-xright, 92%) var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at var(--circle-xright, 92%) var(--circle-y, 50%));
  }
  100% {
    -webkit-clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
  }
}
@keyframes zoomIn {
  0% {
    -webkit-clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
            clip-path: circle(var(--circlesize) at 50% var(--circle-y, 50%));
  }
  100% {
    -webkit-clip-path: circle(0% at 50% var(--circle-y, 50%));
            clip-path: circle(0% at 50% var(--circle-y, 50%));
  }
}/*# sourceMappingURL=home.css.map */