.banner-about .banner-layers {
    max-width: 1350px;
}
.banner-about p{
    font-size: 20px;
    font-weight: 600;
}
.banner-about .text-box-2 p{
    font-size: 16px;
    line-height: 22px;
}
.banner-about .text-box-2 .col{
    padding: unset;
}
.banner-about .text-box-2 .col-1 .icon-box{
    padding-right: 10px;
}
.banner-about .text-box-2 .col-2 .icon-box{
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    padding-left: 10px;
    padding-right: 10px;
}
.banner-about .text-box-2 .col-3 .icon-box{
    border-right: 1px solid #fff;
    padding-left: 10px;
    padding-right: 10px;
}
.banner-about .text-box-2 .col-4 .icon-box{
    padding-left: 10px;
}

.about-breadcrumb{
    padding-bottom: unset !important;
}
.about-breadcrumb .col{
    padding-left: unset;
    padding-bottom: unset;
}
.about-breadcrumb .custom-breadcrumb li{
    margin-left: unset;
}

/*.section1-about{*/
/*    padding-top: 30px !important;*/
/*}*/
.section1-about h2,
.section3-about h2{
    color: var(--hg-primary);
    border-left: 5px solid var(--hg-primary);
    padding-left: 15px;
}
.section1-about .col-left p,
.section3-about .col-left p{
    color: var(--hg-text);
}
.section1-about .icon-box p{
    margin-bottom: unset;
}
.section1-about .icon-box .sub-title{
    color: var(--hg-primary);
    font-size: 20px;
    font-weight: 600;
}
.section1-about .icon-box-img img{
    padding-top: unset;
}
.section1-about .icon-box-img {
    display: flex;
    align-items: center;
}
.section1-about .col-right img{
    border-radius: 20px;
}

.section2-about h2,
.section5-about h2,
.section6-about h2{
    color: var(--hg-primary);
    margin-bottom: unset;
}
.section2-about .col-left p,
.section5-about .row-title p{
    color: var(--hg-text);
}
.section2-about .col-left .col-inner,
.section5-about .row-title .col-inner,
.section6-about .row-title .col-inner{
    border-left: 5px solid var(--hg-primary);
    padding-left: 15px;
}

.section3-about .col-left .name-title{
    font-size: 20px !important;
    font-weight: 600;
    color: var(--hg-primary) !important;
}
.section3-about .col-left .vtri{
    color: #7A7A7A;
    font-size: 16px;
    position: relative;
    padding-left: 30px;
}
.section3-about .col-left .vtri:before{
    content: '';
    position: absolute;
    height: 2px;
    width: 25px;
    background-color: var(--hg-primary);
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
}
.section3-about .col-left .box{
    background-color: #EAF6F2;
    padding: 20px;
    border-radius: 20px;
}
.section3-about .col-left .box:before{
    content: '';
    position: absolute;
    background-image: url(/wp-content/uploads/2026/10/icon-phay.png);
    background-size: cover;
    background-repeat: no-repeat;
    width: 45px;
    height: 45px;
    bottom: 75%;
    left: 90%;
    transform: translate(-90%, -75%);
}
.section3-about .col-left .box p{
    color: #7A7A7A;
    font-size: 16px;
}
.section3-about .col-left .box img{
    border-radius: 50%;
}
.section3-about .col-right .img-inner{
    border-radius: 20px;
}
.section3-about .video-button-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    margin: 0;
    transform: translate(-50%, -50%);
}
.section3-about .video-button-wrapper .button i {
    color: var(--hg-primary);
    font-size: 1.3em !important;
}
.section3-about .video-button-wrapper .button {
    margin-bottom: unset;
    border: 2px solid #fff;
    background-color: #fff;
}

.section4-about{
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}
.section4-about h2{
    margin-bottom: unset;
}
.section4-about .row-title .col-inner{
    padding-left: 15px;
    border-left: 5px solid #fff;
}
.section4-about .row-content .col{
    flex-basis: 20%;
    max-width: 20%;
}
.section4-about .row-content .col .col-inner{
    height: 300px;
    border-radius: 20px;
    padding: 15px;
}
.section4-about .row-content .col-1 .col-inner,
.section4-about .row-content .col-3 .col-inner,
.section4-about .row-content .col-5 .col-inner{
    background-color: #EAF6F2;
}
.section4-about .row-content .col-2 .col-inner,
.section4-about .row-content .col-4 .col-inner{
    background-color: #fff;
}
.section4-about .row-content .sub-title{
    font-size: 20px;
    color: var(--hg-primary);
    font-weight: 600;
    margin-bottom: 15px;
}
.section4-about .row-content p{
    color: var(--hg-text);
}

.section6-about h2 span{
    color: var(--green-natural);
}


.section7-about .row .col{
    flex-basis: 20%;
    max-width: 20%;
}
.section7-about .stat-col .sc-stat {
    position: relative;
    text-align: center;
}
.section7-about .stat-col .sc-number {
    color: var(--hg-primary);
    font-size: 60px;
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.section7-about .stat-col .sc-label {
    margin: 6px 0 0;
    color: var(--hg-text);
    font-size: 16px;
    line-height: 1.4;
}
.section7-about .stat-col > .col-inner > .img {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    width: auto !important;
    margin: 0 !important;
    transform: translate(-50%, -50%);
    opacity: .15;
    pointer-events: none;
}

.section8-about{
    padding-top: 260px !important;
    padding-bottom: 120px !important;
}
.section8-about h2,
.section8-about p{
    margin-bottom: unset;
}

/* ---------- Responsive ---------- */
/* ---------- Laptop / tablet ngang: ≤ 1099px ---------- */
@media (min-width: 1100px) and (max-width: 1440px) {
    .banner-about .text-box{
        left: 15px;
    }
    .banner-about .text-box-2 {
        left: 2%;
        top: 70%;
    }
    .about-breadcrumb{
	    padding-left: 15px !important;
	}
}
@media (min-width: 850px) and (max-width: 1099px) {
    .banner-about {
        padding-top: 400px !important;
    }
    .banner-about .text-box {
        width: 90% !important;
        left: 15px;
        top: 15%;
    }
    .banner-about .text-box-2{
        top: 70%;
        left: 30px;
    }
    .about-breadcrumb .col {
        padding-bottom: unset !important;
    }
    .about-breadcrumb {
        padding-left: 15px !important;
    }
    .section4-about .row-content .col,
    .section7-about .row .col{
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    .section7-about .row .col{
        margin-bottom: 15px;
    }
    .section8-about {
        padding-top: 140px !important;
        padding-bottom: 60px !important;
    }
}
@media (min-width: 550px) and (max-width: 849px) {
    .banner-about {
        padding-top: 400px !important;
    }
    .banner-about .text-box {
        width: 90% !important;
        left: 15px;
        top: 15%;
    }
    .banner-about .text-box-2{
        top: 70%;
        left: 30px;
    }
    .banner-about h1 {
        font-size: 44px !important;
    }
    .about-breadcrumb .col {
        padding-bottom: unset !important;
    }
    .about-breadcrumb {
        padding-left: 15px !important;
    }
    .section4-about .row-content .col,
    .section7-about .row .col{
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
    .section8-about {
        padding-top: 120px !important;
        padding-bottom: 60px !important;
    }
}
@media (max-width: 549px) {
    .banner-about .text-box {
        width: 90% !important;
        left: 15px;
        top: 10%;
    }
    .banner-about .text-box-2{
        top: 53%;
    }
    .banner-about h1 {
        font-size: 38px !important;
    }
    .banner-about p {
        font-size: 16px;
        font-weight: 600;
    }
    .banner-about .text-box-2 .row { 
        display: grid !important; 
        grid-template-columns: 1fr 1fr; 
        gap: 10px; 
        margin: 0 !important; 
    }
    .banner-about .text-box-2 .col {
		flex: none !important;
		width: auto !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}
	.banner-about .text-box-2 .col::before, 
	.banner-about .text-box-2 .col::after { 
	    display: none !important; 
	}
	.banner-about .text-box-2 .col-inner {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
		padding: 14px 8px;
		border: 1px solid rgba(255, 255, 255, .25) !important;
		border-radius: 14px;
		background: rgba(255, 255, 255, .12);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
	}
	.banner-about .text-box-2 .col-inner .icon-box{
	    border-right: unset;
	}
	.banner-about .text-box-2 .col-2 .icon-box{
	    border-left: unset;
	}
	.banner-about .text-box-2 .icon-box { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 0; }
	.banner-about .text-box-2 .icon-box-img { width: 30px !important; margin: 0 !important; }
	.banner-about .text-box-2 .icon-box-text p { margin: 0 !important; font-size: 13px; font-weight: 600; line-height: 1.3; }
	.banner-about .text-box-2 .col:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.banner-about .text-box-2 .col:last-child:nth-child(odd) .col-inner { padding: 12px 16px; }
	.banner-about .text-box-2 .col:last-child:nth-child(odd) .icon-box { flex-direction: row; gap: 10px; }
    .banner-about p{
        font-size: 16px;
    }
    .about-breadcrumb .col {
        padding-bottom: unset !important;
    }
    .about-breadcrumb {
        padding-left: 15px !important;
    }
    .banner-about .text-box-2 .col-2 .icon-box{
        border-right: unset;
    }
    .section3-about .box-vertical .box-image{
        width: 36% !important;;
    }
    .section3-about .col-left .box:before{
        bottom: 82%;
        left: 90%;
        transform: translate(-90%, -82%);
    }
    .section4-about .row-content .col{
        flex-basis: 100%;
        max-width: 100%;
    }
    .section4-about .row-content .col .col-inner{
        height: 230px;
    }
    .section7-about .stat-col > .col-inner {
        min-height: 100px;
    }
    .section7-about .stat-col .sc-number {
        font-size: 34px;
    }
    .section7-about .row .col{
        flex-basis: 50%;
        max-width: 50%;
    }
    .section8-about {
        padding-top: 120px !important;
        padding-bottom: 60px !important;
    }
    .section8-about .col-left{
        padding-bottom: 10px;
    }
    .section8-about .col-left .img{
        margin-right: auto;
    }
    .section8-about .col-right .img{
        margin-left: auto;
        margin-right: auto;
    }
}