/* =========================================================
   VIPEP FE — Global CSS
   Font: Montserrat (Google Fonts), Piklab Geofanny (local)
   ========================================================= */

@font-face {
    font-family: 'Piklab Geofanny';
    src: url('../fonts/PiklabGeofanny-Regular.woff2') format('woff2'),
         url('../fonts/PiklabGeofanny-Regular.woff') format('woff'),
         url('../fonts/PiklabGeofanny-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

html {font-size: 1.3vw;}


*, *::before, *::after { box-sizing: border-box; }

/* =========================================================
   HIỆU ỨNG LOAD TRANG — trang chủ dùng .load_home_page (homeLoader.component.js),
   các trang con dùng .tile-reveal (tileReveal.component.js)
   ========================================================= */
body.unscrollable { overflow: hidden; }

.load_home_page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
    transition: .5s all;
    opacity: 1;
    background: transparent;
}

.load_home_page .mask {
    transition: .5s all ease-in-out;
    position: absolute;
    width: 100%;
    height: 100%;
}

.load_home_page .mask span {
    display: block;
    width: 100%;
    height: 20%;
    position: absolute;
    left: 0;
    transition: .5s all ease-in-out;
    background-color: #3E6530;
}

.load_home_page .mask span:nth-child(even) { left: unset; right: 0; }
.load_home_page .mask span:nth-child(1) { top: 0; }
.load_home_page .mask span:nth-child(2) { top: 20%; }
.load_home_page .mask span:nth-child(3) { top: 40%; }
.load_home_page .mask span:nth-child(4) { top: 60%; }
.load_home_page .mask span:nth-child(5) { top: 80%; }

.load_home_page--logo {
    width: 8rem;
    max-width: 40%;
    height: auto;
    position: absolute;
    z-index: 9;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: .4s all ease-in-out;
}

body.home-loaded .load_home_page { visibility: hidden; }
body.home-loaded .load_home_page .mask { background-color: transparent; }
body.home-loaded .load_home_page .mask span {
    width: 0;
    opacity: 0;
    transition-delay: .1s;
}
body.home-loaded .load_home_page--logo {
    opacity: 0;
    transition-delay: .1s;
}

.tile-reveal {
    overflow: hidden;
    width: 100vw;
    height: 100vh;
    display: grid; /* grid (không phải flex-wrap) để mọi hàng dùng chung 1 bộ cột, không lệch subpixel giữa các hàng */
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 999; /* thấp hơn header (z-index: 1000) để header luôn hiện trên hiệu ứng */
    background: #fff;
    transition: background .3s ease .1s;
}

.tile-reveal.tile-reveal-out { background: transparent; }

.tile-reveal-square {
    background-color: #508741;
    opacity: 1;
    transform: scale(1);
    transition: opacity .5s ease, transform .5s ease;
}

.tile-reveal.tile-reveal-out .tile-reveal-square {
    opacity: 0;
    transform: scale(.75);
}

.container,
.container-width,
.full-width .ubermenu-nav,
.row {
  max-width: 72rem;
}

body,
h1, h2, h3, h4, h5, h6,
p, span, a, li, td, th,
input, textarea, select, button,
label, legend, caption,
blockquote, pre, code {
  font-family: 'Montserrat', sans-serif;
}

body {
  font-size: 0.8rem;
  color: #000000;
}

/* =========================================================
   HOME — Trang chọn hướng
   ========================================================= */

.intro_page {
  position: relative;
  min-height: 100vh;
  background-size: cover;
  background-position: center;
  background-color: #1a1a1a;
  display: flex;
  flex-direction: column;
}

.intro_page::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 0;
}

.intro_page .row_top,
.intro_page > .row {
  position: relative;
  z-index: 1;
}

/* --- Header top --- */
.intro_page .row_top {
  padding-top: 2rem;
  width: 100%;
  max-width: 100%;
}

.wrap_head {
  padding: 0 2rem;
}

.logo_top img {
  height: 5.5rem;
  width: auto;
}

.language_box {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.language_box li {
  cursor: pointer;
}

.language_box li img {
  height: 1.3rem;
  width: auto;
  display: block;
}

body #main { background: #fbfffb; }

/* --- Content giữa trang --- */
.intro_page > .row {
  flex: 1;
  display: flex;
  align-items: center;
  max-width: 70rem;
}

.intro_page_content {
  width: 100%;
  padding: 0 0 5rem;
}

.intro_page_title {
  font-family: 'Phudu', cursive;
  font-size: 3rem;
  font-weight: 600;
  color: #ffffff;
  text-transform: uppercase;
  line-height: 1.1;
  margin: 0 0 1.5rem;
  letter-spacing: 0.02em;
}

.intro_page .content {
  font-size: 1.2rem;
  color: #ffffff;
  line-height: 1.7;
  margin-bottom: 3.5rem;
  font-weight: 600;
}

/* --- Buttons --- */
.intro_page_link {
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 1rem;
  flex-wrap: wrap;
}

.intro_page_link li a {
  display: block;
  border: 1px solid rgba(255, 255, 255, 0.65);
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0 .6rem;
  text-decoration: none;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-align: center;
  transition: background 0.2s, border-color 0.2s;
  font-weight: 700;
  text-transform: unset;
  height: 4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15rem;
}

.intro_page_link li a:hover {
  background: #FFFFFF4D;
  border-color: transparent;
  color: #FFF5E6;
}

/* =========================================================
   CONTACT SOLUTION
   ========================================================= */

.contact_solution {
  background-image: url('images/bg_contact.png');
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  padding: 6rem 0 4rem;
}

.contact_solution_wrap {
  align-items: stretch;
  gap: 0;
  align-items: flex-start;
}

/* Cột trái */
.contact_solution_left {
    width: 50%;
    padding-right: 1.5rem;
}

.contact_solution .title_head {
  font-size: 1.8rem;
  font-weight: 700;
  color: #508741;
  text-transform: uppercase;
  margin: 0 0 0.9rem;
}

.contact_solution .contact_company {
  font-size: 1rem;
  font-weight: 700;
  color: #3E6530;
  text-transform: uppercase;
  margin: 0 0 1.2rem;
}

.contact_info {
  font-size: 0.8rem;
  line-height: 1.8;
  color: #333;
  margin-bottom: .8rem;
}

.contact_info_item {
  gap: 0.35rem;
  align-items: baseline;
  color: #3E6530;
  font-weight: 500;
}

.contact_info_item .label {
  font-weight: 700;
  white-space: nowrap;
  color: #3E6530;
  margin-right: .2rem;
}

.contact_info_item a {
  color: #3E6530;
  text-decoration: none;
}

.contact_info_item a:hover {
  color: #65BF11;
}

/* Phòng ban */
.contact_departments {
  border-top: 2px solid #3E6530;
  padding: .8rem 0 0;
  margin-bottom: 1.5rem;
  gap: 0;
}

.contact_department {
  flex: 1;
  font-size: 0.78rem;
  line-height: 1.7;
  color: #333;
}

.contact_department + .contact_department {
  padding-right: 0;
}

.contact_department h3 {
  font-size: 0.8rem;
  font-weight: 700;
  color: #3E6530;
  margin: 0 0 0.4rem;
}

.contact_department .contact_info_item {
  font-size: 0.78rem;
}
.contact_department .contact_info_item .label {
  font-weight: 400;
}

/* Form */
.contact_form { max-width: 23rem; }
.contact_form .form_field {
  margin-bottom: 0.5rem;
}

.contact_form input,
.contact_form textarea {
  width: 100%;
  border: 1px solid #d0d0d0;
  padding: 0.6rem 0.8rem;
  font-size: 0.78rem;
  color: #333;
  background: #fff;
  outline: none;
  font-family: 'Montserrat', sans-serif;
  transition: border-color 0.2s;
}

.contact_form textarea {
  resize: none;
  height: 5rem;
}

.contact_form input:focus,
.contact_form textarea:focus {
  border-color: #65BF11;
}

.form_submit {
  gap: 1.2rem;
  align-items: center;
  margin-top: 0.5rem;
  justify-content: space-between;
}

.button_link {
    background: #65BF11;
    color: #fff;
    border: none;
    padding: 0.65rem 2.5rem;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: .5s all;
    display: inline-flex;
    position: relative;
    overflow: hidden;
}

.button_link::after {
    content: '';
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transform: skewX(-20deg);
    pointer-events: none;
    transition: none;
}

.button_link:hover::after {
    left: 130%;
    transition: left 0.55s ease;
}

.form_note {
  font-size: 0.5rem;
  color: #999;
  font-style: italic;
}

/* Cột phải — bản đồ */
.contact_solution_right {
 width: 50%;
}
.contact_solution_wrap {
    align-items: unset !important;
}

.contact_solution_right .contact_map {
  height: 100%;
}

.contact_solution_right .contact_map iframe {
 min-height: 20rem;
}
.contact_solution_right .contact_map iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
.col, .columns, .gallery-item {
    padding: 0 10px;
}

.contact_department .contact_info_item a {
    font-weight: 700;
}

.contact_form input,.contact_form textarea {
    height: 1.6rem;
    margin: 0;
    padding: 0;
    font-size: .6rem;
    font-style: italic;
    padding: .4rem .6rem;
    border: 1px solid #C7D4C7;
    color: #508741;
}

.form_submit button.button_link {
    margin: 0;
    min-height: unset;
    line-height: normal;
    font-size: .8rem;
    padding: 0 1.2rem;
    height: 1.6rem;
    display: flex;
    align-items: center;
}

.contact_form input::placeholder, .contact_form textarea::placeholder {
    color: #508741;
}

/* =========================================================
   ABOUT — dots about3_slider show năm
   ========================================================= */

.about3_dots {
  display: flex;
  justify-content: center;
  gap: 0;
  margin-top: 3rem;
}

.about3_dots .swiper-pagination-bullet {
  width: auto;
  height: auto;
  background: transparent;
  border-radius: 0;
  opacity: 1;
  font-size: 0.75rem;
  font-weight: 600;
  color: #aaa;
  padding: 0.4rem 1rem;
  border-bottom: 2px solid #ddd;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s;
  color: transparent;
  border-radius: 100px;
  padding: 0;
  height: .4rem;
  border: none;
  position: relative;
}

.about3_dots .swiper-pagination-bullet-active {
  color: #65BF11;
}
section.about1 {
    background: #508741;
    padding: 4rem 0 0;
}

h1.title_page {
    font-family: 'Phudu', cursive;
    font-size: 1.6rem;
    color: #FFFFFF;
    font-weight: 600;
    margin-bottom: 2rem;
}

.about1_content .content {
    font-size: .8rem;
    font-weight: 600;
    color: #fff;
    text-align: justify;
}

.about1_content {
    max-width: 48rem;
    margin-bottom: 1rem;
}

section.about2 {
    padding-top: 12rem;
}

.about1_img img {}

.about1_img {
    display: flex;
    justify-content: center;
    margin-bottom: -10rem;
}

.about1_img img {
    width: 100%;
    height: auto;
    display: block;
}

.heading_title {
    color: #3E6530;
    font-family: 'Phudu', cursive;
    font-size: 2rem;
    line-height: 1.2;
}

.swiper-grid > .swiper-wrapper {
}

.about2_logo {
    width: 50%;
    padding: 0 2.5rem;
}

.about2_items.flex {
    margin: 4rem -2.5rem 0;
}

.wrap_slider {
    position: relative;
}

.about3_dots {
    position: unset;
}

.about2_item {
    width: 20%;
    background: #ffff;
    height: auto;
    padding: 1.2rem .6rem;
}

.about2_wrap {
    max-width: 45rem;
    margin: -5rem auto 0;
    gap: .6rem;
}

.about2_item b {
    display: block;
    color: #3E6530;
    font-size: 2rem;
    line-height: normal;
}

.about2_item span {
    font-size: .8rem;
    font-weight: 600;
    color: #3E6530;
}

.about2_item .content {
    font-size: .6rem;
}

.about2_logo h3 {
    text-align: center;
    font-size: 1.2rem;
    color: #508741;
    margin-bottom: 1.2rem;
}
.about2_box {
    background: #FFF5E680;
    padding-bottom: 2rem;
}

section.about2 h2.heading_title {
    margin-bottom: 7rem;
}

.about2_logo+.about2_logo {
    border-left: 2px solid #508741;
}

.item_logo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: .6rem;
}

section.about3 {
    padding-top: 3.5rem;
}

.about3_cn .item {
    height: 13rem;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.about3_cn .item img {
    max-height: 100%;
    width: auto;
}

.about3_item  h3 {
    color: #65BF11;
    font-family: 'Phudu', cursive;
    font-size: 2rem;
    margin: 0;
}
.about3_item .content {
    color: #3E6530;
    font-weight: 500;
}

section.about4 {
    background-repeat: no-repeat;
    background-position: bottom -24rem center;
    background-size: 100% auto;
    padding-bottom: 10rem;
    padding-top: 4rem;
    position: relative;
    overflow: hidden;
    padding-bottom: 21rem;
}

.about4_box svg {
    width: 21rem;
    height: auto;
    display: block;
    margin: auto;
}

.about4_items {
    position: absolute;
    top: 0;
    padding-top: 7.5rem;
    max-width: 46rem;
    margin: auto;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

.about4_item:nth-child(even) .box_img {
    order: -1;
    padding: 0;
}

.about4_item .box_img {
    width: 50%;
    display: flex;
    justify-content: center;
    padding-left: 8rem;
}

.about4_item .box_content {
    width: 50%;
}

.about4_item .year {
    width: 12rem;
    height: 6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('/assets/css/images/ka.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    min-height: 6rem;
    margin: 0 0 0 auto;
    font-size: 2.3rem;
    color: #fff;
    font-weight: 700;
}

.about4_item h3 {
    font-size: 1.2rem;
    color: #3E6530;
    margin-bottom: .4rem;
    margin-top: 1rem;
}
.about4_item h3 b {
    display: block;
    color: #65BF11;
    line-height: 1.2;
}

.about4_item .content {
    font-size: .6rem;
    font-weight: 500;
    color: #3E6530;
    text-align: justify;
}

.about4_item+.about4_item {
    margin-top: 3rem;
}
.about4_item:last-child {
    margin-top: 1rem;
    padding: 0 8rem 0 8rem;
}
section.blog1 {
    background: #FFF5E6;
    padding: 2rem 0;
}

h2.font_2 {
    font-size: 4.3rem;
    color: #F2A100;
    font-weight: 400;
    margin: 0;
}

.item_post {
    position: relative;
    height: 9rem;
    width: 13rem;
    margin-bottom: .7rem;
    float: left;
    overflow: hidden;
}

a.link_box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
}

.item_post img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    scale: 1;
    transition: .5s all;
}

.item_post .box_content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 1rem;
    background: #00000078;
    padding: .6rem .7rem;
}

.item_post .box_content h3 {
    font-size: .8rem;
    color: #fff;
    margin: 0;
    text-transform: unset !important;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.item_post .content {d;display: none;}

.item_post:nth-child(1) {
    width: calc(calc(100% - 13rem) - .7rem);
    height: 28.4rem;
    margin-right: .7rem;
}

.item_post:nth-child(1) .box_content {
    right: 0;
}

.item_post:nth-child(1) .box_content .content {
    display: block;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.item_post:hover img {
    scale: 1.1;
}

section.blog2 {
    padding: 2rem 0 3.5rem;
}

ul.list_tax {
    list-style: none;
    margin: 0 0 2rem;
    display: flex;
    justify-content: center;
    gap: 1.2rem;
    position: relative;
}

ul.list_tax li {
    margin: 0;
}

ul.list_tax a {
    display: inline-flex;
    height: 2.8rem;
    align-items: center;
    justify-content: center;
    padding: 0 1.3rem;
    font-size: .7rem;
    color: #508741;
    font-weight: 700;
    transition: .4s all;
}

ul.list_tax a:hover,ul.list_tax .active a {
    background: #FFF5E6;
    color: #65BF11;
}

ul.list_tax:before {
    content: '';
    position: absolute;
    bottom: 0;
    background: #FFF5E6;
    height: 2px;
    width: 100vw;
}

.list_tax_select {
    display: none;
}
.product_breadcrumb {
    color: #C7D4C7;
    display: flex;
    gap: .5rem;
    margin-bottom: 1rem;
}
section.page_breadcrumb_section .product_breadcrumb {
    margin: .8rem 0;
}
.contact_solution .product_breadcrumb {
    position: absolute;
    top: -4rem;
}
.rd_form_field input::placeholder {
    color: #65BF11;
    font-style: italic;
}
.home_template .fixed_contact {
    display: none;
}

@media (max-width: 767px) {
    ul.list_tax { display: none; }
    .list_tax_select { display: block; }
}
.pd_extra_slider_wrap .swiper-slide {
    height: auto;
}

.pd_extra_slider_wrap .swiper-slide>* {
    height: 100%;
}
.post_item {
    width: calc(25% - 1.2rem);
    margin: 0 .6rem 2rem;
}

.list_posts {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -0.6rem;
    transition: opacity .25s ease;
}
.list_posts.loading {
    opacity: .45;
    pointer-events: none;
}

.post_item .box_img {
    padding-bottom: 66.6667%; /* tỉ lệ 3/2 */
    position: relative;
    overflow: hidden;
}

.post_item .box_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    scale: 1;
    transition: .5s all;
}

.post_item:hover .box_img img {
    scale: 1.1;
}

.post_item h3 {
    margin: 0;
    font-size: .8rem;
    font-weight: 500;
    color: #0F1610;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    margin-bottom: .6rem;
}

.post_item  .date {
    color: #0F1610;
    font-size: .5rem;
    font-style: italic;
}

section.blog2 .heading_title {
    color: #3E6530;
}

.post_item .box_content {
    padding: .6rem .6rem 0;
}
section.single_page {
    padding: 3rem 0;
}

h1.title_post {
    color: #508741;
    font-size: 1.8rem;
}

.box_meta {
    color: #000000;
    font-size: .75rem;
    font-weight: 500;
}

.post_content {
    font-size: .7rem;
    font-weight: 500;
    color: #000000;
}

.post_content h2 {
    font-size: 1rem;
    color: #000;
    font-weight: 700;
}

b, strong {
    font-weight: 700;
}

.post_content img {
    display: block;
    margin: auto;
}

.post_thumbnail img {
    display: block;
    margin: auto;
}

.nav_bottom_post {
    border-top: 1px solid #8FB184;
    justify-content: flex-end;
    gap: .7rem;
    padding-top: .4rem;
}

ul.share_list.flex {
    justify-content: flex-end;
    margin: 0;
    list-style: none;
    padding: 0;
    gap: .5rem;
}

.nav_bottom_post>span {
    font-size: .7rem;
    font-weight: 500;
}

ul.share_list a {
    width: 1.5rem;
    height: 1.5rem;
    background: #4f7445;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    transition: background 0.2s;
}
ul.share_list a:hover { background: #65BF11; }

ul.share_list a svg {
    max-width: 60%;
    max-height: 60%;
    width: auto;
    height: auto;
}



ul.share_list.flex li {
    margin: 0;
}

.slider_posts .post_item {
    width: calc(100% - 1.2rem);
}

.slider_posts {
    margin: 0 -0.6rem;
}

h2.title_related {
    font-size: 1rem;
    color: #0F1610;
    margin-top: 2.3rem;
    margin-bottom: 1.7rem;
}

.certificates_banner {
    background: #508741;
    text-align: center;
    padding: 5rem 0 5rem;
}

.certificates_banner .content {
    color: #fff;
    font-weight: 600;
    max-width: 45rem;
    margin: auto;
}

.certificates_box h2 {
    font-size: 1.2rem;
    color: #508741;
    margin-bottom: 2rem;
}

.slider_button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -3rem;
    cursor: pointer;
    scale: 1;
    transition: .5s all;
}
.slider_button:hover { scale: .9; }

.slider_button svg {
    width: 1rem;
    ge': initial';
    ge': initial';
    ge': a';
    height: auto;
    display: block;
}

.logo_slider .logo_item {
    height: 6.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
}

.logo_item img {
    max-height: 70%;
    max-width: 70%;
    width: auto;
    height: auto;
    scale: 1;
    transition: .5s all;
}

.logo_slider .logo_item>div {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.certificates_box {
    padding: 5rem 3.5rem 1rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin-top: -2.5rem;
    margin-bottom: 3.5rem;
}

.slider_button.next {
    left: unset;
    right: -3rem;
}

.logo_item:hover img {
    scale: 1.1;
}

section.certificates_page {
    background: #FFF5E680;
    padding-bottom: 2rem;
}

.certificates_img {
    padding: 1.5rem 2.5rem;
    background: #fff;
    width: 17rem;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 11rem;
}
.certificates_wrap .box_content {
    max-height: 10rem;
    overflow: auto;
}
.certificates_img img {
    display: block;
}

.certificates_wrap {
    align-items: center;
    gap: 4.7rem;
}

.certificates_wrap h3 {
    font-size: 1.7rem;
    line-height: 1.2;
    color: #65BF11;
    font-family: 'Phudu', cursive;
    margin-bottom: 1.6rem;
}

.certificates_wrap .content {
    font-weight: 700;
}

.content p:last-child {
    margin: 0;
}

.certificates_gallery {
    padding: 2.5rem 0;
}

.certificates_gallery .certificates_dots {
    position: unset;
    margin-top: 1rem;
}

.certificates_dots span {
    width: .4rem;
    height: .4rem;
    background: #D9D9D9;
    opacity: 1;
    transition: .6s all;
}

.certificates_dots span.swiper-pagination-bullet-active {
    background: #508741;
    width: 1.2rem;
    border-radius: .2rem;
}

.item_img img {
    width: 100%;
    height: auto;
    display: block;
}
.story_page {
    background-image: url('images/nen_cau_chuyen.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.story_page_top {
    background: #508741;
    padding: 3.2rem 0;
}

.story_page_top .title_page {
    font-size: 2.4rem;
    font-weight: 600;
    margin: 0;
}

h1.title_page {}

.font_2, .font2 {
    font-family: 'Piklab Geofanny';
    line-height: 1;
    font-weight: normal !important;
}

.story_page_top h2.font_2 {
    color: #FFFFFF;
    font-size: 4rem;
}

/* Story items — full width ngoài container */
.story_items {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    padding: 1.2rem 0 3.2rem;
}

.story_item {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: flex-start;
}

.story_item:nth-child(even) {
    flex-direction: row-reverse;
}

.story_item .box_content {
    flex: 1;
    padding: 4.5rem 3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 36rem;
    background: #FFFFFF;
    position: absolute;
    right: 6vw;
    z-index: 9;
}

.story_item .box_content h3 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #65BF11;
    margin: 0 0 .5rem;
}

.story_item .box_content .content {
    font-size: 0.8rem;
    line-height: 1.8;
    color: #333;
    font-weight: 500;
}

.story_item .box_img {
    width: 75vw;
}

.story_item .box_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.story_item:nth-child(even) .box_content {
    left: 6vw;
}
.story_page_top h1.title_page+.content {
    color: #fff;
    font-weight: 500;
    margin: 2rem auto 0;
}

.core_bottom {
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 100% 23.8rem;
    padding-top: 6rem;
    margin-bottom: 3.5rem;
}
.core_item h3 {}

.core_items_box {
    padding: 2.8rem 2rem 0;
    max-width: 100%;
    margin: auto;
    position: relative;
}

.core_item h3 {
    font-size: 1.6rem;
    color: #fff;
    text-align: center;
    font-family: 'Phudu', cursive;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: .5rem;
}

.core_item .box_img {
    padding-bottom: 77%;
    position: relative;
}

.core_item {
    margin: 0 .3rem;
}

.core_items_slider {
    margin: 0 -0.3rem;
}

.core_item .box_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.core_item .content {
    background: #fff;
    font-weight: 600;
    color: #3E6530;
    padding: 1.2rem;
    min-height: 10rem;
    text-align: justify;
    line-height: 1.4;
    transition: .5s all;
}
.core_item .box_img { overflow: hidden; }
.core_item .box_img::after {
    content: '';
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.4) 100%);
    transform: skewX(-25deg);
    pointer-events: none;
    z-index: 2;
}
.core_item:hover .box_img::after { animation: trang_guong .6s ease forwards; }
@keyframes trang_guong { to { left: 125%; } }
.core_item:hover .content { background: #65BF11; color: #fff; }

.core_bottom2 {
    padding: 6rem 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

section.core_page {
    background: #E0E6E0;
}
section.core_page .story_page_top .content { max-width: 45rem; }

.core_items_box:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: #65BF11;
    height: 17.8rem;
}

.core_page_content {
    background: #FFF5E6;
    margin: 0;
    padding: 2.25rem 11rem 2.25rem 5.2rem;
    position: relative;
    font-family: 'Corinthia', cursive;
    color: #3E6530;
    font-size: 2.9rem;
    line-height: 1;
}

.core_page_content::before {
    content: '';
    position: absolute;
    left: -8rem;
    top: 3rem;
    transform: translateY(-50%);
    width: 13rem;
    height: 13rem;
    background: url('images/htbox1.png') no-repeat center / contain;
    pointer-events: none;
}

.core_page_content::after {
    content: '';
    position: absolute;
    right: -12rem;
    top: 6rem;
    transform: translateY(-50%);
    width: 21rem;
    height: 18rem;
    background: url('images/htbox2.png') no-repeat center / contain;
    pointer-events: none;
}

.distribution2_img img {
    width: 100%;
}

.distribution2_img {
    background: #508741;
    margin-bottom: 3.6rem;
}

.distribution2_img img {
    display: block;
    width: 100%;
    mix-blend-mode: multiply;
}

.title_head,.title_head p {
    font-size: 2.8rem;
    color: #65BF11;
    font-family: 'Phudu', cursive;
    font-weight: 500;
    font-weight: 600;
    margin-bottom: 1.2rem;
    line-height: 1.1;
}

section.distribution2 .text-center {
    font-weight: 500;
    margin: 0 auto 2rem;
}

.distribution2_logos_wrap,
.distribution3_logos_wrap {
    background-image: url('images/Rectangle_120.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 2rem 0;
}

section.distribution4 {
    background-image: url('images/Rectangle_121.jpg');
    background-position: bottom center;
    background-repeat: no-repeat;
    padding-top: 2rem;
    background-size: 100% 19rem;
}

.distribution4_logos_row {
    justify-content: center;
}
.distribution4_logos_row .item_logo {
    padding: 0.5rem;
    width: 6rem;
    height: 6rem;
    margin: .5rem;
}
.distribution4_logos_row:first-child .item_logo {
}

section.distribution5 {
    padding: 2.6rem 0;
}

section.distribution5 .text-center {
    text-align: left;
    display: flex;
    align-items: flex-end;
}

section.distribution5 a.button_link {
    flex: 0 0 auto;
}

h2.distribution5_title {
    font-weight: 600;
    color: #65BF11;
    font-family: 'Phudu', cursive;
    font-size: 1.8rem;
    padding-left: 6rem;
    margin: 0;
}
.item_logo img {
    width: 100%;
    border-radius: 0.5rem;
    height: auto;
    display: block;
}

section.distribution3 .text-center {
    font-weight: 500;
    margin: 3.2rem auto 2rem;
}

.team_gallery_img {
    padding-bottom: 100%;
    position: relative;
    overflow: hidden;
}

.team_gallery_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team_gallery_img::after {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.4) 100%);
    transform: skewX(-25deg);
    pointer-events: none;
    z-index: 2;
}
.team_gallery_img:hover::after {
    animation: trang_guong .6s ease forwards;
}

.team_gallery_slider .swiper-slide {
    padding: 0 .4rem;
}

.team_gallery {
    padding: 2.2rem 2.3rem 1.3rem;
}

.team_quote {
    background: #3E6530;
    color: #fff;
    padding: 4.5rem 0;
    font-family: 'Corinthia', cursive;
    font-size: 2.7rem;
    line-height: 1.1;
}

section.team_philosophy {
    padding: 1.8rem;
}

.team_philosophy_img {
    width: 50%;
    position: relative;
}

.team_philosophy_content {
    width: 50%;
}

.team_philosophy_img img {width: 100%;display: block;}

.team_philosophy_img:before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 16rem;
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 55.84%);
}

.team_philosophy_content h2.title_head {
    margin: 0;
    font-size: 2.7rem;
    color: #3E6530;
    font-family: 'Phudu', cursive;
    font-weight: 600;
}

p.team_philosophy_sub {
    margin: 0;
    font-size: 4rem;
    color: #65BF11;
    font-family: 'Piklab Geofanny';
    line-height: 1;
    margin-top: -1rem;
    margin-left: 5rem;
}

.team_philosophy_item .item_icon {
    width: 3.2rem;
    height: 3.2rem;
}

.team_philosophy_item .item_icon img {
    display: block;
    width: 100%;
    height: auto;
}

.team_philosophy_items {
    margin-top: 1.5rem;
    justify-content: space-between;
}

.team_philosophy_item {
    width: 6.2rem;
    text-align: center;
}

.team_philosophy_item h3 {
    font-size: 1.2rem;
    color: #65BF11;
    font-family: 'Phudu', cursive;
    margin: .4rem 0 .5rem;
    line-height: 1.1;
}

.team_philosophy_item .item_sub {
    font-weight: 600;
    color: #3E6530;
    line-height: 1.5;
}
.team_cta_box {
    background: #FFF5E6;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.team_cta_title {
    margin-bottom: 1.2rem;
    font-size: 2.4rem;
    font-family: 'Phudu', cursive;
    display: inline-block;
    width: auto;
    position: relative;
    color: #65BF11;
}


.production_page_img img {
    width: 100%;
    display: block;
}

.production_items {}

.production_box {
    background: #E0E6E0;
    padding: 1.7rem 5rem;
    margin-top: -5em;
}
section.production_page .story_page_top .content { max-width: 45rem; }

.production_title {
    font-size: 1.2rem;
    color: #3E6530;
    margin-bottom: 1.5rem;
}

.production_items {
    display: flex;
    gap: 1rem;
}

.production_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #8FB184;
    background: #FFFFFF;
    width: 25%;
    padding: 1.4rem;
}

.production_item b.num {
    color: #65BF11;
    font-size: 2.4rem;
    line-height: 1.2;
    font-weight: 700;
    font-family: 'Phudu', cursive;
}

.production_item span {
    font-weight: 700;
    text-transform: uppercase;
}

.production_item  i {
    font-weight: 600;
}

.production_box2 {
    padding-top: 1.7rem;
}

.production_box2_item img {
    width: 100%;
    height: auto;
    display: block;
}

.production_box2_item {
    width: 25%;
    display: flex;
    flex-direction: column;
    font-size: .8rem;
    font-weight: 500;
}

.production_box2_items {
    gap: 1rem;
}

.production_box2_item h3 {
    color: #65BF11;
    font-size: 1rem;
    text-transform: uppercase;
    margin-bottom: .2rem;
}

.production_box2_item:nth-child(even) .box_img {
    order: 2;
    margin-top: 2rem;
}

.production_box2_item:nth-child(odd) .box_img {
    margin-bottom: .5rem;
}

.production_box3 {
    padding-top: 3.2rem;
}

.production_box3_wrap {
    background: #E0E6E0;
    display: flex;
    align-items: center;
}

.production_box3_img {
    width: 25rem;
    flex: 0 0 auto;
}
.production_box3_img img {
    width: 100%;
}

.production_box3_logo {
    width: calc(100% - 25rem);
    padding: .5rem 1rem;
}
.slider_logos .item {
    height: 3.9rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
}

.slider_logos .item img {
    max-height: 80%;
    max-width: 80%;
    width: auto;
    height: auto;
}

.slider_logos .swiper-slide {
    padding: .6rem .3rem;
}

.production_box4 {
    padding: 2rem;
    margin-bottom: 1.5rem;
    margin-top: 1.5rem;
    background: #E0E6E0;
    display: flex;
}
.production_box4 .box_img { flex: 1; }
.production_box4 .box_form { flex: 1; padding: 2.5rem 2rem; }
.box_form_desc { font-size: .9rem; color: #3E6530; margin: 0 0 1.5rem; line-height: 1.6; }
.box_form_note { font-size: .75rem; color: #3E6530; margin: 1rem 0 1.5rem; line-height: 1.5; }
.production_form .pf_field { margin-bottom: .8rem; }
.production_form input,
.production_form select {
    width: 100%;
    border: 1.5px solid #3E6530;
    border-radius: 0;
    background: transparent;
    padding: .85rem 1rem;
    font-size: .85rem;
    font-weight: 600;
    color: #3E6530;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
}
.production_form input::placeholder { color: #3E6530; font-weight: 600; }
.pf_select { position: relative; }
.pf_select_arrow { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); pointer-events: none; }
.pf_submit {
    background: #65BF11;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: .05em;
    border: none;
    border-radius: 0;
    padding: .9rem 3rem;
    cursor: pointer;
    transition: .3s all;
}
.pf_submit:hover { background: #508741; }
.production_box4 { padding: 4rem 2rem; margin-bottom: 1.5rem; }
.production_box4 h2.production_title { font-size: 1rem; margin-bottom: .5rem; text-align: center; color: #000000; }
.production_box4 .box_form { padding: 0; }
.production_box4 .box_img img { display: block; margin: auto; width: 27rem; }
.production_box4 p.box_form_desc { font-size: .8rem; color: #0F1610; }
.production_form input, .production_form select { background-color: #fff; color: #3E6530 !important; padding: 0 1rem; height: 2.1rem; font-size: .6rem; }
.production_form .pf_field { margin: 0; }
p.box_form_note { font-size: .8rem; color: #0F1610; }
button.btn.pf_submit { margin: 0; height: 2.5rem; padding: 0 2rem; font-size: 1rem; }
button.btn.pf_submit:disabled { opacity: .6; cursor: not-allowed; }
.pf_error { color: #c0392b; font-size: .8rem; margin: .3rem 0; }
.pf_sent_msg { color: #3E6530; font-weight: 600; font-size: .95rem; padding: 1.5rem 0; text-align: center; }
section.materialZone_page {
    background: #C7D4C7;
    padding-bottom: 1.4rem;
}

.materialZone_item {
    display: flex;
    padding: 2rem 2.5rem;
    align-items: center;
    border-radius: 0 0 8rem 0;
    position: relative;
    z-index: 0;
}
.materialZone_item:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 0 0 8rem 0;
    z-index: -1;
}
.materialZone_item:nth-child(even):before {
    border-radius: 8rem 0 0 0;
}

.materialZone_item+.materialZone_item {
    margin-top: 1rem;
}

.box_img2 {
}

.materialZone_items {
    margin-top: 2.5rem;
}

.materialZone_item .box_content {
    width: 18rem;
    flex: 0 0 auto;
    text-align: justify;
    margin-right: 2.5rem;
    font-weight: 500;
    position: relative;
}

.materialZone_item h3 {
    font-size: 2.4rem;
    font-family: 'Phudu', cursive;
    font-weight: 600;
    line-height: 1.2;
    margin: 0;
    text-align: left;
}

.materialZone_item .box_img {
    width: calc(calc(100% - 17.5rem) + 20.7rem);
    flex: 0 0 auto;
    position: relative;
}

.materialZone_item .box_img img {
    width: 100%;
    height: auto;
    display: block;
}

.materialZone_item .content {
    margin: 1rem 0 1.5rem;
}

.materialZone_item:nth-child(even) .box_content {
    order: 2;
    margin: 0 0 0 2.5rem;
}

.materialZone_item:nth-child(even) {
    justify-content: flex-end;
}

.materialZone_item:nth-child(even) h3 {
    text-align: right;
}

.materialZone_item .box_img2 {
    position: absolute;
    left: -18rem;
    width: calc(calc(100% - 17.5rem) + 16rem);
    z-index: -2;
    filter: blur(16px);
}

.materialZone_item .box_img2 img {
    width: 100%;
    height: auto;
}

.materialZone_item:nth-child(even) .box_img2 {
    left: unset;
    right: -18rem;
}

.materialZone_item:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
}

.materialZone_item a.button_link {
    width: 100%;
    color: #65BF11;
    display: flex;
    justify-content: center;
    border: 1px solid #65BF11;
    background: transparent;
    font-size: .7rem;
    padding: 0;
    height: 2rem;
    align-items: center;
    padding: 0 .2rem;
}

/* =========================================================
   CATALOGUE / HỒ SƠ NĂNG LỰC
   ========================================================= */

.catalogue_page {
    padding: 3rem 0 4rem;
    background: #3E6530 url("https://vipep.thuythu.vn/security-admin/wp-content/uploads/2026/09/Rectangle-61-1.jpg") center/cover no-repeat;
    position: relative;
}

.catalogue_page::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.35);
    pointer-events: none;
}

.catalogue_page > * {
    position: relative;
    z-index: 1;
}

.catalogue_title {
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 2rem;
    color: #fff;
    letter-spacing: 0.1em;
}

.catalogue_wrap {
    gap: 1.5rem;
}

.catalogue_book_container {
    position: relative;
    display: inline-block;
}


.catalogue_book {
    box-shadow: 0 8px 40px rgba(0,0,0,0.35);
}

.catalogue_cover {
    position: relative;
    display: block;
    padding: 0;
    border: none;
    cursor: pointer;
    background: #fff;
    border-radius: 0 .3rem .3rem 0;
    overflow: hidden;
    box-shadow:
        0 8px 40px rgba(0,0,0,0.4),
        6px 6px 0 -2px #e8e8e8,
        6px 10px 20px -4px rgba(0,0,0,0.3),
        11px 11px 0 -4px #d8d8d8,
        11px 15px 24px -8px rgba(0,0,0,0.25);
    transition: .35s transform ease, .35s box-shadow ease;
}
.catalogue_cover:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow:
        0 16px 50px rgba(0,0,0,0.45),
        6px 6px 0 -2px #e8e8e8,
        6px 14px 26px -4px rgba(0,0,0,0.32),
        11px 11px 0 -4px #d8d8d8,
        11px 20px 30px -8px rgba(0,0,0,0.28);
}
.catalogue_cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.catalogue_cover_hint {
    position: absolute;
    left: 50%;
    bottom: 1.2rem;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: .5rem;
    background: rgba(20, 32, 20, 0.75);
    backdrop-filter: blur(4px);
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .02em;
    padding: .6rem 1.1rem;
    border-radius: 2rem;
    white-space: nowrap;
    opacity: 0;
    transition: .3s all;
}
.catalogue_cover:hover .catalogue_cover_hint {
    opacity: 1;
    bottom: 1.5rem;
}
@media (max-width: 767px) {
    .catalogue_cover_hint { opacity: 1; }
}

.catalogue_page_item {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #fff;
}

.catalogue_page_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.catalogue_nav {
    background: rgba(255,255,255,0.2);
    border: 2px solid rgba(255,255,255,0.6);
    color: #fff;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.2s;
}

.catalogue_nav:hover {
    background: rgba(255,255,255,0.35);
}

.catalogue_nav_mobile { display: none; }

@media (max-width: 639px) {
    .catalogue_nav { display: none; }
    .catalogue_nav_mobile { display: flex; align-items: center; justify-content: center; }
}

.catalogue_controls {
    margin-top: 1.2rem;
    gap: 1rem;
    color: #fff;
}

.catalogue_page_count {
    font-size: 0.8rem;
    font-weight: 600;
    color: #fff;
    background: transparent;
    padding: 0.2rem 1rem;
    border-radius: 2rem;
    border: 1px solid rgba(255,255,255,0.5);
}

.catalogue_ctrl_btn {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    text-decoration: none;
    transition: background 0.2s;
}

.catalogue_ctrl_btn:hover {
    background: rgba(255,255,255,0.3);
}
button.catalogue_ctrl_btn {
    margin: 0;
}

.catalogue_loading {
    text-align: center;
    color: rgba(255,255,255,0.85);
    font-size: 0.75rem;
    padding: 2rem 0;
}

.catalogue_loading_bar {
    height: 4px;
    background: #fff;
    border-radius: 2px;
    margin: 0 auto 0.8rem;
    max-width: 300px;
    transition: width 0.3s;
}

.catalogue_pdf_embed {
    width: 100%;
    max-width: 920px;
    height: 680px;
    border: none;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.35);
    display: block;
    margin: 0 auto;
}

/* =========================================================
   PHÁT TRIỂN BỀN VỮNG
   ========================================================= */

/* --- Section 1: Banner --- */
section.sustainable1 {
    position: relative;
}

.sustainable1_bg {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    position: relative;
    padding: 6rem 0 20rem;
}


.sustainable1_bg .row {
    position: relative;
    z-index: 1;
    width: 100%;
}

.sustainable1_bg h1.title_page {
    font-size: 3rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 0;
}

/* --- Section 2: Vùng nguyên liệu --- */
section.sustainable2 {
    padding: 0 0 3.5rem;
    background: #FFF5E680;
}

section.sustainable2 .text-center {
    max-width: 52rem;
    margin: 0 auto 2rem;
}

section.sustainable2 h2.title_head {
    margin-bottom: 0.6rem;
}

section.sustainable2 .content {
    font-weight: 500;
    color: #333;
    line-height: 1.7;
    max-width: 35rem;
    font-size: .8rem;
}

.sustainable2_imgs {
    position: relative;
    margin-bottom: -2rem;
}

.sustainable2_slider {
    overflow: hidden;
}

.sustainable2_img {
    padding-bottom: 100%;
    position: relative;
    overflow: hidden;
}

.sustainable2_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sustainable2_slider .swiper-pagination {
    position: relative;
    margin-top: 1.2rem;
}

.sustainable2_slider .swiper-pagination-bullet {
    background: #C7D4C7;
    opacity: 1;
    width: 0.5rem;
    height: 0.5rem;
    transition: 0.3s all;
}

.sustainable2_slider .swiper-pagination-bullet-active {
    background: #65BF11;
    width: 1.2rem;
    border-radius: 0.2rem;
}

/* --- Section 3: Hoạt động xã hội --- */
section.sustainable3 {
    background-size: 100% auto;
    background-position: top center;
    background-repeat: no-repeat;
    position: relative;
    padding: 3rem 0 3.5rem;
}



section.sustainable3 .row {
    position: relative;
    z-index: 1;
}

section.sustainable3 .text-center {
    max-width: 52rem;
    margin: 0 auto 2rem;
}

section.sustainable3 h2.title_head {
    color: #fff;
    margin-bottom: 0.6rem;
}

section.sustainable3 .content {
    color: rgba(255, 255, 255, 0.88);
    font-weight: 500;
    line-height: 1.6;
    max-width: 35rem;
}

.sustainable3_imgs {
    gap: 0.8rem;
}

.sustainable3_img {
    flex: 1;
    overflow: hidden;
    padding-bottom: 100%;
}

.sustainable3_img img {
    width: 100%;
    object-fit: cover;
    display: block;
    transition: 0.5s all;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
}

.sustainable3_img:hover img {
    scale: 1.05;
}

/* --- Section 4: Nguồn nhân lực --- */
section.sustainable4 {
    padding: 0 0 1rem;
    background: #fff;
}

section.sustainable4 .text-center {
    max-width: 35rem;
    margin: 0 auto 2rem;
}

section.sustainable4 h2.title_head {
    margin-bottom: 0.6rem;
}

section.sustainable4 .content {
    font-size: 0.75rem;
    font-weight: 500;
    color: #333;
    line-height: 1.7;
}

.sustainable4_imgs {
    gap: 0.8rem;
}

.sustainable4_img {
    flex: 1;
    overflow: hidden;
    padding-bottom: 100%;
    position: relative;
}

.sustainable4_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: 0.5s all;
    position: absolute;
    top: 0;
    left: 0;
}

.sustainable4_img:hover img {
    scale: 1.05;
}

/* --- Section 5: Năng lực R&D --- */
section.sustainable5 {
    background: #1a2e1a;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 4rem 0 5rem;
    position: relative;
}

section.sustainable5::before {
    content: '';
    position: absolute;
    inset: 0;
    background: #1C2F1CBF;
}

section.sustainable5 .row {
    position: relative;
    z-index: 1;
}

section.sustainable5 h2.title_head {
    color: #fff;
    font-size: 2rem;
    text-align: center;
    margin-bottom: 2rem;
    font-family: 'Montserrat', sans-serif;
}

.sustainable5_items {
    gap: 1rem;
    align-items: flex-start;
}

.sustainable5_item {
    flex: 1;
    padding-top: 1.2rem;
    background: #FFFFFF33;
    padding: 1.1rem 1.5rem;
    transition: .5s all;
}
.sustainable5_item:hover { background: #65BF11; }

.sustainable5_item h3 {
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    margin: 0 0 0.8rem;
    line-height: 1.4;
    text-align: center;
    border-bottom: 2px solid #FFFFFF;
    padding-bottom: 1rem;
    min-height: 4.5rem;
}

.sustainable5_item .content {
    font-size: .9rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.4;
    text-align: justify;
}

/* =========================================================
   GIẢI PHÁP (B2B HOMEPAGE)
   ========================================================= */

/* --- Section 1: Banner slider --- */
section.solution1 {
    position: relative;
    z-index: 2;
}

.solution1_slider {
    height: 90vh;
    overflow: unset;
}

.solution1_slider .swiper-slide {
    overflow: hidden;
}

.solution1_slider .item_slide {
    width: 100%;
    height: 100%;
}

.solution1_slider .item_slide img,
.solution1_slider .item_slide > div,
.solution1_slider .item_slide video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.solution1_slider .item_slide > div img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.solution1_slider .swiper-pagination {
    bottom: -2rem;
}

.solution1_slider .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.6;
    width: 0.4rem;
    height: 0.4rem;
    transition: 0.3s all;
}

.solution1_slider .swiper-pagination-bullet-active {
    opacity: 1;
    background: #65BF11;
    width: 1.2rem;
    border-radius: 0.2rem;
}

/* --- Section 2: Hành trình vươn ra biển lớn --- */
section.solution2 {
    padding: 3.5rem 0;
    background: #FFF5E680;
}

.solution2_wrap {
    gap: 4rem;
    align-items: center;
    padding: 0 3rem;
}

.solution2_wrap .left {
    width: 50%;
}

.solution2_wrap .right {
    width: 50%;
}


.solution2_items {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.3rem;
}


.solution2_item .inner b {
    font-size: 1.8rem;
    font-weight: 700;
    color: #3E6530;
    line-height: 1.2;
    display: block;
}

.solution2_item .inner span {
    font-size: 0.7rem;
    font-weight: 600;
    color: #3E6530;
    display: block;
    margin-bottom: 0.36rem;
}

.solution2_item .inner .content {
    font-size: 0.65rem;
    color: #0F1610;
    font-weight: 500;
    line-height: 1.5;
}

.solution2_item:last-child .inner a {
   color: #65BF11;
   font-size: .9rem;
   font-weight: 600;
}


.solution2_img img {
    width: calc(100% + 5rem);
    max-width: calc(100% + 5rem);
    height: auto;
    display: block;
}

/* Box map (hiệu ứng hover bản đồ xuất khẩu, clone từ dhfoods.com.vn box_map) */
.solution2_img .box_map {
    display: flex;
    justify-content: center;
    width: 100%;
}

.solution2_img .inner_map {
    display: inline-block;
    position: relative;
    cursor: pointer;
    width: 100%;
}

.solution2_img .inner_map .map_bg {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

.solution2_img .inner_map .map_lines_wrap,
.solution2_img .inner_map .map_lines_wrap svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    pointer-events: none;
}

/* Vẽ nét đứt lan từ tâm (Việt Nam) ra khi hover */
.solution2_img .inner_map .reveal_circle {
    r: 0;
    transition: r 1.4s ease-out;
}

.solution2_img .inner_map:hover .reveal_circle {
    r: 1500;
}

/* Điểm tâm Việt Nam */
.solution2_img .inner_map .map_hub {
    position: absolute;
    top: 55.2%;
    left: 76.48%;
    width: 0.52rem;
    height: 0.52rem;
    margin: -0.26rem 0 0 -0.26rem;
    border-radius: 50%;
    background: #F7A500;
    box-shadow: 0 0 0 0.11rem rgba(247, 165, 0, .35);
    pointer-events: none;
}

.solution2_img .inner_map .map_hub:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 220%;
    height: 220%;
    transform: translate(-50%, -50%);
    border-radius: 100%;
    border: 1px solid #F7A500;
    animation: pulse-border2 1400ms ease-out infinite;
}

.solution2_img .inner_map .item {
    position: absolute;
}

.solution2_img .inner_map .item>span {
    width: 0.42rem;
    height: 0.42rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #E4C153;
    position: absolute;
    border-radius: 50%;
    box-shadow: 0 0 0 0.1rem rgba(228, 193, 83, .35);
}

.solution2_img .inner_map .item>span:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300%;
    height: 300%;
    transform: translate(-50%, -50%);
    border-radius: 100%;
    animation: pulse-border2 1400ms ease-out infinite;
    border: 1px solid #E4C153;
}

@keyframes pulse-border2 {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.6);
        opacity: 0;
    }
}

.solution2_img .inner_map .items_map {
    position: absolute;
    top: 55.2%;
    left: 76.48%;
    width: 0.55rem;
    height: 0.55rem;
    transition: 1s all;
    opacity: 0;
}

.solution2_img .inner_map .items_map .item {
    position: absolute;
}

.solution2_img .inner_map:hover .items_map {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 1;
}

.solution2_img .inner_map .items_map .item .box_content {
    position: absolute;
    top: 61%;
    left: 1rem;
    transform: translateY(-32%);
    pointer-events: none;
    opacity: 0;
    transition: .3s all;
    z-index: 2;
}

.solution2_img .inner_map .items_map .item .box_content .inner {
    background: #fff;
    display: flex;
    width: max-content;
    align-items: center;
    border-radius: 100px;
    padding: .1rem .4rem;
    font-size: .7rem;
    font-weight: 500;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
}

.solution2_img .inner_map .items_map .item .box_content .inner img {
    width: 1.3rem;
    height: auto;
    margin-right: .2rem;
    padding: .2rem;
    flex: 0 0 auto;
}

.solution2_img .inner_map .items_map .item:hover .box_content {
    opacity: 1;
}

/* --- Section 3: Dịch vụ OEM/ODM tabs --- */
section.solution3 {
    padding: 4rem 0 .5rem;
    background: #F9FBF9;
}

.solution3_for_item {
    padding-bottom: 2.5rem;
}

.solution3_for_item .inner {
    gap: 3rem;
}

.solution3_for_item .box_content {
    width: 52%;
    padding-top: 0;
    flex: 0 0 auto;
    position: relative;
    z-index: 2;
}

section.solution3 h2.title_head,section.solution3 h2.title_head p {
    font-family: 'Phudu', cursive;
    font-size: 2.3rem;
    font-weight: 600;
    color: #65BF11;
    line-height: 1.2;
    margin: 0 0 .5rem;
}
section.solution3 h2.title_head b {
    color: #3e6530;
}



.solution3_for_item .content {
    font-size: 0.8rem;
    font-weight: 500;
    color: #444;
    max-width: 32rem;
    line-height: 1.4;
}

.solution3_img {
    width: 48%;
    height: 17rem;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

.solution3_img img {
    width: auto;
    height: auto;
    display: block;
    float: right;
    max-width: calc(100% + 4rem);
    max-height: 100%;
    min-width: 100%;
}

.solution3_nav {
    border-top: 2px solid #65BF11;
}

.solution3_nav .item {
    flex: 1;
    padding: .4rem 1.2rem;
    border-top: 3px solid transparent;
    margin-top: -2px;
    cursor: pointer;
    transition: 0.2s all;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    transition: .5s all;
}

.solution3_nav .item span {
    font-size: 0.7rem;
    font-weight: 600;
    color: #8FB184;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: block;
}

.solution3_nav .item b {
    font-size: 0.72rem;
    font-weight: 700;
    color: #508741;
    text-transform: uppercase;
    line-height: 1.3;
    text-align: center;
    transition: .5s all;
}

.solution3_nav .item.active,
.solution3_nav .item:hover {background: #65BF11;color: #fff;}

.solution3_nav .item.active span,
.solution3_nav .item:hover span {
    color: #65BF11;
}

.solution3_nav .item.active b,
.solution3_nav .item:hover b {
    color: #fff;
}

/* --- Section 4: Sản phẩm chất lượng --- */
section.solution4 {
    padding: 4rem 0;
    background: #FFF5E6;
}

section.solution4 h2.title_head {font-size: 1.8rem;color: #3E6530;}

.solution4_wrap {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.solution4_wrap .left,
.solution4_wrap .right {
    width: 50%;
}

.solution4_wrap .center {
    width: 30rem;
    flex: 0 0 auto;
}

.solution4_img img {
    width: 100%;
    height: auto;
    display: block;
}

.solution4_list {
    display: flex;
    flex-direction: column;
    gap: 1.7rem;
}

.solution4_item .wrap_title {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    margin-bottom: 0.4rem;
}

.solution4_item .icon {
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
}

.solution4_item .icon img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform .6s ease;
}
.solution4_item:hover .icon img {
    transform: rotateY(360deg);
}

.solution4_item h3 {
    font-size: 1rem;
    font-weight: 600;
    color: #3E6530;
    margin: 0;
}

.solution4_item .content {
    font-size: .7rem;
    font-weight: 500;
    color: #555;
    line-height: 1.6;
}

/* Right side items align right */
.solution4_wrap .right .solution4_item .wrap_title {
    flex-direction: row-reverse;
    text-align: right;
}

.solution4_wrap .right .solution4_item .content {
    padding-left: 0;
    text-align: right;
}

/* --- Section 5: Cam kết chất lượng --- */
section.solution5 {
    position: relative;
    overflow: hidden;
}

section.solution5 > .row {
    position: relative;
    z-index: 1;
    padding: 1.8rem 0;
}

section.solution5 h2.title_head {
    color: #3E6530;
    font-family: 'Phudu', cursive;
    font-size: 1.8rem;
    text-align: center;
    margin-bottom: 0;
}

.solution5_box {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 0;
    position: relative;
}


.solution5_box_inner {
    position: relative;
    z-index: 1;
    padding: 3rem 0;
    gap: 4rem;
    align-items: center;
    justify-content: space-between;
}

.solution5_box_inner .left {
    width: 25rem;
}

.solution5_box_inner .left h3 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #508741;
    line-height: 1.4;
    margin: 0 0 1.5rem;
}

.solution5_img img {
    height: auto;
    display: block;
    max-width: 24rem;
}

.solution5_box_inner .right {
    width: 17rem;
}

.solution5_items {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.solution5_item {
    display: flex;
    gap: .6rem;
    align-items: center;
    background: #FFFFFFBF;
    border-radius: .8rem;
    border: 2px solid #fff;
}

.solution5_item .icon {
    width: 6rem;
    height: 6rem;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.solution5_item .icon img {
    width: 100%;
    height: auto;
    display: block;
    max-width: 90%;
    max-height: 90%;
    transition: transform .6s ease;
}
.solution5_item:hover .icon img {
    transform: rotateY(360deg);
}

.solution5_item .content {
    font-size: 0.72rem;
    font-weight: 700;
    color: #3E6530;
    line-height: 1.8;
    letter-spacing: -3%;
    padding: 1rem .6rem;
    line-height: 1.4;
}

/* --- Section 6: Làm bền vững (card slider) --- */
section.solution6 {
    padding: 2.3rem 0;
    background: #FFF5E680;
    overflow: hidden;
}

section.solution6 h2.title_head {
    font-family: 'Phudu', cursive;
    font-size: 2rem;
    margin-bottom: 2rem;
    text-align: center;
}

.solution6_slider {
    position: relative;
    overflow: hidden;
}

.solution6_item {
    overflow: hidden;
}

.solution6_item .box_img {
    padding-bottom: 75%;
    position: relative;
    overflow: hidden;
}

.solution6_item .box_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: 0.5s all;
}

.solution6_item:hover .box_img img {
    scale: 1.06;
}

.solution6_item h3 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #508741;
    margin: 0;
    padding: 0.8rem 1rem;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #FFF5E6B2;
    line-height: unset;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
    border: 4px solid #65BF11;
    text-align: center;
    line-height: 1.2;
    scale: .8;
    opacity: 0;
    transition: .6s all;
}

.solution6_pagination {
    display: none;
}

@media (max-width: 767px) {
    .solution6_slider .swiper-pagination {
        position: unset;
        margin-top: .5rem;
    }
    .solution6_pagination {
        position: static;
        display: flex;
        justify-content: center;
        gap: 0.4rem;
        margin-top: 1.2rem;
    }
    .solution6_pagination .swiper-pagination-bullet {
        width: 0.5rem;
        height: 0.5rem;
        border-radius: 50%;
        background: #C7D4C7;
        opacity: 1;
        margin: 0 !important;
        transition: 0.2s all;
    }
    .solution6_pagination .swiper-pagination-bullet-active {
        background: #508741;
        width: 1.2rem;
        border-radius: 0.3rem;
    }
}

/* --- Section 7: Đối tác chiến lược + Blog --- */
section.solution7 {
    padding: 4rem 0 2rem;
    background: #fff;
}

section.solution7 h2.heading_title {
    margin-bottom: 2.5rem;
}

.logo_prev,
.logo_next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -1.5rem;
    z-index: 10;
    cursor: pointer;
    opacity: 0.6;
    transition: 0.2s opacity;
}

.logo_next {
    left: unset;
    right: -1.5rem;
}

.logo_prev:hover,
.logo_next:hover {
    opacity: 1;
}

.logo_prev svg,
.logo_next svg {
    width: 0.8rem;
    height: auto;
    display: block;
}

/* Blog posts dưới đối tác */
.blog_wrap {
    margin-top: 2rem;
    overflow: hidden;
}

.blog_wrap .item_post img {
    border-radius: 0;
}

.blog_wrap .item_post:first-child {
    /* width: auto; */
    /* height: 12rem; */
    /* margin: 0; */
}

/* =========================================================
   AUTH PAGES — Login / Register / Forgot Password
   ========================================================= */
.auth_page {
  padding: 3rem 0 4rem;
}

.auth_wrap {
  align-items: center;
  gap: 1.2rem;
}

.auth_left {
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.auth_left img {
  max-width: 100%;
  height: auto;
  display: block;
}

.auth_right {
  width: 50%;
  flex-shrink: 0;
  background: #E0E6E0;
  padding: 2rem 2.2rem;
  border-radius: 0.4rem;
  border-radius: 1rem;
}


.auth_title {
  font-size: 2.25rem;
  font-weight: 700;
  text-align: center;
  margin: 0 0 0.4rem;
  letter-spacing: 0.02em;
  color: #222;
  font-family: 'Phudu', cursive;
  font-weight: 600;
}

.auth_desc {
  font-size: 0.75rem;
  color: #3E6530;
  text-align: center;
  margin-bottom: 1.2rem;
}

.auth_error {
  background: #fff0f0;
  border: 1px solid #fcc;
  color: #c33;
  padding: 0.45rem 0.7rem;
  border-radius: 0.2rem;
  font-size: 0.6rem;
  margin-bottom: 0.7rem;
}

.auth_success {
  background: #f0fff0;
  border: 1px solid #cfc;
  color: #363;
  padding: 0.45rem 0.7rem;
  border-radius: 0.2rem;
  font-size: 0.6rem;
  margin-bottom: 0.7rem;
}

/* ---- Password toggle ---- */
.password_input_wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.password_input_wrap input {
  flex: 1;
  padding-right: 2.2rem !important;
}

.password_toggle {
  position: absolute;
  right: 0.55rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #aaa;
  display: flex;
  align-items: center;
  padding: 0;
  line-height: 1;
  transition: color 0.2s;
  margin: 0;
}

.password_toggle:hover { color: #65BF11; }

.auth_form .form_field {
  margin-bottom: 1rem;
}

.auth_form .form_field:last-child {
  margin-bottom: 0;
}

.auth_form input[type="text"], .auth_form input[type="email"], .auth_form input[type="password"], .auth_form input[type="tel"], .auth_form input[type="date"], .auth_form select, .account_form input[type="text"], .account_form input[type="email"], .account_form input[type="password"], .account_form input[type="tel"], .account_form input[type="date"], .account_form select, .css-wdl1z9-control,.css-rvnxmf-control {
  width: 100%;
  padding: 0.55rem 0.8rem;
  border: 1px solid #8FB184;
  border-radius: 0.2rem;
  font-size: 0.65rem;
  background-color: transparent;
  outline: none;
  transition: border 0.2s;
  color: #333;
  border-radius: 0;
  box-shadow: none;
  height: 2.5rem;
  font-size: .75rem;
  opacity: .5;
  transition: .5s all;
  margin: 0;
  color: #3E6530;
}

.auth_form input:focus,
.auth_form select:focus,
.account_form input:hover,
.account_form input:focus{
  border-color: #65BF11;
}

.auth_form .form_row {
  gap: 0.5rem;
  margin-bottom: 0;
}

.auth_remember {
  gap: 0.35rem;
  font-size: 0.75rem;
  color: #3E6530;
  cursor: pointer;
  font-weight: 400;
  margin: 0;
}

.auth_remember input[type="checkbox"] {
  width: auto;
  margin: 0;
  cursor: pointer;
}

.link_forgot {
  font-size: 0.75rem;
  color: #0F1610;
  text-decoration: underline;
}

.link_forgot:hover {
  text-decoration: underline;
}

.btn_submit {
  width: 100%;
  justify-content: center;
  margin-top: 0.3rem;
  padding: 0.7rem 1rem;
  font-size: 1rem;
  border-radius: 0.2rem;
  background: #508741;
  border-radius: 0;
  height: 2.25rem;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  box-shadow: none !important;
  margin: 2.5rem 0 0 0;
}

.btn_submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.field_error {
  color: #c33;
  font-size: 0.55rem;
  margin-top: 0.2rem;
}

.auth_divider {
  text-align: center;
  margin: 2.5rem 0 0.8rem;
  position: relative;
  font-size: 0.8rem;
  color: #0F1610;
}

.auth_divider::before,
.auth_divider::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 28%;
  height: 1px;
  background: #ddd;
  display: none;
}

.auth_divider::before { left: 0; }
.auth_divider::after { right: 0; }

.auth_social {
  gap: 0.6rem;
  margin-bottom: 0.8rem;
  justify-content: center;
}

.social_btn {
  gap: 0.4rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid #ddd;
  border-radius: 0.25rem;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 400;
  cursor: pointer;
  text-decoration: none;
  transition: opacity 0.2s;
  width: auto;
  min-width: 8rem;
  display: inline-flex;
  border-radius: 100px;
  background: #fff;
  color: #3E6530;
}

.social_btn:hover { opacity: 0.85; }

.social_facebook {
}

.social_google {
  background: #fff;
  color: #333;
}

.auth_switch {
  font-size: 0.78rem;
  color: #3E6530;
  margin-top: 0.5rem;
}

.auth_switch a {
  color: #0F1610;
  font-weight: 600;
  text-decoration: none;
}

.auth_switch a:hover { text-decoration: underline; }

/* Captcha */
.captcha_row {
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.7rem;
}

.captcha_box {
  flex-shrink: 0;
  gap: 0.3rem;
}

.captcha_img {
  background: #00000059;
  padding: 0.4rem 0.7rem;
  border-radius: 0.2rem;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  font-family: monospace;
  color: #fff;
  user-select: none;
  border: 1px solid #ccc;
  min-width: 11.5rem;
  text-align: center;
  font-style: italic;
  border-radius: 0;
  filter: blur(.04rem);
}

.captcha_refresh {
  background: none;
  border: none;
  cursor: pointer;
  color: #65BF11;
  padding: 0.2rem;
  display: flex;
  align-items: center;
  transition: color 0.2s;
  margin: 0;
}

.captcha_refresh:hover { color: #508741; }

/* =========================================================
   ACCOUNT PAGES — Thông tin / Lịch sử / Địa chỉ / Mật khẩu
   ========================================================= */
.account_page {
  padding: 2.5rem 0 4rem;
}

.account_wrap {
  align-items: flex-start;
  gap: 2rem;
}

/* ---- Sidebar ---- */
.account_sidebar {
  width: 20rem;
  flex-shrink: 0;
  background: #E0E6E0;
  padding: 2.4rem 3rem 5.2rem;
}

.account_avatar {
  text-align: center;
  margin-bottom: 1.2rem;
}

.avatar_wrap {
  display: inline-block;
  position: relative;
  margin-bottom: 0.6rem;
}

.avatar_wrap img {
  width: 7rem;
  height: 7rem;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.avatar_placeholder {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #e8e8e8;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.avatar_edit {
  position: absolute;
  bottom: .5rem;
  right: .1rem;
  width: 1.5rem;
  height: 1.5rem;
  background: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  padding: 0;
  margin: 0;
  min-width: 1.5rem;
  min-height: unset;
}

.account_name {
  font-size: 1rem;
  font-weight: 600;
  color: #222;
}

.account_menu {
  display: flex;
  flex-direction: column;
  border-top: 1px solid #ddd;
  padding-top: 0;
}

.account_menu_item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.9rem 0.5rem;
  font-size: 0.8rem;
  font-weight: 700;
  color: #0F1610;
  text-decoration: none;
  border-bottom: 1px solid #b6bcb7;
  border-left: 3px solid transparent;
  transition: color 0.2s, border-color 0.2s;
  line-height: normal;
}

.account_menu_item:hover {
  color: #65BF11;
}

.account_menu_item.active {
  color: #222;
  border-left-color: #0F1610;
}

.account_menu_icon {
  flex-shrink: 0;
  color: #65BF11;
  display: flex;
  align-items: center;
}

/* ---- Avatar Popup ---- */
.avatar_popup_backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.avatar_popup {
  background: #fff;
  border-radius: 0.6rem;
  width: 90%;
  max-width: 22rem;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.2);
  overflow: hidden;
}

.avatar_popup_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid #eee;
}

.avatar_popup_header h3 {
  font-size: 0.8rem;
  font-weight: 700;
  color: #222;
  margin: 0;
}

.avatar_popup_close {
  background: none;
  border: none;
  font-size: 0.9rem;
  cursor: pointer;
  color: #888;
  line-height: 1;
  padding: 0;
}

.avatar_popup_body {
  padding: 1.2rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
}

.avatar_preview_wrap {
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #eee;
  background: #f5f5f5;
}

.avatar_preview_img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.avatar_preview_placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.avatar_upload_btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 1rem;
  background: #f0f0f0;
  border-radius: 2rem;
  font-size: 0.65rem;
  font-weight: 600;
  cursor: pointer;
  color: #444;
  transition: background 0.2s;
}

.avatar_upload_btn:hover { background: #e0e0e0; }

.avatar_upload_hint {
  font-size: 0.55rem;
  color: #999;
  margin: 0;
}

.avatar_popup_footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.6rem;
  padding: 0.8rem 1rem;
  border-top: 1px solid #eee;
}

.btn_avatar_cancel {
  padding: 0.4rem 0.9rem;
  background: #f0f0f0;
  border: none;
  border-radius: 0.3rem;
  font-size: 0.65rem;
  font-weight: 600;
  cursor: pointer;
  color: #555;
}

.btn_avatar_save {
  padding: 0.4rem 1rem;
  font-size: 0.65rem;
}

.btn_avatar_save:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ── Button loading spinner ─────────────────────────────────────── */
@keyframes btn_spin {
  to { transform: rotate(360deg); }
}
.btn_spinner {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  border: 2px solid rgba(255,255,255,0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: btn_spin 0.65s linear infinite;
  vertical-align: middle;
}

/* ---- Content ---- */
.account_content {
  flex: 1;
  min-width: 0;
  padding-top: 3rem;
}

.account_title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #222;
  margin: 0 0 1.2rem;
  font-family: 'Phudu', cursive;
  font-weight: 600;
}



.account_form input:focus,
.account_form select:focus {
  border-color: #65BF11;
}

.account_form .form_field {
  margin-bottom: 0.8rem;
}

.account_form .form_row {
  display: flex;
  gap: 0.6rem;
  margin-bottom: 0.8rem;
}

.account_form .form_row .form_field {
  flex: 1;
  margin-bottom: 0;
}

/* ---- Order History ---- */
.order_history_head {
  margin-bottom: 1rem;
}

.order_filter {
  gap: 0.4rem;
}

.order_tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid #e8e8e8;
  margin-bottom: 1.5rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.order_tabs::-webkit-scrollbar { display: none; }
.order_tab {
  flex-shrink: 0;
  padding: 0.6rem 1.1rem;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  font-size: 0.65rem;
  font-weight: 700;
  color: #999;
  white-space: nowrap;
  transition: color 0.15s;
}
.order_tab:hover { color: #508741; }
.order_tab.active { color: #508741; border-bottom-color: #508741; }
.order_tab_count { margin-left: 0.25rem; font-size: 0.6rem; font-weight: 400; }

.order_filter_btn {
  padding: 0.35rem 0.8rem;
  font-size: 0.55rem;
  font-weight: 600;
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 0.2rem;
  cursor: pointer;
  color: #555;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.order_filter_btn.active,
.order_filter_btn:hover {
  background: #65BF11;
  color: #fff;
  border-color: #65BF11;
}

.order_list {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.order_item {
  border: 1px solid #e8e8e8;
  border-radius: 0.3rem;
  overflow: hidden;
}

.order_item_head {
  background: #f9f9f7;
  padding: 0.6rem 1rem;
  border-bottom: 1px solid #e8e8e8;
}

.order_info {
  gap: 0.8rem;
  align-items: center;
}

.order_code {
  font-size: 0.6rem;
  font-weight: 600;
  color: #333;
}

.order_date {
  font-size: 0.58rem;
  color: #888;
}

.order_status {
  font-size: 0.58rem;
  font-weight: 600;
  padding: 0.2rem 0.6rem;
  border-radius: 0.2rem;
}

.status_pending   { color: #b45309; background: #fef3c7; }
.status_confirmed { color: #1d4ed8; background: #dbeafe; }
.status_shipping  { color: #1877F2; background: #e8f0fe; }
.status_done      { color: #363; background: #e8f8e8; }
.status_cancelled { color: #c33; background: #fee; }
.order_page_btn { padding: 0.3rem 0.7rem; border: 1px solid #ddd; border-radius: 0.3rem; background: #fff; font-size: 0.6rem; cursor: pointer; }
.order_page_btn.active { background: #508741; color: #fff; border-color: #508741; }
.order_product_img_placeholder { width: 3rem; height: 3rem; background: #f0f0f0; border-radius: 0.3rem; }

.order_products {
  padding: 0.5rem 1rem;
}
.order_group_label { font-size: 0.55rem; font-weight: 700; padding: 0.3rem 0.6rem; border-radius: 0.25rem; display: inline-block; margin: 0.4rem 0 0.2rem; }
.order_label_upsell { background: #eef4ff; color: #2563eb; }
.order_label_gift   { background: #f0fce8; color: #508741; }

.order_product_row {
  padding: 0.5rem 0;
  border-bottom: 1px solid #f0f0f0;
  gap: 0.7rem;
}

.order_product_row:last-child { border-bottom: none; }

.order_product_img {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
}

.order_product_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.2rem;
}

.order_product_name {
  font-size: 0.62rem;
  font-weight: 500;
  color: #333;
  margin-bottom: 0.15rem;
}

.order_product_qty {
  font-size: 0.58rem;
  color: #888;
}

.order_product_price {
  font-size: 0.62rem;
  font-weight: 600;
  color: #333;
  flex-shrink: 0;
}

.order_item_foot {
  padding: 0.6rem 1rem;
  border-top: 1px solid #e8e8e8;
  background: #fafaf8;
}

.btn_repurchase {
  padding: 0.4rem 1.2rem;
  font-size: 0.6rem;
}

.order_total {
  font-size: 0.65rem;
  color: #555;
}

.order_total strong {
  font-size: 0.8rem;
  color: #222;
  margin-left: 0.3rem;
}

/* ---- Address List ---- */
.address_list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  margin-bottom: 1rem;
}

.address_item {
  border: 1px solid #e8e8e8;
  border-radius: 0.3rem;
  padding: 0.8rem 1rem;
}

.address_item_head {
  margin-bottom: 0.4rem;
}

.address_name {
  font-size: 0.65rem;
  color: #222;
}

.address_edit {
  background: none;
  border: none;
  cursor: pointer;
  color: #65BF11;
  padding: 0.2rem;
  display: flex;
  align-items: center;
}

.address_delete {
  background: none;
  border: none;
  cursor: pointer;
  color: #e74c3c;
  padding: 0.2rem;
  display: flex;
  align-items: center;
}
.address_set_default {
  background: none;
  border: 1px solid #508741;
  color: #508741;
  border-radius: 0.3rem;
  padding: 0.2rem 0.5rem;
  font-size: 0.55rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.address_set_default:hover { background: #508741; color: #fff; }
.address_set_default:disabled { opacity: 0.5; cursor: default; }
.address_default_badge {
  background: #508741;
  color: #fff;
  border-radius: 0.3rem;
  padding: 0.15rem 0.45rem;
  font-size: 0.5rem;
  font-weight: 700;
}
.address_item_default { border-color: #508741; }

.address_row {
  gap: 0.4rem;
  margin-top: 0.3rem;
}

.address_icon {
  flex-shrink: 0;
  color: #65BF11;
  display: flex;
  align-items: center;
}

.address_row span:last-child {
  font-size: 0.6rem;
  color: #555;
}

.address_add {
  background: none;
  border: none;
  cursor: pointer;
  gap: 0.4rem;
  color: #65BF11;
  font-size: 0.62rem;
  font-weight: 600;
  padding: 0;
  margin-top: 0.5rem;
}

.address_add_icon {
  font-size: 1rem;
  line-height: 1;
}

/* =========================================================
   ORDER SEARCH — Tra cứu đơn hàng
   ========================================================= */
.order_search_page {
  padding: 7rem 0;
}

.order_search_wrap {
  max-width: 38rem;
  margin: 0 auto;
}

.order_search_title {
  font-size: 2.6rem;
  font-weight: 600;
  color: #222;
  margin: 0 0 1.5rem;
  font-family: 'Phudu', cursive;
}

.order_search_fields {
  gap: 0.8rem;
  margin-bottom: 0.8rem;
}

.order_search_fields .form_field {
  flex: 1;
}

.order_search_fields input {
  width: 100%;
  padding: 0.6rem 0.9rem;
  border: 1px solid #C7D4C7;
  border-radius: 0.2rem;
  font-size: 0.8rem;
  outline: none;
  color: #333;
  transition: border 0.2s;
  height: 2.5rem;
  margin: 0;
  border-radius: 0;
  color: #3E6530;
}

.order_search_fields input:focus {
  border-color: #65BF11;
}

.order_search_note {
  font-size: 0.7rem;
  color: #3E6530;
  margin-top: 0.8rem;
}

.hotline_link {
  color: #65BF11;
  font-weight: 600;
  text-decoration: underline;
}

.hotline_link:hover { text-decoration: underline; }

/* =========================================================
   ORDER RESULT — Kết quả tra cứu
   ========================================================= */
.order_result_page {
  padding: 3rem 0 4rem;
}

.order_result_title {
  font-size: 2.6rem;
  font-weight: 600;
  color: #222;
  margin: 0 0 1.5rem;
  font-family: 'Phudu', cursive;
}

.order_result_card {
  border-radius: 1rem;
  overflow: hidden;
  max-width: 45rem;
  margin: auto;
  background: #f9faf9;
  padding: 0 1.3rem 0;
}

.order_result_head {
  border-bottom: 2px solid #8FB184;
  padding: .7rem 0;
}

.order_result_head .order_result_info {
  font-size: 0.6rem;
  color: #3E6530;
}

.order_result_head .order_result_info strong {
  color: #3E6530;
  margin: 0 0.3rem;
}

.order_result_date {
  font-size: 0.6rem;
  color: #3E6530;
  margin-left: 0.5rem;
}

.order_result_status {
  font-size: 0.58rem;
  font-weight: 500;
  color: #65BF11;
}

.order_result_products {
}

.order_result_row {
  padding: 0.7rem 0;
  border-bottom: 1px solid #f0f0f0;
  gap: 0.7rem;
}

.order_result_row:last-child { border-bottom: none; }

.order_result_num {
  font-size: 0.75rem;
  color: #3E6530;
  width: 1rem;
  flex-shrink: 0;
  text-align: center;
  flex: 0 0 auto;
}

.order_result_img {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  flex: 0 0 auto;
}

.order_result_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.2rem;
}

.order_result_name {
  font-size: 0.62rem;
  font-weight: 500;
  color: #333;
  margin-bottom: 0.15rem;
}

.order_result_qty {
  font-size: 0.58rem;
  color: #888;
}

.order_result_price {
  font-size: 0.7rem;
  font-weight: 400;
  color: #3E6530;
  width: 100%;
  text-align: right;
}

.order_result_foot {
  padding: 0.8rem 1.2rem;
  border-top: 1px solid #e8e8e8;
  background: #fafaf8;
  gap: 0.8rem;
  padding-right: 0;
}

.order_result_total_label {
  font-size: 0.65rem;
  color: #3E6530;
}

.order_result_total {
  font-size: 1.3rem;
  font-weight: 700;
  color: #222;
}

/* ══════════════════════════════════════════
   STORE HEADER
══════════════════════════════════════════ */
.store_header {
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}

.store_header_top {
  background: #1a1a1a;
  padding: 0.7rem 0;
  position: relative;
  z-index: 2;
}

.store_header_top_inner {
  gap: 2rem;
}

.store_logo {
  flex-shrink: 0;
}
.store_logo img {
  height: 2.4rem;
  width: auto;
  display: block;
}

.store_lang_flag {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.store_lang_flag img {
  width: 1.1rem;
  height: auto;
  display: block;
}

.store_solution_btn {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid #fff;
  border-radius: 0;
  padding: 0 1.5rem;
  color: #fff;
  font-size: 0.8rem;
  white-space: nowrap;
  text-decoration: none;
  transition: background .2s;
  margin: 0;
  text-transform: math-auto;
  font-weight: 600;
  height: 2.4rem;
}
.store_solution_btn:hover { background: rgba(255,255,255,.08); }

.store_search_wrap {
  flex: 1;
  position: relative;
}
.store_search {
  width: 100%;
  background: #2e2e2e;
  border-radius: 0;
  overflow: hidden;
  border: 1px solid #fff;
  margin: 0;
  height: 1.8rem;
  background: #FFFFFF33;
}
/* Search suggest dropdown */
.search_suggest_dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #fff;
  border-radius: 0;
  box-shadow: 0 0.4rem 1.5rem rgba(0,0,0,0.18);
  z-index: 1000;
  padding: 1rem;
  min-width: 20rem;
}
.search_suggest_keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.8rem;
}
.search_suggest_kw {
  background: #fff;
  border: 1px solid #8FB184;
  padding: 0.25rem 0.8rem;
  font-size: 0.65rem;
  color: #8FB184;
  cursor: pointer;
  white-space: nowrap;
  margin: 0;
  line-height: normal;
  height: 1.67rem;
  transition: .5s all;
}
.search_suggest_kw:hover {
  background: #508741;
  border-color: #508741;
  color: #fff;
}
.search_suggest_label {
  font-size: 0.8rem;
  font-weight: 700;
  color: #0F1610;
  margin-bottom: 0.6rem;
}
.search_suggest_product_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.2rem;
  background: #FFF5E6;
  padding: .2rem;
}
.search_suggest_product_item {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  text-decoration: none;
  color: #333;
  border-radius: 0.3rem;
  padding: 0.4rem;
  transition: border-color 0.2s;
  background: #FFFFFF;
}
.search_suggest_product_item:hover { border-color: #508741; }
.search_suggest_product_img {
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 0.2rem;
}
.search_suggest_product_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  scale: 1;
  transition: .5s all;
}
.search_suggest_product_name {
  font-size: 0.5rem;
  color: #333;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-weight: 600;
}
.search_suggest_loading,
.search_suggest_empty {
  font-size: 0.7rem;
  color: #888;
  text-align: center;
  padding: 0.8rem 0;
}
.search_suggest_news {
  margin-top: 0.8rem;
}
.search_suggest_news_list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.search_suggest_news_item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  text-decoration: none;
  padding: 0.3rem;
  border-radius: 0.3rem;
  transition: background-color 0.2s;
}
.search_suggest_news_item:hover { background: #FFF5E6; }
.search_suggest_news_img {
  width: 2.4rem;
  height: 2.4rem;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 0.2rem;
}
.search_suggest_news_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.search_suggest_news_title {
  font-size: 0.65rem;
  color: #0F1610;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-weight: 600;
}
.search_suggest_viewall {
  display: block;
  width: 100%;
  margin-top: 0.8rem;
  padding: 0.5rem;
  background: #508741;
  color: #fff;
  border: none;
  font-size: 0.65rem;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.2s;
}
.search_suggest_viewall:hover { background: #3E6530; }
.store_search input {
  flex: 1;
  border: none;
  background: transparent !important;
  color: #fff !important;
  padding: 0.45rem 0.8rem;
  font-size: 0.7rem;
  outline: none;
  margin: 0;
  box-shadow: none !important;
  min-height: unset;
  padding: 0 .6rem;
  height: 100%;
  font-style: italic;
}
.store_search input::placeholder { color: #888; }
.store_search_btn {
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  margin: 0;
  min-height: unset;
  height: 100%;
  width: 3rem;
  justify-content: center;
}

.store_header_actions {
  gap: 1.2rem;
  flex-shrink: 0;
}

.store_hotline {
  gap: 1rem;
  text-decoration: none;
  color: #fff;
}
.store_hotline_icon { display: flex; align-items: center; }
.store_hotline_text { display: flex; flex-direction: column; line-height: 1.2; }
.store_hotline_label {font-size: 0.6rem;color: #fff;text-transform: uppercase;font-weight: 500;line-height: 1.4;display: block;margin-bottom: .15rem;}
.store_hotline_num {font-size: 0.6rem;font-weight: 600;color: #fff;}

.store_user {
  gap: 0.4rem;
  text-decoration: none;
  color: #fff !important;
}
.store_user_text {display: flex;flex-direction: column;font-size: 0.6rem;line-height: 1.3;font-weight: 500;}

/* Toggle guest/logged-in button — inline script sets html[data-user] trước khi paint */
.su_guest { display: flex; }
.su_loggedin { display: none; }
html[data-user] .su_guest { display: none; }
html[data-user] .su_loggedin { display: flex; }

.header_cart_btn {
  background: transparent;
  border: none;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
}
.header_cart_badge {
  position: absolute;
  top: -0.4rem;
  right: -0.4rem;
  background: #65BF11;
  color: #fff;
  font-size: 0.5rem;
  font-weight: 700;
  min-width: 1rem;
  height: 1rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.2rem;
}

/* Store nav */
.store_header_nav {
  background: #3E6530;
}
.store_nav_list {
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0 -1rem;
  justify-content: space-between;
}
.store_nav_item {
  position: relative;
  margin: 0;
}
.store_nav_link {
  display: block;
  padding: 0.7rem 1rem;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  text-transform: uppercase;
  transition: .3s all;
}
.store_nav_link:hover {background: #FFFFFF;color: #508741;}

.store_nav_sub {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #e8e8e8;
  border-top: 2px solid #65BF11;
  border-radius: 0 0 0.3rem 0.3rem;
  min-width: 12rem;
  z-index: 100;
  list-style: none;
  padding: 0.3rem 0;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
  margin: 0;
}
ul.store_nav_sub li { margin: 0; }
.store_nav_sub li a {
  display: block;
  padding: 0.5rem 1rem;
  color: #222;
  font-size: 0.65rem;
  text-decoration: none;
}
.store_nav_sub li a:hover { background: #f5f5f0; color: #508741; }

/* Solution header placeholder */
/* ─── SOLUTION HEADER ────────────────────────────────────────────────────── */
.solution_header {
  background: #111;
  position: sticky;
  top: 0;
  z-index: 1000;
  border-bottom: 1px solid rgba(255,255,255,.07);
  padding: 1rem 0;
}
.sol_header_inner {justify-content: space-between;gap: 1rem;}

.sol_nav {gap: 0;width: 50%;justify-content: space-between;padding-right: 5rem;}
.sol_nav_right {justify-content: flex-start;padding-left: 5rem;padding-right: 0;}
.sol_nav_item {
  display: inline-block;
  padding: 0 1rem;
  font-size: 0.7rem;
  font-weight: 700;
  color: rgba(255, 255, 255, .85);
  text-decoration: none;
  line-height: 2.8rem;
  width: max-content;
  transition: .5s all;
  background: transparent;
  text-transform: uppercase;
}

.sol_nav_item:hover {color: #65BF11;background: #FFFFFF;}

.sol_nav_item_wrap {position: relative;display: flex;align-items: center;}
.sol_nav_item_wrap.has_sub > .sol_nav_item {padding-right: 0.6rem;}
.sol_nav_dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 13rem;
  background: #fff;
  border-radius: 0;
  box-shadow: 0 4px 20px rgba(0,0,0,.12);
  z-index: 999;
  list-style: none;
  margin: 0;
  padding: 0;
}
.sol_nav_dropdown li { margin: 0; }
.sol_nav_dropdown li a {
  display: block;
  padding: 0.55rem 1.2rem;
  font-size: 0.65rem;
  font-weight: 600;
  color: #333;
  text-decoration: none;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.sol_nav_dropdown li a:hover {background: #f0f7e8;color: #508741;}

.sol_logo {flex-shrink: 0;display: flex;align-items: center;position: absolute;left: 50%;transform: translateX(-50%);}
.sol_logo img {height: 3rem;width: auto;object-fit: contain;}

.sol_header_extras {gap: 0.8rem;margin-left: .5rem;}
.sol_lang { display: flex; align-items: center; opacity: .85; }
.sol_lang img {display: block;border-radius: 0;min-width: 1rem;}
.sol_search_toggle { background: none; border: none; cursor: pointer; padding: 0; display: flex; align-items: center; opacity: .85; }
.sol_search_toggle:hover { opacity: 1; }

/* Popup tìm kiếm toàn màn hình (khu Giải Pháp) */
.sol_search_overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(20, 32, 20, 0.75);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh 1.5rem 2rem;
  animation: solSearchFade 0.25s ease;
}
@keyframes solSearchFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.sol_search_overlay_close {
  position: absolute;
  top: 2rem;
  right: 2.5rem;
  background: none;
  border: none;
  color: #fff;
  opacity: 0.8;
  cursor: pointer;
  padding: 0.5rem;
  display: flex;
  transition: 0.25s all;
}
.sol_search_overlay_close:hover {
  opacity: 1;
  transform: rotate(90deg);
}
.sol_search_overlay_inner {
  width: 100%;
  max-width: 42rem;
  animation: solSearchUp 0.35s cubic-bezier(.2,.8,.2,1);
}
@keyframes solSearchUp {
  from { opacity: 0; transform: translateY(18px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.sol_search_overlay_form {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  border-bottom: 2px solid rgba(255,255,255,0.35);
  padding-bottom: 1rem;
  transition: border-color 0.25s;
}
.sol_search_overlay_form:focus-within {
  border-color: #65BF11;
}
.sol_search_overlay_form svg {
  color: #fff;
  opacity: 0.85;
  flex-shrink: 0;
}
.sol_search_overlay_input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 500;
}
.sol_search_overlay_input::placeholder { color: rgba(255,255,255,0.55); }
.sol_search_overlay_submit {
  background: #65BF11;
  border: none;
  border-radius: 2rem;
  color: #142014;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  padding: 0.7rem 1.4rem;
  cursor: pointer;
  white-space: nowrap;
  transition: 0.25s all;
}
.sol_search_overlay_submit:hover {
  background: #fff;
  transform: translateY(-1px);
}
.sol_search_overlay_suggest {
  margin-top: 2rem;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.8rem 1rem;
}
.sol_search_overlay_suggest_label {
  color: rgba(255,255,255,0.6);
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}
.sol_search_overlay_keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.sol_search_overlay_kw {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 2rem;
  color: #fff;
  font-size: 0.68rem;
  padding: 0.45rem 1rem;
  cursor: pointer;
  transition: 0.2s all;
}
.sol_search_overlay_kw:hover {
  background: #65BF11;
  border-color: #65BF11;
  color: #142014;
  transform: translateY(-1px);
}
@media (max-width: 767px) {
  .sol_search_overlay { padding-top: 6rem; }
  .sol_search_overlay_close { top: 1.2rem; right: 1.2rem; }
  .sol_search_overlay_input { font-size: 1rem; }
  .sol_search_overlay_submit { padding: 0.6rem 1rem; font-size: 0.6rem; }
}

button.sol_search_overlay_submit {
    margin: 0;
    background: #508741;
    color: #fff;
    border-radius: 0;
    padding: 0;
    height: 2.5rem;
    padding: 0 1.5rem;
}

input.sol_search_overlay_input {
    margin: 0;
    height: 2.5rem;
    color: #000;
}

input.sol_search_overlay_input::placeholder {
    color: #000;
    opacity: .5
}

main#main {}

.sol_search_overlay_form svg {
    display: none;
}

.sol_search_overlay_suggest_label {
    color: #fff;
    display: block;
}

button.sol_search_overlay_kw {
    margin: 0;
    border-radius: 0;
    padding: .2rem .5rem;
}

.sol_search_overlay_suggest {
    flex-direction: column;
}

/* Solution search page */
.sol_search_page { padding: 3rem 0; }
.sol_search_page_wrap { max-width: 50rem; margin: 0 auto; }
.sol_search_page_heading {
  font-size: 1.5rem;
  font-weight: 800;
  color: #222;
  margin-bottom: 1.5rem;
  text-transform: uppercase;
}
.sol_search_page_form {
  gap: 0.5rem;
  margin-bottom: 1.2rem;
}
.sol_search_page_input {
  flex: 1;
  border: 2px solid #e0e0e0;
  border-radius: 2rem;
  padding: 0.7rem 1.3rem;
  font-size: 0.75rem;
  outline: none;
  transition: border-color 0.2s;
}
.sol_search_page_input:focus { border-color: #3E6530; }
.sol_search_page_btn {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: #3E6530;
  color: #fff;
  border: none;
  border-radius: 2rem;
  padding: 0.7rem 1.4rem;
  font-size: 0.65rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
}
.sol_search_page_btn:hover { background: #508741; }
.sol_search_result_label {
  font-size: 0.7rem;
  color: #666;
  margin-bottom: 1.5rem;
}
.sol_search_hint {
  color: #aaa;
  font-size: 0.75rem;
  text-align: center;
  padding: 3rem 0;
}
.sol_search_grid {
  margin-top: 1rem;
}

footer#footer {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.recruitment_item {
    position: relative;
    display: flex;
    width: calc(calc(100% / 2) - 1.4rem);
    background: #fff;
    margin: 0 .7rem;
    padding: .6rem;
    gap: .8rem;
    transition: .5s all;
}

.recruitment_list {
    display: flex;
    flex-wrap: wrap;
    row-gap: 1.2rem;
}

.recruitment_tab_content {
    position: relative;
    padding-bottom: 5.1rem;
    margin: 0 -.7rem;
    z-index: 0;
    padding-top: 2rem;
}

.recruitment_tab_content:before {
    position: absolute;
    content: '';
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background: #FFF5E680;
    height: 100%;
    width: 100vw;
    padding-top: 1.7rem;
    pointer-events: none;
    z-index: -1;
}

.recruitment_item_img {
    padding-bottom: 6rem;
    position: relative;
    width: 6rem;
    flex: 0 0 auto;
    overflow: hidden;
}

.recruitment_item_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.recruitment_item_content {
    width: 100%;
    display: flex;
    gap: 1rem;
    align-items: stretch;
}

.recruitment_item h3 {
    font-size: .8rem;
    text-transform: uppercase;
    color: #3E6530;
    font-weight: 700;
    margin: 0 0 .3rem;
}

/* Cột trái */
.recruitment_item_left {flex: 1;min-width: 0;display: flex;flex-direction: column;justify-content: space-between;}
.recruitment_item_dept { font-size: .75rem; font-weight: 700; color: #3E6530; text-transform: uppercase; margin: 0 0 .6rem; }
.recruitment_item_meta {display: flex;flex-direction: column;gap: .05rem;}
.recruitment_item_meta .meta_row { font-size: .65rem; color: #555; display: flex; gap: .3rem; }
.recruitment_item_meta .meta_row .label { color: #555; font-weight: 400; }
.recruitment_item_meta .meta_row span:last-child {font-weight: 600;color: #222;}

/* Cột phải */
.recruitment_item_right {
    flex: 0 0 8rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    padding-left: 1rem;
}
.recruitment_item_deadline { text-align: right; }
.recruitment_item_deadline .label {display: block;font-size: .7rem;color: #0F1610;margin-bottom: 0;}
.recruitment_item_deadline span:last-child {font-size: .7rem;color: #0F1610;margin-bottom: .2rem;}
.recruitment_item_apply {
    font-size: .8rem;
    font-weight: 700;
    color: #508741;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .04em;
    position: relative;
    z-index: 2;
}
.recruitment_item_apply:hover { color: #508741; text-decoration: underline; }
.recruitment_tabs {
    justify-content: center;
}

.recruitment_tab {
    height: 2.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 2rem;
    color: #508741;
    font-weight: 700;
    transition: .5s all;
    background: transparent;
    cursor: pointer;
}

.recruitment_tab:hover,.recruitment_tab.active {
    background: #FFF5E6;
    color: #65BF11;
}

section.recruitment2 {
    padding-top: 2rem;
}
.recruitment_filter {
    justify-content: center;
    gap: .6rem;
    margin-bottom: .8rem;
}

.recruitment_filter input[type="text"],.custom_select_trigger {
    color: #8FB184;
    height: 2.1rem;
    box-shadow: none;
    border: 1px solid #508741;
    width: 15rem;
    padding: 0 1.2rem;
    font-style: italic;
    font-size: .6rem;
    background: rgb(255 255 255 / 50%);
    margin: 0;
}

.recruitment_filter input[type="text"]::placeholder {
    color: #8FB184;
}

button.filter_btn {
    margin: 0;
    background: #508741;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 2.1rem;
    height: 2.1rem;
}

button.filter_btn svg {
    filter: brightness(0) invert(1);
    width: .9rem;
    height: auto;
}


.recruitment_item_dept {
    display: none;
}

.recruitment_item:hover {
    background: #5087411f;
}
section.recruitment1 {
    padding: 1.2rem 2.4rem;
}

.wrap_slider.recruitment1_slider {}

section.recruitment1 .swiper-pagination {
    position: unset;
    margin-top: .6rem;
}

.swiper-pagination span.swiper-pagination-bullet {
    width: .8rem;
    height: .8rem;
    background: #D9D9D9;
    opacity: 1;
    transition: .5s all;
    margin: 0 .4rem !important;
}

.swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #65BF11;
    width: 1.2rem;
    border-radius: 100px;
    width: 5em;
    margin: 0;
}

.recruitment1_slider img {
    width: 100%;
    height: auto;
    display: block;
}
.recruitment_detail_head {
    z-index: 0;
    position: relative;
    padding: .9rem 0;
}

.recruitment_detail_head:before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    height: 100%;
    background: #C7D4C780;
    z-index: -1;
}

.recruitment_detail_title h1 {
    font-size: 1.6rem;
    color: #3E6530;
    margin-bottom: .6rem;
}

.recruitment_detail_meta {
    gap: 1.2rem;
    font-size: .6rem;
    color: #0F1610;
}

.recruitment_detail_meta b {
    font-weight: 600;
}

.recruitment_detail_head a.button_link {
    background: #65BF11;
    border-radius: 0;
    padding: 0 2.2rem;
    height: 2.8rem;
    line-height: 1;
    font-size: 1rem;
}

.button_link:hover {
    background: #3E6530 !important;
    color: #fff !important;
}

.recruitment_detail_wrap.flex {
    background: #FFF5E680;
    margin-top: .5rem;
    padding: 2.6rem 2.6rem 8rem;
    align-items: flex-start;
    justify-content: space-between;
}

.recruitment_detail_block h1,.recruitment_detail_block h2,.recruitment_detail_block h3,.recruitment_detail_block h4,.recruitment_detail_block h5 {
    color: #508741;
}

.recruitment_detail_block ul {
    margin-left: 2rem;
}

.recruitment_detail_block {
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1.6;
}

.recruitment_detail_sidebar {
    background: #C7D4C7;
    width: 15rem;
    flex: 0 0 auto;
    margin-left: 3.5rem;
    padding: 1.1rem;
    border-radius: .4rem;
}

.sidebar_item {
    display: flex;
    flex-direction: column;
    font-size: .7rem;
    color: #3E6530;
    padding: .8rem 0;
}

.sidebar_item b {
    font-size: 1rem;
}

.sidebar_item:first-child {
    padding-top: 0;
}

.sidebar_row {
    padding: .8rem 0;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    justify-content: space-between;
}

.sidebar_row .sidebar_item {
    padding: 0;
    width: 5rem;
}

.sidebar_row span.label {
    font-size: .7rem;
    font-weight: 500;
    border-bottom: 2px solid #3E6530;
    padding-bottom: .4rem;
    margin-bottom: .4rem;
}

.sidebar_block {
    padding-top: .8rem;
}

.sidebar_block h3 {
    font-size: 1rem;
    color: #3E6530;
    margin-bottom: .3rem;
}

.sidebar_row .content {
    color: #3E6530;
    font-size: .6rem;
    font-weight: 500;
}

.sidebar_row .content ul,.sidebar_row .content ol {
    margin-left: 1rem;
}

.sidebar_row .content ul li, .sidebar_row .content ol li {
    margin: 0;
}

.contact_row {
    font-weight: 700;
    color: #3E6530;
    font-size: .6rem;
    position: relative;
    display: flex;
    align-items: center;
    gap: .3rem;
}

.contact_row span.label {
    margin-right: .2rem;
}

.contact_row:before {
    content: '';
    width: .2rem;
    height: .2rem;
    border-radius: 100px;
    display: inline-block;
    background: #3E6530;
    margin-left: .3rem;
    flex: 0 0 auto;
}

.sidebar_contact p {
    margin-bottom: .3rem;
    color: #3E6530;
    font-size: .6rem;
    font-weight: 500;
}
.store1_wrap {
    display: flex;
    gap: 1.2rem;
}

.store1_wrap_left {
    width: 66%;
}

.store1_wrap_right {
    width: 34%;
}

.store1_img {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}
.store1_img .item_img { overflow: hidden; }
.store1_img .item_img::after {
    content: ''; position: absolute; top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transform: skewX(-20deg); pointer-events: none; transition: none;
}
.store1_img .item_img:hover::after { left: 130%; transition: left 0.55s ease; }

section.store1 {
    padding-top: .5rem;
}

.store1_slider {
    height: 100%;
    position: relative;
}
.store1_slider .store1_dots {
    bottom: -2rem;
}

.item_img {
    position: relative;
}

.store1_slider_item {
    height: 27.7rem;
    position: relative;
    overflow: hidden;
}
.store1_slider_item::after {
    content: ''; position: absolute; top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transform: skewX(-20deg); pointer-events: none; transition: none;
}
.store1_slider_item:hover::after { left: 130%; transition: left 0.55s ease; }

.store1_slider_item img {
    height: 100%;
    object-fit: cover;
    width: 100%;
    transition: transform .5s ease;
}
.store1_slider_item:hover img { transform: scale(1.08); }

.store1_wrap_right .item_img img {
    height: 13.55rem;
    object-fit: cover;
    transition: transform .5s ease;
}
.store1_img .item_img:hover img { transform: scale(1.08); }
.store2_item {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: 0 1rem;
}

.store2_item a.box_img {
    width: 5.9rem;
    height: 5.9rem;
    flex: 0 0 auto;
}
.store2_item a.box_img img {
    transform: rotateY(0deg);
    transition: 1s all;
}
.store2_item:hover a.box_img img {
    transform: rotateY(360deg);
}

.store2_item h3 {
    font-size: 1rem;
    margin: 0;
    color: #508741;
}

.store2_slider {
    margin-top: 3.4rem;
}
.title_head b {
    color: #508741;
    font-weight: 600;
}

.solution2_item {
    width: calc(calc(100% / 3) - 0.6rem);
    margin: .3rem;
    border: 1px solid #65BF11;
    background: #fff;
    padding: 1rem .5rem;
}

.solution2_item:last-child {
    display: flex;
    align-items: center;
    justify-content: center;
}
section.solution3 .row {
    padding: 0 3rem;
}

.solution3_nav .item p {
    margin: 0;
    font-size: .7rem;
}

.solution3_nav .item b {
    font-size: 1rem;
}
section.solution4 .row {padding: 0 3rem;}
.solution6_item .box_img {
    padding-bottom: 100%;
    position: relative;
}

.solution6_item:hover h3 {
    scale: 1;
    opacity: 1;
}
.about2 .row:first-child {
    padding: 0 3rem;
}

section.solution7 .blog_wrap .item_post:first-child {
    height: 22.7rem;
    width: calc(calc(100% - 15rem) - .7rem);
}

section.solution7 .blog_wrap .item_post {
    height: 11rem;
    width: 15rem;
}

section.solution7 .blog_wrap .item_post .box_content {
    right: 0;
    background: linear-gradient(0deg, black, #00000082);
}

section.solution7 .blog_wrap .item_post:first-child h3 {
    font-size: 1.4rem;
}

section.solution7 .blog_wrap .item_post h3 {
    font-weight: 600;
}

.item_post>div:not(.box_content) {
    height: 100%;
}
section.distribution2 h2.title_head, section.distribution3 h2.title_head,section.distribution4 h2.title_head {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
}
.distribution_template main#main .row {
    max-width: 48rem;
}

h2.distribution5_title span {
    font-family: 'Piklab Geofanny';
    color: #508741;
    font-size: 5rem;
    font-weight: normal;
    line-height: 1;
    margin-left: -6rem;
}

.distribution4_img img {float: right;max-width: 28rem;width: calc(100% + 12rem);}

.distribution4_img {
    width: 35%;
    flex: 0 0 auto;
    margin-bottom: -2rem;
}

.distribution4_wrap.flex.items-center {
    gap: 3rem;
}
h2.team_cta_title span {
    font-family: 'Piklab Geofanny';
    font-weight: normal;
    font-size: 5rem;
    color: #508741;
    position: absolute;
    width: max-content;
    top: -2rem;
    left: -4rem;
}

.team_template  main#main .row {
    max-width: 61rem;
}


section.team_page .story_page_top .row {
    padding: 0 8rem;
}
.distribution4_logos {
    width: 100%;
}
.partner_template #main .row {
    max-width: 60rem;
}

section.partner_page  .row {
    padding: 0 6rem;
}

section.partner2 {
    background: #FFF5E680;
    margin-top: 1rem;
    padding-top: 2.5rem;
}

.partner2_img {
    width: 41rem;
    flex: 0 0 auto;
}
.partner2_img img {
    width: 100%;
}

.partner2_wrap {
    gap: 1.5rem;
}

.partner2_content {
    width: 100%;
    text-align: justify;
    font-weight: 600;
}

.partner2_content h2.title_head {
    font-size: 1.6rem;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
}

.partner2_logos {
    position: relative;
    margin-top: 1.75rem;
    margin: 1.75rem -.6rem;
}

.partner2_logos .item_logo {
    height: 7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    margin: 0 .6rem;
}

.partner2_logos .item_logo img {
    max-width: 60%;
    max-height: 60%;
    width: auto;
    height: auto;
    display: block;
    margin: auto;
}

.partner2_prev,.partner2_next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -2rem;
    scale: 1;
    transition: .5s all;
    cursor: pointer;
}
.partner2_prev:hover, .partner2_next:hover { scale: .9; }

.partner2_prev svg, .partner2_next svg {
    width: 1rem;
    height: auto;
}

.partner2_next {
    left: unset;
    right: -2rem;
}

section.partner3 {
    padding: 3.5rem 0;
}

.partner3_title  h2.title_head {
    font-size: 1.6rem;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
    width: 22rem;
    flex: 0 0 auto;
    margin: 0;
}

.partner3_title {
    font-weight: 600;
    align-items: center;
}

section.partner3 .about2_logo {width: 100%;padding: 0;}
.sustainable2_box {position: relative;max-width: 72rem;margin: auto;background: #fff;padding-top: 3rem;margin-top: -17rem;}

.sustainable_template  main#main .row {max-width: 60rem;margin: auto;}

.sustainable_template  .title_head {
    font-size: 1.6rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}
.product_tax {
}

.product_tax li {
    margin: 0;
}

.product_tax a {
    width: 100%;
    padding: .6rem 1.2rem;
    display: flex;
    color: #3E6530;
    font-weight: 500;
    line-height: 1.2;
    transition: .5s all;
    font-size: .7rem;
    border: 1px solid #fff;
}

.product_tax a:hover, .product_tax li.active a {
    border-color: #3E6530 !important;
}

.flash_sale_box {
    background: #F2A100;
}

.flash_sale_box .left {
    display: flex;
    align-items: center;
    gap: .6rem;
}
.product_tax a:hover {
    background: #fff5e6 !important;
    border-color: #fff5e6 !important;
    color: #508741 !important;
}
.flash_sale_box .title_box h2 {
    color: #fff;
}


/* ══════════════════════════════════════════
   MINI CART DRAWER
══════════════════════════════════════════ */
.minicart_overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  z-index: 2000;
}
.minicart_drawer {
  position: fixed;
  top: 0;
  right: -40rem;
  width: 40rem;
  max-width: 95vw;
  height: 100vh;
  background: #fff;
  z-index: 2001;
  display: flex;
  flex-direction: column;
  transition: right .3s cubic-bezier(.4,0,.2,1);
  box-shadow: -4px 0 20px rgba(0,0,0,.15);
}
.minicart_drawer.open { right: 0; }

.minicart_head {
  padding: 1rem 3rem;
  flex-shrink: 0;
}
.minicart_title {font-size: 1.5rem;font-weight: 600;letter-spacing: 0;}
.minicart_close {background: none;border: none;cursor: pointer;font-size: 1rem;color: #555;padding: 0;margin: 0;width: 2rem;height: 2rem;background: #F4F4F4;border-radius: 50%;min-height: unset;padding: 0;line-height: normal;transition: .2s all;}
.minicart_close:hover {background: #508741;color: #fff;transform: rotate(90deg);}

.minicart_body {
  flex: 1;
  overflow-y: auto;
  padding: 0 .5rem 0 3rem;
  margin-right: 3rem;
  margin-bottom: 1rem;
}
.minicart_empty { color: #999; text-align: center; padding: 2rem 0; font-size: 0.7rem; }

.minicart_item {
  gap: 0.8rem;
  padding: 0.8rem 0;
  border-bottom: 1px solid #f0f0f0;
  position: relative;
  align-items: center;
}
.minicart_item_img {
  width: 6rem;
  height: 6rem;
  flex-shrink: 0;
  border-radius: 0.2rem;
  overflow: hidden;
  background: #f5f5f0;
}
.minicart_item_img img { width: 100%; height: 100%; object-fit: cover; }
.minicart_item_info { flex: 1; min-width: 0; }
.minicart_item_name {font-size: .8rem;color: #222;font-weight: 600;text-decoration: none;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;}
.minicart_item_unit {font-size: .7rem;color: #3E6530;margin-top: 0.1rem;}
.minicart_item_bottom { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-top: 0.2rem; }
.minicart_item_price_group { display: flex; align-items: center; }
.minicart_item_price {font-size: 0.75rem;font-weight: 700;color: #E0391F;}
.minicart_item_old_price { font-size: 0.65rem; font-weight: 400; color: #999; margin-left: 0.4rem; }
.minicart_item_qty {gap: 0.5rem;margin-top: 0;}
.minicart_qty_btn {background: #f0f0f0;border: none;width: 1.2rem;height: auto;border-radius: 50%;cursor: pointer;font-size: 0.7rem;display: flex;align-items: center;justify-content: center;background: transparent;padding: 0;display: flex;align-items: center;justify-content: center;margin: 0;}
.minicart_qty_val { font-size: 0.65rem; min-width: 1.2rem; text-align: center; }
.minicart_item_del { position: absolute; top: 0.6rem; right: 0; background: none; border: none; cursor: pointer; color: #aaa; font-size: 0.7rem; padding: 0; }
.minicart_item_del:hover { color: #e74c3c; }

/* ── Grouped items ── */
.minicart_group { border-bottom: 1px solid #f0f0f0; }
.minicart_group > .minicart_item { border-bottom: none; }
.minicart_group_children {background: #f9fdf7;margin: 0 0 0 0.6rem;border-radius: 0 0 0.3rem 0.3rem;padding-bottom: 0.3rem;}
.minicart_group_label { font-size: 0.5rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.35rem 0.8rem 0.1rem; }
.minicart_label_upsell { color: #5bb8b4; }
.minicart_label_gift { color: #e8a020; }
.minicart_child_item { padding: 0.4rem 0.8rem !important; background: transparent !important; border-bottom: 1px solid #eef5ea !important; }
.minicart_child_item:last-child { border-bottom: none !important; }
.minicart_child_item .minicart_item_img { width: 2.4rem; height: 2.4rem; min-width: 2.4rem; }
.minicart_child_item .minicart_item_name { font-size: 0.58rem; }
.minicart_child_item .minicart_item_price { font-size: 0.58rem; }

.minicart_foot {
  padding: 1rem 3rem;
  border-top: 1px solid #e8e8e8;
  flex-shrink: 0;
}
.minicart_total {margin-bottom: 0.8rem;font-size: 0.7rem;color: #3E6530;font-weight: 500;}
.minicart_total b { font-size: 0.85rem; color: #508741; }
.minicart_total_old_price { font-size: 0.65rem; font-weight: 400; color: #999; margin-right: 0.4rem; }
.minicart_checkout {display: block;width: 100%;text-align: center;background: #3E6530;color: #fff;padding: 0.7rem;border-radius: 0;font-size: 0.7rem;font-weight: 700;text-decoration: none;letter-spacing: .05em;min-height: 3.5rem;display: flex;justify-content: center;align-items: center;padding: 0 1rem;font-size: 1rem;font-weight: 600;}
.minicart_checkout:hover { background: #508741; }

/* ══════════════════════════════════════════
   PRODUCT DETAIL — NEW ELEMENTS
══════════════════════════════════════════ */
/* Variants */
.product_variants {
  margin: 0.8rem 0;
}
.variant_label {
  font-size: 0.65rem;
  color: #555;
  margin-bottom: 0.4rem;
}
.variant_btns { gap: 0.4rem; flex-wrap: wrap; }
.variant_btn {
  padding: 0.3rem 0.8rem;
  border: 1px solid #ccc;
  border-radius: 0.2rem;
  background: #fff;
  font-size: 0.65rem;
  cursor: pointer;
  color: #333;
  transition: all .2s;
}
.variant_btn:hover { border-color: #508741; color: #508741; }
.variant_btn.active { border-color: #508741; background: #508741; color: #fff; }

/* Gallery */
.gallery_thumb { cursor: pointer; opacity: .65; transition: opacity .2s; }
.gallery_thumb.active, .gallery_thumb:hover { opacity: 1; outline: 2px solid #65BF11; }

/* Coupons */
.product_coupons {margin: 1rem 0 0;display: flex;gap: 1rem;}
.coupons_label {font-size: 0.6rem;color: #000000;margin-bottom: 0.5rem;}
.coupons_list { gap: 0.5rem; flex-wrap: wrap; }
.coupon_item { position: relative; cursor: pointer; }
.coupon_code {
  gap: 0.3rem;
  border-radius: 0.25rem;
  padding: 0.3rem 0.6rem;
  font-size: 0.6rem;
  font-weight: 600;
  color: #333;
  background: #f8fff3;
}
.coupon_tooltip {
  position: absolute;
  bottom: calc(100% + 0.4rem);
  left: 50%;
  transform: translateX(-50%);
  background: #222;
  color: #fff;
  font-size: 0.55rem;
  padding: 0.4rem 0.6rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  z-index: 10;
  pointer-events: none;
}
.coupon_tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: #222;
  display: none;
}

/* Qty input */

/* Qty input */
.product_detail_quantity {gap: 0.5rem;margin: 0;}
.qty_btn {
  width: 1.8rem; height: 1.8rem;
  border: 1px solid #ccc; border-radius: 50%;
  background: #fff; cursor: pointer; font-size: 0.9rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.qty_btn:hover { border-color: #508741; color: #508741; }
button.qty_btn {
    transition: .5s all;
}

button.qty_btn:hover {
    color: #3e6530 !important;
}
.qty_input {
  width: 3rem; text-align: center;
  border: 1px solid #ccc; border-radius: 0.2rem;
  padding: 0.3rem; font-size: 0.7rem;
}

/* ─── HOT DEAL PAGE ──────────────────────────────────────────────────────── */
.hotdeal_page .product_sidebar .product_tax button {
  background: none; border: none; cursor: pointer;
  text-align: left; width: 100%; padding: 0.3rem 0;
  font-size: 0.65rem; color: #333;
}
.hotdeal_page .product_sidebar .product_tax li.active button,
.hotdeal_page .product_sidebar .product_tax li.active a { color: #508741; font-weight: 700; }

.flash_sale_box .title_box {margin-bottom: 1rem;background: #F2A100;padding: 1.2rem;border-radius: .4rem;}
.flash_sale_box .title_box h2 { font-size: 1.1rem; font-weight: 700; margin: 0; }

.count_time {list-style: none;padding: 0;margin: 0;gap: 0.4rem;}
.count_time li {
  background: #fff;
  color: #FF4D00;
  border-radius: 0.25rem;
  padding: 0;
  text-align: center;
  margin: 0;
  width: 2rem;
  height: 1.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.count_time li span {display: block;font-size: 1rem;font-weight: 700;line-height: 1.2;}
.count_time li em {display: block;font-size: 0.5rem;font-style: normal;opacity: 0.7;display: none;}

.giam_gia_inner { gap: 1rem; align-items: flex-start; }
.giam_gia_banner { position: relative; flex: 0 0 16rem; }
.giam_gia_banner img { width: 100%; height: auto; border-radius: 0.5rem; display: block; }
.giam_gia_slider { flex: 1; min-width: 0; }

.wrap_slider { position: relative; }
.arrow_slider { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; cursor: pointer; width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,.15); transition: .5s all; }
.arrow_slider {
    box-shadow: none;
}
.arrow_slider.hotdeal_prev { left: -1rem; }
.arrow_slider.hotdeal_next { right: -1rem; }
.arrow_slider path { transition: .5s all; }
.arrow_slider:hover { background: #3e6530; }
.arrow_slider:hover path { fill: #fff !important; }

.flash_sale_box .arrow_slider path { fill: #f2a100; }
.flash_sale_box .arrow_slider:hover { background: #3e6530; }

.product_slider .product_item { height: 100%; }

/* ─── FLASH SALE PAGE ────────────────────────────────────────────────────── */
.flashsale_banner { overflow: hidden; max-height: 22rem; }
.flashsale_banner img { width: 100%; object-fit: cover; }

.flashsale_page .flash_sale_box h1 {font-size: 1rem;font-weight: 800;margin: 0;color: #FFFFFF;}

.loading_blur { opacity: 0.5; pointer-events: none; transition: opacity 0.2s; }

.product_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}



.no_products {
    position: absolute;
    width: 100%;
    top: 0;
    padding: 0;
    text-align: center;
    transform: translateY(-50%);
    color: #3E6530;
    font-weight: 600;
}

.pagination { gap: 1.4rem; margin: 2rem 0; }
.pagination .page_prev,
.pagination .page_next {
  width: 1.6rem;
  height: 2rem;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .3s opacity;
}
.pagination .page_prev svg,
.pagination .page_next svg { display: block; }
.pagination .page_prev:hover,
.pagination .page_next:hover { opacity: .65; }
.pagination .page_prev[disabled],
.pagination .page_next[disabled],
.pagination .page_prev.disabled,
.pagination .page_next.disabled { opacity: .3; pointer-events: none; cursor: default; }
.pagination .page_num,
.pagination .page_item {
  min-width: 2rem;
  height: 2rem;
  border: none;
  background: none;
  cursor: pointer;
  border-radius: 0.2rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #8FB184;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.3rem;
  margin: 0;
  text-decoration: none;
  transition: .3s all;
}
.pagination .page_num.active,
.pagination .page_item.active { background: #508741; color: #fff; }
.pagination .page_dots { padding: 0 0.3rem; display: flex; align-items: center; color: #8FB184; font-weight: 600; font-size: 0.8rem; }

.pagination .page_num, .pagination .page_item {
    border-radius: 0;
    margin: 0;
    color: #8FB184;
    font-size: .7rem;
    font-weight: 500;
}

.pagination {
    gap: 0;
}

/* ─── SEARCH RESULT PAGE ────────────────────────────────────────────────── */
.search_result_page { padding: 2rem 0 3rem; }
.search_result_title { font-size: 2.5rem; font-weight: 700; margin-bottom: 1.5rem; font-family: 'Phudu', cursive; color: #0F1610; }

.search_tabs { gap: 0; margin-bottom: 2rem; }
.search_tab_btn {
  background: none; cursor: pointer;
  font-size: 0.75rem; font-weight: 600;
  position: relative; height: 1.8rem; padding: 0 1rem;
  border: 1px solid #508741; color: #508741; margin: 0 .5rem;
}
.search_tab_btn.active { color: #fff; border-bottom-color: #508741; background: #508741; }
.search_tab_count { margin-left: 0.3rem; font-size: 0.6rem; opacity: 0.7; }

.search_empty { padding: 3rem; text-align: center; color: #888; }

/* News grid */
.news_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 2rem;
}



.news_card { background: #fff; border-radius: 0.5rem; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.news_card_img { position: relative; aspect-ratio: 16/9; overflow: hidden; }
.news_card_img img { width: 100%; height: 100%; object-fit: cover; }
.news_card_info { padding: 0.8rem; }
.news_card_date { font-size: 0.55rem; color: #999; margin-bottom: 0.3rem; }
.news_card_title { font-size: 0.7rem; font-weight: 600; margin: 0 0 0.4rem; line-height: 1.4; }
.news_card_title a { color: #222; text-decoration: none; }
.news_card_title a:hover { color: #508741; }
.news_card_excerpt { font-size: 0.6rem; color: #666; line-height: 1.5; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ─── CHECKOUT PAGE ─────────────────────────────────────────────────────── */
.checkout_page { padding: 2rem 0 4rem; }
.checkout_steps { display: none; }
.checkout_steps ul { list-style: none; display: flex; gap: 0; }
.checkout_steps li { flex: 1; text-align: center; padding: 0.6rem; font-size: 0.6rem; font-weight: 600; color: #999; border-bottom: 2px solid #e8e8e8; }
.checkout_steps li.active { color: #508741; border-bottom-color: #508741; }

.checkout_wrap { gap: 2rem; align-items: flex-start; }
.checkout_form_wrap { flex: 1; min-width: 0; }
.checkout_summary_wrap {flex: 0 0 55%;}

.checkout_section h2 {font-size: 1rem;font-weight: 600;margin: 0 0 1rem;color: #0F1610;margin: 0 0 .5rem;}


.checkout_field input:focus,
.checkout_field textarea:focus { border-color: #508741; }
.checkout_field textarea { resize: vertical; min-height: 4rem; }
.checkout_field input.input_error,
.checkout_field textarea.input_error { border-color: #e74c3c; }
.checkout_field_error { display: block; font-size: 0.55rem; color: #e74c3c; margin-top: 0.25rem; }

.checkout_field_row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; }

/* react-select inside checkout */
.checkout_field .react-select__control {
  border-radius: 0.3rem; border-color: #ddd; min-height: 2rem;
  font-size: 0.65rem;
}
.checkout_field .react-select__control--is-focused { border-color: #508741; box-shadow: none; }

/* Payment / shipping radios */
.payment_options {display: flex;flex-direction: column;gap: 0.6rem;}
.payment_option {
  border: 1px solid #e8e8e8;
  border-radius: 0;
  padding: 0.7rem 0.8rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
}
.payment_option.selected {border-color: #508741;}
.payment_option input[type="radio"] {accent-color: #508741;width: 1rem;height: 1rem;margin: 0;}
.payment_option_info { flex: 1; }
.payment_option_label {font-size: 0.7rem;color: #3E6530;font-weight: 400;}
.payment_option_desc {font-size: 0.55rem;color: #888;margin-top: 0.15rem;display: none;}

/* Pickup store sub-list */
.pickup_store_list {display: flex;flex-direction: column;gap: 0.5rem;margin: -0.1rem 0 0 1.5rem;}
.pickup_store_item {display: flex;align-items: flex-start;gap: 0.5rem;padding: 0.6rem 0.8rem;border: 1px solid #e0e0e0;border-radius: 0;cursor: pointer;background: #fff;transition: border-color 0.15s, background 0.15s;margin: 0;}
.pickup_store_item.selected {border-color: #65BF11;background: #65BF1133;}
.pickup_store_item input[type="radio"] {accent-color: #508741;margin-top: 0.1rem;flex-shrink: 0;width: 1rem;height: 1rem;}
.pickup_store_info {font-size: 0.7rem;line-height: 1.5;color: #3E6530;}
.pickup_store_name {font-weight: 700;}
.pickup_store_addr {color: #3E6530;font-weight: 400;}

/* QR bank transfer section */
.bank_transfer_info { margin-top: 0.8rem; padding: 0.8rem; background: #f9f9f9; border-radius: 0.4rem; display: flex; gap: 1rem; align-items: flex-start; }
.bank_qr { width: 7rem; height: 7rem; object-fit: contain; flex-shrink: 0; }
.bank_details p { font-size: 0.6rem; margin: 0.2rem 0; }

/* VAT popup */
.vat_popup_backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1000; display: flex; align-items: center; justify-content: center; }
.vat_popup {background: #fff;border-radius: 0.5rem;width: 90%;max-width: 36rem;padding: 1.5rem;max-height: 90vh;overflow-y: auto;position: relative;}
.vat_popup_header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.vat_popup_header h3 {font-size: 1.25rem;font-weight: 700;margin: 0;color: #0F1610;}
.vat_close {background: none;border: none;cursor: pointer;font-size: 1.2rem;color: #999;margin: 0;position: absolute;top: 1rem;right: 1rem;width: 2rem;height: 2rem;background: #F4F4F4;border-radius: 100px;display: flex;align-items: center;justify-content: center;padding: 0;min-height: unset;}
.vat_tabs { display: flex; gap: 1.5rem; align-items: center; margin-bottom: 1rem; }
.vat_tab {display: flex;align-items: center;gap: 0.45rem;background: none;border: none;cursor: pointer;font-size: 0.7rem;font-weight: 400;color: #aaa;padding: 0;margin: 0;text-transform: unset;}
.vat_tab::before { content: ''; width: 1rem; height: 1rem; border-radius: 50%; border: 2px solid #ccc; display: inline-block; flex-shrink: 0; transition: .2s; }
.vat_tab.active {color: #508741;}
.vat_tab.active::before { border-color: #65BF11; background: #65BF11; box-shadow: inset 0 0 0 2px #fff; }
.vat_field { margin-bottom: 0.7rem; }
.vat_field label {display: block;font-size: 0.6rem;font-weight: 600;margin-bottom: 0.25rem;display: none;}
.vat_field input {width: 100%;border: 1px solid #C7D4C7;border-radius: 0.3rem;padding: 0.5rem 0.7rem;font-size: 0.65rem;height: 2.25rem;border-radius: 0;box-shadow: none;margin: 0;color: #508741;}
.vat_actions { display: flex; gap: 0.6rem; justify-content: flex-end; margin-top: 1rem; }
.vat_actions button {padding: 0.5rem 1.2rem;border-radius: 0;font-size: .8rem;font-weight: 600;cursor: pointer;margin: 0;text-transform: uppercase;border: none !important;height: 2.4rem;padding: 0 1rem;}
.btn_vat_cancel { background: #f5f5f5; border: 1px solid #ddd; color: #333; }
.btn_vat_save { background: #508741; border: none; color: #fff; }

/* Coupon popup */
/* ── Coupon Popup ──────────────────────────────────────────────── */
.coupon_popup_backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; display: flex; align-items: center; justify-content: center; }
.coupon_popup {background: #fff;border-radius: 0.6rem;width: 90%;max-width: 42rem;padding: 1.5rem;overflow-y: auto;}
.coupon_popup_header {display: flex;justify-content: space-between;align-items: center;margin-bottom: 1rem;padding-bottom: 0.8rem;border-bottom: 1.5px solid #eee;text-align: center;}
.coupon_popup_header h3 {font-size: 1.6rem;font-weight: 600;margin: 0;font-family: 'Phudu', cursive;color: #508741;}
.coupon_popup_body {display: grid;grid-template-columns: 1fr 1fr;gap: 0;margin: 0 -1.2rem;}
.coupon_popup_col > h4 {font-size: 0.65rem;font-weight: 700;margin: 0 0 0.9rem;padding-bottom: 0.45rem;border-bottom: 2px solid #508741;letter-spacing: 0.05em;display: none;}
.ck_coupon_empty { font-size: 0.6rem; color: #bbb; }
/* Ticket card */
.ck_coupon_card {
  display: flex;
  align-items: stretch;
  cursor: pointer;
  border: 2px solid #fff;
  border-radius: 0;
  position: relative;
  overflow: visible;
  background: #fff;
  transition: .5s all;
  padding: .4rem;
  scale: 1;
}
.ck_coupon_card:hover {
  scale: .95;
}
.ck_coupon_card.selected {
    background: #65BF1133;
    border-color: #65BF11;
}
/* Notch circles at junction */
.ck_coupon_card::before, .ck_coupon_card::after {
  content: '';
  position: absolute;
  left: calc(5.4rem - 0.45rem);
  width: 0.75rem;
  height: 0.75rem;
  background: #fff;
  border-radius: 50%;
  z-index: 3;
}
.ck_coupon_card.selected::before, .ck_coupon_card.selected::after {background: rgb(224 242 207);}
.ck_coupon_card::before {
    top: 0;
}
.ck_coupon_card::after  {
    bottom: 0;
    top: unset;
}
/* Left value side */
.ck_coupon_left {
  width: 5.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--coupon-bg, #c8c0b6);
  border-radius: 0;
  transition: background 0.2s;
  flex: 0 0 auto;
  padding: 0;
  padding: .5rem;
}
.ck_coupon_left_val {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--coupon-bg, #c8c0b6);
  width: 4.5rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFF5E6;
  font-family: 'Phudu', cursive;
  position: relative;
}
.ck_coupon_card.selected .ck_coupon_left_val {opacity: 1;}
.ck_coupon_icon { width: 3.2rem; height: 3.2rem; object-fit: contain; }
/* Right info side */
.ck_coupon_right {flex: 1;padding: .5rem;background: var(--coupon-bg, #c8c0b6);}
.ck_coupon_title {font-size: 0.7rem;font-weight: 700;color: #fff;margin-bottom: 0.15rem;font-family: 'Phudu', cursive;margin: 0;}
.ck_coupon_card.selected .ck_coupon_title {}
.ck_coupon_subdesc {font-size: 0.55rem;color: #fff;line-height: 1.4;margin-bottom: 0.05rem;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 1;display: -webkit-box;-webkit-box-orient: vertical;}
.ck_coupon_card.selected .ck_coupon_subdesc {}
.ck_coupon_expire {font-size: 0.5rem;color: #fff;margin-top: 0.2rem;}
.ck_coupon_card.selected .ck_coupon_expire {}
/* Radio dot */
.ck_coupon_check {display: flex;align-items: center;padding: 0 0 0 .7rem;}
.ck_radio_dot {display: block;width: 1rem;height: 1rem;border-radius: 50%;border: 3px solid #C7D4C7;background: #fff;transition: border-color 0.2s, background 0.2s;}
.ck_radio_dot.checked {border-color: #fff;background: #508741;}
/* Footer */
.coupon_popup_footer { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #eee; display: flex; align-items: center; justify-content: flex-end; gap: 1rem; }
.ck_coupon_selected_info { font-size: 0.6rem; color: #508741; margin-right: auto; }
.btn_apply_coupon {background: #508741;color: #fff;border: none;border-radius: 0;padding: 0.35rem 2rem;font-size: .8rem;font-weight: 700;cursor: pointer;letter-spacing: 0.05em;white-space: nowrap;margin: 0;font-weight: 600;}

/* Gift milestone section */
/* Milestone progress */
.milestone_progress_wrap { background: #f9fdf7; border: 1px solid #c8e6b0; border-radius: 0.4rem; padding: 0.7rem 0.8rem; margin: 0.8rem 0; }
.milestone_progress_text { font-size: 0.6rem; color: #555; margin-bottom: 0.4rem; }
.milestone_progress_text b { color: #508741; }
.milestone_progress_bar { height: 0.35rem; background: #d9ead3; border-radius: 99px; overflow: hidden; }
.milestone_progress_fill { height: 100%; background: linear-gradient(90deg, #508741, #7bc86c); border-radius: 99px; transition: width 0.4s; }

/* Gift milestone redesign */
.gift_milestone_section {margin: 0.8rem 0;background: #F2A100;padding: .15rem;}
.gift_milestone_header {display: flex;align-items: center;justify-content: space-between;padding: 0.5rem 0.8rem;border-radius: 0.4rem 0.4rem 0 0;}
.gift_milestone_title_wrap { display: flex; align-items: center; gap: 0.4rem; }
.gift_milestone_title {font-size: 1.1rem;font-weight: 800;color: #fff;}
.gift_milestone_arrow { display: flex; align-items: center; }
.gift_milestone_arrow svg {display: block;height: 1.3rem;}
.gift_milestone_sub {font-size: 0.8rem;color: #fff;font-weight: 700;font-style: italic;}
.gift_select_wrap {display: flex;flex-direction: column;gap: 0;border: 1px solid #e8e8e8;border-top: none;overflow: hidden;background: #fff;padding: 1.2rem .8rem .7rem;}
.gift_option {display: flex;align-items: center;gap: 0.7rem;cursor: pointer;padding: .5rem;background: #fff;transition: background 0.15s;border: 2px solid transparent;}
.gift_option:last-child {}
.gift_option:hover { background: #fafdf8; }
.gift_option.selected {background: #edf7e8;border-color: #65BF11;}
.gift_radio_dot {width: 1.1rem;height: 1.1rem;border-radius: 50%;border: 2px solid #ccc;flex-shrink: 0;transition: all 0.15s;flex: 0 0 auto;}
.gift_radio_dot.checked { border-color: #508741; background: #508741; box-shadow: inset 0 0 0 0.2rem #fff; }
.gift_option_img {width: 4.5rem;height: 4.5rem;object-fit: cover;border-radius: 0.25rem;flex-shrink: 0;}
.gift_option_name { flex: 1; font-size: 0.62rem; font-weight: 500; line-height: 1.4; }
.gift_option_qty {font-size: 1rem;font-weight: 700;color: #E0391F;white-space: nowrap;}

/* Order summary */
.checkout_summary_box {background: #e0e6df;border: 1px solid #e8e8e8;border-radius: 0.5rem;padding: 2rem;position: sticky;top: 1rem;}
.summary_header {margin-bottom: 0.8rem;border-bottom: 2px solid #8FB184;padding-bottom: 1rem;margin-bottom: 1rem;}
.summary_header h2 {font-size: 1.2rem;font-weight: 800;margin: 0;color: #3E6530;}
.checkout_wrap .summary_header h2 { color: #0F1610; font-size: 1.75rem; font-weight: 600; }
.summary_back_link {font-size: 1rem;color: #508741;white-space: nowrap;font-weight: 600;}
.summary_empty { font-size: 0.65rem; color: #888; text-align: center; padding: 1rem; }
.summary_items_list { margin-bottom: 0.5rem; }
.summary_item {padding: 0.6rem 0;border-bottom: 1px solid #f0f0f0;gap: 0.6rem;align-items: center;display: flex;}
.summary_item_img { width: 3.5rem; height: 3.5rem; object-fit: cover; border-radius: 0.25rem; flex-shrink: 0; }
.summary_item_name {font-size: 0.7rem;line-height: 1.4;color: #0F1610;width: 11rem;flex: 0 0 auto;font-weight: 500;}
.summary_item_unit {display: block;color: #508741;font-size: 0.6rem;margin-top: .2rem;}
.summary_item_qty_inline { display: inline-block; margin-left: 0.3rem; font-size: 0.55rem; color: #888; }
.summary_item_right { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.summary_item_price { font-size: 0.62rem; font-weight: 700; color: #e74c3c; white-space: nowrap; }
.summary_item_del { background: none; border: none; cursor: pointer; color: #bbb; font-size: 0.75rem; line-height: 1; padding: 0.1rem 0.2rem; transition: color 0.15s; }
.summary_item_del:hover { color: #e74c3c; }
.summary_item_qty { font-size: 0.55rem; color: #888; white-space: nowrap; }
.summary_item_total {font-size: 1rem;font-weight: 700;white-space: nowrap;}
.checkout_note_input {width: 100%;border: 1px solid #ddd;border-radius: 0.3rem;padding: 0.5rem 0.7rem;font-size: 0.65rem;resize: vertical;outline: none;font-family: inherit;border-radius: 0;min-height: unset;height: 3.7rem;}
.checkout_note_input:focus { border-color: #508741; }

.summary_group {border-bottom: 1px solid #C7D4C7;}
.summary_group > .summary_item { border-bottom: none; }
.summary_group_children {background: #f9fdf7;margin: 0 0 0.3rem 0.5rem;border-radius: 0;padding-bottom: 0;margin-left: 4rem;}
.summary_group_label {font-size: 0.7rem;font-weight: 700;letter-spacing: 0.06em;padding: 0.3rem 0.6rem 0.1rem;}
.summary_label_upsell { color: #5bb8b4; }
.summary_label_gift {color: #E0391F;}
.summary_child_item { padding: 0.35rem 0.6rem !important; border-bottom: 1px solid #eef5ea !important; }
.summary_child_item:last-child { border-bottom: none !important; }
.summary_child_item .summary_item_img { width: 2.4rem; height: 2.4rem; }
.summary_child_item .summary_item_name { font-size: 0.58rem; }
.summary_child_item .summary_item_price { font-size: 0.58rem; }

.coupon_section {padding-top: 1.3rem;margin: 0.8rem 0;border-top: 2px solid #3E6530;}
.coupon_section_title {font-size: 0.8rem;font-weight: 700;color: #3E6530;margin-bottom: 0.5rem;}
.coupon_browse_row {width: 100%;display: flex;align-items: center;justify-content: space-between;background: #fff;border: 2px solid #E89B1B;border-radius: 0;padding: 0.5rem 0.8rem;cursor: pointer;margin-bottom: 0.5rem;}
.coupon_browse_left {display: flex;align-items: center;gap: 0.5rem;color: #E89B1B;font-size: 0.65rem;font-weight: 600;line-height: normal;text-transform: math-auto;}
.coupon_browse_left svg { flex-shrink: 0; }
.coupon_browse_arrow { color: #E89B1B; font-size: 1rem; font-weight: 700; line-height: 1; }
.coupon_input_row {display: flex;gap: 0;margin: 0;align-items: center;padding: .2rem;}
.coupon_input { flex: 1; border: none; padding: 0.55rem 0; font-size: 0.65rem; outline: none; background: transparent; color: #333; }
.coupon_input::placeholder { color: #aaa; }
.coupon_apply_btn {background: #508741;color: #fff;border: none;border-radius: 0.3rem;padding: 0 1.75rem;font-size: 0.6rem;font-weight: 700;cursor: pointer;letter-spacing: 0.03em;margin: 0;border-radius: 0;height: 1.5rem;}
.coupon_applied_badge { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.4rem; font-size: 0.6rem; color: #508741; }
.coupon_applied_badge button {background: none;border: none;cursor: pointer;color: #e74c3c;font-size: 0.7rem;padding: 0;line-height: 1;margin: 0;}

.total_row {padding: 0.3rem 0;font-size: 0.75rem;color: #3E6530;}
.total_row span:last-child { font-weight: 600; }
.discount_row span:last-child { color: #e74c3c; }
.summary_totals {border-top: 4px dashed #fff;padding-top: 1rem;position: relative;}
.summary_grand_total {margin-top: 0.6rem;padding-top: 0.6rem;border-top: 2px solid #8FB184;font-size: 0.75rem;font-weight: 700;color: #3E6530;}
.grand_total_price {color: #508741;font-size: 1.3rem;}

.vat_invoice_row { display: flex; align-items: center; justify-content: space-between; margin: 0.7rem 0; }
.vat_invoice_row label {font-size: 0.6rem;cursor: pointer;display: flex;align-items: center;gap: 0.4rem;font-size: 1rem;font-weight: 600;margin: 0 0 1rem;color: #0F1610;margin: 0 0 .5rem;font-size: 1rem;font-weight: 600;margin: 0 0 1rem;color: #0F1610;margin: 0 0 .5rem;}
.vat_invoice_btn {font-size: 0.6rem;color: #fff;font-weight: 400;cursor: pointer;background: none;border: none;margin: 0;height: 1.5rem;display: inline-flex;align-items: center;justify-content: center;background: #508741;text-transform: unset;flex: 0 0 auto;}
.vat_applied_badge { font-size: 0.55rem; color: #508741; background: #e8f5e2; border-radius: 0.2rem; padding: 0.15rem 0.4rem; }

.btn_place_order {
  width: 100%;
  padding: 0.8rem;
  margin-top: 1rem;
  background: #3E6530;
  color: #fff;
  border: none;
  border-radius: 0;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  text-transform: uppercase;
}
.btn_place_order:hover { background: #3e6b32; }
.btn_place_order:disabled { background: #aaa; cursor: not-allowed; }
.checkout_policy_note { font-size: 0.55rem; color: #888; text-align: center; margin-top: 0.5rem; }
.checkout_policy_link {color: #3E6530;font-size: .75rem;text-decoration: underline;}

/* VAT extras */
.btn_use_shipping_addr {
  background: none;
  color: #508741;
  border-radius: 0;
  padding: 0.4rem 0.8rem;
  font-size: .8rem;
  cursor: pointer;
  margin: 0.5rem 0;
  width: 100%;
  background: #8FB184;
  color: #fff;
  font-weight: 600;
  height: 2.4rem;
  padding: 0 1rem;
}
.vat_note_box {background: #F1FAFE;border: 1px solid #F1FAFE;border-radius: 0;padding: 1.2rem;margin: 0.6rem 0;font-size: 0.6rem;color: #8FB184;}
.vat_note_box ul { margin: 0.3rem 0 0 1rem; }
.vat_note_box li { margin-bottom: 0.2rem; }
.vat_save_label { display: flex; align-items: center; gap: 0.6rem; font-size: 0.65rem; color: #508741; cursor: pointer; margin: 0.5rem 0; font-weight: 500; }
.vat_save_label input[type="checkbox"] {appearance: none;-webkit-appearance: none;width: 1.1rem;height: 1.1rem;border-radius: 50%;border: 2px solid #b0c9a8;background: #fff;flex-shrink: 0;cursor: pointer;transition: .2s;position: relative;margin: 0;}
.vat_save_label input[type="checkbox"]:checked { border-color: #65BF11; background: #65BF11; box-shadow: inset 0 0 0 2px #fff; }

/* Checkout steps */
.checkout_steps { margin-bottom: 1.5rem; }
.checkout_steps ul { display: flex; list-style: none; padding: 0; margin: 0; gap: 0; }
.checkout_steps li { flex: 1; text-align: center; font-size: 0.6rem; font-weight: 600; color: #bbb; padding: 0.6rem; position: relative; border-bottom: 2px solid #e8e8e8; }
.checkout_steps li.active { color: #508741; border-bottom-color: #508741; }
.checkout_steps li + li::before { content: "›"; position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: #ccc; }

/* Summary item image */
.summary_item_img {width: 4.5rem;height: 4.5rem;object-fit: cover;border-radius: 0;flex-shrink: 0;background: #fff;flex: 0 0 auto;}

/* ─── THANK YOU PAGE ────────────────────────────────────────────────────── */
.thankyou_page { padding: 2rem 0 4rem; }
.thankyou_wrap { gap: 2rem; align-items: flex-start; }
.thankyou_left { flex: 1; min-width: 0; }
.thankyou_right { flex: 0 0 22rem; }

.thankyou_title {font-size: 1.3rem;font-weight: 600;color: #210E00;margin-bottom: 0.5rem;font-family: 'Phudu', cursive;}
.thankyou_subtitle { font-size: 0.7rem; color: #444; margin-bottom: 1.5rem; }

.thankyou_box {background: #fff;margin-bottom: 1rem;border-top: 1px dashed #8FB184;padding-top: 1rem;}
.thankyou_box h3 {font-size: 0.7rem;font-weight: 800;text-transform: uppercase;margin: 0 0 1rem;color: #0F1610;}
.thankyou_customer p {font-size: 0.8rem;margin: 0.3rem 0;color: #3E6530;font-weight: 600;}
.thankyou_customer b {color: #3E6530;font-size: 1.1rem;text-transform: uppercase;font-weight: 600;}

.bank_box .bank_info { gap: 1.2rem; align-items: flex-start; }
.bank_qr { width: 8rem; height: 8rem; object-fit: contain; border: 1px solid #e8e8e8; border-radius: 0.3rem; flex-shrink: 0; }
.bank_brand { font-size: 1rem; font-weight: 700; color: #508741; margin-bottom: 0.5rem; }
.bank_details p {font-size: 0.8rem;margin: 0.3rem 0;}
.bank_transfer_note {margin-top: 0.7rem;color: #3E6530;}

.thankyou_actions {gap: 0.8rem;margin-top: 1.5rem;justify-content: center;}

.button_link.btn_outline { background: #fff; border: 2px solid #508741; color: #508741; }
.button_link:hover { opacity: 0.88; }

.thankyou_summary_box { background: #fff; border: 1px solid #e8e8e8; border-radius: 0.5rem; padding: 1.2rem; }
.summary_title { font-size: 0.8rem; font-weight: 700; margin: 0 0 1rem; padding-bottom: 0.6rem; border-bottom: 2px solid #508741; }
.summary_item_img_small { width: 2.8rem; height: 2.8rem; object-fit: cover; border-radius: 0.25rem; flex-shrink: 0; }
.thankyou_gift { margin: 0.5rem 0; }
.thankyou_gift_label { font-size: 0.55rem; font-weight: 700; color: #508741; margin-bottom: 0.3rem; }
.free_label { color: #508741; font-weight: 700; }

/* ─── FOOTER ────────────────────────────────────────────────────────────── */
.site_footer { color: #fff; font-size: 0.65rem; }
.footer_main {position: relative;background-size: cover;background-position: center;}
.footer_main_overlay {position: absolute;inset: 0;background: rgba(0,0,0,.75);display: none;}
.footer_main > .row { position: relative; z-index: 1; padding: 2.5rem 0 2rem; }

.footer_top {display: flex;gap: 2rem;flex-wrap: wrap;}
.footer_logo_wrap {flex: 0 0 12rem;display: flex;justify-content: center;padding-top: 1rem;}
.footer_logo {width: 5.5rem;display: block;}
.footer_company {flex: 2;min-width: 16rem;font-size: .6rem;font-weight: 600;}
.footer_company_name {font-size: 0.8rem;font-weight: 600;color: #fff;text-transform: uppercase;margin: 0 0 0.25rem;line-height: 1.4;}
.footer_company p {line-height: 1.6;color: #ddd;margin: 0 0 .2rem;}
.footer_label { font-weight: 600; color: #fff; }
.footer_company a { color: #ddd; text-decoration: none; }
.footer_company a:hover { color: #fff; }

.footer_policy { flex: 1; min-width: 10rem; }
.footer_connect { flex: 1; min-width: 10rem; }
.footer_col_title {font-size: 0.8rem;font-weight: 600;color: #fff;text-transform: uppercase;margin: 0 0 0.25rem;line-height: 1.4;}
.footer_policy ul { list-style: none; padding: 0; margin: 0; }
.footer_policy li {margin-bottom: 0.15rem;}
.footer_policy a {color: #fff;text-decoration: none;font-size: 0.6rem;font-weight: 700;}
.footer_policy a { transition: color 0.2s; }
.footer_policy a:hover { color: #7dbf5a; }

.footer_socials {display: flex;gap: 0.5rem;flex-wrap: wrap;margin-top: 0.5rem;}
.footer_social_icon { display: inline-flex; width: 2rem; height: 2rem; border-radius: 50%; overflow: hidden; align-items: center; justify-content: center; position: relative; opacity: 1; scale: 1; transition: .5s all; }
.footer_social_icon:hover { scale: .9; opacity: .5; }
.footer_social_icon img { width: 2rem; height: 2rem; object-fit: cover; display: block; }
.footer_social_icon::after { content: ''; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.6) 50%, transparent 100%); transform: skewX(-20deg); pointer-events: none; transition: none; }
.footer_social_icon:hover::after { left: 130%; transition: left 0.55s ease; }
.footer_bct { margin-top: 1rem; }
.footer_bct img { max-height: 3.5rem; display: block; }

.footer_depts {padding: 1rem 0;border-top: 1px solid #FFFFFF;border-bottom: 1px solid #FFFFFF;margin: 0 2.5rem;}
.footer_depts > .row { position: relative; }
.footer_depts_inner {display: flex;flex-wrap: wrap;gap: 1rem;padding: 0 6rem;}
.footer_dept {flex: 1;min-width: 10rem;padding: 0.6rem 1.2rem;}
.footer_dept:first-child { padding-left: 0; }
.footer_dept:last-child { border-right: none; }
.footer_dept_name {font-size: 0.8rem;font-weight: 700;color: #fff;margin-bottom: 0.25rem;white-space: nowrap;}
.footer_dept_info {font-size: 0.6rem;color: #FFFFFF;line-height: 1.7;font-weight: 500;}
.footer_dept_info a {color: #fff;text-decoration: none;font-weight: 700;}
.footer_dept_info a:hover { color: #fff; }

.footer_copyright {padding: 1.75rem 0;border-top: 1px solid rgba(255,255,255,.08);}
.footer_copyright p {margin: 0;font-size: 0.6rem;color: #fff;text-align: center;font-weight: 600;}

/* ─── PRODUCTS ARCHIVE PAGE ─────────────────────────────────────────────── */
.products_banner { overflow: hidden; max-height: 22rem; }
.products_banner img { width: 100%; height: 100%; object-fit: cover; display: block; }

.products_page { padding: 2rem 0 4rem; }

/* Wrapper: sidebar trái + main phải */
.products_page .product_wrap {display: flex;gap: .5rem;align-items: flex-start;}

/* Sidebar */
.products_page .product_sidebar {
  flex: 0 0 12rem;
  position: sticky;
  top: 9rem;
}
.products_page .product_sidebar .product_tax > b,.filter_group h3 {display: block;font-size: 0.8rem;font-weight: 700;text-transform: uppercase;color: #222;margin-bottom: 0.4rem;background: #3E6530;height: 2rem;display: flex;align-items: center;color: #fff;padding: 0 1.2rem;line-height: normal;}
.products_page .product_sidebar .product_tax ul { list-style: none; padding: 0; margin: 0; }
.products_page .product_sidebar .product_tax li {}
.products_page .product_sidebar .product_tax li:last-child { border-bottom: none; }
.products_page .product_sidebar .product_tax button {
  background: none; border: none; cursor: pointer;
  text-align: left; width: 100%; padding: 0.5rem 0;
  font-size: 0.65rem; color: #555;
}
.products_page .product_sidebar .product_tax li.active button,
.products_page .product_sidebar .product_tax li.active a { color: #508741; font-weight: 700; }
.products_page .product_sidebar .banner_qc {border-radius: 0;overflow: hidden;margin-top: 1.2rem;}
.products_page .product_sidebar .banner_qc img { width: 100%; display: block; }

/* Main content */
.products_page .wrap_product_box { flex: 1; min-width: 0; }

/* Mỗi section category */
.selling_box {margin-bottom: 1rem;padding: 1.3rem;border-radius: .4rem;}
.selling_box .swiper-slide { height: auto; }
.product_category_template .selling_box {
    padding-top: 0;
}
.selling_box .title_box {justify-content: space-between;margin-bottom: 1rem;}
.selling_box .title_box h2 {font-size: 1rem;font-weight: 800;margin: 0;color: #0F1610;}
.selling_box .title_box .link_button {
  display: inline-flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #0F1610;
  border-radius: 2rem;
  padding: 0;
  text-decoration: none;
  white-space: nowrap;
}
.selling_box .title_box .link_button:hover { color: #65BF11; }
.selling_box .title_box .link_button:hover svg path { fill: #65BF11; }
.selling_box .wrap_slider { padding: 0 1.2rem; }
.selling_box .arrow_slider {
    box-shadow: none;
}

/* Product card */
.product_item {position: relative;background: #fff;border-radius: 0;overflow: hidden;height: 100%;display: flex;flex-direction: column;padding: 1.2rem .6rem;transition: .5s all;}
.product_item.box_img_hover { background: #b2df87; }
.product_item .link_box { position: absolute; inset: 0; z-index: 1; }
.product_item .nhan_sale {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  background: #E0391F;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.2rem 0.4rem;
  border-radius: .6rem 0;
}
.product_item .box_img {position: relative;aspect-ratio: 1;overflow: hidden;border: 1px solid #D9D9D9;margin-bottom: .8rem;}
.product_item .box_img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.product_item .list_nhan {position: absolute;bottom: 0;left: 0;list-style: none;padding: 0;margin: 0;gap: 0;flex-wrap: wrap;}
.product_item .list_nhan li {font-size: 0.5rem;font-weight: 700;padding: 0.15rem 0.35rem;border-radius: 0;}
.product_item .box_content {padding: 0;flex: 1;display: flex;flex-direction: column;}
.product_item .box_content h3 {
    font-size: 0.8rem;
    margin: 0 0 0.5rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #000000;
    font-weight: 600;
    height: 2.4rem;
}
.product_item .wrap_meta { display: flex; align-items: center; justify-content: space-between; margin-top: auto; gap: 0.5rem; }
.product_item .price b {display: block;font-size: 1.2rem;font-weight: 700;color: #E0391F;}
.product_item .price:not(:has(del)) b {color: #65BF11;}
.product_item .price del {font-size: 0.8rem;color: #8FB184;}
.product_item .add_button {position: relative;z-index: 2;background: none;border: none;cursor: pointer;padding: 0;flex-shrink: 0;display: flex;margin: 0;}
.product_item .add_button.added svg circle { stroke: #508741; }
.product_item .add_qty_ctrl { display: flex; align-items: center; gap: 0.3rem; position: relative; z-index: 2; flex-shrink: 0; }
.product_item .add_qty_ctrl button { margin: 0; }
.product_item .add_qty_btn { background: none; border: none; cursor: pointer; padding: 0; display: flex; align-items: center; justify-content: center; margin: 0; }
.product_item .add_qty_btn svg { width: 1rem; }
.product_item .add_qty_val { font-size: 1rem; font-weight: 500; min-width: 1.2rem; text-align: center; color: #508741; }

.product_item .box_img_link { position: absolute; inset: 0; z-index: 1; }

/* Hover vào box_img: nút "Xem chi tiết" / "Mua ngay" phủ lên ảnh */
.product_item .box_hover_actions {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0.4rem;
    padding: 0.6rem;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .25s ease, visibility .25s ease;
}
.product_item .box_img:hover .box_hover_actions {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.product_item .box_hover_view,
.product_item .box_hover_buy {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #508741;
    color: #508741;
    background: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s, color .2s;
}
.product_item .box_hover_buy {
    background: #508741;
    color: #fff;
}
.product_item .box_hover_view:hover { background: #f0f7ec; }
.product_item .box_hover_buy:hover { background: #3e6b32; }

.product_item .box_img {
    z-index: 3;
    overflow: unset;
}

.product_item .nhan_sale {
    z-index: 4;
}

.product_item .box_hover_actions {
    bottom: 0;
    transform: translateY(100%);
    background: #b2df89;
    gap: .3rem;
}

.product_item .box_hover_view, .product_item .box_hover_buy {
    max-height: 2.7rem;
    min-height: unset;
    margin: 0;
    display: flex;
    width: 100%;
    border: 1px solid #FFF5E6;
    background: #65BF11;
    color: #fff;
    font-size: 1rem;
}

.product_item .box_hover_view:hover, .product_item .box_hover_buy:hover {
    background: #fff;
    color: #65BF11;
}

.product_item .box_hover_actions {
    justify-content: flex-start;
}

.product_item .box_hover_actions {
    padding-left: 0;
    padding-right: 0;
}

/* ─── PRODUCT CATEGORY PAGE ─────────────────────────────────────────────── */
.prodcat_banner { overflow: hidden; max-height: 18rem; }
.prodcat_banner img { width: 100%; height: 100%; object-fit: cover; display: block; }

.prodcat_page { padding: 2rem 0 4rem; }
.prodcat_page .product_wrap { display: flex; gap: 2rem; align-items: flex-start; }



/* Filter */
.product_filter {border-radius: 0.5rem;padding-bottom: 1rem;}
.filter_group { margin-bottom: 1.2rem; }
.filter_group:last-child { margin-bottom: 0; }
.filter_group ul { list-style: none; padding: 0; margin: 0; }
.filter_group li {margin-bottom: 0;}
.filter_group label {gap: 0.4rem;cursor: pointer;padding: .5rem 1.2rem;color: #3E6530;font-weight: 500;font-size: .7rem;margin: 0 !important;}
.filter_group input[type="checkbox"] { width: 0.75rem; height: 0.75rem; accent-color: #508741; flex-shrink: 0; }
.filter_range input[type="range"] { width: 100%; accent-color: #508741; margin-bottom: 0.4rem; }
.range_values { font-size: 0.6rem; color: #888; }

/* Main */
.prodcat_page .wrap_product_box { flex: 1; min-width: 0; }
.prodcat_page .selling_box .title_box h1 { font-size: 1rem; margin: 0; color: #0F1610; font-weight: 800; }

/* Related section cuối trang */
.prodcat_related {padding: 3rem 0;background: #FFF5E6;}
.prodcat_related_inner { gap: 2rem; align-items: center; }
.prodcat_related_content {width: auto;text-align: right;}
.prodcat_related_content .title_head { font-size: 1.2rem; font-weight: 700; margin: 0 0 1rem; }
.prodcat_related_content .content { font-size: 0.7rem; color: #555; line-height: 1.7; }
.prodcat_related_imgs { flex: 1; gap: 1rem; }
.prodcat_related_img { position: relative; flex: 1; border-radius: 0.5rem; overflow: hidden; }
.prodcat_related_img img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.prodcat_related_img .box_content { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,.6)); padding: 1rem 0.8rem 0.8rem; }
.prodcat_related_img .box_content .content { font-size: 0.65rem; color: #fff; }



/* ─── PRODUCT DETAIL PAGE ────────────────────────────────────────────────── */
.product_detail { padding: 2rem 0; }
.product_detail_wrap { gap: 3rem; align-items: flex-start; }

/* Gallery bên trái */
.product_detail_gallery {width: 47%;flex-shrink: 0;}
.gallery_main {position: relative;overflow: hidden;border: 2px solid #D9D9D9;margin-bottom: 0.8rem;}
.gallery_main img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.gallery_main .nhan_sale {position: absolute;top: 0;right: 0;z-index: 2;background: #E0391F;color: #fff;font-size: 1.6rem;font-weight: 600;padding: 0.25rem 0.5rem;border-radius: 1.2rem 0;line-height: normal;}
.gallery_main .list_nhan { position: absolute; bottom: 0.6rem; left: 0.6rem; list-style: none; padding: 0; margin: 0; gap: 0.3rem; flex-wrap: wrap; z-index: 2; }
.gallery_main .list_nhan li { font-size: 0.55rem; font-weight: 700; padding: 0.2rem 0.4rem; border-radius: 0.2rem; }
.gallery_main ul.list_nhan {
    bottom: 0;
    left: 0;
    gap: 0;
}

.gallery_main ul.list_nhan li {
    margin: 0;
    border-radius: 0;
    font-size: 1.2rem;
    padding: .2rem 1rem;
}
/* Gallery Swiper */
.gallery_swiper { width: 100%; }
.gallery_swiper .swiper-slide img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; cursor: zoom-in; }
.img_lightbox_overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.85); z-index: 99999;
  display: flex; align-items: center; justify-content: center; padding: 2rem; cursor: zoom-out;
}
.img_lightbox_img { max-width: 90vw; max-height: 90vh; object-fit: contain; cursor: default; }
.img_lightbox_close {
  position: absolute; top: 1.2rem; right: 1.2rem; width: 2.2rem; height: 2.2rem;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.15); border-radius: 50%; cursor: pointer; border: none;
}
button.img_lightbox_close {
    margin: 0;
    padding: .1rem;
    background: #fff;
    stroke: #333;
}

button.img_lightbox_close path {
    stroke: #333;
}
.gallery_swiper .swiper-button-next, .gallery_swiper .swiper-button-prev {width: 2rem;height: 2rem;background: rgba(255,255,255,0.9);border-radius: 50%;display: none;}
.gallery_swiper .swiper-button-next::after, .gallery_swiper .swiper-button-prev::after { font-size: 0.7rem; color: #508741; font-weight: 700; }
.gallery_thumbs_wrap { margin-top: 0.8rem; position: relative; padding: 0 1.1rem; }
.gallery_thumbs_swiper .swiper-slide {cursor: pointer;border-radius: 0;overflow: hidden;border: 1px solid #eee;}
.gallery_thumbs_swiper .swiper-slide img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.gallery_thumbs_swiper .swiper-slide-thumb-active { border-color: #508741; }
.gallery_thumbs_prev, .gallery_thumbs_next {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 1.5rem; height: 1.5rem; display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.gallery_thumbs_prev { left: 0; }
.gallery_thumbs_next { right: 0; }
.gallery_thumbs_prev.swiper-button-disabled, .gallery_thumbs_next.swiper-button-disabled { opacity: 0.3; cursor: default; }

/* Info bên phải */
.product_detail_info { flex: 1; min-width: 0; }
.product_detail_brand img { max-height: 3rem; margin-bottom: 0.8rem; object-fit: contain; }
.product_detail_name {font-size: 1.5rem;font-weight: 700;margin: 0 0 0.8rem;line-height: 1.4;color: #000000;}
.product_detail_price {display: flex;flex-direction: column;gap: 0.2rem;margin-bottom: 1rem;margin-top: 1.2rem;}
.price_row_old { display: flex; align-items: center; gap: 0.5rem; }
.price_sale { font-size: 1.6rem; font-weight: 700; color: #E0391F; }
.price_origin { font-size: 0.85rem; color: #aaa; }
.product_detail_short_desc { font-size: 0.7rem; color: #555; line-height: 1.7; margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #eee; }

/* Variants */
.product_variants {margin-bottom: 1rem;display: flex;align-items: center;gap: .4rem;}
.variant_label {font-size: 0.7rem;font-weight: 500;color: #333;margin-bottom: 0;flex: 0 0 auto;width: 5.5rem;}
.variant_btns { gap: 0.5rem; flex-wrap: wrap; }
.variant_btn {border: 1.5px solid #ddd;background: #E0E6E0;border-radius: 0.3rem;padding: 0.35rem 0.5rem;font-size: 0.7rem;cursor: pointer;margin: 0;line-height: normal;height: 1.6rem;border-radius: 0;color: #3E6530;}
.variant_btn.active {border-color: #65BF11;color: #fff;font-weight: 700;background: #65BF11;}

/* Quick info dưới tiêu đề */
.product_quick_info { list-style: disc; padding-left: 1.2rem; margin: 0 0 0.8rem; }
.product_quick_info li {font-size: 0.7rem;color: #000000;margin-bottom: 0.25rem;font-weight: 500;}
.product_quick_info li span { color: #333; }

/* Rating */
.product_detail_rating { gap: 0.5rem; margin-bottom: 0.8rem; }
.star_rating { display: flex; gap: 0.1rem; }
.star { font-size: 1rem; color: #ddd; }
.star.filled { color: #f5a623; }
.rating_score { font-size: 0.75rem; font-weight: 700; color: #f5a623; }
.review_count { font-size: 0.65rem; color: #888; }

/* Price discount badge */
.price_discount { font-size: 0.65rem; font-weight: 700; color: #fff; background: #E0391F; padding: 0.2rem 0.4rem; border-radius: 0.2rem; }

/* Buy row: qty + buttons inline */
.product_detail_buy {gap: 0;flex-wrap: wrap;align-items: center;margin-bottom: 1rem;flex-direction: column;align-items: flex-start;}

/* Qty */
.product_detail_quantity { gap: 0; }
.product_detail_stock { margin-left: 0.7rem; font-size: 0.65rem; color: #777; }
.qty_btn {width: 2.2rem;height: 2.2rem;border: 1px solid #ddd;background: #f5f5f5;cursor: pointer;font-size: 1.4rem;font-weight: 700;display: flex;align-items: center;justify-content: center;margin: 0;padding: 0;border: none;background: transparent;color: #8FB184 !important;}
.qty_btn:first-child { border-radius: 0.3rem 0 0 0.3rem; }
.qty_btn:last-child { border-radius: 0 0.3rem 0.3rem 0; }
.qty_input {width: 3rem;height: 2.2rem;border: 1px solid #ddd;border-left: none;border-right: none;text-align: center;font-size: 0.8rem !important;background: #fff;margin: 0;width: 3rem !important;min-width: unset;box-shadow: none !important;border: none !important;font-weight: 700;color: #8FB184 !important;}
.qty_input::-webkit-inner-spin-button, .qty_input::-webkit-outer-spin-button { -webkit-appearance: none; }

/* Share */
.product_share {gap: 0.6rem;margin-bottom: 1rem;align-items: center;padding-top: .7rem;margin-top: 1.7rem;border-top: 4px solid #D9D9D9;}
.share_label {color: #000000;font-weight: 600;font-size: 0.7rem;font-weight: 500;margin-bottom: 0.5rem;flex: 0 0 auto;margin: 0;}
.share_btn {display: flex;align-items: center;justify-content: center;width: 1.5rem;height: 1.5rem;border-radius: 50%;border: 1px solid #ddd;background: #3E6530;cursor: pointer;color: #555;text-decoration: none;transition: border-color 0.2s;margin: 0;padding: 0;min-height: unset;border: none;}
.share_btn:hover { border-color: #65BF11; background: #65BF11; }
.share_fb { color: #1877f2; border-color: #1877f2; }
.share_zalo { border-color: #0068FF; overflow: hidden; }
.share_btn svg {filter: brightness(0) invert(1);max-width: 56%;}

/* Buttons */
.product_detail_actions { gap: 0.8rem; flex-wrap: wrap; }
.btn_cart { background: #fff; color: #508741; border: 2px solid #508741; position: relative; overflow: hidden; }
.btn_cart:hover { background: #f0f8eb; }
.btn_buy { background: #508741; color: #fff; position: relative; overflow: hidden; }
.btn_buy:hover { background: #3d6730; }
.btn_cart::after, .btn_buy::after { content: ''; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.5) 50%, transparent 100%); transform: skewX(-20deg); pointer-events: none; transition: none; }
.btn_cart:hover::after, .btn_buy:hover::after { left: 130%; transition: left 0.55s ease; }

/* Coupons */
.coupons_label {font-size: 0.7rem;font-weight: 500;margin-bottom: 0.5rem;flex: 0 0 auto;margin: 0;width: 5.5rem;}
.coupons_list { gap: 0.5rem; flex-wrap: wrap; }
.coupon_item { position: relative; cursor: pointer; }
.coupon_code {gap: 0.3rem;border-radius: 0;padding: 0.3rem 0.7rem;background: #FFF5E6;cursor: pointer;transition: border-color 0.15s;color: #65BF11;font-family: 'Phudu', cursive;}
.coupon_code span {font-size: 0.8rem;font-weight: 700;color: #65BF11;font-family: 'Phudu', cursive;}
.coupon_item:hover .coupon_code { border-color: #508741; }
.coupon_item.applied .coupon_code { border-color: #508741; background: #508741; }
.coupon_item.applied .coupon_code span { color: #fff; }
.coupon_tooltip {position: absolute;bottom: calc(100% + 0.4rem);left: 0;white-space: nowrap;background: #FFF5E6;color: #0F1610;font-size: 0.6rem;padding: 0.35rem 0.7rem;border-radius: 0;z-index: 10;font-weight: 600;}

/* Meta bar */
.product_detail_meta { gap: 1.5rem; flex-wrap: wrap; padding: 1rem; background: #f9f9f9; border-radius: 0.5rem; margin-top: 1.5rem; }
.meta_item { font-size: 0.65rem; color: #555; }
.meta_item .label { font-weight: 700; color: #333; margin-right: 0.3rem; }
.meta_item a { color: #508741; text-decoration: none; }

/* Tab mô tả */
.product_detail_content { padding: 2rem 0; }
.product_detail_tabs {border-radius: 0.5rem;overflow: hidden;}
.tab_nav {border-bottom: 2px solid #508741;justify-content: center;}
.tab_nav_item {padding: 0.8rem 1.5rem;font-size: 0.8rem;font-weight: 600;cursor: pointer;color: #000000;border-bottom: 2px solid transparent;}
.tab_nav_item.active { color: #508741; border-bottom-color: #508741; }
.tab_content {padding: 1.5rem 0rem;font-size: 0.7rem;line-height: 1.8;color: #444;}

/* Related */
/* Combo detail */
.combo_products_section { padding: 2rem 0; background: #f9fafb; }
.combo_products_list { display: flex; flex-direction: column; gap: 0.6rem; }
.combo_product_item { text-decoration: none; color: inherit; background: #fff; border: 1px solid #eee; border-radius: 0.5rem; padding: 0.8rem 1rem; gap: 0.8rem; transition: box-shadow 0.2s; }
.combo_product_item:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.08); border-color: #d6edc8; }
.combo_product_img { width: 4rem; height: 4rem; flex-shrink: 0; border-radius: 0.3rem; overflow: hidden; border: 1px solid #eee; }
.combo_product_img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.combo_product_info { flex: 1; min-width: 0; }
.combo_product_name { font-size: 0.7rem; font-weight: 600; color: #222; margin: 0 0 0.2rem; }
.combo_product_unit { font-size: 0.6rem; color: #888; margin: 0; }
.combo_product_qty { font-size: 0.7rem; font-weight: 700; color: #508741; min-width: 2.5rem; text-align: center; }
.combo_product_price { font-size: 0.7rem; font-weight: 600; color: #c0392b; min-width: 5rem; text-align: right; }

.product_related { padding: 2rem 0; }
.heading_title {font-weight: 700;margin: 0 0 1.2rem;}
/* Related Swiper */
.product_related_swiper { padding-bottom: 0.5rem; }
.product_related_swiper .product_item { height: 100%; }
.product_related .wrap_slider .arrow_slider.hotdeal_prev { left: -3rem; }
.product_related .wrap_slider .arrow_slider.hotdeal_next { right: -3rem; }



/* ─── CUSTOM SELECT (Select2-style) ─────────────────────────────────────── */
.custom_select { position: relative; width: 100%; user-select: none; }

.custom_select_trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0 0.9rem;
  height: 2.1rem;
  cursor: pointer;
  font-size: 0.65rem;
  color: #333;
}
.custom_select_trigger .placeholder {color: #3E6530;font-style: normal;font-weight: 600;}
.custom_select_trigger svg {flex-shrink: 0;color: #888;transition: transform 0.2s;width: .55rem;height: auto;}
.custom_select.open .custom_select_trigger svg { transform: rotate(180deg); }

.custom_select_dropdown {
  position: absolute; top: calc(100% + 4px); left: 0;
  min-width: 100%; background: #fff; border: 1px solid #ddd;
  border-radius: 0.3rem; box-shadow: 0 4px 16px rgba(0,0,0,.1);
  z-index: 200; list-style: none; padding: 0.3rem 0; margin: 0;
  max-height: 14rem; overflow-y: auto;
}
.custom_select_dropdown li {
  padding: 0.5rem 0.9rem; font-size: 0.65rem; color: #444;
  cursor: pointer; white-space: nowrap;
}
.custom_select_dropdown li:hover { background: #f5f5f5; color: #222; }
.custom_select_dropdown li.active { color: #508741; font-weight: 700; background: #f0f8eb; }

/* ─── RECRUITMENT DETAIL HEAD BG ─────────────────────────────────────────── */
.recruitment_detail_head_bg {
  background-size: cover; background-position: center;
  padding: 2rem 0;
  margin-bottom: 2rem;
}
.recruitment_detail_head_bg .recruitment_detail_head { gap: 1.5rem; }
.recruitment_detail_head_bg .recruitment_detail_title h1 { color: #fff; font-size: 1.2rem; font-weight: 700; margin: 0 0 0.5rem; }
.recruitment_detail_head_bg .recruitment_detail_meta { gap: 1.2rem; flex-wrap: wrap; margin-top: 0.4rem; }
.recruitment_detail_head_bg .recruitment_detail_meta span { font-size: 0.65rem; color: rgba(255,255,255,.85); }
.recruitment_detail_head_bg .recruitment_detail_meta b { color: #fff; }

/* ─── APPLY POPUP ─────────────────────────────────────────────────────────── */
.rd_popup_backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.55);
  z-index: 3000; display: flex; align-items: center; justify-content: center;
  padding: 1rem;
}
.rd_popup {
  background: #fff; border-radius: 0.6rem; width: 100%; max-width: 36rem;
  max-height: 90vh; overflow-y: auto; position: relative;
  padding: 2rem 2rem 1.5rem;
}
.rd_popup_close {
  position: absolute; top: 1rem; right: 1rem;
  background: none; border: none; cursor: pointer; padding: 0.3rem;
  display: flex; align-items: center;
}
.rd_popup_title {
  font-size: 1rem;
  font-weight: 700;
  color: #3E6530;
  margin: 0 0 1.4rem;
  text-align: center;
}

/* Form sections */
.rd_form_section_label {
  font-size: 0.7rem;
  font-weight: 600;
  color: #508741;
  margin-bottom: 0.6rem;
  text-transform: uppercase;
}
.rd_form_row { display: flex; gap: 0.8rem; margin-bottom: 1.2rem; }
.rd_form_field { flex: 1; min-width: 0; }
.rd_form_field input {
  width: 100%;
  border: 1px solid #C7D4C7;
  border-radius: 0.3rem;
  padding: 0.55rem 1rem;
  font-size: 0.7rem;
  outline: none;
  color: #333;
  height: 2.3rem;
  box-shadow: none;
  font-weight: 500;
}
.rd_form_field input:focus { border-color: #508741; }
.rd_field_err { display: block; font-size: 0.6rem; color: #e74c3c; margin-top: 0.2rem; }

/* Dropzone */
.rd_dropzone {
  border: 2px dashed #ccc;
  border-radius: 0.4rem;
  padding: 2rem 1rem;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s;
  margin-bottom: 0.4rem;
  background: #C7D4C7;
}
.rd_dropzone:hover, .rd_dropzone.dragging { border-color: #508741; background: #f6fcf0; }
.rd_dropzone p {font-size: 1rem;color: #3E6530;margin: 0.5rem 0;}
.rd_dropzone_btn {
  display: inline-block;
  background: #508741;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.4rem 1.2rem;
  border-radius: 0;
  margin-top: 0.4rem;
}
.rd_dropzone.has_file { border-color: #508741; background: #f6fcf0; }
.rd_dropzone_file { display: flex; align-items: center; gap: 0.6rem; justify-content: center; flex-wrap: wrap; }
.rd_dropzone_file span { font-size: 0.7rem; color: #333; }
.rd_dropzone_file button { background: none; border: none; cursor: pointer; color: #aaa; font-size: 0.8rem; }

.rd_form_note { font-size: 0.6rem; color: #aaa; margin: 0.2rem 0 1rem; }
.rd_form_err_all { font-size: 0.65rem; color: #e74c3c; margin-bottom: 0.8rem; text-align: center; }
.rd_submit_btn { width: 100%; text-align: center; display: block; border-radius: 0.3rem; }

/* ─── THANK YOU POPUP ─────────────────────────────────────────────────────── */
.rd_thankyou_popup { padding: 0; overflow: hidden; }
.rd_thankyou_top {
  height: 8rem; background-size: cover; background-position: center;
  filter: brightness(0.7);
}
.rd_thankyou_body {
  padding: 2rem 2rem 2.5rem;
  text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.8rem;
}
.rd_thankyou_body h2 { font-size: 1.1rem; font-weight: 700; color: #222; margin: 0; }
.rd_thankyou_body p { font-size: 0.7rem; color: #666; line-height: 1.7; margin: 0; }
.rd_thankyou_body .rd_submit_btn { margin-top: 0.5rem; }

/* ─── CART POPUP NOTIFICATION ─────────────────────────────────────────────── */
@keyframes cartPopupIn {
  from { transform: translateX(110%); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}
@keyframes cartPopupOut {
  from { transform: translateX(0);    opacity: 1; }
  to   { transform: translateX(110%); opacity: 0; }
}
.cart_popup {
  position: fixed; bottom: 2rem; right: 2rem; z-index: 99999;
  background: #fff; border-radius: 0.6rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
  padding: 1rem 2.5rem 1rem 1rem;
  display: flex; align-items: center; gap: 0.8rem;
  max-width: 24rem; min-width: 18rem;
  border-left: 4px solid #508741;
  animation: cartPopupIn 0.35s cubic-bezier(.21,1.02,.73,1) both;
}
.cart_popup.hiding { animation: cartPopupOut 0.3s ease both; }
.cart_popup_check {
  width: 2.2rem; height: 2.2rem; flex-shrink: 0;
  background: #508741; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
}
.cart_popup_img {
  width: 3.4rem; height: 3.4rem; border-radius: 0.4rem;
  object-fit: cover; flex-shrink: 0; border: 1px solid #eee;
}
.cart_popup_info { flex: 1; min-width: 0; }
.cart_popup_title { font-size: 0.6rem; font-weight: 700; color: #508741; margin-bottom: 0.2rem; text-transform: uppercase; letter-spacing: 0.03em; }
.cart_popup_name { font-size: 0.7rem; color: #222; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cart_popup_link {
  display: inline-block; margin-top: 0.4rem;
  font-size: 0.6rem; color: #fff; background: #508741;
  padding: 0.2rem 0.7rem; border-radius: 0.25rem;
  text-decoration: none; font-weight: 600; transition: background 0.2s;
}
.cart_popup_link:hover { background: #3e6b32; color: #fff; }
.cart_popup_close {
  position: absolute; top: 0.5rem; right: 0.6rem;
  background: none; border: none; cursor: pointer;
  color: #bbb; font-size: 0.75rem; line-height: 1; padding: 0.2rem;
  transition: color 0.2s;
}
.cart_popup_close:hover { color: #555; }

/* ─── Gift & Upsell blocks (trong cột info sản phẩm) ────────────────────────── */
.pd_extra_block { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #eee; }
.pd_upsell_block { }

.pd_extra_header {display: flex;align-items: center;gap: 0.4rem;margin-bottom: 0.7rem;color: #E0391F;}
.pd_extra_header span,.pd_extra_header span {font-size: 0.7rem;font-weight: 700;color: #E0391F !important;}
.pd_extra_header em {font-size: 0.55rem;font-style: normal;color: #E0391F;font-weight: 400;}

/* Gift card chọn/bỏ chọn */
.pd_gift_card { cursor: pointer; }
.pd_gift_card .pd_extra_img_wrap { transition: border-color 0.2s; }
.pd_gift_card.selected .pd_extra_img_wrap {}
.pd_gift_check {position: absolute;top: -.4rem;right: -.4rem;width: 1.4rem;height: 1.4rem;background: #fff;border: 1px solid #65BF11;border-radius: 50%;display: flex;align-items: center;justify-content: center;transition: background .2s, border-color .2s;}
.pd_gift_card.selected .pd_gift_check {background: #65BF11;border-color: #65BF11;}

.pd_gift_check {
    border-radius: 0;
    border-width: 2px;
}
.pd_upsell_block .pd_extra_header { color: #333; justify-content: space-between; }
.pd_upsell_block .pd_extra_header > span:first-child { color: #333; }
/* Gift toast popup */
.pd_gift_toast {
  position: fixed; bottom: 2rem; right: 2rem; z-index: 99999;
  background: #fff; border-radius: 0.6rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
  padding: 1rem 1.2rem;
  display: flex; align-items: flex-start; gap: 0.6rem;
  max-width: 22rem; min-width: 16rem;
  border-left: 4px solid #e53935;
  font-size: 0.65rem; color: #333; line-height: 1.5;
  animation: cartPopupIn 0.35s cubic-bezier(.21,1.02,.73,1) both;
}
.pd_gift_toast svg { flex-shrink: 0; color: #e53935; margin-top: 0.1rem; }

.pd_extra_swiper {padding-bottom: 0;}
.pd_extra_swiper .swiper-button-next,
.pd_extra_swiper .swiper-button-prev {color: #508741;width: 1.6rem;height: 1.6rem;top: 33%;display: none;}
.pd_extra_swiper .swiper-button-next::after,
.pd_extra_swiper .swiper-button-prev::after { font-size: 0.7rem; font-weight: 800; }

.pd_extra_card {display: block;text-decoration: none;cursor: default;background: #fff;padding: .4rem;cursor: pointer;position: relative;}
.pd_upsell_card { cursor: pointer; }
.pd_upsell_card:hover .pd_extra_img_wrap img { transform: scale(1.04); }

.pd_extra_img_wrap {position: relative;border-radius: 0;border: 1px solid #A3C02D;background: #fff;}
.pd_extra_img_wrap img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; transition: transform 0.25s ease; }
.pd_upsell_card:hover .pd_extra_img_wrap img { transform: scale(1.04); }

.pd_extra_name {font-size: 0.5rem;color: #333;margin-top: 0.35rem;font-weight: 600;line-height: 1.4;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin: .2rem 0 0;}

.pd_upsell_disc_badge { position: absolute; top: 0.3rem; left: 0.3rem; background: #e8351b; color: #fff; font-size: 0.5rem; font-weight: 700; padding: 0.15rem 0.4rem; border-radius: 0.25rem; z-index: 2; line-height: 1.4; }
.pd_upsell_price_wrap { display: flex; align-items: center; gap: 0.3rem; flex-wrap: wrap; margin-top: 0.2rem; }
.pd_upsell_old_price { font-size: 0.5rem; color: #aaa; text-decoration: line-through; }
.pd_upsell_new_price { font-size: 0.58rem; color: #e8351b; font-weight: 700; }
.pd_upsell_summary { margin-left: auto; font-size: 0.62rem; color: #333; display: flex; align-items: center; gap: 0.25rem; flex-wrap: wrap; justify-content: flex-end; }
.pd_upsell_summary strong { color: #e8351b; font-weight: 700; }
.pd_upsell_normal_total { font-style: normal; color: #aaa; text-decoration: line-through; font-size: 0.56rem; }
.pd_upsell_saved { color: #508741; font-style: normal; font-weight: 600; }
.pd_upsell_hint { font-size: 0.56rem; color: #999; font-style: italic; font-weight: 400; }

/* Tooltip fixed — thoát hoàn toàn khỏi overflow slider */
@keyframes tooltipIn {
  from { opacity: 0; transform: translateX(-6px) scale(0.97); }
  to   { opacity: 1; transform: translateX(0)    scale(1); }
}
.pd_extra_tooltip_fixed { position: fixed; background: #fff; border: 1px solid #d6edc8; border-radius: 0.5rem; box-shadow: 0 6px 28px rgba(0,0,0,0.15); padding: 0.8rem; z-index: 9999; width: 17rem; pointer-events: none; animation: tooltipIn 0.18s cubic-bezier(.21,1.02,.73,1) both; }
.pd_extra_tooltip_inner { display: flex; gap: 0.7rem; align-items: flex-start; }
.pd_extra_tooltip_img { width: 4rem; height: 4rem; object-fit: cover; border-radius: 0.3rem; border: 1px solid #eee; flex-shrink: 0; }
.pd_extra_tooltip_body { flex: 1; min-width: 0; }
.pd_extra_tooltip_name { display: block; font-size: 0.65rem; font-weight: 700; color: #222; margin-bottom: 0.4rem; line-height: 1.4; }
.pd_extra_tooltip_body div { font-size: 0.56rem; color: #444; line-height: 1.9; }
.pd_extra_tooltip_body b { color: #508741; min-width: 5.5rem; display: inline-block; font-weight: 600; }
.pd_extra_tooltip_desc { font-size: 0.54rem; color: #666; margin-top: 0.4rem; line-height: 1.6; border-top: 1px solid #eee; padding-top: 0.4rem; }

.pd_extra_tooltip_fixed {
    border-radius: 0;
    box-shadow: none;
    background: #E0E6E0;
    padding: .5rem;
}

.pd_extra_tooltip_img {
    width: 6rem;
    height: 6rem;
    border-radius: 0;
    border: 1px solid #A3C02D;
}

.pd_extra_tooltip_body {
    font-size: .4rem;
}

.pd_extra_tooltip_body div {
    font-size: .5rem;
}

.pd_extra_tooltip_body div:before {
    content: '';
    width: .1rem;
    height: .1rem;
    background: #000000;
    border-radius: 50%;
    display: inline-block;
    margin-right: .2rem;
}

p.pd_extra_tooltip_desc {
    padding: 0;
    margin: 0;
    font-size: .5rem;
    color: #0F1610;
    border: none;
    margin-top: .3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.pd_extra_tooltip_name {
    font-size: .7rem;
    margin-bottom: .2rem;
}

.pd_extra_tooltip_body div {
    line-height: normal;
}

.pd_extra_tooltip_body div b {
    font-weight: 400;
    color: #000;
    min-width: unset;
    text-transform: math-auto;
}

.pd_extra_tooltip_body div {
    color: #000;
}

p.pd_extra_tooltip_desc {
    line-height: 1.2;
}

/* ── Dual Range Slider (flash-sale filters) ── */
.dual_range_wrap { padding: 0.4rem 0 0; }
.dual_range_wrap .range_labels {justify-content: space-between;font-size: 0.5rem;font-weight: 500;color: #3E6530;margin-bottom: 0.6rem;}
.dual_range_wrap .range_track_wrap {position: relative;height: 0.35rem;margin: 0.6rem 0;}
.dual_range_wrap .range_track { position: absolute; inset: 0; border-radius: 99px; }

.dual_range_wrap .range_input { position: absolute; width: 100%; height: 0.35rem; top: 0; margin: 0; padding: 0; background: transparent; pointer-events: none; -webkit-appearance: none; appearance: none; }
.dual_range_wrap .range_input::-webkit-slider-thumb { -webkit-appearance: none; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #3a5c2a; cursor: pointer; pointer-events: all; box-shadow: 0 0.1rem 0.3rem rgba(0,0,0,.25); }
.dual_range_wrap .range_input::-moz-range-thumb { width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #3a5c2a; cursor: pointer; pointer-events: all; border: none; box-shadow: 0 0.1rem 0.3rem rgba(0,0,0,.25); }
.dual_range_wrap .range_input::-webkit-slider-runnable-track { background: transparent; }
.dual_range_wrap .range_input::-moz-range-track { background: transparent; }
.dual_range_wrap .range_limits { justify-content: space-between; font-size: 0.55rem; color: #aaa; margin-top: 0.5rem; }
.prodcat_related_posts { width: 50%; }

/* ── Contact Popup ── */
.popup_overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 9999;
    display: flex; align-items: center; justify-content: center; padding: 1rem;
    animation: popup_overlay_in .35s ease;
}
.popup_contact_wrap {
    position: relative;background: #E0E6E0;border-radius: 0;overflow: hidden;max-width: 60rem;width: 100%;display: flex;max-height: 90vh;align-items: center;
    animation: popup_contact_in .35s cubic-bezier(.22,1,.36,1);
}
@keyframes popup_overlay_in {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes popup_contact_in {
    from { opacity: 0; transform: translateY(.8rem) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.popup_overlay.closing { animation: popup_overlay_out .3s ease forwards; }
.popup_contact_wrap.closing { animation: popup_contact_out .3s cubic-bezier(.22,1,.36,1) forwards; }
@keyframes popup_overlay_out {
    from { opacity: 1; }
    to { opacity: 0; }
}
@keyframes popup_contact_out {
    from { opacity: 1; transform: translateY(0) scale(1); }
    to { opacity: 0; transform: translateY(.8rem) scale(.97); }
}
.popup_close {position: absolute;top: 0.8rem;right: 0.8rem;background: rgba(0,0,0,.08);border: none;border-radius: 50%;width: 2.2rem;height: 2.2rem;cursor: pointer;display: flex;align-items: center;justify-content: center;z-index: 2;padding: 0;margin: 0;top: 0;right: 0;border-radius: 0;}
.popup_contact_img {width: 55%;flex-shrink: 0;}
.popup_contact_img img {width: auto;height: auto;}
.popup_contact_form { flex: 1; padding: 2.4rem 2rem; overflow-y: auto; }
.popup_form_title {font-size: 1.4rem;font-weight: 700;color: #2d4a1e;margin-bottom: 0.1rem;text-transform: uppercase;}
.popup_form_subtitle {font-size: 0.7rem;color: #0F1610;margin-bottom: 1.2rem;}
.popup_contact_form .form_row {margin-bottom: 0;}
.popup_contact_form input, .popup_contact_form textarea {width: 100%;border: 1px solid #508741;border-radius: 0;padding: 0.6rem 0.8rem;font-size: 0.7rem;outline: none;font-family: inherit;height: 2.5rem;font-size: .6rem;font-weight: 600;color: #3E6530;}
.popup_contact_form input:focus, .popup_contact_form textarea:focus { border-color: #3a5c2a; }
.popup_contact_form textarea {resize: vertical;min-height: unset;height: 4.5rem;}
.form_error { color: #c00; font-size: 0.65rem; margin-bottom: 0.5rem; }
.btn_submit_contact {background: #65BF11;color: #fff;border: none;padding: 0.75rem 2rem;font-size: 1rem;font-weight: 700;letter-spacing: 0.05em;cursor: pointer;width: 100%;margin-top: 0.4rem;margin: 0;border-radius: 0;}
.btn_submit_contact:disabled { opacity: .6; cursor: not-allowed; }
.popup_sent_msg { text-align: center; padding: 2rem 0; }
.popup_sent_msg h3 { font-size: 1.2rem; color: #2d4a1e; margin-bottom: 0.5rem; }

/* ── Service Category ── */
.service_cat_banner {position: relative;background-size: cover;background-position: center;display: flex;align-items: center;}
.service_cat_banner_overlay {width: 100%;padding: 6rem 0 7rem;}
.service_cat_banner .breadcrumb_simple { font-size: 0.7rem; margin-bottom: 1rem; opacity: .85; }
.service_cat_banner .breadcrumb_simple a { color: inherit; }
.service_cat_title {font-size: 2.4rem;font-weight: 600;text-transform: uppercase;letter-spacing: 0.05em;text-align: center;font-family: 'Phudu', cursive;margin: 0;}

/* Cấp 1 — children grid */
.service_cat_children { padding: 3rem 0; }
.service_cat_children_grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.service_cat_child_card { display: block; text-decoration: none; border-radius: 0.5rem; overflow: hidden; background: #f9f9f7; }
.service_cat_child_img { aspect-ratio: 1/1; overflow: hidden; }
.service_cat_child_img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.service_cat_child_card:hover .service_cat_child_img img { transform: scale(1.04); }
.service_cat_child_name { padding: 0.8rem 1rem; font-weight: 600; font-size: 0.8rem; color: #2d4a1e; text-align: center; }

/* Cấp 2 — products grid */
.service_cat_products {padding: 0 0 3rem;background: #FFF5E680;border-top: 1rem solid #fff;}
.service_cat_products.loading { opacity: .6; pointer-events: none; }
.service_cat_grid {display: grid;grid-template-columns: repeat(4, 1fr);gap: .5rem;margin-bottom: 2.5rem;}
.service_cat_item { background: #fff; border-radius: 0.4rem; overflow: hidden; }
.service_cat_img { aspect-ratio: 1/1; overflow: hidden; background: #f4f4f0; }
.service_cat_img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.service_cat_item:hover .service_cat_img img { transform: scale(1.04); }
.service_cat_info { padding: 0.75rem; }
.service_cat_info h3 { font-size: 0.75rem; font-weight: 600; color: #222; margin: 0; line-height: 1.4; }
.service_cat_description {margin-top: 2.5rem;padding: 0 2rem;border-radius: 0.4rem;font-size: .8rem;line-height: 1.6;color: #3E6530;font-weight: 600;margin-top: 4rem;}

/* ── Service Category Level 1 ── */
.sc_l1_hero {position: relative;background-size: cover;background-position: center;display: flex;align-items: center;text-align: center;background: #FFF5E6 !important;}
.sc_l1_hero_inner { width: 100%; padding: 4rem 0; }
.sc_l1_title {font-size: 1.6rem;font-weight: 800;text-transform: uppercase;margin-bottom: 0.6rem;line-height: 1.5;white-space: pre-line;color: #3E6530 !important;}
.sc_l1_subtitle { font-size: 0.85rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 1.2rem; opacity: .9; }
.sc_l1_desc {font-size: 0.72rem;line-height: 1.8;opacity: .9;margin-bottom: 1.8rem;margin: auto;color: #508741;font-weight: 600;max-width: 45rem;}
.sc_l1_stats {gap: .9rem;flex-wrap: wrap;justify-content: center;}
.sc_l1_stat {background: #fff;border: 1px solid rgba(255,255,255,.3);border-radius: 0.4rem;padding: 1rem 1.4rem;text-align: center;min-width: 8rem;color: #fff;}
.sc_l1_stat b {display: block;font-size: 1.6rem;font-weight: 700;color: #3E6530;line-height: 1.2;}
.sc_l1_stat span {font-size: 0.5rem;color: #0F1610;font-weight: 500;}

/* Child sections */
.sc_l1_child_section {background-size: cover;background-position: top center;position: relative;background-size: 100% auto;background-repeat: no-repeat;}
.sc_l1_child_overlay {padding: 3.5rem 0;}
.sc_l1_child_header { justify-content: space-between; align-items: center; margin-bottom: 1.2rem; }
.sc_l1_child_name {text-align: center;font-size: 2.4rem;font-weight: 700;text-transform: uppercase;color: #2d4a1e;margin: 0;font-family: 'Phudu', cursive;margin-bottom: .7rem;}
.sc_l1_view_all {display: inline-block;background: #2d4a1e;color: #fff;padding: 0.5rem 1.2rem;border-radius: 0.3rem;font-size: 0.68rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.05em;text-decoration: none;min-width: 12rem;border-radius: 0;border: 1px solid #FFF5E6;background: transparent;color: #65BF11;transition: .5s all;}

/* Product slider */
.sc_l1_swiper_wrap { position: relative; padding: 0 1.2rem; }
.sc_l1_swiper_wrap .arrow_slider { left: -2rem; transition: background .2s; }
.sc_l1_swiper_wrap .arrow_slider.hotdeal_next { left: unset; right: -2rem; }
.sc_l1_swiper_wrap .arrow_slider:hover { background: #3E6530; }
.sc_l1_swiper_wrap .arrow_slider:hover svg path { fill: #fff; }
.sc_l1_products_swiper {padding-bottom: 1.5rem !important;}
.sc_l1_products_swiper .swiper-button-next,
.sc_l1_products_swiper .swiper-button-prev { color: #2d4a1e; --swiper-navigation-size: 1.2rem; }
.sc_l1_product_item {background: #fff;overflow: hidden;padding: 2.3rem .6rem;transition: .5s all;}
.sc_l1_product_img { aspect-ratio: 1/1; overflow: hidden; background: #f4f4f0; }
.sc_l1_product_img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.sc_l1_product_item:hover .sc_l1_product_img img { transform: scale(1.04); }
.sc_l1_product_name {font-weight: 600;color: #222;line-height: 1.35;margin: .8rem 0 0 0;transition: .5s all;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;display: -webkit-box;-webkit-box-orient: vertical;height: 2.2rem;transition: .5s all;}

/* ── Service Listing Page (trang Giải Pháp Cho Sản Phẩm) ────────────────── */
.service_list_banner {position: relative;background-size: cover;background-position: center;display: flex;align-items: center;}
.service_list_banner_overlay {width: 100%;padding: 3.5rem 0;background: #0000004f;}
.service_list_title {font-size: 1.6rem;font-weight: 600;text-transform: uppercase;color: #FFF5E6;text-align: center;margin: 0;font-family: 'Phudu', cursive;}

.service_list_cats {background: #C7D4C7;padding: 3rem 0;display: flex;flex-direction: column;gap: 1.5rem;}

.slc_item {position: relative;padding: 3rem 3rem 5rem;border-bottom: 1px solid rgba(0,0,0,.06);overflow: hidden;background: #fff;border-radius: .6rem;cursor: pointer;}
.slc_item:last-child { border-bottom: none; }

/* Watermark */
.slc_watermark {position: absolute;right: -.8rem;bottom: 0;font-size: 15rem;font-weight: 900;color: rgba(0,0,0,.05);text-transform: uppercase;pointer-events: none;line-height: 1;user-select: none;letter-spacing: 0;line-height: .7;font-family: 'Phudu', cursive;font-weight: 700;color: #C7D4C7;}
.slc_reverse .slc_watermark { right: auto; left: -1rem; }

/* Inner flex */
.slc_inner {gap: 2rem;align-items: flex-start;}

/* Cột ảnh (trái mặc định) */
.slc_img_col {width: 57%;}
.slc_name {font-size: 3rem;font-weight: 600;color: #3E6530;text-transform: uppercase;line-height: 1;margin-bottom: 0;font-family: 'Phudu', cursive;}
.slc_subtitle {font-size: 1.6rem;font-weight: 800;color: #65BF11;text-transform: uppercase;margin-bottom: 1.2rem;font-family: 'Phudu', cursive;font-weight: 600;}
.slc_img { margin-top: 1rem; }
.slc_img img { width: 100%; max-height: 18rem; object-fit: contain; }

/* Cột text (phải mặc định) */
.slc_text_col {width: 43%;padding-top: 2rem;}
.slc_desc {font-size: 0.8rem;line-height: 1.6;color: #0F1610;margin-bottom: 1.6rem;font-weight: 500;}
.slc_btn_contact {position: relative;z-index: 10;font-family: inherit;display: inline-block;border: 2px solid #8EB184;color: #3E6530;background: transparent;padding: 0.7rem 2rem;font-size: 0.72rem;font-weight: 700;text-transform: uppercase;cursor: pointer;transition: background .2s, color .2s;margin: 0 1.5rem 0 0;float: right;height: 2rem;padding: 0;display: flex;justify-content: center;align-items: center;padding: 0 1rem;min-width: 12rem;}
.slc_btn_contact:hover { background: #1a1a1a; color: #fff; }
.slc_link_more { display: block; font-size: 0.7rem; font-weight: 600; color: #5a8a2c; text-decoration: underline; letter-spacing: 0.04em; }

/* Reverse (chẵn): đổi thứ tự cột */
.slc_reverse .slc_inner {flex-direction: row-reverse;position: relative;z-index: 2;}
.slc_reverse .slc_name { text-align: right; }
.slc_reverse .slc_subtitle { text-align: right; }

.flash_sale_box .title_box h2 {
    color: #fff;
}
.selling_box .title_box .link_button svg {
    width: .3rem;
    height: auto;
    fill: #0F1610;
}

.selling_box .title_box .link_button svg path {
    fill: #0F1610;
}

.flash_sale_box  a.link_button {
    filter: brightness(0) invert(1);
}

.product_item .list_nhan li {
    margin: 0;
}

.product_item .add_button svg {
    width: 1.8rem;
    height: auto;
}
.product_item .add_button:hover svg { animation: add_button_spin .5s ease; }
@keyframes add_button_spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.price {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}
.selling_box.hot_deal_box {
    background: #FFF5E6;
}
.selling_box.selling_box_giam_gia {
    background: #FFF5E6;
}

.selling_box.selling_box_combo {
    background: #C7D4C7;
}

.selling_box.selling_box_combo .title_box h2 {
    color: #3E6530;
}

.selling_box.selling_box_giam_gia .title_box h2 {
    color: #3E6530;
}

.selling_box.selling_box_khuyen_mai .title_box h2 {
    color: #65BF11;
}
.flashsale_page .flash_sale_box {
    background: transparent;
}

.flashsale_page .title_box .left {
    justify-content: space-between;
    width: 100%;
}

.flash-sale_template .flash_sale_box .title_box {
    padding: 1rem !important;
}



.product_grid_wrap {
    background: #FFF5E6;
    padding: 1.2rem 2rem;
}
.filter_group input[type="radio"] {
    margin: 0;
    accent-color: #3E6530;
}
.filter_group label:has(input[type="radio"]:checked) {
    color: #3E6530;
    font-weight: 700;
}

.product_grid {
    position: relative;
}
.prodcat_related .row {
    max-width: 60rem;
}

.prodcat_related_content h2.title_head {
    color: #508741;
    font-size: 2.4rem;
    font-weight: 600;
}

.prodcat_related_posts .post_item {
    width: 100%;
    margin: 0;
    background: #Fff;
}
.prodcat_related_posts .post_item .box_content {
    padding-bottom: .6rem;
}

.prodcat_related_posts .arrow_slider {
    display: none;
}
.coupon_code svg {
    display: none;
}
.product_detail_actions button {
    transition: .5s all;
    margin: 0;
    padding: 0 1.5rem;
    height: 2rem;
    color: #8FB184;
    background: #fff;
    line-height: normal;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 12rem;
    font-size: .7rem;
    border: 2px solid #8FB184;
}

.product_detail_actions button.button_link.btn_cart {
    background: #508741;
    color: #fff;
    border-color: #508741;
}

.pd_extra_block.pd_upsell_block .pd_upsell_price_wrap {
    display: none;
}
.pd_extra_slider_wrap {
    padding: .4rem;
    background: #FFF5E6;
    position: relative;
}
.pd_extra_slider_wrap .arrow_slider {
    background: transparent !important;
    box-shadow: none !important;
    left: -2rem;
}

.pd_extra_slider_wrap .arrow_slider.pd_extra_next {
    left: unset;
    right: -2rem;
}

.pd_extra_slider_wrap .pd_extra_next path {
    fill: #65BF11 !important;
}

.pd_gift_check svg {
    width: 84%;
    height: auto;
}

.pd_extra_card:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 2px solid #65BF11;
    opacity: 0;
    transition: .5s all;
}

.pd_extra_card.pd_gift_card.selected:before {
    opacity: 1;
}

.product_related a.link_button {
    flex: 0 0 auto;
    gap: .5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.product_related a.link_button svg { width: .35rem; height: auto; }

.product_template  h2.heading_title {
    font-size: 1.4rem;
    font-weight: 800;
    font-family: 'Montserrat', sans-serif;
    color: #0F1610;
}

.swiper-horizontal .swiper-button-prev, .swiper-horizontal .swiper-button-next, .swiper-horizontal ~ .swiper-button-prev, .swiper-horizontal ~ .swiper-button-next {
    display: none;
}
.auth_form input::placeholder {
    color: #3E6530;
}

.auth_form input:hover,.auth_form input:focus {
    opacity: 1;
}
form.account_form button.button_link.btn_submit {
    width: auto;
    padding: 0 2rem;
    margin-top: 1rem;
}
.minicart_body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}

.minicart_body::-webkit-scrollbar {
    width: 0.217rem;
    background-color: #cedbff;
}
.minicart_body::-webkit-scrollbar-thumb {
    background-color: #508741;
}
.checkout_field label {
    display: none;
}

.checkout_field {
    margin-bottom: .5rem;
}

h1.checkout_form_title {
    color: #0F1610;
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.checkout_section+.checkout_section {
    margin-top: 1.5rem;
}
.vat_invoice_row h2 {
    margin: 0;
}

.css-hlgwow input {
    height: auto !important;
}

.css-wdl1z9-control,.css-rvnxmf-control {
    padding: 0 .8rem !important;
    border-radius: 0 !important;
    font-size: .75rem !important;
    border: 1px solid #8FB184;
}

.css-hlgwow {
    padding: 0;
}

.css-1xc3v61-indicatorContainer {
    border: none !important;
}

.css-1u9des2-indicatorSeparator {
    display: none;
}



.css-f3u7cf-control {
    border-radius: 0;
    padding: 0 .8rem;
    font-size: .75rem !important;
    height: 2.5rem;
}

.css-1lkpv8d-menu {
    margin: 0;
}
.css-b62m3t-container {
    border-radius: 0 !important;
}

.css-f3u7cf-control {
    border-radius: 0 !important;
}

.css-hlgwow {
    padding: 0 !important;
}
.summary_group {
    padding: .6rem 0;
}
span.summary_item_index {
    width: 2rem;
    text-align: center;
    font-size: .75rem;
    color: #3E6530;
    flex: 0 0 auto;
}

.summary_item_del {
    position: absolute;
    right: 0;
    display: none;
}

.summary_item_total {
    width: 100%;
    text-align: right;
    color: #3E6530;
}

.summary_item_price_col {
    font-size: .7rem;
    width: 4rem;
    flex: 0 0 auto;
    color: #3E6530;
}
.summary_item_old_price { display: block; font-size: .6rem; font-weight: 400; color: #999; }

.summary_item_qty_col {
    display: flex;
    width: 4rem;
    flex: 0 0 auto;
    color: #3E6530;
    font-size: .7rem;
}
.summary_group_children .summary_item_total {
    color: #E0391F;
}

.summary_group_children {}

.summary_group_children .summary_item_price_col {
    color: #E0391F;
    font-weight: 500;
}

.summary_group_children .summary_item_qty_col {
    color: #E0391F;
    font-weight: 500;
}

input.coupon_input {
    margin: 0;
    border: none;
    box-shadow: none;
    height: 1.5rem;
    font-size: 0.75rem;
}

.coupon_input_row {
    background: #FFFFFF;
}

.grand_total_price+div {
    font-weight: 400;
    color: #3E6530 !important;
}

.summary_totals:before,.summary_totals:after {
    content: '';
    position: absolute;
    top: 0;
    left: -2.2rem;
    background: #fff;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.summary_totals:after {
    transform: translate(50%, -50%);
    left: unset;
    right: -2.2rem;
}
.service_list_cats .row {
    max-width: 60rem;
}

.slc_btn_contact:hover {
    background: #3E6530;
    color: #fff;
    border-color: #3E6530;
}

.slc_reverse .slc_inner a.slc_btn_contact {
    float: left;
}
.service_category_template  main#main .row {
    max-width: 60rem;
}
.sc_l1_child_section:before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 80%;
    background: linear-gradient(0deg, #fff, #fff, transparent);
    content: '';
}
.service_category_template  main#main .row {
    max-width: 60rem;
}
.sc_l1_child_desc.wysiwyg {
    color: #fff;
    font-weight: 600;
    max-width: 44rem;
    margin: auto;
    line-height: 1.4;
}

.sc_l1_view_all_wrap {
    text-align: center;
}

.sc_l1_view_all:hover {
    background: #2d4a1e;
    color: #fff;
}

.sc_l1_product_item:hover {
    background: #d1ecb8;
}

.sc_l1_product_item:hover .sc_l1_product_name {
    color: #3E6530;
}
.service_cat_products .service_cat_grid {
    margin-top: -6rem;
}

.service_cat_products .row {
    max-width: 55rem !important;
}
.service_detail  img {}

section.service_detail .gallery_main {
    border: navajowhite;
}

section.service_detail .gallery_thumbs_swiper .swiper-slide {
    border: none;
}

.service_specs {
    margin-left: 1rem;
    font-size: .7rem;
    font-weight: 500;
}

.service_short_desc {
    font-size: .6rem;
    color: #000;
}

button.button_link.btn_contact {
    margin: 0;
    background: #508741;
    border: 2px solid #8FB184;
    height: 2rem;
    padding: 0;
    font-size: .7rem;
    min-width: 12rem;
    padding: 0 1rem;
    text-align: center;
    justify-content: center;
}
.service_detail_content .tabs_head {
    border-bottom: 2px solid #508741;
    display: flex;
    justify-content: center;
}

.service_detail_content .tabs_head .tab_item {
    font-size: 0.8rem;
    font-weight: 600;
    padding: .5rem 0;
}

.service_detail_content .tab_content {
    padding: 1.5rem 3rem 0 !important;
}

section.product_related.service_related .row {
    padding: 0 3rem;
}

.service_template  h2.title_head {
    font-size: 1rem;
    color: #0F1610;
    font-weight: 800;
    font-family: 'Montserrat', sans-serif;
    margin: 0;
}

.product_related a.link_more {
    flex: 0 0 auto;
    color: #0F1610;
    font-weight: 500;
    display: flex;
    gap: .5rem;
    align-items: center;
    line-height: normal;
}

.service_recently_viewed .row {
    padding: 0 3rem;
}

.service_recently_viewed .swiper,
.service_related .swiper{
    margin-top: 1rem;
}
.service_recently_viewed {
    padding-bottom: 3rem;
}
.popup_contact_form input::placeholder, .popup_contact_form textarea::placeholder {
    color: #3E6530;
}

.popup_contact_form form {
    margin: 0;
}
section.store4.products_page .title_box.flex.items-center {
    padding: 0;
}
section.store5 img {
    width: 100%;
    height: auto;
}
section.store6 {
    background: #C7D4C7;
    border-top: .3rem solid #fff;
    border-bottom: .3rem solid #fff;
    padding: 2.4rem 0;
}

.store6_wrap {
    display: flex;
}

button.btn.contact_cta {
    margin: 0;
    background: #508741;
    color: #fff;
    font-size: .7rem;
    margin-top: 3rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 2rem;
    border: 1px solid #8FB184;
    position: relative;
    overflow: hidden;
}
button.btn.contact_cta::after {
    content: ''; position: absolute; top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transform: skewX(-20deg); pointer-events: none; transition: none;
}
button.btn.contact_cta:hover::after { left: 130%; transition: left 0.55s ease; }
.gallery_thumbs_wrap {
    padding: 0;
}

.gallery_thumbs_wrap .gallery_thumbs_prev {
    left: -1.5rem;
}

.gallery_thumbs_wrap .gallery_thumbs_next {
    right: -1.5rem;
}

.product_detail_stock {
    color: #000000;
    font-weight: 500;
}
@media (min-width: 768px) {
    .store6_wrap.swiper { overflow: visible; }
    .store6_wrap .swiper-wrapper { transform: none !important; display: flex; }
    .store6_wrap .swiper-slide { width: auto !important; flex: 1; }
}

.store6_item {height: 100%;background: #fff;padding: 3.2rem 1rem;scale: 1;transition: .5s all;cursor: pointer;}

.store6_item .icon {
    width: 5rem;
    height: 5rem;
    background: #508741;
    border-radius: 50%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.store6_item .icon img {
    max-width: 60%;
    transition: .5s all;
    transform: rotateY(0deg) scale(1);
}

.store6_item h3 {
    margin: 1.2rem 0;
    color: #0F1610;
    font-size: 1rem;
}

.store6_item:hover {
    scale: .96;
    background: #5087416b;
}

.store6_item:hover .icon img {
    transform: rotateY(360deg) scale(1.5);
}

.store6_item:hover h3,
.store6_item:hover .content {
    color: #fff;
}
section.store7 {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 6rem 0;
    background-attachment: fixed;
}

section.store8 .store8_slider {
    background: #C7D4C7;
    padding: 1.2rem 1rem;
}
section.store8 {
    padding: 1.2rem 0;
}

.store8_item {
    height: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: .6rem;
    overflow: hidden;
    margin: 0 1rem;
    position: relative;
}

.store8_item::after {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.6) 50%, transparent 100%);
    transform: skewX(-20deg);
    transition: none;
    pointer-events: none;
}

.store8_item:hover::after {
    left: 130%;
    transition: left 0.55s ease;
}

.store8_item img {
    max-height: 90%;
    width: auto;
    height: auto;
    max-width: 90%;
    transition: transform .5s ease;
}
.store8_item:hover img { transform: scale(1.1); }

section.store_cert {
    padding: 1.2rem 0;
}

section.store9 {
    padding: 1.2rem 0;
}
.about_template  .heading_title {
    color: #65BF11;
}

.about3_item h3 {
    margin-top: 4rem !important;
}
.about3_dots .swiper-pagination-bullet span {
    color: #65BF11;
    font-size: 1.2rem;
    font-weight: 700;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    padding-bottom: 1rem;
    opacity: 0;
    transition: .5s all;
}

.swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active span {
    opacity: 1;
}
.about4_bg_img {
    position: absolute;
    bottom: -17rem;
    width: 100%;
    z-index: 2;
}

.about4_bg_img img {
    width: 100%;
}
.about4_item:nth-child(even) .box_content {
    left: 8rem;
    position: relative;
}

.about4_item:nth-child(even) .box_content .year {
    margin: 0;
}

.about4_item:nth-child(odd) .box_content {
    position: relative;
    left: -2rem;
}

.about4_item .box_img img {
    max-width: 20rem;
}

.about4_item:last-child .year {
    display: none;
}
a.btn_place_order.btn_login_checkout {
    display: inline-flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    background: #508741;
    font-size: 1rem;
    font-weight: 600;
    color: #fff !important;
    margin: 0;
}

a.btn_place_order.btn_login_checkout span.btn_login_sub {
    font-size: .6rem;
    text-transform: math-auto;
    font-weight: 400;
}
button.btn_place_order.btn_order_checkout {
    font-size: 1rem;
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    line-height: 1.4;
    padding: .9rem;
    margin-bottom: 1.5rem;
}

button.btn_place_order.btn_order_checkout span.btn_order_sub {
    text-transform: initial;
    font-weight: 400;
    font-size: .6rem;
}
.social_btn svg {
    max-height: .9rem;
    width: auto;
}
.avatar_edit svg {
    max-width: 60%;
}
.certificates_gallery .certificates_dots span.swiper-pagination-bullet {
    width: .6rem;
    height: .6rem;
}

.certificates_gallery .certificates_dots span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 1.5rem;
    background: #508741;
}

form.order_search_form button.button_link.btn_submit {
    margin-top: 1rem;
}

.order_search_fields input::placeholder {
    color: #3E6530;
    opacity: .5;
}
.order_result_info.flex-1 {
    flex: 0 0 auto;
}
button.sol_search_toggle {
    margin: 0;
}

button.sol_search_toggle svg {
    width: 1.2rem;
    height: auto;
}
section.solution1 .swiper-pagination span.swiper-pagination-bullet {
    width: .4rem;
    height: .4rem;
}

section.solution1 .swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 1.2rem;
    border-radius: 100px;
    background: #508741;
}

.solution_template  header#header {
    position: fixed;
    width: 100%;
    background: #000000ab;
}
.store_solution_dropdown {
    position: absolute;
    background: #fff;
    width: 100%;
}

.store_solution_wrap {
    position: relative;
}

.store_solution_dropdown a {
    width: 100%;
    display: flex;
    padding: .5rem;
    font-size: 0.8rem;
}

.store_search_btn svg {
    width: .9rem;
    height: auto;
    display: block;
}

.store_hotline_icon svg {
    width: 1.1rem;
    height: auto;
}

.store_user svg {
    width: 1.6rem;
    height: auto;
}

.header_cart_btn svg {
    width: 1rem;
    height: auto;
}
.contact_page {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 6rem 0 3rem;
}

.contact_box {
    color: #3E6530;
    font-weight: 600;
    line-height: 1.8;
}

.box_iframe iframe {
    width: 100%;
    display: block;
    height: 23rem;
}

.contact_page h1.heading_title {
    color: #508741;
    font-family: 'Montserrat', sans-serif;
    font-size: 1.8rem;
    margin-bottom: .8rem;
}

.contact_page .row {
    max-width: 64rem;
}

.contact_items {
    display: flex;
    padding-top: .8rem;
    margin-top: .8rem;
    border-top: 2px solid #3E6530;
    gap: 2.4rem;
}

.contact_item {
    width: 50%;
    color: #3E6530;
    font-weight: 500;
}

.contact_item h3 {
    color: #3E6530;
    font-size: .8rem;
}

.contact_item ul {
    margin: 0;
    list-style: none;
}

.contact_item ul a {
    font-weight: 700;
}

form.contact_form {
    margin: 3rem 0 0;
    max-width: 17rem;
}

.contact_form_row+.contact_form_row {
    margin-top: .5rem;
}

form.contact_form textarea {
    min-height: unset;
    height: 3.8rem;
}

form.contact_form button.contact_form_btn {
    margin: 0;
    background: #65BF11;
    color: #FFFFFF;
    padding: 0 1.2rem;
    min-height: unset;
    height: 1.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact_form_footer {
    align-items: center;
    margin-top: .5rem;
}

span.contact_form_note {
    font-size: .5rem;
    font-style: italic;
    color: #3E6530;
}
.contact_box h3 {
    color: #3E6530;
    font-size: 1rem;
}
.vat_close svg {
    width: .6rem;
    height: auto;
}

.vat_field input::placeholder {
    color: #8FB184;
}
.store_popup_close path {
    stroke: #919191;
}
.ck_coupon_left_val:before {
    border: none;
    border-right: 2px dashed var(--coupon-bg, #c8c0b6);
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

.coupon_popup_col {
    padding: 0 1.2rem;
}

.coupon_popup_col+.coupon_popup_col {
    border-left: 6px solid #D9D9D9;
}
.ck_coupon_list {
    max-height: 18rem;
    overflow: auto;
    padding-right: .5rem;
}
.ck_coupon_list::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}

.ck_coupon_list::-webkit-scrollbar {
    width: 0.217rem;
    background-color: #cedbff;
}
.ck_coupon_list::-webkit-scrollbar-thumb {
    background-color: #508741;
}
span.save {
    position: absolute;
    background: #FFF5E6;
    font-size: .4rem;
    font-weight: 700;
    right: .8rem;
    bottom: .6rem;
    padding: .2rem;
    color: var(--coupon-bg, #c8c0b6);
    cursor: pointer;
    transition: .5s all;
    border-radius: 0;
}
span.save.saved {
    background: #65BF11;
    color: #fff;
    font-size: .6rem;
    padding: .15rem .3rem;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ck_coupon_right { position: relative; overflow: hidden; }

.slider_coupon {
    margin: 0 -.4rem 0;
    position: relative;
}
section.store3 {
    padding-top: 1.35rem;
}
.slider_coupon .arrow_slider {
    box-shadow: none;
    background: transparent;
    left: -1.5rem;
}
.slider_coupon .arrow_slider.hotdeal_next {
    left: unset;
    right: -1.5rem;
}
.slider_coupon .arrow_slider path {
    fill: #8FB184 !important;
}

.slider_coupon .ck_coupon_card {
    border: none;
}

.slider_coupon .ck_coupon_subdesc {
    font-size: .35rem;
}

.slider_coupon  .ck_coupon_expire {
    font-size: .35rem;
}
.search_suggest_product_item:hover .search_suggest_product_img img {
    scale: 1.1;
}
.checkout_template .store_cart_wrap {
    opacity: 0;
}
section.catalogue_page {
    background-color: #508741;
    padding: 3rem 0;
    background-size: 100% auto !important;
}
section.catalogue_page:before {
    content: '';
    height: 50%;
    width: 100%;
    background: #508741;
    bottom: 0;
    top: unset;
}
.stf__block{
    background: #fff;
}
/* =========================================================
   RESPONSIVE — @media queries
   ========================================================= */

@media (max-width: 900px) {
  /* .sol_header_extras (cờ ngôn ngữ/search/hamburger) giờ nằm TRONG .sol_nav_right nên không thể ẩn
     cả .sol_nav_right — chỉ ẩn các mục menu (.sol_nav_item_wrap), giữ lại extras. .sol_nav_left không
     chứa extras nên ẩn hẳn như cũ. */
  .sol_nav_left { display: none; }
  .sol_nav_right { width: 100%; padding: 0; justify-content: flex-end; }
  .sol_nav_right .sol_nav_item_wrap { display: none; }
  .sol_logo img { height: 1.6rem; }
}

@media (max-width: 900px) { .product_grid { grid-template-columns: repeat(3, 1fr); } }

@media (max-width: 600px) { .product_grid { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 768px) { .news_grid { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 480px) { .news_grid { grid-template-columns: 1fr; } }




@media (max-width: 768px) {
  .slc_inner {gap: 2rem;}
  .slc_img_col, .slc_text_col { max-width: 100%; flex: unset; }
  .slc_watermark { font-size: 5rem; right: 0; }
  .slc_name { font-size: 2rem; }
  .service_list_title { font-size: 1.6rem; }
}

@media (max-width: 1199px) {
    html {
    font-size: 1.3vw;
    }

    section.about4 {
        padding-bottom: 13rem;
    }
}

@media (max-width: 850px) {
    .about4_item .box_img img {
        max-width: 15rem;
    }
}

/* ── Hamburger button ──────────────────────────────────────────── */
.store_hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 2.2rem;
  height: 2.2rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  margin-left: 0.6rem;
  flex-shrink: 0;
}
.store_hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform-origin: center;
}
.store_hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.store_hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.store_hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.sol_hamburger { display: none; }

/* ── Mobile backdrop ───────────────────────────────────────────── */
.store_mobile_backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 9998;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.store_mobile_backdrop.open {
  opacity: 1;
  pointer-events: all;
}

/* ── Mobile drawer ─────────────────────────────────────────────── */
.store_mobile_menu {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 280px;
  max-width: 85vw;
  background: #fff;
  z-index: 9999;
  transform: translateX(100%);
  transition: transform 0.32s cubic-bezier(0.4,0,0.2,1);
  overflow-y: auto;
  box-shadow: -4px 0 24px rgba(0,0,0,0.15);
}
.store_mobile_menu.open { transform: translateX(0); }
.store_mobile_menu_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.2rem;
  background: #3E6530;
}
.store_mobile_logo { height: 2rem; object-fit: contain; }
.store_mobile_close {
  background: none;
  border: none;
  cursor: pointer;
  color: #fff;
  padding: 0.3rem;
  display: flex;
  align-items: center;
  opacity: 0.8;
  transition: opacity 0.2s;
  margin: 0;
}
.store_mobile_close:hover { opacity: 1; }
.store_mobile_nav_list { list-style: none; margin: 0; padding: 0.5rem 0; }
.store_mobile_nav_item {border-bottom: 1px solid #f0f0f0;margin: 0;}
.store_mobile_nav_link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.85rem 1.2rem;
  font-size: 0.9rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #2d2d2d;
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  transition: color 0.2s, background 0.2s;
  margin: 0;
}
.store_mobile_nav_link:hover,
.store_mobile_nav_link.active { color: #3E6530; background: #f6faf3; }
.store_mobile_arrow {
  flex-shrink: 0;
  transition: transform 0.25s ease;
}
.store_mobile_nav_link.active .store_mobile_arrow { transform: rotate(180deg); }
.store_mobile_sub {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.store_mobile_sub.open { max-height: 500px; }
.store_mobile_sub_link {
  display: block;
  padding: 0.7rem 1.2rem 0.7rem 2rem;
  font-size: 0.9rem;
  color: #555;
  text-decoration: none;
  transition: color 0.2s;
}
.store_mobile_sub_link:hover { color: #3E6530; }

@media (max-width: 767px) {
    html {
    font-size: 3.5vw;
}

.about1_img {
    margin-bottom: -5rem;
}

section.about2 {
    padding-top: 8rem;
}
.about2 .row:first-child {
    padding: 0;
}
.about2_items.flex {
    flex-direction: column;
    margin: 2rem 0;
}

.about2_logo {
    width: 100%;
    padding: 0;
    border: none !important;
}

.about2_logo+.about2_logo {
    margin-top: 3rem;
}

section.about3 .wrap_slider {
    padding: 0 15px;
}

.about3_cn .item {
    height: 8rem;
}
.about4_box svg {
    display: none;
}

.about4_bg_img {
    bottom: -5rem;
}

section.about4 {
    background-position: unset;
    padding-bottom: 8rem;
}

.about4_items {
    position: unset;
    transform: unset;
    padding: 2rem 0;
}

.swiper-slide.about4_item {
    display: block;
    margin-top: 0;
}

.about4_item .box_content {
    left: unset !important;
    right: unset !important;
    width: 100%;
    text-align: center;
}

.about4_item .year {
    margin: 0 auto 1rem !important;
}

.about4_item .content {
    font-size: .9rem;
}

.about4_item .box_img {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-top: 2rem;
}

.about4_item .box_img img {
    max-width: 100%;
}
.story_item {
    flex-direction: column !important;
}

.story_items {
    padding: 0 10px;
}

.story_item .box_content {
    position: unset;
    width: 100%;
    padding: 1.5rem;
}

.story_item .box_img {
    width: 100%;
}

.story_page {
    padding-bottom: 2rem;
}
.core_bottom {
    background-size: cover;
    padding-top: 3rem;
}

.core_page_content {
    padding: 2rem;
}

.core_bottom2 {
    padding: 2rem 0;
}

.core_page_content::before,.core_page_content::after {
    display: none;
}

.core_item .content {
    font-size: .9rem;
}
.distribution4_wrap.flex.items-center {
    flex-direction: column;
}

.distribution4_img {
    width: 100%;
}

.distribution4_img img {
    max-width: 100%;
    margin-top: 1rem;
}

section.distribution4 {
    font-weight: 500;
}

h2.distribution5_title span {
    font-size: 3rem;
    margin-left: -3rem;
}

h2.distribution5_title {
    padding-left: 3rem;
}

section.distribution5 .text-center {
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}
section.team_page .story_page_top .row {
    padding: 0;
}

.team_philosophy_wrap {
    flex-direction: column;
}

.team_philosophy_img {
    width: 100%;
}

.team_philosophy_img:before {
    width: 4rem;
}

.team_philosophy_content {
    width: 100%;
    padding-top: 2rem;
}

section.team_philosophy {
    padding: 2rem 0;
}

p.team_philosophy_sub {
    margin-left: 2rem;
}

h2.team_cta_title span {
    font-size: 3rem;
    left: -1rem;
    top: -1rem;
}

.team_cta_title {
    font-size: 1.7rem;
}
.materialZone_item {
    flex-direction: column;
    gap: 1rem;
}

.materialZone_item .box_content {
    width: 100%;
    margin: 0 !important;
}

.materialZone_item .box_img {
    width: 100%;
}

@media (max-width: 767px) {
    .materialZone_item:before {
        border-radius: 0 !important;
    }
}

section.partner_page .row {padding: 0;}

.partner2_wrap {
    flex-direction: column;
}

.partner2_img {
    width: 100%;
}

.partner3_title {
    flex-direction: column;
}
.sustainable1_bg h1.title_page {
    font-size: 2rem;
}

.sustainable1_bg {
    padding: 2rem 0 6rem;
}

.sustainable2_box {
    margin-top: -4rem;
}

section.sustainable3 {
    background-size: cover;
}

section.sustainable4 {
    padding-top: 3rem;
}
.sustainable5_items {
    display: block;
}
.slc_inner {
    flex-direction: column !important;
}

.slc_img_col, .slc_text_col {
    width: 100%;
}
.sc_l1_desc {
    font-size: .9rem;
}

.sc_l1_stat span {
    font-size: .8rem;
}

.sc_l1_child_section {
    background-size: cover;
}

.sc_l1_child_section:before {
    opacity: 0;
}
.sc_l1_child_overlay {
    background: #00000040;
}

.sc_l1_child_desc.wysiwyg {
    font-size: .9rem;
}
.service_cat_grid {
    grid-template-columns: repeat(2, 1fr);
}

.service_cat_description {
    padding: 0;
    font-size: 1rem;
}
.service_short_desc {
    font-size: .8rem;
}

.service_detail_content .tab_content {
    padding: 1rem 0 !important;
    font-size: .9rem;
}

.service_detail_content .tabs_head .tab_item {
    font-size: 1rem;
}

section.product_related.service_related .row,
.service_recently_viewed .row {
    padding: 0;
}
.service_specs {
    font-size: .9rem;
}
.popup_contact_wrap {
    flex-direction: column;
}

.popup_contact_form input, .popup_contact_form textarea {
    font-size: .9rem;
}

.popup_contact_img {width: 71%;padding: 1rem;}
section.recruitment1 {padding: .5rem;}

.recruitment_filter {
    flex-direction: column;
}

.recruitment_filter input[type="text"], .custom_select_trigger {
    width: 100%;
    font-size: .9rem;
    height: 2.8rem;
}

button.filter_btn {width: 100%;height: 2.8rem;}

.recruitment_tab_content {
    margin: 0;
}

.recruitment_item {
    width: calc(calc(100% ) - 1.4rem);
    align-items: flex-start;
}

.recruitment_item_img {
    flex: 0 0 auto;
}

button.filter_btn svg {
    width: 1.3rem;
}

.swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 3.3rem;
}
.recruitment_detail_head {
    flex-direction: column;
    align-items: flex-start;
}

.recruitment_detail_meta {
    font-size: .9rem;
    flex-direction: column;
    gap: .4rem;
}

.recruitment_detail_title {
    width: 100%;
}

.recruitment_detail_head button.button_link {
    width: 100%;
    justify-content: center;
    margin: 1rem 0 0 0;
}

.recruitment_detail_wrap.flex {
    flex-direction: column;
    padding: 2rem;
}

.recruitment_detail_sidebar {
    width: 100%;
    margin: 2rem 0 0;
}

.contact_row {
    font-size: .8rem;
}

.sidebar_contact p {
    font-size: .8rem;
}
.solution1_slider {
    height: 14rem;
}

.solution2_wrap {
    padding: 0;
    flex-direction: column;
}

.solution2_wrap .left {
    width: 100%;
}

.solution2_wrap .right {
    width: 100%;
}

.solution2_img img {
    width: 100%;
}

.solution3_for_item .inner {
    flex-direction: column;
    gap: 1rem;
}

section.solution3 .row {
    padding: 0;
}

.solution3_for_item .box_content {
    width: 100%;
}

.solution3_img {
    width: 100%;
    height: 10rem;
    justify-content: center;
}

.solution3_img img {
    max-width: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

section.solution4 .row {
    padding: 0;
}

.solution4_wrap {
    flex-direction: column;
    gap: 1.5rem;
}

.solution4_wrap .left, .solution4_wrap .right {
    width: 100%;
}

.solution4_item .content {
    font-size: .9rem;
}

.solution4_item .icon {
    width: 3rem;
    height: 3rem;
}

.solution4_item h3 {
    font-size: 1.2rem;
}

.solution4_wrap .right .solution4_item .wrap_title {
    flex-direction: unset;
    text-align: left;
}

.solution4_wrap .right .solution4_item .content {
    text-align: left;
}

.solution4_wrap .center {
    order: -1;
}

.solution4_list {
    gap: 1.5rem;
}

.solution5_box_inner .left {
    width: 100%;
}

.solution5_box_inner {
    flex-direction: column;
    gap: 2rem;
}

.solution5_box_inner .right {
    width: 100%;
}

.solution5_item .content {
    font-size: .8rem;
}

section.about2 {
    padding-top: 6rem;
}

section.solution7 .blog_wrap .item_post:first-child {
    width: 100%;
    margin: 0 0 1rem;
}

section.solution7 .blog_wrap .item_post {
    width: 100%;
    height: 19rem;
}

.item_post .box_content h3 {
    font-size: 1rem;
}

.item_post:nth-child(1) .box_content .content {
    font-size: .9rem;
}

.solution3_nav {
    flex-wrap: wrap;
}

.solution3_nav .item {
    width: 50%;
}
.store1_wrap {
    flex-direction: column;
}

.store1_wrap_left {
    width: 100%;
}

.store1_slider_item {
    height: auto;
}

.store1_slider_item img {
    width: 100%;
}

.store1_slider .store1_dots {
    bottom: 1rem;
}

.store1_wrap_right {
    width: 100%;
}

.store1_img {
    flex-direction: unset;
}

.store1_wrap_right .item_img img {
    height: 9rem;
    width: 100%;
}

.store1_img .item_img {
    width: 100%;
}

.store2_item {
    flex-direction: column;
    text-align: center;
    background: #5087413d;
    padding: 1rem;
    border-radius: .4rem;
    min-height: 12rem;
}


.products_page .product_wrap {
    flex-direction: column;
}

.products_page .product_sidebar,
.prodcat_page .product_sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 80vw;
    max-width: 300px;
    background: #fff;
    z-index: 9997;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
    padding: 1rem 0 2rem;
    box-shadow: 4px 0 20px rgba(0,0,0,0.15);
}
.products_page .product_sidebar.open,
.prodcat_page .product_sidebar.open {
    transform: translateX(0);
}

.products_page .wrap_product_box {
    width: 100%;
}

.product_breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.7rem;
    color: #c4c4c4;
    margin-bottom: 1rem;
}
.product_breadcrumb a { color: inherit; transition: color 0.15s; }
.product_breadcrumb a:hover { color: #508741; }
.product_breadcrumb .sep { color: #c4c4c4; }

section.store7 {
    padding: 2rem 0;
}
.store6_item {
    width: 100%;
}
section.store4.products_page {
    padding-bottom: 2rem;
}
section.store4.products_page .title_box.flex.items-center {
    padding: 1rem !important;
}
.product_grid_wrap {
    padding: .5rem;
}
.products_page .product_sidebar,
.prodcat_page .product_sidebar {
    width: 80vw;
}
/* Store page: sidebar luôn hiện, không dùng fixed/slide */
@media (max-width: 767px) {
    .store_template .products_page .product_sidebar {
        position: static;
        transform: none;
        width: 100%;
        max-width: none;
        box-shadow: none;
        padding: 0;
        overflow-y: visible;
        margin-bottom: 1rem;
        z-index: 1;
    }
}
.product_detail_wrap {
    flex-direction: column;
}

.product_detail_gallery {
    width: 100%;
}

.product_detail_info {
    flex: unset;
    width: 100%;
}

.product_quick_info li {
    font-size: .9rem;
}

.coupons_label {
    font-size: .9rem;
}

.product_detail_actions button {
    height: 2.5rem;
    font-size: .9rem;
    padding: 0 .5rem;
}

.tab_content {
    font-size: .9rem;
}

.tab_nav_item {
    font-size: 1rem;
    padding: .8rem 1rem;
}
.pd_extra_header em {
    font-size: .9rem;
}

.pd_extra_header span, .pd_extra_header span {
    font-size: .9rem;
}

.pd_extra_name {
    font-size: .9rem;
}
.minicart_child_item .minicart_item_name {
    font-size: .9rem;
}

.minicart_child_item .minicart_item_price {
    font-size: .8rem;
}

.minicart_head {
    padding: 1rem 2rem;
}

.minicart_body {
    padding: 0 .5rem 0 2rem;
    margin-right: 2rem;
}
.checkout_wrap {
    flex-direction: column;
}

.checkout_summary_wrap {
    width: 100%;
}

.summary_header h2 {
    font-size: 1.1rem;
}

.summary_back_link {
    font-size: .8rem;
}

.gift_milestone_title {
    font-size: .9rem;
}

.gift_milestone_arrow svg {
    height: 1rem;
    width: auto;
}

.checkout_note_input {
    font-size: .9rem;
}

.vat_invoice_btn {
    font-size: .8rem;
}
.checkout_wrap {
    flex-direction: column;
}

.checkout_summary_wrap {
    width: 100%;
}

.summary_header h2 {
    font-size: 1.1rem;
}

.summary_back_link {
    font-size: .8rem;
}

.gift_milestone_title {
    font-size: .9rem;
}

.gift_milestone_arrow svg {
    height: 1rem;
    width: auto;
}

.checkout_note_input {
    font-size: .9rem;
}

.vat_invoice_btn {
    font-size: .8rem;
}
.auth_wrap {
    flex-direction: column;
}

.auth_wrap {
    width: 100%;
}

.auth_left {
    width: 100%;
    display: none;
}

.auth_right {
    width: 100%;
}
.account_wrap {
    flex-direction: column;
}

.account_sidebar {
    width: 100%;
    padding: 1rem;
}

.account_menu_item {
    width: calc(25%);
    flex-direction: column;
    margin: 0;
    text-align: center;
    font-weight: 500;
    font-size: .6rem;
    border: none;
}

.account_menu {
    flex-direction: unset;
}

.account_content {
    padding: 0;
    flex: unset;
    width: 100%;
}
.blog_wrap .item_post:first-child {
    width: 100%;
    height: 15.4rem;
}

.item_post {
    width: 100%;
    height: 15rem;
}

.post_item {
    width: calc(50% - 1.2rem);
}
.certificates_banner {
    padding: 2rem 0 5rem;
}

.certificates_wrap {
    flex-direction: column;
    gap: 2rem;
}
.certificates_box {
    padding: 3rem 3.5rem 1rem;
}
.order_result_title,
.order_search_title {
    font-size: 1.6rem;
}
.order_search_page {
    padding: 3rem 0;
}
.contact_page {
    padding: 3rem 0;
}

.contact_form input, .contact_form textarea {
    height: 2.4rem;
    font-size: 1rem;
}

form.contact_form {
    max-width: 100%;
    margin-top: 1rem;
}

form.contact_form button.contact_form_btn {
    height: 2.4rem;
}

.box_iframe {
    margin-top: 2rem;
}
.thankyou_wrap {
    flex-direction: column;
}

.thankyou_right {
    flex: unset;
    width: 100%;
}

.checkout_summary_box {
    padding: 1rem;
}

.summary_group_children {
    margin-left: 1rem;
}

.summary_item_name {
    width: 7rem;
    font-size: .8rem;
}

.summary_item_qty_col {
    width: 2rem;
}

.summary_item_img {
    width: 3.5rem;
    height: 3.5rem;
}

.summary_item_qty_col {
    display: none;
}

.summary_item_total {
    font-size: .8rem;
}

.summary_child_item .summary_item_name {
    font-size: .8rem;
}

.thankyou_actions.flex a {
    padding: .5rem .6rem;
}
.store_solution_btn {
    display: none;
}

.store_hotline_text {
    display: none;
}

.store_user_text {
    display: none;
}
.slider_coupon .ck_coupon_subdesc {
    font-size: .6rem;
}

.slider_coupon .ck_coupon_expire {
    font-size: .5rem;
}

span.save {
    display: none;
}

.slider_coupon {
    margin-top: 0;
}
.slider_coupon .arrow_slider { display: none; }
.sc_l1_swiper_wrap .arrow_slider { display: none; }
.pd_extra_slider_wrap .arrow_slider { display: none; }
.store_header_nav { display: none; }
.store_hamburger { display: flex; }
.sol_hamburger { display: flex; }
.store_mobile_backdrop { display: block; }
.store_mobile_menu { display: block; }
.sol_nav_left { display: none; }
.sol_nav_right { width: 100%; padding: 0; justify-content: flex-end; }
.sol_nav_right .sol_nav_item_wrap { display: none; }
.store_hamburger{
    margin: 0;
}
.store_header_top_inner {
    gap: 1rem;
}
.search_suggest_kw:hover {
    background: #3E6530;
    border-color: #3E6530;
}
.footer_logo_wrap {
    flex: unset;
    width: 100%;
}

.footer_company {
    font-size: .8rem;
    line-height: 1.;
}

.footer_company_name {
    font-size: 1rem;
}

.footer_company p {
    line-height: 1.8;
}

.footer_col_title {
    font-size: 1rem;
    margin-bottom: .8rem;
}

.footer_policy a {
    font-size: .8rem;
    transition: color 0.2s;
}

.footer_policy a:hover {
    color: #7dbf5a;
}

.footer_policy li {
    margin-bottom: .6rem;
}

.footer_depts {
    margin: 0;
}

.footer_depts_inner {
    padding: 0;
}

.footer_dept_name {
    font-size: 1rem;
}

.footer_dept_info {
    font-size: .8rem;
}

.footer_dept {
    padding: 0;
    width: 50%;
}

.footer_copyright p {
    font-size: .8rem;
}

/* mobile filter button */
.mobile_filter_btn {
    display: none;
}
@media (max-width: 767px) {
.mobile_filter_btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    position: fixed;
    margin: 0;
    bottom: 17rem;
    right: 1rem;
    z-index: 9996;
    background: #3E6530;
    color: #fff;
    border: none;
    border-radius: 2rem;
    padding: 0.6rem 1rem;
    font-size: 0.6rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(62,101,48,0.35);
    gap: 0.3rem;
    transition: background 0.2s, transform 0.2s;
}
.mobile_filter_btn:active { transform: scale(0.94); }
.mobile_filter_btn svg { display: block; }
}
.mobile_filter_backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 9996;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}
.mobile_filter_backdrop.open {
    display: block;
    opacity: 1;
    pointer-events: all;
}
body.sidebar_lock { overflow: hidden; }

/* product_tax mobile toggle */
.product_tax > b {
    cursor: pointer;
    user-select: none;
    justify-content: space-between;
}
.product_tax > b::after {
    content: "";
    display: inline-block;
    width: 0.45rem;
    height: 0.45rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.25s ease;
    flex-shrink: 0;
    margin-left: 0.5rem;
    margin-bottom: 2px;
}
.product_tax.open > b::after {
    transform: rotate(-135deg);
}
.product_tax ul {
    display: none;
}
.product_tax.open ul {
    display: block;
}
.products_page .product_sidebar .product_tax > b, .filter_group h3 {
    height: 3rem;
}
.product_sidebar {
    padding: 1rem !important;
}

.dual_range_wrap .range_labels {
    font-size: .7rem;
}

.dual_range_wrap .range_limits {
    font-size: .7rem;
}
.sol_header_extras {
    width: 100%;
    justify-content: space-between;
}

button.sol_search_toggle svg {
    width: 2rem;
}

.sol_logo img {
    height: 2.6rem;
}

section.store4.products_page.hotdeal_page .product_sidebar {
    padding: 0 !important;
}

.product_sidebar {
}
}

/* ── Store Popup ──────────────────────────────────────────────────────────── */
@keyframes storePopupIn {
  from { opacity: 0; transform: scale(0.88); }
  to   { opacity: 1; transform: scale(1); }
}

.store_popup_overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: fadeIn .3s ease;
}

.store_popup_box {
    position: relative;
    max-width: 36rem;
    width: 100%;
    animation: storePopupIn .4s cubic-bezier(.22,.68,0,1.2) forwards;
}

.store_popup_img {
    width: 100%;
    display: block;
}

.store_popup_close {
    position: absolute;
    top: .5rem;
    right: .5rem;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: #F4F4F4;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    transition: background .2s;
    margin: 0;
    padding: 0;
}

.store_popup_close:hover { background: rgba(0,0,0,0.8); }

/* ── Social Proof Notifications ─────────────────────────────────────────── */
.social_proof_wrap {
    position: fixed;
    bottom: 1.5rem;
    left: 1.5rem;
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}
.social_proof_item {
    CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;
    background: #fff;
    border-radius: 0.6rem;
    box-shadow: 0 4px 24px rgba(0,0,0,.14);
    border: 1px solid #65BF11;
    border-radius: 0;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: .4rem;
    min-width: 16rem;
    pointer-events: all;
    position: relative;
    animation: spSlideIn .35s cubic-bezier(.22,.68,0,1.2);
    padding-right: 2rem;
}
@keyframes spSlideIn {
    from { transform: translateX(-110%); opacity: 0; }
    to   { transform: translateX(0);     opacity: 1; }
}
.sp_img {
    width: 3.5rem;
    height: 3.5rem;
    object-fit: cover;
    border-radius: 0.25rem;
    flex-shrink: 0;
    border: 1px solid  #A3C02D;
}
.sp_img_placeholder {
    width: 3.5rem;
    height: 3.5rem;
    background: #f5f5f5;
    border-radius: 0.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.sp_content { flex: 1; min-width: 0; }
.sp_name {
    font-size: 0.65rem;
    font-weight: 600;
    color: #222;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sp_time {
    font-size: 0.6rem;
    color: #888;
    margin-top: 0.2rem;
}
.sp_time b { color: #3E6530; }
.sp_close {
    position: absolute;
    top: 0;
    right: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    color: #aaa;
    line-height: 1;
    padding: 0;
    margin: 0;
    min-height: unset;
    padding: .4rem;
}
.sp_close:hover { color: #333; }

/* ── Mini Cart Redesign ─────────────────────────────────────────────────── */
.minicart_drawer {
    position: fixed;
    top: 0;
    transform: translateX(100%);
    width: 39rem;
    max-width: 95vw;
    height: 100vh;
    background: #fff;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    transition: right .3s cubic-bezier(.22,.68,0,1.1);
    box-shadow: -4px 0 30px rgba(0,0,0,.12);
}
.minicart_drawer.open {right: 0;transform: translateX(0%);}
.minicart_overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 9998;
}
.mc_head {
    padding: 1.2rem 1.2rem 1rem;
    border-bottom: 1px solid #eee;
    flex-shrink: 0;
}
.mc_title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #222;
}
.mc_count { color: #888; font-weight: 400; font-size: 0.95rem; }
.mc_close_btn {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1.5px solid #ddd;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #555;
    flex-shrink: 0;
    transition: background .15s, color .15s;
}
.mc_close_btn:hover { background: #f0f0f0; }
.mc_body {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem 0;
}
.mc_empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: #bbb;
    gap: 0.75rem;
    font-size: 0.8rem;
}
.mc_row {
    border-bottom: 1px solid #f0f0f0;
    padding: 0.75rem 1rem;
}
.mc_row:last-child { border-bottom: none; }
.mc_item {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    position: relative;
}
.mc_item_child { padding-left: 2.4rem; margin-top: 0.5rem; }
/* Checkbox circle */
.mc_check {
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 50%;
    border: 3px solid #ccc;
    background: #fff;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    margin: 0;
    padding: 0;
    min-height: unset;
}
.mc_check.mc_check_on {
    background: #3E6530;
    border-color: #3E6530;
}
.mc_check_spacer {
    width: 1.4rem;
    flex-shrink: 0;
}
/* Image */
.mc_img {
    width: 3.8rem;
    height: 3.8rem;
    border-radius: 0.4rem;
    overflow: hidden;
    flex-shrink: 0;
    background: #f8f8f8;
}
.mc_img img { width: 100%; height: 100%; object-fit: cover; }
.mc_img_empty { width: 100%; height: 100%; }
/* Info */
.mc_info { flex: 1; min-width: 0; }
.mc_name {
    font-size: 0.7rem;
    font-weight: 600;
    color: #222;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-decoration: none;
}
.mc_name:hover { color: #3E6530; }
.mc_unit {
    font-size: 0.6rem;
    color: #888;
    margin-top: 0.15rem;
}
.mc_price_row {
    margin-top: 0.2rem;
    gap: 0.4rem;
    flex-wrap: wrap;
}
.mc_price_sale {
    font-size: 0.7rem;
    font-weight: 700;
    color: #E53030;
}
.mc_price_orig {
    font-size: 0.6rem;
    color: #aaa;
    text-decoration: line-through;
}
.mc_qty_row {
    margin-top: 0.35rem;
    gap: 0;
}
.mc_qty_btn {
    width: 1.4rem;
    height: 1.4rem;
    border: 1px solid #ddd;
    background: #fff;
    font-size: 0.75rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
    border-radius: 0.2rem;
}
.mc_qty_btn:hover { background: #f0f0f0; }
.mc_qty_val {
    font-size: 0.7rem;
    font-weight: 600;
    min-width: 1.4rem;
    text-align: center;
}
/* Delete button */
.mc_del {
    background: none;
    border: none;
    color: #bbb;
    cursor: pointer;
    padding: 0.1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
    transition: color .15s;
}
.mc_del:hover { color: #E53030; }
/* Group label */
.mc_group_label {
    font-size: 0.55rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 700;
    padding: 0.2rem 0.4rem;
    border-radius: 0.2rem;
    display: inline-block;
    margin-bottom: 0.3rem;
}
.mc_label_upsell { background: #e8f5e9; color: #3E6530; }
.mc_label_gift   { background: #fff3e0; color: #e65100; }
/* Terms */
.mc_terms {
    padding: 0.75rem 3rem;
    border-top: 1px solid #eee;
    flex-shrink: 0;
}
.mc_terms_label {
    gap: 0.6rem;
    cursor: pointer;
    font-size: 0.65rem;
    color: #555;
    line-height: 1.5;
}
.mc_terms_check {
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 50%;
    border: 1px solid #ccc;
    background: #fff;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    margin: 0;
    padding: 0;
    min-height: unset;
}
.mc_terms_check.mc_terms_check_on {
    background: #3E6530;
    border-color: #3E6530;
}
.mc_terms_link { color: #E53030; text-decoration: none; font-weight: 600; }
.mc_terms_link:hover { text-decoration: underline; }
/* Footer */
.mc_foot {
    padding: 0.8rem 1rem 1.2rem;
    border-top: 1px solid #eee;
    flex-shrink: 0;
}
.mc_total_row { margin-bottom: 0.75rem; }
.mc_total_label { font-size: 0.75rem; color: #555; }
.mc_total_prices { gap: 0.5rem; }
.mc_total_orig {
    font-size: 0.7rem;
    color: #aaa;
    text-decoration: line-through;
}
.mc_total_val {
    font-size: 1.1rem;
    font-weight: 800;
    color: #E53030;
}
.mc_checkout_btn {
    display: block;
    width: 100%;
    padding: 0.9rem;
    background: #3E6530;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: .08em;
    border: none;
    border-radius: 0.4rem;
    cursor: pointer;
    transition: background .2s, opacity .2s;
}
.mc_checkout_btn:hover:not(:disabled) { background: #2d4d22; }
.mc_checkout_btn:disabled { opacity: .5; cursor: not-allowed; }

/* about4_items: PC không dùng Swiper → reset wrapper/slide */
@media (min-width: 768px) {
    .about4_items .swiper-wrapper { display: block; transform: none !important; }
    .about4_items .swiper-slide   { width: 100% !important; }
    button.mobile_filter_btn {
        display: none !important;
    }
}

/* minicart_checkout as button (disabled state) */
.minicart_checkout:disabled { opacity: .5; cursor: not-allowed; }
.minicart_checkout { cursor: pointer; border: none; }

@media (max-width: 767px) {
    .social_proof_wrap { left: 0.75rem; bottom: 0.75rem; }
    .social_proof_item { min-width: 14rem; max-width: calc(100vw - 1.5rem); }
    .minicart_drawer { width: 100vw; max-width: 100vw; }

    /* intro_page mobile */
    .intro_page_link li { width: 100%; }
    .intro_page_link a { width: 100%; }
    .intro_page_link li a { font-size: 1rem; width: 100%; }
    .intro_page_title { font-size: 2rem; }
}

/* ══════════════════════════════════════════
   HOVER SHINE EFFECTS
══════════════════════════════════════════ */
.minicart_checkout, .coupon_apply_btn, .vat_invoice_btn,
button.btn_place_order.btn_order_checkout, a.btn_place_order.btn_login_checkout {
    position: relative; overflow: hidden;
}
.minicart_checkout::after, .coupon_apply_btn::after, .vat_invoice_btn::after,
button.btn_place_order.btn_order_checkout::after, a.btn_place_order.btn_login_checkout::after {
    content: ''; position: absolute; top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transform: skewX(-20deg); pointer-events: none; transition: none;
}
.minicart_checkout:hover::after, .coupon_apply_btn:hover::after, .vat_invoice_btn:hover::after,
button.btn_place_order.btn_order_checkout:hover::after, a.btn_place_order.btn_login_checkout:hover::after {
    left: 130%; transition: left 0.55s ease;
}

/* coupon_browse_row hover */
.coupon_browse_row { transition: background 0.2s, border-color 0.2s, color 0.2s; }
.coupon_browse_row:hover { background: #508741; border-color: #508741; color: #fff; }
.coupon_browse_row:hover path { stroke: #fff; }
.coupon_browse_row span { transition: .5s all; }
.coupon_browse_row:hover span { color: #fff; }
.coupon_browse_left svg path { transition: .5s all; }

/* item_logo shine on hover */
.item_logo { position: relative; overflow: hidden; }
.item_logo::after { content: ''; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.65) 50%, transparent 100%); transform: skewX(-20deg); pointer-events: none; transition: none; }
.item_logo:hover::after { left: 130%; transition: left 0.55s ease; }

/* team_philosophy_item: xoay icon khi hover */
.team_philosophy_item .item_icon { transition: transform 0.5s ease; }
.team_philosophy_item:hover .item_icon { transform: rotate(360deg); }

@media (max-width: 767px) {
    .contact_solution_wrap { flex-direction: column; }
    .contact_solution_left { width: 100%; padding: 0; }
    .contact_solution_right { width: 100%; }
    .contact_form { max-width: 100%; }
    .contact_solution { padding: 5rem 0; }
    .checkout_wrap .summary_header h2 { font-size: 1.2rem; }
    .coupon_popup_body { display: block; max-height: 60vh; overflow: auto; }
    .ck_coupon_list { max-height: unset; }
    .production_box { padding: 1.5rem; }
    .production_box3_wrap { flex-direction: column; }
    .production_box3_logo { width: 100%; }
    .production_box4 { flex-direction: column; gap: 2rem; }
    .production_form input, .production_form select { font-size: .9rem; height: 2.6rem; }
    .store6_wrap { display: block; }
    .ctrl_arrow { background: #fff; width: 2rem; height: 2rem; border-radius: 100px; display: flex; justify-content: center; }
    .ctrl_arrow svg { width: .6rem; }
    .swiper-pagination span.swiper-pagination-bullet { width: .5rem; height: .5rem; background: #50874199; }
    .swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active { width: 2rem; }
    .minicart_item_del { width: 1.5rem; height: 1.5rem; min-height: unset; margin: 0; border-radius: 100px; background: #3E6530; display: flex; align-items: center; justify-content: center; }
    .minicart_item_name { padding-right: 2rem; }
}

.store2_controls { display: none; }
.coupon_controls { display: none; }
.store6_controls { display: none; }
.store8_controls { display: none; }
.posts_controls { display: none; }
.cert_controls { display: none; }
.a2_controls { display: none; }
.partner2_ctrl_controls { display: none; }
.product_slider_controls { display: none; }
/* ctrl_arrow: class chung cho prev/next trong slider controls box */
.ctrl_arrow { cursor: pointer; padding: .3rem; flex-shrink: 0; }

/* ─── Fixed Contact Buttons ─── */
.fixed_contact {
    position: fixed;
    right: .5rem;
    bottom: 40%;
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: .7rem;
    align-items: center;
}
.fixed_contact:before {
    content: '';
    position: absolute;
    top: -1.5rem;
    bottom: -1.5rem;
    background: #C7D4C7;
    width: 4rem;
    border-radius: 100px;
    right: 0;
    transform: translateX(50%);
}
.fixed_contact_btn {
    position: relative;
    display: block;
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0,0,0,.18);
    transition: transform .2s, box-shadow .2s;
    flex-shrink: 0;
}
.fixed_contact_btn:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 22px rgba(0,0,0,.26);
}
.fixed_contact_btn img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
@media (max-width: 767px) {
    .fixed_contact { right: .8rem; bottom: 12rem; gap: .55rem; }
    .fixed_contact_btn { width: 2.8rem; height: 2.8rem; }
}

/* ─── Popup Voucher (góc phải dưới màn hình) ─── */
/* Canh bottom cao hơn 1 chút để tránh đè lên .live_viewer_box (trang chi tiết sp/combo, bottom:1.5rem)
   và .fixed_contact (bottom:40% desktop / bottom:5rem mobile). */
.popup_voucher_badge {
    position: fixed;
    right: 1rem;
    bottom: 5.5rem;
    z-index: 999;
    width: 8rem;
    display: block;
    text-decoration: none;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.18));
    transition: transform .2s ease;
}
.popup_voucher_badge:hover { transform: translateY(-3px) scale(1.03); }
.popup_voucher_img,
.popup_voucher_svg { display: block; width: 100%; height: auto; }
.popup_voucher_svg svg { display: block; width: 100%; height: auto; }
@media (max-width: 767px) {
    .popup_voucher_badge { width: 6rem; right: .6rem; bottom: 3.2rem; }
}

/* ─── Live Viewer Count (chi tiết sản phẩm / combo) ─── */
.live_viewer_box {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    z-index: 998;
    display: flex;
    align-items: center;
    gap: .5rem;
    background: #fff;
    border: 1px solid #E7F3DE;
    box-shadow: 0 4px 20px rgba(0,0,0,.12);
    border-radius: 999px;
    padding: .55rem 1.1rem;
    font-size: .7rem;
    color: #555;
    white-space: nowrap;
    animation: liveViewerIn .4s cubic-bezier(.22,.68,0,1.2);
}
.live_viewer_dot {
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: #E0391F;
    flex-shrink: 0;
    animation: liveViewerBlink 1.6s ease-in-out infinite;
}
.live_viewer_count {
    color: #3E6530;
    display: inline-block;
    transition: opacity .3s ease;
}
.live_viewer_count.bump { animation: liveViewerBump .4s ease; }
.live_viewer_text_short { display: none; }
@keyframes liveViewerIn {
    from { transform: translateY(12px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}
@keyframes liveViewerBlink {
    0%, 100% { opacity: 1; }
    50%      { opacity: .35; }
}
@keyframes liveViewerBump {
    0%   { transform: scale(1);    opacity: .45; }
    50%  { transform: scale(1.22); }
    100% { transform: scale(1);    opacity: 1; }
}
@media (max-width: 767px) {
    .live_viewer_box { right: .75rem; bottom: .75rem; padding: .45rem .8rem; font-size: .8rem; gap: .4rem; }
    .live_viewer_text_full { display: none; }
    .live_viewer_text_short { display: inline; }
}

button.mobile_filter_btn {
    display: none !important;
}

.swiper-slide:nth-child(even) .product_item .box_img {
    border-color: transparent;
}

.product_item:nth-child(even) .box_img {
    border-color: transparent;
}

@media (max-width: 767px) {
  .recruitment_detail_block {
    font-size: 1rem;
  }

  .recruitment_detail_sidebar {
    font-size: 1rem;
  }

  .sidebar_row span.label {
    font-size: 1rem;
  }

  .sidebar_row .sidebar_item {
    width: 8rem;
  }

  .sidebar_row .content {
    font-size: 1rem;
  }

  .sidebar_contact p {
    font-size: 1rem;
  }

  .contact_row {
    font-size: 1rem;
  }

  .sidebar_block h3 {
    font-size: 1.1rem;
  }

  .sidebar_item b {
    font-size: 1.2rem;
  }

  .sidebar_item {
    font-size: 1rem;
  }
}

.minicart_item_bottom.flex.items-center {
    justify-content: space-between;
    align-items: center;
}

del.minicart_item_old_price {
    color: #3E6530;
    font-size: .6rem;
    opacity: .5;
}

.minicart_item_price {
    margin: 0;
}

.minicart_item_unit {
    opacity: .5;
}

.minicart_qty_btn {
    color: #C7D4C7;
    font-size: 1rem;
    min-height: unset;
}

.minicart_item_qty .minicart_qty_val {
    color: #8FB184;
    font-weight: 700;
    font-size: .9rem;
}

del.minicart_total_old_price {
    color: #8FB184;
    font-size: 1rem;
}

.minicart_total b {
    color: #E0391F;
    font-size: 1.7rem;
    font-weight: 600;
}

.minicart_total {
    align-items: center;
}

.mc_terms_label {
    font-weight: 400;
}

@media (max-width: 767px) {
  .prodcat_related_inner {
    flex-direction: column;
  }

  .prodcat_related_posts {
    width: 100%;
  }

  .prodcat_related_main_img {
    max-width: 11rem;
    margin: auto;
  }
}

.pagination .page_prev, .pagination .page_next {
    width: 2rem;
}

@media (max-width: 767px) {
  .pd_extra_tooltip_fixed {
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: 85vw;
    max-width: 20rem;
  }

  .core_items_box {
    padding: 1rem;
  }

  .core_item .content {
    min-height: 8rem;
  }

  .team_philosophy_items {
    justify-content: space-around;
    gap: 1rem;
  }

  button.sol_search_toggle {
    left: 3.6rem;
    right: unset;
    position: absolute;
  }

  .gallery_thumbs_prev, .gallery_thumbs_next {
    display: none;
  }
}

.store_mobile_solution_wrap {
  border-bottom: 1px solid #f0f0f0;
  margin: 0;
}

@media (max-width: 767px) {
  .certificates_box:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: .7;
  }

  .certificates_box {
    position: relative;
  }

  .certificates_box h2 {
    position: relative;
    z-index: 2;
    text-align: center;
  }

  .recruitment_detail_sidebar {
    order: -1;
    margin-bottom: 2rem;
    margin-top: 0;
  }

  .production_items {
    flex-wrap: wrap;
  }

  .production_items .production_item {
    width: calc(50% - 0.5rem);
  }

  .distribution4_img {
    display: none;
  }

  .sustainable5_item h3 {
    font-size: 1rem;
  }

  .sustainable5_item {
    padding: .6rem;
  }

  a.sc_l1_view_all {
    background: #fff;
  }

  .blog_wrap.swiper .item_post .content {
    color: #fff;
    display: block;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }

  section.solution7 .blog_wrap .item_post {
    height: 12rem !important;
  }

  section.solution7 .blog_wrap .item_post h3 {
    font-size: 1rem !important;
  }

  section.solution7 .blog_wrap .item_post .box_content {
    padding: 1rem !important;
  }
}

.auth_page a.button_link.btn_submit {
    display: flex !important;
}

@media (max-width: 767px) {
    .solution2_img .inner_map .items_map .item .box_content .inner {
        font-size: .65rem;
    }
    .prodcat_related_main_img {
        display: none;
    }
    .product_breadcrumb >*:not(:last-child) {
        flex: 0 0 auto;
    }
    .product_breadcrumb >*:last-child {
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }
    .core_items_box:before {
        height: 12.8rem;
    }
}