/* Hero Banner */
.hero-banner { position: relative; }
.hero-banner .overlay { position: absolute; inset: 0; background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.2)); display: flex; flex-direction: column; justify-content: center; }
.hero-banner .overlay .container { top: -30px; }
.hero-banner .overlay .title .display-5 { font-weight: 500; }
.hero-banner .form-search { width: 85%; margin: 0 auto; }
.hero-banner h1 { color: #FFF; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); }
.hero-banner h6 { opacity: 0.6; font-weight: 400; font-size: 1.0em; }

.hero-banner .overlay { justify-content: normal; }
.hero-banner h1 { padding-top: 0.5em; }
.hero-banner h6 { font-size: 0.9em; }
.hero-banner .form-search { width: 100% !important; }
/* Services */
.service .col-6 { margin: 0.375em 0; }
.service img { width: 24px; }
.service h5 { font-size: 0.9em; font-weight: 600; margin-bottom: 0; }
.service p { font-size: 0.6rem; color: var(--bs-secondary); margin-bottom: 0; }
/*.section-divider { height: 1px; background: linear-gradient(to right, var(--bs-danger) 70px, #ccc 70px); }*/
/*Part Promotion*/
.section-deal .product-image-box {display: flex;justify-content: center;align-items: center;background: #fff;}
.section-deal .product-card {display: flex; flex-direction: column; width: 100%;height: 100%;}
.section-deal .product-body {display: flex;flex-direction: column;justify-content: space-between;}
/* Brand Grid */
.part-brand .section-title img { width: 40px; }
.part-brand .brand-grid { display: none; }
.part-brand .brand-grid.active { display: grid;  grid-template-columns: repeat(3, 1fr); gap: 1.0rem; text-align: center; }

.part-brand .brand-item {gap: 1.0em;background: #ccc;}
.part-brand .brand-item .part-icon { margin: auto; display: inline-block; width: 48px;}
.part-brand .brand-item img { max-height: 100%; margin: 0 auto; object-fit: contain; }
.part-brand .brand-item h6 { font-size: 0.875rem;}

.part-brand .section-button button {flex: 0 0 auto;color: var(--bs-secondary);font-size: 0.875rem; font-weight: 500;white-space: nowrap;text-align: center;padding: 0.375rem 0.75em;text-transform: uppercase;min-width: 80px; width: max-content; }
.part-brand .section-button button.active { color: var(--bs-white); background: var(--bs-danger);}

.part-brand .section-button .scroll { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
.part-brand .section-button .scroll::-webkit-scrollbar { display: none; }

.part-brand .brand-grid { grid-template-columns: repeat(3, 1fr); gap: 1.0rem; }

.part-group .group-grid { display: none; }
.part-group .section-button .scroll { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
.part-group .section-button button { min-width: 100px; max-width: max-content; padding: 0.5em; }
.part-group .section-button .scroll::-webkit-scrollbar { display: none; }
.part-group .section-button .scroll .btn { flex: 0 0 auto;text-transform: uppercase;font-weight: 500;padding: 0.5rem 1.0rem;min-width: 80px;width: max-content;}
.part-group .group-grid.active {display: grid; text-align: center;}
.part-group .group-grid { grid-template-columns: repeat(2, 1fr); gap: 1.0rem; }
.part-group .group-item { display: grid; grid-template-rows: auto auto; align-items: center; border: 1px solid #ccc; gap: 1.0rem; }

/* Deals & Feedback & Blog */

.section-deal { position: relative; }
.section-deal .overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; }
.section-deal .swiper { width: 100%; padding: 10px 0 0 0; }
.section-deal .swiper-slide { height: auto; }
.section-deal .card { border-radius: 10px; overflow: hidden; }
.section-deal .section-banner{width: 100%;object-fit: cover; min-height: 360px;}
.sec-blog .text-truncate-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-align: justify; }
.sec-blog .text-truncate-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-align: justify; }

.sec-feedback .btn.prev, .sec-blog .btn.prev { position: absolute; top: 45%; left: -0.75rem; z-index: 999; }
.sec-blog .btn.next, .sec-feedback .btn.next { position: absolute; top: 45%; right: -0.75rem; z-index: 999; }
/* Partners */

.section-partner { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; align-items: stretch; }
.section-partner .partner-left { flex: 0 0 52%; margin-left: calc(-50vw + 50%); position: relative; overflow: hidden; }
.section-partner .partner-left img { width: 100%; height: 340px; object-fit: cover; clip-path: polygon(0 0, 100% 0, 95% 100%, 0 100%); }
.section-partner .partner-right { flex: 0 0 48%; background: #f2f3f5; position: relative; z-index: 1; padding-left: 3rem; top: 40px; position: relative; }
.section-partner .partner-right::before { content: ""; position: absolute; top: 0; bottom: 0; left: -120px; width: 121px; background: #f2f3f5; z-index: -1; clip-path: polygon(65% 0, 100% 0, 100% 100%, 0 100%); }
.section-partner .partner-right > div { width: calc(100% + calc(-50vw + 75%)); }
.section-partner .partner-right h3 { font-weight: bold; margin-bottom: 20px; }
.section-partner .btn-submit { background: var(--bs-danger); border: none; color: #fff; font-weight: 500; }
.section-partner .btn-submit:hover { background: var(--bs-danger-hover); }



.sec-partner .partner-form { background: #f0f0f2; padding: 1.0rem 0; position: relative;}
.partner-form .wrapper { padding: 0 0.5rem;}
/* --- 5. UTILITIES --- */
.promotion-time .badge { width: 45px; height: 45px; border: 1px solid var(--bs-danger); border-radius: 50%; line-height: 15px; padding-top: 0.5rem; display: block; white-space: pre-wrap; }

@media (min-width: 768px) {
    /* Hero Banner Reset */
    .hero-banner .overlay { justify-content: center; } /* Trả về căn giữa */
    .hero-banner h1 { padding-top: 0; font-size: 2.5rem; }
    .hero-banner .form-search { width: 85% !important; }

    .part-brand .brand-grid.active {grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));}
    .part-brand .brand-item .part-icon {width: 48px;}


    .section-deal .section-banner{min-height: 500px;}

    .service img { width: 48px; }
    .service h5 { font-size: 1.0em; font-weight: 600; margin-bottom: 0; }
    .service p { font-size: 0.9em; color: var(--bs-secondary); margin-bottom: 0; }

    .part-group .section-title img { width: 40px; }
    .part-group .section-button button {width: max-content;font-weight: 500;white-space: nowrap;text-align: center;padding: 0.375rem 0.75em;text-transform: uppercase;min-width: 80px;}

    .part-group .group-grid{ grid-template-columns: repeat(4, 1fr);; gap: 1.5rem;}
    .part-group .group-item .part-icon { margin: auto; display: inline-block; width: 48px;}
    
    .promotion-time .badge { width: 50px; height: 50px; }
}

@media (min-width: 992px) {
    /* Hero Banner Reset */
    .hero-banner .overlay { justify-content: center; } /* Trả về căn giữa */
    .hero-banner h1 { padding-top: 0; font-size: 2.5rem; }
    .hero-banner .form-search { width: 80% !important; }

    
    .part-brand .brand-grid.active {grid-template-columns: repeat(8, 1fr);}
    .part-brand .brand-item .part-icon {width: 64px;}
    
    .section-deal .section-banner{min-height: 500px;}

    .service img { width: 48px; }
    .service h5 { font-size: 1.0em; font-weight: 600; margin-bottom: 0; }
    .service p { font-size: 0.9em; color: var(--bs-secondary); margin-bottom: 0; }

    .part-group .section-title img { width: 40px; }

    .part-group .group-grid{ grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1.5rem;}
    .part-group .group-item .part-icon { margin: auto; display: inline-block; width: 48px;}

    .sec-partner {height: 400px;}
    .sec-partner .partner-bg { background: url('/images/home/connect-sdv-bgr.webp') no-repeat center/cover; height: 100%; width: 55%; position: absolute; top: 0; left: 0; clip-path: polygon(0 0, 100% 0, 92% 100%, 0 100%); }
    .sec-partner .partner-form {padding-top: 35px; padding-bottom: 35px; top: 50px; right: 0; width: 55%; clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%); box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1); z-index: 999; display: flex; justify-content: flex-end; }
    .sec-partner .partner-form {padding-left:calc((100vw - 1140px)/2); padding-right:calc((100vw - 1140px)/2); position: absolute; }

    .sec-blog .btn.next, .sec-feedback .btn.next{ position: relative; left: 0; top: 0;}
    .sec-feedback .btn.prev, .sec-blog .btn.prev{ position: relative; left: 0; top: 0;}
    .promotion-time .badge { width: 50px; height: 50px; }
}

@media(min-width:1400px) {
    .sec-partner {height: 430px;}
    .sec-partner .partner-form {padding-left:calc((100vw - 1320px)/4); padding-right:calc((100vw - 1320px)/2); }
}