#CategoriesCat { padding: 15px 0 18px }
#CategoriesCat .CategoriesCat__Wrapper { display: flex; flex-wrap: wrap; gap: 8px; background: #fff; border: 1px solid #d2d2d2; border-radius: 9px; padding: 27px 12px }
.header-nav.header_nav_mobile { display: none }
.CategoriesCat__Item { display: flex; flex-direction: column; align-items: center; text-align: center; width: calc(100% / 8 - 8px); padding: 10px 6px; border-radius: 8px; border: 1px solid transparent; transition: border-color .25s ease, background .25s ease; text-decoration: none; color: #000 }
.CategoriesCat__Item:hover { border-color: #40b604; color: #000 }
.CategoriesCat__Thumb { display: flex; align-items: center; justify-content: center; width: 70px; height: 70px; margin-bottom: 8px; overflow: hidden; border-radius: 6px }
.CategoriesCat__Thumb img { width: 70px; height: 70px; object-fit: contain; border-radius: 6px }
.CategoriesCat__Name { font-size: 13px; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden }
.banner-top { padding-bottom: 15px !important; background-color: #fff }
.dropdown-center { z-index: 10 }
.banner-top .logo { max-width: 166px; max-height: 46px }
div#header { position: relative; min-height: 47px; font-size: 16px; font-weight: 600; background: #fff }
.header-top { color: #fff; background-color: var(--color-main) }
.header-top marquee { padding-top: 9px; margin-right: 20px }
.header-top ul { margin: 0; padding: 0; display: flex; align-items: center; list-style: none; gap: 10px }
.header-top ul li.line { width: 0; height: 50px; border-left: .5px solid rgba(0, 0, 0, .3); border-right: .5px solid rgba(255, 255, 255, .3) }
.header-top ul li a { display: block; font-family: Oswald; font-weight: 300; font-size: 15px }
.header-top ul li a:hover { color: #000 }
.header-nav { padding-bottom: 7px }
.header-nav .cart { position: relative }
.header-nav .cart b { position: absolute; top: 0; right: -3px; min-width: 18px; height: 18px; line-height: 18px; font-size: 12px; font-weight: 600; color: #fff; background-color: #ff0004; border-radius: 50%; text-align: center }
.header-nav.fixed { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; background: #fff; padding: 5px 0 !important }
.header-nav.fixed .cart { display: flex !important }
#Header { position: relative; background: #FFF; box-shadow: 0 6px 13.1px 0 rgba(181, 181, 181, 0.25); }
#Header.fixed { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; background: #fff }
#Header.fixed .fixed-hide { display: none !important }
#Header.fixed .menu { margin-top: 0 }
.header-bottom .logo { position: relative; display: block }
.header-bottom .logo img { position: relative; z-index: 10 }
.header-bottom .btn-main { font-size: 16px; background: var(--color-main); font-weight: 600; text-align: center; margin: auto; padding: 0; line-height: 48px; text-transform: uppercase }
.header-bottom .btn-main:hover { background: var(--color-main) }
.header-bottom .header-ul { position: relative; list-style: none; padding: 0; margin: 0; z-index: 21 }
.header-bottom .header-ul .line { width: 1px; height: 20px; margin: 0 5px; background-color: #cfcfcf }
.header-bottom .header-ul a { display: block; color: var(--color-main); text-transform: math-auto; line-height: 47px; font-size: 17px; font-weight: 500; background-repeat: no-repeat; background-size: 24px 23px; background-position: 0 center }
.header-bottom .header-ul a i { font-size: 14px }
.header-bottom .header-ul .btn-main { padding: 6px 10px }
.header-bottom .header-ul a.active, .header-bottom .header-ul a:hover { color: var(--color-red) }
.header-bottom .header-ul .lang a { display: flex; cursor: pointer; border: 1px solid #fff }
.header-bottom .header-ul .lang a img { width: 34px }
.header-bottom .header-ul .has-child { position: relative }
.header-bottom .header-ul .submenu, .header-bottom .header-ul>li>ul { position: absolute; background-color: #fafafa; border-radius: .25rem; opacity: 0; visibility: hidden }
.header-bottom .header-ul ul { padding: 0; margin: 0; list-style: none; transition: .3s }
.header-bottom .header-ul ul li a { font-size: 14px; color: #757575; border-bottom: 0 solid #ececec; padding: 7px 10px; text-transform: capitalize; line-height: 25px }
.header-bottom .header-ul>li>ul { min-width: 250px; top: 100%; -webkit-box-shadow: 1px 1px 15px rgba(0, 0, 0, .15); box-shadow: 1px 1px 15px rgba(0, 0, 0, .15); -webkit-transform: perspective(600px) rotateX(-90deg); transform: perspective(600px) rotateX(-90deg); -webkit-transform-origin: 0 0 0; transform-origin: 0 0 0; z-index: 1 }
.header-bottom .header-ul li:hover>ul { -webkit-transform: perspective(600px) rotateX(0); transform: perspective(600px) rotateX(0); transform-origin: 0 0 0; -webkit-transform-origin: 0 0 0; opacity: 1; visibility: visible }
.header-bottom .header-ul .submenu { display: flex; flex-wrap: wrap; list-style: none; min-width: 900px; max-height: 500px; overflow: auto; top: 104%; padding: 10px 5px; -webkit-box-shadow: 1px 1px 15px rgba(0, 0, 0, .15); box-shadow: 1px 1px 15px rgba(0, 0, 0, .15); -webkit-transform: perspective(600px) rotateX(-90deg) translateX(-40%); transform: perspective(600px) rotateX(-90deg) translateX(-40%); -webkit-transform-origin: 0 0 0; transform-origin: 0 0 0; z-index: 5 }
.header-bottom .header-ul .has-child:hover>.submenu { -webkit-transform: perspective(600px) rotateX(0) translateX(-40%); transform: perspective(600px) rotateX(0) translateX(-40%); transform-origin: 0 0 0; -webkit-transform-origin: 0 0 0; opacity: 1; visibility: visible }
.header-bottom .header-ul .submenu ul { padding: 0; list-style: none }
.header-bottom .header-ul .has-child ul.submenu>li { width: 16.6666666667% }
.header-bottom .header-ul .has-child>ul.submenu>li { padding: 0 5px; margin-bottom: 5px }
.header-bottom .header-ul .has-child ul.submenu .list { padding: 7px 0; font-weight: 700; color: var(--color-main) }
.header-bottom .header-ul .has-child ul.submenu .cat { font-size: 13px; padding: 0 }
.header-bottom .header-ul .has-child ul.submenu>li a { display: flex; align-items: center; padding: 0 }
.header-bottom .header-ul .has-child ul.submenu>li a:hover { color: var(--color-submain) }
.header-bottom .header-ul .has-child ul.submenu>li>a { margin: 0 auto; background: 0 0; border-radius: 0 }
.header-bottom .header-ul .has-child ul.submenu>li p { margin-bottom: 0 }
.effect-text { animation: 1s ease-in-out infinite effectText; transition: color .3s ease-in-out }
@keyframes effectText {
    0% { color: var(--color-main) }
    100% { color: var(--color-submain) }
}
.header-bottom .cart, .header-bottom .hotline { font-size: 14px; font-weight: 600; line-height: 1.2 }
.header-bottom .cart svg, .header-bottom .hotline svg { fill: var(--color-submain) }
.header-bottom .cart a { color: var(--color-submain) }
.hotline a span.header__hotline-number{ animation: 1s ease-in-out infinite blinkColor; transition: color .3s ease-in-out }
@keyframes blinkColor {
    0%, 100% { color: var(--color-main); border-color: var(--color-main) }
    /* [SPEC OVERRIDE - Việt Anh, 26/10/2026] nhấp nháy hồng ↔ xanh lá (đỏ quá gần hồng) */
    /* 50% { color: #ff0004; border-color: #ff0004 } */
    50% { color: var(--color-submain); border-color: var(--color-submain) }
}
.category-item:hover .name, .product-item .name a { color: var(--color-submain) }
.news-index .name, .news-index::after { transition: .3s; left: 0; position: absolute; width: 100% }
.slide-video { position: relative; width: 100%; text-align: center; overflow: hidden }
.slide-video video { width: 100%; min-height: 100% }
.slide-content { position: absolute; bottom: 5%; color: #f1f1f1; width: 100%; padding: 20px; text-shadow: 0 0 3px #333 }
.service-list, .uudai-item, .wrap-tuvan, .wrap-uudai { position: relative }
.wrap-service-list { background-color: #fdfdfd }
.service-list { display: block; background-color: #fff }
.service-list .image { width: 128px; margin: 0 auto }
.service-list .name { font-family: "Playfair Display", serif; font-size: 21px; font-weight: 600; margin-bottom: 0 }
.wrap-tuvan { background: url(../images/bg_tuvan.jpg) center center no-repeat }
.wrap-tuvan::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5) }
#frm-advisory .form-control { color: #fff; border-radius: 0; border: 1px solid #ccc; background-color: transparent }
#frm-advisory .form-control::placeholder { color: #fff }
.wrap-uudai { z-index: 2; transform: translateY(-50%) }
.wrap-uudai .col-md-7 { border-radius: 30px; box-shadow: 0 0 20px rgba(0, 0, 0, .35); background: #fff }
.uudai-item { padding: 8px }
.uudai-item::after { content: ""; width: 1px; height: 40%; background: var(--color-main); position: absolute; top: 30%; left: -12px }
.news-index, .product-item, .product-list { position: relative }
.wrap-uudai .owl-item:first-child .uudai-item::after { display: none }
.uudai-item .image { position: relative; display: inline-block }
.uudai-item img { display: block; width: 30px }
.category-item { width: calc(100% / 8); display: block; padding: 10px; text-align: center; border: 1px solid transparent; border-radius: 5px; transition: .3s ease-in-out }
.category-item .image { margin-bottom: 10px }
.category-item .image img { width: 48px; border-radius: 5px }
.category-item .name { font-size: 14px; font-weight: 700 }
.category-item:hover { border: 1px solid #86f1ff }
.news-index, .product-item .image img, .product-list { border-radius: 10px }
.product-list { display: block; overflow: hidden }
.product-list .name { position: absolute; top: 0; left: 0; padding: 10px 20px; color: #fff; font-size: 15px; text-align: center; background-color: var(--color-submain); border-bottom-right-radius: 10px }
.product-list .desc { padding: 20px; background-color: #f2f2f2 }
.product-item .image { border-radius: 10px; overflow: hidden; width: 62% }
.product-item .info { width: 35% }
.product-item .name a { display: block; font-size: 18px }
.product-item .attrs { margin: 0 0 20px; padding: 0; list-style: none }
.product-item .attrs li { padding: 5px 0 3px; border-top: 1px solid #989898; color: #989898 }
.product-item .attrs li svg { margin-top: -2px }
.product-item .attrs li b { color: #000 }
.slick-arrow { z-index: 999; width: 50px; height: 50px }
.slick-prev { left: 5px }
.slick-next { right: 5px }
.slick-next:before, .slick-prev:before { font-size: 35px }
.wrap-brand .brand-item, .wrap-doitac .brand-item { width: calc(100% / 4 - .5rem) }
.filter-brand .filter-dropdown-item { width: calc(100% / 10 - .5rem) }
.brand-item { display: block; width: 100%; border-radius: 10px; border: 1px solid #C9C9C9; }
.brand-item img { display: block; width: 100%; height: auto }
.partners-swiper { width: 100% }
.partners-swiper .swiper-slide { height: auto }
.brand-item .image { overflow: hidden; padding: 5px; margin-bottom: 8px; text-align: center }
.brand-item .name { font-size: 14px; font-weight: 600; text-align: center }
.news-index { display: block; margin-bottom: 1rem; overflow: hidden }
.news-index::after { content: ""; bottom: 0; height: 50%; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #000 100%) }
.news-index .name { bottom: 0; font-size: 13px; font-weight: 400; margin-bottom: 0; padding: 10px 15px; color: #fff; z-index: 10 }
.news-index:hover::after { height: 30% }
.wrap-cauchuyen, .wrap-search-multiple { background: linear-gradient(to bottom, #f8f8f8 0, #ececec 100%) }
.visao-item .image img, .visao-item .info { position: relative; z-index: 2 }
.title-tieuchi { width: 50%; margin-left: auto; padding: 0 20px; border-radius: 50px; border: 1px solid #000 }
.product-inner { background-color: #fffbec }
.product-hot { padding: 2rem 0; background-color: #fff }
.product-hot .desc ol li, .product-hot .desc ul li { position: relative; list-style: none; padding: 10px 10px 10px 35px; font-weight: 500 }
.product-hot .desc ol li::before, .product-hot .desc ul li::before { content: ""; display: block; width: 28px; height: 28px; background: url(../images/icon_check.png) center center/28px no-repeat; position: absolute; left: 0; top: 10px }
.wrap-top .container { padding-top: 20px }
.owl-menu-cat { width: calc(100% - 450px) }
.wrap-doitac .owl-item { padding: 10px 0 }
.doitac-item { display: flex; align-items: center; padding: 5px; background-color: #fff; border: 1px solid #eae9e9; border-radius: 5px; overflow: hidden }
.category-lists, .wrap-category ul { padding: 30px; background-color: #ececec }
.wrap-category ul { list-style: none; margin: 0; display: flex; flex-wrap: wrap; gap: 40px }
.wrap-category ul li { width: 12% }
.wrap-category ul li img { height: 60px }
.visao-item:hover .num, .wrap-counter { background: var(--color-main) }
.category-lists a { display: block; text-align: center; font-size: 15px }
.category-lists span { position: relative; display: block; margin: 0 auto 10px; padding: 10px; border-radius: 20px; background-color: #fff }
.category-lists img { border-radius: 20px }
.counter-item { position: relative; font-size: 16px; text-align: center }
.counter-item .number { font-size: clamp(30px, 4vw, 46px); color: var(--color-main); font-weight: 600; line-height: 65px }
.counter-item sup { position: absolute; top: 0; font-size: 2.5rem }
.counter-item p { margin-bottom: 0 }
.counter-item .name { font-size: 15px; font-weight: 600; text-transform: uppercase }
.visao-item .name, .visao-item .num { color: var(--color-main); font-weight: 700 }
.visao-item { max-width: 75%; margin-top: 30px; margin-bottom: 50px; cursor: pointer; font-family: "Playfair Display", sans-serif }
.visao-item:nth-child(3) { margin-left: 30% }
.visao-item:nth-child(2), .visao-item:nth-child(4) { margin-left: 15% }
.visao-item:last-child { margin-bottom: 30px }
.visao-item .num { width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 31px; background-color: #f1f1f1; border-radius: 50rem; font-family: Mulish, sans-serif }
.visao-item .image { position: relative; width: 30px }
.visao-item .info { width: calc(100% - 60px) }
.visao-item .name { font-size: 16px; -webkit-line-clamp: 2; line-height: 1.5; transition: .3s }
.visao-item .desc { margin-bottom: 0; color: #454545; font-size: 13px; font-weight: 600 }
.visao-item:hover .num { color: #fff }
.visao-item:hover .name { color: var(--color-main) }
.accordion-item, .wrap-diadiem-hot .service-list, .wrap-diadiem-hot .service-list .info { border-radius: 0 }
.wrap-diadiem-hot .row { margin: 0 }
.wrap-diadiem-hot .row [class^=col] { padding: 0 }
.wrap-diadiem-hot .service-list .name { background: 0 0; text-align: left; transform: translateY(0) }
.wrap-diadiem-hot .service-list .info { transform: translateY(-150%) }
.wrap-diadiem-hot .service-list h2.name { font-size: 1.75rem }
.wrap-diadiem-hot .service-list::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #000 100%); transition: .3s }
.wrap-diadiem-hot .service-list:hover::before { opacity: 0 }
.wrap-service .title-main::before { display: none }
.service-item .image { border-radius: 20px; overflow: hidden }
.service-item .name { font-family: Inter; font-weight: 700; font-size: 21px; margin-bottom: 10px }
.service-item .desc { color: #979494 }
.wrap-cauhoi .hide-content { background: linear-gradient(transparent, #f7f7f7 100%) }
.accordion-item { margin-bottom: 20px; overflow: hidden; background: #fff; color: #000; font-size: 20px; border: 0 solid; border-bottom: 2px solid #e8e8e8 }
.accordion-body { padding: 0 0 10px }
.accordion-button { position: relative; padding: 1rem 0; background: #fff; font-size: clamp(16px, 2vw, 20px); font-weight: 700 }
.accordion-button:not(.collapsed) { outline: 0 !important; border: 0 !important; box-shadow: none !important; color: var(--color-red) !important; background: 0 0; color: #000 }
.news-item .time, .project-item .name, .whyus-list, .wrap-about .about-img, .year-item { text-align: center }
#chuyenkhoaTabs .nav-link.active img, .item-giatri .bg img { filter: brightness(0) invert(1) }
.hinhthuc-item .name, .project-item .name, .slide-center a, .slide-center h4, .video-item .name, .wrap-about .about-count p { text-transform: uppercase }
.news-item .more a:hover, .slide-center h4 { letter-spacing: 2px }
.blog-l h3 a, .desc-home-cl.text-split, .hinhthuc-item .desc, .name-news.text-split, .name-newshome.text-split, .news .news-name a.text-split, .news-shadow .news-shadow-article .news-shadow-info .news-shadow-desc.text-split, .news-shadow .news-shadow-article .news-shadow-info .news-shadow-name a .text-split, .tieuchi-item .name { -webkit-line-clamp: 2 }
.owl-cat a { color: #8d8d8d }
.owl-cat a.active, .owl-cat a:hover { color: var(--color-main); text-decoration: underline }
.wrap-about .title-main h2, .wrap-doitac .title-main h2, .wrap-giatri .title-main h2, .wrap-history .title-main h2, .wrap-sumenh .title-main h2, .wrap-tamnhin .title-main h2, .wrap-vanhoa .title-main h2 { font-size: clamp(23px, 2vw, 31px) }
.news-item .time span:last-child, .project-item, .slideshow .banner-item, .support-online a:hover span, .wrap-about .title-main h2 span { display: block }
.wrap-about .about-img { position: sticky; top: 0 }
.wrap-about .about-img img:nth-child(2) { margin-left: -43%; margin-top: 15% }
.wrap-about .about-info .btn { font-size: 18px; text-transform: uppercase }
.wrap-about .about-info .btn-more { padding: 12px 20px; color: #fff; background: var(--color-main); margin-right: 20px }
.wrap-about .about-info .btn-more:hover { background: #1f9607 }
.wrap-about .about-info .btn-video { display: flex; align-items: center; padding: 8px 15px; color: #111; background: var(--color-submain) }
.wrap-about .about-info .btn-video:hover { background-color: #efe20c }
.wrap-about .about-count .counter, .wrap-about .about-count sup { font-family: "1FTV Avilock"; font-size: 65px; color: var(--color-main) }
.wrap-about .about-count .counter { line-height: 55px }
.wrap-about .about-count p { font-size: 18px }
.wrap-goikham { background-color: #f8f8f8 }
.goikham-item .info { position: relative; width: 90%; margin-left: auto; margin-right: auto; background: #fff; padding: 20px; margin-top: -40px }
.goikham-item .name { font-size: 18px; font-weight: 700; margin-bottom: 15px }
.baogia-item:hover, .blog-l h3 a:hover, .box-newsi h3 a:hover, .doingu-item, .doingu-item .name a, .goikham-item .name a, .khachhang-item:hover .icon svg, .news-item .name a:hover, .news-item:hover .name a, .owl-item.active.center .khachhang-item .icon svg, .quytrinh-item:hover .name, .tieuchi-item:hover .name, .whyus-list:hover .name, .swiper-slide-thumb-active .year-item, .year-item.slick-current { color: var(--color-main) }
#frm-newsletter .frm-title, .goikham-item .name a:hover, .name-product:hover, .search-res .icon-search.active { color: var(--color-submain) }
.goikham-item .more .btn-main { width: 50% }
#chuyenkhoaTabs { justify-content: space-between }
#chuyenkhoaTabs .nav-link { font-size: 14px; padding: 5px; color: #999; background: #f0f0f0 }
#chuyenkhoaTabs .nav-link.active, .choose-list button.choosed, .choose-list button:hover { color: #fff; background: #40b604 }
#chuyenkhoaTabsContent { border: 1px solid #dee2e6; border-top: 0; box-shadow: .5rem .5rem 1rem rgba(0, 160, 227, .15) }
.wrap-doingu { background: url(../images/bg_doingu.jpg) right bottom no-repeat #f8f9f8 }
.doingu-item .image, .wrap-video .image { border-radius: 10px; overflow: hidden }
.doingu-item .name { font-family: "Playfair Display", sans-serif; font-size: 18px; font-weight: 700 }
.tieuchi-item .name, .tieuchi-item .num { font-family: Inter, serif; transition: .3s }
.doingu-item .desc { color: #7e7e7e; font-size: 14px }
.wrap-appointment, .wrap-tieuchi { background: #f7f7f7 }
.tieuchi-inner { background-repeat: no-repeat; background-position: center center; background-size: 250px }
.tieuchi-item { padding: 0; max-width: 85%; cursor: pointer }
.tieuchi-item .num { font-size: 75px; line-height: 1; background: linear-gradient(to bottom, #ffcb0f 0, #fff 100%); background-clip: text; -webkit-background-clip: text; color: transparent }
.tieuchi-item .image { position: relative; width: 30px }
.hinhthuc-item .image img, .tieuchi-item .image img, .wrap-tiktok .tiktok-container .tiktok-iframe { position: relative; z-index: 2 }
.tieuchi-item .info { position: relative; width: calc(100% - 60px); z-index: 2 }
.tieuchi-item .name { color: #000; font-weight: 600; font-size: 16px; line-height: 1.5 }
.tieuchi-item .desc { margin-bottom: 0; color: #868686; font-size: 14px }
.tieuchi-item:hover .num { background: var(--bg-linear-hover); background-clip: text; -webkit-background-clip: text }
.showroomSwiper .swiper-slide, .slide-left {width: 334px;}
.panorama-slider { width: 100%; padding: 60px 0; perspective: 1000px; overflow: visible }
.panorama-slider .swiper-slide { width: 250px; transition: transform .5s; transform-origin: center center; border-radius: 16px; overflow: hidden; box-shadow: 0 10px 20px rgba(0, 0, 0, .1) }
.hinhthuc-item { margin-bottom: 15px }
.hinhthuc-item .num { font-family: Dynalight; font-size: 75px; line-height: 65px; color: #eaeaea; transition: .3s }
.hinhthuc-item:hover .num { color: var(--color-main); transform: scale(1.2) }
.hinhthuc-item .char { font-family: SVN-Poppins; font-size: 100px; font-weight: 600; line-height: 100px; color: transparent; background: var(--linear-2); background-clip: text; transform: translate(-7%, 65%) }
.hinhthuc-item .image { position: relative; width: 94px; padding: 20px; background-color: var(--color-main); border-radius: 100% }
.hinhthuc-item .info { position: relative; width: calc(100% - 90px); z-index: 2 }
.hinhthuc-item .name { font-weight: 600; color: #333; font-size: 16px; margin-bottom: .5rem }
.hinhthuc-item .desc { margin-bottom: 0; color: #333; font-size: 15px; min-height: 45px }
.wrap-sumenh h3, .wrap-tamnhin h3 { font-size: clamp(24px, 3vw, 32px); font-weight: 800; color: var(--color-main); margin-top: 10px }
.wrap-tamnhin h3::after { content: ""; display: none; width: 50px; height: 2px; background-color: var(--color-submain) }
.as-layer.as-vertical { width: 65% }
.wrap-tiktok .tiktok-container { position: relative; width: 100%; height: 568px; padding: 14px }
.wrap-tiktok .tiktok-container .tiktok-iframe iframe { overflow: hidden; border-radius: 20px }
.wrap-tiktok .tiktok-container .tiktok-button { position: absolute; z-index: 3; bottom: 0; right: 0; width: 127px; height: 125px; background: url(../images/bg_tiktok_icon.png) no-repeat }
.wrap-tiktok .tiktok-container .tiktok-button:hover { color: red }
.wrap-tiktok .tiktok-container .tiktok-button .btn-frame { position: absolute; top: 50px; left: 50px; color: #fff }
#frm-appointment-2 { padding: 30px; background: url(../images/bg_datlich.jpg) center center/cover no-repeat; border-radius: 10px; overflow: hidden }
#frm-appointment-2 label { margin-bottom: 5px; font-weight: 700; color: var(--color-main) }
#frm-appointment-2 .form-control, #frm-appointment-2 .form-select { background-color: transparent }
.slider-video-thumb { margin: 0 -.5rem }
.gallery-pro-detail .slider-products .item img, .video-item { margin: 0 auto }
.video-item, .video-item .image { position: relative; overflow: hidden }
.video-item .name { position: absolute; left: -85px; bottom: 100px; padding: 10px 20px; background: linear-gradient(to bottom, #2fd0ff 0, #0bb1e1 100%); color: #fff; font-family: Goldman, sans-serif; font-size: 16px; border-radius: 3px; margin-bottom: 0; transform: rotate(-90deg) }
.video-item .btn-play { position: absolute; top: 50%; left: 50%; width: 50px; height: 50px; transform: translate(-50%, -50%); transition: .3s; opacity: 1 }
#frm-newsletter, .giatri-item .info, .newsletter-input, .quytrinh-item, .search-res, .slide-left, .slide-right, .wrap-history .slider-nav, a.play { position: relative }
.video-item .btn-play .kenit-alo-circle, a.play .btn-frame .kenit-alo-circle { border-color: rgba(255, 255, 255, .5) }
.video-item .btn-play .kenit-alo-circle-fill { background: rgba(255, 255, 255, .3) }
.support-online .sms i, .video-item .btn-play i { background: red }
.form-check-input:checked, .newsletter-button button:hover { background: var(--color-submain) }
.box-product.hot .name-product, .box-product.hot .price-product, .box-product.hot .price-product .price-new, .video-item .btn-play svg, .wrap-video .btn-play svg { color: #fff }
#frm-newsletter .form-control { color: #949494; border: 0; outline: 0 !important; box-shadow: none !important; background-color: transparent }
#frm-newsletter button[type=submit] { border: 1px solid #fff; background: 0 0; color: #fff; font-size: 14px }
.form-check-input:checked { border-color: var(--color-submain) }
#frm-newsletter .frm-content { padding: 40px 20px; background-color: #f3f3f3; border-radius: 20px }
#frm-newsletter .frm-title span { color: #757575 }
.newsletter-input svg { display: none; position: absolute; top: 20px; right: 10px }
.newsletter-input { display: flex; align-items: center; width: calc(100%); margin-bottom: 25px; background-color: #fff; border-radius: 5px }
.newsletter-input label { padding-left: 10px; padding-top: .25rem; white-space: nowrap; margin: 0; color: #757575; font-size: 14px }
.newsletter-input input, .newsletter-input select, .newsletter-input textarea {font-size: 16px;height: 40px;border: 1px solid #ccc;box-shadow: none !important;outline: 0 !important}
.newsletter-input input::placeholder, .newsletter-input textarea::placeholder { font-size: 16px }
.newsletter-input textarea { height: 120px; resize: none }
.newsletter-button { position: absolute; right: 2px; top: 2px }
.newsletter-button button { padding: 0 10px; height: 31px; border: 0; background: var(--color-main); color: #fff; border-radius: .25rem }
.wrap-whyus { background: url(../images/bg_whyus.jpg) center center/cover no-repeat; color: #fff }
.image-rotate:hover  img { animation: 2s linear infinite continuousRotateY }
.quytrinhtm-item { margin: 0 5px 10px 0; border-radius: 10px; overflow: hidden }
.quytrinhtm-item .num { font-size: 60px }
.quytrinhtm-item .name { font-family: Inter; font-size: 18px; font-weight: 600 }
.wrap-quytrinh { background: #fff; background: linear-gradient(180deg, #fff 0, #eee 100%) }
.quytrinh-item:nth-child(odd) { padding-bottom: 5rem }
.quytrinh-item:nth-child(2n) { padding-top: 5rem }
.quytrinh-item::before { content: ""; display: block; position: absolute; top: 30%; right: -14%; width: 83px; height: 24px; background: url(../images/arrow_quytrinh.png) 0 0/100% no-repeat }
.quytrinh-item:nth-child(2n)::before { background: url(../images/arrow_quytrinh2.png) no-repeat }
.quytrinh-item:last-child::before { background: 0 0 }
.wrap-filter .search input { border-radius: 80px; height: 50px }
.wrap-filter .search .buttons-common { position: absolute; top: 4px; right: 4px }
.wrap-filter .search input::placeholder { font-size: 16px }
.filter-page-title { margin: 0 0 18px; color: #20150f; font-family: Inter, sans-serif; font-size: 24px; font-weight: 700; line-height: normal; text-transform: uppercase }
.wrap-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 7px }
.wrap-filter .filter-item { position: relative }
.wrap-filter .filter-title { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 40px; padding: 10px 20px; border-radius: 63px; border: 1px solid #dfdfdf; background: #fff; color: #333; font-family: Inter, sans-serif; font-size: 14px; font-weight: 500; line-height: normal; text-decoration: none !important; white-space: nowrap; transition: border-color .2s ease, background .2s ease, color .2s ease, box-shadow .2s ease }
.wrap-filter .filter-title:hover { border-color: #40b604; color: #40b604 }
.wrap-filter .filter-item.is-open .filter-title, .wrap-filter .filter-title.is-active { border-color: #40b604; color: #40b604; box-shadow: 0 0 0 3px rgba(64, 182, 4, .12) }
.wrap-filter .filter-title--primary { background: #40b604; border-color: #40b604; color: #fff }
.wrap-filter .filter-item.is-open .filter-title--primary, .wrap-filter .filter-title--primary:hover { background: #38a003; border-color: #38a003; color: #fff; box-shadow: 0 0 0 3px rgba(64, 182, 4, .18) }
.wrap-filter .filter-title__icon { width: 20px; height: 20px; flex-shrink: 0; display: block }
.wrap-filter .filter-title__chevron { width: 12px; height: 12px; flex-shrink: 0; opacity: .75; transition: transform .2s ease }
.wrap-filter .filter-item.is-open .filter-title__chevron { transform: rotate(180deg); opacity: 1 }
.wrap-filter .filter-title__text { display: inline-block }
.wrap-filter .filter-counter { display: none; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 0; border-radius: 999px; border: 0; background: rgba(64, 182, 4, .12); color: #40b604; font-size: 11px; font-weight: 700; line-height: 18px; opacity: 1 }
.wrap-filter .filter-title--primary .filter-counter { background: rgba(255, 255, 255, .22); color: #fff }
.wrap-filter .filter-counter.show { display: inline-flex }
.wrap-filter .btn-filter.is-context:not(.active) { border-color: #40b604; color: #40b604 }
.wrap-filter .btn-filter.outline.gray { min-height: 34px; padding: 7px 14px; border: 1px solid #e6e6e6; border-radius: 8px; background: #fff; color: #333; font-family: Inter, sans-serif; font-size: 13px; font-weight: 500; line-height: 1.25; text-decoration: none !important; box-shadow: none; transition: border-color .2s ease, background .2s ease, color .2s ease }
.wrap-filter .btn-filter.outline.gray:hover { border-color: #40b604; background: #f7fbf3; color: #2f8a04 !important }
.wrap-filter .btn-filter.outline.gray.active, .wrap-filter .btn-filter.outline.gray.active:hover { border-color: #40b604; background: #f3faeb; color: #2f8a04 !important; padding-right: 22px }
.wrap-filter .btn-filter.outline.gray.active::before { content: ""; position: absolute; right: 0; bottom: 0; border: 11px solid #40b604; border-top-color: transparent; border-left-color: transparent }
.wrap-filter .btn-filter.outline.gray.active::after { content: ""; position: absolute; right: 3px; bottom: 4px; width: 4px; height: 7px; border-right: 1.5px solid #fff; border-bottom: 1.5px solid #fff; transform: rotate(45deg); pointer-events: none }
.filter-swatch { width: 12px; height: 12px; border-radius: 50%; display: inline-block; margin-right: 5px; border: 1px solid rgba(0, 0, 0, .08); vertical-align: middle }
.filter-price-slider { padding: 4px 4px 8px }
.filter-price-slider__values { font-size: 13px; font-weight: 600; color: #222 }
.filter-price-slider .irs { margin-top: 8px }
.filter-price-slider .irs--flat .irs-bar, .filter-price-slider .irs--round .irs-bar { background: #40b604 }
.filter-price-slider .irs--flat .irs-handle>i:first-child, .filter-price-slider .irs--round .irs-handle { background: #40b604; border-color: #40b604 }
.filter-price-slider .irs--flat .irs-from, .filter-price-slider .irs--flat .irs-single, .filter-price-slider .irs--flat .irs-to, .filter-price-slider .irs--round .irs-from, .filter-price-slider .irs--round .irs-single, .filter-price-slider .irs--round .irs-to { background: #40b604 }
.filter-apply-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 168px; min-height: 40px; padding: 8px 24px; border-radius: 8px; background: #40b604; color: #fff !important; font-size: 14px; font-weight: 600; text-transform: none; transition: background .2s ease, box-shadow .2s ease }
.filter-apply-btn:hover { background: #38a003; color: #fff !important; box-shadow: 0 6px 14px rgba(64, 182, 4, .25) }
.filter-reset-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 120px; min-height: 40px; padding: 8px 20px; border-radius: 8px; border: 1px solid #cfcfcf; background: #fff; color: #333 !important; font-size: 14px; font-weight: 600; text-transform: none; transition: background .2s ease, border-color .2s ease, color .2s ease }
.filter-reset-btn:hover { background: #f5f5f5; border-color: #999; color: #111 !important }
.filter-search, .filter-search .btn { position: relative; align-items: center; height: 30px }
.js-facebook-messenger-box.open svg#close-icon, .wrap-filter .filter-counter.show { opacity: 1 }
.filter-search { border-radius: 0; background: #fff; display: flex; justify-content: end; outline: 0; overflow: hidden; transition: .4s ease-in-out; width: 200px; border: 1px solid #cfcfcf }
.filter-search input { position: absolute; top: 0; left: 0; width: calc(100% - 30px); height: 100%; outline: 0 !important; border: 0 !important; display: block; z-index: 1; background: #fff !important; box-shadow: none !important }
.filter-search .btn { display: flex; justify-content: center; padding: 0; border-radius: 5px; width: 30px; cursor: pointer; background: 0 0; border-color: transparent; z-index: 2 }
.filter-dropdown { position: absolute; left: 0; min-width: 320px; width: max-content; max-width: min(720px, calc(100vw - 40px)); background-color: #fff; top: calc(100% + 8px); border-radius: 12px; border: 1px solid #ececec; -webkit-box-shadow: 0 12px 32px rgba(0, 0, 0, .12); box-shadow: 0 16px 40px rgba(32, 21, 15, .12); -webkit-transform: perspective(600px) rotateX(-90deg); transform: perspective(600px) rotateX(-90deg); -webkit-transform-origin: 0 0 0; transform-origin: 0 0 0; opacity: 0; visibility: hidden; padding: 16px 18px 14px; transition: .3s ease-in-out; z-index: 20 }
.wrap-filter .filter-item:first-child .filter-dropdown-all { width: min(720px, calc(100vw - 40px)) }
.filter-dropdown.show { -webkit-transform: perspective(600px) rotateX(0); transform: perspective(600px) rotateX(0); transform-origin: 0 0 0; -webkit-transform-origin: 0 0 0; opacity: 1; visibility: visible }
.filter-dropdown h6 { margin: 0 0 10px; color: #1a1a1a; font-size: 13px; font-weight: 600; line-height: 1.3 }
.filter-dropdown h6:not(:first-child) { margin-top: 16px; padding-top: 14px; border-top: 1px solid #f0f0f0 }
.filter-dropdown-list { gap: 8px !important; margin-bottom: 12px !important }
.filter-dropdown-item { display: inline-flex }
.filter-dropdown .border-top { margin-top: 2px; padding-top: 14px !important; border-top: 1px solid #f0f0f0 !important }
.filter-dropdown-item a, .search-multiple .giaban-item .name, .search-multiple .hangxe-item .name { font-size: 13px }
.wrap-project { background: #fff }
.project-item .name { font-size: 18px }
.news-item { width: 100%; height: 100%; overflow: hidden }
.news-item__link { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none !important }
.news-item__thumb { position: relative; overflow: hidden; border-radius: 10px; margin-bottom: 14px; background: #eee; aspect-ratio: 5/3 }
.news-item__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease }
.news-item__link:hover .news-item__thumb img { transform: scale(1.05) }
.news-item__body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0 }
.news-item__date { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 500; line-height: 1.3; color: #888 }
.news-item__name { margin: 0 0 8px; font-size: 17px; font-weight: 700; line-height: 1.35; color: #222; transition: color .25s ease }
.news-item__link:hover .news-item__name { color: #40b604 }
.news-item__desc { margin: 0 0 12px; font-size: 14px; font-weight: 500; line-height: 1.5; color: #727272 }
.news-item__more { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: #40b604; transition: gap .25s ease, color .25s ease }
.news-item__link:hover .news-item__more { gap: 10px; color: #349503 }
.news-item .image { position: relative; margin-bottom: 0 }
.news-item .info { position: relative; width: 100%; padding: 0; border: 0; background: 0 0 }
.news-item .time { margin: 0 auto 15px; width: 65px; height: 82px; border-bottom: 1px solid var(--color-main); color: #222; font-size: 16px; padding-top: 25px; line-height: 20px; background: url(../images/bg_time.png) top center/cover no-repeat }
.news-item .time span:first-child { display: inline-block; font-size: 30px; font-weight: 700; padding-bottom: 5px; border-bottom: 1px solid #222 }
.news-item .author { font-size: 14px; color: #aaa }
.news-item .name { height: auto; margin: 0 0 8px }
.news-item .name a { position: relative; font-size: 17px; font-weight: 700; color: #222; text-decoration: none }
.news-item .name a:hover, .news-item:hover .name a { color: #40b604 }
.news-item .desc { font-size: 14px; color: #727272 }
.news-item .more a { font-size: 14px; color: #40b604 }
.news-item .meta { position: absolute; top: 10px; left: 10px }
.news-item .meta span { display: block; font-size: .875rem; color: #fff; padding: 3px 5px 2px; border-radius: 3px; background-color: #40b604 }
.news-item .line { margin-top: 30px; margin-bottom: 5px; width: 50px; height: 2px; background: #40b604 }
.news-item.list { display: flex; margin-bottom: 15px }
.news-item.list .image { width: 200px }
.news-item.list .info { padding: 10px 20px; width: calc(100% - 210px) }
.news-page { padding-bottom: 40px }
.news-page__grid { --news-gap: 24px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--news-gap); margin: 0; padding: 0; list-style: none }
.news-page--with-sidebar .news-page__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) }
.news-page__grid>* { min-width: 0 }
.news-page__head { margin-bottom: 22px }
.news-page__head .title-main { margin-bottom: 0 }
.news-page__more { display: flex; justify-content: center; margin-top: 8px }
.news-load-more.disabled { opacity: .6; pointer-events: none; cursor: default }
.giatri-item, .pic-video, .pic-video-2 { position: relative; cursor: pointer }
.giatri-item .image, .khachhang-item .image { width: 70px }
.giatri-item .name { font-size: clamp(18px, 2vw, 21px); font-weight: 700 }
.giatri-item .desc { font-size: clamp(14px, 1.5vw, 16px); font-weight: 500; color: #6e6e6e }
.wrap-doingu-inner { background: linear-gradient(to bottom, #fff 0, #cfcfcf 100%) }
.choose-list button.choosed::before, .choose-list button:hover::before, .item-giatri, .slide-center a, .swiper-slide-thumb-active .year-item::before, .year-item.slick-current::before { background-color: var(--color-main) }
.wrap-vanhoa .wrap-content { padding: 40px; border-radius: 20px; box-shadow: 5px 5px 0 rgba(234, 230, 230, .5) }
.vanhoa-item .image { width: 56px }
.vanhoa-item .name { font-size: 16px; font-weight: 600; color: var(--color-main) }
.vanhoa-item .desc { color: #666; font-size: 15px; font-weight: 500 }
.history-item .name { font-size: 21px; margin-bottom: 15px; font-weight: 700 }
.history-item .p { font-size: 24px; font-family: var(--font-bold); margin-bottom: 0 }
.item-giatri .name, .item_history .name { font-family: "Playfair Display", sans-serif }
.year-item { font-size: 16px; position: relative; color: #b9b9b9; padding-bottom: 12px; z-index: 98 }
.year-item span { display: flex; align-items: center; justify-content: center; height: 50px; color: #7e7e7e; font-family: Inter; font-size: 18px; font-style: normal; font-weight: 500; line-height: normal }
#menu, .box-product.hot::before, .btn-option input, .checkbox-card input[type=checkbox], .checkbox-card input[type=radio], .color-option input, .color-pro-detail input[type=radio], .gallery-pro-detail .slider-products .slick-next:before, .gallery-pro-detail .slider-products .slick-prev:before, .img-option input, .menu-res, .size-pro-detail input[type=radio] { display: none }
.slick-list { z-index: 99 }
.year-item::before { content: ""; position: absolute; bottom: 3px; margin: auto; right: 0; left: 0; width: 12px; height: 12px; background-color: #d9d9d9; z-index: 3; rotate: 45deg }
.item-giatri .icon, .slideshow .banner-item:first-child { margin-bottom: 20px }
.wrap-history .slider-nav:after { content: ''; position: absolute; bottom: 8px; width: 100%; height: 1px; background-color: #c6c6c6; z-index: 0 }
.gallery-pro-detail .slider-products .slick-arrow svg, .wrap-history .slider-nav .slick-arrow { width: 30px; height: 30px }
.wrap-history .slider-nav .slick-arrow::before { font-size: 25px; color: var(--color-main) }
.pic-news img, .pic-newshome-normal img, .pic-product img, .pic-video img, .pic-video-2 img, .tags-pro-detail, .wrap-history .slider-for { width: 100% }
.item-giatri { position: relative; padding: 20px; border-radius: 10px }
.item-giatri .bg { position: absolute; width: 30%; height: 65%; top: 0; right: 0; opacity: .5 }
.item-giatri .bg img { max-width: 100%; max-height: 100% }
.item-giatri .icon { position: relative; width: 40px }
.item-giatri .name { position: relative; font-size: 18px; font-weight: 700; color: #fff }
.item-giatri .desc { position: relative; font-size: 15px; color: #87c5df; line-height: 2 }
.item_history { position: relative; border-radius: 10px; overflow: hidden }
#hamburger, .menu-bar-res { border-radius: 5px; background: var(--color-submain) }
.item_history::before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0, #000 100%) }
.item_history .info { position: absolute; padding: 10px 20px; bottom: 10px; left: 10px; width: 100%; color: #fff }
.wrap-video .btn-play, a.play .btn-frame { left: 50%; transform: translate(-50%, -50%); position: absolute; top: 50% }
.item_history .name { font-size: 31px; margin-bottom: 15px; color: #fff }
.item_history .desc { font-size: 16px; color: #fff }
a.play .btn-frame { width: 50px; height: 50px }
a.play .btn-frame i { color: #fff; background-color: rgba(255, 255, 255, .3) }
.wrap-video .btn-play { display: inline-block }
.menu-res { z-index: 100; background: var(--color-main); position: relative }
.menu-bar-res { display: none; height: 34px; padding: 0 10px; justify-content: center }
#hamburger { position: relative; display: block; width: 34px; height: 30px; border: 1px solid #fff }
#hamburger span, #hamburger:after, #hamburger:before { background: #fff; content: ""; display: block; width: 60%; height: 1px; position: absolute; left: 20%; -webkit-transition: transform .5s .5s, top .5s .5s, bottom .5s .5s, left .5s .5s, opacity .5s .5s; transition: none .5s .5s; transition-property: transform, top, bottom, left, opacity }
.search-multiple .giaban-item, .search-multiple .hangxe-item, .search-multiple .loaixe-item { transition: .2s ease-in-out; text-align: center }
#hamburger:before { top: 7px }
#hamburger span, .mm-wrapper_opening #hamburger:after, .mm-wrapper_opening #hamburger:before { top: 14px }
#hamburger:after { top: 21px }
.mm-wrapper_opening #hamburger span { left: -50px; opacity: 0 }
.mm-wrapper_opening #hamburger:before { transform: translateY(-50%) rotate(45deg) !important; }
.mm-wrapper_opening #hamburger:after { transform: translateY(-50%) rotate(-45deg) !important; }
.mm-menu_opened { display: block !important; z-index: 99999 !important }
.mm-navbar, .mm-panel, .mm-panels { background: #fff !important }
.desc-pro-detail .attrs li b, .mm-menu a, .mm-menu a:active, .mm-menu a:hover, .mm-menu a:link, .mm-menu a:visited, .name-newshome.text-split a, .view-newshome:hover { color: #000 }
.mm-btn:after, .mm-btn:before { border-color: #000 }
.mm-listitem-product .mm-listitem__text { font-size: 15px; flex-basis: auto; flex-grow: 0; white-space: normal; padding: 5px 8px !important; margin: 2px }
.search-res .icon-search { cursor: pointer; text-align: center; color: #fff; font-size: 16px; margin: 0 0 0 10px }
.search-res .search-grid { position: absolute; top: 35px; right: -12px; width: 0; height: 40px; overflow: hidden; background: #fff; border: 1px solid var(--color-main); z-index: 2; opacity: 0; border-radius: 25px; line-height: normal }
.search-res .search-grid p { float: left; width: 35px; height: 38px; cursor: pointer; outline: 0; border: none; margin: 0; font-size: 17px; display: block; color: var(--color-main); line-height: 35px; text-align: center }
.search-res .search-grid input { width: calc(100% - 35px); float: right; line-height: 38px; outline: 0; border: none; color: var(--color-main) }
.search-res .search-grid input::-webkit-input-placeholder { color: #313131 }
.search-res .search-grid input:-moz-placeholder { color: #313131 }
.search-res .search-grid input::-moz-placeholder { color: #313131 }
.search-res .search-grid input:-ms-input-placeholder { color: #313131 }
@keyframes dance {
    0% { -webkit-transform: scale(.5) }
    100% { -webkit-transform: scale(1.5) }
}
@keyframes moveBounce {
    0%, 100% { -webkit-transform: translateY(0); transform: translateY(0) }
    50% { -webkit-transform: translateY(20px); transform: translateY(20px) }
}
@keyframes moveUpBounce {
    0%, 100% { -webkit-transform: translateY(0); transform: translateY(0) }
    50% { -webkit-transform: translateY(35px); transform: translateY(35px) }
}
@keyframes moveLeftBounceright {
    0%, 100% { -webkit-transform: translateX(0); transform: translateX(0) }
    50% { -webkit-transform: translateX(35px); transform: translateX(35px) }
}
@keyframes rotateme {
    from { -webkit-transform: rotate(0); transform: rotate(0) }
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg) }
}
@-webkit-keyframes rotateme {
    from { -webkit-transform: rotate(0) }
    to { -webkit-transform: rotate(360deg) }
}
.slideshow { position: relative; overflow: hidden; z-index: 1; padding: 0 }
.slide-left { z-index: 5; flex: 0 0 296px }
.slide-right { min-width: 0; border-radius: 10px }
.slideshow .menu-left { display: flex; flex-direction: column; justify-content: space-between; padding: 10px 8px; overflow: visible; border: 1px solid #ededed; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .08) }
.slideshow .menu-left > li { position: relative; flex: 1 1 0; padding: 0 4px; border-bottom: 1px dashed #d6dce4 }
.slideshow .menu-left > li:last-child { border-bottom: 0 }
.slideshow .menu-left > li > a { height: 100%; min-height: 48px; padding: 8px 4px; color: #666; font-size: 18px; font-weight: 500; line-height: 20px; text-decoration: none }
.slideshow .menu-left > li:hover > a { color: #062f66 }
.slideshow .menu-left > li > a i { flex: 0 0 auto; margin-left: 12px; color: #8b8b8b; font-size: 12px }
.slideshow .menu-left .submenu { position: absolute; top: -11px; left: calc(100% + 4px); width: 270px; max-height: 390px; padding: 10px 14px; overflow-y: auto; visibility: hidden; opacity: 0; transform: translateX(8px); border: 1px solid #ededed; border-radius: 8px; background: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, .12); transition: opacity .2s ease, transform .2s ease, visibility .2s ease }
.slideshow .menu-left > li:hover > .submenu { visibility: visible; opacity: 1; transform: translateX(0) }
.slideshow .menu-left .submenu li + li { border-top: 1px dashed #d6dce4 }
.slideshow .menu-left .submenu a { display: block; padding: 11px 4px; color: #666; font-size: 15px; font-weight: 500; line-height: 20px; text-decoration: none }
.slideshow .menu-left .submenu a:hover { color: #062f66 }
.slideshow-swiper { width: 100%; height: auto }
.slideshow-swiper .swiper-slide { position: relative; overflow: hidden }
.slideshow-image, .slideshow-video { display: block; width: 100% }
.slideshow-image img, .slideshow-video video, .ssvideo { display: block; width: 100%; height: auto; object-fit: contain }
.slideshow .banner { width: 37% }
.slideshow-swiper .swiper-button-prev, .slideshow-swiper .swiper-button-next { width: 50px; height: 50px; margin-top: 0; top: 50%; z-index: 3; transform: translateY(-50%); color: #fff; background: rgba(8, 25, 76, .55); border-radius: 50% }
.slideshow-swiper .swiper-button-prev { left: 16px }
.slideshow-swiper .swiper-button-next { right: 16px }
.slideshow-swiper .swiper-button-prev:after, .slideshow-swiper .swiper-button-next:after { font-size: 16px }
.slideshow-swiper .swiper-button-prev:hover, .slideshow-swiper .swiper-button-next:hover { background: #08194C }
.slideshow-swiper .swiper-pagination { display: none; bottom: 16px }
.slideshow-swiper.is-single .swiper-button-prev, .slideshow-swiper.is-single .swiper-button-next, .slideshow-swiper.is-single .swiper-pagination { display: none }
.slideshow-swiper .swiper-pagination-bullet { background: #fff; opacity: .45 }
.slideshow-swiper .swiper-pagination-bullet-active { opacity: 1; background: #fff }
.slideshow-caption { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; pointer-events: none }
.slideshow-caption .widthBox { width: 100% }
.slideshow-text { max-width: 424px }
.slideshow-text__btn, .slideshow-text__desc, .slideshow-text__subtitle, .slideshow-text__title { opacity: 0 }
.slideshow-text__title { margin: 0; color: #fff; font-family: Inter, sans-serif; font-size: 34px; font-weight: 500; line-height: normal; transform: translateX(-36px) }
.slideshow-text__subtitle { margin: 0; color: #e6ddd0; font-family: "Playfair Display", serif; font-size: 37px; font-weight: 500; font-style: italic; line-height: normal; transform: translateX(-28px) }
.slideshow-text__desc { margin: 9px 0 0; color: #a9a9a9; font-family: Inter, sans-serif; font-size: 14px; font-style: italic; font-weight: 400; line-height: 20px; transform: translateY(18px) }
.slideshow-text__btn { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; width: 206px; height: 42px; margin-top: 22px; background: #bc9a71; color: #000; font-family: Inter, sans-serif; font-size: 12px; font-weight: 500; line-height: normal; text-transform: uppercase; text-decoration: none; pointer-events: auto; transform: translateY(16px) scale(.96); transition: background .25s ease, transform .25s ease, box-shadow .25s ease }
.slideshow-text__btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 20%, rgba(255, 255, 255, .4) 50%, transparent 80%); transform: translateX(-120%); pointer-events: none }
.slideshow-text__btn:hover { color: #000; background: #a88760; box-shadow: 0 8px 18px rgba(188, 154, 113, .35) }
.slideshow-swiper .swiper-slide-active .slideshow-text__title { animation: slideshowFadeLeft .75s cubic-bezier(.22, .61, .36, 1) .12s forwards }
.slideshow-swiper .swiper-slide-active .slideshow-text__subtitle { animation: slideshowFadeLeft .8s cubic-bezier(.22, .61, .36, 1) .32s forwards }
.slideshow-swiper .swiper-slide-active .slideshow-text__desc { animation: slideshowFadeUp .7s cubic-bezier(.22, .61, .36, 1) .52s forwards }
.slideshow-swiper .swiper-slide-active .slideshow-text__btn { animation: slideshowBtnIn .65s cubic-bezier(.22, .61, .36, 1) .78s forwards }
.slideshow-swiper .swiper-slide-active .slideshow-text__btn::after { animation: slideshowShine .85s ease 1.35s forwards }
@keyframes slideshowFadeLeft {
    0% { opacity: 0; transform: translateX(-36px) }
    100% { opacity: 1; transform: translateX(0) }
}
@keyframes slideshowFadeUp {
    0% { opacity: 0; transform: translateY(18px) }
    100% { opacity: 1; transform: translateY(0) }
}
@keyframes slideshowBtnIn {
    0% { opacity: 0; transform: translateY(16px) scale(.96) }
    100% { opacity: 1; transform: translateY(0) scale(1) }
}
@keyframes slideshowShine {
    0% { transform: translateX(-120%) }
    100% { transform: translateX(120%) }
}
.slide-text .wrap-content { position: absolute; top: 20%; right: 0; left: 0; width: 100%; padding: 100px 0 }
.slide-text .star { position: absolute; top: 0; left: 10%; -webkit-animation: 1.5s infinite alternate dance; animation: 1.5s infinite alternate dance }
.slide-text .arrow { position: absolute; bottom: -40px; left: 20%; -webkit-animation: 2s linear infinite moveLeftBounceright; animation: 2s linear infinite moveLeftBounceright }
.slide-text .triangle { position: absolute; z-index: 22; bottom: -4%; left: 69%; color: #fff; width: 72px; height: 82px; min-height: 0; min-width: 0; max-height: none; max-width: none; transform-origin: 50% 50%; opacity: 1; transform: translate(0, 0); visibility: visible; -webkit-animation: 2s linear infinite moveBounce; animation: 2s linear infinite moveBounce }
.slide-right span, .slide-text .rotateme { left: 10px; top: 5px; position: absolute; bottom: 0; right: 0 }
.blink, .slide-text .rotateme { -webkit-animation-iteration-count: infinite }
.slide-text .rotateme { -webkit-animation-name: rotateme; animation-name: rotateme; -webkit-animation-duration: 20s; animation-duration: 20s; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear }
.slide-center { width: 540px; text-align: center; color: #fff }
.slide-center h4 { color: var(--color-main); font-weight: 400; font-size: 20px }
.slide-center h2 { font-family: "Lexend Deca", sans-serif; font-size: 48px; margin-bottom: 30px }
.slide-center p { color: #cac6c6; margin-bottom: 20px }
.slide-center a { display: inline-block; padding: 15px 30px 12px; color: #fff; border-radius: 30px; box-shadow: 1px 1px 0 #fff }
.cart-product span, .web-item .info .d-flex a { text-transform: capitalize }
.slide-center a:hover { background-color: #be1217 }
.swiper-slide-active .box-slide .slide-left, .box-slide.swiper-slide-active .slide-left { animation: 1s .5s forwards fadeInLeftBig }
.swiper-slide-active .box-slide .slide-right, .box-slide.swiper-slide-active .slide-right { animation: 1s 1s forwards fadeInRightBig }
.swiper-slide-active .box-slide .name-slide, .box-slide.swiper-slide-active .name-slide { animation: 1s 1.5s forwards fadeInUp }
.swiper-slide-active .box-slide .desc-slide, .box-slide.swiper-slide-active .desc-slide { animation: 1s 2s forwards fadeInUp }
.swiper-slide-active .box-slide .views-more-slide, .box-slide.swiper-slide-active .views-more-slide { animation: 1s 2.5s forwards scaleLarge }
.slide-text .slick-next, .slide-text .slick-prev { width: 40px; height: 50px; border-radius: 5px; background: rgba(0, 0, 0, .3) }
.slide-text .slick-prev { left: 5px }
.slide-text .slick-next { right: 5px }
.slide-text .slick-prev:before { font-family: FontAwesome; font-weight: 400; content: "\f053" }
.slide-text .slick-next:before { font-family: FontAwesome; font-weight: 400; content: "\f054" }
.news-control#down, .slide-text .slick-dots { bottom: 20px }
.news-slick h3, .slide-text .slick-dots li { margin: 0 }
.slide-text .slick-dots li button:before { color: #fff; font-size: 15px }
.search-multiple { position: relative; z-index: 10; margin-top: -70px; background: linear-gradient(to bottom, rgba(248, 248, 248, 0) 0, #f2f2f2 100%) }
.checkbox-card { display: block; cursor: pointer }
.checkbox-card input[type=checkbox]:checked+.content, .checkbox-card input[type=radio]:checked+.content { background: var(--bg-linear); border-left: 3px solid #000 }
.search-multiple .col-lg-7 { border-right: 1px solid #ccc }
.search-multiple .loaixe-item { cursor: pointer; padding: 0 10px; border-radius: 5px; background-color: #eee }
.box-product.hot .pic-product, .cart-product, .search-multiple .loaixe-item .image, .thongso p { margin-bottom: 0 }
.search-multiple .loaixe-item .image img { height: 80px }
.search-multiple .loaixe-item .name { font-size: 18px; font-weight: 700 }
.search-multiple .hangxe-item { border-radius: 5px; padding: 7px 5px 5px }
.search-multiple .hangxe-item .image { margin: 0 auto 5px }
.search-multiple .hangxe-item .image img { height: 20px }
#my-phone-circle, .blog-r .vert .simply-scroll-list li { height: 50px !important }
.search-multiple .giaban-item { padding: 5px; background: #eee; border-radius: 5px }
.search-multiple .giaban-item:hover, .search-multiple .hangxe-item:hover, .search-multiple .loaixe-item:hover { background: var(--bg-linear) }
.search { display: flex; width: 100% }
.search input::-webkit-input-placeholder { color: #313131 }
.search input:-moz-placeholder { color: #313131 }
.search input::-moz-placeholder { color: #313131 }
.search input:-ms-input-placeholder { color: #313131 }
.wrap-intro { background-color: #eee }
.news-intro:before { content: ""; position: absolute; width: 1px; height: calc(100% - 50px); top: 10px; left: 90px; background-color: #cacaca }
.news-scroll:after, .news-scroll:before { content: ""; position: absolute; width: 10px; height: 10px; left: 85px; border-radius: 100%; background-color: #cacaca }
.news-scroll:before { top: 10px }
.news-scroll:after { bottom: 40px }
.news-control { left: 85px; font-size: 13px; opacity: .5; z-index: 1; cursor: pointer }
.news-control:hover { opacity: 1; color: #ec2d3f }
.news-control#up { top: -10px }
.news-shadow { padding-bottom: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start }
.news-shadow .news-shadow-time { font-size: 13px; width: 75px; margin-right: 45px }
.news-shadow .news-shadow-time:after { content: ""; position: absolute; width: 20px; height: 20px; top: calc(50% - 20px / 2); right: -26px; background-repeat: no-repeat; background-position: center; background-image: url(../images/pattern-news.png) }
.news-shadow .news-shadow-article { width: calc(100% - 120px); padding: 14px 15px; border-radius: 10px; background-color: #fff; border: 1px solid #cecabb; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start }
.news-shadow .news-shadow-article:before { content: ""; position: absolute; top: calc(50% - 26px / 2); left: -13px; z-index: 0; border-top: 13px solid transparent; border-right: 13px solid #cecabb; border-bottom: 13px solid transparent }
.news-shadow .news-shadow-article:after { content: ""; position: absolute; top: calc(50% - 24px / 2); left: -11px; z-index: 1; border-top: 12px solid transparent; border-right: 11px solid #fff; border-bottom: 12px solid transparent }
.news-shadow .news-shadow-article .news-shadow-image { margin-right: 10px; width: 90px }
.news-shadow .news-shadow-article .news-shadow-info { width: calc(100% - 100px) }
.news-shadow .news-shadow-article .news-shadow-info .news-shadow-name { height: 36px; font-size: 15px; font-weight: 700 }
.news-shadow .news-shadow-article .news-shadow-info .news-shadow-name a { color: #222 }
.news .news-name a:hover, .news-shadow .news-shadow-article .news-shadow-info .news-shadow-name a:hover { color: #ec2d3f }
.news-shadow .news-shadow-article .news-shadow-info .news-shadow-desc { height: 38px; font-size: 13px }
.video { cursor: pointer; margin-bottom: 1rem }
.video .video-image { position: relative; margin-bottom: .75rem }
.video .video-image:before { content: ""; position: absolute; width: 50px; height: 35px; top: calc(50% - 50px / 2); left: calc(50% - 35px / 2); z-index: 1; background-repeat: no-repeat; background-image: url(../images/play.png) }
.video .video-name { text-align: center; font-size: 16px; color: #212529; margin-bottom: 0 }
.wrap-khuyenmai { background: url(../images/bg_khuyenmai.jpg) bottom center/cover no-repeat }
.khachhang-item { width: 450px; border-radius: 15px; padding: 15px; background-color: #f8f8f8; transition: .3s ease-in-out }
.owl-item.active.center .khachhang-item { transform: scale(1.2) }
.khachhang-item:hover, .owl-item.active.center .khachhang-item { color: #fff; background-color: var(--color-main) }
.khachhang-item:hover .name, .owl-item.active.center .khachhang-item .name { color: #fff !important }
.khachhang-item .icon { width: 60px; margin-bottom: 15px }
.khachhang-item .icon svg { color: #d0d5d9 }
.khachhang-item .info { display: flex; align-items: center; justify-content: space-between; background-color: transparent; padding: 15px; border-radius: 15px; transform: translate(-15px, 15px) }
.khachhang-item .image, .khachhang-item .image img { border-radius: 100% }
.khachhang-item .info .name { width: calc(100% - 80px); font-size: 18px; letter-spacing: 2px; color: var(--color-main); font-weight: 600; margin-bottom: 0 }
.khachhang-item .info .name span { display: block; color: #989898; font-size: 13px; font-weight: 400 }
.web-item .photo { width: 100%; height: 0; padding-bottom: 100%; position: relative }
.web-item:hover .photo span { background-position: bottom; background-repeat: no-repeat }
.web-item .photo span { position: absolute; width: 100%; height: 100%; background-size: 100% auto; -webkit-transition: 3s ease-in-out; -moz-transition: 2s ease-in-out; -ms-transition: 2s ease-in-out; transition: 2s ease-in-out; background-position: top; background-repeat: no-repeat }
.web-item:hover .info { opacity: 1; visibility: visible; bottom: 0 }
.web-item .info { position: absolute; padding: 10px; width: 100%; text-align: center; left: 0; bottom: -20px; opacity: 0; visibility: hidden; background: rgba(0, 0, 0, .35); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); -webkit-transition: .3s ease-in; transition: .3s ease-in; color: #fff }
.color-pro-detail, .size-pro-detail { transition: .3s; cursor: pointer; position: relative }
.web-item .info .name { font-size: 1.1rem }
.web-item .info .price span { font-size: 1.4rem }
.web-item .info .d-flex a { color: #fff; border-bottom: 2px solid; font-size: .9rem; padding: 2px 14px; transition: .4s }
.web-item .info .d-flex a:hover { color: var(--second) }
#frm-sellcar { position: absolute; right: 10%; top: 50%; transform: translateY(-50%) }
#frm-sellcar .frm-content { width: 450px; max-width: 100% }
#product-title, .pro-detail-title { margin: 0 0 12px; color: #20150f; font-family: Inter, sans-serif; font-size: 24px; font-weight: 700; line-height: 38px; text-transform: capitalize }
.left-pro-detail { width: 660px; max-width: 100% }
.camket-pro-detail { width: 250px }
.camket-pro-detail ol, .camket-pro-detail ul { list-style: none; padding: 0 }
.camket-pro-detail ul li { padding-left: 25px; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check2" viewBox="0 0 16 16"><path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0"/></svg>') left 5px no-repeat }
.right-pro-detail { width: calc(100% - 682px) }
.pro-detail-info { margin-bottom: 20px }
.pro-detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 14px }
.pro-detail-meta__item { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; line-height: 1.4 }
.pro-detail-meta__check { width: 17px; height: 17px; flex-shrink: 0 }
.pro-detail-meta__label { color: #717171; font-weight: 500 }
.pro-detail-meta__value {/* color: #ec3338; *//* font-weight: 500; */}
.pro-detail-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-bottom: 16px }
.pro-detail-price__label { color: #000; font-size: 16px; font-weight: 700 }
.price-new-pro-detail, .pro-detail-price__new { font-weight: 700; font-size: 21px; color: #ec3338; letter-spacing: 0 }
.price-old-pro-detail, .pro-detail-price__old { font-size: 16px; font-weight: 500; color: #838383; text-decoration: line-through; padding-left: 0 }
.pro-detail-attrs { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px }
.pro-detail-attr { display: flex; gap: 10px 14px; align-items: center }
.pro-detail-attr .attr-label-pro-detail, .pro-detail-attr__label { margin: 0; color: #000; font-size: 16px; font-weight: 600; line-height: 1.2 }
.pro-detail-attr__options { flex: 1 1 auto; gap: 5px !important }
.pro-detail-desc { margin-bottom: 18px; color: #727272; font-size: 16px; font-weight: 500; line-height: 21px }
.pro-detail-desc p { margin-bottom: .5rem }
.pro-detail-desc p:last-child { margin-bottom: 0 }
.pro-detail-cart.cart-pro-detail { gap: 12px; margin-bottom: 18px }
.pro-detail-cart__add, .pro-detail-cart__buy { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-height: 60px; border-radius: 6px; text-align: center; text-decoration: none !important; transition: background .2s ease, color .2s ease, border-color .2s ease }
.pro-detail-cart__buy { flex: 1 1 280px; padding: 8px 16px; background: #40b604; color: #fff !important }
.pro-detail-cart__buy:hover { background: #38a003; color: #fff !important }
.pro-detail-cart__buy-title { font-size: 16px; font-weight: 600; line-height: 1.2 }
.pro-detail-cart__buy-sub { margin-top: 2px; font-size: 12px; font-weight: 500; line-height: 1.2; text-transform: none; opacity: .95 }
.pro-detail-cart__add { flex: 0 1 210px; flex-direction: column; gap: 8px; padding: 8px 16px; background: #f4f4f4; border: 1px solid rgba(64, 182, 4, .35); color: #40b604 !important; font-size: 16px; font-weight: 600 }
.pro-detail-cart__add:hover { background: #fff; border-color: #40b604; color: #40b604 !important }
.pro-detail-cart__add img { width: 20px; height: 18px; flex-shrink: 0 }
.pro-detail-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-top: 4px }
.pro-detail-share { display: flex; align-items: center; gap: 10px; flex-wrap: wrap }
.pro-detail-share__label { color: #000; font-size: 16px; font-weight: 600 }
.pro-detail-views { display: inline-flex; align-items: center; gap: 6px; color: #333; font-size: 14px; font-weight: 500 }
.pro-detail-views img { width: 16px; height: 16px }
.pro-detail-swatch { width: 12px; height: 12px; border-radius: 50%; display: inline-block; margin-right: 6px; border: 1px solid rgba(0, 0, 0, .1); vertical-align: -1px }
.product-video { width: 71px; height: 71px; padding: 5px; border-radius: 10px; overflow: hidden; background: #fff; margin: 5px; box-shadow: 0 0 2px #333 }
.gallery-pro-detail { display: flex; align-items: stretch; justify-content: flex-start; gap: 14px; flex-wrap: nowrap; width: 100% }
.gallery-pro-detail__nav { width: 84px; flex-shrink: 0; display: flex; flex-direction: column; gap: 14px }
.gallery-pro-detail .slider-product-thumbs { width: 84px; height: 471px; overflow: hidden }
.gallery-pro-detail__nav.has-video .slider-product-thumbs { height: 374px }
.gallery-pro-detail .slider-product-thumbs .item { padding: 0 }
.gallery-pro-detail .slider-product-thumbs .item a, .product-video-thumb {}
.gallery-pro-detail .slider-product-thumbs .swiper-slide-thumb-active a, .gallery-pro-detail .slider-product-thumbs .swiper-slide-thumb-active .item a {}
.gallery-pro-detail .slider-product-thumbs .item a img, .product-video-thumb img {}
.product-video-thumb__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .18); pointer-events: none }
.product-video-thumb__play img { width: 27px; height: 27px; object-fit: contain }
.gallery-pro-detail .slider-products {flex: 1;min-width: 0;background: #fff;overflow: hidden;border-radius: 1rem;border: 0;box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1)}
.gallery-pro-detail .slider-products .item {}
.gallery-pro-detail .slider-products .item a {}
.gallery-pro-detail .slider-products .item img { width: 100%; height: 471px; max-height: 471px; object-fit: cover; border-radius: 10px }
.gallery-pro-detail .slider-products .swiper-button-prev, .gallery-pro-detail .slider-products .swiper-button-next { display: none }
.title-pro-detail h2 { font-size: 24px; font-weight: 500; color: var(--color-main); margin-bottom: 0 }
.comment-pro-detail { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start }
.social-plugin-pro-detail { margin-bottom: 1rem; margin-top: 0 !important }
.desc-pro-detail .attrs { margin: 0 0 20px; padding: 0; list-style: none }
.desc-pro-detail .attrs li:first-child { border-top: 0 }
.desc-pro-detail .attrs li { padding: 10px 0 7px; border-top: 1px solid #989898; color: #989898 }
.desc-pro-detail .attrs li svg { margin-top: -2px }
.attr-pro-detail { width: 100%; list-style: none; padding: 0; margin-left: 0 }
.attr-pro-detail li { margin-bottom: 5px }
.attr-label-pro-detail { font-size: 16px; font-weight: 600; margin: 0 !important; }
.attr-content-pro-detail { display: inline-block; margin-bottom: 0 }
.brand-pro-detail a { background: var(--color-red); color: #fff; border-radius: 2px; padding: 2px 5px }
.price-new-pro-detail { font-weight: 700; font-size: 18px; color: #ec3338 }
.price-old-pro-detail { font-size: 16px; font-weight: 500; color: #838383; text-decoration: line-through; padding-left: 0 }
.price-discount-pro-detail { font-size: 12px; font-weight: 600; color: #ec3338; border: 1px solid #ec3338; background: rgba(236, 51, 56, .08); padding: 2px 5px; border-radius: 4px; margin-left: 4px }
.color-pro-detail { vertical-align: top; width: 25px; height: 25px; border-radius: 100%; margin: 0 8px 5px 0; background-repeat: no-repeat; background-size: contain; background-position: center center; border: 1px solid #dadada }
.size-pro-detail { display: flex; align-items: center; justify-content: center; padding: 5px 10px; margin: 0 8px 0 0; border: 1px solid #dadada; background-color: #fff; border-radius: 5px; font-size: 13px }
.btn-option input:checked+span, .color-option input:checked+.circle, .size-pro-detail.active { border-color: #40b604; background: #40b604; color: #fff }
.btn-option { cursor: pointer; margin: 0 }
.btn-option span { display: inline-flex; align-items: center; justify-content: center; padding: 3px 20px; min-height: 28px; border: 1px solid #40b604; border-radius: 5px; background: #fff; color: #40b604; font-size: 14px; font-weight: 500; line-height: normal; white-space: nowrap; transition: .2s }
.btn-option:hover span { background: rgba(64, 182, 4, .08) }
.btn-option input:checked+span { background: #40b604; border-color: #40b604; color: #fff }
.cart-pro-detail a { text-align: center; cursor: pointer; text-transform: none }
.product-attr .attr-options { gap: 5px }
.color-pro-detail.active:after { content: ""; position: absolute; top: -3px; left: -3px; width: 29px; height: 29px; border: 1px solid var(--color-main); border-radius: 100%; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="%23cccccc" class="bi bi-check2" viewBox="0 0 16 16"><path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0"/></svg>') center center no-repeat }
.quantity-pro-detail { width: 150px; display: flex; align-items: center; justify-content: space-between; text-align: center; height: 45px; border-radius: 30px; overflow: hidden; border: 1px solid #dfdfdf }
.quantity-pro-detail span { line-height: 25px; padding: 0; width: 45px; height: 100%; color: #000; cursor: pointer; font-size: 22px; display: flex; align-items: center; justify-content: center; font-weight: 500 }
.btn-option, .color-option, .img-option, .img-option span { display: inline-block }
.quantity-pro-detail span.quantity-plus-pro-detail { border-left: 0 }
.quantity-pro-detail span.quantity-minus-pro-detail { border-right: 0 }
.quantity-pro-detail input { height: 100%; border: none; width: calc(100% - 90px); text-align: center; font-size: 15px }
.tags-pro-detail a { font-size: 12px; padding-bottom: .175rem; margin: 0 5px 5px 0 }
.tags-pro-detail a i { font-size: 11px; margin: 5px 5px 0 0 }
.tabs-pro-detail { margin-top: 2rem }
.tabs-pro-detail .nav-tabs .nav-link { border-top-width: 3px; color: #333; text-transform: uppercase; font-weight: 600; font-size: 1.1rem }
.tabs-pro-detail .nav-tabs .nav-item.show .nav-link, .tabs-pro-detail .nav-tabs .nav-link.active { border-top-color: #555 }
.thongso-pro-detail table { width: 100%; border-collapse: collapse }
.thongso-pro-detail table td, .thongso-pro-detail table th { border: 1px solid #ccc; padding: 10px 12px; text-align: left; vertical-align: top }
.thongso-pro-detail table th { background-color: #f7f7f7; font-weight: 600; width: 220px }
.pro-info-main, .pro-news-sidebar { background: #f9f9f9; border-radius: 8px; padding: 20px 18px 24px }
.pro-info-main__title, .pro-news-sidebar__title { margin: 0 0 16px; font-size: 21px; font-weight: 700; line-height: 1.3; color: #20150f }
.pro-news-sidebar__title { color: #000 }
.pro-info-main .pro-info-toc .wrap-toc {margin: 0 0 18px;padding: 0 14px;min-height: 40px;/* background: #f4f4f4; *//* border: 1px solid #40b604; *//* border-radius: 4px; */}
.pro-info-main .pro-info-toc .toc-head { min-height: 40px; font-size: 16px; font-weight: 600; color: #412921 }
.pro-info-main .pro-info-toc .pro-info-toc__icon, .pro-info-main .pro-info-toc .toc-head svg {color: white;fill: white;}
.pro-info-main .pro-info-toc .pro-info-toc__icon { display: inline-flex; align-items: center; margin-right: 10px }
.pro-info-main .pro-info-toc .toc-list { display: none; margin-top: 0; padding-bottom: 10px }
.pro-info-main .pro-info-toc .pro-info-toc__label {/* display: none; */}
.pro-info-main .pro-info-toc .toc-list li a {color: white !important;}
.pro-info-content#noidung { max-height: 615px; padding-bottom: 70px; overflow: hidden }
.pro-info-content#noidung.show-full-content { max-height: none; overflow: visible; padding-bottom: 70px }
.pro-info-content h1, .pro-info-content h2, .pro-info-content h3 { color: #412921; font-weight: 700; font-size: 18px; line-height: 1.4; margin: 1.1em 0 .55em }
.pro-info-content li, .pro-info-content p { color: #727272; font-size: 16px; font-weight: 500; line-height: 21px }
.pro-info-content img { max-width: 100%; height: auto; margin: 12px 0 }
.pro-info-more.hide-content { background: linear-gradient(transparent, #f9f9f9 72%); padding: 80px 0 8px }
.pro-info-more__btn { display: inline-flex; align-items: center; justify-content: center; min-width: 217px; height: 51px; padding: 0 24px; background: #40b604; color: #fff !important; font-size: 16px; font-weight: 500; border-radius: 0; text-decoration: none !important; transition: background .2s ease, opacity .2s ease }
.pro-info-more__btn:hover {/* background: #369a03; */color: #fff !important}
.pro-info-empty { color: #888; font-size: 14px }
.pro-news-sidebar__list.slick-pro-news { margin: 0; overflow: hidden; width: 100% }
.pro-news-sidebar__list.slick-pro-news.swiper-vertical { height: 470px }
.pro-news-sidebar__list.slick-pro-news .swiper-slide { height: auto }
.pro-news-slide { outline: 0; margin: 0 !important; padding: 0 0 22px }
.pro-news-slide .pro-news-card { display: block }
.pro-news-card { display: block; color: inherit; text-decoration: none !important }
.pro-news-card:hover .pro-news-card__name { color: #40b604 }
.pro-news-card__thumb { overflow: hidden; margin-bottom: 12px; background: #eee }
.pro-news-card__thumb img { display: block; width: 100%; height: 190px; object-fit: cover }
.pro-news-card__name { margin: 0 0 8px; font-size: 16px; font-weight: 600; line-height: 1.35; color: #000; transition: color .2s ease; min-height: 43px }
.pro-news-card__desc { margin: 0; font-size: 14px; font-weight: 500; line-height: 20.2px; color: #888 }
.pro-related {background: #fff;/* border: 1px solid #e6e6e6; */border-radius: 8px;padding: 22px 20px 18px;position: relative}
.pro-related__title { margin: 0 0 18px; font-size: 21px; font-weight: 700; line-height: 1.3; color: #20150f; text-transform: uppercase }
.pro-related .control-other { margin-top: 8px }
.color-option { cursor: pointer; position: relative }
.color-option .circle { width: 20px; height: 20px; border-radius: 50%; border: 1px solid #ccc; display: inline-block }
.img-option { cursor: pointer; margin: 4px }
.img-option span { border: 1px solid #ccc; border-radius: 4px; overflow: hidden; width: 60px; height: 60px; position: relative }
.img-option img { width: 100%; height: 100%; object-fit: cover }
.img-option input:checked+span { border-color: var(--color-main); box-shadow: 0 0 0 2px #000 inset }
.btn-option.disabled span, .color-option.disabled .circle, .img-option.disabled span { opacity: .4; cursor: not-allowed; pointer-events: none }
#advisory-modal .btn-close { position: absolute; top: 5px; right: 5px }
#advisory-modal .modal-dialog { max-width: 700px }
#quote-modal .modal-dialog { max-width: 480px }
#quote-modal .modal-content { border: 0; border-radius: 16px; overflow: hidden }
#quote-modal .modal-body { padding: 28px 24px 24px }
.quote-modal__close { position: absolute; top: 14px; right: 14px; z-index: 2 }
.quote-modal__title { margin: 0 36px 18px 0; color: #08194C; font-family: var(--font-primary); font-size: 20px; font-weight: 700; line-height: 1.35 }
.quote-modal__form { display: flex; flex-direction: column; gap: 12px }
.thongso { line-height: 1 }
.pic-news { width: 210px }
.info-news { width: calc(100% - 210px); padding-left: 20px }
.name-news { color: #252525; font-size: 17px; line-height: normal; font-weight: 600 }
.desc-news, .news .news-desc { margin-top: 5px; line-height: 22px }
.name-news:hover { color: var(--background-static) }
.time-news, .time-newshome { color: var(--color-gray); margin-bottom: 10px }
.desc-news { color: #676767 }
.news .news-name { margin-bottom: .5rem }
.news .news-name a { color: #333; font-size: 16px }
.news .news-time { color: #84878a; margin-bottom: .25rem }
.news .news-desc { color: #333 }
.othernews b { margin-bottom: 10px; font-size: 15px }
.othernews { position: sticky; top: 60px; z-index: 11 }
.contact-input, .contact-map { position: relative }
.contact-form { display: flex; flex-direction: column; gap: 20px }
.contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start }
.contact-form__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch }
.contact-form .form-consult__btn { width: auto; flex: 1 1 220px; min-width: 0; margin-top: 0 }
.contact-form__reset { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 140px; height: 59px; padding: 0 24px; border: 1px solid #C6C6C6; border-radius: 104px; background: #fff; color: #333; font-family: var(--font-primary); font-size: 16px; font-weight: 600; line-height: 20px; cursor: pointer }
.contact-form__reset:hover { border-color: #08194C; color: #08194C }
.pic-news-other { width: 40%; border-radius: 7px; overflow: hidden }
.info-news-other { width: 60%; padding: 0 10px }
.name-news-other { color: #252525; font-weight: 600; padding: 0 !important; display: -webkit-box !important; font-size: 14px !important; margin-bottom: 0 }
.desc-news-other { color: #666; font-size: 13px }
.baogia-item { display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--color-main); border-radius: 5px }
.baogia-item h3 { padding: 0 10px; font-size: 16px; margin-bottom: 0 }
.baogia-item span { font-size: 18px; transition: .3s; background: var(--color-main); color: #fff; display: flex; width: 80px; height: 66px; justify-content: center; align-items: center; text-transform: uppercase; border-radius: 3px }
.bg { background: linear-gradient(0deg, #ccc 0, rgba(153, 153, 153, 0) 100%) }
.author-item .image, .news-slick .img { width: 150px }
.author-item .info { width: calc(100% - 175px) }
.author-item .name, .fixbar ul li a i { font-size: 20px }
.author-item .subname { color: #999 }
.form-floating-cus>select, .form-floating.form-floating-cus>input { height: 45px; padding: .7rem .5rem }
.form-floating.form-floating-cus>textarea { height: 100px }
.form-floating.form-floating-cus>label { padding: 10px 5px; color: var(--color-gray) }
.contact-article { margin-bottom: 1.5rem }
.contact-input, .news-slick h3 a.name-newshome { margin-bottom: 10px }
.contact-input input, .contact-input textarea { border-radius: 0; border-top: none; border-left: none; border-right: none }
.contact-input input:focus, .contact-input textarea:focus { box-shadow: none; outline: 0 }
.contact-input textarea { resize: none; height: 150px }
.contact-input .custom-file-label::after { content: attr(title) }
.contact-map { overflow: hidden; height: 350px }
.contact-map iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important }
.blink { -webkit-animation-name: blink; -webkit-animation-duration: 1s; -webkit-animation-timing-function: linear; -moz-animation-name: blink; -moz-animation-duration: 1s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; animation-name: blink; animation-duration: 1s; animation-timing-function: linear; animation-iteration-count: infinite }
.wrap-frame { position: fixed; width: 50px; height: auto; right: 20px; bottom: 100px; z-index: 10 }
.btn-frame { position: relative; display: block; width: 50px; height: 50px; cursor: pointer; margin-bottom: 30px }
.btn-frame i { width: 100%; height: 100%; border-radius: 100%; background: var(--color-submain); position: relative; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center }
.btn-frame i svg { color: #fff; fill: #fff }
.btn-frame .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite }
.btn-frame .kenit-alo-circle { width: 120%; height: 120%; top: -10%; right: -10%; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid rgba(130, 188, 69, .8); opacity: .1; border-color: var(--color-submain); opacity: .5 }
.btn-frame .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn }
.btn-frame .animated, .js-facebook-messenger-box.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
.btn-frame .kenit-alo-circle-fill { width: 140%; height: 140%; top: -20%; right: -20%; position: absolute; border-radius: 100%; border: 2px solid transparent; background-color: rgba(130, 188, 69, .35); opacity: .4 }
.btn-frame .pulse { -webkit-animation-name: pulse; animation-name: pulse }
.btn-frame span { position: absolute; top: 50%; right: 0; transform: translateY(-50%); opacity: 0; padding: 6px 45px 6px 20px; border-radius: 30px; color: #fff; background-color: var(--color-submain); white-space: nowrap; transition: .3s ease-in-out; width: 0; overflow: hidden }
.fixbar ul, .plugbar ul, .toolbar ul { list-style: none; padding: 0 }
.js-facebook-messenger-box svg#close-icon, .js-facebook-messenger-box svg#fb-msng-icon { -webkit-transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out; position: absolute }
.btn-frame:hover span { opacity: 1; width: 265px }
.js-facebook-messenger-top-header { background: #487dfc; color: #fff; height: 35px; display: flex; align-items: center; justify-content: center; text-align: center; border-radius: 5px 5px 0 0 }
.js-facebook-messenger-container.closed, .js-facebook-messenger-tooltip.closed { display: none !important }
.js-facebook-messenger-tooltip { display: none; position: fixed; text-align: center; border-radius: 10px; overflow: hidden; font-size: 12px; line-height: 1; padding: 10px; border: 1px solid rgba(0, 0, 0, .1); -webkit-box-shadow: rgba(0, 0, 0, .15) 0 2pt 10pt; box-shadow: rgba(0, 0, 0, .15) 0 2pt 10pt }
.js-facebook-messenger-close-tooltip { width: 10px; height: 10px; display: inline-block; cursor: pointer; margin-left: 10px }
.js-facebook-messenger-box.rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand }
.js-facebook-messenger-box { display: block; position: fixed; cursor: pointer; bottom: 150px; right: 17px; width: 56px; height: 56px; text-align: center; background: #1182fc; border-radius: 100%; overflow: hidden; -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .3); box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .3) }
.js-facebook-messenger-box.rotate svg#fb-msng-icon, .js-facebook-messenger-box.rotate.open svg#close-icon { -webkit-transform: rotate(0); transform: rotate(0) }
.js-facebook-messenger-box svg#fb-msng-icon { width: 32px; height: 33px; top: 13px; left: 12px; opacity: 1; overflow: hidden; transition: opacity 160ms ease-in-out, transform 160ms ease-in-out, -webkit-transform 160ms ease-in-out }
.js-facebook-messenger-box.rotate svg#close-icon { -webkit-transform: rotate(-45deg); transform: rotate(-45deg) }
.js-facebook-messenger-box svg#close-icon { opacity: 0; width: 19px; height: 20px; top: 19px; left: 19px; transition: opacity 160ms ease-in-out, transform 160ms ease-in-out, -webkit-transform 160ms ease-in-out }
.js-facebook-messenger-container { width: 250px; position: fixed; opacity: 0; -webkit-transform: translateY(50px); transform: translateY(50px); bottom: 110px; right: 90px; border-radius: 10px; pointer-events: none; -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, .06), 0 2px 32px rgba(0, 0, 0, .16); box-shadow: 0 1px 6px rgba(0, 0, 0, .06), 0 2px 32px rgba(0, 0, 0, .16); -webkit-transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out; transition: transform 160ms ease-in-out, opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out }
.js-facebook-messenger-top-head { display: block; position: relative; text-align: center; line-height: 1; padding: 10px; font-size: 14px; border-top-left-radius: 10px; border-top-right-radius: 10px; color: #fff; background: #1182fc; width: 220px }
.js-facebook-messenger-container iframe, .js-facebook-messenger-container-button iframe { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px }
.cart-fixed, .cart-fixed span { border-radius: 100%; text-align: center }
.js-facebook-messenger-box, .js-facebook-messenger-button, .js-facebook-messenger-tooltip { z-index: 999 }
.js-facebook-messenger-container, .js-facebook-messenger-container-button { z-index: 1000 }
.js-facebook-messenger-tooltip { color: #404040; background: #fff; bottom: 97px; right: 97px }
.js-facebook-messenger-container.open { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; pointer-events: all }
.js-facebook-messenger-box.open svg#fb-msng-icon { opacity: 0 }
.cart-fixed { position: fixed; right: 20px; bottom: 290px; z-index: 10; background: #4b4f56; width: 50px; height: 50px; color: #fff !important; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center }
.fixbar, .toolbar { position: fixed; z-index: 500; bottom: 0 }
.fixbar, .toolbar ul li a { width: 100%; display: block }
.cart-fixed:hover { background: var(--color-main) }
.cart-fixed span { position: absolute; top: 0; right: -5px; color: #fff; width: 25px; height: 25px; background: #ec2d3f; line-height: 25px; font-size: 11px }
.support-online a, .support-online i { width: 40px; height: 40px; position: relative }
@keyframes tada {
    0%, to { transform: scaleX(1) }
    10%, 20% { transform: scale3d(.9, .9, .9) rotate(-3deg) }
    30%, 50%, 70%, 90% { transform: scale3d(1.3, 1.3, 1.3) rotate(3deg) }
    40%, 60%, 80% { transform: scale3d(1.3, 1.3, 1.3) rotate(-3deg) }
}
.toolbar { background: var(--background-static); width: 100%; padding: 3vw; height: auto; left: 0; max-height: 65px }
.toolbar ul { display: flex; align-items: center; justify-content: space-between; margin: 0 }
.toolbar ul li { text-align: center; width: 25% }
.toolbar ul li a { cursor: pointer }
.toolbar ul li a img { height: 20px; width: 20px; animation: 1.2s infinite tada }
.toolbar ul li a span { color: #fff; font-size: 10px }
.fixbar { background: #f0eff4; border-top: 1px solid #ddd; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 50px }
.plugbar ul, .wcircle-icon { display: -webkit-box; display: -ms-flexbox; -webkit-box-align: center }
.fixbar ul { margin: 0 }
.fixbar ul li { margin: 0 auto 10px; text-align: center; width: 25%; float: left }
.fixbar .icon-cart-mobile, .fixbar .icon-cart-new, .fixbar .icon-home-new, .fixbar .icon-hotdeal-new { width: 20px; height: 20px; display: block; margin: 8px auto 0 }
.fixbar .icon-cart-mobile { background: url(../images/cart-mobile.png) no-repeat }
.cart-total-head-mobile { font-size: 10px; position: absolute; background: red; color: #fff !important; border-radius: 50%; height: 15px; width: 15px; line-height: 15px; top: 5px; margin-left: 5px }
.desc-newshome, .listvideos, .name-newshome, .name-video { color: var(--color-black) }
.fixbar ul li a { font-size: 11px; text-decoration: none; color: #333 }
.plugbar { position: fixed; bottom: 0; left: 0; border-top: 1px solid #eae6e6; width: 100%; right: 0; max-width: 767px; margin: 0 auto; background: #fff; padding: 9px 10px 10px 7px; z-index: 10 }
.listvideos, .newshome-intro .view-newshome, .owl-video { margin-top: 10px }
.plugbar ul { margin: 0; display: flex; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between }
.plugbar ul li { width: 20%; float: left }
.plugbar ul li a { display: block; color: #696969; font-size: 12px; text-align: center; position: relative }
.plugbar ul li a i { font-size: 20px; color: #696969 }
.plugbar ul li a span { position: absolute; width: 50px; height: 50px; top: -40px; left: calc(50% - 50px / 2); font-size: 14px; display: block; border: 1px solid rgba(234, 230, 230, .5); border-radius: 100% }
.support-online { position: fixed; z-index: 999; left: 10px; bottom: 0 }
.support-online a { margin: 20px 10px; text-align: left; display: block }
.support-online a span, .support-online i { text-align: center; z-index: 999; color: #fff }
.support-online i { background: #43a1f3; border-radius: 100%; font-size: 20px; line-height: 1.9 }
.support-online a span { border-radius: 2px; background: #67b634; padding: 9px; display: none; width: 180px; margin-left: 10px; position: absolute; top: 0; left: 40px; -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out; -webkit-animation: .7s headAnimation; animation: .7s headAnimation }
.support-online a span:before { content: ""; width: 0; height: 0; border-style: solid; border-width: 10px 10px 10px 0; border-color: transparent #67b634 transparent transparent; position: absolute; left: -10px; top: 10px }
.support-online .kenit-alo-circle-fill { width: 60px; height: 60px; top: -10px; position: absolute; border-radius: 100%; border: 2px solid transparent; background-color: rgba(0, 175, 242, .5); opacity: .75; right: -10px }
.wcircle-menu-item, .wcircle-menu-item img { height: 50px; border-radius: 50%; width: 50px }
.support-online .kenit-alo-circle { width: 50px; height: 50px; top: -5px; right: -5px; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid #0089b9; opacity: .1; opacity: .5 }
.wcircle-icon, .wcircle-icon:before, .wcircle-menu-item { background: var(--color-main) }
.support-online .support-online .btn-support { cursor: pointer }
.support-online .mes i { background: orange }
.support-online .call-now i { background: green }
.widget-mobile { position: fixed; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: 10px; z-index: 9999999 }
#my-phone-circle { position: relative; width: 50px !important }
.wcircle-open .wcircle-icon i:before { content: "\f00d" }
.wcircle-icon { border-radius: 50%; position: relative !important; display: flex !important; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center }
.wcircle-icon:before { position: absolute; content: ""; width: 60px; height: 60px; border: 1px solid #fff; border-radius: 50%; left: -5px; top: -5px; -webkit-animation: 1s ease-in-out infinite pulse; animation: 1s ease-in-out infinite pulse }
.wcircle-icon:after { position: absolute; content: ""; width: 80px; height: 80px; background: rgba(204, 44, 50, .5); border-radius: 50%; left: -15px; top: -15px; -webkit-animation: 2s ease-in-out infinite zoomIn; animation: 2s ease-in-out infinite zoomIn }
.wcircle-menu { position: absolute !important; left: 0; top: 0; display: none }
.box-product, .color-product, .pic-product, .video-main { position: relative }
.wcircle-menu-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center }
.wcircle-icon i, .wcircle-menu-item i { font-size: 25px; color: #fff; position: relative; z-index: 9999 }
.shake-anim { -webkit-animation: 1s ease-in-out infinite shake-anim; animation: 1s ease-in-out infinite shake-anim; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50% }
.video-main { height: 400px }
.listvideos, .view-newshome { height: 40px; border: 1px solid #ccc }
.video-main iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0 }
.listvideos { width: 100%; padding: 0 10px; cursor: pointer }
.item-video1 img { max-height: 292px }
.item-video2 img { height: 102px }
.pic-video-2:before, .pic-video:before { content: ""; position: absolute; width: 50px; height: 35px; top: calc(50% - 50px / 2); left: calc(50% - 35px / 2); z-index: 1; background: url(../images/play.png) center center/cover no-repeat; cursor: pointer }
.name-video { font-size: 16px; margin-bottom: 0 }
.attr-product, .name-newshome { font-size: 14px }
.newshome-intro .name-newshome { margin: 10px 0 }
.newshome-scroll { width: 50%; overflow: hidden; max-height: 406px }
.news-slick { display: flex; margin-bottom: 20px }
.news-slick .info { width: calc(100% - 150px); padding-left: 15px }
.flex_ttnb { display: flex; flex-flow: row wrap; justify-content: space-between }
.newshome-intro { width: calc(50% - 20px) }
.pic-newshome-normal { float: left; width: 34%; margin-right: 3%; margin-bottom: 0 }
.info-newshome-normal { float: left; width: calc(100% - 37%) }
.name-newshome { line-height: normal }
.desc-newshome { margin-bottom: 0; text-align: justify }
.view-newshome { width: 140px; display: flex; align-items: center; justify-content: center; color: #000 }
.box-product { border-radius: 8px; overflow: visible; background: 0 0; border: 0; padding: 0; height: 100%; border: 1px solid transparent; padding: 4px 5px }
.box-product .icon { width: 80px; height: 2px; background: #333; margin: 0 auto 1rem }
.color-product { width: 20px; height: 20px; border-radius: 100%; cursor: pointer; margin-left: 2px; border: 1px solid rgba(0, 0, 0, .12); flex-shrink: 0 }
.colors-product { gap: 4px; margin: 8px 0 0; min-height: 20px }
.color-product.active::after { content: ""; position: absolute; top: -2px; left: -2px; width: 24px; height: 24px; border: 1px solid #40b604; border-radius: 100%; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="%23ffffff" class="bi bi-check2" viewBox="0 0 16 16"><path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0"/></svg>') center center no-repeat }
.pic-product { margin-bottom: 0; overflow: hidden; border-radius: 7px; border: .73px solid #dfdfdf; background: #fff; transition: border-color .25s ease }
.pic-product .scale-img { display: block; width: 100%; height: 100% }
.pic-product .scale-img:before { display: none }
.pic-product img { width: 100%; height: 100%; object-fit: cover; border-radius: 7px; transition: transform .45s ease }
.product-tool { opacity: 0; visibility: hidden; position: absolute; width: 100%; left: 0; bottom: 0; z-index: 1 }
.product-tool a { cursor: pointer; width: 50%; padding: 10px; text-align: center; color: #fff; background-color: rgb(0 0 0 / .6) }
.product-tool a:hover { background-color: rgb(0 0 0 / .8) }
.product-tool a svg { margin-right: 5px }
.product-tool a span { text-transform: capitalize; font-size: 12px; font-weight: 300 }
.box-product:hover .product-tool { opacity: 1; visibility: visible }
.info-product { padding-top: 12px }
.info-product .desc { max-height: 100px; overflow: auto; height: 100px }
.info-product h3 { margin: 0 }
.name-product { margin: 0; min-height: 36px; color: #333; font-family: Inter, sans-serif; font-size: 14px; font-style: normal; font-weight: 600; line-height: 1.3; text-transform: capitalize; transition: color .2s ease }
.price-product { margin: 17px 0 0; line-height: 1; gap: 12px }
.price-new { position: relative; display: inline-block; font-family: Inter, sans-serif; font-size: 16px; color: #e30000; font-weight: 700; letter-spacing: 0 }
.price-old { font-family: Inter, sans-serif; font-size: 12px; font-weight: 500; color: #727272; text-decoration: line-through }
.box-product.hot { margin: 0; padding: 0; border-radius: 20px; overflow: hidden }
.box-product.hot .info { position: absolute; bottom: 0; left: 0; width: 100%; padding: 15px 0; background-color: rgba(105, 215, 249, .5) }
.product-inner .slider-index-thumbs { margin: -10px 0 }
.box-product-list { display: flex; padding: 5px 10px }
.box-product-list .info-product { width: calc(100% - 32%) }
.box-product-list .pic-product { width: 30%; padding: 0; margin: 0 auto; text-align: center }
.price-per { position: absolute; top: 8px; right: 7px; background: #e30000; border: 0; border-radius: 50%; width: 34px; height: 34px; text-align: center; z-index: 2; display: flex; justify-content: center; align-items: center; color: #fff; font-family: Montserrat, sans-serif; font-size: 10.26px; font-style: italic; font-weight: 700; line-height: 1; pointer-events: none }
.box-images, .cats-bar, .cats-bar-icon span, .choose-list button, .dm-noibat, .dm-noibat a { position: relative }
.cart-product span { cursor: pointer; width: calc(50% - 3px); color: #fff; text-transform: capitalize; text-align: center; padding: 7px 5px; border-radius: 3px }
.blog-l-img a, .box-images img { width: 100%; transition: .5s }
.bg-red, .cart-add { background-color: var(--color-red) }
.cart-add:hover { background-color: var(--color-dark-red) }
.cart-buy { background-color: var(--color-green) }
.cart-buy:hover { background-color: var(--color-dark-green) }
.dm-noibat { max-width: 1000px; margin: auto auto 40px }
.dm-noibat a { cursor: pointer; color: #333; transition: .4s; text-transform: capitalize; font-weight: 400; font-size: 16px; text-align: center; display: block; background: #f7f7f7; border-radius: 5px; border: 1px solid #eaeaea; height: 100%; padding: 10px }
.dm-noibat a.active, .dm-noibat a:hover { background: var(--background-static); color: #fff }
.cats-bar { width: 50px; padding-top: 3px }
.cats-bar-icon { width: 30px; cursor: pointer }
.cats-bar-icon span { display: block; width: 100%; height: 2px; background: #505050; transition: .3s }
.cats-bar-icon span+span { margin-top: 5px }
.cats-bar-icon.active span:first-child { animation: .7s forwards top }
.cats-bar-icon.not-active span:first-child { animation: .7s forwards top-2 }
.cats-bar-icon.active span:nth-child(2) { animation: .7s forwards scaled }
.cats-bar-icon.not-active span:nth-child(2) { animation: .7s forwards scaled-2 }
.cats-bar-icon.active span:nth-child(3) { animation: .7s forwards bottom }
.cats-bar-icon.not-active span:nth-child(3) { animation: .7s forwards bottom-2 }
@keyframes top {
    0% { top: 0; transform: rotate(0) }
    50% { top: 6px; transform: rotate(0) }
    100% { top: 6px; transform: rotate(45deg) }
}
@keyframes top-2 {
    0% { top: 6px; transform: rotate(45deg) }
    50% { top: 6px; transform: rotate(0) }
    100% { top: 0; transform: rotate(0) }
}
@keyframes bottom {
    0% { bottom: 0; transform: rotate(0) }
    50% { bottom: 8px; transform: rotate(0) }
    100% { bottom: 8px; transform: rotate(135deg) }
}
@keyframes bottom-2 {
    0% { bottom: 8px; transform: rotate(135deg) }
    50% { bottom: 8px; transform: rotate(0) }
    100% { bottom: 0; transform: rotate(0) }
}
@keyframes scaled {
    100%, 50% { transform: scale(0) }
}
@keyframes scaled-2 {
    0%, 50% { transform: scale(0) }
    100% { transform: scale(1) }
}
.cats-owl.list-hot { width: calc(100% - 50px) }
.choose-list button { cursor: pointer; display: inline-block; padding: 10px 20px; background-color: transparent; font-weight: 500; font-size: 14px; border: 1px solid #e8e8e8; outline: 0; border-radius: 30px; transition: .3s ease-in-out; border-radius: 63px; border: 1px solid #dfdfdf; background: #fff }
.blog-l p, .box-newsi { font-weight: 400; color: #666 }
.choose-list button span { position: relative; z-index: 3; font-size: 20px }
.fancybox-tiktok-layout { width: auto !important; padding: 0; background: 0 0 }
.blog-flex { display: flex; flex-flow: wrap; justify-content: space-between; align-items: flex-start }
.blog-l { float: left; width: 46.1538461538%; line-height: 24px }
.blog-l-img { max-width: 100%; overflow: hidden; margin-bottom: 7px }
.blog-l-img:hover img { transform: scale(1.1) }
.blog-l h3 a { font-size: 16px; color: #2f2f2f; line-height: 20px; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; font-weight: 600 }
.blog-l p { margin: 9px 0 10px; font-size: 14px; line-height: 18px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden }
.box-newsi, .box-newsi h3 { line-height: 20px; font-size: 13px }
.box-newsi h3, .box-newsi h3 a { -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden }
.blog-l a.blog-l-more { font-weight: 500; font-size: 13px; color: #2f2f2f; background: #fff; display: inline-block; vertical-align: top; padding: 8px 38px 7px; transition: .5s; border-radius: 0; text-transform: none; border: 1px solid #333; text-transform: uppercase }
.blog-l a.blog-l-more:hover { background: #2f2f2f; color: #fff }
.blog-r { float: right; width: 51.282051%; height: 317px; overflow: hidden }
.blog-r ul li { margin-bottom: 10px !important; border-bottom: 1px solid #e8e8e8 }
.box-newsi-img { width: 104px; max-width: 36%; float: left; margin-right: 10px }
.box-newsi h3 { font-weight: 500; margin: 0 0 7px; padding: 0 }
.box-newsi h3 a { color: #333; font-size: 16px }
.box-newsi-more { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden }
.gird-images { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 238px); grid-gap: 15px 15px }
.box-images { overflow: hidden; border-radius: 10px }
.box-images img { position: absolute; height: 100% !important; object-fit: cover; object-position: center; left: 0; top: 0 }
.box-images:first-child { grid-column: 1/3; grid-row: 1/3 }
.border-1 { border: 1px solid }
.color-yellow { color: #ff0 }
.hotline a { font-size: 14px; font-weight: 600; animation: 1s ease-in-out infinite blinkColor; transition: color .3s ease-in-out; line-height: 16px }
.gradien-pro { background: #ffe5e3; background: linear-gradient(86deg, #ffe5e3 20%, #ced1fe 70%); border: 3px solid var(--color-submain) }
.gradient-title { background: #b7c4ff; background: linear-gradient(178deg, #b7c4ff 20%, #7185fc 70%); border-radius: 0 0 90px 90px; width: 404px; text-align: center; justify-content: center; color: #fff }
.why-icon { width: 49px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #fff }
.bg-duhoc, .bg-form, .bg-khoahoc, .bg-teacher { background-repeat: no-repeat }
.why-center-img, .why-icon img { object-fit: contain }
.why-title { line-height: 1.25; font-size: clamp(16px, 2vw, 24px); margin-bottom: 10px }
.color-666666 { color: #666 }
.line-height-15 { line-height: 1.5 }
.team { background-color: #f9fbfa }
.bg-duhoc, .bg-f7 { background-color: #fff7f7 }
.text-shadow { text-shadow: 2px 4px 2px var(--color-main) }
.bg-duhoc { background-image: url(../images/bg-duhoc.png) }
.bg-khoahoc { background-image: url(../images/bg-khoahoc.png) }
.bg-form { background-image: url(../images/bg-form.png) }
.bg-teacher { background-image: url(../images/bg-duhoc.png) }
.newsletter-input2 input, .newsletter-input2 select { padding: 11px 10px }
.teacher-item .info { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(255, 255, 255, 0); box-shadow: 0 4px 30px rgba(0, 0, 0, .1); backdrop-filter: blur(7.7px); -webkit-backdrop-filter: blur(7.7px) }
.text-red { color: var(--color-red) !important }
.journey .col-12:first-child, .journey .col-12:nth-child(4) { margin-top: 20px }
.text-yellow { color: gold }
.feedback-item .p-2 { background-image: url(../images/six.png); background-repeat: no-repeat; background-position: 96% 96% }
.feedback-item .description { height: 147px }
.wrap-khoa-hoc:nth-child(odd) .order { order: -1 }
.bg-khac { background-image: url(../images/bg-khac.png); background-position: center }
.wrap-hinhanh { background: #e5cfff; background: linear-gradient(178deg, #e5cfff 0, #ffebce 38%, #fff 70%, #fff 84%) }
a.category__btn { border-radius: 9px; border: 1px solid silver; background: #fff; padding: 15px; display: inline-block; color: #000; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 600; line-height: normal }
a.category__btn svg { margin-right: 4px }
.CategoriesCat__Item:hover .CategoriesCat__Name { color: #40b604 }
.BannerSales__list { display: flex; gap: 20px }
a.BannerSaleItem { width: 50%; border-radius: 15px; overflow: hidden }
.cart b { background: red }
.cart b { font-family: Inter; font-size: 10px !important; font-style: normal; font-weight: 700; line-height: normal; color: #fff !important; width: 17px; height: 17px; display: flex; justify-content: center; align-items: center; border-radius: 50% }
section#FlashSale { margin: 24px 0 32px }
section#FlashSale .widthBox { position: relative }
.bannerFlashSale { position: relative; z-index: 2; max-width: 944px; width: 100%; margin: 0 auto -36px }
.bannerFlashSale a, .bannerFlashSale img { display: block; width: 100%; height: auto; border-radius: 12px }
.FlashSale__List { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px 8px; border-radius: 20px; border: 5px solid #e31c23; background: #f6f6f6; padding: 52px 12px 16px; margin-top: 0 }
.FlashSale__List .box-product { min-width: 0; background: #fff; border-radius: 10px }
section.wrap-product-list .container { border-radius: 9.246px; border: .925px solid #d2d2d2; background: #fff; margin: 15px auto; padding: 21px 13px }
.box-product:hover .pic-product { border-color: #d0d0d0 }
.box-product:hover .name-product { color: #40b604 }
.box-product:hover .pic-product .scale-img img, .box-product:hover .pic-product .scale-img:hover img:first-child { transform: scale(1.04) }
.product-loadmore-btn-wrap { text-align: center; margin-top: 20px; margin-bottom: 8px }
.btn-load-more-product { display: inline-block; color: #5bb348; font-size: 15px; font-weight: 500; line-height: 1.4; text-decoration: none; border-bottom: 1px solid #5bb348; padding-bottom: 1px; transition: color .2s ease, border-color .2s ease, opacity .2s ease }
.btn-load-more-product:focus, .btn-load-more-product:hover { color: #4a9a3a; border-bottom-color: #4a9a3a; text-decoration: none }
.btn-load-more-product.disabled { opacity: .6; pointer-events: none }
.wrap-pro-detail, .wrap-pro-info {/* background: #fff; */padding: 10px 0 40px}
.home-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px }
.home-section-head__title { margin: 0; font-size: 24px; font-weight: 700; line-height: 1.25; color: #000; text-transform: uppercase }
.home-section-link { display: inline-block; font-size: 16px; font-weight: 500; line-height: 1.25; color: #40b604 !important; text-decoration: none !important; border-bottom: 1px solid #40b604; padding-bottom: 2px; white-space: nowrap; transition: opacity .2s ease }
.home-section-link:hover { opacity: .85 }
.project-accordion { display: flex; gap: 11px; height: 574px; width: 100% }
.project-accordion__item { position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; border: 1px solid #4e4e4e; cursor: pointer; transition: flex .45s cubic-bezier(.25, .8, .25, 1) }
.project-accordion__item.is-active { flex: 4.6 1 0; border-color: #565656 }
.project-accordion__media { position: absolute; inset: 0 }
.project-accordion__media img { width: 100%; height: 100% !important; object-fit: cover; display: block; filter: grayscale(100%); transform: scale(1.02); transition: filter .45s ease, transform .45s ease }
.project-accordion__shade { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); transition: background .45s ease, opacity .45s ease }
.project-accordion__item.is-active .project-accordion__media img { filter: none; transform: scale(1) }
.project-accordion__item.is-active .project-accordion__shade { background: linear-gradient(180deg, rgba(0, 0, 0, 0) 48%, rgba(0, 0, 0, .91) 85%) }
.project-accordion__content { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 28px 32px 36px; color: #fff; opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity .3s ease, transform .35s ease, visibility .3s; pointer-events: none }
.project-accordion__item.is-active .project-accordion__content { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto }
.project-accordion__name { margin: 0 0 12px; font-size: 28px; font-weight: 700; line-height: 1.2; color: #fff; text-transform: capitalize }
.project-accordion__meta { margin: 0 0 18px; padding-left: 22px; list-style: disc; color: #fff }
.project-accordion__meta li { font-size: 16px; font-weight: 700; line-height: 1.35; margin-bottom: 2px }
.project-accordion__btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 165px; height: 50px; padding: 0 22px; border: 1px solid #fff; border-radius: 54px; color: #fff !important; font-size: 16px; font-weight: 600; text-decoration: none !important; background: 0 0; transition: background .2s ease, color .2s ease }
.project-accordion__btn:hover { background: rgba(255, 255, 255, .12); color: #fff !important }
.project-accordion__btn img { width: 12px; height: 12px; transform: scaleX(1) rotate(90deg); flex-shrink: 0 }
.home-news { padding: 30px 0 }
.home-news__title { margin: 0 0 16px; color: var(--primary-color); font-family: Inter, sans-serif; font-size: 30px; font-weight: 800; line-height: 50px; text-align: center; text-transform: uppercase }
.home-news__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px }
.home-news-card { display: flex; flex-direction: column; box-sizing: border-box; height: 214px; min-height: 214px; padding: 5px 6px 13px; border-radius: 10px; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, .1); color: inherit; text-decoration: none !important; transition: box-shadow .25s ease }
.home-news-card__thumb { display: block; overflow: hidden; width: 100%; height: 140px; margin: 0 0 10px; border: 2px solid transparent; border-radius: 10px; background: #eee; box-sizing: border-box; transition: border-color .25s ease, box-shadow .25s ease }
.home-news-card__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease }
.home-news-card:hover .home-news-card__thumb img { transform: scale(1.04) }
.home-news-card__name { margin: 0; height: 46px; overflow: hidden; color: #4e4e4e; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px; transition: font-weight .2s ease }
.home-news-card:hover { box-shadow: 0 0 10px rgba(8, 91, 50, .3) }
.home-news-card:hover .home-news-card__thumb { border-color: var(--primary-color) }
.home-news-card:hover .home-news-card__name { font-weight: 700 }
.home-news__more { display: flex; justify-content: center; margin-top: 30px }
.home-newsletter {}
.home-newsletter__inner { position: relative; background: #062f66; border-radius: 4px }
.home-newsletter__content { display: flex; flex-direction: column; justify-content: center; min-height: 330px; padding: 30px 54px 30px 38px }
.home-newsletter__copy { margin-bottom: 18px }
.home-newsletter__title { margin: 0 0 7px; color: #fff; font-family: Roboto, sans-serif; font-size: 22px; font-weight: 700; line-height: 1.3 }
.home-newsletter__desc { margin: 0; color: #fff; font-family: Roboto, sans-serif; font-size: 13px; font-weight: 400; line-height: 1.5 }
.home-newsletter__form { width: 100%; max-width: 590px }
.home-newsletter .newsletter-input {width: 100%;overflow: hidden;border-radius: 7px;background: #fff}
.home-newsletter__input, .home-newsletter .newsletter-input textarea {width: 100%;height: 40px;padding: 8px 12px;border: 0;/* border-radius: 10px; */background: #fff !important;color: #333;font-size: 13px;line-height: 1.4;box-shadow: none !important}
.home-newsletter__textarea, .home-newsletter .newsletter-input textarea.home-newsletter__textarea {height: 82px;min-height: 66px;resize: none}
.home-newsletter__input::placeholder { color: #898989; font-size: 13px }
.home-newsletter__input:-webkit-autofill, .home-newsletter__input:-webkit-autofill:active, .home-newsletter__input:-webkit-autofill:focus, .home-newsletter__input:-webkit-autofill:hover { -webkit-text-fill-color: #333 !important; caret-color: #333; transition: background-color 99999s ease-out 0s; box-shadow: 0 0 0 1000px #fff inset !important }
.home-newsletter__button-wrap { position: static; width: 100% }
.home-newsletter__button-wrap .home-newsletter__btn {height: 40px;padding: 0 20px;border: 0;border-radius: 4px;background: #ed1c24;color: #fff;font-family: Roboto, sans-serif;font-size: 18px;font-weight: 700;line-height: 1;transition: background .2s ease, opacity .2s ease, filter .2s ease}
.home-newsletter__button-wrap .home-newsletter__btn:focus, .home-newsletter__button-wrap .home-newsletter__btn:hover { background: #cf1017; color: #fff; filter: brightness(1.03) }
.home-newsletter__btn:disabled { opacity: .75; cursor: not-allowed }
.home-newsletter__visual { display: block; width: calc(100% + 42px); height: 100%; min-height: 330px; margin-left: -42px; overflow: hidden; clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%) }
.home-newsletter__visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center }
.site-footer { position: relative; color: #333; background: #fff }
.site-footer a { color: inherit; text-decoration: none !important }
.site-footer a:hover { color: #08194C }
.site-footer__main {position: relative;padding: 32px 0 38px;background: #FCFCFC;box-shadow: 0 -6px 47.3px 0 rgba(178, 178, 178, .25)}
.site-footer__grid { display: grid; grid-template-columns: minmax(0, 390px) minmax(160px, 220px) minmax(190px, 240px); justify-content: space-between; gap: 40px 60px; align-items: start }
.site-footer__brand {display: flex;flex-direction: column;gap: 12px;max-width: 432px;}
.site-footer__logo { display: inline-block; margin: 0 }
.site-footer__logo img { display: block; width: auto; max-width: 120px; height: 92px; object-fit: contain }
.site-footer__desc { margin: 0; color: #333; font-family: var(--font-primary); font-size: 14px; font-weight: 400; line-height: 21px }
.site-footer__desc p { margin-bottom: 10px }
.site-footer__title {margin: 0 0 14px;color: #062f66;font-family: var(--font-primary);font-size: 18px;font-weight: 700;line-height: 22px}
.site-footer__info, .site-footer__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px }
.site-footer__info a, .site-footer__info span, .site-footer__links a { color: #333; font-family: var(--font-primary); font-size: 14px; font-weight: 400; line-height: 20px }
.site-footer__links a:hover, .site-footer__info a:hover { color: #08194C }
.site-footer__social { display: flex; flex-wrap: wrap; align-items: center; gap: 8px }
.site-footer__social a { display: inline-flex; width: 36px; height: 36px; border-radius: 50%; overflow: hidden; }
.site-footer__social img { display: block; width: 100%; height: 100%; object-fit: cover }
.site-footer__bottom { background: #062f66; padding: 11px 0 }
.site-footer__copyright { margin: 0; color: #fff; font-family: var(--font-primary); font-size: 14px; font-weight: 500; line-height: 18px; text-align: center }
.site-footer__copyright a { color: #fff }
.site-footer__copyright a:hover { color: #fff; text-decoration: underline !important }
.site-footer__copyright b, .site-footer__copyright strong { font-weight: 700; }
.info-product h3 { margin: 0 }
.box-product:hover { border-color: #40b604 }
.col.d-flex .box-product { margin: 0 -5px }
.rounded-10 { border-radius: 10px }
.border-pi { border: .925px solid #d2d2d2 }
.tagsPro__Wrapper { border-top: 1px solid #ddd; overflow: hidden }
.tagsPro__track { overflow: hidden; width: 100% }
ul.tagsPro__list { list-style: none; display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; width: max-content; padding: 10px 0; margin: 0; will-change: transform }
.tagsPro__list.is-marquee { animation: tagsProMarquee var(--tags-marquee-duration, 30s) linear infinite }
.tagsPro__track:hover ul.tagsPro__list.is-marquee { animation-play-state: paused }
.tagsPro__item { flex: 0 0 auto; white-space: nowrap }
.tagsPro__item a { position: relative; display: inline-block; color: #333; font-family: Inter, sans-serif; font-size: 14px; font-style: normal; font-weight: 500; line-height: 1.3; padding: 6px 14px; border-radius: 999px; text-decoration: none; transition: color .25s ease, background-color .25s ease, transform .25s ease, box-shadow .25s ease }
.tagsPro__item a::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 1.5px; background: #42b603; border-radius: 2px; transform: scaleX(0); transform-origin: center; transition: transform .28s ease }
.tagsPro__item a:focus-visible, .tagsPro__item a:hover { color: #42b603; background: rgba(44, 49, 147, .08); transform: translateY(-2px); box-shadow: 0 6px 14px rgba(44, 49, 147, .1); outline: 0 }
.tagsPro__item a:focus-visible::after, .tagsPro__item a:hover::after { transform: scaleX(1) }
.tagsPro__item a:active { transform: translateY(0); box-shadow: none }
@keyframes tagsProMarquee {
    from { transform: translateX(0) }
    to { transform: translateX(var(--tags-marquee-shift, -50%)) }
}
.AboutUs__left h2 { color: #085b32; font-family: Roboto; font-size: 40px; font-style: normal; font-weight: 900; line-height: 50px; margin: 20px 0; padding-right: 4rem }
span.AboutUs__left-subTitle { color: #efb713; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px }
.AboutUs__left-desc { color: #7e7e7e; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px }
.AboutUs__Container { gap: 44px }
.AboutUs__Wrapper { padding: 30px 0 }
.btn-cta, .about-intro__cta {display: inline-flex;align-items: center;box-sizing: border-box;width: auto;min-width: 213px;height: 50px;margin-top: 20px;padding: 5px 5px 5px 5px;border: 0;border-radius: 10px;background: white;color: var(--color-red);border: 2px solid var(--color-red);font: inherit;text-decoration: none !important;cursor: pointer;appearance: none;transition: transform .2s ease, box-shadow .2s ease, background .2s ease}
.btn-cta__label, .about-intro__cta-label {display: inline-flex;align-items: center;justify-content: center;width: auto;min-width: 162px;height: 40px;padding: 0 16px;border-radius: 66px;background: #fff;color: var(--color-red);font-family: var(--font-primary);font-size: 16px;font-weight: 600;line-height: 25px;white-space: nowrap}
.btn-cta__icon, .about-intro__cta-icon {display: inline-flex;align-items: center;justify-content: flex-start;width: 36px;height: 36px;padding-left: 0px;}
.btn-cta__icon svg, .about-intro__cta-icon svg {display: block;/* width: 13px; *//* height: 12px; */}
.btn-cta:hover, .about-intro__cta:hover {/* background: #061238; */transform: translateY(-2px);box-shadow: 0 8px 18px rgba(8, 25, 76, .28)}
.section-heading { display: flex; flex-direction: column; align-items: center; margin: 0 0 16px; text-align: center }
.section-heading--left { align-items: flex-start; text-align: left }
.section-heading__eyebrow { margin: 0; color: #0A2C2C; font-family: var(--font-primary); font-size: 16px; font-weight: 600; line-height: 34px; text-transform: uppercase }
.section-heading__title { margin: 0; color: #333; font-family: var(--font-anton); font-size: clamp(24px, 5vw, 41px); font-weight: 400; line-height: 1.56; text-transform: uppercase }
.section-heading__bar { display: block; width: 99px; height: 6px; margin-top: 9px; background: #08194C }
.home-products { padding: 30px 0 }
.home-products__title { margin: 0 0 16px; color: var(--primary-color); font-family: Inter, sans-serif; font-size: 30px; font-weight: 800; line-height: 50px; text-align: center; text-transform: uppercase }
.home-products__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px 16px }
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post { display: flex; flex-direction: column; width: 100%; padding: 16px; border: 1px solid #e5e5e5; border-radius: 20px; background: #fff; text-decoration: none !important; color: inherit; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post:hover { border-color: #08194C; box-shadow: 0 8px 24px rgba(8, 25, 76, .08); } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__thumb { display: block; overflow: hidden; border-radius: 10px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__thumb img { display: block; width: 100%; height: auto } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__body { display: flex; align-items: center; gap: 16px; margin-top: 15px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__text { flex: 1; min-width: 0 } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__name { margin: 0 0 10px; color: #0A2C2C; font-family: var(--font-primary); font-size: 18px; font-weight: 700; line-height: 23px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__desc { margin: 0; color: #333; font-family: var(--font-primary); font-size: 14px; font-weight: 500; line-height: 18px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__more { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 51px; height: 51px; border: 1px solid #d5d5d5; border-radius: 50%; color: #333; transition: border-color .2s ease, color .2s ease, background .2s ease } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__more svg { display: block; width: 14px; height: 10px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post:hover .card-post__more { border-color: #08194C; color: #08194C; background: var(--color-main); } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post:hover .card-post__more svg path { stroke: #fff; } */
.project-item { display: flex; flex-direction: column; width: 100%; text-decoration: none !important; color: inherit }
.project-item__thumb { display: block; overflow: hidden; border-radius: 20px }
.project-item__thumb img { display: block; width: 100%; height: auto }
.project-item__name { margin: 10px 0 0; color: #0A2C2C; font-family: var(--font-primary); font-size: 16px; font-weight: 700; line-height: 20px }
.project-item__desc { margin: 13px 0 0; color: #666; font-family: var(--font-primary); font-size: 14px; font-weight: 500; line-height: 18px }
.project-item__more { display: inline-flex; align-items: center; gap: 11px; margin-top: 4px }
.project-item__icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 51px; height: 51px; border: 1px solid #C2C2C2; border-radius: 50%; color: #333; transition: border-color .2s ease, color .2s ease, background .2s ease }
.project-item__icon svg { display: block; width: 14px; height: 10px }
.project-item__more-text { color: #333; font-family: var(--font-primary); font-size: 16px; font-weight: 700; line-height: 20px }
.project-item:hover .project-item__icon { border-color: #08194C; color: #08194C; background: var(--color-main) }
.project-item:hover .project-item__icon svg path { stroke: #fff }
.project-item:hover .project-item__more-text { color: #08194C }
/* [SPEC OVERRIDE - Việt Anh card tin tức, 26/10/2026] card_news viết lại theo Figma (card cũ không còn nơi dùng) */
/* .card-news { display: flex; flex-direction: column; width: 100%; text-decoration: none !important; color: inherit } .card-news__thumb { display: block; overflow: hidden; border-radius: 10px } .card-news__thumb img { display: block; width: 100%; height: auto } .card-news__name { margin: 18px 0 0; color: #333; font-family: var(--font-primary); font-size: 19px; font-weight: 700; line-height: 24px } .card-news__desc { margin: 14px 0 0; color: #333; font-family: var(--font-primary); font-size: 14px; font-weight: 500; line-height: 21px } .card-news:hover .card-news__name { color: #08194C } */
.card-news { overflow: hidden; background: #fff; border: .5px solid #d9d9d9; border-radius: 10px; transition: border-color .3s, box-shadow .3s }
.card-news:hover { border-color: var(--color-submain); box-shadow: 0 4px 4px rgba(38, 72, 5, .1) }
.card-news .time { color: #eec645 }
.card-news .name a { color: var(--color-gray) }
.card-news .name a:hover { color: var(--color-submain) }
.card-news .desc { color: #858585 }
.card-news:hover .btn-main.line { color: #fff; background: var(--color-submain) }
.card-news-title { display: block; padding: 18px 0; border-bottom: 1px solid #DFDFDF; text-decoration: none !important; color: inherit }
.card-news-title:first-child { padding-top: 9px }
.card-news-title__name { margin: 0; color: #221B2F; font-family: var(--font-primary); font-size: 18px; font-weight: 600; line-height: 28px }
.card-news-title:hover .card-news-title__name { color: #08194C }
.card-testimonial { position: relative; width: 100%; padding-top: 46px; padding: 46px 10px; padding-bottom: 10px; }
.card-testimonial__avatar { position: absolute; top: 0; left: 20px; z-index: 1; width: 92px; height: 92px; overflow: hidden; border: 4px solid #fff; border-radius: 50%; background: #eee; box-shadow: 0 0 19.4px rgba(207, 207, 207, .25) }
.card-testimonial__avatar img { display: block; width: 100%; height: 100%; object-fit: cover }
.card-testimonial__body { padding: 53px 20px 19px; border-radius: 20px; background: #fff; box-shadow: 2px 4px 9px rgba(166, 166, 166, .25) }
.card-testimonial__quote { margin: 0; color: #666; font-family: var(--font-primary); font-size: 14px; font-weight: 500; line-height: 21px }
.card-testimonial__line { display: block; height: 1px; margin: 28px 0 13px; background: #D9D9D9 }
.card-testimonial__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px }
.card-testimonial__name { margin: 0; color: #333; font-family: var(--font-primary); font-size: 14px; font-weight: 700; line-height: 21px }
.card-testimonial__role { margin: 0; color: #666; font-family: var(--font-primary); font-size: 14px; font-weight: 500; line-height: 21px }
.card-testimonial__stars { display: flex; align-items: center; flex-shrink: 0; gap: 4px; color: #EFD306 }
.card-testimonial__stars svg { display: block; width: 15px; height: 13px }
.home-product-card { display: flex; flex-direction: column; min-height: 375px; background: #fff; box-shadow: 0 0 7.397px 0 rgba(0, 0, 0, .1); text-decoration: none !important; color: inherit; transition: box-shadow .25s ease }
.home-product-card:hover { box-shadow: 0 0 10px rgba(8, 91, 50, .3) }
.home-product-card__thumb { max-height: 279px; padding: 34px 8px 32px; overflow: hidden; display: flex; align-items: center; justify-content: center; border: 1px solid transparent }
.home-product-card__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .35s ease }
.home-product-card:hover .home-product-card__thumb img { transform: scale(1.04) }
.home-product-card__body { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 14px 7px 18px; text-align: center }
.home-product-card__name { margin: 0; width: 100%; color: var(--primary-color); font-family: Inter, sans-serif; font-size: 18px; font-weight: 800; line-height: normal; text-transform: capitalize }
.home-product-card__desc { margin: 0; width: 100%; color: #7e7e7e; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 20px }
.home-products__more { display: flex; justify-content: center; margin-top: 30px }
.home-products__btn { display: inline-flex; align-items: center; justify-content: center; gap: 14px; box-sizing: border-box; height: 45px; padding: 0 20px; border: 1px solid var(--primary-color); border-radius: 10px; background: #fff; color: var(--primary-color) !important; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px; text-decoration: none !important; white-space: nowrap; transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease }
.home-products__btn img { display: block; width: 38px; height: 31px; flex-shrink: 0; transition: filter .2s ease }
.home-products__btn:hover { background: var(--primary-color); color: #fff !important; transform: translateY(-2px); box-shadow: 0 0 10px rgba(8, 91, 50, .3) }
.home-products__btn:hover img { filter: brightness(0) invert(1) }
.home-services { padding: 30px 0 }
.home-services__title { margin: 0 0 16px; color: var(--primary-color); font-family: Inter, sans-serif; font-size: 30px; font-weight: 800; line-height: 50px; text-align: center; text-transform: uppercase }
.home-services__grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 242px 242px; gap: 16px; height: 500px }
.home-service-card { position: relative; display: block; overflow: hidden; color: #fff; text-decoration: none !important; min-height: 0 }
.home-service-card--lg { grid-row: 1/3; clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%, 0 25%) }
.home-service-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: revert-rule; display: block; transition: transform .45s ease }
.home-service-card:hover img { transform: scale(1.04) }
.home-service-card__shade { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(0, 0, 0, 0), #000) }
.home-service-card--lg .home-service-card__shade { background: linear-gradient(180deg, rgba(8, 91, 50, 0), #085b32) }
.home-service-card__content { position: absolute; left: 21px; right: 21px; bottom: 21px; z-index: 3; display: flex; align-items: flex-start; gap: 16px }
.home-service-card__bar { width: 3px; background: #fff; flex-shrink: 0 }
.home-service-card--lg .home-service-card__bar { height: 90px }
.home-service-card--sm .home-service-card__bar { height: 30px }
.home-service-card__text { display: flex; flex-direction: column; gap: 16px; min-width: 0 }
.home-service-card__name { margin: 0; color: #fff; font-family: Inter, sans-serif; font-weight: 800; line-height: 24px; text-transform: uppercase }
.home-service-card--lg .home-service-card__name { font-size: 20px; white-space: nowrap }
.home-service-card--sm .home-service-card__name { font-size: 18px; padding-top: 3px }
.home-service-card__desc { margin: 0; color: #fff; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.home-why { padding: 30px 0 }
.home-why__title { margin: 0 0 15px; color: var(--primary-color); font-family: Inter, sans-serif; font-size: 30px; font-weight: 800; line-height: 50px; text-align: center; text-transform: uppercase }
.home-why__body { display: grid; grid-template-columns: repeat(2, minmax(0, 592px)); gap: 16px; justify-content: center; align-items: start }
.home-why__features { display: grid; grid-template-columns: repeat(2, minmax(0, 288px)); gap: 25px 10px; justify-content: space-between; padding-top: 46px }
.home-why__item { max-width: 288px; transition: transform .25s ease }
.home-why__item:hover { transform: translateY(-4px) }
.home-why__num { display: flex; align-items: center; justify-content: center; width: 63px; height: 63px; margin: 0 0 16px; border-radius: 50%; background: #ffcd3a; color: #fff; font-family: Roboto, sans-serif; font-size: 25px; font-weight: 700; line-height: 1; text-transform: capitalize; transition: transform .25s ease, box-shadow .25s ease }
.home-why__item:hover .home-why__num { transform: scale(1.06); box-shadow: 0 0 10px rgba(239, 183, 19, .4) }
.home-why__name { margin: 0 0 10px; color: #085b32; font-family: Roboto, sans-serif; font-size: 18px; font-weight: 700; line-height: normal; text-transform: capitalize }
.home-why__desc { margin: 0; color: #7e7e7e; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.home-why__visual { position: relative; width: 592px; max-width: 100%; overflow: hidden }
.home-why__visual img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease }
.home-why__visual:hover img { transform: scale(1.04) }
.ArcVsPartner .about-shine { display: block; border-radius: 6px }
.ArcVsPartner .about-shine img { transition: transform .35s ease }
.ArcVsPartner .brand-item:hover .about-shine img { transform: scale(1.04) }
.home-newsletter__btn { transition: background .2s ease, opacity .2s ease, filter .2s ease, transform .2s ease, box-shadow .2s ease }
.home-newsletter__btn:focus, .home-newsletter__btn:hover { transform: translateY(-1px); box-shadow: 0 0 10px rgba(239, 183, 19, .45) }
.about-page { background: #fff; color: #282828 }
.about-hero {position: relative;width: 100%;overflow: hidden;/* background: #0a1628; */}
.about-hero__img, .about-hero__media {/* width: 100%; *//* height: 100%; */}
.about-hero__img {text-align: center;margin: auto;display: block;/* object-fit: cover; *//* object-position: 40% center; *//* transform: scale(1); *//* transform-origin: 40% 50%; *//* animation: aboutHeroKen 22s ease-out forwards; */}
.about-hero__overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: flex-end; padding: 0 8.33%; background: linear-gradient(90deg, rgba(8, 20, 40, .15) 0, rgba(8, 20, 40, .45) 55%, rgba(8, 20, 40, .55) 100%); pointer-events: none }
.about-hero__copy { width: min(520px, 100%); text-align: center; pointer-events: auto }
.about-hero__title { margin: 0 0 14px; color: #fff; font-family: Roboto, sans-serif; font-size: clamp(28px, 4vw, 48px); font-style: italic; font-weight: 900; line-height: 1.15; text-transform: uppercase; text-shadow: 0 0 24px rgba(120, 190, 255, .45) }
.about-hero__subtitle { margin: 0 0 22px; color: #fff; font-family: Roboto, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: .04em; line-height: 1.4; text-transform: uppercase }
.about-hero__desc { margin: 0 0 22px; color: rgba(255, 255, 255, .9); font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.about-hero__cta { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 28px; border: 1px solid rgba(180, 220, 255, .85); border-radius: 999px; background: linear-gradient(180deg, rgba(20, 40, 80, .85), rgba(8, 18, 40, .95)); box-shadow: 0 0 18px rgba(120, 190, 255, .35); color: #fff !important; font-family: Roboto, sans-serif; font-size: 15px; font-weight: 700; letter-spacing: .04em; line-height: 1; text-decoration: none !important; text-transform: uppercase; transition: box-shadow .2s ease, transform .2s ease }
.about-hero__cta:hover { box-shadow: 0 0 24px rgba(120, 190, 255, .55); transform: translateY(-1px); color: #fff !important }
.about-intro { position: relative; padding: 12px 0 60px; overflow: hidden }
.about-intro__layout { position: relative }
.about-intro__vertical { position: absolute; width: 42px; height: 418px; flex-shrink: 0; pointer-events: none; right: 100%; top: 10px }
.about-intro__vertical img { position: absolute; left: 50%; top: 50%; display: block; width: 418px; height: 42px; max-width: none; transform: translate(-50%, -50%) rotate(-90deg); transform-origin: center center }
.about-intro__main { min-width: 0; padding-top: 8px }
.about-intro__grid { display: grid; grid-template-columns: minmax(0, 570px) minmax(280px, 1fr); gap: 20px 36px; align-items: start }
.about-intro__eyebrow { margin: 0 0 20px; color: #efb713; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.about-intro__title { margin: 0 0 20px; color: #0A2C2C; font-family: var(--font-anton); font-size: 34px; font-style: normal; font-weight: 400; line-height: normal; text-transform: uppercase; }
.about-intro__desc { color: #656565; font-size: 16px; font-style: normal; font-weight: 500; line-height: 23px; /* 143.75% */ }
.about-intro__desc p { margin: 0 0 16px }
.about-intro__desc p:last-child { margin-bottom: 0 }
.about-intro__visual { position: relative; }
.about-intro__collage { border-radius: 10px; overflow: hidden; }
.about-intro__more { position: relative; margin-top: 28px; max-width: 1194px; max-height: 66px; overflow: hidden; transition: max-height .4s ease }
.about-intro.is-open .about-intro__more { max-height: 5000px }
.about-intro__more-text { color: #727272; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 22px; text-align: justify }
.about-intro__more-text p { margin: 0 0 12px }
.about-intro__more-text p:last-child { margin-bottom: 0 }
.about-intro__fade { position: absolute; left: 0; right: 0; bottom: 0; height: 65px; pointer-events: none; background: linear-gradient(360deg, #fff 0, rgba(255, 255, 255, 0) 100%); opacity: 1; transition: opacity .3s ease }
.about-intro.is-open .about-intro__fade { opacity: 0 }
.about-intro__actions { display: flex; justify-content: center; margin-top: 20px }
.about-intro__btn { display: inline-flex; align-items: center; justify-content: center; gap: 14px; box-sizing: border-box; height: 45px; padding: 0 20px; border: 1px solid #085b32; border-radius: 10px; background: #fff; color: #085b32 !important; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px; text-decoration: none !important; white-space: nowrap; cursor: pointer; transition: background .2s ease, color .2s ease }
.about-intro__btn img { display: block; width: 38px; height: 31px; flex-shrink: 0; transition: filter .2s ease, transform .25s ease }
.about-intro.is-open .about-intro__btn img { transform: rotate(180deg) }
.about-intro__btn:hover { background: #085b32; color: #fff !important }
.about-intro__btn:hover img { filter: brightness(0) invert(1) }
a.home-product-card:hover .home-product-card__thumb { border-color: #d60c0c }
.ArcVsPartner { background: #f9f9f9; padding: 30px 0 }
.partner__overlay { position: relative }
.partner__overlay:after, .partner__overlay:before { position: absolute; content: ''; width: 150px; height: 120px; top: 50%; transform: translateY(-50%); z-index: 99 }
.partner__overlay:before { left: 0; background: linear-gradient(90deg, #f9f9f9 23.18%, rgba(255, 255, 255, 0) 144.12%) }
.partner__overlay:after { right: 0; background: linear-gradient(280deg, #f9f9f9 23.18%, rgba(255, 255, 255, 0) 144.12%) }
.bg-F9F9F9 { background: #f9f9f9 }
section.StatWrapper { --stat-bg-image: url(../images/stat-bg.jpg); --stat-bg-color: #00592d; --stat-bg-tint: rgb(0 89 45 / 57%); --stat-bg-overlay: linear-gradient(180deg, rgba(255, 255, 255, 0) 41%, rgba(255, 255, 255, .9) 92%); --stat-curve: 46px; position: relative; z-index: 0; background: none; min-height: 542px; padding: 30px 0 }
section.StatWrapper::before { content: ""; position: absolute; inset: 0; z-index: -1; background-color: var(--stat-bg-color); background-image: var(--stat-bg-overlay), linear-gradient(var(--stat-bg-tint), var(--stat-bg-tint)), var(--stat-bg-image); background-repeat: no-repeat; background-position: center; background-size: 100% 100%; -webkit-mask: linear-gradient(#fff, #fff) top center/100% calc(100% - var(--stat-curve)) no-repeat, url(../images/stat-curve-bottom.svg) bottom center/100% var(--stat-curve) no-repeat; mask: linear-gradient(#fff, #fff) top center/100% calc(100% - var(--stat-curve)) no-repeat, url(../images/stat-curve-bottom.svg) bottom center/100% var(--stat-curve) no-repeat; -webkit-mask-composite: source-over; mask-composite: add }
.photoStatMain { position: relative }
.photoStatMain { text-align: center }
.Stat__List { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 15px }
.about-stats__item { border-radius: 10px; background: rgba(255, 255, 255, .1); padding: 30px 10px 10px }
p.about-stats__num { color: #fff; text-align: center; font-family: Roboto; font-size: 51px; font-style: normal; font-weight: 800; line-height: normal; text-transform: uppercase; transition: color .25s ease }
p.about-stats__label { color: #fff; text-align: center; font-family: Roboto; font-size: 18px; font-style: normal; font-weight: 600; line-height: normal }
.photoStatMain { margin-bottom: -30px }
.value-card { position: relative; min-height: 620px; padding: 120px 90px }
.value-card__shap { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0 }
.value-card__content { position: relative; z-index: 1 }
.about-vm {position: relative;min-height: 500px;padding: 104px 0;overflow: hidden;background: center/cover no-repeat;}
.about-vm__visual {position: absolute;inset: 0;display: block;pointer-events: none}
.about-vm__content { min-height: 292px; padding: 33px 20px 24px; border-radius: 10px; background: rgba(255, 255, 255, .9); text-align: center }
.about-vm__img { display: block; width: 50px; height: 50px; margin: 0 auto 15px; object-fit: contain }
.about-vm__title {}
.about-vm__desc { color: #383838; font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 24px }
.about-vm__desc p { margin: 0 }
.about-values {padding: 35px 0 10px;}
.about-values .about-section-title { margin: 0 0 30px; color: #032a60; font-family: var(--font-primary); font-size: 26px; font-weight: 700; line-height: 34px; text-align: center; text-transform: capitalize }
.about-values__compass { display: grid; grid-template-columns: minmax(0, 384px) minmax(300px, 384px) minmax(0, 384px); grid-template-rows: 1fr 1fr; grid-template-areas: "lefttop core righttop" "leftbottom core rightbottom"; align-items: center; column-gap: 24px; min-height: 360px }
.about-values__item { min-width: 0; width: 100% }
.about-values__item--lefttop { grid-area: lefttop }
.about-values__item--leftbottom { grid-area: leftbottom }
.about-values__item--righttop { grid-area: righttop }
.about-values__item--rightbottom { grid-area: rightbottom }
.about-values__item--lefttop, .about-values__item--leftbottom { text-align: left }
.about-values__item--righttop, .about-values__item--rightbottom { text-align: right }
.about-values__core { grid-area: core; display: grid; place-items: center; width: 100%; height: 360px }
.about-values__core img { display: block; max-width: 100%; max-height: 360px; object-fit: contain }
.about-values__name {}
.about-values__desc { margin: 0; color: #7c7c7c; font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 24px }
.about-history {padding: 35px 0 40px;\: #fff;}
.about-history .about-section-title { margin: 0 0 22px; color: #032a60; font-family: var(--font-primary); font-size: 26px; font-weight: 700; line-height: 34px; text-align: center; text-transform: capitalize }
.about-history__years { margin-bottom: 35px }
.about-history__nav { position: relative; overflow: hidden }
.about-history__nav::after { content: ""; position: absolute; left: 0; right: 0; bottom: 8px; z-index: 0; height: 1px; background: #032a60 }
.about-history__nav .swiper-wrapper { position: relative; z-index: 1 }
.about-history__row { display: grid; grid-template-columns: minmax(0, 584px) minmax(0, 1fr); align-items: center; gap: 32px }
.about-history__row--text { grid-template-columns: 1fr }
.about-history__media { overflow: hidden; border-radius: 10px }
.about-history__media img { display: block; width: 100%; height: 290px; object-fit: cover }
.about-history__copy h3 { margin: 0 0 12px; color: #dc1c1f; font-family: var(--font-primary); font-size: 20px; font-weight: 800; line-height: 29px }
.about-history__copy { color: #7c7c7c; font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 26px }
.about-history__copy p:last-child { margin-bottom: 0 }
.about-history .year-item span { color: #7c7c7c; font-size: 18px }
.about-history .swiper-slide-thumb-active .year-item span { color: #dc1c1f; font-size: 26px; font-weight: 700 }
.about-history .year-item::before {background: #fff;border: 1px solid #dc1c1f;border-radius: 100%;}
.about-history .swiper-slide-thumb-active .year-item::before { background: #dc1c1f }
@keyframes aboutHeroKen {
    from { transform: scale(1) }
    to { transform: scale(1.04) }
}
.about-intro__visual { overflow: hidden; border-radius: 10px; max-width: 562px; }
.about-intro__collage { transition: transform .35s ease }
.about-intro__visual:hover .about-intro__collage { transform: scale(1.04) }
.about-intro__btn { transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease }
.about-intro__btn:hover { transform: translateY(-2px); box-shadow: 0 0 10px rgba(8, 91, 50, .3) }
.about-stats__item { transition: transform .25s ease, background .25s ease, box-shadow .25s ease }
.about-stats__item:hover { transform: translateY(-4px); background: rgba(255, 255, 255, .18); box-shadow: 0 0 10px rgba(239, 183, 19, .28) }
.about-stats__item:hover .about-stats__num { color: #efb713 }
.photoStatMain .about-shine { display: inline-block; max-width: 100%; border-radius: 10px; transition: box-shadow .25s ease }
.photoStatMain img { display: block; max-width: 100%; transition: transform .4s ease }
.photoStatMain:hover img { transform: scale(.97) }
.about-values__item { transition: transform .25s ease }
.about-values__item:hover { transform: translateY(-4px) }
.about-vm__img { transition: transform .4s ease }
.about-vm__visual:hover .about-vm__img { transform: scale(1.04) }
.about-history__media .about-shine { border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, .1); transition: box-shadow .25s ease }
.about-history__media img { display: block; transition: transform .35s ease }
.about-history__media:hover .about-shine { box-shadow: 0 0 10px rgba(8, 91, 50, .3) }
.about-history__media:hover img { transform: scale(1.04) }
.year-item span { transition: color .25s ease, font-size .25s ease, font-weight .25s ease }
.year-item:hover span { color: #085b32 }
h2.about-section-title.about-section-title--plain { color: #fff; text-align: center; font-family: Inter; font-size: 30px; font-style: normal; font-weight: 800; line-height: normal; text-transform: uppercase; margin-bottom: 30px }
a.text-normal.active { color: var(--primary-color) }
.swiper-slide-thumb-active .year-item span, .year-item.slick-current span { color: var(--primary-color); font-weight: 700; font-size: 26px }
.slider.slider-nav.my-3.slick-initialized.slick-slider .slick-track { width: 100% }
.slider.slider-nav.my-3 { margin-bottom: 37px !important }
.HeaderMenu__Logo { max-width: 112px }
.product-listing-page { padding: 10px .5rem 40px }
.product-listing { display: grid; grid-template-columns: 289px minmax(0, 1fr); column-gap: 15px; row-gap: 16px; align-items: start }
.product-listing--figma { display: block; }
.product-listing--figma .product-listing__main { width: 100%; }
.product-cats { width: 289px; height: auto; max-height: 640px; box-sizing: border-box; display: flex; flex-direction: column; background: #fff; border: 1px solid #085b32; border-radius: 10px; overflow: hidden }
.product-cats__title { display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin: 0; height: 66px; background: #085b32; color: #fff; font-family: Roboto, sans-serif; font-size: 20px; font-weight: 700; line-height: 23px; text-transform: uppercase }
.product-cats__list { list-style: none; margin: 0; padding: 0; flex: 1; overflow-y: auto }
.product-cats__item+.product-cats__item { border-top: .5px solid #979393 }
.product-cats__item>a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 0; padding: 20px 9px 20px 22px; color: #333; font-family: Inter, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px; text-transform: capitalize; text-decoration: none; transition: color .25s ease, background .25s ease }
.product-cats__item>a span { min-width: 0 }
.product-cats__item>a svg { flex-shrink: 0; width: 7px; height: 16px; color: #333; transition: transform .35s cubic-bezier(.22, 1, .36, 1), color .25s ease }
.product-cats__item.has-children.is-open>a svg { transform: rotate(90deg) }
.product-cats__item>a:hover, .product-cats__item.is-active>a, .product-cats__item.is-open>a { color: #085b32; font-weight: 800; text-decoration: none }
.product-cats__item>a:hover svg, .product-cats__item.is-active>a svg, .product-cats__item.is-open>a svg { color: #085b32 }
.product-cats__sub { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .38s cubic-bezier(.22, 1, .36, 1) }
.product-cats__item.is-open>.product-cats__sub { grid-template-rows: 1fr }
.product-cats__sub-inner { overflow: hidden; min-height: 0; list-style: none; margin: 0; padding: 0 10px 10px 12px; background: linear-gradient(180deg, #f4f8f6 0, #fff 100%) }
.product-cats__sub-item { opacity: 0; transform: translateY(-6px); transition: opacity .28s ease, transform .28s cubic-bezier(.22, 1, .36, 1) }
.product-cats__item.is-open .product-cats__sub-item { opacity: 1; transform: none }
.product-cats__item.is-open .product-cats__sub-item:nth-child(1) { transition-delay: .04s }
.product-cats__item.is-open .product-cats__sub-item:nth-child(2) { transition-delay: .08s }
.product-cats__item.is-open .product-cats__sub-item:nth-child(3) { transition-delay: .12s }
.product-cats__item.is-open .product-cats__sub-item:nth-child(4) { transition-delay: .16s }
.product-cats__item.is-open .product-cats__sub-item:nth-child(5) { transition-delay: .2s }
.product-cats__item.is-open .product-cats__sub-item:nth-child(6) { transition-delay: .24s }
.product-cats__sub-item a { position: relative; display: flex; align-items: center; margin: 2px 0; padding: 8px 12px 8px 20px; border-radius: 6px; color: #555; font-family: Inter, sans-serif; font-size: 14px; font-weight: 400; line-height: 22px; text-decoration: none; transition: color .22s ease, background .22s ease, padding-left .22s ease }
.product-cats__sub-item a::before { content: ""; position: absolute; left: 8px; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: #c5d4cb; transform: translateY(-50%); transition: background .22s ease, transform .22s ease }
.product-cats__sub-item.is-active a, .product-cats__sub-item a:hover { color: #085b32; background: rgba(8, 91, 50, .08); padding-left: 24px; font-weight: 600; text-decoration: none }
.product-cats__sub-item.is-active a::before, .product-cats__sub-item a:hover::before { background: #085b32; transform: translateY(-50%) scale(1.15) }
.product-listing__title { margin: 0 0 16px; color: #032a60; font-family: Inter, sans-serif; font-size: 30px; font-weight: 800; line-height: 50px; text-transform: none }
.product-tabs { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; margin: 0 0 30px; }
.product-tabs__item { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 15px; border-radius: 22px; background: #edf3fb; color: #032a60; font-size: 16px; font-weight: 500; line-height: 24px; text-decoration: none !important; transition: color .2s ease, background .2s ease; }
.product-tabs__item:hover, .product-tabs__item.active { background: #032a60; color: #fff; }
.product-listing__main .wrap-filter { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: 0 !important; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; pointer-events: none }
.product-listing__grid {display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: 15px 15px;justify-content: start}
.product-card {display: flex;flex-direction: column;width: auto;min-width: 0;/* height: 376px; *//* min-height: 376px; */overflow: hidden;border-radius: 10px;background: #fff;box-shadow: 0 0 7.397px 0 rgba(0, 0, 0, .1);color: inherit;text-decoration: none !important;transition: box-shadow .25s ease}
.product-card:hover { box-shadow: 0 0 7.397px 0 rgba(8, 91, 50, .3) }
.product-card__thumb { display: flex; align-items: center; justify-content: center; height: 220px; padding: 10px; overflow: hidden; border: .74px solid transparent }
.product-card__thumb img { display: block; width: 100%; height: 100%; object-fit: contain }
.product-card:hover .product-card__thumb {/* border-color: #d60c0c; */}
.product-card__body {display: flex;flex: 1;flex-direction: column;align-items: stretch;gap: 7px;width: 100%;margin: 0;padding: 10px 10px 8px;text-align: left}
.product-card__name {margin: 0;width: 100%;font-size: 16px;font-weight: 600;line-height: 20px;text-transform: none}
.product-card__name a { color: inherit; text-decoration: none; }
.product-card__name:hover a { color: var(--color-red); text-decoration: none; }
.product-card__desc {margin: 0;width: 100%;color: #555;font-size: 14px;font-weight: 500;line-height: 18px}
.product-card__cta {display: flex;align-items: center;justify-content: center;width: 100%;min-height: 30px;/* margin-top: auto; */border-radius: 15px;background: #EE0A13;background: linear-gradient(90deg, rgba(238, 10, 19, 1) 59%, rgba(176, 33, 39, 1) 100%);color: #fff !important;font-size: 18px;font-weight: 700;line-height: 20px;text-decoration: none !important;text-transform: uppercase;transition: background .2s ease;margin-top: 0.5rem;}
.product-card__cta:hover { background: #032a60; }
.product-listing__more { display: flex; justify-content: center; margin-top: 30px }
.wrap-pro-detail {/* background: #fff; */padding: 10px 0 40px}
.pro-detail { max-width: 1200px; margin: 0 auto }
.pro-detail-top { display: flex; align-items: stretch; gap: 20px }
.wrap-pro-detail .left-pro-detail { width: 588px; max-width: 100%; flex-shrink: 0 }
.wrap-pro-detail .right-pro-detail { width: 592px; max-width: 100%; flex: 1 1 auto; min-width: 0 }
.wrap-pro-detail .gallery-pro-detail { display: flex; align-items: stretch; gap: 20px; width: 100%; flex-wrap: nowrap }
.wrap-pro-detail .gallery-pro-detail__nav { width: 101px; flex-shrink: 0; display: flex; flex-direction: column; gap: 20px }
.wrap-pro-detail .gallery-pro-detail .slider-product-thumbs { width: 102px; height: 452px; overflow: hidden }
.wrap-pro-detail .gallery-pro-detail__nav.has-video .slider-product-thumbs { height: 334px }
.wrap-pro-detail .gallery-pro-detail .slider-product-thumbs .item {padding: 0;border-radius: 10px;}
.wrap-pro-detail .gallery-pro-detail .slider-product-thumbs .item a, .wrap-pro-detail .product-video-thumb {display: block;position: relative;width: 100px;height: 95px;border-radius: 10px;overflow: hidden;background: #fff;border: 1px solid transparent;box-shadow: 0 0 4px 0 rgba(0, 0, 0, .1);transition: border-color .2s ease, box-shadow .2s ease}
.wrap-pro-detail .gallery-pro-detail .slider-product-thumbs .swiper-slide-thumb-active a, .wrap-pro-detail .gallery-pro-detail .slider-product-thumbs .swiper-slide-thumb-active .item a { border-color: #d60c0c; box-shadow: none }
.wrap-pro-detail .gallery-pro-detail .slider-product-thumbs .item a img, .wrap-pro-detail .product-video-thumb img {width: 100%;height: 100%;object-fit: cover;border-radius: 10px;}
.wrap-pro-detail .gallery-pro-detail .slider-products .swiper-button-prev, .wrap-pro-detail .gallery-pro-detail .slider-products .swiper-button-next { display: none !important }
.wrap-pro-detail .gallery-pro-detail .slider-products .item a {display: block;overflow: hidden}
.wrap-pro-detail .gallery-pro-detail .slider-products .item img {width: 100%;height: 452px !important;max-height: 452px;object-fit: cover;border-radius: 10px;}
.wrap-pro-detail .pro-detail-info { display: flex; flex-direction: column; height: 100%; min-height: 452px; margin: 0 }
.wrap-pro-detail #product-title, .wrap-pro-detail .pro-detail-title {margin: 0 0 16px;color: var(--color-main);\: Roboto, sans-serif;font-size: 20px;font-weight: 800;line-height: 26px;}
.pro-detail-row { margin: 0 0 16px; color: #333; font-family: Roboto, sans-serif; font-size: 18px; font-weight: 600; line-height: 21px }
.pro-detail-row__label { color: #333; font-size: 18px; font-weight: 600; }
.pro-detail-row__sku { color: #e30000; font-weight: 700; text-transform: uppercase; margin-left: 6px }
.pro-detail-desc-label { margin: 0 0 10px; color: #333; font-family: Roboto, sans-serif; font-size: 18px; font-weight: 600; line-height: 21px }
.wrap-pro-detail .pro-detail-desc { flex: 1 1 auto; /* max-height: 240px; */ overflow: hidden; margin: 0; color: #727272; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.wrap-pro-detail .pro-detail-desc p { margin: 0 0 12px }
.wrap-pro-detail .pro-detail-desc p:last-child { margin-bottom: 0 }
.pro-detail-cta { display: flex; align-items: center; gap: 15px; margin-top: 10px; padding-top: 30px; border-top: .5px solid #e9202a }
.pro-detail-cta__phone, .pro-detail-cta__zalo { display: inline-flex; align-items: center; justify-content: center; height: 50px; box-sizing: border-box; color: #fff !important; text-decoration: none !important; white-space: nowrap; transition: opacity .2s ease, transform .2s ease }
.pro-detail-cta__phone:hover, .pro-detail-cta__zalo:hover { color: #fff !important; opacity: .92 }
.pro-detail-cta__zalo { width: 235px; gap: 5px; padding: 0 16px; background: #0068ff; border-radius: 504px; font-family: Roboto, sans-serif; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: .04em; text-transform: capitalize }
.pro-detail-cta__zalo img { width: 23px; height: 23px; flex-shrink: 0 }
.pro-detail-cta__phone { width: 230px; gap: 14px; padding: 0 16px; background: #d60c0c; border-radius: 50px; font-family: Roboto, sans-serif; font-size: 22px; font-weight: 800; line-height: 26px }
.pro-detail-cta__phone img { width: 30px; height: 30px; flex-shrink: 0; animation: headerHotlineShake 2.4s ease-in-out infinite; }
.pro-detail-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 15px; margin-top: 30px; align-items: start }
.pro-detail-body.has-aside { grid-template-columns: minmax(0, 795px) 390px }
.wrap-pro-detail .pro-info-main { background: #fff; border-radius: 10px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1); padding: 20px 0 24px; min-height: 952px }
.wrap-pro-detail .pro-info-main__title { margin: 0 0 20px; padding: 0 22px; color: #085b32; font-family: Roboto, sans-serif; font-size: 20px; font-weight: 700; line-height: 23px }
.wrap-pro-detail .pro-info-main .pro-info-toc .wrap-toc, .wrap-pro-detail .pro-info-toc .wrap-toc { margin: 0 0 14px; padding: 0; min-height: 40px; background: #085b32; border: 0; border-radius: 0 }
.wrap-pro-detail .pro-info-main .pro-info-toc .toc-head, .wrap-pro-detail .pro-info-toc .toc-head { min-height: 40px; height: 40px; padding: 0 28px 0 32px; color: #fff; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 600; line-height: 19px }
.wrap-pro-detail .pro-info-main .pro-info-toc .pro-info-toc__icon, .wrap-pro-detail .pro-info-main .pro-info-toc .toc-head svg { color: #fff; fill: #fff }
.wrap-pro-detail .pro-info-toc .pro-info-toc__icon { display: inline-flex; align-items: center; margin-right: 12px }
.wrap-pro-detail .pro-info-toc .pro-info-toc__icon img { display: block; width: 16px; height: 11px }
.wrap-pro-detail .pro-info-main .pro-info-toc .pro-info-toc__label { display: inline; color: #fff }
.wrap-pro-detail .pro-info-toc .pro-info-toc__chevron { margin-left: auto; width: 9px; height: 5px; flex-shrink: 0 }
.wrap-pro-detail .pro-info-main .pro-info-toc .toc-list { display: none; margin: 0; padding: 10px 32px 14px; background: #fff; max-height: 280px }
.wrap-pro-detail .pro-info-main .pro-info-toc .toc-list li a { color: #085b32 !important }
.wrap-pro-detail #toc-content, .wrap-pro-detail .pro-info-content-wrap { padding: 0 22px }
.wrap-pro-detail .pro-info-content#noidung { position: relative; max-height: 770px; padding-bottom: 70px; overflow: hidden }
.wrap-pro-detail .pro-info-content#noidung.show-full-content { max-height: none; overflow: visible; padding-bottom: 70px }
.wrap-pro-detail .pro-info-content h1, .wrap-pro-detail .pro-info-content h2, .wrap-pro-detail .pro-info-content h3 { color: #085b32; font-family: Roboto, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; margin: 0 0 11px }
.wrap-pro-detail .pro-info-content li, .wrap-pro-detail .pro-info-content p { color: #727272; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 21px }
.wrap-pro-detail .pro-info-content img { max-width: 100%; height: auto; margin: 12px 0 }
.wrap-pro-detail .pro-info-more.hide-content { background: linear-gradient(180deg, rgba(255, 255, 255, 0) 7%, #fff 88%); padding: 80px 0 8px }
.wrap-pro-detail a.pro-info-more__btn, .wrap-pro-detail a.pro-info-more__btn.product-listing__btn { min-width: 0; height: 45px; padding: 0 20px; background: #fff !important; border: 1px solid #085b32; border-radius: 10px; color: #085b32 !important; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.wrap-pro-detail a.pro-info-more__btn .blob-txt { color: #085b32 !important }
.wrap-pro-detail a.pro-info-more__btn:hover, .wrap-pro-detail a.pro-info-more__btn:hover .blob-txt { background: #085b32 !important; color: #fff !important }
.wrap-pro-detail .pro-info-empty { padding: 0 22px; color: #888; font-size: 14px }
.pro-detail-aside { display: flex; flex-direction: column; gap: 30px; width: 390px; max-width: 100%; min-width: 0 }
.pro-specs, .wrap-pro-detail .pro-news-sidebar { width: 390px; max-width: 100%; background: #fff; border-radius: 10px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1); padding: 27px 20px 21px }
.wrap-pro-detail .pro-news-sidebar { padding: 18px 20px 10px }
.pro-specs__title, .wrap-pro-detail .pro-news-sidebar__title { margin: 0 0 16px; color: #085b32; font-family: Inter, sans-serif; font-size: 25px; font-weight: 800; line-height: 30px; text-align: center; text-transform: uppercase }
.pro-specs__list { list-style: none; margin: 0; padding: 16px 5px 0; border-top: .5px solid #979393; display: flex; flex-direction: column; gap: 10px }
.pro-specs__item { display: flex; align-items: flex-start; gap: 6px; color: #727272; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 21px; min-height: 23px }
.pro-specs__dash { flex-shrink: 0 }
.pro-specs__html b, .pro-specs__html strong, .pro-specs__item b, .pro-specs__item strong { font-weight: 800; color: #727272 }
.pro-specs__html { padding-top: 16px; border-top: .5px solid #979393; color: #727272; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 21px }
.wrap-pro-detail .pro-news-sidebar__list { display: flex; flex-direction: column; align-items: center; gap: 30px; margin: 0 }
.wrap-pro-detail .pro-news-card { display: block; width: 288px; height: 214px; background: #fff; border-radius: 10px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1); color: inherit; text-decoration: none !important; overflow: hidden }
.wrap-pro-detail .pro-news-card:hover .pro-news-card__name { color: #085b32 }
.wrap-pro-detail .pro-news-card__thumb { display: block; width: 276px; height: 140px; margin: 5px 6px 0; overflow: hidden; border-radius: 10px; background: #eee }
.wrap-pro-detail .pro-news-card__thumb img { display: block; width: 100%; height: 100%; object-fit: cover }
.wrap-pro-detail .pro-news-card__name { max-width: 276px; min-height: 0; margin: 10px 6px 0; color: #4e4e4e; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px }
.wrap-pro-detail .pro-news-sidebar__list.slick-pro-news { display: block; gap: 0 }
.wrap-pro-detail .pro-news-sidebar__list.slick-pro-news .swiper-slide { outline: 0 }
.wrap-pro-detail .pro-news-sidebar__list.slick-pro-news.swiper-vertical { height: 470px }
.wrap-pro-detail .pro-news-slide { padding: 4px 0 22px }
.wrap-pro-detail .pro-news-slide .pro-news-card { margin: 0 auto }
.wrap-pro-detail .pro-news-horizontal .pro-news-slide { padding: 6px 8px 10px }
.wrap-pro-detail .pro-related { background: 0 0; border: 0; border-radius: 0; padding: 30px 0 0; margin: 0 }
.wrap-pro-detail .pro-related__title { margin: 0 0 30px; color: #085b32; font-family: Inter, sans-serif; font-size: 30px; font-weight: 800; line-height: 36px; text-align: center; text-transform: uppercase }
.pro-related__grid { display: grid; grid-template-columns: repeat(4, 288px); gap: 16px; justify-content: start }
.wrap-pro-detail .pro-related--viewed { padding-top: 40px }
.product-listing__grid.mt-30 { margin-top: 30px }
.header__hotline { flex: 0 0 auto }
.header__hotline-link { display: flex; align-items: center; gap: 10px; padding: 6px 14px 6px 6px; border-radius: 999px; background: linear-gradient(135deg, #0a6f3d 0, #085b32 55%, #064a29 100%); box-shadow: 0 6px 16px rgba(8, 91, 50, .28); text-decoration: none; white-space: nowrap; transition: transform .25s ease, box-shadow .25s ease }
.header__hotline-link:focus-visible, .header__hotline-link:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(8, 91, 50, .38) }
.header__hotline-link:active { transform: translateY(0) }
.header__hotline-icon { position: relative; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; background: #fff; color: #085b32 }
.header__hotline-icon::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .55); animation: headerHotlinePulse 1.8s ease-out infinite }
.header__hotline-icon svg { animation: headerHotlineShake 2.4s ease-in-out infinite }
.header__hotline-info { display: flex; flex-direction: column; line-height: 1.2; min-width: 0 }
.header__hotline-label { color: rgba(255, 255, 255, .78); font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .04em }
.header__hotline-number { color: #fff; font-size: 16px; font-weight: 700; letter-spacing: .01em }
@keyframes headerHotlinePulse {
    0% { transform: scale(1); opacity: .8 }
    100% { transform: scale(1.45); opacity: 0 }
}
@keyframes headerHotlineShake {
    0%, 100%, 70% { transform: rotate(0) }
    75%, 85% { transform: rotate(-12deg) }
    80%, 90% { transform: rotate(12deg) }
}
ul.site-footer__links li { width: 100% }
.search-wrapper.active input:focus { background: #f1f1f1 }
.HeaderMenu__Search { position: relative }
article.home-why__item:hover { border-color: var(--primary-color); }
article.home-why__item { border: 1px solid transparent; padding: 7px 7px; border-radius: 10px; }
input#keyword::placeholder { color: #888; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 500; line-height: normal; }
.call__ani { animation: headerHotlineShake 2.4s ease-in-out infinite; }
ul.Header__Nav-Top-List { list-style: none; padding: 0; margin: 0; }
.Header__Logo { max-width: 230px; margin-right: 48px; }
.Header__Nav-Btn-Link { position: relative; overflow: hidden; border-radius: 48px; background: var(--color-main); padding: 15px 35px; gap: 13px; max-width: 210px; width: 210px; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.Header__Nav-Btn-Link::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 20%, rgba(255, 255, 255, .42) 50%, transparent 80%); transform: translateX(-120%); pointer-events: none; animation: headerCtaShine 2.8s ease-in-out infinite; }
.Header__Nav-Btn-Link span { position: relative; z-index: 1; color: #FFF; text-align: center; font-size: 16px; font-style: normal; font-weight: 700; line-height: normal; }
.Header__Nav-Btn-Link svg { position: relative; z-index: 1; flex-shrink: 0; display: inline-block; animation: headerHotlineShake 2.4s ease-in-out infinite; }
.Header__Nav-Btn-Link:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(8, 25, 76, .28); }
.Header__Nav-Btn-Link:hover::after { animation-duration: 1.2s; }
@keyframes headerCtaShine {
    0%, 55% { transform: translateX(-120%); }
    80%, 100% { transform: translateX(120%); }
}
.Heder__Nav-Menu { padding: 9px 0 14px 0; gap: calc(30px - 13px); overflow: visible; align-items: stretch !important; }
.Heder__Nav-Menu .Header__Nav-Btn { display: flex; align-items: center; }
.Heder__Nav-Menu .menu-main { align-items: stretch !important; align-self: stretch; }
.Heder__Nav-Menu .menu-main > li { display: flex !important; align-items: center; }
.Heder__Nav-Menu .menu-main > li > a { display: flex; align-items: center; height: 100%; }
.Heder__Nav-Menu .menu-main > li.has-child::after { content: ""; position: absolute; left: 0; width: 100%; top: 100%; height: 18px; }
.Heder__Nav-Menu .menu-main > li.has-child > ul { top: 100%; left: 0; transform: none; pointer-events: auto; margin: 0; transition: opacity .12s ease, visibility .12s ease; transition-delay: .08s; }
.Heder__Nav-Menu .menu-main > li.has-child:hover > ul, .Heder__Nav-Menu .menu-main > li.has-child:focus-within > ul { transition-delay: 0s; }
.Heder__Nav-Menu .menu-main > li.has-child > ul > li { padding-right: 0; display: block; width: 100%; }
.Heder__Nav-Menu .menu-main > li.has-child > ul > li > a { height: auto; width: 100%; }
.Heder__Nav-Menu .menu-main li a.has-child { padding: 0; }
.Heder__Nav-Menu .menu-main li a.has-child:after { display: none !important; content: none !important; }
ul.header-ul a { color: #333; font-size: 14px; font-style: normal; font-weight: 700; line-height: normal; text-transform: uppercase; }
.header-ul li { padding-right: 13px; position: relative; }
/* .header-ul > li > a:before {position: absolute;content: '';width: 0%;height: 2px;background: var(--color-main);left: 50%;transform: translateX(-50%);bottom: 8px;transition: width .3s ease;} */
/* .header-ul > li > a:hover:before, .header-ul > li > a.active::before { width: 100%; } */
.about-intro__visual img { max-width: 100%; border-radius: 10px; }
.tags__about { color: #08194C; font-family: "Be Vietnam Pro"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 25px; /* 156.25% */ margin-bottom: 9px; display: block; }
.Header__Nav-Top-Link span { color: #333; font-size: 14px; font-style: normal; font-weight: 600; line-height: normal; }
.Header__Nav-Top-Link .Header__Nav-Top-Phone { animation: 1s ease-in-out infinite blinkColor; }
.Header__Nav-Top-Link svg { flex-shrink: 0; display: inline-block; }
.Header__Nav-Top-Link { display: flex; align-items: center; gap: 8px; }
.Header__Nav-Top-Account .Header__Nav-Top-Link { color: var(--color-main); }
.Header__Nav-Top-Account .Header__Nav-Top-Link span { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.Header__Nav-Top-Account .Header__Nav-Top-Link:hover span { color: var(--color-submain); }
.Header__Account--icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; color: var(--color-main); background: #f3f5f9; }
.Header__Account--icon:hover { color: var(--color-submain); background: #eef1f6; }
.our-services__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.our-projects__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 24px; }
.customer-feedback__grid { width: 100%; overflow: hidden }
.feedback-swiper { width: 100%; overflow: hidden }
.feedback-swiper .swiper-slide { height: auto }
.feedback-swiper .card-testimonial { height: 100%; display: flex; flex-direction: column }
.feedback-swiper .card-testimonial__body { flex: 1 }
.featured-news { display: flex; align-items: stretch; }
.featured-news__main { flex: 646; min-width: 0; }
.featured-news__divider { flex-shrink: 0; width: 1px; margin: 0 39px 0 27px; background: #DFDFDF; }
.featured-news__list { flex: 488; min-width: 0; display: flex; flex-direction: column; }
.bg-dark-main { background: #F8F8F8; }
.form-consult { display: flex; align-items: stretch; gap: 48px; }
.form-consult__visual { flex: 664 1 0; min-width: 0; overflow: hidden; border-radius: 41px; }
.form-consult__visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.form-consult__panel { flex: 488 1 0; min-width: 0; }
.form-consult__title { margin: 0 0 17px; color: #333; font-family: var(--font-anton); font-size: 41px; font-weight: 400; line-height: 64px; text-transform: uppercase; }
.form-consult__form { display: flex; flex-direction: column; gap: 20px; }
.form-field { display: flex; flex-direction: column; align-items: stretch; gap: 9px; min-width: 0; }
.form-field__label { margin: 0; color: #221B2F; font-family: var(--font-primary); font-size: 16px; font-weight: 700; line-height: 20px; }
.form-field__control { position: relative; flex: 0 0 auto; }
.form-field__icon { position: absolute; left: 21px; top: 50%; z-index: 1; display: inline-flex; color: #515151; transform: translateY(-50%); pointer-events: none; }
.form-field__icon svg { display: block; }
.form-field__input { display: block; width: 100%; height: 49px; padding: 0 20px; border: 1px solid #C6C6C6; border-radius: 90px; background: #fff; color: #333; font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 20px; outline: 0; box-shadow: none; appearance: none; -webkit-appearance: none; }
.form-field--icon .form-field__input { padding-left: 55px; }
.form-field__input::placeholder { color: #515151; }
.form-field__input--area { height: 140px; padding: 17px 20px; border-radius: 20px; resize: vertical; }
.form-field__input:focus { border-color: #08194C; }
.form-field__input--select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2308194C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 20px center; cursor: pointer }
.form-field__input--select:invalid, .form-field__input--select:has(option[value=""]:checked) { color: #515151; }
.form-field__input--select option { color: #333; }
.form-field__feedback { min-height: 18px; margin: 0; font-size: 13px; font-weight: 500; line-height: 18px; }
.was-validated .form-field__input:invalid { border-color: #dc3545 }
.was-validated .form-field:has(.form-field__input:invalid) .form-field__feedback { display: block }
.form-consult__btn { display: inline-flex; align-items: center; justify-content: center; gap: 13px; width: 100%; height: 59px; margin-top: -2px; padding: 0 24px; border: 0; border-radius: 104px; background: #08194C; color: #fff; font-family: var(--font-primary); font-size: 16px; font-weight: 600; line-height: 20px; cursor: pointer; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.form-consult__btn svg { display: block; flex-shrink: 0; }
.form-consult__btn:hover, .form-consult__btn:focus { background: #061238; color: #fff; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(8, 25, 76, .28); }
.form-consult__btn:disabled { opacity: .75; cursor: not-allowed; transform: none; box-shadow: none; }
.home-stats {background: white;padding: 38px 0;}
.home-stats__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.stat-item { position: relative; text-align: center; }
.about-page-stats .stat-item__divider { position: absolute; top: 50%; right: -10px; width: 12px; height: 131px; transform: translate(50%, -50%); }
.stat-item__num {margin: 0;color: var(--color-red);font-family: var(--font-anton);font-size: 55px;font-weight: 400;line-height: 77px;white-space: nowrap;}
.stat-item__label {margin: 0;color: var(--color-main);font-family: var(--font-primary);font-size: 18px;\: 500;line-height: 20px;}
.content-more { position: relative; margin-top: 28px; padding-bottom: 17px }
.content-more__body { position: relative; max-height: 75px; overflow: hidden; transition: max-height .4s ease }
.content-more.is-open .content-more__body { max-height: 5000px }
.content-more__text { color: #666; font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 25px }
.content-more__text p { margin: 0 0 12px }
.content-more__text p:last-child { margin-bottom: 0 }
.content-more__text img { max-width: 100%; height: auto }
.content-more__fade { position: absolute; left: 0; right: 0; bottom: 0; height: 72px; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, #fff 100%); opacity: 1; transition: opacity .3s ease }
.content-more.is-open .content-more__fade { opacity: 0 }
.content-more .btn-cta { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; width: fit-content; margin: 0 auto; transform: none }
.content-more .btn-cta:hover, .content-more .btn-cta:focus { transform: translateY(-2px) }
.content-more.is-open { padding-bottom: 0 }
.content-more.is-open .btn-cta { position: relative; left: auto; right: auto; bottom: auto; display: flex; margin: 20px auto 0 }
.breadCrumbs .breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 0; margin: 0; background: transparent; border-radius: 0; list-style: none }
.breadCrumbs .breadcrumb-item { display: inline-flex; align-items: center; gap: 5px; padding: 0; color: var(--color-gray); font-family: var(--font-primary); font-size: 16px; font-weight: 400; line-height: 25px }
.breadCrumbs .breadcrumb-item + .breadcrumb-item { padding-left: 0 }
/* [SPEC OVERRIDE - Việt Anh breadcrumb, 26/10/2026] .breadCrumbs .breadcrumb-item + .breadcrumb-item::before { display: block; float: none; width: auto; height: auto; margin: 0; padding: 0; content: "/"; background: none; color: #717171; font-family: var(--font-primary); font-size: 16px; font-weight: 600; line-height: 25px } */
.breadCrumbs .breadcrumb-item + .breadcrumb-item::before { display: block; width: 6px; height: 12px; margin: 0 5px; padding: 0; content: ''; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 12' fill='none'%3E%3Cpath d='M.5.5 5.5 6 .5 11.5' stroke='%235c5c5c' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain }
.breadCrumbs .breadcrumb-item a, .breadCrumbs .breadcrumb-item__link { display: inline-flex; align-items: center; color: var(--color-gray); font-family: var(--font-primary); font-size: 16px; font-weight: 400; line-height: 25px; text-decoration: none }
/* [SPEC OVERRIDE - Việt Anh breadcrumb, 26/10/2026] .breadCrumbs .breadcrumb-item a:hover { color: #08194C } */
.breadCrumbs .breadcrumb-item a:hover { color: var(--color-submain) }
/* [SPEC OVERRIDE - Việt Anh breadcrumb, 26/10/2026] .breadCrumbs .breadcrumb-item.active a, .breadCrumbs .breadcrumb-item.active a span {color: var(--color-red);font-weight: 700} */
.breadCrumbs .breadcrumb-item.active a, .breadCrumbs .breadcrumb-item.active a span { color: var(--color-submain); font-weight: 400 }
.breadCrumbs .breadcrumb-item__home { display: none }
.about-criteria { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 20px; margin-top: 36px }
.about-criteria__item { display: flex; align-items: center; gap: 19px }
.about-criteria__icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 63px; height: 63px; border-radius: 50%; }
.about-criteria__icon img { width: 100%; height: auto; }
.about-criteria__name { margin: 0; max-width: 146px; color: #0A2C2C; font-family: var(--font-primary); font-size: 18px; font-weight: 700; line-height: 23px }
.about-quote { padding: 50px 0 }
.about-quote__title { margin: 0 0 30px; color: #333; font-family: var(--font-anton); font-size: clamp(28px, 3.4vw, 41px); font-weight: 400; line-height: 1.56; text-transform: uppercase; }
.about-quote__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6% }
.about-quote__item { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0 }
.about-quote__head { position: relative; display: flex; justify-content: center; width: 100%; margin-bottom: 15px }
.about-quote__icon { position: relative; z-index: 1; display: grid; place-items: center; width: 35%; aspect-ratio: 1; border: 1px solid #08194C; border-radius: 50%; background: #fff; box-sizing: border-box }
.about-quote__icon-inner { display: grid; place-items: center; width: 84%; aspect-ratio: 1; border-radius: 50%; background: #08194C }
.about-quote__icon-inner img { display: block; width: 42%; height: auto }
.about-quote__item:not(:last-child) .about-quote__head::after { content: ""; position: absolute; top: 50%; left: 80%; width: 134px; height: 12px; background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMzQiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMzQgMTIiIGZpbGw9Im5vbmUiPgogIDxwYXRoIGQ9Ik0xMzQgNS43NzM0NEwxMjQgLTYuNTMyNjdlLTA1VjExLjU0NjlMMTM0IDUuNzczNDRaTTAgNS43NzM0NFY2Ljc3MzQ0SDQuMTg3NVY1Ljc3MzQ0VjQuNzczNDRIMFY1Ljc3MzQ0Wk0xMi41NjI1IDUuNzczNDRWNi43NzM0NEgyMC45Mzc1VjUuNzczNDRWNC43NzM0NEgxMi41NjI1VjUuNzczNDRaTTI5LjMxMjUgNS43NzM0NFY2Ljc3MzQ0SDM3LjY4NzVWNS43NzM0NFY0Ljc3MzQ0SDI5LjMxMjVWNS43NzM0NFpNNDYuMDYyNSA1Ljc3MzQ0VjYuNzczNDRINTQuNDM3NVY1Ljc3MzQ0VjQuNzczNDRINDYuMDYyNVY1Ljc3MzQ0Wk02Mi44MTI1IDUuNzczNDRWNi43NzM0NEg3MS4xODc1VjUuNzczNDRWNC43NzM0NEg2Mi44MTI1VjUuNzczNDRaTTc5LjU2MjUgNS43NzM0NFY2Ljc3MzQ0SDg3LjkzNzVWNS43NzM0NFY0Ljc3MzQ0SDc5LjU2MjVWNS43NzM0NFpNOTYuMzEyNSA1Ljc3MzQ0VjYuNzczNDRIMTA0LjY4OFY1Ljc3MzQ0VjQuNzczNDRIOTYuMzEyNVY1Ljc3MzQ0Wk0xMTMuMDYyIDUuNzczNDRWNi43NzM0NEgxMjEuNDM4VjUuNzczNDRWNC43NzM0NEgxMTMuMDYyVjUuNzczNDRaIiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXJfMl85NikiLz4KICA8ZGVmcz4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8yXzk2IiB4MT0iMCIgeTE9IjYuMjczNDQiIHgyPSIxMzQiIHkyPSI2LjI3MzQ0IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiMwODE5NEMiIHN0b3Atb3BhY2l0eT0iMC4yOCIvPgogICAgICA8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMwODE5NEMiLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgPC9kZWZzPgo8L3N2Zz4="); transform: translateY(-50%) }
.about-quote__num { display: block; margin: 0 0 8px; color: #0A2C2C; font-family: var(--font-primary); font-size: clamp(20px, 1.8vw, 24px); font-weight: 700; line-height: 1.26 }
.about-quote__name { margin: 0 0 8px; color: #0A2C2C; font-family: var(--font-primary); font-size: clamp(16px, 1.4vw, 18px); font-weight: 700; line-height: 1.26 }
.about-quote__desc { margin: 0; max-width: 85%; color: #666; font-family: var(--font-primary); font-size: clamp(13px, 1.1vw, 14px); font-weight: 500; line-height: 1.26 }
.service-hero { padding: 10px 0 40px }
.service-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.7%; align-items: start }
.service-hero__gallery { display: grid; grid-template-columns: 13% minmax(0, 1fr); gap: 2.4%; align-items: start; width: 100%; min-width: 0 }
.service-hero__gallery--single { grid-template-columns: minmax(0, 1fr) }
.service-hero__thumbs { width: 100%; max-width: 100%; min-width: 0; height: auto; overflow: hidden }
.service-hero__thumbs .swiper-slide { overflow: hidden; border: 1px solid transparent; border-radius: 7px; cursor: pointer }
/* [SPEC OVERRIDE - Việt Anh chi tiết dịch vụ] .service-hero__thumbs .swiper-slide-thumb-active { border-color: #08194C } */
.service-hero__thumbs .swiper-slide-thumb-active { border-color: var(--color-submain) }
/* [SPEC OVERRIDE - Việt Anh chi tiết dịch vụ] .service-hero__thumbs img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 76 / 75; object-fit: cover } */
.service-hero__thumbs img { display: block; max-width: 100%; height: auto; object-fit: cover }
.service-hero__main { width: 100%; max-width: 100%; min-width: 0; overflow: hidden; border-radius: 10px }
.service-hero__main .swiper-slide { height: auto }
/* [SPEC OVERRIDE - Việt Anh chi tiết dịch vụ] .service-hero__main .swiper-slide img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 500 / 328; object-fit: cover } */
.service-hero__main .swiper-slide img { display: block; max-width: 100%; height: auto }
.service-hero__content { min-width: 0 }
.service-hero__title { margin: 0 0 11px; color: #08194C; font-family: var(--font-primary); font-size: clamp(20px, 1.8vw, 22px); font-weight: 700; line-height: 1.26 }
.service-hero__desc { margin: 0 0 17px; color: #666; font-family: var(--font-primary); font-size: clamp(13px, 1.1vw, 14px); font-weight: 500; line-height: 1.43 }
.service-hero__desc p { margin: 0 0 8px }
.service-hero__desc p:last-child { margin-bottom: 0 }
.service-hero__hotline { display: inline-flex; align-items: center; gap: 11px; margin-bottom: 14px; padding: .7em 1.4em; border: 1px solid #08194C; border-radius: 48px; color: #08194C; font-family: var(--font-primary); font-size: clamp(15px, 1.4vw, 18px); font-weight: 700; line-height: 1.26; text-decoration: none }
.service-hero__hotline img { display: block; width: 1.15em; aspect-ratio: 1 }
.service-hero__hotline:hover { color: #061238; background: rgba(8, 25, 76, .04) }
.service-hero__form-title { margin: 0 0 14px; color: #08194C; font-family: var(--font-primary); font-size: clamp(16px, 1.4vw, 18px); font-weight: 700; line-height: 1.39 }
.service-hero__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 1.7%; margin-bottom: 11px }
.form-field--compact { gap: 0 }
.form-field--compact .form-field__input { height: auto; padding: .75em 1.1em; border-radius: 48px; font-size: 14px; line-height: 1.26 }
.service-hero__submit { display: inline-flex; align-items: center; justify-content: center; gap: .55em; width: 100%; padding: .85em 1.2em; border: 0; border-radius: 48px; background: #08194C; color: #fff; font-family: var(--font-primary); font-size: clamp(15px, 1.4vw, 18px); font-weight: 700; line-height: 1.26; cursor: pointer }
.service-hero__submit img { display: block; width: 1.2em; aspect-ratio: 1 }
.service-hero__submit:hover, .service-hero__submit:focus { background: #061238; color: #fff }
.service-hero__submit:disabled { opacity: .75; cursor: not-allowed }
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post__action { display: inline-flex; align-items: center; flex-shrink: 0; gap: 12px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article { padding: 0; border: 0; border-radius: 0; background: transparent } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article:hover { border-color: transparent; box-shadow: none; transform: none } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__thumb { border-radius: 10px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__thumb img { aspect-ratio: 358 / 208; object-fit: cover; transition: transform .45s ease } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article:hover .card-post__name { color: #08194C } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article:hover .card-post__more-text { color: #08194C } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article:hover .scale-img img:first-child { transform: scale(1.08) } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article:hover .scale-img:before { transition: 1s; left: 130% } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__body { flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 20px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__name { margin: 0 0 9px; color: #333; font-size: 16px; font-weight: 600; line-height: 1.265 } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__desc { color: #333; font-size: 14px; font-weight: 500; line-height: 1.5 } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__action { gap: 11px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__more { background: #08194C; border-color: #08194C; color: #fff } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__more svg { width: 14px; height: 10px } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__more svg path { stroke: #fff } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article:hover .card-post__more { background: #061238; border-color: #061238; color: #fff } */
/* [SPEC OVERRIDE - Việt Anh card dịch vụ] .card-post--article .card-post__more-text { color: #333; font-family: var(--font-primary); font-size: 16px; font-weight: 700; line-height: 1.265 } */
.service-body { padding: 0 0 40px }
.service-body__grid { display: grid; grid-template-columns: minmax(0, 793fr) minmax(0, 387fr); gap: 1.67%; align-items: stretch }
.service-body__main, .service-body__aside { display: flex; flex-direction: column; min-width: 0; padding: 16px 14px; border: 1px solid #D4D4D4; border-radius: 13px; background: #fff }
.service-body__title { margin: 0 0 16px; color: #20150F; font-family: var(--font-primary); font-size: 21px; font-weight: 700; line-height: 1.265 }
.service-body__empty { margin: 0; color: #727272; font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 24px }
.service-body__toc { margin: 0 0 15px }
.service-body .wrap-toc { width: 100%; margin: 0; padding: 0; background: #F2FFF8; border: 1px solid #2A3C72; border-radius: 4px; font-size: inherit; overflow: hidden; }
.service-body .toc-head { min-height: 40px; padding: 0 14px; color: #412921; font-family: var(--font-primary); font-size: 16px; font-weight: 700; line-height: 1.265 }
.service-body .toc-head svg { display: none }
.service-body__toc-icon { display: block; width: 16px; height: auto; aspect-ratio: 16 / 11; margin-right: 12px }
.service-body__toc-chevron { display: block; width: 12px; height: auto; aspect-ratio: 12 / 6; margin-left: auto }
.service-body .toc-list { margin: 0; padding: 8px 14px 12px; max-height: 240px; background: #fff }
.service-body .toc-list li a { color: #412921 !important; font-family: var(--font-primary) }
.service-body .toc-list li a:hover, .service-body .toc-list li a.active { color: #08194C !important }
.service-body__more { position: relative; flex: 1; min-height: 0; margin-top: 0; padding-bottom: 0 }
.service-body__more.content-more { margin-top: 0 }
.service-body__more .content-more__body { max-height: clamp(280px, 43vw, 517px) }
.service-body__more .content-more__text { color: #727272; font-size: 16px; font-weight: 500; line-height: 24px }
.service-body__more .content-more__text h1, .service-body__more .content-more__text h2, .service-body__more .content-more__text h3, .service-body__more .content-more__text h4 { margin: 0 0 12px; color: #222; font-family: var(--font-primary); font-size: 18px; font-weight: 700; line-height: 1.265 }
.service-body__more .content-more__text img { border-radius: 10px }
.service-body__more .content-more__fade { z-index: 1; height: 15.5%; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 18.75%, #fff 100%) }
.service-body__news { position: relative; isolation: isolate; flex: 1; width: 100%; min-height: 0; aspect-ratio: 358 / 647; overflow: hidden; background: #fff }
.service-body__news::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 5; height: 12.4%; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 18.75%, #fff 100%) }
.service-body__news-swiper { position: relative; z-index: 0 !important; width: 100%; height: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, #000 0, #000 87.6%, rgba(0, 0, 0, 0) 100%); mask-image: linear-gradient(180deg, #000 0, #000 87.6%, rgba(0, 0, 0, 0) 100%) }
.service-body__news-swiper .swiper-wrapper, .service-body__news-swiper .swiper-slide { z-index: 0 !important }
.service-body__news-swiper .swiper-slide { height: auto }
.service-body__news-fade { display: none }
.service-related {}
.service-related .section-heading { margin-bottom: 20px }
.service-related__swiper { width: 100%; overflow: hidden }
.service-related__swiper .swiper-slide { height: auto }
.service-related .card-post { height: 100% }
.service-related .card-post__thumb img { aspect-ratio: 354 / 232; object-fit: cover }
.header-nav-mb { display: none; }
.Header__Nav-Top {padding: 10px 0;background: #062f66;color: #fff;font-size: 11px;line-height: 18px}
.Header__Nav-Top a, .Header__Nav-Top span {color: #fff;font-size: 16px;font-weight: 600;}
.Header__Nav-Top a:hover {color: var(--color-red);}
.Header__Nav-Top .site-footer__social { gap: 4px }
.Header__Nav-Top .site-footer__social a {/* width: 42px; *//* height: 18px; */}
#Header .Header__wrapper { background: #fff }
#Header .Header__wrapper > .container { min-height: 60px }
#Header .Header__Logo {flex: 0 0 82px;width: 82px;margin-right: 16px}
#Header .Header__Logo img {/* width: 58px; *//* height: 58px; */object-fit: contain}
#Header .menu-wrapper {flex: 0 0 183px;width: 183px;margin: 0 16px 0 0;background: transparent;text-align: left}
#Header .menu-wrapper::before { display: none }
#Header .menu-toggle {width: 100%;min-height: 40px;padding: 7px 12px;gap: 8px;border: 1px solid #062f66;border-radius: 20px;background: #fff;color: #062f66;font-size: 18px;font-weight: 600;text-decoration: none;line-height: 1;}
#Header .menu-toggle i:last-child { margin-left: auto; font-size: 10px }
#Header .menu-wrapper:hover .menu-toggle { background: #062f66; color: #fff }
#Header .menu-dropdown { top: calc(100% + 11px); left: -74px; z-index: 100; width: min(900px, calc(100vw - 30px)); height: 400px; padding: 0; border: 1px solid #e8e8e8; border-radius: 6px; box-shadow: 0 5px 18px rgba(0, 0, 0, .18) }
#Header .menu-dropdown::before { content: ""; position: absolute; left: 74px; right: 0; top: -12px; height: 12px }
#Header .menu-dropdown > .menu-left { flex: 0 0 200px; width: 200px; padding: 7px 0; overflow-y: auto; background: #f8f8f8 }
#Header .menu-dropdown > .menu-left > li { padding: 0; border: 0; font-size: 14px; font-weight: 500 }
#Header .menu-dropdown > .menu-left > li > a { display: block; padding: 9px 12px; color: #333; text-decoration: none }
#Header .menu-dropdown > .menu-left > li.active, #Header .menu-dropdown > .menu-left > li:hover { border: 0; background: #fff }
#Header .menu-dropdown > .menu-left > li.active > a, #Header .menu-dropdown > .menu-left > li:hover > a { color: #062f66 }
#Header .menu-right { min-width: 0; padding: 20px 16px; overflow-y: auto; background: #fff }
#Header .menu-panel > .mb-3 > a { color: #111; font-size: 16px }
#Header .menu-panel .category-item { width: calc(16.6667% - 7px); padding: 5px; color: #222 }
#Header .menu-panel .category-item .image { display: flex; align-items: center; justify-content: center; height: 58px; margin-bottom: 7px }
#Header .menu-panel .category-item .image img { width: 54px; height: 54px; max-width: 54px; object-fit: contain }
#Header .menu-panel .category-item .name { color: #222; font-size: 13px; font-weight: 500; line-height: 17px; text-align: center }
#Header .Header__Nav { min-width: 0 }
#Header .Heder__Nav-Menu { gap: 14px; padding: 7px 0 }
#Header .header-ul { gap: 20px; justify-content: flex-start !important }
#Header .header-ul li { padding-right: 0 }
#Header .header-ul > li > a {min-height: 40px;font-size: 18px;font-weight: 500;text-transform: capitalize;white-space: nowrap;padding: 0 14px;}
#Header .header-ul > li > a::before { bottom: 3px }
#Header .HeaderMenu__Search {position: relative;flex: 1 1 309px;max-width: 309px;margin-left: auto}
#Header .search-wrapper.active {width: 100%;height: 40px;border: 1px solid #ececec;background: #fff}
#Header .search-wrapper input {width: calc(100% - 38px);font-size: 12px;font-weight: 500;}
#Header .search-wrapper input::placeholder { font-size: 14px }
#Header .search-wrapper .btn {width: 32px;height: 32px;margin-right: 6px;padding: 0;background: #062f66;color: #fff;font-size: 17px;}
#Header .header__hotline-link { gap: 8px; padding: 0; background: transparent; box-shadow: none }
#Header .header__hotline-link:hover { box-shadow: none }
#Header .header__hotline-icon { width: 38px; height: 38px; flex-basis: 38px; background: #e21d25; color: #fff }
#Header .header__hotline-icon::before { display: none }
#Header .header__hotline-number {color: var(--color-red);font-size: 22px;font-weight: 800;}

/* Homepage - Dai Thanh Phat */
:root{--dtp-blue:#032a60;--dtp-red:#dc1c1f;--dtp-pale:#ecf4ff;--dtp-text:#383838}
.page-index .slideshow{width:100%;max-width:none;margin:0;padding:0;border-radius:0;overflow:hidden}
.page-index .slideshow-image{position:relative;inset:auto}
.page-index .slideshow-image img{height:100%;object-fit:cover}
.dtp-about{padding:40px 0 46px}.dtp-about .container,.dtp-featured .container,.dtp-products .container,.dtp-services .container,.dtp-videos .container,.dtp-partners .container,.dtp-seo .container{max-width:1200px}
.dtp-kicker{display:inline-block;color:#7c7c7c;padding-bottom:6px;border-bottom:3px solid var(--dtp-red);margin-bottom:18px}
.dtp-about h1{max-width:600px;color:var(--dtp-blue);font-size:46px;line-height:1.12;font-weight:800;margin-bottom:20px}.dtp-about__desc{font-size:16px;line-height:1.5;max-width:600px}.dtp-about__image{object-fit:cover;border-radius:10px}
.dtp-btn{display:inline-flex;align-items:center;gap:16px;margin-top:28px;border:1px solid var(--dtp-red);border-radius:30px;padding:8px 9px 8px 20px;color:var(--dtp-red);font-weight:700}.dtp-btn i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--dtp-red);color:#fff}
.dtp-featured{
    background-image: url(../images/bg-productHot.webp);
    background-size: cover;
}.dtp-featured .title-main h2,.dtp-featured .dtp-title{color:#fff}.dtp-title{text-transform:uppercase;color:var(--dtp-blue);font-size:30px;font-weight:800}.dtp-tabs{display:flex;gap:15px;align-items:center;overflow:auto;padding:25px 0 30px}.dtp-tabs a,.dtp-tabs span,.dtp-tabs button{flex:0 0 auto;padding:8px 15px;border:0;background:var(--dtp-pale);border-radius:30px;color:var(--dtp-blue);font-weight:600}.dtp-tabs .active,.dtp-tabs button.choosed{background:var(--dtp-blue);color:#fff}
.dtp-featured__image{width:100%;height:274px;object-fit:contain;background:#fff;border-radius:10px}.dtp-featured__copy h3{font-size:25px;color:var(--dtp-blue);font-weight:700}.dtp-price strong{color:var(--dtp-red)}.dtp-link{display:inline-flex;gap:10px;color:var(--dtp-red);align-items: center;font-weight: 600;font-size: 16px;margin-top: 14px;padding: 2px 10px;background-color: white;border-radius: 30px;}.dtp-featured__list{/* background:#fff; */border-radius:10px;overflow:hidden;text-align: end;}.dtp-featured__list button{display:flex;width:100%;justify-content:space-between;align-items:center;padding:13px 20px;border:0;border-bottom: 1px dashed #ffffff6b;background: transparent;font-weight: 500;color: white;text-align:left;transition:.2s ease}.dtp-featured__list button:hover,.dtp-featured__list button.active{background: white;color: var(--color-red);border-radius: 10px;}.dtp-featured__list button i{flex:0 0 auto;margin-left:12px}
.dtp-products{padding-bottom:42px;background:#f7faff}.dtp-sectionbar{background:var(--dtp-blue);color:#fff;padding:10px 0;margin-bottom:25px}.dtp-sectionbar h2{
    margin: 0;
}.dtp-sectionbar a{color:#fff;font-weight:600;display:flex;align-items:center;gap:12px}
.dtp-card{display:flex;flex-direction:column;background:#fff;padding:3px 7px 10px;border-radius:10px;box-shadow:0 0 10px rgba(80,56,56,.1);overflow:hidden}.dtp-card__image{height:215px;display:block}.dtp-card__image img{width:100%;height:100%;object-fit:contain}.dtp-card h3{font-size:16px;line-height:24px;font-weight: 600;margin:10px 0 5px;min-height: 41px;}
.dtp-card h3 a{color:var(--dtp-text)}
.dtp-card h3:hover a{color:var(--color-red)}

.dtp-card__desc{color:#7c7c7c;font-size:14px;line-height:20px;min-height:40px}.dtp-card__cta{display:block;margin-top:auto;padding:7px;text-align:center;border-radius:30px;color:#fff;text-transform:uppercase;font-size: 18px;font-weight:700;background:linear-gradient(85deg,#ee0a13,#b02127)}
.dtp-services,.dtp-videos,.dtp-partners{padding-bottom: 1.5rem;}.dtp-service-list{display:flex;gap:15px;height:430px}.dtp-service-item{flex:0 1 188px;min-width:0;transition:flex-basis .45s ease,flex-grow .45s ease}.dtp-service-item.active{flex:1 1 593px}.dtp-service{height:430px;display:block;position:relative;border:1px solid transparent;border-radius:10px;overflow:hidden}.dtp-service-item.active .dtp-service{border-color:var(--dtp-red)}.dtp-service img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.dtp-service:hover img{transform:scale(1.035)}.dtp-service:after{content:"";position:absolute;inset:42% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.82));opacity:0;transition:opacity .3s ease}.dtp-service span{position:absolute;z-index:2;left:12px;right:12px;bottom:12px;color:#fff;opacity:0;transform:translateY(10px);transition:.3s ease}.dtp-service strong,.dtp-service small{display:block}.dtp-service strong{font-size: 18px;color: var(--color-red);}.dtp-service small{margin-top:5px;font-size: 16px;font-weight: 500;}.dtp-service>i{position:absolute;z-index:3;top:10px;right:10px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--dtp-blue);color:#fff}.dtp-service-item.active .dtp-service:after,.dtp-service-item.active .dtp-service span{opacity:1}.dtp-service-item.active .dtp-service span{transform:none;margin:-12px;padding: 85px 12px 12px;color:#777;background: #FFFFF;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 88%);}.dtp-service-item.active .dtp-service>i{display:none}
.dtp-video{height:500px;display:block;position:relative;border-radius:10px;overflow:hidden;background:#eee}.dtp-video img{width:100%;height:100%;object-fit:cover}.dtp-video>i{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:64px;height:64px;display:grid;place-items:center;background:rgba(255,255,255,.9);color:var(--dtp-red);border-radius:50%}.dtp-video strong{position:absolute;left:15px;right:15px;bottom:15px;padding:12px;background:rgba(3,42,96,.9);color:#fff;border-radius:6px}
.dtp-partner-swiper .swiper-slide a{height:122px;border:1px solid #e0e5eb;border-radius:8px;display:grid;place-items:center;background:#fff}.dtp-partner-swiper img{max-width:90%;max-height:95px}.dtp-seo{padding: 0 0 15px;line-height:1.6}

/* ===================== VIỆT ANH (26/10/2026) ===================== */
/* Header */
#Header.header-bottom { background: linear-gradient(90deg, #fff 12%, rgba(255, 255, 255, 0) 28%, rgba(255, 255, 255, 0) 80%, #fff 90%), linear-gradient(rgba(255, 255, 255, .4), rgba(255, 255, 255, .4)), url(../images/header-bg.webp) no-repeat center bottom / cover, #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, .05) }
.btn-hotline { display: block; padding: 4px 24px; color: var(--color-main); border: 1px solid var(--color-main); border-radius: 100px; background: rgba(255, 255, 255, .2); animation: 1s ease-in-out infinite blinkColor }
.btn-hotline:hover { animation: none; color: #fff; background: var(--color-main) }
/* Footer */
.footer-contact svg { color: var(--color-submain) }
.footer-contact a:hover svg { color: var(--color-main) }
.footer-fanpage iframe { display: block; max-width: 100%; border: .5px solid var(--color-submain); border-radius: 6px; overflow: hidden }
.footer-social a { display: block; transition: transform .3s }
.footer-social a:hover { transform: translateY(-4px) }
.footer-copy { border-top: .5px solid var(--color-submain) }
/* Giải pháp kỹ thuật (trang chủ + giới thiệu) */
.wrap-giaiphap { background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(rgba(255, 255, 255, .92), rgba(255, 255, 255, .92)), url(../images/bg-giaiphap.webp) no-repeat center / cover }
.giaiphap-image { max-width: 568px; padding: 0 0 6.7% 11.4% }
.giaiphap-image .photo-sub { top: 30%; left: 0; width: 21.2% }
.giaiphap-badge { right: 0; bottom: 0; width: 21.5%; aspect-ratio: 1; color: var(--color-submain); background: #fff; border-radius: 50%; box-shadow: 0 0 20px 10px rgba(255, 255, 255, .9) }
.giaiphap-badge .badge-text { position: absolute; inset: 0; width: 100%; height: 100%; animation: rotateme 20s linear infinite }
.giaiphap-badge .badge-icon { width: 61%; height: 61%; border: 1px solid var(--color-submain) }
.giaiphap-badge .badge-icon img { width: 55% }
.giaiphap-title { color: var(--color-submain) }
/* Lĩnh vực hoạt động */
.linhvuc-item .number { right: 0; bottom: -.22em; z-index: 1; color: rgba(255, 255, 255, .35); transition: color .3s }
.linhvuc-item .image:hover .number { color: rgba(255, 255, 255, .85) }
.linhvuc-item .name a:hover { color: var(--color-main) }
/* Tin tức & video */
.video-card { max-width: 500px; margin-inline: auto }
.video-card .image video { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; object-fit: cover; background: #000 }
.video-card .btn-play { z-index: 1; transition: transform .3s }
.video-card .btn-play:hover { transform: scale(1.1) }
.video-card .btn-play svg { width: clamp(60px, 7vw, 95px); height: auto }
.video-card .name { color: var(--color-gray) }
.video-wrap { border-left: 1px solid var(--color-submain) }
.video-nav { left: 0; right: 0; top: 40%; z-index: 3; pointer-events: none }
.video-nav button { position: static; width: 29px; height: 29px; margin: 0; color: var(--color-submain); background: #ecf9dd; border: 0; border-radius: 50%; pointer-events: auto; transition: .3s }
.video-nav button:hover { color: #fff; background: var(--color-submain) }
.video-nav button::after { display: none }
.video-nav button svg { width: 16px; height: 16px }
/* Tiêu chí */
.wrap-tieuchi { min-height: clamp(560px, 46.527778vw, 670px); padding-bottom: clamp(160px, 22.291667vw, 321px); background: url(../images/tieuchi-cay.webp) no-repeat center calc(100% + clamp(0px, 5.972222vw, 86px)) / 100% auto, linear-gradient(rgba(255, 255, 255, .7), rgba(255, 255, 255, .7)), url(../images/tieuchi-bg.webp) no-repeat center / cover }
.tieuchi-card { min-height: 220px; border: .5px solid var(--color-submain); border-radius: 10px; box-shadow: 0 4px 4px rgba(38, 72, 5, .1); transition: transform .3s, box-shadow .3s }
.tieuchi-card:hover { transform: translateY(-6px); box-shadow: 0 10px 20px rgba(38, 72, 5, .15) }
.tieuchi-card .name { color: #4e4e4e; transition: color .3s }
.tieuchi-card:hover .name { color: var(--color-submain) }
/* Đối tác */
.doitac-logo { height: 130px }
.doitac-logo img { object-fit: contain; transition: transform .3s }
.doitac-logo:hover img { transform: scale(1.06); filter: none }
/* Đăng ký nhận tư vấn */
.dangky-box { background: var(--color-green-light) }
.dangky-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover }
.dangky-box .form-control { border: .5px solid #d9d9d9; border-radius: 4px }
.dangky-box .form-control:focus { border-color: var(--color-submain); box-shadow: 0 0 0 2px rgba(130, 188, 69, .2) }
.dangky-box label { color: var(--color-gray) }
.btn-dangky { color: #fff; background: var(--color-submain); transition: background .3s }
.btn-dangky:hover { background: var(--color-main) }
.btn-dangky svg { transition: transform .3s }
.btn-dangky:hover svg { transform: translateX(6px) }
/* Nội dung SEO gấp/bung */
.wrap-seo .hide-content { background: linear-gradient(transparent, #fff 100%) }
/* Giới thiệu: banner */
.wrap-banner { min-height: clamp(220px, 38.194444vw, 550px) }
.wrap-banner .banner-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover }
.wrap-banner h2 { z-index: 1; text-shadow: 0 3px 4px rgba(0, 0, 0, .25) }
/* Giới thiệu: lịch sử hoạt động */
.lichsu-item { border-bottom: 1px solid #e5e5e5 }
.lichsu-year { color: #d2d2d2; transition: color .3s }
.lichsu-year:hover { color: var(--color-submain) }
.lichsu-item .lichsu-body, .lichsu-item.active .lichsu-year { display: none }
.lichsu-item.active .lichsu-body { display: flex; animation: fadeInUpDoanHang .5s ease }
.lichsu-item .name { color: var(--color-gray) }
/* Giới thiệu: tầm nhìn sứ mệnh */
.tamnhin-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover }
.wrap-tamnhin .container { z-index: 2 }
.wrap-tamnhin { min-height: clamp(400px, 34.722222vw, 500px) }
.tamnhin-box { min-height: 290px; border-radius: 16px; background: rgba(255, 255, 255, .96) }
.tamnhin-col { border-left: 1px solid #eec645 }
.tamnhin-item { max-width: 304px; margin-inline: auto }
/* Giới thiệu: giá trị cốt lõi — rê chuột mục nào sáng mục đó, các mục khác mờ đi */
.giatri-card { transition: opacity .3s, transform .3s }
.giatri-card .image { width: 65px; height: 65px; background: #ecf9dd; border: 1px solid var(--color-submain); transition: box-shadow .3s, background .3s }
.giatri-card .name { color: #4e4e4e; transition: color .3s }
.giatri-list:hover .giatri-card { opacity: .45 }
.giatri-list .giatri-card:hover { opacity: 1; transform: translateY(-4px) }
.giatri-card:hover .image { background: #fff; box-shadow: 0 0 0 6px rgba(130, 188, 69, .2), 0 0 24px rgba(130, 188, 69, .6) }
.giatri-card:hover .name { color: var(--color-submain) }
.giatri-photo { max-width: 390px; border-radius: 20px; overflow: hidden }
/* Giới thiệu: dự án đã thực hiện */
.duan-item .info { inset: 0; background: rgba(16, 30, 2, .7); opacity: 0; transition: opacity .4s }
.duan-item:hover .info { opacity: 1 }
.duan-item img { transition: transform .5s }
.duan-item:hover img { transform: scale(1.08) }
/* Card dịch vụ (card_post) + trang dịch vụ */
.card-post { color: inherit }
.card-post .image { overflow: hidden; border: 1px solid transparent; border-radius: 8px; transition: border-color .3s }
.card-post .name { color: var(--color-gray); transition: color .3s }
.card-post:hover .image { border-color: var(--color-submain) }
.card-post:hover .name { color: var(--color-submain) }
.news-page__grid.dichvu-grid { --news-gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 40px }
/* Chi tiết dịch vụ */
.chitiet-gallery { gap: 13px }
.chitiet-gallery .service-hero__main { border: 0 }
.chitiet-gallery .service-hero__main a { display: block; max-width: 473px; overflow: hidden; border: 1.64px solid var(--color-submain); border-radius: 10px }
.chitiet-gallery .service-hero__thumbs .swiper-slide { border: 0; opacity: .7; transition: opacity .3s }
.chitiet-gallery .service-hero__thumbs .image { border: .37px solid #a0a0a0; border-radius: 10px }
.chitiet-gallery .service-hero__thumbs .swiper-slide-thumb-active, .chitiet-gallery .service-hero__thumbs .swiper-slide:hover { opacity: 1 }
.chitiet-name, .chitiet-desc { border-bottom: .5px solid var(--color-submain) }
.btn-call { padding-left: 0; background: var(--color-main); border-radius: 8px; transition: background .3s }
.btn-call .icon { width: 64px; height: 64px; margin: -7px 0; color: var(--color-main); border: .8px solid var(--color-main); animation: tada 1.2s infinite }
.btn-call:hover { color: #fff; background: #c4006b }
.btn-zalo { min-height: 50px; background: #0068ff; border-radius: 8px; transition: background .3s }
.btn-zalo:hover { color: #fff; background: #0052cc }
.chitiet-box { border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, .1); overflow: hidden }
.chitiet-box .toc-head { background: var(--color-submain) }
.chitiet-box .wrap-toc { margin: 0; padding: 0; background: var(--color-submain); border: 0 }
.chitiet-box .toc-list { margin: 0; padding: 8px 24px 12px 44px }
.wrap-chitiet-content #noidung { max-height: 835px }
.wrap-chitiet-content .hide-content { left: 0; background: linear-gradient(transparent, #fff 100%) }

.chitiet-gallery .service-hero__thumbs { width: 106px }
/* Nút gấp/bung nằm trong .content-text: core ép màu link xanh dương (!important) + .blob-txt chữ trắng → trả về màu nút line */
.content-text a.btn-main.line { color: var(--color-submain) !important }
.content-text a.btn-main.line:hover { color: #fff !important }
.btn-main.line .blob-txt { color: inherit }
.scrollToTop:hover { color: #fff; background: var(--color-submain) }
/* Chi tiết dịch vụ: heading trong nội dung CKE theo Figma (xanh lá, đậm vừa) — nội dung madmin không gắn được utility nên scope theo khối */
.chitiet-box #toc-content h2, .chitiet-box #toc-content h3 { margin: 16px 0 8px; font-size: clamp(15px, 2vw, 18px); font-weight: 700; color: var(--color-submain) }
.chitiet-box #toc-content p { color: #858585; font-weight: 500 }
.chitiet-box #toc-content img { border-radius: 10px }
/* Menu Dịch vụ: cấp 1 liệt kê sẵn, rê chuột vào mới bung cấp 2 sang bên phải (flyout). menu.css cũ để a.has-child padding 0 nên dính mép, ul con không absolute nên hiện sẵn */
.menu-main li ul li a.has-child { padding: 8px 36px 8px 16px }
.menu-main li ul li a.has-child:after { right: 16px }
.menu-main li ul li ul { position: absolute; top: -8px; left: 100%; width: max-content; min-width: 250px; padding: 8px 0; background-color: #fff; border-radius: 8px; box-shadow: 0 10px 28px rgba(8, 25, 76, .14); opacity: 0; visibility: hidden; transition: opacity .15s ease, visibility .15s ease; z-index: 51 }
.menu-main li ul li:hover>ul, .menu-main li ul li:focus-within>ul { opacity: 1; visibility: visible }
/* Nút nổi góc phải (gọi, Zalo, lên đầu trang) màu xanh theo --color-submain; base.css để --color-main */
.scrollToTop { color: var(--color-submain) }
.scrollToTop-bar { stroke: var(--color-submain) }
/* Thanh nổi mobile (nút gọi + dải icon) màu xanh theo --color-submain; base.css để --color-main */
.toolbar2 .phone, .toolbar2 ul { background: var(--color-submain) }