/*
Theme Name:           Flatsome
Theme URI:            http://flatsome.uxthemes.com
Author:               UX-Themes
Author URI:           https://uxthemes.com
Description:          Multi-Purpose Responsive WooCommerce Theme
Version:              3.20.5
Requires at least:    6.4
Requires PHP:         7.4
WC requires at least: 8.3
Text Domain:          flatsome
License:              https://themeforest.net/licenses
License URI:          https://themeforest.net/licenses
*/


/***************
All custom CSS should be added to Flatsome > Advanced > Custom CSS,
or in the style.css of a Child Theme.
***************/
/* Khung chứa cực kỳ quan trọng để định vị absolute */
/* Container bao phủ toàn bộ chiều ngang màn hình */
/* ─── CSS Variables ────────────────────────────────── */
:root {
    --font-accent-art: 'UVN SangSong', 'Cormorant Garamond', serif;
    --font-heading-lux: 'SVN-Famous', 'Playfair Display', serif;
    --color-primary: #C8956A;
    --color-primary-light: #E8C5A8;
    --color-primary-dark: #A0714A;
    --color-secondary: #7F6337;
    --color-top-bar: #b39359;
    --color-secondary-light: #5A9696;
    --color-secondary-dark: #2A4C4C;
    --color-accent: #F5EDE4;

    --color-white: #FFFFFF;
    --color-off-white: #FAFAF8;
    --color-light: #F5F3EF;
    --color-gray-100: #F0EDE8;
    --color-gray-200: #E2DDD6;
    --color-gray-300: #C8C0B4;
    --color-gray-400: #A89E92;
    --color-gray-500: #887C70;
    --color-dark: #2C2420;
    --color-black: #1A1210;

    --color-text: #3A3228;
    --color-text-light: #6B5E52;
    --color-text-muted: #9A8E82;
    --color-text-inverse: #FFFFFF;

    --font-heading: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
    --font-body: 'Geomanist';
    --font-accent: 'Lato', sans-serif;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-md: 1.125rem;
    --font-size-lg: 1.25rem;
    --font-size-xl: 1.5rem;
    --font-size-2xl: 2rem;
    --font-size-3xl: 2.5rem;
    --font-size-4xl: 3rem;
    --font-size-5xl: 3.75rem;

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    --line-height-tight: 1.2;
    --line-height-snug: 1.4;
    --line-height-base: 1.6;
    --line-height-relaxed: 1.8;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;

    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1200px;
    --container-2xl: 1440px;

    --section-pad-y: var(--space-24);
    --section-pad-x: var(--space-6);

    --border-color: var(--color-gray-200);
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    --shadow-sm: 0 1px 3px rgba(44, 36, 32, 0.08);
    --shadow-md: 0 4px 16px rgba(44, 36, 32, 0.10);
    --shadow-lg: 0 8px 32px rgba(44, 36, 32, 0.14);
    --shadow-xl: 0 16px 48px rgba(44, 36, 32, 0.18);

    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 400ms ease;
    --transition-slower: 600ms ease;

    --z-dropdown: 100;
    --z-sticky: 200;
    --z-overlay: 300;
}

/****** Spinner *******/
.wpcf7-spinner {
	display: none;
}
/*******************/
h2.v-brand-title > p {
    margin-bottom: 21.3px;
}
.secdmlips--titlecn p {
    margin-bottom: -13px;
}
.bg-lips--sh {
	margin-bottom: -87px;
}
@media screen and (min-width:1024px) {
	.sec-2-diamon-flips-nn {
		margin-bottom: -70px;
	}
	.sec-4-diamond-lips-row-2 > span:first-child {
    transform: translateX(20px);
	}
	.sec-5-diamond-lips-number-big {
    transform: translateX(29px);
	}
	.sec-5-diamond-lips-text-small {
    margin-right: -33px !important;
	}
	.sec-5-diamon-flips-slider {
    margin-bottom: -95px;
	}
	.sec-6-diamond-lips-group-vertical {
    position: relative;
    right: -15px;
	}
	.seclips--process {
		margin-bottom: -80px;
	}
	.sec-8-diamond-lips-script-big {
    transform: translateX(-20px);
	}
	.sec-2-khumoi-nn .bottom-question {
		line-height: 1.2;
	}
}
@media screen and (max-width:768px) {
	h2.v-brand-title > p:last-child {
    transform: translateY(-38px);
}
	.sec-2-diamon-flips-nn .diamond-lips-subtitle {
		font-size: 40px !important;
        margin-top: 9px;
	}
	.sec-2-diamon-flips-nn {
		margin-bottom: -55px;
	}
	.seclips-tt--scroll {
		margin-top: -34px;
	}
	.sec-4-1-diamond-lips-content-wrapper {
		margin-top: 0px !important;
	}
	.sec-3-khumoi-mn-box-info {
    padding: 21px 15px 36px 15px; /* Padding dưới cao để trừ chỗ cho nút */
	}
	.sec-8-khumoi-new-mm-container {
	margin-bottom: 46px;
	}
	.sec-2-phun-xam-tab-v-titles {
    margin-bottom: 8px;
	}
}
/**********Hiệu ứng chặn nút submit form nhiều lần*******************/
.wpcf7-submit.la-submit-disabled,
.wpcf7-submit:disabled {
    opacity: 0.65 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}
/*****************************/
.nav-dropdown-has-shadow .nav-dropdown {
	border-radius:30px;
	background-color: rgba(69, 17, 128, 0.9)!important; /* 0.6 là 60% opacity */
	color:#fff!important;
}	
.off-canvas-left.dark .mfp-content, .off-canvas-right.dark .mfp-content {
   background-color: rgba(69, 17, 128, 0.9)!important;
}
.nav-dropdown-has-arrow.nav-dropdown-has-border li.has-dropdown:before,.nav-dropdown-has-arrow li.has-dropdown:after {
	opacity:0!important;
}
.off-canvas .nav-vertical>li>a {
    font-family: 'Geomanist', sans-serif!important;
    font-size: 22px!important!important;
	font-weight:400;
	color:#fff!important;
}
.secondary {
      background-color: rgba(69, 17, 128, 0.9)!important;
}
.primary {
   background-color: rgba(69, 17, 128, 0.9)!important;
}
.nav-vertical>li>ul li a {
	color:#fff!important;
}
.nav-dropdown-has-border .nav-dropdown {
	border:none!important;
}
.nav-dropdown.nav-dropdown-default>li>a {
	color: #fff!important;
	 font-family: 'Geomanist', sans-serif;
    font-size: 20px!important;
	font-weight:400;
	text-transform: inherit;


}
/* Loại bỏ style mặc định của li và a */
.sub-menu li {
    position: relative;
    list-style: none;
}

.sub-menu li a {
    display: inline-block;
    text-decoration: none;
    padding: 8px 0;
    position: relative;
    /* Đảm bảo chữ đầu tiên viết hoa nếu bạn chưa chỉnh ở nơi khác */
    text-transform: none; 
}

/* Tạo gạch chân ẩn bằng pseudo-element */
.sub-menu li a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0; /* Khởi tạo độ rộng bằng 0 */
    height: 2px; /* Độ dày của border */
    background: linear-gradient(90deg, #fff 0%, #fff 100%); /* Màu tím đồng bộ với brand */
    transition: width 0.4s ease-in-out; /* Hiệu ứng chạy mượt */
}

/* Hiệu ứng khi hover: thay đổi width từ 0 lên 100% */
.sub-menu li:hover a::after {
    width: 100%;
}
.nav-dropdown.nav-dropdown-default>li>a { 
	border-bottom:none!important;
}
/* Nếu bạn chỉ muốn viết hoa chữ cái đầu tiên của câu */
.sub-menu li a::first-letter {
    text-transform: uppercase;
}


.nav-dropdown {
	    min-width: 300px!important;
}
li.current-dropdown>.nav-dropdown { 
		left: -58px;
	}
/* Chèn nền cho toàn bộ Header */
#header {
    background-image: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/Group-227.png') !important;
    background-size: cover; /* Phủ kín header */
    background-position: center center; /* Căn giữa ảnh */
    background-repeat: no-repeat;
}
.header-bg-color {
    background-color:rgba(0, 0, 0, .0);!important;
	 background-image: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/Group-227.png') !important;
	background-size: cover; /* Phủ kín header */
    background-position: center center; /* Căn giữa ảnh */
    background-repeat: no-repeat;
}
.header-main .nav > li > a {
   color:#fff!important;
	font-family: 'Geomanist', sans-serif;
	font-weight:400!important;
}
/**** Trang cảm ơn ****/
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .tk_box .box-text {
        width: 50%;
        text-align: left;
        top: 53%;
        right: 0;
    }
}
@media screen and (max-width: 549px) {
	.sec-4-mobile-nn-container {
		    margin-bottom: -80px;
	}
	.sc10-mopbile-new-pttn-nn .v-brand-line-2 {
		margin-top: -30px;
    margin-bottom: -8px;
	}
	.sec-8-khumoi-new-mm-wrapper .sec-8-khumoi-new-mm-line-2 {
		    margin-top: -35px;
	}
	.sec-8-khumoi-new-mm-wrapper .sec-8-khumoi-new-mm-line-3 {
		       margin-top: -20px;
    margin-bottom: -10px;
	}
	
	.sec9-khu-moi-new-wrapper {
		margin-bottom: -120px;
	}
	.sec-4-mobile-diamon-lips-title-wrapper {
		    margin-top: -55px;
	}
	.sec-5-mobile-diamon-lips-title-inner {
		margin-bottom: -50px;
	}
	.sec-8-mobile-diamon-lips-title-wrapper {
		 margin-top: -36px;
	}
	.sec-4-mobile-text-script {
		margin-top: -20px;
	}
	.sec-2-diamon-flips-nn .diamond-lips-title {
		    margin-bottom: -10px;
    margin-top: -35px;
	}
	.sec-2-tc-pmtx-nn .sec-2-phun-xam-n-gradient {
        margin-top: 5px!important;
    }
	
	  .sec-2-tc-pmtx-nn .mb-sec2-title {
        margin-top: -50px!important;
    }
	.facilities {
    padding: 0px 0!important;
}
	.sec-banner-diamond-flips input:not([type="submit"]),
.sec-banner-diamond-flips select {
    width: 100% !important;
	height: 35px!important; 
	}
	.sec-banner-diamond-flips .form-content-overlay {
		position: absolute;
    top: 43%;
    left: 50%;
    transform: translateX(-50%);
    width: 78%;
	}
	.sec-banner-diamond-flips input[type="submit"] {
		top: 84%!important;
	}
    .banner-thank-you .tk_box .box-text {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 66%;
        right: 0;
    }
	 .banner-thank-you  .tk_box .box-text-inner p {
        font-size: 15px;
    }
}

.tk_box .box-text-inner p {
    font-size: 20px;
}
.tk_box .box-text {
    width: 37%;
    text-align: left;
    position: absolute;
    top: 58%;
    right: 8%;
    font-size: 29px;
    color: #fff;
}
.banner-thank-you .btn-all-new, .banner-thank-you .tk-btn    {
    background: linear-gradient(0deg, rgba(251, 173, 23, 1) 0%, rgba(255, 100, 0, 1) 100%);
    padding: 2px 50px;
    border-radius: 12px !important;
	font-size: 1.1rem;
}
.custom-btn {
    animation: lickme 0.7s infinite cubic-bezier(0.66, 0, 0, 1);
}
@keyframes lickme {
  0% {
    box-shadow: 0 0 1px #cfb06f;
}
	100% {
    box-shadow: 0 0 0 15px #cfb06f0f;
}
}
/**************************************/
.page-id-329 .diamon-lips-banner-lp {
    position: relative;
    width: 100vw; /* 100% chiều rộng view port */
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    overflow: hidden;
}

/* Ảnh trải dài hết khung hình */
.diamon-lips-banner-lp .banner-img {
    width: 100%;
    height: auto;
    display: block;
}

/* Nút bấm với CSS của bạn đã được chỉnh lại để không bị văng khỏi màn hình */
.diamon-lips-banner-lp .phun-xam-btn {
    position: absolute;
    top: 81%;
    left: 24%;
    width: 235px !important;
    border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
	    border-radius: 50px;
    font-weight: 400 !important;
    padding: 0px 15px 0px 15px;
    font-size: 20px !important;
    background: #710DAC !important;
    cursor: pointer;
    z-index: 10;
    transition: 0.3s;
}

.diamon-lips-banner-lp .phun-xam-btn:hover {
    background: #5a0a8a !important;
    transform: scale(1.05);
	
}


/**********************************************************************************/
.sec-2-phun-xam-n-wrapper {
    width: 100%;
    padding: 80px 20px 0px 20px;
    display: flex;
    justify-content: center;
  
}

.sec-2-phun-xam-n-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Gióng hàng từ bên trái để tạo so le */
    width: fit-content;
}

/* Hiệu ứng Gradient đặc trưng */
.sec-2-phun-xam-n-gradient {
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent
    display: inline-block;
    line-height: 1.1;
    /* Bảo vệ nét chữ nghệ thuật */
       padding: 11px 8px;

}

/* Định dạng các dòng */
.sec-2-phun-xam-n-row {
    display: flex;
    align-items: baseline; /* Giúp chữ Ivy và chữ UTM thẳng hàng chân */
    justify-content: center; /* Căn giữa nội dung trong hàng */
    gap: 5px; /* Khoảng cách giữa các cụm chữ */
    flex-wrap: wrap; /* Tránh bị tràn trên màn hình nhỏ */
    width: 100%;
}
.sec-2-phun-xam-n-row  .sec-2-phun-xam-n-utm-120.mb-sec2-title {
	padding-right: 25px;
} 
/* Ép dòng 2 khít lên dòng 1 một chút cho đẹp */
.sec-2-phun-xam-n-row:nth-child(2) {
    margin-top: -50px;
}

/* Font chữ chuẩn theo yêu cầu của Vũ */
.sec-2-phun-xam-n-ivy-55 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
}

.sec-2-phun-xam-n-ivy-45 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400;
}

.sec-2-phun-xam-n-utm-120 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    font-weight: normal;
}
.sec-3-pxtm-nnn {
	margin-bottom: -55px;
}
/* Responsive cho Mobile */
@media (max-width: 768px) {
	.sec-2-mobile-n-new-title-wrapper .phun-xam-utm-120.title-2 {
		    margin-top: -40px!important;
	}
	.sec-7-mobile-pxtm-nn .v-cta-section {
		    margin-bottom: -28px;
    margin-top: -30px;
	}
	.sec-3-pxtm-nnn .v-main-title {
    font-size: 39px!important;
   
}
	.sec-fb-google {
		    padding: 0px 0!important;
	}
	.sec-fb-google .fb-title-col {
		margin-bottom: -45px;
	}
	.sec-uu-dai-pttm {
		padding:0px!important;
	}
	.sec-uu-dai-pttm .v-title-head {
		font-size: 39px!important;
		line-height: 60px;
	}
	.sec-7-mobile-pxtm-nn .v-text-ivy {
		    line-height: 47px!important;
		    font-size: 35px!important;
	}
	.sec-7-mobile-pxtm-nn .v-text-edwardian {
		padding: 0 20px!important;
    margin-left: -13px!important;
		    font-size: 75px!important;
	}
    .sec-2-phun-xam-n-ivy-55 { font-size: 32px; }
    .sec-2-phun-xam-n-ivy-45 { font-size: 30px; }
    .sec-2-phun-xam-n-utm-120 { font-size: 90px; }
    .sec-2-phun-xam-n-row:nth-child(2) { margin-top: -10px; }
}
.sec-2-phun-xam-n-content-wrapper {
    width: 100%;
    padding: 20px 0;
    display: flex;
    justify-content: center;
}
/* Đảm bảo ảnh trong picture luôn chiếm 100% width */
.sec-2-phun-xam-n-img-box picture img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* CSS Tối ưu riêng cho thiết bị di động */
@media (max-width: 768px) {
    .sec-2-phun-xam-n-grid {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .sec-2-phun-xam-n-card {
        width: 100%;
    }

    /* Nếu Vũ muốn text hiển thị khác trên mobile có thể chỉnh ở đây */
    .sec-2-phun-xam-n-card-title {
        font-size: 22px;
        margin-bottom: 5px;
    }
}
.sec-2-phun-xam-n-text-block {
    max-width: 900px; /* Giới hạn độ rộng để text xuống hàng đẹp như ảnh */
    text-align: center; /* Căn giữa nội dung */
}

.sec-2-phun-xam-n-gradient {
    /* Cập nhật mã màu Gradient tươi hơn theo ảnh mới */
    background: linear-gradient(180deg, #db24ca 0%, #63189d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; /* Đã bổ sung dấu chấm phẩy bị thiếu */
    display: inline-block;
    line-height: 1.1;
    
    /* Giữ nguyên khoảng đệm bảo vệ nét chữ nghệ thuật của Vũ */
    padding: 11px 8px;
}

/* Tối ưu cho Mobile */
@media (max-width: 768px) {
	@media screen and (max-width: 549px) {
    .slider-wrapper .flickity-prev-next-button {
         display: block!important;
    }
}
	
	
    .sec-2-phun-xam-n-text-block {
        padding: 0 20px;
    }
    .sec-2-phun-xam-n-text-block p {
        font-size: 16px; /* Thu nhỏ một chút trên mobile để tránh tràn dòng */
        line-height: 1.5;
    }
}

/********/
.sec-2-phun-xam-n-grid-wrapper {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0px 15px;
}

.sec-2-phun-xam-n-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* PC hiện 4 cột */
    gap: 20px;
}

.sec-2-phun-xam-n-card {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.sec-2-phun-xam-n-card:hover {
    transform: translateY(-5px);
}

.sec-2-phun-xam-n-img-box {
    position: relative;
    width: 100%;
}

.sec-2-phun-xam-n-img-box img {
    width: 100%;
    height: auto;
    display: block;
}

/* Tận dụng class gradient Vũ vừa chỉnh sửa */
.sec-2-phun-xam-n-gradient {
    background: linear-gradient(180deg, #db24ca 0%, #63189d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.2;
    padding: 5px 0; /* Thu hẹp padding để vừa card */
}

.sec-2-phun-xam-n-card-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 22px; /* Chỉnh size phù hợp để không bị tràn dòng */
    margin-bottom: 8px;
    font-weight: 500;
    text-align: center;
    width: 100%;
}

/* Các thuộc tính hỗ trợ giữ nguyên từ code trước */
.sec-2-phun-xam-n-overlay {
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding: 20px 10px 30px 10px;
    box-sizing: border-box;
}

.sec-2-phun-xam-n-card-title {
    font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    color: #710DAC; /* Chuyển sang màu đậm vì nền overlay giờ là trắng mờ */
    text-align: center;
    line-height: 1.4;
    margin-bottom: 15px;
	font-weight:400;
}

.sec-2-phun-xam-n-btn {
    display: inline-block;
        padding: 6px 30px 4px;
     border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
	background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    text-decoration: none;
    border-radius: 50px;
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 400;
}
/********/
/* ============================================================
   1. CẤU TRÚC CHUNG & TAB SIDEBAR
   ============================================================ */
.sec-2-phun-xam-tab-v-container {
    max-width: 1440px;
    margin: 50px auto;
    padding: 30px;
}

.sec-2-phun-xam-tab-v-main {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.sec-2-phun-xam-tab-v-sidebar {
    width: 25%;
    display: flex;
    flex-direction: column;
}

.sec-2-phun-xam-tab-v-titles {
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
}

/* HIỆU ỨNG GRADIENT CHUNG */
.sec-2-phun-xam-n-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    padding: 10px 15px; 
    margin: -10px -15px;
}

/* TITLE: ĐẠI TIỆC & KHUYẾN MÃI */
.v-title-dai-tiec {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    line-height: 0.8;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 400;
    margin-bottom: 0px;
}

.v-title-khuyen-mai {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 400;
	transform: translateY(-20px);
    margin-left: 50px;
}

/* MENU TAB DỌC */
.sec-2-phun-xam-tab-v-nav {
    display: flex;
    flex-direction: column;
    gap: 0px;
}

.v-tab-link {
    padding: 6px 25px 3px;
    background: linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
    border: 2px solid #fff;
    color: #710DAC;
    font-family: 'Geomanist', sans-serif;
    width: 310px;
    font-size: 22px;
    font-weight: 400;
    border-radius: 50px;
    cursor: pointer;
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px rgba(150, 21, 210, 0.1), 0 4px 8px rgba(0, 0, 0, 0.05);
}

.v-tab-link.active, .v-tab-link:hover {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #fff;
    border: 2px solid #fff;
    box-shadow: 0 10px 30px rgba(150, 21, 210, 0.1), 0 4px 8px rgba(0, 0, 0, 0.05);
    padding-left: 35px;
}

/* ============================================================
   2. NỘI DUNG TAB & HÌNH ẢNH
   ============================================================ */
.sec-2-phun-xam-tab-v-content {
    width: 75%;
    position: relative;
    border-radius: 20px;
    padding: 0;
    overflow: visible;
}

.v-tab-panel {
    display: none;
    animation: slideInRight 0.5s ease;
}

.v-tab-panel.active {
    display: block;
}

.v-image-full-box {
    position: relative;
    width: 100%;
    line-height: 0;
}

.v-image-full-box img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    display: block;
}

/* TEXT NẰM TRÊN ẢNH */
.v-text-on-image {
    position: absolute;
    top: 112px;
    left: 0;
    width: 100%;
    text-align: center;
    font-family: 'Geomanist', sans-serif;
    font-size: 25px;
    color: #710DAC;
    font-weight: 400;
    padding: 0 20px;
    margin: 0;
    line-height: 1.4;
    z-index: 5;
}

/* ============================================================
   3. NÚT NHẬN ƯU ĐÃI & HIỆU ỨNG
   ============================================================ */
.v-tab-footer-inner {
    position: absolute;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

/* Class nút dùng chung và class nút trong content */
.v-btn-nhan-uu-dai, .sec-2-phun-xam-tab-v-content .v-btn-nhan-uu-dai {
    display: inline-block;
    padding: 30px 45px 25px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border: 2px solid #fff;
    color: #fff !important;
    text-decoration: none;
    border-radius: 50px;
    font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    font-weight: 500;
    box-shadow: 0 10px 20px rgba(150, 21, 210, 0.3);
    white-space: nowrap;
    transition: all 0.3s ease;
}

.sec-2-phun-xam-tab-v-footer {
    text-align: center;
  
}

.btn--pulse {
    animation: pulse-purple 2s infinite;
}

@keyframes pulse-purple {
    0% { transform: translate(-50%, 0) scale(1); }
    50% { transform: translate(-50%, -5px) scale(1.05); }
    100% { transform: translate(-50%, 0) scale(1); }
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(30px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ============================================================
   4. CÁC CLASS BỔ SUNG (TITLE WRAPPER, GRID, FONTS)
   ============================================================ */
.sec-2-phun-xam-n-title-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}

.sec-2-phun-xam-n-title-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: center;
    width: 100%;
    max-width: 1300px;
    flex-wrap: nowrap;
}

.sec-2-phun-xam-n-line-row {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
    width: 100%;
}



.sec-2-phun-xam-n-line-row:nth-child(2) {
    margin-top: -50px;
	margin-left: 140px;
}

.phun-xam-ivy-45 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400;
    transition: all 0.3s ease;
}

.phun-xam-utm-120 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    font-weight: 400;
    transition: all 0.3s ease;
}

/* ============================================================
   5. RESPONSIVE (MOBILE & TABLET)
   ============================================================ */
@media (max-width: 1024px) {
    .sec-2-phun-xam-tab-v-main {
        flex-direction: column;
    }
    .sec-2-phun-xam-tab-v-sidebar, 
    .sec-2-phun-xam-tab-v-content {
        width: 100%;
    }
    .v-title-dai-tiec { font-size: 80px; }
    .v-title-khuyen-mai { font-size: 40px; }
    .v-text-on-image {
        font-size: 15px;
        top: 15px;
    }
    .v-btn-nhan-uu-dai {
        padding: 10px 30px;
        font-size: 16px;
    }
    .sec-2-phun-xam-n-feature-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .sec9-pxtm-nn {
        padding: 0px !important;
    }
    .phun-xam-ivy-45 {
        font-size: 28px;
    }
    .phun-xam-utm-120 {
        font-size: 70px;
    }
    .sec-2-phun-xam-n-line-row {
        gap: 8px;
        flex-wrap: wrap;
    }
    .sec-2-phun-xam-n-line-row:nth-child(2) {
        margin-top: 0px;
    }
}
/***/
/* --- TỔNG QUAN SECTION --- */

.v-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- HIỆU ỨNG SHADOW CHUẨN FIGMA (X4 Y4 B4 25%) --- */
.v-shadow-custom {
   border-radius: 40px;
border-radius: 16px;
border: 2px solid #FFF;
background: var(--gadient-trng-hng, linear-gradient(180deg, #FFF 0%, #F3EDFF 100%));
box-shadow: 4px 4px 4px 0 rgba(59, 1, 124, 0.25);
}

/* --- SECTION 1: BỐ CỤC 2 CỘT --- */
.v-expert-top-row {
    display: flex;
    
    gap: 40px;
    margin-bottom: -40px;
}

.v-col-left { flex: 1; position: relative; }
.v-col-right { flex: 1.2; }

/* TIÊU ĐỀ LỒNG TRONG CỘT PHẢI */
.sec4-pxtm-nn-tc-title-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 25px;
}

.sec4-pxtm-nn-tc-row {
   display: flex;
    align-items: baseline;
    gap: 5px;
    width: 100%;
    flex-wrap: nowrap; /* Ngăn không cho rớt dòng */
	justify-content: center;
}

.sec4-pxtm-nn-tc-row:nth-child(2) {
    margin-top: -50px; /* Lồng hàng 2 vào hàng 1 nghệ thuật */
	padding-left: 20px; /* Nhích nhẹ hàng 2 sang phải để bố cục chặt chẽ */
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.sec4-pxtm-nn-tc-row:nth-child(2) .sec4-pxtm-nn-tc-utm-120 {
	margin-top: -88px;  
}
.sec4-pxtm-nn-tc-ivy-55 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 400;
}

.sec4-pxtm-nn-tc-utm-120 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	padding: 0px 20px;
    margin-left: -28px;
}
.v-nowrap {
    white-space: nowrap; 
    display: inline-block;
}
/* BOX THÀNH TÍCH */
.v-achievement-box {
    padding:30px 30px;
}

.v-achievement-list { list-style: none; padding: 0; margin: 0; }
.v-achievement-list li {
    font-family: 'Geomanist', sans-serif;
    color: #710DAC;
    font-size: 18px;
    padding-left: 20px;
    position: relative;
    margin-bottom: 12px;
    line-height: 1.5;
}

.v-achievement-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #9615D2;
    font-weight: bold;
}

/* THẺ MASTER CHÍNH */
.v-expert-img img { width: 100%; border-radius: 20px; display: block; }
.v-expert-info-tag {
     position: absolute;
    bottom: 50px;
    left: 20px;
    right: 20px;
    padding: 15px 45px;
    text-align: center;
}

.v-name { font-family: 'Geomanist', sans-serif; font-size: 30px; font-weight: 500; margin: 0;background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; }
.v-pos { font-size: 22px; margin-top: -5px;background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; font-weight: 500; }

/* --- SECTION 2: GRID 3 CỘT --- */
.v-expert-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.v-expert-sub-card {
    position: relative;
    overflow: hidden;
}

.v-expert-sub-card img { width: 100%; display: block; }

.v-sub-content {
  position: relative; /* Gốc tọa độ cho cả Header và Desc */
    width: 100%;
}



.v-sub-name { font-family: 'Geomanist', sans-serif; font-size: 22px; margin: 0; font-weight: 500; background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; }
.v-sub-pos { background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; font-size: 18px; margin-top: -5px;font-weight: 600 }

.v-sub-desc, .v-sub-single-desc {
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
}
/* 1. POSITION CHO HEADER (TÊN & CHỨC VỤ) */
.v-sub-header {
    position: absolute;
    top: -250px; /* Cách mép trên ảnh 15px */
    left: 15px;
    right: 15px;
    z-index: 10;  
    padding: 10px 15px;
    border-radius: 10px;
	text-align:center;
    
}
.v-sub-desc {
        position: absolute;
    bottom: 15px;
    left: 15px;
    right: 15px;
    z-index: 10;
    color: #710DAC;
    padding: 12px 30px;
    border-radius: 10px;
}
.v-sub-single-desc {
        position: absolute;
    bottom: 44px;
    left: 15px;
    right: 15px;
    z-index: 10;
    color: #710DAC;
    padding: 12px 30px;
    border-radius: 10px;
}
.sec4-pxtm-nn-tc .v-expert-grid .v-expert-sub-card:nth-child(3) {
	    margin-top: 20px;
}


/* NÚT FOOTER */
.v-footer-action { text-align: center; margin-top: 50px; }
.v-btn-register {
        background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #fff !important;
    padding: 10px 40px 8px;
    border-radius: 50px;
    text-decoration: none;
    font-family: 'Geomanist', sans-serif;
    font-weight: 400;
    font-size: 20px;
    display: inline-block;
    border: 2px solid #fff;
}
.sec-10-new-phun .v-btn-nhan-uu-dai {
	 background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #fff !important;
    padding: 10px 40px 8px;
    border-radius: 50px;
    text-decoration: none;
    font-family: 'Geomanist', sans-serif;
    font-weight: 400;
    font-size: 20px;
    display: inline-block;
    border: 2px solid #fff;
}
/* --- RESPONSIVE --- */
@media (max-width: 1024px) {
    .v-expert-top-row { flex-direction: column; align-items: center; }
    .sec4-pxtm-nn-tc-title-inner { align-items: center; }
    .v-col-right { width: 100%; }
    .v-expert-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .v-expert-grid { grid-template-columns: 1fr; }
    .sec4-pxtm-nn-tc-row:nth-child(2) { margin-top: -32px; }
    .sec4-pxtm-nn-tc-ivy-55 { font-size: 30px; }
    .sec4-pxtm-nn-tc-utm-120 { font-size: 60px; }
}
/*********/


/* CONTAINER TỔNG */
.sec-5-phun-xam-n-wrapper {
    width: 100%;
   
    padding: 20px 20px; /* Khoảng cách trên dưới cho Section */
    display: flex;
    justify-content: center;
}

.sec-5-phun-xam-n-container {
    width: 100%;
    max-width: 1400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* GRADIENT MÀU MỚI (#B915D2 -> #3D037D) */
.sec-5-phun-xam-n-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}

/* STYLE TIÊU ĐỀ (IvyPresto Display 45px) */
.sec-5-phun-xam-n-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400; /* Regular */
    margin-bottom: 30px;
    line-height: 1.2;
}

/* STYLE MÔ TẢ (Geomanist 20px) */

.sec-5-phun-xam-n-des {
    font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    font-weight: 400; /* Regular */
    
    line-height: 1.6;
    margin: 0;
	background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
    .sec-5-phun-xam-n-wrapper {
        padding: 50px 15px;
    }

    .sec-5-phun-xam-n-title {
        font-size: 32px; /* Thu nhỏ tiêu đề trên mobile */
        margin-bottom: 20px;
    }

    .sec-5-phun-xam-n-des {
        font-size: 16px; /* Thu nhỏ mô tả trên mobile */
        line-height: 1.5;
    }
}
/******************/

/* CONTAINER TỔNG */
.sec-7-phun-xam-m-wrapper {
    width: 100%;
    padding: 30px 20px;
    
    display: flex;
    justify-content: center;
}

.sec-7-phun-xam-m-container {
    width: 100%;
    max-width: 1400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* GRADIENT MÀU MỚI (#B915D2 -> #3D037D) */
.sec-7-phun-xam-m-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    /* Bảo vệ các nét móc chữ nghệ thuật không bị cắt */
     padding: 0px 13px;
}

/* HÀNG 1: Sao Việt (UTM Edwardian 120px) */
.sec-7-phun-xam-m-row-1 {
    z-index: 2;
}

.sec-7-phun-xam-m-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    font-weight: 400;
    margin: 0;
}

/* HÀNG 2: Bố cục lồng ghép */
.sec-7-phun-xam-m-row-2 {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
    margin-top: -3px; /* Kéo hàng 2 lên để lồng vào nét chữ hàng 1 nghệ thuật hơn */
    z-index: 1;
}
.sec-7-phun-xam-m-row-1 {
	    margin-left: -40%;
}
.sec-7-phun-xam-m-ivy-45 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400;
}

.sec-7-phun-xam-m-ivy-55 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
    margin-left: -17px;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 1024px) {
    .sec-7-phun-xam-m-art { font-size: 80px; }
    .sec-7-phun-xam-m-ivy-45 { font-size: 30px; }
    .sec-7-phun-xam-m-ivy-55 { font-size: 38px; }
    .sec-7-phun-xam-m-row-2 { margin-top: 3px; }
}

@media (max-width: 600px) {
    .sec-7-phun-xam-m-row-2 {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0px;
    }
    .sec-7-phun-xam-m-art { font-size: 65px; }
    .sec-7-phun-xam-m-ivy-45 { font-size: 25px; }
    .sec-7-phun-xam-m-ivy-55 { font-size: 30px; }
}

/***********/
.sec-7-phun-moi-m {
  position: relative;
  padding: 40px 0;
  overflow: hidden;
}

.sec-7-phun-moi-m__wrap {
  position: relative;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 70px;
}

.sec-7-phun-moi-m__viewport {
  overflow: hidden;
  width: 100%;
}

.sec-7-phun-moi-m__track {
  display: flex;
  align-items: center;
  gap: 24px;
  transition: transform 0.5s ease;
  will-change: transform;
}

.sec-7-phun-moi-m__slide {
  flex: 0 0 calc((100% - 48px) / 3);
  transform: scale(0.88);
  opacity: 0.7;
  transition: transform 0.45s ease, opacity 0.45s ease;
  transform-origin: center center;
  border-radius: 18px;
}

.sec-7-phun-moi-m__slide img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 18px;
  object-fit: cover;
 
}

.sec-7-phun-moi-m__slide.is-center {
  transform: scale(1.06);
  opacity: 1;
  z-index: 2;
}

.sec-7-phun-moi-m__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 50%;
  background: #ffffff;
  color: #7a22c8;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  z-index: 5;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}

.sec-7-phun-moi-m__nav:hover {
  background: #f4e9ff;
}

.sec-7-phun-moi-m__nav--prev {
  left: 10px;
}

.sec-7-phun-moi-m__nav--next {
  right: 10px;
}

@media (max-width: 991px) {
  .sec-7-phun-moi-m__wrap {
    padding: 0 50px;
  }

  .sec-7-phun-moi-m__slide {
    flex: 0 0 calc((100% - 20px) / 2);
  }

  .sec-7-phun-moi-m__track {
    gap: 20px;
  }
}

@media (max-width: 767px) {
  .sec-7-phun-moi-m__wrap {
    padding: 0 42px;
  }

  .sec-7-phun-moi-m__slide {
    flex: 0 0 100%;
    transform: scale(0.92);
  }

  .sec-7-phun-moi-m__slide.is-center {
    transform: scale(1);
  }

  .sec-7-phun-moi-m__track {
    gap: 0;
  }

  .sec-7-phun-moi-m__nav {
    width: 36px;
    height: 36px;
    font-size: 13px;
  }
	.sec-4-phun-m-n-row .sec-4-phun-m-n-ivy-55 {
		        font-size: 31px;
        margin-top: 0px;
	}
	.sec-4-phun-m-n-row  .sec-4-phun-m-n-utm-120 {
		    margin-top: -30px;
	}
}
/*************/
/* CONTAINER TỔNG */
.sec-real-images-m-wrapper {
    width: 100%;
    max-width: 1400px;
    margin: 60px auto;
    padding: 0 40px;
    text-align: center;
    display: flex;
    justify-content: center;
}

.sec-real-images-m-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* GRADIENT CHUẨN (#B915D2 -> #3D037D) */
.sec-real-images-m-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    /* Bảo vệ các nét móc của chữ nghệ thuật */
    padding: 10px 40px;
    margin: -10px -20px;
}

/* HÀNG 1: Hình ảnh thực tế (UTM Edwardian 120px) */
.sec-real-images-m-row-1 {
    z-index: 2;
}

.sec-real-images-m-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    font-weight: 400; /* Regular */
    margin: 0;
}

/* HÀNG 2: của khách hàng (IvyPresto Display 55px) */
.sec-real-images-m-row-2 {
    margin-top: -15px; /* Kéo hàng 2 lên để lồng vào nét chữ hàng 1 */
    z-index: 1;
}

.sec-real-images-m-ivy {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400; /* Regular */
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 1024px) {
    .sec-real-images-m-art { font-size: 85px; }
    .sec-real-images-m-ivy { font-size: 38px; }
    .sec-real-images-m-row-2 { margin-top: -15px; }
}

@media (max-width: 600px) {
    .sec-real-images-m-art { font-size: 65px; }
    .sec-real-images-m-ivy { font-size: 28px; }
    .sec-real-images-m-row-2 { margin-top: -10px; }
}

/************/

/* CONTAINER 1400PX */
.sec-8-phun-xam-m-expert-wrapper {
    width: 100%;
    max-width: 1400px;
    margin: 60px auto;
    padding: 0 20px;
    box-sizing: border-box;
    font-family: 'Geomanist', sans-serif;
}

.sec-8-phun-xam-m-expert-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    align-items: stretch;
}

.sec-8-phun-xam-m-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    
    height: 100%;
    
}

.sec-8-phun-xam-m-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.sec-8-phun-xam-m-card:hover img {
    transform: scale(1.05);
}

/* TEXTBOX POSITION */
.sec-8-phun-xam-m-textbox {
    position: absolute;
    bottom: -5px;
    left: 15px;
    right: 15px;
    
    padding: 15px 10px;
    border-radius: 15px;
    text-align: center;
    z-index: 2;
}

.sec-8-phun-xam-m-name {
	 font-family: 'Geomanist', sans-serif;
    font-size: 22px;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
    /* Gradient chuẩn từ ảnh f6f683 */
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sec-8-phun-xam-m-position {
	 font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    color: #710DAC;
    margin-top: 8px;
    line-height: 1.4;
    font-weight: 400;
}

/* RESPONSIVE */
@media (max-width: 1024px) {
    .sec-8-phun-xam-m-expert-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .sec-8-phun-xam-m-expert-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .sec-8-phun-xam-m-textbox {
        bottom: 10px;
        padding: 12px 8px;
    }
    
    .sec-8-phun-xam-m-name { font-size: 18px; }
}

.button:hover,a:hover, .dark .button.is-form:hover, input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover {
   
    color: #fff!important;
    opacity: 1;
    outline: none;
}
/*********/
/* CONTAINER TỔNG */
.sec-video-kh-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}

.sec-video-kh-container {
    width: 100%;
    max-width: 1400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* GRADIENT CHỦ ĐẠO (#B915D2 -> #3D037D) */
.sec-video-kh-gradient {
    /* Sử dụng mã màu từ file image_f6f683.png */
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}

/* BỐ CỤC CHỮ LỒNG NHAU */
.sec-video-kh-content {
    display: flex;
    align-items: baseline;
    position: relative;
}

/* Chữ "Video" (UTM Edwardian 120px) */
.sec-video-kh-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    font-weight: 400;
    line-height: 1;
    z-index: 2;
	padding: 0 12px;
}

/* Chữ "khách hàng" (IvyPresto Display 55px) */
.sec-video-kh-text {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
    margin-left: 15px; /* Kéo chữ lồng vào nét móc chữ Video */
    z-index: 1;
    white-space: nowrap;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
	.sec-2-phun-xam-tab-v-footer {
    
    margin-top: -50px!important;
}
    .sec-video-kh-art {
        font-size: 80px;
    }
   
}

@media (max-width: 480px) {
    .sec-video-kh-art {
        font-size: 60px;
    }
    .sec-video-kh-text {
        font-size: 28px;
        margin-left: 2px;
    }
	.sec-real-images-m-art {
		padding:15px 15px;
	}
	.sec-real-images-m-wrapper {
		padding:0 10px;
	}
}


/**********Chi nhánh **********/
/**** Hệ thống chi nhánh cuối landing page ***/
@media screen and (min-width:1024px) and (max-width:1439px) {
		.new_tab-chinhanh ul {
			font-family: 'Geomanist', sans-serif;
    padding-bottom: 1.5rem;
    justify-content: space-between !important;
    border-bottom: 2px solid #501C9E;
    width: 800px !important;
    margin: 0 auto;
}
				.new_tab-chinhanh .tab-panels {
		width: 80% !important;
    margin: 0 auto;
		}
				.new_tab-chinhanh ul > li > a, .new_tab-chinhanh ul > li.active > a {
			font-size: 17px !important;
		}
	}
	@media screen and (min-width:768px) and (max-width:1023px) {
		.new_tab-chinhanh .tab-panels {
			padding: 1rem 2.5rem 1rem 2.5rem;
		}
		.block-tab-newcn {
    top: 13% !important;
		}
		.new_tab-chinhanh ul > li > a, .new_tab-chinhanh ul > li.active > a {
			font-size: 17px !important;
		}
			.tab_cs--block p {
    	font-size: 16px;
	}
	}
	@media screen and (max-width:549px) {
		.new_tab-chinhanh {
			padding-top: 6.5rem;
		}
		.new_tab-chinhanh ul.nav-simple {
    padding: 1rem 2rem 1.5rem 1rem;
		justify-content: center !important;
		gap: 10px;
		width: 90% !important;
    margin: 0 auto;
	}
		    .block-tab-newcn .col-new-tabcn {
        box-shadow: 0 0 3px 5px #EBE2F9;
		border-radius: 16px;
		margin-top: 22px;
		background: #fff;		
    }
		.new_tab-chinhanh .tab-panels {
			padding: 2rem;
		}
		.new_tab-chinhanh ul > li > a, .new_tab-chinhanh ul > li.active > a {
			font-size: 16px !important;
		}
		.block-tab-newcn {
    position: relative !important;
	}
		.col-polcn-img {
			position: absolute;
   	 z-index: 9;
		}
}	
.block-tab-newcn {
    position: absolute;
    top: 18%;
    right: 0;
    left: 0;
}
	p.tab_cs-title {
		font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: #710DAC;
    text-transform: uppercase;
}
	.tab_cs--block {
    margin-bottom: 1.7rem;
}
	.tab_cs--block p {
		font-family: 'Geomanist', sans-serif;
    margin-bottom: 0.3rem;
		color: #710DAC;
}
p.tab_cs-map a:before {
    content: '';
    display: inline-block;
    width: 18px;
    background-repeat: no-repeat;
    height: 14px;
    margin-right: 3px;
    background-size: contain;
    background-position: center;
    background-image: url(https://thammylinhanh.vn/wp-content/uploads/2025/09/Vector-maps.png);
}
p.tab_cs-map a {
	font-family: 'Geomanist', sans-serif;
    background: #EBE2F9;
    padding: 0.3rem 0.6rem;
    border-radius: 99px;
		color: #710DAC;
}
.new_tab-chinhanh ul {
    padding-bottom: 1.5rem;
	justify-content: space-evenly !important;
    border-bottom: 2px solid #710DAC;	
}

	.new_tab-chinhanh ul > li > a {
		font-family: 'Geomanist', sans-serif;
		font-size: 22px;
    color: #710DAC;
    font-weight: 500;
	}
.new_tab-chinhanh ul > li.active > a {
	font-family: 'Geomanist', sans-serif;
    font-size: 22px;
    color: #FFFFFF;
    font-weight: 500;
	border: 2px solid #fff;
    padding: 0.5rem 1rem 0.2rem 1rem;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border-radius: 999px;
	box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
}
/**********/
@media screen and (max-width: 549px) {
	.bfaf-flex-scroll .box {
    width: 262px;
	}
	.bfaf-flex-scroll p.feedback-name {
		font-size: 17px !important;
	}
}
.new_tab-chinhanh a:hover {
color: hsla(0, 0%, 7%, .85)!important;
}

/****footer***/
/* ─── Footer Styles (New Design) ──────────────────── */
.site-footer {
   
    color: #3A3228;
    font-family: 'Geomanist', var(--font-body);
    padding-block: var(--space-16) var(--space-12);
}

/* Footer Divider Line */
.footer-divider {
    width: 100%;
    height: 1px;
    background: #710DAC;
    margin-bottom: var(--space-12);
}

/* Footer Content Container */
.site-footer__content {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--space-16);
    align-items: start;
    margin-bottom: var(--space-10);
}

/* Footer Brand (Logo + Description) */
.footer-brand {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: center;
}

/* Footer Logo */
.footer-logo {
    max-width: 200px;
}

.footer-logo__link {
    display: block;
}

.footer-logo__link img {
    width: 100%;
    height: auto;
}

.footer-logo__text {
    font-family: var(--font-heading);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: #BF934E;
}

.footer-logo-description {
    max-width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.footer-logo-description p {
	font-family: 'Geomanist', var(--font-body);
	color: #710DAC;
    font-size: 17px;
    line-height: 1.3;
    
    text-align: justify;
}

/* Footer Columns */
.footer-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.footer-column__title {
    font-family: 'Geomanist', var(--font-body);
    font-size: 25px;
    font-weight: 500;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    margin-bottom: var(--space-3);
}

.footer-contact-item span,
.footer-column--policy ul>li>a {
	font-family: 'Geomanist', var(--font-body);
	color: #710DAC;
    font-size: 17px;
    font-weight: 400;
}

/* Contact Info */
.footer-contact-info {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.footer-contact-item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-text);
}

.footer-contact-item i {
    color: #710DAC;
    font-size: 1rem;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.footer-contact-item a {
    color: #710DAC;
    text-decoration: none;
}

.footer-contact-item a:hover {
    color: #BF934E;
}

/* Policy Links */
.footer-links {
    display: flex;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    font-size: 17px;
}

.footer-links a {
   font-family: 'Geomanist', var(--font-body);
	color: #710DAC;
    text-decoration: none;
    transition: color var(--transition-fast);
}
.site-footer a:hover {
	color: #710DAC!important;
}
.footer-links a:hover {
    color: #710DAC;
}

/* Footer Legal Info */
.site-footer__legal {
    margin-bottom: var(--space-8);
}

.footer-legal-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    width: 94%;
    margin: 0 auto;
    border: 1px solid #E2E2E2;
    padding: 1.4rem;
    border-radius: 26px;
    background: #e4e4e445;
}

.footer-legal-list li {
	font-family: 'Geomanist', var(--font-body);
	color: #710DAC;
    font-size: 16px;
    line-height: 1.2;
    
    font-weight: 400;
    position: relative;
    padding-left: var(--space-3);
}

.footer-legal-list li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #710DAC;
}

/* Footer Disclaimer */
.site-footer__disclaimer {
    padding-top: var(--space-6);
    border-top: 1px solid var(--color-gray-200);
}

.site-footer__disclaimer p {
    font-size: 12px;
    line-height: 1;
    color: #000;
    margin-bottom: var(--space-3);
    font-style: italic;
}

.site-footer__disclaimer p:last-child {
    margin-bottom: 0;
}

/* ─── Responsive Footer ──────────────────────────────── */
@media (max-width: 1024px) {
    .site-footer__content {
        grid-template-columns: 1fr;
        gap: var(--space-10);
    }

    .footer-logo {
        max-width: 180px;
        margin: 0 auto;
    }

    .footer-columns {
        gap: var(--space-8);
    }
}

@media (max-width: 768px) {
    .site-footer {
        padding-top: var(--space-12);
        padding-bottom: 120px;
        /* Increased padding to accommodate Sticky CTA */
    }

    .footer-divider {
        margin-bottom: var(--space-8);
    }

    .site-footer__content {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .footer-brand {
        align-items: flex-start;
    }

    .footer-columns {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .footer-logo {
        max-width: 160px;
    }

    .footer-column__title {
        font-size: 22px;
    }

    .footer-legal-list li,
    .site-footer__disclaimer p {
        font-size: 14px
    }
}

@media (max-width: 480px) {
	.sec-2-phun-xam-n-content-wrapper {
		margin-bottom:-30px;
	}
	.sec-2-phun-xam-n-feature-content {
	top: 28%!important;	
	}
	
    .site-footer {
        padding-top: var(--space-10);
        /* Keep padding-bottom from 768px rule — do NOT override */
    }

    .footer-logo {
        max-width: 140px;
    }

    .footer-divider {
        margin-bottom: var(--space-6);
    }

    .site-footer__content {
        gap: var(--space-6);
    }

    .footer-columns {
        gap: var(--space-6);
    }
	
/****Sec2 mobile******/	
	.sec-2-phun-xam-n-wrapper {
		    padding: 30px 0px 0px 0px;
	}
	.sec-2-phun-xam-n-gradient {
		margin-top:-15px;
	}
	.mb-sec2-title {
		margin-top:-35px;
	}
	.sec-2-phun-xam-n-text-block p {
    font-size: 18px!important;
	margin-bottom: 44px;
}
	

    .sec-2-phun-xam-n-grid-wrapper {
        padding: 0px ; /* Thu nhỏ padding lề ngoài một chút */
    }

    .sec-2-phun-xam-n-grid {
        /* Chuyển từ 4 cột về 1 cột */
        grid-template-columns: 1fr; 
        gap: 25px; /* Tăng khoảng cách giữa các card để dễ nhìn */
    }

    .sec-2-phun-xam-n-card-title {
        font-size: 18px; /* Giảm nhẹ size chữ để không bị vỡ dòng trên máy nhỏ */
        margin-bottom: 3px;
    }

    .sec-2-phun-xam-n-btn {
        padding: 8px 35px; /* Tăng diện tích bấm (touch target) cho người dùng mobile */
        font-size: 16px;
    }

    .sec-2-phun-xam-n-overlay {
        /* Cân chỉnh lại vị trí overlay nếu cần trên mobile */
        bottom: -32px; 
        padding: 15px 10px 25px 10px;
    }
	
	
/************ Sec3 mobile tav ***************/	
	/* Container chính cho Mobile */
.sec-3-mobile-tab-s-container {
    width: 100%;
    
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Gradient text dùng chung */
.m-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* Tiêu đề */
.sec-3-mobile-tab-s-titles {
    text-align: center;
    margin-bottom: 20px;
}

.m-title-dai-tiec {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 90px;
    display: block;
    line-height: 10px;
        margin-bottom: -33px;
}

.m-title-khuyen-mai {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 36px;
    font-weight: 500;
    display: block;
           margin-left: 100px;
}
.sec-3-mobile-tab-s-container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px;
}

/* Nav Tabs */
.sec-3-mobile-tab-s-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-bottom: 20px;
}

.m-tab-link {
    background: #F3EDFF;
    border: 1px solid #710DAC;
    padding: 6px 15px;
    border-radius: 50px;
    color: #710DAC;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.m-tab-link.active {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #FFFFFF;
    border-color: #fff;
}

/* Content Wrapper */
.m-panel-relative {
    position: relative;
    width: 100%;
    max-width: 370px;
    margin: 0 auto;
    border-radius: 15px;
    overflow: hidden;
  
}

.m-panel-relative img {
    width: 100%;
    height: auto;
    display: block;
}

/* --- Section Text (Position Top) --- */
.m-abs-text-section {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    text-align: center;
	
    padding: 0 15px;
    box-sizing: border-box;
    z-index: 2;
}

.m-panel-title {
    color: #FFD700;
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 800;
	padding: 0 15px;
    margin: 0;
    text-shadow: 1px 1px 5px rgba(0,0,0,0.8);
    text-transform: uppercase;
}

.m-panel-desc {
    color: #710DAC;
    font-size: 18px;
    margin: 5px 0 0;
	padding: 0 15px;
   font-weight:400;
}

/* --- Section Button (Position Bottom) --- */
.m-abs-button-section {
    position: absolute;
    bottom: 36px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    z-index: 2;
}

.m-btn-in-tab {
    display: inline-block;
        background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
        color: #fff;
        padding: 7px 35px 4px;
        border-radius: 50px;
        text-decoration: none;
        font-family: 'Geomanist', sans-serif;
        font-weight: 400;
        font-size: 16px;
		border: 2px solid #fff;
        text-transform: uppercase;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* Animation */
.m-tab-panel {
    display: none;
    animation: fadeIn 0.4s ease-in-out;
}

.m-tab-panel.active {
    display: block;
}

@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.98); }
    to { opacity: 1; transform: scale(1); }
}
/* Tabs: Chia làm 2 hàng */
.sec-3-mobile-tab-s-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0px;
    margin-bottom: 25px;
}

.m-tab-link {
    background: linear-gradient(180deg, #fff 0%, #F3EDFF 100%);
    border: none;
    padding: 2px 13px 0px 13px;
    border-radius: 50px;
    color: #710DAC;
    font-family: 'Geomanist', sans-serif;
    font-size: 14px;
	font-weight:400;
   box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
    transition: all 0.3s ease;
    white-space: nowrap;
}

.m-tab-link.active {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #FFFFFF;
	border: 2px solid #fff;
}

/* Khung bọc ảnh có Badge */
.sec-3-mobile-tab-s-content-wrapper {
    position: relative;
    width: 100%;
    max-width: 370px;
}

.m-price-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #fff;
    padding: 5px 15px;
    border-radius: 10px;
    font-size: 14px;
    font-family: 'Geomanist', sans-serif;
    z-index: 2;
}

.m-price-badge span {
    font-size: 20px;
    font-weight: bold;
}

/* Animation panel */
.m-tab-panel {
    display: none;
    animation: fadeIn 0.4s ease-in-out;
}

.m-tab-panel.active {
    display: block;
}

.m-tab-panel img {
    width: 100%;
    height: auto;
    border-radius: 10px;
    display: block;
}

/* Footer Button */
.sec-3-mobile-tab-s-footer {
    margin-top: 25px;
    width: 100%;
    text-align: center;
}

.m-btn-nhan-uu-dai {
    display: inline-block;
    width: 65%;
    padding: 10px 0 5px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    color: #fff;
    text-decoration: none;
    border-radius: 50px;
    font-family: 'Geomanist', sans-serif;
    font-weight: 400;
    font-size: 18px;
    box-shadow: 0 5px 15px rgba(113, 13, 172, 0.3);
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}
}

/********************* title kỹ thuật  **************************/

/* Hiệu ứng Gradient rực rỡ */
.sec-2-mobile-n-new-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    /* Padding bảo vệ nét chữ nghệ thuật trên Mobile */
    padding: 5px 10px; 
    margin: -5px -10px;
}

/* Cấu trúc hàng ngang - Tối ưu cho Mobile */
.sec-2-mobile-n-new-line-row {
    display: flex;
    flex-wrap: wrap; /* Cho phép rớt dòng nếu màn hình quá nhỏ */
    align-items: baseline;
    justify-content: center;
    gap: 8px; /* Tăng khoảng cách nhẹ giữa 2 font chữ khác nhau */
    width: 100%;
    margin-bottom: 10px;
}

/* Container chính */
.sec-2-mobile-n-new-feature-wrapper {
    width: 100%;
    margin: 20px auto;
    padding: 0 15px;
    box-sizing: border-box;
}

/* Grid chuyển sang 1 cột trên Mobile để dễ nhìn */
.sec-2-mobile-n-new-feature-grid {
    display: grid;
    grid-template-columns: 1fr; 
    gap: 20px;
}

.sec-2-mobile-n-new-feature-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.sec-2-mobile-n-new-feature-img {
    position: relative;
    width: 100%;
}

.sec-2-mobile-n-new-feature-img img {
    width: 100%;
    height: auto;
    display: block;
}

/* Nội dung đè lên ảnh */
.sec-2-mobile-n-new-feature-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Căn giữa tuyệt đối trên Mobile */
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px;
    box-sizing: border-box;
    text-align: center;
}

/* Font chữ tiêu đề */
.sec-2-mobile-n-new-feature-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 24px; /* Giảm size cho Mobile */
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.sec-2-mobile-n-new-feature-title-1 {
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 10px;
}

/* Nội dung mô tả */
.sec-2-mobile-n-new-feature-desc {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    color: #710DAC;
    line-height: 1.4;
    margin: 0;
    text-align: center; /* Mobile nên để Center cho dễ đọc */
}

/* Class bổ trợ Gradient 1 */
.sec-2-mobile-n-new-gradient-1 {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}
.sec-2-mobile-n-new-title-wrapper {
	margin-top:70px;
}

.sec-2-mobile-n-new-title-wrapper .phun-xam-ivy-45 {
	font-size: 45px!important;
}
.sec-2-mobile-n-new-title-wrapper .phun-xam-utm-120.title-1 {
	  margin: -39px 0px -15px 90px;
}
.sec-2-mobile-n-new-title-wrapper .phun-xam-utm-120.title-2 {
	    margin: -20px 0px 0px 65px;
}
.sec-2-mobile-n-new-title-wrapper .phun-xam-utm-120  {
	font-size:80px!important;
}

/**** Slider sec 8****/
@media (max-width: 768px) {
	.facilities.section {
		padding-left:15px!important;
		padding-right:15px!important;
	}
	.sec-2-mobile-n-new-title-wrapper {
		    margin-top: 20px;
	}
    /* Container Slider */
    .sec-8-phun-xam-m-expert-grid {
        display: block !important; /* Slick cần display block */
        padding: 0 10px;
    }

    .sec-8-phun-xam-m-expert-item {
        padding: 10px; /* Khoảng cách giữa các slide */
    }

    .sec-8-phun-xam-m-card {
       
        border-radius: 20px;
      
        position: relative;
        overflow: visible; /* Để textbox hiển thị đè lên */
        margin-bottom: 50px;
    }

    /* Textbox bo góc như trong ảnh mẫu */
    .sec-8-phun-xam-m-textbox {
        position: relative;
      
        margin: -116px 15px 10px 15px; /* Đẩy textbox đè lên ảnh */
        padding: 20px 15px;
 
        z-index: 10;
        bottom: unset;
        left: unset;
        right: unset;
    }

    .sec-8-phun-xam-m-name {
        font-size: 18px;
        margin-bottom: 8px;
    }

    .sec-8-phun-xam-m-position {
        font-size: 14px;
        color: #710DAC;
    }

    /* Tùy chỉnh Nút mũi tên Slick */
    .slick-prev, .slick-next {
        width: 40px;
        height: 40px;
        z-index: 11;
        background: #fff !important;
		color:#451180!important;
        border-radius: 50%;
        box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    }
    .slick-prev { left: -5px; }
    .slick-next { right: -5px; }
    
    .slick-prev:before, .slick-next:before {
       
        font-size: 25px!important;
    }

    /* Tùy chỉnh dấu chấm Dots */
    .slick-dots {
        bottom: 40px!important;
    }
    .slick-dots li button:before {
        font-size: 12px;
        color: #B915D2;
        opacity: 0.3;
    }
    .slick-dots li.slick-active button:before {
        color: #B915D2;
        opacity: 1;
    }
}
@media (max-width: 768px) {
    /* 1. Tùy chỉnh vị trí tổng thể cho Dots */
    .sec-8-phun-xam-m-expert-grid .slick-dots {
        bottom: -40px;
        display: flex !important;
        justify-content: center;
        align-items: center;
        gap: 2px;
    }

    /* 2. Style cho các dấu chấm (Dots) */
    .sec-8-phun-xam-m-expert-grid .slick-dots li {
        margin: 0;
        width: 15px;
        height: 15px;
    }

    .sec-8-phun-xam-m-expert-grid .slick-dots li button:before {
        content: ''; /* Xóa icon mặc định của slick */
        width: 10px;
        height: 10px;
        background: #E6D5F2; /* Màu tím nhạt cho các nút chưa active */
        opacity: 1;
        border-radius: 50%;
        transition: all 0.3s ease;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    /* Khi chấm được chọn (Active) */
    .sec-8-phun-xam-m-expert-grid .slick-dots li.slick-active button:before {
        background: #710DAC; /* Màu tím đậm chuẩn */
        width: 12px;
        height: 12px;
    }

    /* 3. Style nút mũi tên Prev & Next */
    .sec-8-phun-xam-m-expert-grid .slick-prev, 
    .sec-8-phun-xam-m-expert-grid .slick-next {
        width: 40px;
        height: 40px;
        background: #ffffff !important; /* Nền trắng tinh */
        border-radius: 50%;
        z-index: 10;
        box-shadow: 0 4px 12px rgba(113, 13, 172, 0.2); /* Đổ bóng tím nhẹ */
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    /* Vị trí nút */
    .sec-8-phun-xam-m-expert-grid .slick-prev { left: 5px;        top: 170px; }
    .sec-8-phun-xam-m-expert-grid .slick-next { right: 5px;        top: 170px; }

    /* Thay đổi Icon mũi tên (Dùng mã Unicode hoặc FontAwesome) */
    .sec-8-phun-xam-m-expert-grid .slick-prev:before {
        content: '❮'; /* Mũi tên trái */
        color: #710DAC;
        font-size: 18px;
        opacity: 1;
        font-weight: bold;
    }

    .sec-8-phun-xam-m-expert-grid .slick-next:before {
        content: '❯'; /* Mũi tên phải */
        color: #710DAC;
        font-size: 18px;
        opacity: 1;
        font-weight: bold;
    }

    /* Ẩn mũi tên mặc định khi không hover (tùy chọn) */
    .sec-8-phun-xam-m-expert-grid .slick-arrow.slick-disabled {
        opacity: 0.3;
    }
}
/************************************************************************************************************************************************/
/* CONTAINER TỔNG */
.sec-10-phun-moi-mm-wrapper {
    width: 100%;
    padding: 0px 20px;
    display: flex;
    justify-content: center;
}

.sec-10-phun-moi-mm-container {
    width: 100%;
    max-width: 1400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* HIỆU ỨNG GRADIENT CHO TEXT (#B915D2 -> #3D037D) */
.sec-10-phun-moi-mm-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}

/* STYLE TIÊU ĐỀ (IvyPresto Display 45px Regular) */
.sec-10-phun-moi-mm-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400;
    margin-bottom: 25px;
    line-height: 1.2;
}

/* STYLE MÔ TẢ (Geomanist 20px Regular) */
.sec-10-phun-moi-mm-des-box {
    max-width: 1000px; /* Giới hạn độ rộng để text dễ đọc hơn */
}

.sec-10-phun-moi-mm-des {
    font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: #710DAC;
    line-height: 1.6;
    margin: 0;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
    .sec-10-phun-moi-mm-title {
        font-size: 32px;
        margin-bottom: 15px;
    }

    .sec-10-phun-moi-mm-des {
        font-size: 16px;
        line-height: 1.5;
    }
}


/*****/
.sec-10-phun-xam-mm-wrapper {
    
    padding:40px 0;
 
    font-family: 'Geomanist', sans-serif;
}

.sec-10-phun-xam-mm-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

/* GRADIENT TEXT */
.sec-10-phun-xam-mm-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%); /* */
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    line-height: 1.3;
    font-weight: 400;
    margin: 0;
}

.sec-10-phun-xam-mm-sub {
	font-family: 'Geomanist', var(--font-body);
    color: #710DAC;
    font-size: 20px;
    margin-top: 15px;
    text-transform: uppercase;
	text-align:center
}

/* LAYOUT SLIDE */
.sec-10-phun-xam-mm-flex-box {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 50px;
    min-height: 400px;
}

.sec-10-phun-xam-mm-col-img img {
    max-height: 350px;
    width: auto;
}

.sec-10-phun-xam-mm-img-full {
    width: 100%;
    height: auto;
    max-width: 1000px;
    margin: 0 auto;
    display: block;
}



/* RESPONSIVE */
@media (max-width: 768px) {
    .sec-10-phun-xam-mm-flex-box {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    .sec-10-phun-xam-mm-gradient { font-size: 24px; }
}

/* CUSTOM ARROWS */
.sec-10-phun-xam-mm-slider .slick-prev, 
.sec-10-phun-xam-mm-slider .slick-next {
    width: 50px;
    height: 50px;
   
    border-radius: 50%;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    
}

/* Mũi tên bên trong nút */
.sec-10-phun-xam-mm-slider .slick-prev:before, 
.sec-10-phun-xam-mm-slider .slick-next:before {
    font-size: 30px;
    color: #710DAC; /* Màu tím cho mũi tên */
    line-height: 1;
    opacity: 1;
    font-family: "slick"; /* Sử dụng font mặc định cho slick */
}

/* Định dạng mũi tên */
.sec-10-phun-xam-mm-slider .slick-prev:before {
    content: "←" !important;
}

.sec-10-phun-xam-mm-slider .slick-next:before {
    content: "→" !important;
}



/* Thu hẹp khoảng cách left/right cho các nút */
.sec-10-phun-xam-mm-slider .slick-prev {
    left: 20px !important; /* Nút "Previous" gần sát trái */
}

.sec-10-phun-xam-mm-slider .slick-next {
    right: 20px !important; /* Nút "Next" gần sát phải */
}

/* RESPONSIVE */
@media (max-width: 768px) {
    /* Thu nhỏ nút trên mobile */
    .sec-10-phun-xam-mm-slider .slick-prev, 
    .sec-10-phun-xam-mm-slider .slick-next {
        width: 35px;
        height: 35px;
    }
    .sec-10-phun-xam-mm-slider .slick-prev { left: 5px !important; }
    .sec-10-phun-xam-mm-slider .slick-next { right: 5px !important; }
}
.sec-10-new-phun .v-btn-nhan-uu-dai {
    padding: 10px 30px 10px;
} 
/************************************************************************************************************************************************/
.sec-2-phun-xam-n-text-block p {
	font-family: 'Geomanist', var(--font-body);
	color: #710DAC;
    font-size: 20px;
}


.absolute-footer {
	display:none;
}

.diamon-lips-banner-lp .box-text  {
	    position: absolute;
    /* top: 0; */
    bottom: -11px;
}
.v-btn-nhan-uu-dai { 
    padding: 2px 30px 0px;
}


/************************************************************************************************************************************************/

/* --- PHẦN GIỮ NGUYÊN --- */
.la-hero-v2 {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.la-img-v2 {
    width: 100%;
    height: auto;
    display: block;
}

/* Định vị form Desktop */
.la-form-overlay-v2 {
    position: absolute;
    top: 42%;
    right: 16%;
    width: 16%;
    z-index: 10;
}

/* Ẩn ảnh mobile trên desktop */
.la-mobile-only { display: none; }
.la-desktop-only { display: block; }

/* Style chung cho input (Giữ nguyên của bạn) */
.la-field-v2 { margin-bottom: 8px; }
.la-field-v2 input, .la-field-v2 select {
    width: 100%;
    height: 38px;
    border-radius: 33.5px;
    border: 2px solid #FFFFFF;
    background-color: #EFEFEF;
    padding: 0 20px;
    font-size: 18px;
    font-family: 'Geomanist', sans-serif;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    color: #898989;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

/* Nút bấm Đăng ký ngay */
.la-submit-wrap-v2 {
    text-align: center; /* Quan trọng: Căn giữa nội dung bên trong */
    margin-top: 15px;   /* Tăng khoảng cách một chút cho thoáng */
    width: 100%;        /* Đảm bảo khung bọc nút chiếm hết chiều rộng form */
}

.la-submit-wrap-v2 input[type="submit"] {
    font-family: 'Geomanist', var(--font-body);
    background: linear-gradient(90deg, #451180 0%, #710DAC 100%);
    color: #fff;
    padding: 3px 25px 0px; /* Điều chỉnh lại padding cho cân đối */
    border-radius: 50px;
    border: 2px solid #FFFFFF;
    font-size: 20px;
    font-weight: 400;
    cursor: pointer;
    
    /* Chỉnh lại độ rộng nút */
    width: auto;         /* Để nút co giãn theo chữ hoặc set % cố định */
    min-width: 80%;      /* Đảm bảo nút đủ lớn và nổi bật */
    
    text-transform: uppercase;
    display: inline-block; /* Quan trọng để text-align: center có tác dụng */
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
}

/* Hiệu ứng khi hover vào nút */
.la-submit-wrap-v2 input[type="submit"]:hover {
    transform: scale(1.05);
    filter: brightness(1.1);
}

/* --- TÙY CHỈNH CHO MOBILE (THAY ĐỔI TẠI ĐÂY) --- */
@media (max-width: 767px) {
    /* Ẩn ảnh desktop, hiện ảnh mobile */
    .la-desktop-only { display: none; }
    .la-mobile-only { display: block; }

    /* Đưa form nằm đè lên ảnh Mobile */
    .la-form-overlay-v2 {
        position: absolute; /* Chuyển về absolute để nằm lên ảnh */
        top: 60%; /* Chỉnh thông số này để khớp với vùng trống trên ảnh mobile của Vũ */
        left: 50%;
        transform: translateX(-50%); /* Căn giữa form */
        width: 85%; /* Form rộng hơn trên mobile */
        right: auto;
        padding: 0;
        background: transparent; /* Bỏ nền trắng để thấy ảnh phía sau */
    }

    .la-field-v2 input, 
    .la-field-v2 select {
        height: 40px; /* Tăng nhẹ để dễ bấm trên mobile */
        font-size: 16px;
    }

    .la-submit-wrap-v2 input[type="submit"] {
        width: 100%;
        font-size: 18px;
    }
}
.sec-2-khumoi-nn {
	margin-top:-20px;
	margin-bottom:-30px;
}
/***********************************/
.sec-banner-moi-tham-full {
    width: 100vw;
    height: 90vh;
    min-height: 750px;
    margin-left: calc(-50vw + 50%);
    background-image: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/banner-2.png');
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start; /* Ép toàn bộ khối nội dung về bên trái */
    font-family: 'Geomanist', sans-serif;
    overflow: hidden;
}

.banner-inner-container {
    width: 100%;
    /* Bỏ max-width hoặc để rất rộng để nội dung tự do trôi về trái */
    max-width: 1600px; 
    margin: 0; /* Bỏ margin auto để không căn giữa */
    padding-left: 110px; /* Chỉ để lại một khoảng đệm nhỏ sát mép màn hình */
	padding-top:100px;
}

.banner-text-box {
    max-width: 800px; /* Giới hạn độ rộng của khối chữ để không chạm vào mặt cô gái */
    text-align: left;
}

/* --- Typography & Hiệu ứng lồng ghép giữ nguyên --- */
.title-group h2 {
	background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
	font-weight:400;
    line-height: 60px; /* Thu hẹp dòng để chữ lồng nhau đẹp hơn */
    margin: 0;
	margin-bottom:-10px;
}

.text-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px; /* Tăng nhẹ kích thước chữ nghệ thuật */
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    margin-left: -38px;
}
.banner-text-box .title-line:nth-child(2) {
	margin-left:20px;
} 

.banner-text-box .title-group {
	    margin-left: 94px;
    margin-top: 40px;
}
.banner-text-box .title-line:nth-child(3) {
	margin-left:120px;
} 

.sub-question {
    font-size: 32px;
    color: #710DAC;
    margin: 20px 0 40px 0;
}

/* --- Quy trình các bước --- */
.step-wrapper {
    display: flex;
   
    margin-bottom: 50px;
}

.step-item {
    flex: 1;
    text-align: center;
}

.step-img-box img {
  width: 200px;
    height: 189px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 10px;
}
.step-item .text-step-1 {
	font-family: 'Geomanist', var(--font-body);
	font-size: 18px;
	font-weight:400;
	line-height:22px;
	color:#000;
}
/* --- Câu hỏi cuối (#710DAC) --- */
.bottom-question .q-line-1 { font-size: 30px; color: #710DAC; margin: 0; }
.bottom-question .q-line-2 { font-size: 30px; font-weight: 500; color: #710DAC; margin-top: 5px;margin-left:140px }

/* Responsive cho Tablet & Mobile */
@media (max-width: 1024px) {
    .banner-inner-container { padding-left: 40px; }
    .banner-text-box { max-width: 600px; }
}

/* Responsive cho Tablet & Mobile */
@media (max-width: 1024px) {
    .banner-inner-container { padding-left: 40px; }
    .banner-text-box { max-width: 600px; }
}

/* --- MOBILE & TABLET STYLE --- */
@media (max-width: 768px) {
    .sec-banner-moi-tham-full { 
        background-image: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/sec-2-banner.png');
        background-position: center top; 
        height: auto;
        padding: 50px 0 0px;
        min-height: unset;
    }

    .banner-inner-container { padding: 0 15px; }
    .banner-text-box { max-width: 100%; text-align: left; }

    /* Reset Margins tiêu đề trên mobile */
    .banner-text-box .title-group,
    .banner-text-box .title-line:nth-child(2),
    .banner-text-box .title-line:nth-child(3) { margin-left: 0; }

    .title-group .title-step-1  { font-size: 55px; line-height: 60px; }
	 .title-group .title-step-2{ font-size: 55px; line-height: 60px; margin-left: 27px!important; }
	.title-group .title-step-2{ font-size: 55px; line-height: 60px; margin-left: 40px!important; }
    .text-art { font-size: 100px; }
    .sub-question { font-size: 22px; }

    /* Grid 2 cột & Đảo vị trí 3-4 */
    .step-wrapper { 
        flex-wrap: wrap;  
        justify-content: center;
    }

    .step-item { width: 48%; flex: none; }
    
    /* Đảo vị trí: 1-2 trên, 4-3 dưới (3 nằm phải 4) */
    .step-item:nth-child(1) { order: 1; }
    .step-item:nth-child(2) { order: 2; }
    .step-item:nth-child(3) { order: 4; } /* Bước 3 sang phải hàng 2 */
    .step-item:nth-child(4) { order: 3; } /* Bước 4 sang trái hàng 2 */

    /* Thay ảnh Step Mobile */
    .step-item:nth-child(1) .step-img-box img { content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/step-1-mobile-new.png'); }
    .step-item:nth-child(2) .step-img-box img { content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/step-2-mobile-new.png'); }
    .step-item:nth-child(3) .step-img-box img { content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/step-3-mobile-new.png'); }
    .step-item:nth-child(4) .step-img-box img { content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/step-4-mobile-new.png'); }
	.step-item:nth-child(1) .step-img-box::after {
    content: "";
        position: absolute;
        inset: 0;
        background: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/arrow-1.png) center / contain no-repeat;
        z-index: 2;
        pointer-events: none;
        width: 84px;
        left: 38%;
        top: -11%;
}
	.step-item:nth-child(3) .step-img-box::after { 
		content: "";
	 position: absolute;
		inset: 0;
        background: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/arrow-2.png) center / contain no-repeat;
        z-index: 2;
        pointer-events: none;
        width: 84px;
        left: 60%;
        top: 25%;
	}
	.step-item:nth-child(4) .step-img-box::after { 
		content: "";
	 position: absolute;
		inset: 0;
        background: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/arrow-3.png) center / contain no-repeat;
        z-index: 2;
        pointer-events: none;
        width: 84px;
               left: 38%;
        top: 39%;
	}

    .step-img-box img { width: 160px; height: 160px; }
    .text-step-1 { 
		font-size: 17px !important;
        line-height: 1.4 !important;
        padding: 0.4rem 1.1rem 0.5rem 1.8rem;
	}

    .bottom-question .q-line-2 { margin-left: 75px;  font-size: 25px!important; line-height: 30px;}
	.bottom-question .q-line-1 {  font-size: 25px!important;line-height: 30px; margin-bottom:-5px;}
}
/************************************/
/* ==========================================================================
   SECTION 3: HEADER (TIÊU ĐỀ 3 GIẢI PHÁP)
   ========================================================================== */
.sec-3-khumoi-mn-header {
    width: 100%;
    padding: 50px 0;
    display: flex;
    justify-content: center;
    background-color: transparent;
}

.sec-3-khumoi-mn-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.sec-3-khumoi-mn-content-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.sec-3-khumoi-mn-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    line-height: 1.1;
}

.sec-3-khumoi-mn-left {
    display: flex;
    align-items: center;
    position: relative;
}

.sec-3-khumoi-mn-number {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 100px;
    font-weight: 400;
    margin-right: -10px;
}

.sec-3-khumoi-mn-art-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px 10px;
    margin-top: -32px;
}

.sec-3-khumoi-mn-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 60px;
    font-weight: 400;
    padding: 5px 10px;
    margin: -33px -5px;
}

.sec-3-khumoi-mn-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: -20px;
}

.sec-3-khumoi-mn-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
    margin: 0;
    white-space: nowrap;
}

.sec-3-khumoi-mn-sub {
    font-family: 'Geomanist', sans-serif;
    font-size: 30px;
    font-weight: 400;
    margin: 0;
    letter-spacing: 0.5px;
    margin-left: 10px;
}

/* ==========================================================================
   PHẦN BỔ SUNG: RESPONSIVE MOBILE (768PX)
   ========================================================================== */
@media (max-width: 1024px) {
    .sec-3-khumoi-mn-number { font-size: 80px; }
    .sec-3-khumoi-mn-art { font-size: 45px; }
    .sec-3-khumoi-mn-title { font-size: 40px; }
    .sec-3-khumoi-mn-sub { font-size: 22px; }
}

@media (max-width: 768px) {
	.sec-3-khumoi-mn-header {
		    padding: 0px 0 70px;
	}
    /* 1. Chỉnh tiêu đề nằm ngang và thu nhỏ font */
    .sec-3-khumoi-mn-content-flex {
        flex-direction: row; /* Ép nằm hàng ngang thay vì dọc */
        gap: 2px;
        align-items: flex-end;
    }
	
    .sec-3-khumoi-mn-number { font-size: 70px; margin-right: -5px; }
    .sec-3-khumoi-mn-art { font-size: 50px; margin: -29px 0; }
    .sec-3-khumoi-mn-art-box { margin-top: -20px; padding: 1px 5px;}
    .sec-3-khumoi-mn-box-info {
		bottom: 0px!important;
	}
	.sec-3-khumoi-mn-box-btn {
		padding: 3px 35px 0px;
	}
    .sec-3-khumoi-mn-right { margin-left: 0; align-items: flex-start; padding-bottom: 15px;}
    .sec-3-khumoi-mn-title { font-size: 40px; }
    .sec-3-khumoi-mn-sub { font-size: 20px; margin-left: 0; }

    /* 2. Thay 3 ảnh Giải Pháp sang bản Mobile bằng CSS */
    /* Vũ lưu ý: code này áp dụng nếu cấu trúc card của bạn có thẻ img */
    .sec-3-khumoi-mn-box-item:nth-child(1) .sec-3-khumoi-mn-box-card img { 
        content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/giai-phap-1-mobile.png'); 
    }
    .sec-3-khumoi-mn-box-item:nth-child(2) .sec-3-khumoi-mn-box-card img { 
        content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/giai-phap-2-mobile.png'); 
    }
    .sec-3-khumoi-mn-box-item:nth-child(3) .sec-3-khumoi-mn-box-card img { 
        content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/giai-phap-3-mobile.png'); 
    }

    /* 3. Căn chỉnh Text Box nằm trên ảnh Mobile gọn hơn */
    .sec-3-khumoi-mn-box-container {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .sec-3-khumoi-mn-box-card {
        height: auto;
        min-height: 400px;
    }

    
}
/******************************************************/
/* TỔNG QUAN CONTAINER */
.sec-3-khumoi-mn-box-wrapper {
    width: 100%;
    max-width: 1400px;
    margin: -60px auto;
    padding: 0 20px;
    font-family: 'Geomanist', sans-serif;
}

.sec-3-khumoi-mn-box-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.sec-3-khumoi-mn-box-item {
    display: flex;
    flex-direction: column;
    align-items: center; /* Để nút nằm giữa card */
}

/* CARD CHỨA ẢNH VÀ TEXT */
.sec-3-khumoi-mn-box-card {
    position: relative;
    width: 100%;
    border-radius: 25px;
    overflow: hidden;
    aspect-ratio: 4 / 5;
}

.sec-3-khumoi-mn-box-card img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* KHỐI TEXT NẰM TRÊN ẢNH */
.sec-3-khumoi-mn-box-info {
    position: absolute;
    bottom: 18px;
    left: 0;
    width: 100%;
    padding: 20px 15px 40px 15px; /* Padding dưới cao để trừ chỗ cho nút */
    text-align: left;
}

.sec-3-khumoi-mn-box-title {
    font-size: 26px;
    font-weight: 600;
    color: #710DAC;
    margin: 0  auto;
}

.sec-3-khumoi-mn-box-des {
    font-size: 18px;
    font-weight: 400;
    color: #1E1E1E;
    line-height: 1.4;
    margin: 0;
}

/* NÚT BẤM (BUTTON) */
.sec-3-khumoi-mn-box-btn {
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff;
       padding: 5px 35px 0px;
    border-radius: 50px;
    font-size: 20px;
    font-weight: 400;
    text-decoration: none;
	border:2px solid #fff;
    margin-top: -20px; /* Kéo nút đè lên ảnh */
    z-index: 10;
   box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
}

/* HIỆU ỨNG NHỊP ĐẬP (PULSE) ĐÃ KIỂM TRA */
@keyframes pulse-purple {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(113, 13, 172, 0.4); }
    70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(113, 13, 172, 0); }
    100% { transform: scale(0.95); }
}

.btn--pulse {
    animation: pulse-purple 1.5s infinite;
}

.sec-3-khumoi-mn-box-btn:hover {
    transform: translateY(-3px) scale(1.05);
    filter: brightness(1.1);
}

/* RESPONSIVE */
@media (max-width: 1024px) {
    .sec-3-khumoi-mn-box-container { grid-template-columns: repeat(2, 1fr); }
    .sec-3-khumoi-mn-box-title { font-size: 24px; }
}

@media (max-width: 768px) {
    .sec-3-khumoi-mn-box-container { grid-template-columns: 1fr; }
    .sec-3-khumoi-mn-box-title { font-size: 22px; }
    .sec-3-khumoi-mn-box-des { font-size: 19px; }
}

/****************************/

/* TỔNG QUAN CONTAINER */
.sec-4-title-khumoi-mm-wrapper {
    width: 100%;
    padding: 60px 20px 40px 20px;
    text-align: center; /* Căn giữa tiêu đề */
    background-color: transparent;
}

.sec-4-title-khumoi-mm-container {
    max-width: 1400px;
    margin: 0 auto;
}

/* GRADIENT CHUẨN (#B915D2 -> #3D037D) */
.sec-4-title-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}

/* STYLE TIÊU ĐỀ CHÍNH */
.sec-4-title-khumoi-mm {
    font-family: 'IvyPrestoDisplay', serif; /* DFVN IvyPresto Display */
    font-size: 55px;
    font-weight: 400; /* Regular */
    margin: 0;
    line-height: 1.2;
    letter-spacing: 0.5px;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 1024px) {
    .sec-4-title-khumoi-mm {
        font-size: 45px;
    }
}

@media (max-width: 768px) {
    .sec-4-title-khumoi-mm {
        font-size: 45px;
        line-height: 1.3;
    }
    .sec-4-title-khumoi-mm-wrapper {
        padding: 40px 15px 30px 15px;
    }
}

.coca-image-compare-horizontal .coca-image-compare-after-label:before, .coca-image-compare-horizontal .coca-image-compare-before-label:before {
    margin-top: calc(var(--coca-image-compare-overlay-label-height) * -1 / 2);
    top: 96% !important;
    padding: .2rem 1.4rem 0rem 1.4rem;
    background: linear-gradient(180deg, #ffffff75, #ffffffc2);
    border-radius: 27px;
    border: 2px solid #fff;
    backdrop-filter: blur(10px);
    font-family: 'Geomanist' !important;
    font-size: 19px;
    text-transform: uppercase;
    line-height: 1;
}

/* CONTAINER THẺ (CARD) */
.sec-4-khu-moi-mm-card {
  margin-top: -20px;
    /* margin-left: -17px; */
    background-color: #ffffff;
    border-left: 2px solid #8A38F5;
    border-bottom: 2px solid #8A38F5;
    border-right: 2px solid #8A38F5;
    border-radius: 20px;
    padding: 40px 10px 30px;
    max-width: 400px;
    box-shadow: 0 5px 15px rgba(113, 13, 172, 0.05);
    font-family: 'Geomanist', sans-serif;
}

/* TIÊU ĐỀ (28px - Color #710DAC) */
.sec-4-khu-moi-mm-title {
    font-size: 28px;
    font-weight: 700;
    color: #710DAC;
    margin: 0 0 20px 0;
    line-height: 1.2;
}

/* DANH SÁCH (18px - Color #1E1E1E) */
.sec-4-khu-moi-mm-list {
    list-style: none; /* Tắt bullet mặc định của trình duyệt */
    padding: 0;
    margin: 0;
}

.sec-4-khu-moi-mm-list li {
    font-size: 18px;
    color: #1E1E1E;
    line-height: 1.0;
    position: relative;
    padding-left: 25px; /* Khoảng trống cho dấu chấm tím */
    margin-bottom: 12px;
}

.sec-4-khu-moi-mm-list li:last-child {
    margin-bottom: 0;
}

/* TẠO DẤU CHẤM TRÒN MÀU TÍM */
.sec-4-khu-moi-mm-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px; /* Căn chỉnh dấu chấm nằm giữa dòng chữ đầu tiên */
    width: 8px;
    height: 8px;
    background-color: #710DAC;
    border-radius: 50%;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
    .sec-4-khu-moi-mm-card {
        padding: 20px;
    }
    .sec-4-khu-moi-mm-title {
        font-size: 24px;
		padding-top: 1rem;
    }
    .sec-4-khu-moi-mm-list li {
        font-size: 16px;
		line-height: 1.2;
    }
}
.mobile-break {
    display: none;
}

@media (max-width: 768px) {
    .mobile-break {
        display: block;
    }
}

/************************************************************************************************************************************************/
/**** Hiệu ứng hộp quà *****/
/* --- 1. Nút bấm kích hoạt (Trigger) --- */
.gift-trigger-container {
    display: flex; 
    align-items: center;
    justify-content: center;
    gap: 20px;
    cursor: pointer;
    max-width: 900px; 
    margin: 0 auto;
}
.gift-trigger-main {
   display: flex;
    flex-direction: column;
    align-items: center;
    background-image: url(https://linhanhpremium.vn/wp-content/uploads/2025/10/hqua-trans.webp);
    background-repeat: no-repeat;
    background-size: cover;
    justify-content: center;
    height: 258px;
    width: 33%;
    padding: 20px 40px;
    text-align: center;
}
.gift-trigger-main {
        font-size: 33px;
    font-family: 'Geomanist';
    font-weight: 500;
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    padding-top: 4rem;
    line-height: 1.2;
}
.arrow-text {
    font-size: 24px;
     background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    text-align: center;
    font-family: 'Geomanist';
	display: flex;
    flex-direction: column;
    align-items: center;
}
.gift-trigger-container .arrow-img {
    width: 77%;
}
.offer-triger-container {
    display: flex;
    justify-content: space-between;
    width: 80%;
	margin: 0 auto;
	align-items: center;
}
.offer-triger-container .offer-content {
	display: flex;
    align-items: flex-end;
    position: relative;
    bottom: -69px;
    left: -65px;
}
.offer-content .content-box {
	text-align: center;
	display: flex;
    flex-direction: column;
    align-items: center;
}
.offer-content .content-box p {
    font-family: 'SVNFamous' !important;
    font-size: 31px;
    color: #BF934E;
    margin-bottom: 7px;
    line-height: 1.1;
	padding: 0 2.5rem 0 2.5rem;
}
.offer-triger-container .offer-promo {
    padding: 0 2.8rem;
}
.offer-promo p {
    margin-bottom: 0;
    position: absolute;
    left: 22%;
    top: 243px;
}
.content-box .promo-box--img {
	width: 90%;
}
.promo-img.enter-from-left {
	bottom: -40px;
    position: relative;
    width: 115%;
    left: 86px;
}
.content-box .img-box-1 {
	       transform: translate(10px, 92px);
}
.offer-promo .promo_btn {
    font-family: 'Geomanist' !important;
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff;
    border-radius: 50px;
    font-size: 20px;
    font-weight: 400;
    text-decoration: none;
    border: 2px solid #fff;
    z-index: 10;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
    padding: 0.6rem 2rem;
}
.offer-gift-box {
    position: absolute;
}
.offer-gift-box .box-gift {
	position: relative;
}
.offer-gift-box .gift--left {
	    width: 30%;
    right: -74px;
    top: -191px;
}
.offer-gift-box .gift--right {
    width: 30%;
    right: -900px;
    top: -339px;
}
.offer-triger-container.is-active {
    background-image: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/Group-212.png);
    background-size: cover;
	background-repeat: no-repeat;
	height: 368px;
}
/*********Chuyển động background kéo dãn***********************************/
.gift-trigger-main {
  position: relative;
  overflow: visible;
}
.gift-trigger-main > * { position: relative; z-index: 1; }

.gift-trigger-main::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(https://linhanhpremium.vn/wp-content/uploads/2025/10/hqua-trans.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  z-index: -1;
  opacity: 1;
  transform: scaleX(0.9);
  will-change: transform, opacity;
}

/* Khi bắt đầu click: nền dãn 2 bên + mờ dần */
#gift-trigger.is-leaving .gift-trigger-main::before {
  animation: bg-stretch-fade .8s ease-out forwards;
}
@keyframes bg-stretch-fade {
  50% { transform: scaleX(8.08); opacity: 1.8; }
  to  { transform: scaleX(.18); opacity: 0; }
}

.offer-triger-container {
  position: relative;
}
.offer-triger-container > * { position: relative; z-index: 1; }

.offer-triger-container::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  transform: scale(1.03);          
  will-change: opacity, transform;
}

.offer-triger-container.is-active::before {
  animation: offer-bg-fade-in .5s ease-in-out .02s forwards;;
}
@keyframes offer-bg-fade-in {
  from { opacity: 0; transform: scale(1.03); }
  to   { opacity: 1; transform: scale(1); }
}
/*******************************************/
/**** Chuyển động hộp quà ****/
/* ========== 0) Ẩn khối ưu đãi trước khi kích hoạt ========== */
.offer-triger-container,
.offer-gift-box {
display: none;
  pointer-events: none;
  transition: opacity .28s ease;
}
.offer-triger-container.is-active,
.offer-gift-box.is-active {
display: flex;
  pointer-events: auto;
}


/* ========== 1) Trigger rời đi đúng theo mô tả ========== */
/* Hai cụm 'Nhấn vào' bay ra 2 mép; Text trung tâm mờ dần */
#gift-trigger.is-leaving .arrow-text:first-of-type { /* bên trái */
  animation: arrow-out-left .9s ease forwards;
}
#gift-trigger.is-leaving .arrow-text:last-of-type {  /* bên phải */
  animation: arrow-out-right .9s ease forwards;
}
#gift-trigger.is-leaving .gift-trigger-main {
  animation: title-fade .9s ease .02s forwards;
}

@keyframes arrow-out-left {
  to { transform: translateX(-40vw); opacity: 0; }
}
@keyframes arrow-out-right {
  to { transform: translateX(40vw); opacity: 0; }
}
@keyframes title-fade {
  to { opacity: 0; transform: scale(.98); }
}

/* ========== 2) Khối ưu đãi xuất hiện theo hướng ========== */
/* Trạng thái khởi tạo (chưa kích hoạt) */
.offer-promo .promo-img,
.offer-promo .promo_btn,
.offer-content {
  will-change: transform, opacity;
  opacity: 0;
}

/* promo-img: từ TRÁI -> 0 */
.offer-promo .promo-img.enter-from-left {
  animation: slide-in-left .55s cubic-bezier(.22,.61,.36,1) .08s forwards;
}
@keyframes slide-in-left {
  from { transform: translateX(-44vw); opacity: 0; }
  to   { transform: translateX(0);     opacity: 1; }
}

/* promo_btn & offer-content: từ DƯỚI -> 0 (nhẹ stagger nhờ delay khác nhau) */
.offer-promo .promo_btn.enter-from-bottom {
  animation: rise-up .8s cubic-bezier(.22,.61,.36,1) .55s forwards;
}
.offer-content.enter-from-bottom {
  animation: rise-up .8s cubic-bezier(.22,.61,.36,1) .55s forwards;
}
@keyframes rise-up {
  from { transform: translateY(16vh); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

/* ========== 3) Hộp quà: trái từ dưới lên, phải từ trên xuống ========== */
.offer-gift-box .box-gift { opacity: 0; }

.offer-gift-box.is-active .gift--left.gift-up {
  animation: gift-up .8s ease-out .55s forwards;
}
.offer-gift-box.is-active .gift--right.gift-down {
  animation: gift-down .8s ease-out .55s forwards;
}
@keyframes gift-up   { from { transform: translateY(28px);  opacity:0; } to { transform: translateY(0);   opacity:1; } }
@keyframes gift-down { from { transform: translateY(-28px); opacity:0; } to { transform: translateY(0);   opacity:1; } }

/* ========== 4) Tối ưu nhẹ cho mobile ========== */
@media (max-width: 768px) {
  .gift-trigger-main span { font-size: 32px; }
  @keyframes slide-in-left { from { transform: translateX(-70vw); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
  @keyframes rise-up       { from { transform: translateY(22vh);  opacity: 0; } to { transform: translateY(0); opacity: 1; } }
}

/* (tuỳ chọn) tôn trọng reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/************************/
/*** Chuyển động phục hồi thể tích ****/
.rl_tt-card {
  position: relative; 
  width: 600px;
  height: 150px;
  border-radius: 12px;
  overflow: hidden; 
  cursor: pointer;
  border: 1px solid #fff;
	margin-bottom: 20px;
 background: linear-gradient(180deg, #ffffff75, #ffffffc2);
  backdrop-filter: blur(10px);
}
.tt_card-image {
  position: absolute; 
  top: 0;
  left: 0;
  width: 100%; 
  height: 100%;
  object-fit: cover;
	padding: 0.8rem;
	border-radius: 28px;
  transition: width 0.6s ease-in-out; 
}
.tt_card-content {
  position: absolute; 
  top: 0;
  right: 0;
  width: 65%; 
  height: 100%;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;	

  /* Ban đầu, ẩn nội dung đi */
  opacity: 0;
  transform: translateX(30px); 
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
  transition-delay: 0.1s; 
}
.tt_card-content p {
  margin: 0;
  font-size: 14px;
  color: #000;
  line-height: 1.5;
 font-family: 'Geomanist' !important;
	font-size: 15pt;
	line-height: 1.2;
}
.rl_tt-card:hover .tt_card-image {
  width: 35%; 
}
.rl_tt-card:hover .tt_card-content {
  opacity: 1; 
  transform: translateX(0); 
}
/** Chuyển động dấu hiệu thời gian **/
.tl-pr-title {
	font-size: 24px;
    color: #ba9452 !important;
    text-transform: uppercase;
    font-weight: 100;
    margin-bottom: 0;
	padding-top: 15px;
}

    .rl_card-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 24px;
        justify-content: center;
        margin-top: 40px;
    }

    /* --- Thẻ Hiệu ứng --- */
    .rl_effect-card {
        position: relative;
        width: 327px;
        height: 380px;
        overflow: hidden;
        padding: 24px;
    }

    /* --- Hình ảnh --- */
    .rl_card-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 81%;
        object-fit: cover;
        z-index: 1;
        transform: translateY(-100%);
        transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    /* --- Container nội dung --- */
    .rl_card-content {
        position: relative;
        z-index: 2;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }

    /* --- Nội dung trên (Tiêu đề + Nút) --- */
    .rl_content-top {
        text-align: center;
        transition: opacity 0.4s ease, transform 0.4s ease;
        box-shadow: 2px 3px 8px 2px rgb(209 209 209);
        border-radius: 20px;
        padding: 1rem 2rem;
		height: 112px;
		border: 1px solid #fff;
    	backdrop-filter: blur(10px);
        background: rgb(255 255 255 / 52%);
    }

    .rl_content-top h3 {
        font-size: 18px;
        color: #b99a6a;
        font-weight: 600;
        margin-top: 10px;
        margin-bottom: 20px;
        text-transform: uppercase;
    }

    .rl_content-top .rl_btn {
        display: inline-block;
        padding: 4px 27px;
        text-decoration: none;
        color: #fff;
        border-radius: 50px;
        font-size: 17px;
        font-weight: 100;
        background: #BF934E;
        cursor: pointer;
		font-family: 'Geomanist';
		text-transform: uppercase;
        transition: background-color 0.3s;
		position: relative;
		bottom: -19px;
    }

    .rl_content-top .rl_btn:hover {
        background-color: #f7f7f7;
		color: #b99a6a;
    }
    /* --- 6. PHẦN MÔ TẢ --- */
    .rl_description-wrapper {
        position: relative;
        text-align: center;
        font-size: 16px;
        line-height: 1.5;
    }

    .rl_description-initial {
        color: #77777757;
        font-weight: 100;
        margin: 0;
		font-size: 25px;
		font-family: 'Geomanist' !important;
        transition: opacity 0.2s ease;
    }

    .rl_description-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        margin: 0;
        color: #ba9452;
        font-weight: 600;
        opacity: 0;
        transform: translateY(0);
        transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    opacity 0.4s ease 0.1s;
    }

    /* --- 7. Trạng thái ACTIVE --- */
    .rl_effect-card.rl_is-active {
        overflow: visible;
    }

    .rl_effect-card.rl_is-active .rl_card-image {
        transform: translateY(106px);
    }

    .rl_effect-card.rl_is-active .rl_content-top {
        opacity: 0;
        transform: translateY(-20px);
        pointer-events: none;
    }

    .rl_effect-card.rl_is-active .rl_description-initial {
        opacity: 0;
    }

    .rl_effect-card.rl_is-active .rl_description-overlay {
	opacity: 1;
    transform: translateY(-275px);
	backdrop-filter: blur(10px);	
    transition: transform 0.6s 
cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s 
ease 0.2s;
    box-shadow: inset 1px 3px 20px -1px rgb(255 255 255);
    border: 1px solid #fff;
    border-radius: 20px;
    padding: 1.3rem 2.6rem;
    background: rgb(255 255 255 / 52%);
    font-size: 22px;
    font-family: 'Geomanist' !important;
    font-weight: 300;
	height: 180px;
	display: flex;
    align-items: center;
    }
/*****/
 /* General Container */
        .sec-4-khu-moi-gift-banner {
            width: 100%;
            background-color: #333;
            padding: 40px 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
        }

        /* Banner Box */
        .sec-4-khu-moi-gift-content {
            background: linear-gradient(180deg, #E5E5E5 0%, #CCCCCC 100%);
            border-radius: 20px;
            padding: 30px;
            width: 90%;
            max-width: 1200px;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-direction: row;
        }

        /* Left Section: Text */
        .sec-4-khu-moi-gift-left-section {
            flex: 1;
            text-align: left;
        }

        .sec-4-khu-moi-gift-left-section h1 {
            font-family: 'Geomanist', sans-serif;
            font-size: 40px;
            color: #710DAC;
        }

        .sec-4-khu-moi-gift-left-section .subtext {
            font-family: 'Geomanist', sans-serif;
            font-size: 20px;
            color: #fff;
        }

        .sec-4-khu-moi-gift-left-section .cta-button {
            background-color: #710DAC;
            color: #fff;
            font-size: 20px;
            padding: 12px 30px;
            text-decoration: none;
            border-radius: 50px;
            display: inline-block;
            margin-top: 20px;
        }

        .sec-4-khu-moi-gift-left-section .cta-button:hover {
            background-color: #8B1B8C;
        }

        /* Right Section: Images */
        .sec-4-khu-moi-gift-right-section {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

        .sec-4-khu-moi-gift-right-section img {
            width: 100px;
            margin: 10px 0;
        }

        /* Gift Boxes (Positioning the Gifts) */
        .sec-4-khu-moi-gift-gift-boxes {
            position: absolute;
            top: -20px;
            right: 20px;
            display: flex;
            gap: 10px;
        }

        .sec-4-khu-moi-gift-gift-box {
            width: 50px;
            height: 50px;
            background-size: cover;
        }

        .sec-4-khu-moi-gift-gift-box-left {
            width: 50px;
            height: 50px;
            background: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/3d-render-gift-box-with-ribbon-present-packagea-1.png') no-repeat center;
        }

        .sec-4-khu-moi-gift-gift-box-right {
            width: 50px;
            height: 50px;
            background: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/3d-render-gift-box-with-ribbon-present-packagea-2.png') no-repeat center;
        }

        /* Text Background Image */
        .sec-4-khu-moi-gift-text-background {
            background: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/text.png') no-repeat center;
            background-size: cover;
            height: 80px;
            margin: 30px 0;
        }
/*****************************************************************/

/* CONTAINER TỔNG */
.sec-10k-khach-hang-wrapper {
    width: 100%;
    padding: 30px 20px;
    text-align: center;
    background-color: transparent;
}

.sec-10k-khach-hang-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* GRADIENT CHỦ ĐẠO (#B915D2 -> #3D037D) */
.sec-10k-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
}

/* HÀNG 1: BỐ CỤC LỒNG GHÉP */
.sec-10k-row-1 {
    display: flex;
    align-items: baseline;
    justify-content: center;
    margin-bottom: -10px; /* Kéo hàng 2 sát lên hàng 1 */
}

/* Số 10.000+ (IvyPresto Display 55px) */
.sec-10k-number {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
}

/* Chữ khách hàng tin chọn (UTM Edwardian 80px) */
.sec-10k-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: 400;
	line-height: 100px;
    margin-left: 15px; /* Khoảng cách nhỏ với con số */
}

/* HÀNG 2: TIÊU ĐỀ PHỤ */
.sec-10k-row-2 {
    margin-top: 0;
}

/* Khử thâm môi tại Linh Anh (IvyPresto Display 45px) */
.sec-10k-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400;
    margin: 0;
	margin-top: 17px;
    letter-spacing: 0.5px;
}


@media (max-width: 768px) {
	/* Nhắm mục tiêu chính xác vào ảnh trong slide đầu tiên của slider */
    .sec-10-phun-xam-mm-slider .sec-10-phun-xam-mm-item:first-child .sec-10-phun-xam-mm-award-row img {
        content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/huan-chuong-mobile.png');
        
        /* Căn chỉnh lại để ảnh hiển thị chuẩn trên màn hình đứng */
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    .sec-10k-row-1 {
        flex-direction: column;
        align-items: baseline;
    }
    .sec-10k-art {
        margin-left: 0;
        margin-top: -10px;
    }
	.sec-10k-row-1 {
		margin-bottom: -25px;
	}
	.sec-10k-khach-hang-wrapper {
		padding: 100px 20px 0px;
	}
    .sec-10k-number { font-size: 60px;    margin-bottom: -50px; }
    .sec-10k-art { font-size: 55px; }
    .sec-10k-title { font-size: 28px; }
}

/************************************************/
/* TỔNG QUAN CONTAINER 1400PX */
.sec6-khumoi-mm .sec-slider-khu-moi-mn-wrapper {
    width: 100%;
    max-width: 1400px;
	margin-bottom:0px!important;
    margin: 10px auto;
    padding: 0 20px;
    font-family: 'Geomanist', sans-serif;
    overflow: hidden;
}

/* KHOẢNG CÁCH GIỮA CÁC SLIDE */
.sec6-khumoi-mm .v-slide-item {
    padding: 0 15px;
    outline: none !important;
}

.sec6-khumoi-mm .v-slide-card {
    background: transparent;
    overflow: visible; /* Để lộ border của textbox khi đè lên */
}

/* KHỐI ẢNH (TRƯỚC/SAU) */
.sec6-khumoi-mm .v-img-box {
    position: relative;
    width: 100%;
    aspect-ratio: 11 / 9;
    border-radius: 20px;
    overflow: hidden;
}

.sec6-khumoi-mm .v-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* NHÃN TRƯỚC/SAU */
.sec6-khumoi-mm .v-label {
    position: absolute;
    top: 15px;
    padding: 5px 15px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    border-radius: 5px;
}

.sec6-khumoi-mm .label-truoc { left: 15px; background: rgba(0, 0, 0, 0.5); }
.sec6-khumoi-mm .label-sau { right: 15px; background: rgba(185, 21, 210, 0.7); }

/* --- TEXT BOX CĂN GIỮA & THU NHỎ --- */
.sec6-khumoi-mm .v-text-box-container {
    display: flex;
    justify-content: center; /* Căn giữa khung text box theo chiều ngang */
    margin-top:10px; /* Kéo textbox đè lên ảnh tạo hiệu ứng hiện đại */
    position: relative;
    z-index: 2;
}

.sec6-khumoi-mm .v-text-box {
    width: 85%; /* Độ rộng nhỏ gọn hơn so với ảnh */
    background: #fff;
    padding: 15px 20px;
    text-align: left; /* Căn giữa nội dung chữ bên trong */
    border-radius: 0px 0px 15px 15px;
   border-left: 2px solid #8A38F5;
    border-bottom: 2px solid #8A38F5;
    border-right: 2px solid #8A38F5;
	margin-left: 0;
	margin-top: -10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}

.sec6-khumoi-mm .v-name {
	font-family: 'Geomanist', sans-serif;
    font-size: 28px;
    font-weight: 500;
    color: #710DAC;
    margin: 0 0 5px 0;
}

.sec6-khumoi-mm .v-des {
	font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    color: #1E1E1E;
    margin: 0;
    line-height: 20px;
}



.sec6-khumoi-mm .v-slick-2-col .slick-prev { left: -5px !important; }
.sec6-khumoi-mm .v-slick-2-col .slick-next { right: -5px !important; }

.sec6-khumoi-mm .v-slick-2-col .slick-arrow:before {
    font-size: 22px;
    color: #710DAC !important;
    opacity: 1;
}

/* Nút xem thêm mặc định ẩn trên PC */
.v-load-more-container {
    display: none;
    text-align: center;
    margin-top: 20px;
}

#v-load-more-btn {
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff;
    border: 2px solid #fff;
    padding: 5px 30px 0px;
    border-radius: 50px;
    font-family: 'Geomanist', sans-serif;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(113, 13, 172, 0.3);
}

@media (max-width: 768px) {
    /* Phá bỏ slider, chuyển thành cột */
    .v-slick-2-col.slick-initialized .slick-track {
        display: block !important;
        transform: none !important;
    }
    
    .sec6-khumoi-mm .v-slide-item {
        display: none; /* Mặc định ẩn hết trên mobile để JS xử lý hiện 3 cái đầu */
        width: 100% !important;
        margin-bottom: 30px;
        padding: 0;
    }

    /* Hiện 3 item đầu tiên */
    .sec6-khumoi-mm .v-slide-item:nth-child(1),
    .sec6-khumoi-mm .v-slide-item:nth-child(2),
    .sec6-khumoi-mm .v-slide-item:nth-child(3) {
        display: block;
    }

    /* Hiện nút xem thêm */
    .v-load-more-container {
        display: block;
    }

    /* Ẩn các nút mũi tên của slider trên mobile */
    .sec6-khumoi-mm .slick-arrow {
        display: none !important;
    }
}

/* ==========================================================================
   TỐI ƯU NÚT MŨI TÊN (BỎ BACKGROUND & BÓNG ĐỔ, TO RA)
   ========================================================================== */
.sec6-khumoi-mm .v-slick-2-col .slick-arrow {
    width: 60px !important;  /* Tăng đường kính nút lên 60px */
    height: 60px !important;
    
    /* BỎ BACKGROUND VÀ BÓNG ĐỔ */
    background: transparent !important; 
    box-shadow: none !important; 
    border: none !important; 
    
    z-index: 100; /* Đảm bảo nằm trên ảnh Before/After */
    
    /* CĂN GIỮA MŨI TÊN BÊN TRONG */
    display: flex !important;
    align-items: center;
    justify-content: center;
    
    transition: all 0.3s ease;
}

/* ĐỊNH VỊ NÚT SÁT MÉP SLIDER */
.sec6-khumoi-mm .v-slick-2-col .slick-prev {
    left: -36px !important; /* Đẩy sát vào mép trái ảnh */
}

.sec6-khumoi-mm .v-slick-2-col .slick-next {
    right: -36px !important; /* Đẩy sát vào mép phải ảnh */
}

/* ==========================================================================
   THAY ĐỔI MÀU MŨI TÊN THEO FIGMA
   ========================================================================== */
.sec6-khumoi-mm .v-slick-2-col .slick-arrow:before {
    font-size: 30px; /* Tăng kích thước mũi tên bên trong */
    
    /* MÀU MŨI TÊN CHUẨN FIGMA */
    color: #710DAC !important; 
    
    opacity: 1; /* Hiển thị rõ nét */
    transition: all 0.3s ease;
}

/* ==========================================================================
   HIỆU ỨNG KHI HOVER (DI CHUỘT VÀO)
   ========================================================================== */
.sec6-khumoi-mm .v-slick-2-col .slick-arrow:hover:before {
    color: #A459D1 !important; /* Đổi màu mũi tên sang tím nhạt khi hover */
    transform: scale(1.1); /* Nhấc nhẹ mũi tên lên */
}
/*************************************************/

/* CONTAINER TỔNG */
.sec-7-title-khumoi-mm-wrapper {
    width: 100%;
    padding: 15px 20px;
    text-align: center;
    background-color: transparent;
}

.sec-7-title-khumoi-mm-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* GRADIENT CHỦ ĐẠO (#B915D2 -> #3D037D) */
.sec-7-title-khumoi-mm-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
}

/* HÀNG 1: BỐ CỤC LỒNG GHÉP */
.sec-7-title-khumoi-mm-row-1 {
    display: flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 5px;
}

/* Đội ngũ Master (IvyPresto Display 55px) */
.sec-7-title-khumoi-mm-text {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
	
}

/* vững chuyên môn (UTM Edwardian 80px) */
.sec-7-title-khumoi-mm-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: 400;
	    line-height: 100px;
    margin-left: 15px; /* Tạo khoảng cách nhẹ giữa 2 kiểu font */
}

/* HÀNG 2: TIÊU ĐỀ PHỤ */
.sec-7-title-khumoi-mm-row-2 {
    margin-top: 5px;
}

/* Am hiểu xu hướng thẩm mỹ (IvyPresto Display 45px) */
.sec-7-title-khumoi-mm-sub {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    font-weight: 400;
    margin: 0;
    letter-spacing: 0.3px;
	padding-top: 0.5rem;
	transform: translateY(-10px);
}



@media (max-width: 768px) {
	.sec-7-title-khumoi-mm-wrapper {
		    padding: 30px 0px;
	}
	.sec-7-title-khumoi-mm-row-1 {
   
    margin-bottom: -11px;
}
    .sec-7-title-khumoi-mm-row-1 {
        flex-direction: column;
        align-items: center;
    }
    .sec-7-title-khumoi-mm-art {
        margin-left: 0;
        margin-top: -14px;
    }
    .sec-7-title-khumoi-mm-text { font-size: 38px;         margin-bottom: -50px;}
    .sec-7-title-khumoi-mm-art { font-size: 55px; }
    .sec-7-title-khumoi-mm-sub { font-size: 28px; }
	.sec-7-khumoi-mn-box-btn {
		font-size: 15px!important;
		    padding: 2px 20px 2px!important;
		margin-top: -150px !important;
	}
	    
}

/* NÚT BẤM (BUTTON) */
.sec-7-khumoi-mn-box-btn {
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff7
    padding: 12px 35px;
    border-radius: 50px;
    font-size: 20px;
    font-weight: 400;
    text-decoration: none;
	border:2px solid #fff;
    margin-top: -200px!important; /* Kéo nút đè lên ảnh */
    z-index: 10;
   box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
}

/*****************************************/

/* TỔNG QUAN CONTAINER */
.sec-8-khumoi-new-mm-wrapper {
    width: 100%;
    padding: 50px 20px;
    text-align: left; /* Có thể đổi thành center nếu Vũ muốn căn giữa */
}

.sec-8-khumoi-new-mm-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0px;
}

/* HIỆU ỨNG GRADIENT TÍM CHUẨN (#B915D2 -> #3D037D) */
.sec-8-khumoi-new-mm-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    line-height: 1.1;
}

/* HÀNG 1: Geomanist 30px Regular */
.sec-8-khumoi-new-mm-line-1 {
    font-family: 'Geomanist', sans-serif;
    font-size: 30px;
    color: #3D037D;
    margin: 0;
}

/* HÀNG 2: UTM Edwardian 60px Regular */
.sec-8-khumoi-new-mm-line-2 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 60px;
    font-weight: 400;
       margin: -20px 0 10px;
}

/* HÀNG 3 & 4: IvyPresto Display 55px Regular */
.sec-8-khumoi-new-mm-line-3, 
.sec-8-khumoi-new-mm-line-4 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
    margin: 0;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
	.sec-8-khumoi-new-mm-wrapper {
		    margin-top: -75px; 
		padding:0px;
	}
    .sec-8-khumoi-new-mm-line-1 { font-size: 30px; }
    .sec-8-khumoi-new-mm-line-2 { font-size: 60px; }
    .sec-8-khumoi-new-mm-line-3, 
    .sec-8-khumoi-new-mm-line-4 { font-size: 50px; }
}

/************/
/* --- STYLE CHUNG & DESKTOP --- */
.sec9-khumoi-mmn-wrapper {
    width: 100%;
    padding: 30px 20px;
    text-align: center;
}

.sec9-khumoi-mmn-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.sec9-khumoi-mmn-gradient {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    line-height: 1;
}

/* Row Desktop */
.sec9-khumoi-mmn-row-top, .sec9-khumoi-mmn-row-main {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.sec9-khumoi-mmn-brand { font-family: 'Geomanist', sans-serif; font-size: 30px; color: #3D037D; text-transform: uppercase; }
.sec9-khumoi-mmn-number {  font-family: 'IvyPrestoDisplay', serif; font-size: 55px; padding: 20px; }
.sec9-khumoi-mmn-art {    font-family: 'UTM-Edwardian', cursive;
    font-size: 100px;
    font-weight: 400;
    padding: 13px 14px;
    margin-top: -30px;}

/* LOGIC ẨN HIỆN */
.d-none-mobile { display: block; }
.d-none-desktop { display: none; }
.sec-9-2  {
	    margin-left: 98px;
	margin-top: -19px;
}
.sec9-cl-2 {
	margin-left: -35px;
}
/* --- STYLE RIÊNG CHO MOBILE --- */
@media (max-width: 768px) {
    /* Ẩn hiện */
    .d-none-mobile { display: none !important; }
    .d-none-desktop { display: flex !important; flex-direction: column; align-items: center; }

    .sec9-khumoi-mmn-wrapper { padding: 75px 15px; }

    /* Hàng 1: Brand */
    .m-brand {
        font-family: 'Geomanist', sans-serif;
        font-size: 20px;
        color: #3D037D;
        text-transform: uppercase;
        
    }

    /* Hàng 2: Số */
    .m-number {
        font-family: 'IvyPrestoDisplay', serif;
        font-size: 42px;
        font-weight: 400;
                margin-bottom: -31px;
		line-height: 76px;
    }

    /* Hàng 3: Chữ nghệ thuật */
    .m-art-group {
        display: flex;
        flex-direction: row; /* Xếp chồng 2 chữ uy tín chất lượng */
        align-items: center;
        margin-top: -15px;
    }

    .m-art-group .sec9-khumoi-mmn-art {
        font-size: 52px;
        margin: 0 !important;
        line-height: 100px;
		padding:0 5px;
    }
	
}

/**********/
/* TỔNG QUAN CONTAINER */
.sec9-khu-moi-new-wrapper {
    width: 100%;
    padding: 60px 20px;
    background-color: transparent;
}

.sec9-khu-moi-new-container {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; /* Căn đều các phần tử */
    gap: 0px 20px; /* Khoảng cách: Dọc 25px, Ngang 20px */
	position:relative;
	top:-100px;
}

/* KHỐI ITEM */
.sec9-khu-moi-new-item {
    flex: 0 0 49%; /* Mỗi cột chiếm 48% chiều rộng */
    min-width: 320px; /* Đảm bảo không bị nhỏ quá trên các màn hình nhỏ */
}

/* Phần tử đặc biệt thứ 5 */
.sec9-khu-moi-new-item-special {
    flex: 0 0 48%; /* Đặt chiều rộng của phần tử thứ 5 nhỏ hơn */
    min-width: 320px; /* Đảm bảo không bị giãn quá mức */
    margin: 0 auto; /* Căn giữa phần tử thứ 5 */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* KHỐI HỘP */
.sec9-khu-moi-new-box {
    width: 100%;
    min-height: 140px; /* Tăng nhẹ độ cao để khung ảnh cân đối */
    background-image: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/Rectangle-2.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 45px;
    transition: all 0.3s ease;
}

.sec9-khu-moi-new-box:hover {
    transform: translateY(-5px);
    filter: brightness(1.1);
}

/* NỘI DUNG TEXT (Geomanist 25px #fff) */
.sec9-khu-moi-new-text {
    font-family: 'Geomanist', sans-serif;
    font-size: 25px;
    color: #ffffff;
    font-weight: 400;
    line-height: 1.3;
    text-align: center;
    margin: 0;
}

/* RESPONSIVE */
@media (max-width: 1100px) {
    .sec9-khu-moi-new-item {
        flex: 0 0 49%; /* Chuyển thành 2 cột trên màn hình trung bình */
		margin-top: -32px;
    }

    .sec9-khu-moi-new-item-special {
        flex: 0 0 100%;
		margin-top: -53px !important;
    }
}
/* RESPONSIVE */
@media (min-width: 1100px) {
   .sec-7-phun-xam-m-wrapper {
   
    margin-top: -159px;
   
}
}
@media (max-width: 768px) {
	.sec9-khu-moi-new-wrapper {
		padding: 0px 20px;
	}
    .sec9-khu-moi-new-item {
        flex: 0 0 100%; /* 1 cột trên mobile */
        min-width: unset;
    }
    .sec9-khu-moi-new-text {
        font-size: 18px;
    }
    .sec9-khu-moi-new-box {
        min-height: 110px;
        padding: 15px 30px;
    }
}
@media screen and (max-width:549px) { /***Mobile***/
	/* 1. THAY LINK ẢNH TEXT-3 SANG MOBILE */
    .offer-promo .promo-img img {
        content: url('https://test.thammylinhanh.com/wp-content/uploads/2026/04/text-3-mobile.png');
        width: 100%; /* Đảm bảo ảnh mobile tràn đều khung */
        left: 0 !important; /* Reset vị trí lệch của desktop */
    }
	.col-inner .tt--text {
		text-align: justify;
	}
	.col-inner .rl-quest--acd .accordion-inner {
    padding-top: 6.4rem;
    top: -74px;
	}
	.col-inner .rl-title-block .rl-title, .col-inner .tlsub--hq  {
		font-size: 45px;
	}
	.col-inner .rl-title-block .rl-sub, .col-inner .rl-title--hq  {
		font-size: 32px;
		margin-bottom: -3px;
	}
	.rl_effect-card.rl_is-active {
		margin-bottom: 60px;
	}
	.col-inner span.tlsub--hq {
		bottom: 0px;
	}
	.rl_content-top .tl-pr-title {
		font-size: 25px;
	}
	.rl-fbkh--col .rl-title {
		line-height: 1.1;
	}
	.rl-fbkh--col .rl-sub {
		margin-bottom: -3px !important;
	}
	.rl_card-grid .rl_effect-card.rl_is-active .rl_description-overlay {
    font-size: 21px;
    height: 103px;
	padding: 0.6rem 1.5rem;	
	}
	.rl_card-grid  .rl_effect-card.rl_is-active .rl_card-image {
    transform: translateY(34px);
	}
	.rl_tt-cards--col .col-inner {
	display: flex;
    flex-direction: column;
    align-items: center;
	}
	.col-inner .rl_tt-card {
  	width: 393px;
	}
	.rl_tt-card .tt_card-content p {
		font-size: 13pt;
	}
	.hp-text--block .hq-text--main {
		font-size: 22px;
	}
	.hp-text--block .hq-text--sub {
    font-size: 19px;
	}
	.rl-qtrinh--rowmb .rl-sub {
		margin-bottom: -6px;
	}
	.rl-qtrinh--rowmb .rl-title {
		line-height: 1.1;
		margin-bottom: 7px !important;
	}
	.rl-qtrinh-mob--block {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
	}
	.qtrinh-mob--step {
    flex: 0 0 calc(50% - 10px);
    text-align: center;
	}
	.qtrinh-mob--step p  {
		margin-top: 10px;
	}
	.qtrinh-mob--step p span {
		display: block;
		font-size: 15px;
		color: #000;
	}
	.step-mob--text {
		font-size: 17px;
		font-weight: 500;
	}
	.gift-trigger-main {
        font-size: 25px !important; 
    }
	#gift-trigger .gift-trigger-main {
            height: 233px;
    width: 150%;
    padding: 12px 22px;
	}
	#gift-trigger .arrow-text {
		font-size: 18px;
	}
	.offer-triger-container.is-active {
		width: 100%;
	}
	.offer-triger-container.is-active, .offer-gift-box.is-active {
		display: block !important;
	}
	.offer-triger-container.is-active .offer-promo {
		padding: 0;
	}
	.offer-content .content-box p {
		padding: 1rem 1rem 0 1rem !important;
		font-size: 16px !important;
	}
	.offer-triger-container.is-active .offer-content {
		bottom: -76px;
    	left: -6px;
	}
	.offer-promo p {
            left: 20% !important;
        top: 325px !important;
	}
	.offer-promo .promo-img.enter-from-left {
    bottom: -71px ;
    width: 83% ;
    left: 27px;
	}
	.offer-triger-container.is-active {
    background-image: url(https://linhanhpremium.vn/wp-content/uploads/2025/10/hq-mob-rl.png) !important;
    height: 241px !important;
	}
	.col-inner .offer-gift-box .gift--left {
	          width: 29%;
        right: 21px;
        top: -53px;
        z-index: 5;
	}
	.col-inner .offer-gift-box .gift--right {
           width: 43%;
        right: -281px;
        top: -187px;
	}
	.content-box .img-box-1 {
    transform: translate(10px, 2px)!important;
}
	
	.sec6-khumoi-mm .v-name {
   
    font-size: 24px;
   
}
	.sec-sao-viet {
		margin-top:-200px;
	}
}

/*********************** PXTM **************************/

/* ==========================================================================
   SECTION 1: BANNER PXTM (3 Ô NGANG - NÚT XUỐNG HÀNG GIỮA)
   ========================================================================== */
/* --- GIỮ NGUYÊN CODE DESKTOP CỦA VŨ --- */
.sec-banner-pttm .sec1-banner-pxtm {
    position: relative;
    width: 100%;
    line-height: 0;
}

.sec-banner-pttm .sec1-banner-img {
    width: 100%;
    height: auto;
    display: block;
}

.sec-banner-pttm .sec1-form-overlay {
    position: absolute;
    bottom: 0px;
    left: 37%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1100px;
    z-index: 100;
}

.sec-banner-pttm .la-banner-form-v2 {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 15px;
    width: 100%;
}

.sec-banner-pttm .la-field-v2 {
    flex: 1;
    min-width: 200px;
}

.sec-banner-pttm .la-field-v2 input, .sec-banner-pttm .la-field-v2 select {
    width: 100%;
    height: 38px;
    border-radius: 33.5px;
    border: 2px solid #FFFFFF;
    background-color: #EFEFEF;
    padding: 0 20px;
    font-size: 18px;
    font-family: 'Geomanist', sans-serif;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    color: #898989;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.sec-banner-pttm .la-submit-wrap-v2 {
    flex: 0 0 100%;
    display: flex;
    justify-content: center;
    margin-top: -20px; 
}

.sec-banner-pttm .la-submit-wrap-v2 input[type="submit"] {
    width: auto;
    min-width: 280px;
    height: 50px;
    border-radius: 50px;
    background: linear-gradient(90deg, #451180 0%, #710DAC 100%);
    color: #fff;
    border: none;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0px 5px 15px rgba(113, 13, 172, 0.3);
    transition: all 0.3s ease;
}

.btn--pulse {
    animation: pulse-banner 2s infinite ease-in-out;
}

@keyframes pulse-banner {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

/* --- PHẦN BỔ SUNG CHO MOBILE (KHÔNG ẢNH HƯỞNG DESKTOP) --- */
.v-show-mb { display: none !important; }
.sec2-s-pxtm-nn {
	margin-top:-20px;
}
@media screen and (min-width:1024px) {
	.sec2-s-pxtm-nn {
		margin-bottom: -85px;
	}
}

@media (max-width: 768px) {
		.sec2-s-pxtm-nn {
		margin-bottom: -25px;
	}
	.v-title-head {
    font-weight: 400;
}
	    .v-uu-dai-grid {
        grid-template-columns: repeat(1, 1fr)!important;
        gap: 95px 33px!important;
    }
	
	.sec2-s-pxtm-nn .v-title-box {
		text-align:left;
		margin-bottom: -36px;
	}
	.sec2-s-pxtm-nn .v-art-text {
		margin-top: -50px;
		margin-left: 42px;
	}
	.sec-fb-google {
		padding: 0px 0;
	}
	.sec2-s-pxtm-nn .v-sub-title {
		font-size: 40px;
	}
	.sec2-s-pxtm-nn .v-main-title {
		font-size: 50px;
	}
    .v-hide-mb { display: none !important; }
    .v-show-mb { display: block !important; }

    .sec-banner-pttm .sec1-banner-pxtm {
        position: relative;
    }

    /* ĐỊNH VỊ FORM LÊN TRÊN ẢNH MOBILE */
    .sec-banner-pttm .sec1-form-overlay {
        position: absolute;
        bottom: -11%; /* Điều chỉnh % này để đẩy form lên đúng vị trí trên ảnh mobile */
        left: 50%;
        transform: translateX(-50%);
        width: 95%;
        max-width: 100%;
    }

    .sec-banner-pttm .la-banner-form-v2 {
        flex-direction: column; /* Chuyển thành hàng dọc cho mobile */
        gap: 10px;
    }

    .sec-banner-pttm .la-field-v2 {
        width: 100%;
        min-width: unset;
    }

    .sec-banner-pttm .la-field-v2 input, 
    .sec-banner-pttm .la-field-v2 select {
        height: 40px;
        font-size: 16px;
    }

    .sec-banner-pttm .la-submit-wrap-v2 {
        margin-top: 5px;
    }

    .sec-banner-pttm .la-submit-wrap-v2 input[type="submit"] {
        min-width: 100%; /* Nút bấm rộng hết màn hình mobile */
        height: 45px;
    }
}

/* HIỆU ỨNG NHỊP ĐẬP (PULSE) */
.btn--pulse {
    animation: pulse-banner 2s infinite ease-in-out;
}

@keyframes pulse-banner {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}



/* ==========================================================================
  Sec 2 PXTM
   ========================================================================== */

.sec-top-dv-pxtm {
    width: 100%;
        padding: 0px 0 60px;
    font-family: 'Geomanist', sans-serif;
}

.v-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 15px;
}

/* Header Section */
.v-title-box {
    text-align: center;
    margin-bottom: 50px;
}

.v-main-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
    color: #451180;
    margin: 0;
}

.v-art-text {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 100px;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    margin-left: -8px;
	padding: 0 16px;
}

.v-sub-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
    color: #451180;
    margin-top: -20px;
}

/* Container chứa các dịch vụ */
.v-services-grid {
    display: flex;
    flex-wrap: wrap; /* Cho phép xuống hàng */
    justify-content: center; /* Luôn căn giữa các item trong hàng */
    gap: 50px 30px; /* Khoảng cách dọc 50px, ngang 30px */
    max-width: 1200px;
    margin: 0 auto;
}

/* Từng khối dịch vụ */
.v-service-item {
    position: relative; /* Quan trọng để căn tên dịch vụ absolute */
    flex: 0 0 calc(33.333% - 30px); /* 3 cột trên 1 hàng cho Desktop */
    max-width: 380px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* Tên dịch vụ đè lên ảnh */
.v-sv-name {
    position: absolute;
    top: 10px; /* Chỉnh khoảng cách từ mép trên ảnh xuống */
    left: 35px; /* Chỉnh khoảng cách từ mép trái ảnh vào */
    z-index: 5;
    font-size: 22px;
    color: #451180;
    font-weight: 500;
    margin: 0;
    pointer-events: none; /* Tránh cản trở click vào ảnh */
}
.btn-sv-pxtm {
	margin-top:-10px;
}
/* Thẻ chứa ảnh */
.v-sv-card {
    width: 100%;
    
    padding: 15px;
    border-radius: 30px;
 
    position: relative;
    z-index: 1;
    margin-bottom: 0; /* Xóa margin cũ */
}

.v-sv-card img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    display: block;
}

/* NÚT XEM THÊM - CHỈNH XỊCH XUỐNG DƯỚI */
.v-sv-btn {
    background: linear-gradient(90deg, #451180 0%, #710DAC 100%);
    color: #fff;
    padding: 12px 40px;
    border-radius: 50px;
	border:2px solid #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    
    /* Đẩy nút xuống thấp hơn hẳn so với thẻ card */
    margin-top: -20px; 
    
    position: relative;
    z-index: 10;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(113, 13, 172, 0.3);
}

.v-sv-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(113, 13, 172, 0.5);
    color: #fff;
}

/* RESPONSIVE */
@media (max-width: 992px) {
    .v-service-item {
        flex: 0 0 calc(50% - 20px); /* 2 cột trên Tablet */
    }
}

@media (max-width: 768px) {
    .v-service-item {
        flex: 0 0 100%; /* 1 cột trên Mobile */
        max-width: 400px;
    }
    
    .v-sv-name {
        font-size: 18px;
        top: 25px;
        left: 30px;
    }
}

/**********************/

.video-shorts__grid {
    display: flex;
    gap: 30px;
    justify-content: center;
    flex-wrap: wrap
}

.video-short-item {
    flex: 0 0 280px;
    aspect-ratio: 9 / 16;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    background: #000
}

.video-short-item img,.play-overlay {
    display: none
}

/* Container bao ngoài */
.sec-shorts-mobile-diamond {
    padding: 20px 0;
    
    overflow: hidden;
}

/* Khung slider vuốt ngang mượt mà */
.sec-shorts-mobile-diamond .video-shorts__slider {
    display: flex;
    gap: 15px;
    overflow-x: auto;
    scroll-snap-type: x mandatory; /* Hút video vào giữa khi vuốt */
    padding: 0 15px;
    scrollbar-width: none; /* Ẩn thanh cuộn Firefox */
}

.sec-shorts-mobile-diamond .video-shorts__slider::-webkit-scrollbar {
    display: none; /* Ẩn thanh cuộn Chrome/Safari */
}

/* Item video Shorts */
.sec-shorts-mobile-diamond .video-short-item {
    flex: 0 0 75%; /* Hiển thị 75% chiều rộng để lộ video kế tiếp */
    aspect-ratio: 9 / 16; /* ÉP TỶ LỆ DỌC CHUẨN */
    background: #000;
    border-radius: 20px; /* Bo góc */
    position: relative;
    scroll-snap-align: center;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}

/* Ép iframe full màn hình không để lại khoảng đen */
.sec-shorts-mobile-diamond .video-short-item iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: none;
    object-fit: cover;
}

/* Fix lỗi cho Desktop nếu dùng chung class */
@media (min-width: 1024px) {
    .sec-shorts-mobile-diamond .video-shorts__slider {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        overflow-x: hidden;
        gap: 25px;
        padding: 0 50px;
    }
    .sec-shorts-mobile-diamond .video-short-item {
        flex: none;
        width: 100%;
    }
}


/* Container chính */
.sec-sao-viet .video-shorts__grid {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Item video - Chỉnh lại tỉ lệ 16/9 */
.sec-sao-viet .video-short-item {
    flex: 0 0 100%; /* Mặc định trên mobile nhỏ nhất là full width */
    max-width: 450px; /* Giới hạn độ rộng để không quá to khi hiển thị ngang */
    aspect-ratio: 16 / 9; /* CHUYỂN THÀNH TỈ LỆ NGANG */
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    background: #000;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Ép iframe full khung hình */
.sec-sao-viet .video-short-item iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: none;
    object-fit: cover;
}

/* --- HIỆU ỨNG SLIDER CHO MOBILE (Nếu dùng trong container kim cương) --- */
.sec-sao-viet .sec-shorts-mobile-diamond .video-shorts__slider {
    display: flex;
    gap: 15px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 10px 15px 30px;
    scrollbar-width: none;
}

.sec-sao-viet .sec-shorts-mobile-diamond .video-shorts__slider::-webkit-scrollbar {
    display: none;
}

.sec-sao-viet .sec-shorts-mobile-diamond .video-short-item {
    flex: 0 0 85%; /* Hiển thị 85% chiều rộng để thấy một phần video tiếp theo */
    aspect-ratio: 16 / 9;
    scroll-snap-align: center;
}

/* --- GIAO DIỆN DESKTOP --- */
@media (min-width: 1024px) {
   .sec-sao-viet  .video-shorts__grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr); /* Chia 3 cột ngang đều nhau */
        gap: 30px;
        padding: 0 20px;
    }

   .sec-sao-viet .video-short-item {
        max-width: 100%; /* Để grid tự quyết định độ rộng */
        flex: none;
    }
}

/*******/

/* --- CHUNG CHO DESKTOP: ẨN CÁC PHẦN MOBILE --- */
.sec-4-mobile-nn-container, 
.m-shorts-progress-wrapper {
    display: none;
}

/* --- CHỈ HIỂN THỊ TRÊN MOBILE (< 1024px) --- */
@media (max-width: 1023px) {
    .sec-4-mobile-nn-container {
        display: block;
        overflow: hidden;
    }
	
	/* Slider Common */
    .m-expert-slider, .video-shorts__slider {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 15px;
        padding: 0 20px 20px;
        scrollbar-width: none;
    }
    .m-expert-slider::-webkit-scrollbar, .video-shorts__slider::-webkit-scrollbar { display: none; }

    .m-expert-card, .video-short-item {
        min-width: 85vw;
        scroll-snap-align: center;
        position: relative;
    }
}	
/*****/
/* --- CHUNG CHO DESKTOP: ẨN CÁC PHẦN MOBILE --- */
.sec-4-mobile-nn-container, 
.m-shorts-progress-wrapper {
    display: none;
}

/* --- CHỈ HIỂN THỊ TRÊN MOBILE (< 1024px) --- */
@media (max-width: 1023px) {
    .sec-4-mobile-nn-container {
        display: block;
        overflow: hidden;
    }
	/* Progress Bar Common */
    .m-progress-wrapper, .m-shorts-progress-wrapper {
        display: flex; justify-content: center; width: 100%; margin-top: 10px;
    }
    .m-progress-container, .m-shorts-progress-container {
        width: 120px; height: 3px; background: rgba(255,255,255,0.2); border-radius: 10px; position: relative;
    }
    .m-progress-bar, .m-shorts-progress-bar {
        position: absolute; top: 0; left: 0; height: 100%; width: 30px; /* 1/4 của 120px */
        background: #B915D2; border-radius: 10px;
    }
}

	
/* --- CẤU TRÚC CHUNG --- */
.sec-5-ly-do-pxtm {
    width: 100%;
    padding: 0px 0 60px;
    font-family: 'Geomanist', sans-serif;
}

.sec-5-ly-do-pxtm .v-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- TIÊU ĐỀ NGHỆ THUẬT --- */
.sec-5-ly-do-pxtm .v-title-box {
    text-align: center;
    margin-bottom: 50px;
}

.sec-5-ly-do-pxtm .v-main-title {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    color: #451180;
    font-weight: 400;
    margin: 0;
}

.sec-5-ly-do-pxtm .v-art-text {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 100px;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
}

/* --- LƯỚI LÝ DO (FLEXBOX ĐỂ CĂN GIỮA HÀNG CUỐI) --- */
.sec-5-ly-do-pxtm .v-reason-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px 30px;
}

.sec-5-ly-do-pxtm .v-reason-item {
    position: relative;
    flex: 0 0 calc(50% - 15px);
    max-width: 500px;
    line-height: 0;
    transition: transform 0.3s ease;
}

.sec-5-ly-do-pxtm .v-reason-item:hover {
    transform: translateY(-5px);
}

.sec-5-ly-do-pxtm .v-reason-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* --- POSITION TEXT TRÊN ẢNH --- */
.sec-5-ly-do-pxtm .v-reason-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    text-align: center;
    color: #ffffff;
    font-family: 'Geomanist', sans-serif;
    font-size: 25px;
    font-weight: 400;
    line-height: 1.3;
    margin: 0;
    z-index: 2;
    pointer-events: none;
}

/* --- RESPONSIVE MOBILE --- */
@media (max-width: 768px) {
	.sec-7-phun-moi-m {
		    padding: 0px;
	}
	.sec-7-phun-xam-m-wrapper {
		padding-top: 30px!important;
		        margin-bottom: -20px;
	}
    .sec-5-ly-do-pxtm {         padding: 0px 0; margin-top: -30px; }
    .sec-5-ly-do-pxtm .v-art-text { font-size: 70px; margin-right: -12px;
    margin-top: -25px;}
    .sec-5-ly-do-pxtm .v-main-title { font-size: 45px;     }
    
    .sec-5-ly-do-pxtm .v-reason-item {
        flex: 0 0 100%;
    }
    
    .sec-5-ly-do-pxtm .v-reason-text {
        font-size: 16px;
    }
}
.sec-ab-slider-mm {
    padding: 30px 0 10px;
    overflow: hidden;
}

.sec-ab-slider-mm .v-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* Khoảng cách giữa các slide */
.ab-slider-main .slick-list {
    margin: 0 -10px;
}

.ab-item {
    padding: 0 10px; /* Tạo khe hở 20px giữa 2 cột */
    outline: none;
}

.ab-image-wrapper {
    border-radius: 20px; /* Bo góc như ảnh mẫu */
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

.ab-image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}

/* Tùy chỉnh nút mũi tên (Arrows) */
.ab-slider-main .slick-prev, 
.ab-slider-main .slick-next {
    z-index: 10;
    width: 40px;
    height: 40px;
}

.ab-slider-main .slick-prev { left: -50px; }
.ab-slider-main .slick-next { right: -50px; }

.ab-slider-main .slick-prev:before, 
.ab-slider-main .slick-next:before {
    font-size: 40px;
    color: #451180; /* Màu tím đặc trưng Linh Anh */
    opacity: 0.8;
}

/* Responsive cho Mobile */
@media (max-width: 768px) {
    .ab-slider-main .slick-prev, 
    .ab-slider-main .slick-next {
        display: none !important; /* Ẩn mũi tên trên mobile cho gọn */
    }
}
.la-btn-container {
    text-align: center; /* Căn giữa nút bấm so với layout tổng */
    position: relative;
    z-index: 10;
}

.la-btn-contact {
    display: inline-block;
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff;
        padding: 5px 35px 5px;
    height: 45px; /* Chiều cao khớp với padding và font-size */
    line-height: 40px; /* Giúp chữ căn giữa theo chiều dọc */
    border-radius: 50px;
    font-size: 20px;
    font-weight: 400;
    font-family: 'Geomanist', sans-serif; /* Font chủ đạo của dự án */
    text-decoration: none;
    border: 2px solid #fff;
    margin-top: -20px; /* Kéo nút đè lên khối phía trên (ảnh) */
    z-index: 10;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
    text-transform: uppercase; /* Viết hoa như trong ảnh mẫu */
    cursor: pointer;
}

/* Hiệu ứng khi di chuột vào (Hover) */
.la-btn-contact:hover {
    transform: scale(1.05); /* Phóng lớn nhẹ */
    box-shadow: 0px 6px 12px 0px rgba(113, 13, 172, 0.4);
    filter: brightness(1.1);
}
/****/

/* STYLE TIÊU ĐỀ NHÓM (Theo thông số Figma 616x30) */
.v-group-title {
    font-family: 'Geomanist', sans-serif;
    font-size: 30px;
    font-weight: 400; /* Tương đương Book/Medium trong Figma */
    color: #451180;
    margin-bottom: 25px;
    text-align: left;
    line-height: 1.2;
}
/*****************************************************************/
.sec-fb-google {
    width: 100%;
    padding: 0px 0;
    overflow: hidden;
}

.sec-fb-google .v-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 15px;
}

.fb-flex-box {
    display: flex;
    align-items: center;
    gap: 30px;
}

.fb-title-col {
    flex: 0 0 350px;
}

/* FIX QUAN TRỌNG: Slider bên trong Flex phải có min-width 0 */
.fb-slider-col {
    flex: 1;
    min-width: 0; 
}

.fb-title-main {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text; background-clip: text; 
	-webkit-text-fill-color:transparent; 
    margin: 0;
	    font-weight: 400;
    line-height: 70px;
}

.fb-title-art {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 87px;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text; background-clip: text; 
	-webkit-text-fill-color:transparent; 
    display: block;
    margin-top: -60px;
    font-weight: 400;
	    padding: 0 40px;
}

/* Xử lý khoảng cách item */
.fb-google-slider .slick-list {
    margin: 0 -10px;
}

.fb-google-item {
    padding: 10px;
    outline: none;
}

.fb-img-wrap {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    
}

.fb-google-item img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* Fix Mũi tên bị vỡ/đè */
.fb-google-slider .slick-prev, 
.fb-google-slider .slick-next {
    width: 40px;
    height: 40px;
    z-index: 10;
    top: 50%;
    transform: translateY(-50%);
}

.fb-google-slider .slick-prev { left: -45px; }
.fb-google-slider .slick-next { right: -45px; }

.fb-google-slider .slick-prev:before, 
.fb-google-slider .slick-next:before {
    font-family: 'slick';
    font-size: 40px;
    color: #451180;
    opacity: 1;
}

/* MOBILE */
@media (max-width: 1024px) {
    .fb-flex-box { flex-direction: column; text-align: center; gap: 40px; }
    .fb-title-col { flex: 0 0 100%; }
    .fb-slider-col { width: 100%; padding: 0 30px; } /* Thừa lề cho mũi tên trên mobile */
    .fb-google-slider .slick-prev { left: -10px; }
    .fb-google-slider .slick-next { right: -10px; }
}


/********************************************************************************/
.sec-uu-dai-pttm {
    width: 100%;
    padding: 0px 0 60px;
}

.sec-uu-dai-pttm .v-container {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 15px;
}

.v-title-head {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color:transparent;
font-weight:400;
    text-align: center;
    margin-bottom: 40px;
}

.v-uu-dai-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.v-uu-dai-item {
    position: relative;
    border-radius: 30px;
}

/* CONTAINER CHÍNH - LÀM GỐC TỌA ĐỘ */
.v-img-box {
    position: relative;
    border-radius: 30px;
    overflow: visible; /* Để nhãn nhô ra ngoài nếu cần */
    line-height: 0;
}

.v-img-box img {
    width: 100%;
    height: auto;
    border-radius: 30px;
    display: block;
}

/* 1. POSITION TEXT GÓI (Dòng chữ phía trên khung giá) */
.v-pos-name {
    position: absolute;
    width: 100%;
    bottom: 52px; /* Cách đáy 110px */
    left: 0;
    font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #451180;
    text-align: center;
    z-index: 5;
    
    padding: 5px 0;
}

/* 2. POSITION NHÃN "CHỈ TỪ / TẶNG" */
.v-pos-label {
    position: absolute;
    bottom: 60px; /* Căn giữa theo chiều dọc của khung giá */
    left: 15px; /* Nằm sát lề trái khung giá */
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff;
    font-family: 'Geomanist', sans-serif;
    font-size: 13px;
    padding: 4px 12px;
    border-radius: 10px;
    z-index: 10;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
}

.v-pos-label.pink {
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
}

/* 3. POSITION KHUNG GIÁ */
.v-pos-price-box {
        position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 85%;
    padding: 5px 0;
    text-align: center;
    z-index: 4;
}

.v-price-num {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 38px;
    color: #451180;
    line-height: 1.1;
    margin-left: 20px; /* Tránh đè nhãn Chỉ từ */
}

/* 4. POSITION NÚT ĐĂNG KÝ */
.v-btn-wrap {
    position: absolute;
    bottom: -65px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 15;
}

.v-btn-reg {
    display: inline-block;
    background: linear-gradient(180deg, #451180 0%, #710DAC 100%);
    color: #fff;
    padding: 20px 30px 18px;
    border-radius: 50px;
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 400;
    border: 2px solid #fff;
    text-transform: uppercase;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    text-decoration: none;
    white-space: nowrap;
}
.px-sec--dmat {
	margin-bottom: -21px;
}
/* RESPONSIVE */
@media (max-width: 1024px) {
    .v-uu-dai-grid { grid-template-columns: repeat(2, 1fr); gap: 40px 20px; }
}


/**********************************************/
.sec-7-pxtm-nn {
    padding: 80px 0 0px;
    color: #fff;
}

.sec-7-pxtm-nn .v-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- GRID CHÍNH --- */
.sec-7-pxtm-nn .v-status-grid-main {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    /* ÉP TẤT CẢ CÁC HÀNG CÓ CHIỀU CAO BẰNG NHAU */
    grid-auto-rows: 1fr; 
    align-items: stretch;
}

/* --- Ô TIÊU ĐỀ (Ô SỐ 1) --- */
.sec-7-pxtm-nn .v-title-grid-item {
    background: transparent;
    border-radius: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 25px;
    height: 100%; /* Đảm bảo cao hết ô grid */
    box-sizing: border-box;
}

/* --- Ô HÌNH ẢNH (Ô 2-6) --- */
.sec-7-pxtm-nn .v-status-item {
    position: relative;
    border-radius: 25px;
    overflow: hidden;
    height: 100%; /* Ép item cao bằng hàng grid */
    display: flex;
}

.sec-7-pxtm-nn .v-status-item img {
    width: 100%;
    height: 100%;
    /* CHIÊU QUAN TRỌNG: Giúp ảnh lấp đầy ô mà không làm méo tỉ lệ */
    object-fit: cover; 
    display: block;
}
/* Overlay text Geomanist 18px */
.sec-7-pxtm-nn .v-overlay-text {
    position: absolute;
    bottom: 18px;
    left: 0;
    width: 100%;
	letter-spacing: 1px;
  	font-weight:400;
    color: #fff;
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    text-align: center;
    padding: 15px 10px;
    margin: 0;
    line-height: 1.3;
    z-index: 5;
}
/* --- KHỐI CTA CẬP NHẬT (Sử dụng Position) --- */
.sec-7-pxtm-nn .v-cta-section {
    margin-top: 60px;
    display: flex;
    justify-content: center;
}

.sec-7-pxtm-nn .v-cta-image-wrap {
    position: relative; /* Làm gốc tọa độ cho text */
    display: inline-block;
    max-width: 600px; /* Độ rộng tối đa của khối nút */
    border-radius: 40px; /* Bo góc nhẹ theo ảnh */
    overflow: visible; /* Để text nhô ra ngoài nếu cần */
    line-height: 0;
}

.sec-7-pxtm-nn .v-cta-bg-img {
    width: 100%;
    height: auto;
    border-radius: 40px;
    
}

/* 1. TEXT HÀNG 1: Căn trên ảnh */
.sec-7-pxtm-nn .v-text-pos-1 {
    position: absolute;
    top: 50px; /* Cách mép trên ảnh 20px */
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
     font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    line-height: 1.2;
    z-index: 5;
    white-space: nowrap; /* Không cho xuống dòng tự động */
}

/* 2. TEXT NÚT "GỬI TÌNH TRẠNG NGAY": Căn dưới ảnh button */
.sec-7-pxtm-nn .v-text-pos-2 {
    position: absolute;
    bottom: 25px; /* Cách mép dưới ảnh button 25px */
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    background: transparent;
    color: #fff;
    font-family: 'Geomanist', sans-serif;
    font-size: 14px; /* Size nhỏ như nút bấm */
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    z-index: 5;
}
/* BUTTON DƯỚI: Gửi tình trạng ngay */
.sec-7-pxtm-nn .v-btn-pos-bottom {
        position: absolute;
    bottom: 23%;
    left: 42%;
    transform: translateX(-50%);
    /* background: transparent; */
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border: 2px solid #fff;
    color: #fff;
    padding: 20px 35px 16px;
    border-radius: 50px;
    font-family: 'Geomanist', sans-serif;
    font-size: 22px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    z-index: 6;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}
/* Link phủ toàn bộ khối để dễ click */
.sec-7-pxtm-nn .v-cta-link-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    cursor: pointer;
}

/* Hiệu ứng Hover mượt */
.sec-7-pxtm-nn .v-cta-image-wrap:hover {
    transform: scale(1.03);
    transition: all 0.3s ease;
}

/* CONTAINER TỔNG */
.sec-7-mobile-pxtm-nn {
    padding: 40px 0;
    color: #fff;
    overflow: hidden;
}

.sec-7-mobile-pxtm-nn .v-container {
    padding: 0 15px;
}

/* PHẦN TIÊU ĐỀ MOBILE TÁCH RIÊNG */
.sec-7-mobile-pxtm-nn .v-mobile-title-box {
    text-align: center;
    margin-bottom: 5px;
}

.sec-7-mobile-pxtm-nn .v-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
}

/* Container tiêu đề */
.sec-7-mobile-pxtm-nn .v-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0; /* Khoảng cách giữa 2 hàng */
}

/* Xử lý Hàng 1 */
.sec-7-mobile-pxtm-nn .v-title-row-1 {
display: flex;
    align-items: flex-end;
    justify-content: center;
    white-space: nowrap;
    width: 100%;
}

.sec-7-mobile-pxtm-nn .v-text-ivy {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 24px; /* Giảm nhẹ để vừa màn hình điện thoại nhỏ */
	background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color:transparent;
    font-weight: 500;
}

.sec-7-mobile-pxtm-nn .v-text-edwardian {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 65px;
	background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color:transparent;
    line-height: 1;
    margin-left: 10px; /* Khoảng cách giữa "đang" và "đối mặt" */
}

/* Xử lý Hàng 2 */
.sec-7-mobile-pxtm-nn .v-title-row-2 {
    margin-top: -15px; /* Kéo hàng 2 lên gần hàng 1 do chữ Edwardian có đuôi dài */
    text-align: center;
}

/* PHẦN SLIDER ẢNH */
.sec-7-mobile-pxtm-nn .v-mobile-status-slider {
    margin-bottom: 40px;
}

.sec-7-mobile-pxtm-nn .v-status-item {
    position: relative;
    padding: 0 10px; /* Khoảng cách giữa các slide */
    outline: none;
}

.sec-7-mobile-pxtm-nn .v-status-item img {
    width: 100%;
    height: 400px;
    object-fit: contain;
    border-radius: 20px;
    display: block;
}

.sec-7-mobile-pxtm-nn .v-overlay-text {
    position: absolute;
    bottom: 45px;
    left: 10px;
    right: 10px;
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    line-height: 1.3;
    z-index: 5;
    margin: 0;
}

/* PHẦN CTA MOBILE */
.sec-7-mobile-pxtm-nn .v-cta-section {
    display: flex;
    justify-content: center;
}

.sec-7-mobile-pxtm-nn .v-cta-image-wrap {
    position: relative;
    width: 100%;
    max-width: 350px;
}

.sec-7-mobile-pxtm-nn .v-cta-bg-img {
    width: 100%;
    height: auto;
}
/* --- CSS CHO MŨI TÊN PREV/NEXT MOBILE --- */
.sec-7-mobile-pxtm-nn .v-mobile-status-slider {
    position: relative;
}

/* Style chung cho cả 2 nút */
.sec-7-mobile-pxtm-nn .slick-prev,
.sec-7-mobile-pxtm-nn .slick-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(150, 21, 210, 0.6); /* Màu tím trong suốt */
    border: none;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
.sec-7-mobile-pxtm-nn .slick-prev:before,.sec-7-mobile-pxtm-nn .slick-next:before {
       
        font-size: 5px!important;
    }
/* Vị trí nút bên trái */
.sec-7-mobile-pxtm-nn .slick-prev {
    left: 15px;
}

/* Vị trí nút bên phải */
.sec-7-mobile-pxtm-nn .slick-next {
    right: 15px;
}

/* Hiệu ứng khi nhấn/hover */
.sec-7-mobile-pxtm-nn .slick-prev:hover,
.sec-7-mobile-pxtm-nn .slick-next:hover {
    background: #9615D2;
    transform: translateY(-50%) scale(1.1);
}

/* Nếu dùng icon từ FontAwesome trong JS */
.sec-7-mobile-pxtm-nn .slick-prev i,
.sec-7-mobile-pxtm-nn .slick-next i {
    font-size: 20px;
    line-height: 1;
}

/* ẨN DOTS (Đề phòng nếu JS chưa nhận) */
.sec-7-mobile-pxtm-nn .slick-dots {
    display: none !important;
}
.sec-7-mobile-pxtm-nn .v-text-pos-1 {
    position: absolute;
    top: 31px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 24px;
    color: #fff;
    text-align: center;
    line-height: 1.2;
}

.sec-7-mobile-pxtm-nn .v-btn-pos-bottom {
    position: absolute;
    bottom: 18%;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border: 1px solid #fff;
    color: #fff;
    padding: 10px 20px;
    border-radius: 40px;
    font-family: 'Geomanist', sans-serif;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
}

.sec-7-mobile-pxtm-nn .v-cta-link-cover {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 10;
}

/* CUSTOM SLICK DOTS */
.sec-7-mobile-pxtm-nn .slick-dots { bottom: -25px; }
.sec-7-mobile-pxtm-nn .slick-dots li button:before { color: #9615D2 !important; opacity: 0.5; }
.sec-7-mobile-pxtm-nn .slick-dots li.slick-active button:before { color: #fff !important; opacity: 1; }
/*********/
.sec-7-pxtm-nn .v-main-title .v-text-ivy-55 {
	 font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color:transparent;
    line-height: 1.1;
    margin-left: 20px; /* Tránh đè nhãn Chỉ từ */
}
.sec-7-pxtm-nn .v-main-title .v-text-edwardian-120 {
	 font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
	 color: transparent;
	font-weight: 400;
    margin-bottom: 0px; /* Kéo chữ Khuyến mãi lên lồng vào nét chữ */
	     padding: 0px 47px;
    line-height: 60px;
}

/*******************************************************************************/
.sec8-pxtm-nn {
    color: #fff;
    overflow: hidden;
}

.sec8-pxtm-nn .v-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- TITLE STYLE --- */
.sec8-pxtm-nn .v-title-box {
    text-align: center;
    margin-bottom: -10px;
}

.sec8-pxtm-nn .v-main-title {
    display: flex;
    flex-direction: column;
    margin: 0;
}

.sec8-pxtm-nn .v-line-1, 
.sec8-pxtm-nn .v-line-3 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
  background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color:transparent;
display: block; /* Ép thành khối riêng */
   
    line-height: 60px;
}

.sec8-pxtm-nn .v-line-2 {
  font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    line-height: 104px;
    margin-top: -100px;
    margin-bottom: -70px;
}

/* --- STEP CONTENT GRID (3 CỘT) --- */
.sec8-pxtm-nn .v-step-content-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 40px;
    justify-items: center;
    margin-bottom: 60px;
}

.sec8-pxtm-nn .v-center-step {
    grid-column: 1 / span 2;
}

.sec8-pxtm-nn .v-step-item {
    position: relative;
    max-width: 530px;
}

.sec8-pxtm-nn .v-step-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* TEXT POSITION TRÊN DẢI TÍM */
.sec8-pxtm-nn .v-step-text {
    position: absolute;
    top: 47%;
    left: 22%; /* Căn sau số 1,2,3,4,5 trên ảnh */
    transform: translateY(-50%);
    text-align: left;
    width: 70%;
}

.sec8-pxtm-nn .v-step-name {
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight:500;
    margin: 0 0 -3px 0;
    color: #fff;
}

.sec8-pxtm-nn .v-step-desc {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    color: #fff;
    line-height: 1.3;
}

/* --- CIRCLE IMAGES FLOW --- */
.sec8-pxtm-nn .v-step-images-circle {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}

.sec8-pxtm-nn .v-circle-item {
    width: 180px;
    height: 180px;
    
    overflow: hidden;
    transition: transform 0.3s ease;
}

.sec8-pxtm-nn .v-circle-item:hover {
    transform: scale(1.05);
    border-color: #B915D2;
}

.sec8-pxtm-nn .v-circle-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* RESPONSIVE */
@media (max-width: 992px) {
	.sec8-pxtm-nn .v-step-item img {
		    width: 133%!important;
    height: 127%!important;
	}
	.sec8-pxtm-nn .v-step-name {
		font-size: 16px!important;
	}
	.sec8-pxtm-nn .v-step-desc {
    font-size: 14px!important;
   
}
	.sec8-pxtm-nn .v-step-text {
		    top: 58%!important;
	}
	.sec8-pxtm-nn .v-main-title {
		margin-bottom: -60px;
	}
	.sec8-pxtm-nn .v-step-images-circle {
		display:none!important;
	}
	.sec9-pxtm-nn .v-status-grid-main {
		grid-template-columns: repeat(1, 1fr)!important;
	}
	.sec9-pxtm-nn .v-text-edwardian-120 {
		font-size:60px!important;
	}
	.sec9-pxtm-nn .v-text-ivy-55 {
		font-size:45px!important;
	}
	.sec9-pxtm-nn .v-pros-text {
		font-size: 16px!important;
	}
	.sec9-pxtm-nn .v-promo-content {
		top: 33%!important;
	}
	.sec9-pxtm-nn .v-promo-sub {
		font-size:18px!important;
		padding-top: 15px!important;
	}
	.sec9-pxtm-nn .v-promo-head {
		font-size:40px!important;
	}
    .sec8-pxtm-nn .v-step-content-grid { grid-template-columns: 1fr; }
    .sec8-pxtm-nn .v-center-step { grid-column: auto; }
    .sec8-pxtm-nn .v-line-2 { font-size: 50px;    margin-top: -115px;
    margin-bottom: -105px; }
    .sec8-pxtm-nn .v-line-1, .sec8-pxtm-nn .v-line-3 { font-size: 35px; }
    .sec8-pxtm-nn .v-circle-item { width: 140px; height: 140px; }
}

/*************************************/
/* --- TỔNG QUAN --- */
.sec9-pxtm-nn {
    padding: 50px 0 0 0; /* Giảm padding bottom vì banner đã chiếm hết chân section */
    color: #fff;
}

.sec9-pxtm-nn .v-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- GRID ƯU ĐIỂM --- */
.sec9-pxtm-nn .v-status-grid-main {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px 40px;
    margin-bottom: 60px;
}

/* TIÊU ĐỀ GRADIENT */
.sec9-pxtm-nn .v-text-ivy-55 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1.1;
    display: block;
	padding:20px;
}
.sec9-pxtm-nn .v-main-title {
	text-align:center;
}
.sec9-pxtm-nn .v-text-edwardian-120 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px; /* Tăng nhẹ size để cân đối với Ivy */
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 0.6;
        margin: -50px 0 -30px;
    display: block;
	padding:20px;
}

/* TEXT TRÊN DẢI TRẮNG */
.sec9-pxtm-nn .v-pros-item { position: relative; line-height: 0; }
.sec9-pxtm-nn .v-pros-item img { width: 100%; height: auto; display: block; }

.sec9-pxtm-nn .v-pros-text {
    position: absolute;
    left: 32%;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Geomanist', sans-serif;
    font-size: 26px;
    color: #710DAC;
    font-weight: 500;
    line-height: 1.2;
}

/* --- BANNER PROMO FULL WIDTH --- */
.sec9-pxtm-nn .v-promo-box-full {
    width: 100vw; /* Chiếm 100% chiều rộng cửa sổ trình duyệt */
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 60px;
    line-height: 0;
}

.sec9-pxtm-nn .v-promo-inner {
    width: 100%;
    position: relative;
}

.sec9-pxtm-nn .v-promo-bg {
    width: 100%;
    height: auto;
    min-height: 450px; /* Tăng độ cao để layout sang hơn trên PC */
    object-fit: cover; /* Quan trọng: Giúp ảnh không bị méo khi tràn lề */
    display: block;
}

.sec9-pxtm-nn .v-promo-content {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 1200px; /* Giữ chữ luôn nằm trong vùng an toàn giữa màn hình */
    text-align: center;
    z-index: 10;
    padding: 0 20px;
}

.sec9-pxtm-nn .v-promo-head {
    font-family: 'Geomanist', sans-serif;
    font-size: 50px;
    color: #451180;
    font-weight: 600;
    margin-bottom: 10px;
}

.sec9-pxtm-nn .v-promo-sub {
    font-family: 'Geomanist', sans-serif;
    font-size: 30px;
    color: #451180;
	    padding-top: 53px;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 25px;
}

.sec9-pxtm-nn .v-sale-percent {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 120px;
    color: #fff;
    line-height: 1;
    display: inline-block;
}

/* RESPONSIVE */
@media (max-width: 1024px) {
    .sec9-pxtm-nn .v-pros-grid { grid-template-columns: 1fr; }
    .sec9-pxtm-nn .v-promo-bg { min-height: 350px; }
    .sec9-pxtm-nn .v-promo-sub { font-size: 22px; }
    .sec9-pxtm-nn .v-sale-percent { font-size: 80px; }
}

/******/
/* SECTION 10 TỔNG QUAN */
.sec10-pxtm-nn {
    
    padding: 30px 0;
    color: #fff;
    overflow: hidden;
}

.sec10-pxtm-nn .v-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- BRAND TITLE STYLE --- */
.sec10-pxtm-nn .v-brand-title-box {
    text-align: center;
    width: 100%;
}

.sec10-pxtm-nn .v-brand-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    padding: 0;
}

/* Hàng 1: Thương hiệu (IvyPresto 55px) */
.sec10-pxtm-nn .v-brand-line-1 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
     background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 400;
    line-height: 1; /* Giữ khoảng cách chuẩn */
    display: block;
}

/* Hàng 2: phun xăm hàng đầu Việt Nam (Edwardian 80px) */
.sec10-pxtm-nn .v-brand-line-2 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 75px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 400;
    line-height: 0.6; /* Ép khít để lồng vào hàng 1 */
 margin-top: -55px;
    margin-bottom: -40px;
    display: block;
	padding:30px;
    white-space: nowrap;
}

/* Hàng 3: 2 năm liên tiếp (IvyPresto 55px) */
.sec10-pxtm-nn .v-brand-line-3 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
     background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 400;
    line-height: 70px; /* Kéo lên sát hàng 2 */
    margin-top: -5px; /* Dùng margin âm để xử lý khoảng hở của font cursive */
    display: block;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
	/* CONTAINER TỔNG MOBILE */
.sc10-mopbile-new-pttn-nn {
   margin-top: -105px;
    text-align: center;
}
	.sec-top-dv-pxtm {
		padding-top:60px;
	}
.sc10-mopbile-new-pttn-nn .v-brand-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: -44px;
}

/* Định dạng Gradient chung cho các dòng chữ */
.sc10-mopbile-new-pttn-nn .v-brand-title span {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: block;
    width: 100%;
	margin-bottom: -20px;
}

/* Hàng 1: Thương hiệu (IvyPresto Display 40px Regular) */
.sc10-mopbile-new-pttn-nn .v-brand-line-1 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 40px;
    font-weight: 400;
    line-height: 1.2;
}

/* Hàng 2: phun xăm hàng đầu (UTM Edwardian 80px Regular) */
.sc10-mopbile-new-pttn-nn .v-brand-line-2 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 65px;
    font-weight: 400;
    line-height: 0.6;
    margin-top: -10px; /* Ép sát lên hàng 1 */
    padding: 24px;
    white-space: nowrap;
}

/* Hàng 3: Việt Nam (UTM Edwardian 80px Regular) */
.sc10-mopbile-new-pttn-nn .v-brand-line-3 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 65px;
    font-weight: 400;
    line-height: 0.6;
	 padding: 20px;
           margin-top: -29px;
        margin-bottom: -45px;
}

/* Hàng 4: 2 năm liên tiếp (IvyPresto Display 55px Regular) */
.sc10-mopbile-new-pttn-nn .v-brand-line-4 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
    line-height: 75px;
    margin-top: 10px;
}
	.sec8-pxtm-nn  {
		padding: 0px 0;
	}	
	.sec-7-mobile-pxtm-nn {
		padding-bottom:0px!important;
	}
    .sec10-pxtm-nn .v-brand-line-1, 
    .sec10-pxtm-nn .v-brand-line-3 {
        font-size: 35px;
    }
    .sec10-pxtm-nn .v-brand-line-2 {
        font-size: 50px;
        line-height: 0.8;
    }
}


/************************************************************************************************************Diamon Flips**************************************************************************************/
/*********************** Diamond Lips  ********************************/
.diamond-lips-btn {
  display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
       width: 267px;
    top: -198px;
    /* height: 47px; */
    left: 17%;
    padding: 10px 20px 7px 20px;
    gap: 10px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border-radius: 50px !important;
    border: 2px solid #FFFFFF;
    color: #FFFFFF;
    font-weight: 400;
	
    letter-spacing: 0.5px;
    text-transform: uppercase;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease-in-out;
    box-sizing: border-box;
}

.diamond-lips-btn-1 {
  
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 267px;
    padding: 9px 30px 5px 30px;
    gap: 10px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border-radius: 50px !important;
    border: 2px solid #FFFFFF;
    color: #FFFFFF;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
}
.diamond-lips-btn-2 {
  
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 355px;
    padding: 9px 30px 5px 30px;
    gap: 10px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    border-radius: 50px !important;
    border: 2px solid #FFFFFF;
    color: #FFFFFF;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
}
.diamond-lips-btn-1 span,.diamond-lips-btn-2 span {
	 font-size: 22px!important;
	font-weight: 400;
	font-family: 'Geomanist';
	
}
.diamond-lips-btn span {
	font-family: 'Geomanist';
	font-weight: 400;
	 font-size: 22px!important;
}
.diamond-lips-btn:hover {
  filter: brightness(1.1);
  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3);
}

.diamond-lips-btn:active {
  transform: scale(0.98);
}
.background--diamond-lips-container {
  background: linear-gradient(180deg, #F3EDFF 0%, #F3EDFF 100%);
  width: 100%;
 
}
/* Class cho phần 'Cấy môi' */
.diamond-lips-label,
        .diamond-lips-title,
        .diamond-lips-subtitle,
        .diamond-lips-description {
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            display: block;
        }

        .diamond-lips-label {
            font-family: 'IvyPrestoDisplay', serif;
            font-size: 30px;
            margin-bottom: 5px;
        }

        .diamond-lips-title {
            font-family: 'UTM-Edwardian', cursive;
            font-size: 120px;
			font-weight:400;
            line-height: 0.9;
            margin: 10px 0;
        }

        .diamond-lips-subtitle {
            font-family: 'IvyPrestoDisplay', serif;
            font-size: 45px;
            margin-bottom: 25px;
        }

        .diamond-lips-description {
            font-family: 'Geomanist', sans-serif;
            font-size: 20px;
            line-height: 1.5;
            
            text-align: justify;
        }

/**Section 3 diamon lips*/
.sec-3-diamond-lips-title-container {
            display: flex;
            align-items: flex-end; /* Căn lề dưới để khớp với chân chữ nghệ thuật */
            gap: 20px;
        }

        .sec-3-diamond-lips-title-left {
            display: flex;
            flex-direction: column;
            align-items: flex-end; /* Căn text bên trái sát về phía chữ Diamond */
            padding-bottom: 25px; /* Đẩy cụm chữ trái lên một chút so với chân chữ Diamond */
        }

        .sec-3-diamond-lips-title-main,
        .sec-3-diamond-lips-title-sub,
        .sec-3-diamond-lips-title-highlight {
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
        }

        /* Chỉnh lại để không bị xuống hàng */
        .sec-3-diamond-lips-title-main {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 55px;
            line-height: 1.1;
            white-space: nowrap; /* Giữ chữ trên một hàng duy nhất */
        }

        .sec-3-diamond-lips-title-sub {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 30px;
                line-height: 38px;
            margin-top: -5px;
        }

        .sec-3-diamond-lips-title-highlight {
            font-family: 'UTM-Edwardian', cursive;
            font-weight: normal;
            font-size: 120px;
            line-height: 0.8;
            margin: 0;
            display: inline-block;
        }

/* Container chứa 4 box */
   .sec-3-diamond-lips-grid {
    display: flex;
    gap: 10px;
    width: 100%;
}

/* Từng box hình ảnh */
.sec-3-diamond-lips-item {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* QUAN TRỌNG: Làm gốc tọa độ cho phần text tuyệt đối */
    position: relative; 
    /* Tạo khoảng trống phía dưới để text không đè lên ảnh */
    padding-bottom: 70px; 
    border-radius: 15px;
}

/* Phần khung chứa ảnh */
.sec-3-diamond-lips-img-wrap {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

.sec-3-diamond-lips-img-wrap img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    display: block;
}

/* Style cho phần text dưới ảnh */
.sec-3-diamond-lips-box-text {
    font-family: 'Geomanist', sans-serif;
    font-size: 19px;
    font-weight: 400;
    text-align: center;
    padding: 0 15px;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    
    /* Position chỉnh lại */
    position: absolute;
    bottom: 110px; 
    left: 0;
    right: 0;
   
    color: #fff;
}

/* Responsive cho điện thoại */
@media (max-width: 768px) {
    .sec-3-diamond-lips-grid {
        flex-wrap: wrap;
        gap: 15px;
    }
    .sec-3-diamond-lips-item {
        /* Chỉnh lại độ rộng để hiện 2 cột đều nhau */
        flex: 1 1 calc(50% - 15px); 
    }
}


/*sec-3-1*/
.sec-3-1-diamond-lips-title-wrapper {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .sec-3-1-diamond-lips-row-1 {
            display: flex;
            align-items: baseline;
            gap: 15px;
        }

        .sec-3-1-diamond-lips-row-2 {
            display: flex;
            align-items: baseline;
            gap: 10px;
            margin-top: -39px; 
            margin-left: 100px;
        }

        .sec-3-1-diamond-lips-gradient-text {
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            display: inline-block;
            /* QUAN TRỌNG: Thêm padding để không bị mất nét chữ nghệ thuật */
            padding: 0px 20px;
            margin: -10px -20px;
        }

        .sec-3-1-diamond-lips-label {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 30px;
			transform: translateX(17px);
        }

        .sec-3-1-diamond-lips-main-name {
            font-family: 'UTM-Edwardian', cursive;
            font-weight: normal;
            font-size: 120px;
            line-height: 1.2; /* Tăng line-height nhẹ để nét móc không bị cắt trên dưới */
        }

        .sec-3-1-diamond-lips-text-normal {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 55px;
        }

        .sec-3-1-diamond-lips-number {
            font-family: 'UTM-Edwardian', cursive;
            font-weight: normal;
            font-size: 120px;
            line-height: 1.2;
        }

/**********/
.sec-3-1-diamond-lips-grid {
            display: flex;
            gap: 10px;
           
            margin: 0 auto;
            justify-content: center;
        }

        .sec-3-1-diamond-lips-item {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
			position: relative;
            background: transparent;
        }

        .sec-3-1-diamond-lips-img-box {
            width: 100%;
            margin-bottom: 20px;
        }

        .sec-3-1-diamond-lips-img-box img {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 15px; /* Bo góc nhẹ cho ảnh đã gộp */
        }

        .sec-3-1-diamond-lips-desc {
            font-family: 'Geomanist', sans-serif;
            font-size: 20px;
			font-weight:400;
            text-align: center;
            line-height: 1.4;
            max-width: 300px;
            display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 48px;
    left: 0;
    right: 0;
    width: 100%;
            /* Hiệu ứng Gradient cho chữ */
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            
        }

        @media (max-width: 768px) {
            .sec-3-1-diamond-lips-grid {
                flex-wrap: wrap;
            }
            .sec-3-1-diamond-lips-item {
                flex: 1 1 calc(50% - 20px);
                margin-bottom: 30px;
            }
        }
/**** Sec 4 diamon lips ****/
.sec-4-diamond-lips-title-container {
            display: flex;
            flex-direction: column;
            align-items: center; /* Căn giữa toàn bộ cụm tiêu đề */
            text-align: center;
        }

        /* Hiệu ứng Gradient chung */
        .sec-4-diamond-lips-gradient-text {
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            display: inline-block;
            padding: 5px 15px; /* Chống mất nét chữ nghệ thuật */
            margin: -5px -15px;
        }

        /* Dòng 1 */
        .sec-4-diamond-lips-row-1 {
            display: flex;
            align-items: baseline;
            gap: 10px;
        }

        .sec-4-diamond-lips-text-serif {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 55px;
            line-height: 1.2;
        }

        .sec-4-diamond-lips-text-script {
            font-family: 'UTM-Edwardian', cursive;
            font-weight: normal;
            font-size: 120px;
            line-height: 1;
        }

        /* Dòng 2 */
        .sec-4-diamond-lips-row-2 {
            display: flex;
            align-items: baseline;
            gap: 15px;
            margin-top: -10px; /* Kéo dòng 2 gần dòng 1 hơn */
        }

        .sec-4-diamond-lips-text-small {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 30px; /* Kích thước nhỏ hơn cho từ "tại" nếu muốn giống ảnh mẫu */
        }

        .sec-4-diamond-lips-brand {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 55px;
        }


.sec-4-1-diamond-lips-content-wrapper {
           
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8px;
    		margin-top: 20px;
        }

        /* Định dạng text với class mới */
        .sec-4-1-diamond-lips-text {
            font-family: 'Geomanist', sans-serif;
            font-size: 20px;
            font-weight: 400;
            line-height: 28px;
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            display: inline-block;
			margin-bottom:0px!important;
        }

        /* Đường line trang trí */
        .sec-4-1-diamond-lips-line {
            width: 100%;
            max-width: 800px;
            height: auto;
            display: block;
            margin: 5px 0;
        }

        .sec-4-1-diamond-lips-highlight {
            max-width: 950px;
			font-family: 'Geomanist', sans-serif; 
			font-size: 24px; 
			font-weight:500;
        }
.sec-4-1-diamond-lips-content-wrapper p {
	margin-bottom:0px!important;
}

/* Lưới 12 ô: 4 cột trên PC, 2 cột trên Mobile */
        .sec-4-1-diamond-lips-color-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
            margin: 0 auto;
        }

        .sec-4-1-diamond-lips-color-item {
            position: relative;
            
            border-radius: 15px;
            overflow: hidden;
          
        }

        .sec-4-1-diamond-lips-color-img {
            width: 100%;
            height: auto;
            display: block;
            transition: transform 0.3s ease;
        }

        .sec-4-1-diamond-lips-color-item:hover .sec-4-1-diamond-lips-color-img {
            transform: scale(1.05);
        }

        /* Label tên màu nằm đè lên ảnh */
        .sec-4-1-diamond-lips-color-name {
            position: absolute;
            bottom: 6px;
            left: 50%;
            transform: translateX(-50%);
            padding: 5px 25px;
            border-radius: 20px;
            white-space: nowrap;
            
            font-family: 'Geomanist', sans-serif;
            font-size: 20px;
            font-weight: 400;
            
        }

        .sec-4-1-diamond-lips-color-name span {
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
        }

        @media (max-width: 992px) {
            .sec-4-1-diamond-lips-color-grid {
                grid-template-columns: repeat(3, 1fr);
            }
        }

        @media (max-width: 600px) {
            .sec-4-1-diamond-lips-color-grid {
                grid-template-columns: repeat(3, 1fr);
                gap: 10px;
            }
            .sec-4-1-diamond-lips-color-name {
                padding: 4px 15px;
                font-size: 12px;
                bottom: -3px;
            }
        }

/*******Sec 5 diamon lips***/


        /* Container chính */
        .sec-5-diamond-lips-title-wrapper {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }

        /* Hiệu ứng Gradient chung */
        .sec-5-diamond-lips-gradient-text {
            background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            display: inline-block;
            padding: 5px 20px; /* Chống mất nét chữ nghệ thuật */
            margin: -10px -20px;
        }

        /* Dòng 1: 8.000+ khách hàng */
        .sec-5-diamond-lips-row-1 {
            display: flex;
            align-items: baseline;
            gap: 15px;
        }

        .sec-5-diamond-lips-number-big {
            font-family: 'UTM-Edwardian', cursive;
            font-weight: normal;
            font-size: 120px;
            line-height: 1;
        }

        .sec-5-diamond-lips-text-small {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 30px;
        }

        /* Dòng 2: tin chọn phun môi tại Linh Anh */
        .sec-5-diamond-lips-row-2 {
            display: flex;
            align-items: baseline;
            gap: 10px;
            margin-top: -30px; /* Kéo dòng 2 sát dòng 1 */
            margin-left: 180px; /* Đẩy lùi vào tạo bố cục so le như ảnh */
        }

        .sec-5-diamond-lips-script-main {
            font-family: 'UTM-Edwardian', cursive;
            font-weight: normal;
            font-size: 120px;
            line-height: 1;
        }

        .sec-5-diamond-lips-text-medium {
            font-family: 'IvyPrestoDisplay', serif;
            font-weight: 400;
            font-size: 55px;
        }

/*Slider**/
.sec-10-diamond-flisp-mm .flickity-prev-next-button.next svg {
	    background:  linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
	border: 2px solid #fff;
	box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
	    top: 54px;
    left: 62px;
}
.sec-10-diamond-flisp-mm .flickity-prev-next-button.previous svg {
	   background:  linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
	border: 2px solid #fff;
	box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
top: 54px;
    left: -24px;
}
.sec-10-diamond-flisp-mm .slider-nav-light .flickity-prev-next-button .arrow,.sec-10-diamond-flisp-mm .slider-nav-light .flickity-prev-next-button svg {
	fill: #412767!important;
}
/*Slider**/
.sec-5-diamon-flips-slider .flickity-prev-next-button.next svg {
	   background:  linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
	border: 2px solid #fff;
	box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
	    top: 0px;
    left: 21px;
}
.sec-5-diamon-flips-slider .flickity-prev-next-button.previous svg {
	    background:  linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
	border: 2px solid #fff;
	box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
top: 0px;
    left: 7px;
}

.sec-5-diamon-flips-slider .slider-nav-light .flickity-prev-next-button .arrow,.sec-5-diamon-flips-slider .slider-nav-light .flickity-prev-next-button svg {
	fill: #412767!important;
}
/**Sec6 diamon flips*/
.sec-6-diamond-lips-title-container {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 40px 0;
}

.sec-6-diamond-lips-row-full {
    display: flex;
    align-items: center; /* Căn giữa các khối theo chiều dọc của hàng */
    justify-content: center;
    flex-wrap: nowrap;
    gap: 20px;
}

/* KHỐI QUY TRÌNH NẰM TRÊN CẤY MÔI */
.sec-6-diamond-lips-group-vertical {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    transform: translateY(-15px);
    line-height: 1;
}

/* Cụm tại Linh Anh nằm ngang */
.sec-6-diamond-lips-group-horizontal {
    display: flex;
    align-items: baseline;
    gap: 8px;
    white-space: nowrap;
}

.sec-6-diamond-lips-gradient-text {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
}

/* Font chữ */
.sec-6-diamond-lips-text-big {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
}

.sec-6-diamond-lips-text-small {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 28px; /* Thu nhỏ một chút để cân đối khi nằm dưới */
    font-weight: 400;
}

.sec-6-diamond-lips-script-main {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
    font-weight: normal;
    line-height: 1;
    padding: 10px 10px;
}

.sec-6-diamond-lips-brand {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 55px;
    font-weight: 400;
}

/* Responsive */
@media (max-width: 1024px) {
    .sec-6-diamond-lips-row-full {
        flex-wrap: wrap;
        gap: 10px;
    }
}

/**Step */
.sec-6-diamond-lips-process-wrapper {
    margin-top: -70px!important;
    margin: 0 auto;
    padding: 40px 20px 40px 20px;
}
.sec-5-diamon-flips-slider .box-text {
	border-radius: 16px;
background: var(--NN-SHAPE-TRNG-HNG, linear-gradient(180deg, #FFF 0%, #F3EDFF 100%));

/* BÓNG KHỐI TÍM */
box-shadow: 4px 4px 4px 0 rgba(59, 1, 124, 0.20);
}
.sec-6-diamond-lips-process-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 cột theo yêu cầu của Vũ */
    gap: 30px;
}

.sec-6-diamond-lips-process-item {
    position: relative; /* Gốc tọa độ cho phần info */
    border-radius: 20px;
    overflow: hidden;
   
  
}

.sec-6-diamond-lips-process-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ảnh lấp đầy khung */
    display: block;
}

/* Position text nằm trong ảnh */
.sec-6-diamond-lips-process-info {
        position: absolute;
    bottom: 30px;
    left: 176px;
    right: 4px;
    z-index: 2;
    padding: 15px 20px;
    border-radius: 15px;
}

.sec-6-diamond-lips-process-title {
    font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 5px 0;
    /* Gradient cho tiêu đề */
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.sec-6-diamond-lips-process-desc {
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    line-height: 1.4;
     background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    margin: 0;
}

/* Responsive cho Mobile */
@media (max-width: 767px) {
    .sec-6-diamond-lips-process-grid {
        grid-template-columns: 1fr;
    }
    .sec-6-diamond-lips-process-item {
        height: 280px;
    }
    .sec-6-diamond-lips-process-info {
        bottom: 15px;
        left: 15px;
        right: 15px;
        padding: 10px 15px;
    }
}

/*Sectin 7 **/

.sec-7-diamond-lips-title-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 50px;
}

/* Hiệu ứng Gradient chung */
.sec-7-diamond-lips-gradient-text {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.2;
    /* Padding và margin âm để tránh bị cắt nét chữ nghệ thuật */
    padding: 0px 15px;
    margin: -10px -20px;
}

/* Cấu trúc dòng */
.sec-7-diamond-lips-row-1, 
.sec-7-diamond-lips-row-2 {
    display: flex;
    align-items: baseline; /* Căn thẳng hàng chân chữ */
    gap: 15px;
}

/* Dòng 2 thụt lề vào trong tạo bố cục so le */
.sec-7-diamond-lips-row-2 {
    margin-top: -50px; /* Kéo dòng 2 sát dòng 1 */
    margin-left: 180px; 
}

/* Các kiểu Font định nghĩa theo yêu cầu */
.sec-7-diamond-lips-script-big {
    font-family: 'UTM-Edwardian', cursive;
    font-weight: normal;
    font-size: 120px;
}

.sec-7-diamond-lips-text-normal {
    font-family: 'IvyPrestoDisplay', serif;
    font-weight: 400;
    font-size: 45px;
}

.sec-7-diamond-lips-text-medium {
    font-family: 'IvyPrestoDisplay', serif;
    font-weight: 400;
    font-size: 55px;
}

.sec-7-diamond-lips-text-small {
    font-family: 'IvyPrestoDisplay', serif;
    font-weight: 400;
    font-size: 30px;
}

/* Responsive cho Mobile */
@media (max-width: 768px) {
    .sec-7-diamond-lips-row-2 {
        margin-left: 50px;
    }
    .sec-7-diamond-lips-script-big { font-size: 80px; }
    .sec-7-diamond-lips-text-medium { font-size: 35px; }
    .sec-7-diamond-lips-text-normal { font-size: 28px; }
}


/***Sec 8**/
.sec-7-1-diamon-flips-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0px 20px;
}

.sec-7-1-diamon-flips-grid {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 15px;
}

.sec-7-1-diamon-flips-item {
    flex: 1;
    position: relative; /* Làm gốc tọa độ */
    display: flex;
    flex-direction: column;
}

/* So le cao thấp */
.sec-7-1-diamon-flips-item:nth-child(even) {
    margin-top: 80px;
}

.sec-7-1-diamon-flips-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* POSITION TEXT ĐÈ LÊN ẢNH */
.sec-7-1-diamon-flips-text-box {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
    text-align: center;
    pointer-events: none; /* Tránh cản trở click vào ảnh */
}

/* Định vị text cho các Item LẺ (1, 3, 5): Text thường nằm ở dưới */
.sec-7-1-diamon-flips-item:nth-child(odd) .sec-7-1-diamon-flips-text-box {
    bottom: 12%; /* Chỉnh % này để text lọt vào vùng trống phía dưới ảnh */
}

/* Định vị text cho các Item CHẴN (2, 4): Text thường nằm ở trên */
.sec-7-1-diamon-flips-item:nth-child(even) .sec-7-1-diamon-flips-text-box {
    top: 12%; /* Chỉnh % này để text lọt vào vùng trống phía trên ảnh */
}

.sec-7-1-diamon-flips-text {
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    line-height: 1.4;
    color: #451180;
    font-weight: 400;
    margin: 0;
}

/* Responsive */
@media (max-width: 1024px) {
    .sec-7-1-diamon-flips-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    .sec-7-1-diamon-flips-item:nth-child(even) {
        margin-top: 0;
    }
    /* Trên mobile có thể cần chỉnh lại vị trí text nếu ảnh co lại */
    .sec-7-1-diamon-flips-item:nth-child(odd) .sec-7-1-diamon-flips-text-box { bottom: 10%; }
    .sec-7-1-diamon-flips-item:nth-child(even) .sec-7-1-diamon-flips-text-box { top: 10%; }
}
/******Sec 8 diamon flips*******/
/* Container ngoài cùng để căn giữa toàn bộ nội dung */
.sec-8-diamond-lips-title-container {
    width: 100%;
    display: flex;
    justify-content: center; /* Căn giữa khối inner */
       padding: 20px 20px 10px 20px;
    
}

/* Khối inner giữ bố cục so le bên trong */
.sec-8-diamond-lips-title-inner {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start; /* Giữ dòng 1 và dòng 2 bắt đầu từ bên trái của khối inner */
}

/* Hiệu ứng Gradient */
.sec-8-diamond-lips-gradient-text {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.2;
    padding: 10px 30px;
    margin: -10px -30px;
}

/* Cấu trúc dòng */
.sec-8-diamond-lips-row-1, 
.sec-8-diamond-lips-row-2 {
    display: flex;
    align-items: baseline;
    gap: 15px;
    white-space: nowrap; /* Ngăn chữ bị xuống hàng */
}

/* Tạo độ lệch so le cho dòng 2 bên trong khối inner */
.sec-8-diamond-lips-row-2 {
    margin-top: -20px;
    margin-left: 120px; /* Thụt lề dòng 2 so với dòng 1 */
}

/* Font chữ */
.sec-8-diamond-lips-text-normal {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 45px;
}

.sec-8-diamond-lips-text-small {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
}

.sec-8-diamond-lips-script-big {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 120px;
}

/* Responsive */
@media (max-width: 768px) {
    .sec-8-diamond-lips-row-2 {
        margin-left: 30px;
        margin-top: -10px;
    }
    .sec-8-diamond-lips-script-big { font-size: 80px; }
    .sec-8-diamond-lips-text-normal { font-size: 30px; }
}
/* Responsive */
@media (max-width: 768px) {
	.diamond-lips-btn {
		width: 210px;
        top: -36px;
        /* height: 47px; */
        left: 27%;
        padding: 4px 20px 1px 20px;
	}
	.diamond-lips-label {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
    margin-bottom: -20px;
}
	.diamond-lips-title {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: 400;
    line-height: 0.9;
    margin: 10px 0;
}
	.diamond-lips-subtitle {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
    margin-bottom: 25px;
    text-align: center;
}
	.diamond-lips-description {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    text-align: justify;
}
	
	/* Container chính căn giữa toàn khối */
.sec-2-mobile-diamon-lips-title-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 12px 10px;
    text-align: center;
}

/* Khối inner chứa các dòng */
.sec-2-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: center; /* Căn giữa các dòng chữ */
}

/* Hiệu ứng Gradient đặc trưng */
.sec-2-mobile-diamon-lips-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.2;
    /* Tránh cắt nét chữ nghệ thuật */
    padding: 5px 20px;
    margin: -5px -20px;
}

/* Cấu trúc dòng */
.sec-2-mobile-diamon-lips-row-1 {
    margin-bottom: -10px; /* Kéo dòng 2 lên gần hơn */
}

.sec-2-mobile-diamon-lips-row-2 {
    position: relative;
    z-index: 2;
}

/* Định nghĩa Font chữ theo yêu cầu */
.sec-2-mobile-diamon-lips-text-small {
    font-family: 'IvyPrestoDisplay', serif;
    font-weight: 400;
    font-size: 30px;
    white-space: nowrap;
}

.sec-2-mobile-diamon-lips-text-script {
    font-family: 'UTM-Edwardian', cursive;
    font-weight: normal;
    font-size: 65px; /* Size theo yêu cầu của Vũ */
    padding-bottom: 10px;
}

/*sec 3 mobile*/

.sec-3-mobile-diamond-lips-container {
    padding: 20px 0;
    overflow: hidden;
}

.sec-3-mobile-diamond-lips-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding: 0 15px;
    scrollbar-width: none;
}

.sec-3-mobile-diamond-lips-grid::-webkit-scrollbar {
    display: none;
}

.sec-3-mobile-diamond-lips-item {
    flex: 0 0 80%; /* Hiển thị 1.2 ảnh */
    scroll-snap-align: start;
}

/* Container chứa ảnh làm gốc tọa độ cho text */
.sec-3-mobile-diamond-lips-img-wrap {
    position: relative;
    width: 100%;
    border-radius: 15px;
    overflow: hidden; /* Bo góc cả ảnh và text overlay */
}

.sec-3-mobile-diamond-lips-img-wrap img {
    width: 100%;
    height: auto;
    display: block;
}

/* POSITION TEXT ĐÈ LÊN ẢNH */
.sec-3-mobile-diamond-lips-box-text {
    position: absolute;
    bottom: 10px; /* Cách đáy ảnh 10px */
    left: 10px;
    right: 10px;
    z-index: 2;
    
   color:#fff;
    
    /* Màu chữ Gradient chuẩn mã màu Vũ gửi */
   
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    padding: 10px 35px;
    border-radius: 10px;
   
}

/* Thanh Progress Bar full ngang */
.sec-3-mobile-diamond-lips-progress-container {
    width: calc(100% - 60px);
    height: 4px;
    background: #eee;
    margin: 20px auto 0;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}

.sec-3-mobile-diamond-lips-progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: #9615D2;
    width: 25%;
    transition: width 0.1s ease-out;
}
/***/
	
.sec-3-1-mobile-diamon-lips-title-wrapper {
    width: 100%;
    padding: 20px;
    display: flex;
    justify-content: center; /* Khối tổng vẫn nằm giữa màn hình */
}

.sec-3-1-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Ép tất cả các dòng bắt đầu từ bên trái */
    width: 100%;
    max-width: 350px; /* Giới hạn chiều rộng để cân đối bản mobile */
}

.sec-3-1-mobile-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    padding: 5px 5px;
}

/* Dòng 1 */
.sec-3-1-mobile-row-top {
    width: 100%;
    text-align: left;
}

/* Dòng 2: Diamond Lips */
.sec-3-1-mobile-row-middle {
    margin-top: -10px;
    padding-left: 10px; /* Nhích nhẹ sang phải một chút cho nghệ thuật như ảnh */
}

/* Dòng 3: Ép nằm trên 1 hàng */
.sec-3-1-mobile-row-bottom {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin-top: -30px;
    white-space: nowrap; /* QUAN TRỌNG: Ép không cho xuống hàng */
    width: 100%;
	margin-left: -20px;
	
}

/* Font chữ chuẩn theo yêu cầu của Vũ */
.sec-3-1-mobile-text-small {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 25px;
}

.sec-3-1-mobile-text-medium {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
}

.sec-3-1-mobile-text-script {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 65px;
}

.sec-3-1-mobile-text-script-num {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 65px;
}
.sec-4-mobile-diamon-lips-title-wrapper {
    width: 100%;
    padding: 20px;
    display: flex;
    justify-content: center;
}

.sec-4-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: fit-content;
	transform: translateY(29px);
}

/* Hiệu ứng Gradient */
.sec-4-mobile-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    padding: 5px 5px; /* Thu nhỏ padding để các dòng khít nhau hơn */
}

/* Dòng 1: Căn trái */
.sec-4-mobile-row-1 {
    width: 100%;
    text-align: center;
}

/* Dòng 2: dẫn đầu xu hướng - Ép 1 hàng và thụt lề */
    .sec-4-mobile-row-2 {
        display: flex;
        align-items: baseline;
        gap: 2px;
        margin-top: -15px;
        padding-left: 0px;
        white-space: nowrap;
    }

/* Dòng 3: tại Linh Anh - Ép 1 hàng và thụt lề thêm */
    .sec-4-mobile-row-3 {
        display: flex;
        align-items: baseline;
        gap: 0px;
        margin-top: -10px;
        padding-left: 80px;
        white-space: nowrap;
    }

/* Định nghĩa Font */
.sec-4-mobile-text-30 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
}

.sec-4-mobile-text-25 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 25px;
}

.sec-4-mobile-text-script {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
}

/* Responsive cho Mobile nhỏ */
@media (max-width: 380px) {
    .sec-4-mobile-row-2 { padding-left: 20px; }
    .sec-4-mobile-row-3 { padding-left: 50px; }
}
	.sec-4-1-diamond-lips-text {
		font-size:18px;
	}

/*****/	
.sec-5-mobile-diamon-lips-title-wrapper {
    width: 100%;
    padding: 20px;
    display: flex;
    justify-content: center; /* Căn khối tiêu đề vào giữa màn hình */
}

.sec-5-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: fit-content;
}

/* Hiệu ứng Gradient chuẩn mã màu Linh Anh */
.sec-5-mobile-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    padding: 5px 5px;
}

/* Dòng 1: Bắt đầu từ bên trái */
.sec-5-mobile-row-1 {
    display: flex;
    align-items: baseline;
    gap: 0px;
    white-space: nowrap;
}

/* Dòng 2: Thụt lề vào giữa */
.sec-5-mobile-row-2 {
    display: flex;
    align-items: baseline;
    gap: 2px;
    margin-top: -44px; 
    padding-left: 20px;
    white-space: nowrap;
}

/* Dòng 3: Thụt lề sâu hơn (Căn phải khối) */
.sec-5-mobile-row-3 {
    display: flex;
    align-items: baseline;
    gap: 2px;
    margin-top: -10px;
    padding-left: 120px; /* Thụt lề sâu để chữ "tại Linh Anh" nằm phía bên phải */
    white-space: nowrap;
}

/* Định nghĩa Font theo yêu cầu */
.sec-5-mobile-text-30 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
    font-weight: 400;
}

.sec-5-mobile-text-25 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 25px;
    font-weight: 400;
}

.sec-5-mobile-text-script-80 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: normal;
}	

	
	/******/
	
.sec-6-mobile-diamon-lips-title-wrapper {
    width: 100%;
    padding: 20px 10px;
    display: flex;
    justify-content: center;
    text-align: center;
}

.sec-6-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: center; /* Căn giữa tất cả các dòng */
    width: 100%;
}

/* Hiệu ứng Gradient chuẩn màu Vũ gửi */
.sec-6-mobile-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
}

/* Dòng 1: Quy trình Cấy môi */
.sec-6-mobile-row-1 {
    margin-bottom: -10px; /* Kéo dòng 2 lên sát hơn */
}

/* Dòng 2: Diamond Lips */
.sec-6-mobile-row-2 {
    position: relative;
    z-index: 2;
            padding: 5px 10px 19px 2px;
}

/* Dòng 3: tại Linh Anh */
.sec-6-mobile-row-3 {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: -15px; /* Kéo dòng 3 lồng vào nét móc của Diamond Lips */
}

/* Định nghĩa Font theo yêu cầu của Vũ */
.sec-6-mobile-text-30 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
    font-weight: 400;
}

.sec-6-mobile-text-25 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 25px;
    font-weight: 400;
}

.sec-6-mobile-text-script {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 70px;
    font-weight: normal;
	padding-right: 0.4rem;
}

/* Responsive tinh chỉnh cho Mobile nhỏ */
@media (max-width: 375px) {
   
    .sec-6-mobile-row-3 { margin-top: -10px; }
}	
}

.sec-7-mobile-diamon-lips-title-wrapper {
    width: 100%;
    padding: 30px 20px;
    display: flex;
    justify-content: center; /* Căn giữa khối trên mobile */
}

.sec-7-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Bố cục so le từ trái sang */
    width: fit-content;
}

/* Hiệu ứng Gradient chuẩn màu Vũ gửi */
.sec-7-mobile-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    padding: 5px 5px;
}

/* Dòng 1: Bắt đầu từ bên trái */
.sec-7-mobile-row-1 {
    display: flex;
    align-items: baseline;
    gap: 8px;
    white-space: nowrap;
}

/* Dòng 2: Thụt lề vào giữa */
.sec-7-mobile-row-2 {
    display: flex;
    align-items: baseline;
    gap: 0px;
   margin-top: -50px; /* Kéo sát lên dòng 1 */
    margin-bottom: -11px;
    padding-left: 16px; /* Tạo độ lệch so le */
    white-space: nowrap;
}

/* Dòng 3: Thụt lề sâu hơn sang phải */
.sec-7-mobile-row-3 {
    display: flex;
    align-items: baseline;
    gap: 2px;
    margin-top: 0px;
    padding-left: 90px; /* Đẩy cụm cuối sang phải */
    white-space: nowrap;
}

/* Định nghĩa Font theo yêu cầu của Vũ */
.sec-7-mobile-text-30 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
    font-weight: 400;
}

.sec-7-mobile-text-25 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 25px;
    font-weight: 400;
}

.sec-7-mobile-text-script {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: normal;
}

/* Responsive tinh chỉnh cho Mobile nhỏ */
@media (max-width: 375px) {
   
    .sec-7-mobile-row-2 { padding-left: 15px; }
    .sec-7-mobile-row-3 { padding-left: 60px; }
}

.sec-8-mobile-diamon-lips-title-wrapper {
    width: 100%;
    padding: 30px 0px;
    display: flex;
    justify-content: center;
    text-align: center;
}

.sec-8-mobile-diamon-lips-title-inner {
    display: flex;
    flex-direction: column;
    align-items: center; /* Căn giữa cả 2 dòng */
    width: 100%;
}

/* Hiệu ứng Gradient chuẩn Linh Anh */
.sec-8-mobile-gradient {
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    display: inline-block;
    line-height: 1.1;
    /* Bảo vệ nét móc chữ UTM Edwardian */
    padding: 5px 5px;
    margin: -5px -15px;
}

/* Cấu trúc dòng 1 */
.sec-8-mobile-row-1 {
    width: 100%;
    margin-bottom: -15px; /* Kéo dòng chữ nghệ thuật lên gần hơn */
}

/* Cấu trúc dòng 2: Diamond Lips */
.sec-8-mobile-row-2 {
    position: relative;
    z-index: 2;
}

/* Định nghĩa Font theo yêu cầu của Vũ */
.sec-8-mobile-text-30 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 30px;
    font-weight: 400;
}

.sec-8-mobile-text-script {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: normal;
}

/* Responsive cho Mobile cực nhỏ */
@media (max-width: 375px) {

    .sec-8-mobile-row-1 { margin-bottom: -10px; }
}



/* Class đặc biệt: Diamond Flips */
.video-container-dimamon-flips {
	    width: 1150px;
    height: 650px;
    border-radius: 30px; /* Bo góc mượt */
    overflow: hidden;
    position: relative;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
    transition: transform 0.5s ease, box-shadow 0.5s ease;
 
}

/* Hiệu ứng khi hover (lật nhẹ hoặc nổi lên) */
.video-container-dimamon-flips:hover {
    transform: translateY(-5px) scale(1.01); /* Nhích nhẹ lên tạo cảm giác nổi */
    box-shadow: 0 20px 40px rgba(113, 13, 172, 0.3); /* Đổ bóng màu tím nhẹ */
}

.video-container iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: none;
}

.sec-5-text-diamon-flip {
	font-weight:400;
	font-size:20px;
	line-height:24px;
	font-family: 'Geomanist', serif;
	background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
	
}


.diamond-box {
    /* 1. Cố định kích thước theo Figma */
    width: 502px;
    height: 126px;
    background-image: url('/wp-content/uploads/2026/05/bao-chung-de.png');
    background-size: 100% 100%; /* Đảm bảo ảnh nền luôn khớp khít 502x126 */
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 40px; 
    box-sizing: border-box;
    border-radius: 16px;
    overflow: hidden;
	position: relative;
    bottom: -29px;
}

.diamond-text {
    color: #FFFFFF;
   /* Font chữ từ Figma */
    font-family: 'Geomanist', sans-serif; /* Đảm bảo bạn đã nhúng font Geomanist vào web */
    font-size: 20px;
    font-weight: 400; /* Regular */
    
    /* Khoảng cách dòng và chữ */
    line-height: 30px; 
    letter-spacing: 0px;
    text-align: center;
   
    margin: 0;
    
    /* Chống tràn chữ nếu text quá dài */
    display: -webkit-box;
    -webkit-line-clamp: 4; /* Giới hạn tối đa 3 dòng */
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/* --- GIAO DIỆN MOBILE (Dưới 768px) --- */
@media (max-width: 767px) {
    .diamond-box {
        /* Thay đổi thông số theo Figma Mobile */
        width: 284px; 
        height: 118px;
        
        /* Thay đổi link ảnh Mobile */
        background-image: url('https://sub.thammylinhanh.com/wp-content/uploads/2026/04/bao-chung.png');
        
        /* Cập nhật bo góc theo Figma Mobile (Appearance: 8) */
        border-radius: 8px;
        
        /* Padding nhỏ lại cho Mobile */
        padding: 0 20px;
    }

    .diamond-text {
        /* Giảm size chữ để không bị tràn trên Mobile */
        font-size: 16px; 
        line-height: 22px;
        padding: 0 5px;
    }
	.video-container-dimamon-flips {
	    width: 360px;
    height: 222px;
    border-radius: 30px; /* Bo góc mượt */
    overflow: hidden;
    position: relative;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
    transition: transform 0.5s ease, box-shadow 0.5s ease;
 
}

}


.sec-6-mobile-diamond-process-wrapper {  
    margin: 0 auto;
}

.sec-6-mobile-diamond-process-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Mobile chia 2 cột theo yêu cầu */
    gap: 15px;
}

.sec-6-mobile-diamond-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    /* Hiệu ứng ẩn hiện lần lượt */
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.6s ease forwards;
}

.sec-6-mobile-diamond-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* POSITION TEXT NẰM TRONG ẢNH */
.sec-6-mobile-diamond-info {
    position: absolute;
    top: 44%;
    left: 0;
    width: 100%;
    padding: 10px 5px 20px 5px; /* Căn chỉnh text lọt lòng khung ảnh */
    text-align: center;
    box-sizing: border-box;
}

.sec-6-mobile-diamond-sub {
    display: block;
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 500;
    margin-bottom: 5px;
}

.sec-6-mobile-diamond-desc {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px; /* Size nhỏ để lọt vào khung trên mobile 2 cột */
    line-height: 1.3;
     background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    margin: 0;
    font-weight: 400;
}

/* KEYFRAMES ANIMATION */
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* SET DELAY CHO 6 BƯỚC HIỂN THỊ LẦN LƯỢT */
.sec-6-mobile-diamond-item:nth-child(1) { animation-delay: 0.1s; }
.sec-6-mobile-diamond-item:nth-child(2) { animation-delay: 0.2s; }
.sec-6-mobile-diamond-item:nth-child(3) { animation-delay: 0.3s; }
.sec-6-mobile-diamond-item:nth-child(4) { animation-delay: 0.4s; }
.sec-6-mobile-diamond-item:nth-child(5) { animation-delay: 0.5s; }
.sec-6-mobile-diamond-item:nth-child(6) { animation-delay: 0.6s; }

/* PC Dàn 3 cột */
@media (min-width: 768px) {
	.sec-2-tc-pmtx-nn {
		    margin-top: -73px;
	}
    .sec-6-mobile-diamond-process-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .sec-6-mobile-diamond-desc {
        font-size: 14px;
    }
}


/************** HairStroke *****************/
.hair-stoke-banner-lp {
	position: absolute;
    bottom: 11%;
    left: 12%;
    right: 0;
}
.diamon-lips-banner-lp {
	position: absolute;
    bottom: 8%;
    left: -68%;
    right: 0;
}
.diamon-lips-banner-lp .diamond-lips-btn {
	    position: absolute;
    top: 70%;
    left: -63%;
    width: 235px !important;
    border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
    font-weight: 400 !important;
    padding: 0px 6px 0px 15px;
    font-size: 20px !important;
    background: #710DAC !important;
	
}

/* Tùy chỉnh toàn bộ các trường nhập liệu của Contact Form 7 */
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-text,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-number,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-tel,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-email,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-textarea,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-select {
    width: 100%;
    /* Thông số từ hình ảnh */
    background: linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
    border: 1px solid #E0E0E0; /* Viền mảnh nhẹ */
    border-radius: 24px;        /* Bo góc (ước tính từ thiết kế) */
    padding: 10px 15px;        /* Khoảng cách chữ bên trong */
    font-size: 14px;
    color: #333;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
	margin-bottom:20px;
    /* Hiệu ứng Đổ bóng (Drop Shadow) dựa trên thông số Figma: 
       X: 4, Y: 4, Blur: 4, Spread: 0, Color: #3B017C (20%) */
   
	height:45px;
}

/* Hiệu ứng khi người dùng click vào ô nhập liệu (Focus) */
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-text:focus,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-textarea:focus {
    border-color: #3B017C; /* Đổi viền sang màu tím chủ đạo */
    box-shadow: 4px 4px 8px 0px rgba(59, 1, 124, 0.3); /* Đổ bóng đậm hơn một chút */
}


.diamon-lips-banner-lp .wpcf7-submit:hover {
    background: #3B017C;
    box-shadow: 0px 6px 15px rgba(59, 1, 124, 0.4);
}
/* Tùy chỉnh Placeholder cho Contact Form 7 */

/* Chrome, Firefox, Opera, Safari 10.1+ */
.diamon-lips-banner-lp .wpcf7-form-control::placeholder {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.29;
    color: #000000;
    opacity: 0.6; /* Độ mờ để phân biệt với chữ đang nhập */
}

/* Internet Explorer 10-11 */
.diamon-lips-banner-lp .wpcf7-form-control:-ms-input-placeholder {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.29;
    color: #000000;
}

/* Microsoft Edge */
.diamon-lips-banner-lp .wpcf7-form-control::-ms-input-placeholder {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.29;
    color: #000000;
}

/* Tùy chỉnh font chữ cho cả văn bản khi người dùng đang gõ */
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-text,
.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-textarea {
    font-family: 'Geomanist', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
    color: #000000;
	
}


/******/
/* Layout chính */
.se3-diamond-lips-section {
   
    padding: 50px 0;
}

.se3-diamond-lips-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 15px;
}

.se3-diamond-lips-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

/* Các class có tiền tố yêu cầu */
.se3-diamond-lips-col-step-item {
    display: flex;
    flex-direction: row; /* Số 1 bên, chữ 1 bên */
    align-items: flex-start; /* Gióng hàng theo đỉnh */
    gap: 12px; /* Khoảng cách giữa số và chữ */
}

.se3-diamond-lips-col-step-num {
	
    font-size: 45px;
    font-weight: 400;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    line-height: 55px; /* Giúp số ngang hàng với dòng text đầu tiên */
   font-family: 'IvyPrestoDisplay', serif;
            
}

.se3-diamond-lips-col-step-text {
	 font-family: 'Geomanist', sans-serif;
    font-size: 20px;
    font-weight: 400;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    line-height: 1.5;
    margin: 0;
}

/* Responsive */
@media (max-width: 1024px) {
    .se3-diamond-lips-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .se3-diamond-lips-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}
/**********************/

.video-shorts__grid {
    display: flex;
    gap: 30px;
    justify-content: center;
    flex-wrap: wrap
}

.video-short-item {
    flex: 0 0 240px;
    aspect-ratio: 9 / 16;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    background: #000
}

.video-short-item img,.play-overlay {
    display: none
}

/* Container bao ngoài */
.sec-shorts-mobile-diamond {
    padding: 20px 0;
    
    overflow: hidden;
}

/* Khung slider vuốt ngang mượt mà */
.sec-shorts-mobile-diamond .video-shorts__slider {
    display: flex;
    gap: 15px;
    overflow-x: auto;
    scroll-snap-type: x mandatory; /* Hút video vào giữa khi vuốt */
    padding: 0 15px;
    scrollbar-width: none; /* Ẩn thanh cuộn Firefox */
}

.sec-shorts-mobile-diamond .video-shorts__slider::-webkit-scrollbar {
    display: none; /* Ẩn thanh cuộn Chrome/Safari */
}

/* Item video Shorts */
.sec-shorts-mobile-diamond .video-short-item {
    flex: 0 0 75%; /* Hiển thị 75% chiều rộng để lộ video kế tiếp */
    aspect-ratio: 9 / 16; /* ÉP TỶ LỆ DỌC CHUẨN */
    background: #000;
    border-radius: 20px; /* Bo góc */
    position: relative;
    scroll-snap-align: center;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}

/* Ép iframe full màn hình không để lại khoảng đen */
.sec-shorts-mobile-diamond .video-short-item iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: none;
    object-fit: cover;
}

/* Fix lỗi cho Desktop nếu dùng chung class */
@media (min-width: 1024px) {
    .sec-shorts-mobile-diamond .video-shorts__slider {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        overflow-x: hidden;
        gap: 25px;
        padding: 0 50px;
    }
    .sec-shorts-mobile-diamond .video-short-item {
        flex: none;
        width: 100%;
    }
}

/*****/

/* Tên class chính theo yêu cầu */
.sec-banner-diamond-flips {
    width: 100%;
    max-width: 550px; /* Độ rộng tối đa của form */
    margin: 0 auto;
	
    position: relative;
}

.sec-banner-diamond-flips .form-container-relative {
    position: relative;
    overflow: hidden;
}

.sec-banner-diamond-flips .form-img-bg {
    width: 100%;
    display: block;
    height: auto;
}

/* Lớp phủ chứa các trường dữ liệu */
.sec-banner-diamond-flips .form-content-overlay {
    position: absolute;
    top: 42%; /* Bắt đầu từ ô 'Họ và tên' */
    left: 50%;
    transform: translateX(-50%);
    width: 78%; /* Độ rộng của vùng chứa các ô input trắng */
}

/* Định dạng chung cho Input và Select của CF7 */
.sec-banner-diamond-flips input:not([type="submit"]),
.sec-banner-diamond-flips select {
    width: 100% !important;
    height: 44px; /* Độ cao khớp với thanh trắng trên ảnh */
    
    margin-bottom: 15px !important; /* Khoảng cách giữa các ô */
    padding: 0 15px !important;
    font-size: 14px;
	 background: linear-gradient(180deg, #FFFFFF 0%, #F3EDFF 100%);
    border: 1px solid #E0E0E0; /* Viền mảnh nhẹ */
    border-radius: 24px;        /* Bo góc (ước tính từ thiết kế) */
    padding: 10px 15px;        /* Khoảng cách chữ bên trong */
    font-size: 14px;
    color: #333;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
	margin-bottom:20px;
    /* Hiệu ứng Đổ bóng (Drop Shadow) dựa trên thông số Figma: 
       X: 4, Y: 4, Blur: 4, Spread: 0, Color: #3B017C (20%) */
    box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
    outline: none !important;
    box-shadow: none !important;
}

/* Định dạng riêng cho ô Select (Dịch vụ tư vấn) */
.sec-banner-diamond-flips select {
    cursor: pointer;
    -webkit-appearance: none; /* Ẩn mũi tên mặc định nếu cần */
}

/* Định dạng nút Đăng ký ngay */
.sec-banner-diamond-flips input[type="submit"] {
    width: 70% !important;
    height: 48px;
     border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
    font-weight: 400 !important;
    padding: 0px 6px 0px 15px;
    font-size: 20px !important;
    background: #710DAC !important;
    text-transform: uppercase;
    cursor: pointer;
    margin: 10px auto 0 !important;
    display: block;
    font-size: 16px;
    letter-spacing: 1px;
	position:absolute;
	left:0;
	right:0;
	top:112%;
	bottom:0;
}


.sec-banner-diamond-flips .wpcf7-form-control-wrap {
    display: block;
}

/* Container tổng */
.sec2-mobile-dimamond-flips {
    background-color: #f3efff; /* Màu nền tím nhạt */
  
}

/* Chia lưới 2 cột, 2 hàng */
.sec2-mobile-dimamond-flips .diamond-grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    position: relative;
}

/* Đường kẻ dọc và ngang ở giữa */
.sec2-mobile-dimamond-flips .diamond-item {
    padding: 20px 5px;
    display: flex;
    align-items: center;
    position: relative;
}

/* Kẻ sọc dọc giữa */
.sec2-mobile-dimamond-flips .diamond-item:nth-child(odd) {
    border-right: 1.5px solid #9615D2; /* Màu tím đậm của đường kẻ */
}

/* Kẻ sọc ngang giữa (cho 2 ô đầu) */
.sec2-mobile-dimamond-flips .diamond-item:nth-child(1),
.sec2-mobile-dimamond-flips .diamond-item:nth-child(2) {
    border-bottom: 1.5px solid #9615D2;
}

/* Định dạng số */
.sec2-mobile-dimamond-flips .number {
	 font-family: 'IvyPrestoDisplay', serif;
    font-size: 32px;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 300;
    margin-right: 8px;
    line-height: 1;
}

/* Định dạng nội dung chữ */
.sec2-mobile-dimamond-flips .content {
	 font-family: 'Geomanist', sans-serif;
    font-size: 14px;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    margin: 0;
    line-height: 1.4;
    font-weight: 400;
}

/* Chỉnh lại khoảng cách cho ô 3 và 4 không bị dính sát lề dưới */
.sec2-mobile-dimamond-flips .diamond-item:nth-child(3),
.sec2-mobile-dimamond-flips .diamond-item:nth-child(4) {
    padding-top: 25px;
}


/**********/
.sec-7-mobi-diamond-flips-container {
        max-width: 450px; /* Độ rộng phù hợp giao diện mobile */
        margin: 0 auto;
       
    }

    .sec-7-mobi-diamond-flips-item {
        position: relative; /* Gốc tọa độ để lớp text bám vào */
        width: 100%;
        margin-bottom: 35px; /* Khoảng cách giữa các ảnh */
    }

    .sec-7-mobi-diamond-flips-image {
        width: 100%; /* Thu nhỏ ảnh lại một chút để chừa không gian cho text lòi ra ngoài */
        margin: 0 auto; /* Căn giữa ảnh */
    }

    .sec-7-mobi-diamond-flips-image img {
        width: 100%;
        display: block;
        border-radius: 100px; /* Hình Oval */
        box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    }

    .sec-7-mobi-diamond-flips-text-box {
        position: absolute;
        top: 50%; /* Căn giữa dọc */
        transform: translateY(-50%); /* Fix căn giữa dọc */
        width: 52%; /* Chiều rộng box chữ */
       
        padding: 12px 18px;
        z-index: 5;
        
    }

    /* Đưa text sang PHẢI */
    .pos-right {
        right: 0;
        text-align: center;
    }

    /* Đưa text sang TRÁI */
    .pos-left {
        left: 0;
        text-align: center;
    }

    .sec-7-mobi-diamond-flips-text-box p {
        margin: 0;
        font-family: 'Geomanist', sans-serif;
    font-size: 16px;
   background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; 
		font-weight:400;
        line-height: 1.3;
    }

    /* Chỉnh kích thước cho màn hình cực nhỏ */
    @media (max-width: 375px) {
        .sec-7-mobi-diamond-flips-text-box {
            width: 75%;
            padding: 10px;
        }
        .sec-7-mobi-diamond-flips-text-box p {
            font-size: 13px;
        }
    }

/******/
/* TỔNG QUAN SECTION */
.sec2-diamond-flips-nn-moible {
    padding: 0;
    background-color: #f9f5ff;
}

.sec2-diamond-flips-nn-moible .v-improvement-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* GỐC TỌA ĐỘ CHO TEXT */
.sec2-diamond-flips-nn-moible .v-img-box {
    position: relative; /* QUAN TRỌNG: Để overlay bám theo div này */
    width: 100%;
    line-height: 0;
    overflow: hidden;
    border-radius: 15px;
}

.sec2-diamond-flips-nn-moible .v-img-box img {
    width: 100%;
    height: auto;
    display: block;
}

/* KHỐI NỘI DUNG POSITION THEO DIV .V-IMG-BOX */
.sec2-diamond-flips-nn-moible .v-content-overlay {
    position: absolute;
    bottom: 25px; /* Cách đáy ảnh 25px */
    left: -1px;   /* Cách lề trái ảnh 20px */
    
    display: flex;
    align-items: center; /* Căn giữa số và chữ theo chiều dọc */
    gap: 8px;
    z-index: 5;
    pointer-events: none; /* Tránh cản trở việc click vào ảnh */
}

/* SỐ (UTM Edwardian 80px) */
.sec2-diamond-flips-nn-moible .v-number {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
    font-weight: 400;
    background: linear-gradient(180deg, #9615D2 0%, #451180 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
}

/* MÔ TẢ (Geomanist 18px) */
.sec2-diamond-flips-nn-moible .v-des {
    font-family: 'Geomanist', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #451180;
    line-height: 1.2;
    margin: 0;
    white-space: nowrap; /* Giữ text trên 1 hàng như mẫu 6a36d7 */
}

/* Tự động viết hoa chữ đầu */
.sec2-diamond-flips-nn-moible .v-des::first-letter {
    text-transform: uppercase;
}
/* TỔNG QUAN SECTION */
.sec-ptxtm-video {
    padding: 60px 0;
    width: 100%;
}

.sec-ptxtm-video .v-container {
    max-width: 1200px; /* Độ rộng tối đa của vùng chứa video */
    margin: 0 auto;
    padding: 0 15px;
}

/* KHỐI BAO VIDEO ĐỂ BO GÓC */
.sec-ptxtm-video .v-video-wrapper {
    position: relative;
    width: 100%;
    /* Bo góc 20px như yêu cầu */
    border-radius: 20px; 
    overflow: hidden; /* Cắt các góc nhọn của video bên trong */
    
    /* ĐỔ BÓNG THEO THÔNG SỐ ẢNH 68e880 (X4 Y4 Blur4 #3B017C 20%) */
    box-shadow: 4px 4px 4px 0px rgba(59, 1, 124, 0.2);
    
    /* Giữ tỉ lệ 16:9 chuẩn Youtube */
    aspect-ratio: 16 / 9;
    line-height: 0;
}

/* ĐỊNH DẠNG IFRAME BÊN TRONG */
.sec-ptxtm-video .v-video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* RESPONSIVE CHO MOBILE */
@media (max-width: 768px) {
    .sec-ptxtm-video {
        padding: 30px 0;
    }
    .sec-ptxtm-video .v-video-wrapper {
        border-radius: 15px; /* Giảm nhẹ bo góc trên màn hình nhỏ cho cân đối */
    }
}
@media (max-width: 390px) { 
	.sec-7-mobile-pxtm-nn .v-overlay-text {
		bottom: 12%;
	}
	
	
}
/**** Trang cảm ơn ****/
@media screen and (min-width: 391px) and (max-width: 500px) {
   .sec-7-mobile-pxtm-nn .v-overlay-text {
		bottom: 7%;
	}
}


/*********************************************************************************************************************/
.facilities {
    padding: 60px 0;
}

.facilities__header { margin-bottom: 40px; }

.facilities__title {
    display: flex; flex-direction: column; align-items: center; text-align: center;
}

.fc-title-top {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 110px; color: #9615D2;
    margin-bottom: -45px; position: relative; z-index: 1;
}

.fc-title-pill {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 35px; color: #7F6337;
    border: 1px solid #9615D2; border-radius: 50px;
    padding: 5px 30px; background: rgba(255, 255, 255, 0.8);
    position: relative; z-index: 2; margin-left: 150px;
}

.fc-title-bottom {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 58px; font-weight: 500;
    background: linear-gradient(360deg, #B69655 0%, #E3C871 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

.facilities__cards {
    display: flex; flex-direction: column; gap: 30px;
    max-width: 1340px; margin: 0 auto;
}

.facility-card__main {
    display: flex; 
	align-items: stretch; 
	border-radius: 40px;
border: 1.391px solid rgba(255, 255, 255, 0.90);
background: var(--nn-shape, linear-gradient(180deg, #FFF 0%, #F3EDFF 100%));
box-shadow: 4px 4px 4px 0 rgba(59, 1, 124, 0.20);
    overflow: hidden;
}

.facility-card__feature-image {
    flex: 0 0 55%; max-width: 55%; padding: 25px;
}

.facility-card__feature-image img {
    width: 100%; height: 100%; object-fit: cover; border-radius: 20px;
}

.facility-card__info {
    flex: 1; padding: 40px; display: flex; flex-direction: column; justify-content: center;text-align:center;
}

.facility-card__title {
    font-family: 'Geomanist', sans-serif; font-size: 28px;  background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; margin-bottom: 15px; text-transform:uppercase;font-weight:500;
}

.facility-card__desc {
    font-family: 'Geomanist', sans-serif; font-size: 18px;  background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; line-height: 1.6;
}

/* Gallery & Thumbnails */
.facility-gallery {
    
    display: flex;
    gap:1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;

}

@media (min-width: 769px) {
    .facility-gallery {
        scrollbar-width: thin;
        scrollbar-color: #710DAC #efefef;
        padding-bottom: 12px;
    }
}
.facility-card__gallery-wrap {
    padding: 1rem;
   
}
.facility-gallery__thumb {
    flex: 0 0 auto; width: 160px; height: 110px; border-radius: 15px;
    overflow: hidden; border: 2px solid transparent; cursor: pointer; padding: 0;
}

.facility-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }

.facility-gallery__thumb.is-active { border-color: #9615D2; }
.facility-gallery__track-bar {
    margin-top: 0.75rem;
    height: 3px;
    border-radius:999px;
    background: #E2DDD6;
    overflow: hidden;
}

.facility-gallery__track-progress {
    height: 100%;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    transition: width 0.1s linear;
}
@media (min-width: 769px) {
    .facility-gallery__track-bar {
        display: none;
    }
}
/* ─── Lightbox ───────────────────────────────────────── */
.facility-lightbox {
    position: fixed;
    inset: 0;
    z-index:  1000;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
}

.facility-lightbox[hidden] {
    display: none;
}

.facility-lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(20, 14, 6, 0.88);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.facility-lightbox__container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: var(--space-4);
    max-width: min(90vw, 1200px);
    width: 100%;
    padding-inline: var(--space-4);
}

.facility-lightbox__image-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    overflow: hidden;
    max-height: 80vh;
}

.facility-lightbox__image {
    display: block;
    max-width: 100%;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    transition: opacity 0.25s ease;
}

.facility-lightbox__caption {
    position: absolute;
    bottom: -32px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, 0.7);
    font-family: var(--font-body);
    font-size: 13px;
    white-space: nowrap;
}

/* Nav buttons */
.facility-lightbox__prev,
.facility-lightbox__next {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(8px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.25s ease, transform 0.2s ease;
}

.facility-lightbox__prev:hover,
.facility-lightbox__next:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: scale(1.1);
}

/* Close button */
.facility-lightbox__close {
    position: absolute;
    top: -50px;
    right: 0;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.25s ease, transform 0.2s ease;
    z-index: 3;
}

.facility-lightbox__close:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: rotate(90deg);
}

/* ─── Mobile Responsive ──────────────────────────────── */
@media (max-width: 1024px) {
    .facilities__cards {
        max-width: 100%;
    }

    .fc-title-top {
        font-size: 80px;
        margin-bottom: -32px;
    }

    .fc-title-pill {
        font-size: 32px;
        margin-left: 80px;
    }

    .fc-title-bottom {
        font-size: 44px;
    }
}

@media (max-width: 768px) {
	.is-featured::before {
		top: -9px!important;
    right: 70px!important;
    width: 300px!important;
    height: 91px!important;
	
	}
	.sec-10-phun-moi-mm-wrapper {
		padding:0px;
	}
    .fc-title-top {
        font-size: 64px;
        margin-bottom: -25px;
        left: -8%;
    }

    .fc-title-pill {
        font-size: 26px;
        padding: 6px 18px;
        margin-left: -113px;
        top: -10px;
    }

    .fc-title-bottom {
        font-size: 34px;
    }

    .facility-card__main {
        flex-direction: column;
    }

    .facility-card__feature-image {
        flex: none;
        max-width: 100%;
        border-radius: 38px;
        z-index: 2;
        background: #fff;
        padding: 1.3rem;
    }

    .facility-card__info {
        padding: var(--space-6) var(--space-4);
    }

    .facility-card__title {
        font-size: 18px;
    }

    .facility-gallery__thumb {
               width: 129px;
        height: 102px;
    }

    .facility-lightbox__container {
        gap: var(--space-2);
        padding-inline: var(--space-2);
    }

    .facility-lightbox__prev,
    .facility-lightbox__next {
        width: 38px;
        height: 38px;
    }
}
/****************************************************************************************/
.sec-4-mobile-nn-container {  padding-bottom: 50px; }

/* Slider */
.m-expert-slider {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 15px;
    padding: 0 20px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.m-expert-slider::-webkit-scrollbar { display: none; }

.m-expert-card {
    min-width: 85vw; /* Độ rộng mỗi card */
    scroll-snap-align: center;
}

.m-expert-relative { position: relative; border-radius: 20px; overflow: hidden; }
.m-expert-relative img { width: 100%; display: block; }

/* Box Text & Button (Position Absolute) */
.m-expert-info-box {
    position: absolute;
    top: 50%;
    left: 20px;
    right: 20px;
    background: rgba(255, 255, 255, 0.9);
    padding: 15px;
    border-radius: 15px;
    transform: translateY(-50%);
}
.m-expert-btn-box {
    position: absolute;
    bottom: 20px;
    width: 100%;
    text-align: center;
}

/* Progress Bar Styling */
.m-progress-wrapper {
    margin-top: 30px;
    display: flex;
    justify-content: center;
}
.m-progress-container {
    width: 200px; /* Chiều dài tổng của thanh bar */
    height: 4px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}
.m-progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 25%; /* (100% / 4 ảnh) */
    background: linear-gradient(90deg, #B915D2, #3D037D);
    border-radius: 10px;
    will-change: transform; /* Tối ưu hiệu năng */
}
.sec-4-mobile-nn-container .sec4-pxtm-nn-tc-ivy-555 {
    font-family: 'IvyPrestoDisplay', serif;
    font-size: 35px;
   color:#fff;
    font-weight: 400;
}
.sec-4-mobile-nn-container .sec4-pxtm-nn-tc-ivy-555.v-nowrap {
	    margin-bottom: -85px;
}
.sec4-pxtm-nn-tc-utm-1200 {
    font-family: 'UTM-Edwardian', cursive;
    font-size: 80px;
     color:#fff;
    padding: 0px 20px;
    margin-left: -28px;
}
.sec-4-mobile-nn-container .m-expert-relative {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 20px;
}

/* Section 1: Name Tag - Nằm ở khoảng giữa trên */
.sec-4-mobile-nn-container .m-abs-name-tag {
    position: absolute;
    top: 47%; /* Chỉnh thông số này để khớp với vùng trắng trên ảnh */
    left: 50%;
    transform: translateX(-50%);
    width: 98%;
    padding: 10px 10px 10px 1px;
    border-radius: 15px 15px 0 0;
    text-align: center;
    z-index: 3;
}

.sec-4-mobile-nn-container .m-expert-name {background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; font-weight: 500; font-size: 26px; display: block;margin-bottom:-26px; font-family: 'Geomanist', sans-serif!important; }
.sec-4-mobile-nn-container .m-expert-job {background: linear-gradient(180deg, #B915D2 0%, #3D037D 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent; font-size: 22px; font-weight: 500;font-family: 'Geomanist', sans-serif!important; }

/* Section 2: Desc Box - Nằm ngay dưới Name Tag */
.sec-4-mobile-nn-container .m-abs-desc-box {
    position: absolute;
    top: 57%;
    left: 50%;
    transform: translateX(-50%);
    width: 98%;
    padding: 24px;
    z-index: 2;
}

.sec-4-mobile-nn-container .m-expert-achievements { list-style: none; padding: 0; margin: 0; }
.sec-4-mobile-nn-container .m-expert-achievements li {
    font-size: 16px;
    color: #710DAC;
    margin-bottom: 5px;
    padding-left: 15px;
    position: relative;
}
.sec-4-mobile-nn-container .m-expert-achievements {
	margin-left:-20px;
}
.sec-4-mobile-nn-container .m-expert-achievements li::before { content: "•"; position: absolute; left: 0; color: #710DAC; }

/* Section 3: Button - Nằm dưới cùng */
.sec-4-mobile-nn-container .m-abs-btn-section {
    position: absolute;
    bottom: 20px;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 4;
}

.sec-4-mobile-nn-container .m-btn-advise {
    display: inline-block;
    background: linear-gradient(180deg, #451180 0%, #B915D2 100%);
    color: #fff;
    padding: 8px 25px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}
.sec-4-mobile-nn-container .m-expert-card:nth-child(2) .m-abs-name-tag,.sec-4-mobile-nn-container .m-expert-card:nth-child(3) .m-abs-name-tag,.sec-4-mobile-nn-container .m-expert-card:nth-child(4) .m-abs-name-tag {
  
    top: 61%;
    
}

.sec-4-mobile-nn-container .m-expert-card:nth-child(2) .m-abs-desc-box,.sec-4-mobile-nn-container .m-expert-card:nth-child(3) .m-abs-desc-box,.sec-4-mobile-nn-container .m-expert-card:nth-child(4) .m-abs-desc-box  {
    padding: 24px 55px 24px 22px;
    top: 76%;
    left: 54%;
   
}
/************/
/* Layout Mobile 5 cột */
.sec-2-phun-xam-n-grid {
    display: flex;
    gap: 5px;
    padding: 20px 4px;
    align-items: flex-end;
}

.sec-2-phun-xam-n-card {
    flex: 1;
    position: relative;
    border-radius: 25px;
    transition: transform 0.3s ease;
}

/* 2 Cột đầu tiên nổi bật */
.is-featured {
   
    z-index: 5;
}


.m-border-path {
    stroke-width: 1.2px; /* Mỏng tự nhiên theo yêu cầu */
    stroke-dasharray: 50, 150;
    stroke-linecap: round;
    filter: drop-shadow(0 0 1.5px rgba(185, 21, 210, 0.5));
}

.is-active-anim .m-border-path {
    animation: snakeRun 4s linear infinite;
}

@keyframes snakeRun {
    from { stroke-dashoffset: 200; }
    to { stroke-dashoffset: 0; }
}

/* Nhãn hình ảnh Treo góc card */
.is-featured::before {
   content: "";
    position: absolute;
    top: -15px;
    right: 17px;
    width: 300px;
    height: 80px;
    background: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/Group-1226.png) no-repeat center / contain;
    z-index: 20;
    animation: bounceMove 2s infinite ease-in-out;
}
/* Nhãn hình ảnh Treo góc card */
.is-featured::after {
  content: "";
    position: absolute;
    bottom: 0px;
    right: -8px;
    width: 60px;
    height: 60px;
    background: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/Group-1237.png) no-repeat center / contain;
    z-index: 20;
    animation: bounceMove 2s infinite ease-in-out;
}
/* Chọn card thứ 2 trong danh sách và thêm icon Group-1238 */
.sec-2-phun-xam-n-card:nth-child(2)::after {
    content: "";
    position: absolute;
    bottom: -4px;
    right: -8px;
    width: 75px;
    height: 75px;
    background: url(https://test.thammylinhanh.com/wp-content/uploads/2026/04/Group-1238.png) no-repeat center / contain;
    z-index: 20;
    animation: bounceMove 2s infinite ease-in-out;
}
@keyframes bounceMove {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}

/* Hiệu ứng viền sáng chạy vệt */
.sec-2-phun-xam-n-card {
    overflow: hidden; /* Đảm bảo vệt sáng không lấn ra ngoài bo góc */
}


/* Chỉ hiển thị cho các card có class is-featured hoặc khi hover */
.sec-2-phun-xam-n-card.is-featured::after,
.sec-2-phun-xam-n-card:hover::after {
    display: block;
}

/* Đảm bảo nội dung bên trong (ảnh) nằm trên vệt sáng border */
.sec-2-phun-xam-n-img-box {
    position: relative;
    z-index: 2;
    margin: 2px; /* Tạo khoảng hở nhỏ để thấy viền sáng */
    background: #fff; /* Hoặc màu nền của bạn */
    border-radius: 23px; /* Nhỏ hơn border-radius cha một chút */
}

@keyframes rotate-border {
    100% {
        transform: rotate(360deg);
    }
}
/* Hiệu ứng tráng gương lướt qua ảnh */
.sec-2-phun-xam-n-img-box {
    position: relative;
    overflow: hidden; /* Bắt buộc để vệt sáng không tràn ra ngoài */
}

.sec-2-phun-xam-n-img-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: -150%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.3) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: skewX(-25deg);
    z-index: 2;
    transition: none;
}

/* Kích hoạt khi hover vào card */
.sec-2-phun-xam-n-card:hover .sec-2-phun-xam-n-img-box::before {
    animation: shine-mirror 0.75s forwards;
}

@keyframes shine-mirror {
    100% {
        left: 150%;
    }
}
/***************/
/******/
/* --- PHẦN BỔ SUNG CHO MÀN HÌNH LỚN --- */

/* 1. Dành cho màn hình từ 1921px đến 2560px (Màn hình 2K) */
@media (min-width: 1921px) {
    .diamon-lips-banner-lp {
         
        left: -62%;
        bottom: 11%;
	}
    
    
    
    .diamon-lips-banner-lp .diamond-lips-btn {
        /* Thu hẹp khoảng cách âm nếu nút bị bay ra ngoài màn hình */
                left: -70%;
        transform: scale(1.1);
        top: 66%;

    }
	.diamon-lips-banner-lp .wpcf7-form-control.wpcf7-text {
		height: 55px; 
	}
}

/* 2. Dành cho màn hình từ 2561px trở lên (Màn hình 4K, Ultrawide) */
@media (min-width: 2561px) {
    .diamon-lips-banner-lp {
        /* Cố định nội dung vào một khoảng max-width để dễ kiểm soát */
        left: 35%;
        bottom: 20%;
    }

    .diamon-lips-banner-lp .diamond-lips-btn {
        left: -20%;
        width: 280px !important; /* Tăng kích thước nút cho màn hình siêu lớn */
        font-size: 24px !important;
    }
}
@media screen and (min-width:1200px) and (max-width:1441px) {
	.background--diamond-lips-container .row.row-collapse {
	    max-width: 880px!important;	
	}
.section-content .diamon-lips-banner-lp {
        position: absolute;
    bottom: 2%;
    left: -66%;
    right: 0;
	}
	.diamon-lips-banner-lp .diamond-lips-btn {
		position: absolute;
    top: 51%;
    left: -74%;
    width: 195px !important;
    border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
    font-weight: 400 !important;
    padding: 0px 6px 0px 15px;
    font-size: 16px !important;
    background: #710DAC !important;
	}	
}

@media screen and (min-width:1921px) {
	.background--diamond-lips-container .row.row-collapse {
	 max-width: 1440px!important;
	}
}