/* header{display: none;} */
/* .page-template-page-about #content.site-content { height: 100vh; overflow: hidden; position: relative; } */
.page-template-page-about .site-content{position: relative; z-index: 9;}
.page-template-page-about .ast-container{max-width: 100% !important; padding: 0 !important;display: block;}

.section-container {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

.section-container .swiper:not(.mySwiper-feedback) {
    width: 100%;
    height: 100vh;
}
.section-container .swiper:not(.swiper-3, .swiper-4, .mySwiper-feedback) .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-container section {
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    backface-visibility: hidden;
    will-change: transform;
}

/* SECTION 1 */
#section-1 { background: #2D2555;}
#section-1 video{width: 100%; height: 100%; object-fit: cover; opacity: 0.4;}
.section1-box{width: 100%;height: 100%;padding:113px 80px;display: flex ; flex-direction: column; justify-content: center;gap:40px;z-index: 3;}
.section1-title{color:#fff;font-size: 60px;font-weight: 400;white-space: pre-line;}
.section1-info{display: flex;flex-direction: column;gap:50px;width: 60%;}
.section1-describe{color: #fff;font-size: 18px;}
.section1-buttons{display: flex;gap:20px;}
.about-detail-banner{position: absolute;top:0;left: 0;width: 100%;height: 100%;}
.about-detail-banner:after{content:'';position: absolute;top:0;left: 0;width: 100%;height: 100%;background: linear-gradient(45deg, #0D061F, transparent);}

/* SECTION 2 */
#section-2 { background: #1B0F29;}
#section-2:after{ content:''; position: absolute; width: 0%; left:0; top:55%; border-top:1px solid rgba(255,255,255,0.1); transition: all ease 1.2s; -webkit-transition: all ease 1.2s; -moz-transition: all ease 1.2s; -ms-transition: all ease 1.2s; -o-transition: all ease 1.2s; opacity: 0; }
#section-2.page-active:after{width: 100%;opacity: 1;}

#section-2:before{ content:''; position: absolute; background: url('../images/light.png') no-repeat center right; background-size: cover; width: 81%; height: 100%; left: 0; top: 5%; transform-origin: left center; transform: scaleX(0);opacity: 0; transition: all ease 2s; -webkit-transition: all ease 2s; -moz-transition: all ease 2s; -ms-transition: all ease 2s; -o-transition: all ease 2s; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); }
#section-2.page-active:before{ opacity: 1; transform:scaleX(1) ; -webkit-transform:scaleX(1) ; -moz-transform:scaleX(1) ; -ms-transform:scaleX(1) ; -o-transform:scaleX(1) ; }

.section2-box{ max-width: 1440px; margin: auto; display: flex; width: 100%; justify-content: end; position: relative; z-index: 4; transition: all ease 2s; -webkit-transition: all ease 2s; -moz-transition: all ease 2s; -ms-transition: all ease 2s; -o-transition: all ease 2s; opacity: 0; transform:translateX(150px) ; -webkit-transform:translateX(150px) ; -moz-transform:translateX(150px) ; -ms-transform:translateX(150px) ; -o-transform:translateX(150px) ; }
#section-2.page-active .section2-box{ opacity: 1; transform:translateX(0) ; -webkit-transform:translateX(0) ; -moz-transform:translateX(0) ; -ms-transform:translateX(0) ; -o-transform:translateX(0) ; }

.section2-info{display: flex;flex-direction: column;gap:200px;width: 52%;}
.section2-info-top{color: #fff;font-size: 40px;white-space: pre-line;}
.section2-info-bottom{color: #fff;font-size: 20px;font-weight: 300;white-space: pre-line;padding-right:0px;}
.section2-info-top p:last-child, .section2-info-bottom p:last-child{margin-bottom: 0;}


/* SECTION 3 */
#section-3{background: radial-gradient(#4F3481, #301153);display: block;overflow: hidden;}
.section3-ren-l{ position: absolute; left: 0; top: 0; height: 100%; transition: all ease 0.8s; -webkit-transition: all ease 0.8s; -moz-transition: all ease 0.8s; -ms-transition: all ease 0.8s; -o-transition: all ease 0.8s; transform-origin: left center; transform:scaleX(0.3) ; -webkit-transform:scaleX(0.3) ; -moz-transform:scaleX(0.3) ; -ms-transform:scaleX(0.3) ; -o-transform:scaleX(0.3) ; }
.section3-ren-r{ position: absolute; right: 0; top: 0; height: 100%; transition: all ease 0.8s; transform-origin: right center; transform:scaleX(0.3) ; -webkit-transition: all ease 0.8s; -moz-transition: all ease 0.8s; -ms-transition: all ease 0.8s; -o-transition: all ease 0.8s; -webkit-transform:scaleX(0.3) ; -moz-transform:scaleX(0.3) ; -ms-transform:scaleX(0.3) ; -o-transform:scaleX(0.3) ; }
.section3-ren-l img, .section3-ren-r img{width: 100%; height: 100%;}

#section-3.page-active .section3-ren-l{ transform:scaleX(1) ; -webkit-transform:scaleX(1) ; -moz-transform:scaleX(1) ; -ms-transform:scaleX(1) ; -o-transform:scaleX(1) ; }
#section-3.page-active .section3-ren-r{ transform:scaleX(1) ; -webkit-transform:scaleX(1) ; -moz-transform:scaleX(1) ; -ms-transform:scaleX(1) ; -o-transform:scaleX(1) ; }

.section3-box{max-width: 860px;margin: auto;display: flex;flex-direction: column;gap:50px;}
.section3-title{text-align: center;color: #fff;font-size: 30px;font-weight: 300;text-transform: capitalize;margin: 0;}
.section3-info{color:#fff;font-size: 40px;text-align: center;line-height: 120%;white-space: pre-line;}
.section3-info p:last-child{margin: 0;}
.swiper-1{ transition: all ease 0.8s; -webkit-transition: all ease 0.8s; -moz-transition: all ease 0.8s; -ms-transition: all ease 0.8s; -o-transition: all ease 0.8s; opacity: 0; transition-delay: 0.3s;}
#section-3.page-active .swiper-1{opacity: 1;}
.swiper-1 .swiper-slide{ transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; opacity: 0 !important;background: transparent !important;}
.swiper-1 .swiper-slide.swiper-slide-active{opacity: 1 !important;}

/* SECTION 4 */
#section-4{ display: block; overflow: hidden; background: #fff;}
.section-4-background-wrapper { position: relative; width: 100%; height: 100%; overflow: hidden; }
#section-4 .background-layer { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-position: center; transition: opacity 0.8s ease; z-index: 0; }
#section-4 .background-current { z-index: 1; opacity: 1; } 
#section-4 .background-next { z-index: 2; opacity: 0; pointer-events: none; }

#section4-background{transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; background-size: cover;background-repeat: no-repeat;position: absolute;top:0;left:0;width: 100%;height: 100%;}

.section4-container{max-width: 1059px;margin: auto;display: flex;gap:160px;position: relative;z-index: 4;}
.section4-left{width: 182px;}
.section4-right{width: calc(100% - 182px - 160px);margin-top: 22%;}

.section4-r-box{display: flex;flex-direction: column;gap:20px;}
.section4-r-number{font-size: 32px;font-weight: 200;}
.section4-r-box span{ transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; }
.section4-r-box h3{margin: 0;font-size: 50px;font-weight: 500;transition: all ease 0.5s; }
.section4-r-box > div{ font-size: 20px; font-weight: 500; opacity: 0.8; color: #000; transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; }

.swiper-3 .swiper-slide{ transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; opacity: 0 !important; }
.swiper-3 .swiper-slide.swiper-slide-active{opacity: 1 !important;}

.swiper-2 .swiper-slide .section4-small-box{ transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; display: flex ; height: 100%; align-items: center; position: relative; padding-top: 0;  }
.swiper-2 .swiper-slide .section4-small-box svg{opacity: 0.2 !important;transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; transform:scale(0.7) ; -webkit-transform:scale(0.7) ; -moz-transform:scale(0.7) ; -ms-transform:scale(0.7) ; -o-transform:scale(0.7) ; }

.swiper-2 .swiper-slide.swiper-slide-active .section4-small-box, .swiper-2 .swiper-slide.swiper-slide-prev .section4-small-box{ padding-top: 160%;}
.swiper-2 .swiper-slide.swiper-slide-active .section4-small-box svg{opacity:1 !important;transform:scale(1) ; -webkit-transform:scale(1) ; -moz-transform:scale(1) ; -ms-transform:scale(1) ; -o-transform:scale(1) ; }
.swiper-2 .swiper-slide.swiper-slide-prev .section4-small-box{
    opacity: 0 !important;
}
.swiper-2 .swiper-slide .section4-small-box .section4-r-line{ content:''; height: 111px; width: 1px; position: absolute; left: 50%; bottom: 4%; opacity: 0.2; transition:all ease 0.5s ; -webkit-transition:all ease 0.5s ; -moz-transition:all ease 0.5s ; -ms-transition:all ease 0.5s ; -o-transition:all ease 0.5s ; }
.swiper-2 .swiper-slide.swiper-slide-active .section4-small-box .section4-r-line{bottom:-4%;}
.swiper-2 .swiper-slide.swiper-slide-prev .section4-small-box .section4-r-line{opacity: 0;}
.swiper-2 .swiper-slide:nth-last-child(2) .section4-small-box .section4-r-line{display: none;}
.swiper-2 .swiper-slide.swiper-slide-active .section4-small-box span{display: flex;}
.section4-small-box svg path{ transition: all ease 0.5s; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; -ms-transition: all ease 0.5s; -o-transition: all ease 0.5s; }
.section4-small-box.section4-small-lastBox .section4-r-line{display:none;}

/* SECTION 5 */
#section-5 {background: linear-gradient(#281939, #301153);}
.section-5-container{max-width: 1440px;margin: auto;display: flex;padding-left:86px;}
.section-5-left{text-transform: uppercase;color:#fff;font-size: 40px;font-weight: 300;width: 167px;padding-top:120px;}
.section-5-right{width: calc(100% - 316px - 167px);margin-left: 316px;padding-right: 288px;margin-top:-100px;}
.section-5-box-number{color: #fff;font-size: 100px; font-weight: 300;line-height: 120%;margin-bottom: 13px;}
.section-5-box-name{color:#fff;font-size: 32px;font-weight: 500;margin-bottom: 20px;}
.section-5-box-descript{color:#fff;font-size: 16px;font-weight: 500;opacity: 0.8;display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;}

#section-5 .swiper-4 .swiper-slide{ transition:all ease 0.5s ; -webkit-transition:all ease 0.5s ; -moz-transition:all ease 0.5s ; -ms-transition:all ease 0.5s ; -o-transition:all ease 0.5s ; opacity: 0.2 !important;}
#section-5 .swiper-4 .swiper-slide.swiper-slide-active{opacity: 1 !important;}

#section-5:before{
    content:'';
    position: absolute;
    background: url('../images/light2.png') no-repeat center top;
    background-size: cover;
    width: 30%;
    height: 90%;
    left: 12%;
    top: 0;
    transform-origin: top center;
    transform:1.5 scaleX(0);
    opacity: 0;
    transition: all ease 1s;
    -webkit-transition: all ease 1s;
    -moz-transition: all ease 1s;
    -ms-transition: all ease 1s;
    -o-transition: all ease 1s;
    -webkit-transform:1.5 scaleX(0);
    -moz-transform:1.5 scaleX(0);
    -ms-transform:1.5 scaleX(0);
    -o-transform:1.5 scaleX(0);
}
#section-5.page-active:before{ opacity: 1; transform:scaleY(1) ; -webkit-transform:scaleY(1) ; -moz-transform:scaleY(1) ; -ms-transform:scaleY(1) ; -o-transform:scaleY(1) ; }


/* SECTION 6 */
#section-6 { background: radial-gradient(#52307A,#1B0F29); padding-bottom: 107px;}
#section-6:after{content:'';position: absolute;width: 100%;height: 100%;bottom:0;left:0;background: url('../images/circle_line.png') no-repeat center bottom;}
.section-6-title{text-align: center;color:#fff;font-size: 50px;margin-top:122px;font-weight: 400;}
.section-6-title span{color:#7E6ED4;}
.section-6-splide{position: relative;padding-top:116px;}
.section-6-box{ background: linear-gradient(to bottom, rgb(48, 24, 75, 0.5), #48238E, #180C33); border-radius: 16px; -webkit-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; overflow: hidden;display: flex;justify-content: center;align-items: end;position: relative;height: 437px;}
.section-6-boxInfo{position: absolute;width: 100%;bottom:0;left:0;padding:34px 28px;display: flex;gap:4px;flex-direction: column;}
.section-6-boxInfo h3{color:#fff;font-size: 24px;font-weight: 500;position: relative;z-index: 5;}
.section-6-boxInfo span{color:#fff;display: block;font-size: 16px;position: relative;z-index: 5;}
.section-6-boxInfo:after{content:'';position: absolute;bottom:0;left:0;width: 100%;height: calc(100% + 20px);background: linear-gradient(to top, #301C58, transparent);opacity: 0.8;}
.section-6-box img{width: 100%;display: block; height: 100%; object-fit: cover;}

#splide-marquee-2 .splide__slide:nth-child(odd){margin-top:25px;}
#splide-marquee-2 .splide__slide.is-clone {
  opacity: 0.5;
  transition: opacity 0.3s ease;
}

.section-6-boxSmall{ position: absolute; top:0; left:0; padding:48px 28px; background: #7655B3; display: flex; flex-direction: column; justify-content: space-between; gap:20px; width: 100%; height: 100%; z-index: 10; transition: all ease 0.7s; -webkit-transition: all ease 0.7s; -moz-transition: all ease 0.7s; -ms-transition: all ease 0.7s; -o-transition: all ease 0.7s; opacity: 0; }
.section-6-infoPrivate{display: flex;flex-direction: column;gap:4px;padding-bottom: 20px;position: relative;}
.section-6-infoPrivate p{color:#fff;font-size: 24px;font-weight: 500;margin: 0;}
.section-6-infoPrivate span{color:#fff;font-size: 16px;}
.section-6-infoPrivate:after{content:'';position: absolute;left:0;bottom:0;width: 60%;height: 1px;background: #fff;opacity: 0.2;}
.section-6-infoDescribe{color:#fff;}
.section-6-infoDescribe span{display: block;font-size: 24px;font-style:italic;}
.section-6-infoDescribe div{font-size: 15px;opacity: 0.8;white-space: pre-line;display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden;}

.section-6-box:hover .section-6-boxSmall{opacity: 1;}
.section-6-container{position: relative;z-index: 5;max-width: 1440px;margin: auto;width: 100%;}
#section-6 .simply-scroll-clip{width: 100% !important;height: auto !important;}
#section-6 .simply-scroll{width: 100% !important;height: auto !important;}
#section-6 .simply-scroll .simply-scroll-list li{height: auto;margin-right: 20px;}
#section-6 .simply-scroll .simply-scroll-list li:nth-child(odd){margin-top:25px;}

/* .has-transition{transition:all ease 0.5s !important;} */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 40px, 0);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

.has-transition.animated {
    animation-delay: 0.2s;
    animation-duration: 1.5s;
    animation-fill-mode: both;
}

.has-transition.fadeInUp {
    animation-name: fadeInUp;
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.has-transition.animated {
  animation-duration: 1.5s;
  animation-fill-mode: both;
}

.has-transition.fadeInRight {
  animation-name: fadeInRight;
}


/* SECTION 7 */
#section-7{background: #1B0F29;}
.feedback_main{}
.feedback_container{max-width: 1440px;margin: auto;padding:63px 40px;height:100%;}


/* SECTION 8 */
.feedback_width{max-width: 1340px;margin: auto;}
.feedback-title{display: flex;justify-content: center;align-items: center;margin-bottom: 28px;margin-top:55px;color:#2D2555;}
.feedback-title *{font-weight: 500;font-size: 32px;}
.feedback-title p{margin: 0;}
.feedback-title span{color:#A172E6;}

.normal-scroll {
    position: relative;
    width: 100%;
    background: #ecf0f1;
    color: #2c3e50;
    padding: 20px;
    box-sizing: border-box;
    /* min-height: 100vh; */
}


.normal-scroll-mode .section-container section {
    position: relative !important;
    height: auto !important;
}
footer, #feedback{ transition:all ease 0.5s ; -webkit-transition:all ease 0.5s ; -moz-transition:all ease 0.5s ; -ms-transition:all ease 0.5s ; -o-transition:all ease 0.5s ; z-index: 9 !important;transition: none !important;}


/* Ẩn scrollbar nhưng vẫn scroll được */
body.page-template-page-about::-webkit-scrollbar, html .page-template-page-about::-webkit-scrollbar {
    width: 0px;
    height: 0px;
    scrollbar-width: none;
}
body.page-template-page-about {
    scrollbar-width: none; /* Firefox */
}