/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 2.0.2
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/* Khai báo Custom Fonts từ thư mục local */
@font-face {
    font-family: 'Inter';
    src: url('fonts/Inter.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: 'Inter', sans-serif;
}

.container, .container-width, .full-width .ubermenu-nav, .row {
	max-width: 1230px !important;
}

/* Custom CSS VTI Commerce */
#banner-about-us {
	position: relative;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}

#banner-about-us .container {
	padding-top: 10%;
	padding-bottom: 10%;
	height: 100%;
}

.title-banner {
	color: white;
	font-size: 32px;
}

.sub-title-banner {
	color: white;
	font-size: 20px;
}

.menu-wrapper {
	padding: 2% 0;
	display: flex;
	justify-content: space-between;
	list-style-type: none;
	margin-bottom: 0;
}

.menu-wrapper li a {
	color: #1f2124;
	font-size: 20px;
	font-weight: 600;
}

.navbar-toggler-icon {
	background-image: url('./assets/img/list.svg');
}

.about-vti-commerce .row {
	padding: 40px 0;
}

.about-vti-commerce ul {
	padding-left: 2rem;
}

.about-vti-commerce ul li {
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	color: #272E4E;
	font-weight: 400;
}

.about-vti-commerce-title {
	font-weight: 600;
	font-size: 32px;
	line-height: 46px;
	letter-spacing: -0.79px;
	color: #272E4E;
	margin-bottom: 24px;
}

.more-info {
	font-size: 16px;
	line-height: 22px;
	letter-spacing: -0.09px;
	font-weight: 700;
	color: #177DDC;
	margin-right: 8px;
}

.text-side {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.vti-sight .container {
	padding-top: 40px;
	padding-bottom: 40px;
}

.vti-sight .container .row {
	--bs-gutter-y: 24px;
}

.sight-item {
	padding: 24px;
	max-width: 570px;
	margin-inline: 15px;
	border-radius: 8px;
}

.sight-item h2 {
	font-size: 24px;
	line-height: 32px;
	letter-spacing: -0.47px;
	color: #272E4E;
	margin-bottom: 4px;
	margin-top: 24px;
	font-weight: 600;
}

.sign-item p {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: -0.09px;
	color: #666666;
	margin-bottom: 0;
}

.business-model-title {
	font-weight: 600;
	font-size: 32px;
	line-height: 46px;
	letter-spacing: -0.79px;
	color: #272E4E;
	margin-bottom: 60px;
}

.business-model-info {
	font-size: 16px;
	line-height: 22px;
	letter-spacing: -0.09px;
	font-weight: 700;
	color: #177DDC;
	margin-right: 8px;
}

.vti-network .container {
	padding-top: 40px;
	padding-bottom: 40px;
}

.network {
	gap: 6px;
}

.single-flag {
	background: #F7FAFD;
	border-radius: 12px;
	padding: 24px;
	display: flex;
	gap: 16px;
	align-items: center;
}

.flag-name {
	font-size: 20px;
	line-height: 28px;
	letter-spacing: -0.33px;
	font-weight: 600;
	color: #272E4E;
}

.CTA .section-bg {
	opacity: 5%;
}

.CTA .container {
	padding-top: 5%;
}

.green-contact {
	padding: 12px 24px;
	background-image: linear-gradient(90deg, #0FA44A 0%, #21E2B4 100%);
	border-radius: 16px;
	width: fit-content;
}

.yellow-contact {
	padding: 12px 24px;
	background-color: #EEA400;
	border-radius: 16px;
	width: fit-content;
}

.title-lead {
	max-width: 184px;
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	font-weight: 600;
	color: #272E4E;
	text-align: center;
	color: #FFFFFF;
}

.page-sub-heading {
	font-size: 20px;
	line-height: 28px;
	letter-spacing: -0.33px;
	font-weight: 600;
	color: #272E4E;
	text-align: center;
}

.page-heading {
	font-size: 32px;
	line-height: 46px;
	letter-spacing: -0.79px;
	font-weight: 600;
	color: #272E4E;
	text-align: center;
}

.solutions {
	padding: 24px;
	background:
		linear-gradient(90deg, #0873D6 0%, #0835D6 100%),
		url('./images/star-theme.png');
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 16px;
	margin-inline: 14px;
	position: relative;
}

.customer-require {
	margin-inline: 14px;
}

.solutions ul {
	list-style-type: none;
}

.solutions ul li {
	color: #FFFFFF;
	font-size: 20px;
	line-height: 28px;
	letter-spacing: -0.33px;
	font-weight: 600;
	display: flex;
	align-items: center;
	margin-bottom: 30px;
}

.solutions ul li::before {
	content: url('./images/tick-circle.png');
	margin-right: 12px;
	width: 32px;
	height: 32px;
	object-fit: contain;
}

.customer {
	padding: 24px;
}

.section-capacity .container {
	padding-top: 40px;
	padding-bottom: 40px;
}

.section-lead .container {
	padding-top: 40px;
	padding-bottom: 40px;
}


.grid-workplace {
	grid-template-columns: repeat(3, 1fr);
	gap: 30px 30px;
}

.grid-workplace>.work-eco-item:first-of-type {
	grid-row: span 2;
	padding: 24px;
}

.work-eco-item>.img-workplace {
	max-height: 152px;
}

.work-eco-item:first-of-type>.img-workplace {
	flex-grow: 1;
	max-height: none;
}

.work-eco-item {
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	padding: 16px;
}

.work-eco-item p.eco-title {
	font-weight: 600;
	font-size: 24px;
	line-height: 32px;
	letter-spacing: -0.47px;
	color: #272E4E;
	margin-bottom: 8px;
}

.work-eco-item.has-img p.eco-title {
	margin-top: 16px;
}

.work-eco-item p {
	padding: 0;
	margin: 0;
}

.work-eco-item ul,
.work-eco-item.has-img ul {
	margin-bottom: 0;
}

.work-eco-item.has-img ul {
	margin-left: 24px;
}

.work-eco-item ul li {
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	color: #272E4E;
	font-weight: 400;
	margin-bottom: 4px;
}


.office-ecosystem {
	margin-top: 40px;
}

.office-ecosystem .col {
	margin-top: auto;
	margin-bottom: auto;
}

.office-ecosystem .col-inner {
	display: flex;
	flex-direction: column;
	gap: 30px 30px;
}

@media screen and (max-width: 992px) {
	.grid-workplace {
		grid-template-columns: repeat(2, 1fr);
	}
	.custom-single-product .btn-contact a {
		padding: 13px 26px;
	}
}

@media screen and (max-width: 768px) {
	.grid-workplace {
		grid-template-columns: repeat(1, 1fr);
	}
}





.background-item-overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	height: 100%;
	padding: 0;
	margin: 0;
	opacity: 12%;
	pointer-events: none;
}

.main-item {
	border-radius: 16px;
	padding: 48px 64px;
}

.header-carousel-item {
	margin-top: 32px;
	color: white;
	font-size: 20px;
}

.content-carousel-item {
	margin: 0;
	padding-top: 16px;
	border-top: 1px dashed #DAE2EE;
	color: white;
	font-size: 18px;
}

.sub-image {
	position: absolute;
	max-width: 160px;
	max-height: 160px;
	right: -96px;
	bottom: -64px;
	border-radius: 16px;
	border: 4px solid white;
	overflow: hidden;
}

.side-text-carousel-section {
	margin-top: auto;
	margin-bottom: auto;
}

.custom-dots {
	margin: 0;
	padding: 0;
}

.custom-dots span {
	background: #177DDC;
	opacity: 30%;
	width: 10px;
	height: 10px;
	margin: 5px 7px;
	display: block;
	-webkit-backface-visibility: visible;
	transition: opacity .2s ease;
	border-radius: 30px;
}

.custom-dots.active span {
	opacity: 1;
	width: 40px;
}

/* feature slider */

.feature-slider__container {
	width: 100%;
	height: 424px;
}
.feature-slider-item {
	width: calc(100% - 80px);
	height: 385px;
	position: relative;
}
.feature-slider__content {
	display: flex;
	flex-direction: column;
	padding: 48px 64px 48px;
	background: linear-gradient(90deg, #0873D6 0%, #0835D6 100%);
	border-radius: 16px;
	width: calc(100% - 20px);
	height: 100%;
}
.feature-slider__content .feature-slider__content-image{
	margin-bottom: 32px;
	max-width: 64px;
	max-height: 56px;
	object-fit: cover;
}
.feature-slider__content h9 {
	margin-bottom: 16px;
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 28px;
	letter-spacing: -0.33px;
	color: #FFFFFF;
	margin: 0;
	margin-bottom: 16px;
}
.feature-slider__title {
	display: -webkit-box;              
	-webkit-box-orient: vertical;      
	-webkit-line-clamp: 2;             
	line-clamp: 2;
	overflow: hidden;                  
	text-overflow: ellipsis;
}
.feature-slider__content-description {
	padding-top: 18px;
	border-top: 1px dashed #DAE2EE;
	font-family: 'Inter', sans-serif;
	font-weight: 400;
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	color: #FFFFFF;
	margin: 0;
	display: -webkit-box;              
	-webkit-box-orient: vertical;      
	-webkit-line-clamp: 4;             
	line-clamp: 4;
	overflow: hidden;                  
	text-overflow: ellipsis;
}
.feature-slider__float-image {
	position: absolute;
	right: -80px;
	bottom: 0;       
	transform: translateY(50%); 
	width: 160px;
	height: 160px;
	object-fit: cover;
}

.feature-slider__container .owl-stage-outer {
	width: 100%;
	height: 100%;
}

.feature-slider__container .owl-dots {
    position: absolute;
    left: 50%;
    transform: translateX(-100%);
    bottom: -10px;
    display: flex;
    gap: 8px;
    justify-content: center;
}

.feature-slider__container .owl-dots button {
	margin: 0;
}

.feature-slider__container .owl-dot span {
    height: 8px;
	width: 8px;                  
    background: #B4D4F4;          
    display: block;
    border-radius: 4px;           
    transition: background .3s;
}

.feature-slider__container .owl-dot.active span {
    background: #177DDC !important;        
    width: 64px;                  

}

.feature-slider__container .owl-dot {
    width: auto;     
}

/* Multiline Logo Gallery */

.multiline-logo-gallery .owl-nav button {
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.multiline-logo-gallery .owl-nav button .owl-icon {
	fill: #177DDC;
	width: 16px;
	height: 16px;
}

.multiline-logo-gallery .owl-nav button:hover .owl-icon {
    fill: #FFFFFF;
	width: 16px;
	height: 16px;
}

.multiline-logo-gallery {
	position: relative;
}

.multiline-logo-gallery .owl-nav {
	position: absolute;
	top: 44%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	z-index: 10;
}

.multiline-logo-gallery .owl-nav button.owl-prev,
.multiline-logo-gallery .owl-nav button.owl-next
{
	position: absolute;
	color: white;
	border: 1px solid #DAE2EE;
	border-radius: 8px;
	padding: 12px !important;
	transition: all 0.3s ease;
	width: 40px;
	height: 40px;
}

.multiline-logo-gallery .owl-nav button:hover.owl-prev,
.multiline-logo-gallery .owl-nav button:hover.owl-next
{
	background: #0050AE;
	border: 1px solid #0050AE;
}

.multiline-logo-gallery .owl-nav .owl-prev {
	left: -40px;
}

.multiline-logo-gallery .owl-nav .owl-next {
	right: -40px;
}

/* Responsive - ẩn buttons trên mobile */
@media (max-width: 768px) {
	.multiline-logo-gallery .owl-nav button {
		display: none;
	}
}

/*  */

.main-page-btn {
	padding: 8px 16px;
	border-radius: 8px;
	background: #0050AE;
	color: #FFFFFF;
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
}

.reason-heading::before {
	content: url('./images/lucide_check-circle.png');
	margin-right: 10px;
	position: relative;
    bottom: -10px;
	display: inline-block;
}

.home-button {
	padding: 8px 16px;
	border-radius: 8px;
	background: linear-gradient(90deg, #0FA44A 0%, #21E2B4 100%);
	color: #FFFFFF;
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
}

.home-button:hover {
	color: #FFFFFF;
}

.home-button::before {
	content: url('./images/arrow-right-home.svg');
	margin-right: 10px;
	display: inline-block;
	position: relative;
	bottom: -2px;
}

/* Menu Commerce */

.commerce-header {
    background-image: url('./images/header-bg.png');
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
    position: relative;
}

.commerce-header__top {
	background: #08011F4F;
}

/* Commerce Header Inner */
.commerce-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 80px;
	padding: 8px 0;
}

/* Logo */
.commerce-header__logo {
	flex-shrink: 0;
}

.commerce-header__logo img {
	width: 171px;
	height: 64px;
	display: block;
}

/* Desktop Menu */
.menu-commerce {
	list-style: none;
	display: flex;
	gap: 20px;
	margin-bottom: 0;
	justify-content: center;
}

.menu-commerce li a {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: -0.09px;
	font-weight: 400;
	color: #FFFFFF;
}

.menu-commerce li a:hover {
	font-weight: 800;
}

.menu-commerce li {
	margin-bottom: 0;
	padding: 10px 16px;
}

.menu-commerce li:hover {
	background: #FFFFFF1A;
	border-radius: 8px;
}

.menu-commerce .current-menu-item {
	background: #FFFFFF1A;
	border-radius: 8px;
}

.menu-commerce .current-menu-item a {
	color: #FFFFFF;
	font-weight: 800;
}

/* Contact Button */
.header-contact-btn {
	padding: 8px 16px;
	border-radius: 8px;
	background: #177DDC;
	color: #FFFFFF;
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
	white-space: nowrap;
}

.header-contact-btn:before {
	content: url('./images/call.svg');
	margin-right: 10px;
	display: inline-block;
	position: relative;
	bottom: -4px;
}

/* Mobile Icon Button */
.commerce-header .icon-button {
	color: #FFFFFF;
	font-size: 24px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px;
}

.commerce-header .icon-button svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

/* Commerce Mobile Menu Off-Canvas */
#commerce-menu {
	background: #FFFFFF;
	max-width: 300px;
	width: 100%;
}

#commerce-menu .sidebar-menu {
	height: 100%;
	overflow-y: auto;
}

#commerce-menu .sidebar-menu-inner {
	padding: 20px;
}

.commerce-mobile-menu-header {
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 1px solid #E5E5E5;
}

.commerce-mobile-menu-header h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: #272E4E;
}

/* Mobile Menu Navigation */
.menu-commerce-mobile {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menu-commerce-mobile li {
	margin-bottom: 0;
	border-bottom: 1px solid #F0F0F0;
}

.menu-commerce-mobile li a {
	display: block;
	padding: 12px 0;
	font-size: 15px;
	font-weight: 400;
	color: #272E4E;
	text-decoration: none;
}

.menu-commerce-mobile li a:hover {
	color: #177DDC;
	font-weight: 600;
}

.menu-commerce-mobile .current-menu-item a {
	color: #177DDC;
	font-weight: 600;
}

/* Mobile Menu Footer */
.commerce-mobile-menu-footer {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid #E5E5E5;
}

.commerce-mobile-menu-footer .header-contact-btn {
	display: block;
	text-align: center;
	width: 100%;
}

/* Mobile Responsive */
@media screen and (max-width: 1200px) {
	.commerce-header__inner {
		min-height: 60px;
		padding: 8px 0;
	}

	.commerce-header__logo {
		flex-grow: 1;
		text-align: center;
	}

	.commerce-header__logo img {
		width: 120px;
		height: auto;
		max-height: 44px;
	}

	/* Hide desktop elements on mobile */
	.commerce-header .hide-for-medium {
		display: none !important;
	}

	/* Show mobile elements */
	.commerce-header .show-for-medium {
		display: flex !important;
	}

	/* Mobile nav styling */
	.commerce-header .mobile-nav {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		align-items: center;
	}

	.commerce-header .flex-left {
		justify-content: flex-start;
	}

	.commerce-header .flex-right {
		justify-content: flex-end;
	}
}

.top-product__item {
	padding: 12px;
      border-radius: 12px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      box-shadow:
        0px 1px 2px 0px #1818180F,
        0px 1px 3px 0px #1818181A;
	background-color: #fff;
}

.top-product__item h3 {
	font-weight: 600;
	font-size: 14px;
	line-height: 20px;
	color: #272E4E;
	letter-spacing: -0.09px;
	margin-bottom: 0;
}

.top-product__item p {
	display: -webkit-box;              
	-webkit-box-orient: vertical;      
	-webkit-line-clamp: 2;             
	overflow: hidden;                  
	text-overflow: ellipsis;
	margin: 0;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: #666666;
	min-height: 40px;
}

.top-product__item .top-product__item-image {
	width: 100%;
	height: 180px;
	background-color: #F7FAFD;
}

.top-product__item img {
	height: 180px;
}

/*                                                                 Top 4 Newest News                                */
/* Container Grid */
.top-4-newest-news {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2 cột bằng nhau */
    grid-template-rows: repeat(3, 1fr); /* 3 hàng */
    gap: 24px;
}

/* Post đầu tiên - Chiếm cột trái, full 3 hàng */
.news-item--featured {
    grid-column: 1 / 2;
    grid-row: 1 / 4;
    display: flex;
    flex-direction: column;
}

/* 3 post còn lại - Chiếm cột phải, mỗi post 1 hàng */
.news-item--small {
    grid-column: 2 / 3;
    display: flex;
    gap: 16px;
}

/* Ảnh của post lớn */
.news-item--featured .news-item__image {
    width: 100%;
    height: 369px;
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 16px;
}

.news-item--featured .news-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Ảnh của post nhỏ */
.news-item--small .news-item__image {
    width: 170px;
    min-width: 170px;
    height: 151px;
    overflow: hidden;
    border-radius: 8px;
}

.news-item--small .news-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Nội dung */
.news-item__content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.news-item__date {
    font-size: 14px;
    color: rgba(39, 46, 78, 0.6);
    margin-bottom: 8px;
    display: block;
}

.news-item__title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 8px;
}

.news-item--featured .news-item__title {
    font-size: 24px;
    line-height: 1.3;
}

.news-item__title a {
    color: #272E4E;
    text-decoration: none;
}

.news-item__title a:hover {
    color: #0050AE;
}

.news-item__excerpt {
    font-size: 16px;
    line-height: 1.5;
    color: rgba(39, 46, 78, 0.8);
    
    /* Giới hạn 2 dòng cho post lớn */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-item--small .news-item__excerpt {
    -webkit-line-clamp: 3; /* Post nhỏ chỉ 3 dòng */
    font-size: 14px;
}

.form-contact .wpcf7-submit.contract-form__btn {
	padding: 8px 16px;
	border-radius: 8px;
	background: #177DDC;
	color: #FFFFFF;
	font-weight: 600;
	font-size: 15px;
	line-height: 24px;
	letter-spacing: -0.13px;
}

.form-contact .wpcf7-submit.contract-form__btn:before {
	content: url('./images/send-2.png');
	margin-right: 10px;
	display: inline-block;
	position: relative;
	bottom: -4px;
}

.vti-network-title {
	font-size: 32px;
	line-height: 46px;
	letter-spacing: -0.79px;
	font-weight: 600;
	color: #272E4E;
	text-align: center;
	margin-bottom: 30px;
}

/* Responsive Mobile */
@media (max-width: 768px) {
    .top-4-newest-news {
        grid-template-columns: 1fr; /* 1 cột */
        grid-template-rows: auto;
    }
    
    .news-item--featured,
    .news-item--small {
        grid-column: 1;
        grid-row: auto;
    }
    
    .news-item--featured .news-item__image {
        height: 240px;
    }
}

/* CSS for footer */
.footer-title {
	font-family: 'Inter', sans-serif;
	font-size: 20px;
	font-weight: 600;
	color: #DAE2EE;
	line-height: 28px;
	letter-spacing: -0.33px;
	margin-bottom: 0;
	text-transform: uppercase;
}

.footer-text,
.footer-text p,
.footer-text li {
	font-family: 'Inter', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: -0.09px;
	color: #FFFFFF;
	margin-bottom: 0;
}

.footer-text li {
	margin-top: 16px;
}

.footer-text p {
	margin-bottom: 0;
	color: #99CEFB;
	margin-bottom: 0;
}

.footer-text p.social-icons-title {
	color: #FFFFFF;
}

.footer-icon h2 {
	color: #FFFFFF;
	font-family: 'Inter', sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
	letter-spacing: -0.33px;
	margin-bottom: 0;
}

.post-excerpt {
	display: -webkit-box;              
	-webkit-box-orient: vertical;      
	-webkit-line-clamp: 2;             
	overflow: hidden;                  
	text-overflow: ellipsis;
	font-weight: 400;
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	color: #666666;
}

.header-language-icon {
	border-radius: 100%; 
	object-fit: cover;
	width: 24px;
	height: 24px;
}

.has-dropdown.header-language-dropdown {
	background: #FFFFFF1A;
	padding: 5px 12px;
	border-radius: 8px;
}

.nav-dropdown-has-arrow li.current-dropdown.has-dropdown:after {
	content: none;
}

.has-dropdown.header-language-dropdown .nav-dropdown {
    max-height: inherit;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.1),
        rgba(255, 255, 255, 0.05)
    );
    border: none;
    
    backdrop-filter: blur(12px) brightness(1.1);
    -webkit-backdrop-filter: blur(12px) brightness(1.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px; 
    box-shadow: 
        0 8px 32px 0 rgba(0, 0, 0, 0.2),
        inset 0 1px 0 0 rgba(255, 255, 255, 0.2);
	color: #fff;
	padding: 5px 12px;
	min-width: 80px;
}

.has-dropdown.header-language-dropdown .nav-dropdown li {
	min-width: 80px;
}

.has-dropdown.header-language-dropdown .nav-dropdown {
    left: 0;
    right: auto;
    transform: translateY(5%);
}

/* Pagination Styles */
.section-padding {
	padding: 80px 0;
}

.page-numbers {
	list-style: none;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	padding: 20px 0;
	margin: 0;
}

.page-numbers li {
	margin: 0;
}

.page-numbers a,
.page-numbers span,
.page-numbers.nav-pagination.links span,
.page-numbers.nav-pagination.links a {
	display: inline-block;
	padding: 6px;
	width: 40px;
	height: 40px;
	text-align: center;
	border: 1px solid #ddd;
	border-radius: 4px;
	text-decoration: none;
	color: #333;
	transition: all 0.3s ease;
	background-color: transparent;
}

.page-numbers a:hover {
	color: #177DDC;
	border-color: #177DDC;
}

.page-numbers .current,
.page-numbers span.current,
.page-numbers.nav-pagination.links .current,
.page-numbers.nav-pagination.links span.current {
	color: #177DDC;
	border-color: #177DDC;
	font-weight: bold;
}

.page-numbers .prev,
.page-numbers .next {
	font-weight: bold;
}

.social-icons-container {
	display: flex;
	gap: 16px;
	justify-content: flex-end;
	align-items: center;
}

@media (max-width: 767px) {
    .social-icons-container {
        justify-content: center;
    }
}

.social-icons-wrapper {
	display: flex;
	gap: 8px;
	margin: 0 !important;
}

.info-footer {
	height: 40px;
}

/* Banner Section */
.banner-section {
    position: relative;
    width: 100%;
    height: 300px;
    overflow: hidden;
    margin-bottom: 0;
}

.banner-section img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.banner-content {
    position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	padding: 80px 375px;
	display: flex;
	flex-direction: column;
	gap: 30px;
	justify-content: center;
    z-index: 2;
}

.banner-content h2 {
	font-weight: 800;
	font-size: 32px;
	line-height: 40px;
	letter-spacing: -0.79px;
	color: #FFFFFF;
	margin-bottom: 0;
}

.banner-content p {
    font-size: 20px;
    font-weight: 600;
	line-height: 28px;
	letter-spacing: -0.33px;
	color: #FFFFFF;
	margin-bottom: 0;
}

.vti-cta {
	background-color: #0050AE;
}

.wpcf7-form{
	margin-bottom:0;
}
.wpcf7-form .wpcf7-spinner{
	display:none;
}
.form-contact label {
	font-weight: 500;
	font-size: 15px;
	line-height: 24px;
	letter-spacing: -0.13px;
	color: #272e4e;
	margin-bottom: 8px;
	margin-left:1px;
}
.form-contact .wpcf7-form-control-wrap .wpcf7-form-control{
    height: 43px;
	color:rgba(39, 46, 78, 0.6);
    border: 1px solid #dae2ee;
    border-radius: 6px;
    box-shadow: none;
    padding: 10px 14px;
	font-weight: 500;
	font-size: 15px;
	line-height: 24px;
	letter-spacing: -0.13px;
}
.form-contact .wpcf7-form-control-wrap .wpcf7-form-control option{
	background: rgba(255,255,255,0.11);
	font-size: 15px;
	line-height: 24px;
	letter-spacing: -0.13px;
	font-weight: 500;
	text-align: left;
}
.wpcf7-form .processing .nice-select ul {
	display: none;
}
.form-contact .wpcf7-form-control-wrap input::placeholder {
	font-weight: 500;
	font-size: 15px;
	line-height: 24px;
	letter-spacing: -0.13px;
	color: rgba(39, 46, 78, 0.6);
}
.form-contact .wpcf7-form-control-wrap .wpcf7-textarea {
	min-height: 150px;
}
.form-contact .wpcf7-submit {
	background: linear-gradient(90deg, #0050ae 0%, #0391e8 100%);
	border-radius: 24px !important;
	width: 100%;
	font-weight: 700;
	font-size: 16px;
	height: 48px;
	text-transform: none !important;
	margin-top: 10px;
}
.form-contact .custom-select{
	width: 100%;
}
.form-contact .custom-select .select2-choice{
	border: none;
	box-shadow: none;
	padding: 0;
	background-size: auto 12px;
}
.form-contact .custom-select .select2-chosen{
	color: rgba(39, 46, 78, 0.6);
	line-height: 40px;
}
.form-contact .custom-select .select2-arrow{
	display: none;
}
.form-contact .wpcf7-form-control-wrap .wpcf7-form-control.custom-select{
	padding-right: 3px;
	overflow: hidden;
}
span.required {
	color: #F1485B;	;
	border: none;
}

/* Hide absolute footer */
.absolute-footer {
    display: none !important;
}

/* Hide divider */
.box-blog-post .is-divider,
.widget .is-divider{
	display: none;
}

.related-product-image {
	width: 270px;
	height: 270px;
	object-fit: cover;
	object-position: center;
	display: block;
}

.box-text-inner h5.post-title,
.box-text-inner h5.post-title a {
	margin-top: 8px;
	margin-bottom: 8px;
	font-weight: 600;
	font-size: 20px;
	line-height: 28px;
	min-height: 56px;
	letter-spacing: -0.33px;
	color: #272E4E;
	display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis; 
	line-clamp: 2;
}

.box-text-inner h5.post-title a {
	margin-bottom: 0;
	margin-top: 0;
}

table {
	width: 100%;
	border: 1px solid #DFDFDF;
	border-radius: 12px;
	border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}


table tr:nth-child(even) {
	background-color: #F7FAFD;
}

table tr td {
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	font-weight: 500;
	color: #272E4E;
	padding-top: 16px;
	padding-bottom: 16px;
	border-bottom: none;
}

table tr td:first-child {
	font-size: 18px;
	line-height: 28px;
	letter-spacing: -0.26px;
	font-weight: 700;
	color: #212529;
	padding-left: 24px;
	padding-top: 16px;
	padding-bottom: 16px;
}

table tr td:last-child {
	padding-right: 24px;
}

/* Hide breadcrumb */
nav.woocommerce-breadcrumb.breadcrumbs.uppercase {
    display: none;
}

.col-sm-7 .solutions.h-100::before {
	content: url('./images/idea-line.svg');
	position: absolute;
	top: 50%;
    transform: translateY(-50%);
    left: -30px;
    z-index: 1;
}

@media (max-width: 575px) {
	.col-sm-7 .solutions.h-100::before {
	  display: none;
	}
}

.widget-title.shop-sidebar {
	font-size: 20px;
	line-height: 28px;
	letter-spacing: -0.33px;
	color: #272E4E;
	text-transform: none;
}

.woocommerce-breadcrumb a:last-child {
	font-weight: 600;
	color: #272E4E;
}

div.woocommerce-breadcrumb {
	font-size: 12px;
	line-height: 16px;
	letter-spacing: 0.01px;
	font-weight: 400;
}

.feature-posts {
	display: grid;
	grid-template-columns: 1fr 0.7fr;
	gap: 30px;
}

.feature-posts .feature-post:first-child {
	grid-row: 1 / 3;
	display: flex;
	flex-direction: column;
}

.feature-post:first-child .image-cover {
	flex: 1;
}

.feature-posts .feature-post {
	background-color: #F7FAFD;
	border-radius: 12px;
	padding: 24px;
}

.feature-post:not(:first-child) img {
    width: 100%;
    height: 152px;																		
    object-fit: cover;
    object-position: center center;
    border-radius: 10px;									
}

.feature-post:first-child img {
	width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    border-style: none;
    border-radius: 10px;
	max-height: 572px;
}

.feature-posts .box-image {
	border-radius: 12px;
	overflow: hidden;
	max-height: 152px;
}

.feature-post:first-child .box-image {
	max-height: 100%;
}

.feature-post .box-text.text-left {
	padding-bottom: 0;
}

.post-meta-date {
	font-size: 14px;
	line-height: 20px;
	letter-spacing: -0.09px;
	font-weight: 400;
	color: #666666;
}

/* CF7 Thank You Popup */
.cf7-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 99998;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.cf7-popup-overlay.active {
    opacity: 1;
    visibility: visible;
}

.cf7-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    background: url('./images/header-bg.png');
    border-radius: 24px;
    padding: 60px 50px;
    z-index: 99999;
    text-align: center;
    max-width: 1000px;
    width: 90%;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    overflow: hidden;
}

.cf7-popup.active {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}

/* Nút đóng X */
.cf7-popup-close-x {
    position: absolute;
    top: 0px;
    right: 0px;
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.7);
    font-size: 32px;
    font-weight: 300;
    cursor: pointer;
    transition: all 0.3s ease;
    line-height: 1;
    padding: 5px;
    z-index: 10;
}

.cf7-popup-close-x:hover {
    color: #fff;
    transform: scale(1.1);
}

.cf7-popup-content {
    position: relative;
    z-index: 5;
}

.cf7-popup-message {
    font-size: 22px;
    color: #fff;
    line-height: 1.6;
    margin: 0;
    font-weight: 400;
}

.wpcf7-response-output {
    display: none;
}

/* Responsive */
@media (max-width: 768px) {
    .cf7-popup {
        padding: 50px 30px;
        border-radius: 16px;
    }
    
    .cf7-popup-message {
        font-size: 20px;
    }
}

@media (max-width: 768px) {
	.feature-posts {
		grid-template-columns: 1fr;
	}
	.large-col-first.vertical-thumbnails {
		display: none;
	}
	.woocommerce-product-gallery__image.first.is-selected {
		width: 100% !important;
	}
}

@media (max-width: 1024px) {
	.banner-content {
		padding: 80px 15px;
	}
}

@media (max-width: 1230px) {
	.col-12.section-padding h2 {
		margin-left: 15px;
	}
	.col-12.section-padding .row {
		padding-left: 15px;
		padding-right: 15px;
	}
} 

@media (max-width: 991px) and (min-width: 768px) {
    .image-center-md {
        text-align: center;
    }
}

.cta-image-padding {
    padding-top: 120px;
}

@media (max-width: 767px) {
    .cta-image-padding {
        padding-top: 0;
    }
}

.box-image .image-fade_in_back img {
	object-fit: contain;
}

.woocommerce-product-gallery__image.is-selected,
.woocommerce-product-gallery__image.slide {
	width: 400px !important;
	height: 384px;
}

.product-gallery-slider img {
	object-fit: contain;
	width: 100%;
	height: 100%;
}

.flickity-enabled.is-draggable .flickity-viewport {
	max-height: 384px;
}
