@charset "UTF-8";
/**
 * _base.scss
 * 
 * 1/ biến màu săc
 * 2/ biến kích thước font chữ
 * 3/ Cấu hình border
 * 4/ Mixin
 * 5/ Responsive
*/
.header-nav-main .icon-menu {
  font-size: 1.3em !important;
}

/* Làm mờ đường kẻ phân cách cho tinh tế */
/* 1. Reset khung bọc tổng thể */
.mfp-wrap:has(#custom-left-menu) {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100vh !important;
  overflow: hidden !important;
  display: block !important;
}
.mfp-wrap:has(#custom-left-menu) .mfp-container {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100vh !important;
  padding: 0 !important;
  display: block !important;
}
.mfp-wrap:has(#custom-left-menu) .mfp-container:before {
  display: none !important;
}
.mfp-wrap:has(#custom-left-menu) .mfp-content {
  vertical-align: top !important;
  display: block !important;
  width: 400px !important;
  max-width: 400px !important;
  height: 100vh !important;
  margin: 0 !important;
}
@media (max-width: 767px) {
  .mfp-wrap:has(#custom-left-menu) .mfp-content {
    width: 320px !important;
    max-width: 320px !important;
  }
}

.left-sidebar-lightbox {
  background-color: transparent !important;
  width: 100% !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: 5px 0 25px rgba(0, 0, 0, 0.2);
}
.left-sidebar-lightbox .section, .left-sidebar-lightbox .section-content, .left-sidebar-lightbox .row {
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 2. Cột trái & Hiệu chỉnh chữ LOVE WORLD dọc */
.sidebar-left-strip {
  background-color: var(--fs-color-primary) !important;
  height: 100vh !important;
  position: relative !important;
  padding: 0 !important;
}
.sidebar-left-strip .col-inner {
  height: 100% !important;
  position: relative !important;
}

.menu-bg-text {
  position: absolute !important;
  left: 62% !important;
  top: 48% !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
  z-index: 10 !important;
  pointer-events: none;
  transform: translate(-50%, -50%) rotate(-90deg) !important;
  transform-origin: center center !important;
}
.menu-bg-text p {
  margin: 0 !important;
  padding: 0 !important;
  font-family: Arial, sans-serif !important;
  font-weight: 550 !important; /* Hạ độ đậm xuống cho thanh thoát */
  text-transform: uppercase !important;
  white-space: nowrap !important;
  font-size: 110px !important; /* Tăng size để chữ dài ra */
  letter-spacing: 6px !important; /* Tăng khoảng cách các ký tự */
  line-height: 1 !important;
  background: linear-gradient(180deg, color-mix(in srgb, #fff 12%, var(--fs-color-primary) 88%) 20%, color-mix(in srgb, #fff 10%, var(--fs-color-primary) 90%) 50%, color-mix(in srgb, #fff 5%, var(--fs-color-primary) 95%) 65%, color-mix(in srgb, #fff 2%, var(--fs-color-primary) 98%) 75%, var(--fs-color-primary) 90%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
@media (max-width: 767px) {
  .menu-bg-text p {
    font-size: 40px !important;
    letter-spacing: 5px !important;
  }
}

/* 3. Cột phải (Khung chứa Menu) */
.sidebar-right-content {
  background-color: var(--fs-color-primary) !important;
  height: 100vh !important;
  overflow-y: auto;
  padding: 0 !important;
  border: solid 1px rgba(255, 255, 255, 0.368627451);
  border-top: unset;
}
.sidebar-right-content .col-inner {
  padding: 70px 0 40px 0 !important;
  display: flex;
  flex-direction: column;
}
.sidebar-right-content .overlay-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: calc(100vh - 100px); /* trừ header nếu có */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* smooth cho touchpad */
}
.sidebar-right-content .overlay-nav > li {
  margin: 0;
}
.sidebar-right-content .overlay-nav > li > a {
  display: block;
  padding: 16px 0;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fs-color-primary);
  border-bottom: 1px solid rgba(31, 122, 63, 0.08);
  transition: color 0.25s ease;
}
.sidebar-right-content .overlay-nav > li > a:hover {
  color: var(--fs-color-secondary);
}
.sidebar-right-content .overlay-nav .menu-item-has-children > a {
  position: relative;
  padding-right: 20px;
}
.sidebar-right-content .overlay-nav .menu-item-has-children > a::after {
  content: "\f078"; /* fa-chevron-down */
  font-family: "Font Awesome 6 Free";
  font-weight: 900; /* BẮT BUỘC */
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  transition: transform 0.25s ease;
}
.sidebar-right-content .overlay-nav .menu-item-has-children.open > a::after {
  transform: translateY(-50%) rotate(180deg);
}
.sidebar-right-content .overlay-nav li ul {
  list-style: none;
  margin: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.sidebar-right-content .overlay-nav li ul li a {
  padding-left: 45px !important;
  display: block;
  padding: 10px 0;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--fs-color-primary);
  border: none;
}
.sidebar-right-content .overlay-nav li ul li a:hover {
  color: var(--fs-color-secondary);
}
.sidebar-right-content .overlay-nav li.open > ul {
  max-height: 500px; /* đủ cho submenu */
}

/* 4. Tinh chỉnh độ thanh mảnh của Text Menu (.overlay-nav) */
ul.overlay-nav {
  list-style: none !important;
  margin: 0 0 30px 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
ul.overlay-nav li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.368627451) !important;
}
ul.overlay-nav li:first-child {
  border-top: 1px solid rgba(255, 255, 255, 0.368627451) !important;
}
ul.overlay-nav li a {
  display: block;
  padding: 16px 30px !important; /* Căn lề trái 30px */
  color: rgba(255, 255, 255, 0.95) !important;
  font-family: Arial, sans-serif !important;
  font-size: 13px !important; /* Font chữ nhỏ nhắn, sang trọng hơn */
  font-weight: 500 !important; /* Loại bỏ in đậm (bold) */
  text-transform: uppercase;
  text-decoration: none !important;
  letter-spacing: 0.5px;
  transition: background-color 0.2s ease, color 0.2s ease;
  position: relative;
}
ul.overlay-nav li a:hover {
  background-color: white;
  color: var(--fs-color-primary) !important;
}

/* 5. Gọt lại Social Icons thẳng hàng và không viền */
.sidebar-right-content .social-icons {
  padding: 0 30px !important; /* Căn thẳng tắp với lề chữ menu (30px) */
  display: flex;
  gap: 15px;
  margin-top: 10px;
}
.sidebar-right-content .social-icons a.icon.plain {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important; /* Triệt tiêu mọi đường viền */
  color: rgba(255, 255, 255, 0.65) !important;
}
.sidebar-right-content .social-icons a.icon.plain i {
  font-weight: normal !important;
}
.sidebar-right-content .social-icons a.icon.plain:hover {
  background: transparent !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* 6. Thu nhỏ nét và định vị Nút Đóng (X) */
.mfp-wrap:has(#custom-left-menu) .mfp-close {
  color: white !important;
  position: absolute !important;
  top: 15px !important;
  font-size: 0 !important;
  width: 40px !important;
  height: 40px !important;
  background: transparent !important;
  z-index: 9999 !important;
  transition: all 0.2s ease;
  left: 350px !important;
  right: auto !important;
}
.mfp-wrap:has(#custom-left-menu) .mfp-close svg {
  width: 20px !important; /* Bóp gọn size icon X */
  height: 20px !important;
  color: currentColor;
  vertical-align: middle;
  stroke-width: 1.5px !important; /* Ép nét X mỏng hơn */
}
.mfp-wrap:has(#custom-left-menu) .mfp-close:hover {
  color: #ffffff !important;
  transform: rotate(90deg);
}
@media (max-width: 767px) {
  .mfp-wrap:has(#custom-left-menu) .mfp-close {
    left: 275px !important;
  }
}

@font-face {
  font-family: "Font-love-world";
  src: url("../font/SVN-FLRareDisplay-Medium.woff2") format("woff2"), url("../font/SVN-FLRareDisplay-Medium.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
body, p, span, div, li, a, input, textarea, select {
  font-family: "Font-love-world" !important;
}

h1, h2, h3, h4, h5, h6,
.heading-font,
.nav > li > a,
.mobile-sidebar-nav > li > a,
.alt-font,
.button {
  font-family: "Font-love-world" !important;
}

[class^=icon-], [class*=" icon-"],
.icon-angle-left, .icon-angle-right,
.fa, .fab, .far, .fas, .stars a, .ab-item .ab-icon,
.grid-tools, .flickity-button-icon {
  font-family: "fl-icons" !important; /* Giữ nguyên font icon gốc của Flatsome */
}

#main {
  background: radial-gradient(circle 45vw at 10% 85%, color-mix(in srgb, #fff 60%, var(--fs-color-primary) 40%) 0%, color-mix(in srgb, #fff 90%, var(--fs-color-primary) 10%) 30%, transparent 100%), radial-gradient(circle 35vw at 90% 15%, color-mix(in srgb, #fff 75%, var(--fs-color-primary) 25%) 0%, color-mix(in srgb, #fff 95%, var(--fs-color-primary) 5%) 35%, transparent 100%), linear-gradient(180deg, #ffffff 0%, color-mix(in srgb, #fff 92%, var(--fs-color-primary) 8%) 15%, color-mix(in srgb, #fff 80%, var(--fs-color-primary) 20%) 55%, color-mix(in srgb, #fff 68%, var(--fs-color-primary) 32%) 100%) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
}
#main .section,
#main section {
  background-color: transparent !important;
  background-image: none !important;
}

.button-lightbg, .section-baochi .button {
  font-weight: 400 !important;
  position: relative;
  overflow: hidden;
  text-transform: capitalize;
  overflow: hidden;
  z-index: 1;
  white-space: nowrap;
  border-radius: 50px !important;
}
.button-lightbg::before, .section-baochi .button::before {
  content: "";
  width: 0;
  height: 100%;
  display: block;
  position: absolute;
  left: -2px;
  top: 0;
  border-radius: 50px;
  transition-duration: 0.5s;
  z-index: 0;
}
.button-lightbg span, .section-baochi .button span {
  z-index: 1;
  position: relative;
}
.button-lightbg.secondary::before, .section-baochi .button.secondary::before {
  background-color: var(--fs-color-primary);
}
.button-lightbg.secondary:hover, .section-baochi .button.secondary:hover {
  border-color: var(--fs-color-primary);
}
.button-lightbg.primary::before, .section-baochi .button.primary::before {
  background-color: var(--fs-color-secondary);
}
.button-lightbg.primary:hover, .section-baochi .button.primary:hover {
  border-color: var(--fs-color-secondary);
}
.button-lightbg:hover::before, .section-baochi .button:hover::before {
  width: calc(100% + 4px);
}
.button-lightbg i::before, .section-baochi .button i::before {
  font-family: "Font Awesome 6 Free";
  content: "\f178";
  font-weight: 900;
  display: inline-block;
  margin-left: 0;
  margin-bottom: 1px;
  padding-left: 20px !important;
}

.img-border-radius10 {
  border-radius: 12px;
  overflow: hidden;
}

.section-taisao-chon .service-slider .flickity-viewport {
  min-height: 420px !important;
}
.section-taisao-chon .service-slider .flickity-slider {
  display: flex !important;
  align-items: center !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row {
  padding: 0 15px;
  display: flex !important;
  align-items: center !important;
  transition: transform 0.4s cubic-bezier(0.2, 1, 0.3, 1), opacity 0.4s ease !important;
  overflow: visible !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row .col, .section-taisao-chon .service-slider .flickity-slider > .row .col-inner {
  display: flex !important;
  width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row .box {
  background: linear-gradient(color-mix(in srgb, #fff 35%, var(--fs-color-primary) 65%) 20%, color-mix(in srgb, #fff 20%, var(--fs-color-primary) 80%) 50%, color-mix(in srgb, #fff 10%, var(--fs-color-primary) 90%) 75%, var(--fs-color-primary) 100%) !important;
  border-radius: 24px !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.52) !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  position: relative !important;
  width: 100% !important;
  transition: all 0.4s ease;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected + :not(.is-selected) .box {
  transform: translateX(10px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected + .row + :not(.is-selected) .box {
  transform: translateX(-50px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected):has(+ .is-selected) .box {
  transform: translateX(-10px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected):has(+ .row + .is-selected) .box {
  transform: translateX(50px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:first-child.is-selected ~ .row:last-child .box {
  transform: translateX(-10px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:first-child.is-selected ~ .row:nth-last-child(2) .box {
  transform: translateX(50px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) {
  opacity: 0.5 !important;
  transform: scale(0.82);
  filter: blur(3px) !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) .box {
  padding: 20px 0;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) .box-text, .section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) .txt-ten {
  display: none !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) .box-image {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-self: center !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) .box-image .image-cover {
  width: 75% !important;
  padding-top: 75% !important;
  margin: 0 auto;
  position: relative !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row:not(.is-selected) .box-image .image-cover img {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  height: 100% !important;
  object-fit: contain !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected {
  opacity: 1 !important;
  transform: scale(1.15);
  z-index: 10;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box {
  padding: 25px 30px;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-image {
  position: static !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-image .image-cover {
  position: absolute !important;
  top: -90px !important;
  left: 8px !important;
  width: 60% !important;
  height: 400px !important;
  padding-top: 0 !important;
  overflow: visible !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-image .image-cover img {
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) scale(1.15) !important;
  transform-origin: bottom center !important;
  height: 100% !important;
  max-width: 140% !important;
  object-fit: contain !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-text {
  width: 55% !important;
  flex: 1;
  padding-left: 40px !important;
  align-self: center !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-text p, .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-text span, .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-text div, .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box-text strong {
  color: #ffffff !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .txt-ten {
  position: absolute;
  bottom: -80px;
  left: 5%;
  right: 5%;
  width: 90%;
  opacity: 1;
  visibility: visible;
  text-align: center;
  display: block !important;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .txt-ten h4 {
  color: var(--fs-color-primary);
  font-weight: bold;
  font-size: 1.4rem;
  margin-bottom: 5px;
}
.section-taisao-chon .service-slider .flickity-slider > .row.is-selected .txt-ten p {
  color: #555;
  font-size: 0.95rem;
  margin: 0;
}
.section-taisao-chon .flickity-prev-next-button {
  top: auto !important;
  bottom: 15px !important;
  transform: none !important;
  width: 40px !important;
  height: 40px !important;
  background: var(--fs-color-primary);
  border-radius: 50% !important;
  opacity: 1 !important;
  transition: all 0.3s ease;
}
.section-taisao-chon .flickity-prev-next-button svg {
  border-color: var(--fs-color-primary) !important;
}
.section-taisao-chon .flickity-prev-next-button svg path {
  fill: #ffffff !important;
}
.section-taisao-chon .flickity-prev-next-button:hover {
  background: var(--fs-color-secondary) !important;
  transform: scale(1.15) !important;
}
.section-taisao-chon .flickity-prev-next-button.previous {
  left: 32% !important;
}
.section-taisao-chon .flickity-prev-next-button.next {
  right: 32% !important;
}

@media (max-width: 767px) {
  .section-taisao-chon .service-slider .flickity-viewport {
    min-height: 380px !important;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row {
    padding: 0px;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected {
    transform: scale(1);
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box {
    padding: 20px;
    height: auto !important;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box .box-image {
    width: 60% !important;
    margin-bottom: 0;
    height: 150px !important;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box .box-image .image-cover {
    bottom: 0 !important;
    left: 0 !important;
    width: 60% !important;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .box .box-text {
    width: 100% !important;
    padding-left: 0 !important;
    text-align: center;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .txt-ten {
    bottom: -90px !important;
  }
  .section-taisao-chon .service-slider .flickity-slider > .row.is-selected .txt-ten h4 {
    font-size: 1rem;
  }
}
.section-ba-duong .row-baduong .col-inner {
  background: linear-gradient(180deg, #fff 0%, #fff 0%, color-mix(in srgb, #fff 97%, var(--fs-color-primary) 3%) 50%, color-mix(in srgb, #fff 82%, var(--fs-color-primary) 18%) 75%, color-mix(in srgb, #fff 72%, var(--fs-color-primary) 28%) 100%) !important;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
  padding: 20px;
  border-radius: 12px;
}
.section-ba-duong .row-baduong .col-inner h4 {
  color: var(--fs-color-primary);
}
.section-ba-duong .row-baduong .col-inner .is-divider {
  margin-bottom: 8px !important;
  background: var(--fs-color-primary);
}
.section-ba-duong .row-baduong .col:nth-child(even) .col-inner {
  background: linear-gradient(180deg, #fff 0%, #fff 0%, color-mix(in srgb, #fff 97%, var(--fs-color-secondary) 3%) 50%, color-mix(in srgb, #fff 82%, var(--fs-color-secondary) 18%) 75%, color-mix(in srgb, #fff 72%, var(--fs-color-secondary) 28%) 100%) !important;
}
.section-ba-duong .row-baduong .col:nth-child(even) .col-inner h4 {
  color: var(--fs-color-secondary) !important;
}
.section-ba-duong .row-baduong .col:nth-child(even) .col-inner .is-divider {
  margin-bottom: 8px !important;
  background: var(--fs-color-secondary);
}
.section-ba-duong .row-vantutu {
  background: #fff !important;
  padding: 20px 0;
  border-radius: 20px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.01), 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 6px color-mix(in srgb, var(--fs-color-primary) 60%, white 40%);
}
.section-ba-duong .row-vantutu .col:nth-child(1)::after,
.section-ba-duong .row-vantutu .col:nth-child(2)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 1.3px !important;
  height: 85%;
  background: rgba(26, 73, 215, 0.2);
}
.section-ba-duong .row-vantutu .col .col-inner {
  padding: 30px;
}
.section-ba-duong .row-vantutu .col .col-inner .txt-trich p {
  color: var(--fs-color-primary);
}
.section-ba-duong .row-vantutu .col .col-inner .box-image {
  border-radius: 15px;
  overflow: hidden;
}
.section-ba-duong .row-vantutu .col .col-inner .box-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(180deg, transparent 0%, transparent 20%, color-mix(in srgb, transparent 97%, var(--fs-color-primary) 3%) 30%, color-mix(in srgb, transparent 82%, var(--fs-color-primary) 18%) 50%, var(--fs-color-primary) 80%) !important;
}
.section-ba-duong .row-vantutu .col .col-inner .box-text {
  z-index: 5;
}
.section-ba-duong .row-vantutu .col:nth-child(even) .txt-trich p {
  color: var(--fs-color-secondary);
}
.section-ba-duong .row-vantutu .col:nth-child(even) .box-image::before {
  background: linear-gradient(180deg, transparent 0%, transparent 20%, color-mix(in srgb, transparent 97%, var(--fs-color-secondary) 3%) 30%, color-mix(in srgb, transparent 82%, var(--fs-color-secondary) 18%) 50%, var(--fs-color-secondary) 80%) !important;
}
.section-ba-duong .row-phancuc .box.has-hover {
  position: relative;
  padding: 0px 24px 30px 24px;
  border-radius: 0 0 20px 20px;
  background: linear-gradient(color-mix(in srgb, #fff 35%, var(--fs-color-primary) 65%) 20%, color-mix(in srgb, #fff 20%, var(--fs-color-primary) 80%) 50%, color-mix(in srgb, #fff 10%, var(--fs-color-primary) 90%) 75%, var(--fs-color-primary) 100%) !important;
  overflow: visible;
}
.section-ba-duong .row-phancuc .txt-so {
  margin-bottom: -70px;
}
.section-ba-duong .row-phancuc .txt-so h2 {
  margin: 0;
  font-size: 220px;
  line-height: 1;
  background: linear-gradient(180deg, color-mix(in srgb, #fff 80%, var(--fs-color-primary) 20%) 20%, color-mix(in srgb, #fff 67%, var(--fs-color-primary) 33%) 50%, color-mix(in srgb, #fff 42%, var(--fs-color-primary) 58%) 75%, color-mix(in srgb, #fff 12%, var(--fs-color-primary) 88%) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.section-ba-duong .row-phancuc .txt-tieude {
  position: absolute;
  top: 145px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  width: calc(100% + 12px);
  height: 86px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 50px 0 35px;
  background-image: url("/wp-content/uploads/2026/05/Rectangle-71.webp");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
}
.section-ba-duong .row-phancuc .txt-tieude h3 {
  margin: 0;
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}
.section-ba-duong .row-phancuc .box-image {
  margin-top: 40px;
  border-radius: 18px;
  overflow: hidden;
}
.section-ba-duong .row-phancuc .box-image img {
  border-radius: 18px;
}
.section-ba-duong .row-phancuc .box-text {
  background: transparent !important;
  padding: 0 !important;
}
.section-ba-duong .row-phancuc .box-text-inner p {
  margin: 0;
}
.section-ba-duong .row-phancuc .col:nth-child(even) .box.has-hover {
  background: linear-gradient(color-mix(in srgb, #fff 35%, var(--fs-color-secondary) 65%) 20%, color-mix(in srgb, #fff 20%, var(--fs-color-secondary) 80%) 50%, color-mix(in srgb, #fff 10%, var(--fs-color-secondary) 90%) 75%, var(--fs-color-secondary) 100%) !important;
}
.section-ba-duong .row-phancuc .col:nth-child(even) .txt-so h2 {
  background-clip: text !important;
  background: linear-gradient(180deg, color-mix(in srgb, #fff 80%, var(--fs-color-secondary) 20%) 20%, color-mix(in srgb, #fff 67%, var(--fs-color-secondary) 33%) 50%, color-mix(in srgb, #fff 42%, var(--fs-color-secondary) 58%) 75%, color-mix(in srgb, #fff 12%, var(--fs-color-secondary) 88%) 100%);
}
.section-ba-duong .row-phancuc .col:nth-child(even) .txt-tieude {
  background-image: url("/wp-content/uploads/2026/05/Rectangle-71-1.webp");
}

.section-mohinh .row-3-thoiquen > .col > .col-inner {
  background: linear-gradient(color-mix(in srgb, #fff 35%, var(--fs-color-primary) 65%) 20%, color-mix(in srgb, #fff 20%, var(--fs-color-primary) 80%) 50%, color-mix(in srgb, #fff 10%, var(--fs-color-primary) 90%) 75%, var(--fs-color-primary) 100%) !important;
  border-radius: 12px;
  padding: 15px 20px 15px 10px;
  height: 100%; /* Đảm bảo các cột cao bằng nhau */
}
.section-mohinh .row-3-thoiquen > .col > .col-inner h4, .section-mohinh .row-3-thoiquen > .col > .col-inner p {
  color: white !important;
  margin-right: 10px;
}
.section-mohinh .row-3-thoiquen > .col > .col-inner p {
  margin-bottom: 0 !important;
}
.section-mohinh .row-3-thoiquen > .col > .col-inner .txt-so {
  padding: 10px 10px 10px 5px;
}
.section-mohinh .row-3-thoiquen > .col > .col-inner .txt-so h2 {
  margin-bottom: 0 !important;
  background: linear-gradient(180deg, color-mix(in srgb, #fff 40%, var(--fs-color-primary) 60%) 50%, color-mix(in srgb, #fff 50%, var(--fs-color-primary) 50%) 75%, color-mix(in srgb, #fff 60%, var(--fs-color-primary) 40%) 90%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.section-mohinh .row-3-thoiquen > .col:nth-child(even) > .col-inner {
  background: linear-gradient(color-mix(in srgb, #fff 35%, var(--fs-color-secondary) 65%) 20%, color-mix(in srgb, #fff 20%, var(--fs-color-secondary) 80%) 50%, color-mix(in srgb, #fff 10%, var(--fs-color-secondary) 90%) 75%, var(--fs-color-secondary) 100%) !important;
}
.section-mohinh .row-3-thoiquen > .col:nth-child(even) > .col-inner .txt-so h2 {
  background: linear-gradient(180deg, color-mix(in srgb, #fff 40%, var(--fs-color-secondary) 60%) 50%, color-mix(in srgb, #fff 50%, var(--fs-color-secondary) 50%) 75%, color-mix(in srgb, #fff 60%, var(--fs-color-secondary) 40%) 90%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.section-mohinh .btn-xemthem {
  padding: 4px 20px;
  color: var(--fs-color-primary);
  white-space: nowrap;
  overflow: hidden;
  z-index: 1;
  border-radius: 12px !important;
  border: unset !important;
  align-items: center;
  background: linear-gradient(180deg, transparent 0%, transparent 0%, color-mix(in srgb, transparent 97%, var(--fs-color-primary) 3%) 50%, color-mix(in srgb, transparent 82%, var(--fs-color-primary) 18%) 75%, color-mix(in srgb, transparent 72%, var(--fs-color-primary) 28%) 100%) !important;
}
.section-mohinh .btn-xemthem:hover {
  background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, #fff 70%, var(--fs-color-secondary) 30%) 50%, color-mix(in srgb, #fff 60%, var(--fs-color-secondary) 40%) 65%, color-mix(in srgb, #fff 50%, var(--fs-color-secondary) 50%) 85%) !important;
  color: var(--fs-color-secondary);
  box-shadow: unset;
}
.section-mohinh .btn-xemthem i::before {
  font-family: "Font Awesome 6 Free";
  content: "\f061";
  font-weight: 900;
  display: inline-block;
  margin-left: 0;
  margin-bottom: 1px;
}
.section-mohinh .galary-border-radius .box.gallery-box {
  border-radius: 12px;
  overflow: hidden;
}
.section-mohinh .row-nhanban-doingu h4 {
  color: var(--fs-color-primary);
}
.section-mohinh .row-nhanban-doingu img {
  border-radius: 12px !important;
  overflow: hidden;
}
.section-mohinh .row-nhanban-doingu > .col:first-child {
  overflow: visible !important; /* Ép hiển thị tràn viền */
  position: relative !important; /* Làm gốc tọa độ chuẩn cho ::after */
  z-index: 9 !important; /* Ép cột 1 nổi lên trên các cột sau, không bị che mất đường kẻ */
  padding-right: 30px; /* Khoảng cách an toàn từ chữ đến đường kẻ */
}
.section-mohinh .row-nhanban-doingu > .col:first-child::after {
  content: "";
  position: absolute;
  top: 0;
  right: 30px;
  width: 2px;
  height: 81%;
  opacity: 0.8;
  background-color: var(--fs-color-primary); /* Màu đường kẻ (màu primary mờ 25%) */
}
.section-mohinh .row-nhanban-doingu {
  /* 2. Xử lý màu sắc cho cụm Số (01, 02, 03) và Chữ kế bên */
}
.section-mohinh .row-nhanban-doingu .row-so {
  margin-bottom: 10px;
  /* Cột chứa số h3 */
}
.section-mohinh .row-nhanban-doingu .row-so .col:first-child .text h3 {
  line-height: 0.8;
  margin-bottom: 0 !important;
  background: linear-gradient(180deg, color-mix(in srgb, #fff 60%, var(--fs-color-secondary) 40%) 30%, color-mix(in srgb, #fff 40%, var(--fs-color-secondary) 60%) 60%, color-mix(in srgb, #fff 20%, var(--fs-color-secondary) 80%) 90%);
  opacity: 0.7;
  font-weight: 700;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.section-mohinh .row-nhanban-doingu .row-so {
  /* Cột chứa tiêu đề kế bên số */
}
.section-mohinh .row-nhanban-doingu .row-so .col:last-child p {
  background: linear-gradient(180deg, color-mix(in srgb, #fff 60%, var(--fs-color-secondary) 40%) 50%, color-mix(in srgb, #fff 40%, var(--fs-color-secondary) 60%) 65%, color-mix(in srgb, #fff 20%, var(--fs-color-secondary) 80%) 85%);
  opacity: 0.5;
  font-weight: 700;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 0;
}
.section-mohinh .row-nhanban-doingu {
  /* 3. Khoảng cách đoạn mô tả dưới phần số (Cột 2, 3, 4) */
}
.section-mohinh .row-nhanban-doingu > .col:nth-child(n+2):nth-child(-n+4) > .col-inner > p {
  line-height: 1.4;
  margin-bottom: 15px;
}
.section-mohinh .row-nhanban-doingu {
  /* 4. Khoảng cách cho đoạn văn bản ở cột cuối cùng (Cột 5) */
}
.section-mohinh .row-nhanban-doingu > .col:last-child > .col-inner > p {
  margin-top: 15px;
  line-height: 1.5;
}
.section-mohinh .txt-deco {
  border-top: solid 2px var(--fs-color-secondary);
  border-bottom: solid 2px var(--fs-color-secondary);
  padding: 20px 0px 20px 0;
}
.section-mohinh .txt-deco p, .section-mohinh .txt-deco li {
  color: var(--fs-color-secondary);
  opacity: 1;
}
.section-mohinh .txt-deco ul {
  margin-bottom: 0 !important;
}

.section-chinh-sach img {
  border-radius: 15px !important;
  overflow: hidden;
}
.section-chinh-sach h3, .section-chinh-sach h4 {
  color: var(--fs-color-primary) !important;
}

.txt-tieude .customwp-title-text {
  color: var(--fs-color-primary);
}
.txt-tieude .customwp-title-sub {
  color: var(--fs-color-secondary);
}

.section-lbs-cares {
  /* token nhanh để chỉnh */
  --border: color-mix(in srgb, var(--primary-color) 58%, #0000004b);
  --radius: 10px;
  /* bảo đảm bằng chiều cao khi dùng align-equal của Flatsome */
}
.section-lbs-cares .align-equal > .col > .col-inner {
  height: 100%;
}
.section-lbs-cares {
  /* ===== Card ===== */
}
.section-lbs-cares .box.has-hover {
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr; /* icon | nội dung */
  border-radius: var(--radius);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.06), 0 2px 12px color-mix(in srgb, var(--fs-color-primary) 60%, white 40%);
  transition: transform 0.25s, box-shadow 0.25s;
}
.section-lbs-cares .box.has-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.08);
}
.section-lbs-cares .box-image {
  width: 100%;
  overflow: hidden;
  border-radius: var(--radius) var(--radius) 0 0;
}
.section-lbs-cares .box-image img {
  height: auto;
  object-fit: cover;
  width: 100%;
  display: block;
}
.section-lbs-cares {
  /* Nội dung text trái, kiểu chữ */
}
.section-lbs-cares .box-text {
  text-align: left;
  padding: 10px 20px !important;
  border-radius: var(--radius);
  border: solid 1px;
  position: relative !important;
  z-index: 5 !important;
  margin-top: -5px !important;
}
.section-lbs-cares .box-text h3, .section-lbs-cares .box-text h4 {
  margin: 10px 0 8px;
  font-size: clamp(16px, 2.1vw, 20px);
  line-height: 1.3;
  color: var(--fs-color-primary);
}
.section-lbs-cares .box-text p {
  margin: 0;
  line-height: 1.7;
}

.background-mosi .box.has-hover {
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.background-mosi .box.has-hover .box-text {
  border-color: color-mix(in srgb, white 40%, var(--fs-color-primary) 60%);
  background: linear-gradient(180deg, #fff 0%, #fff 0%, color-mix(in srgb, #fff 97%, var(--fs-color-primary) 3%) 50%, color-mix(in srgb, #fff 82%, var(--fs-color-primary) 18%) 75%, color-mix(in srgb, #fff 72%, var(--fs-color-primary) 28%) 100%) !important;
}
.background-mosi .row .col:nth-child(even) .box.has-hover h4 {
  color: var(--fs-color-secondary) !important;
}
.background-mosi .row .col:nth-child(even) .box.has-hover .box-text {
  border-color: color-mix(in srgb, white 40%, var(--fs-color-secondary) 60%);
  background: linear-gradient(180deg, #fff 0%, #fff 0%, color-mix(in srgb, #fff 97%, var(--fs-color-secondary) 3%) 50%, color-mix(in srgb, #fff 82%, var(--fs-color-secondary) 18%) 75%, color-mix(in srgb, #fff 72%, var(--fs-color-secondary) 28%) 100%) !important;
}

.section-dactinh .slider-chinh {
  position: relative;
  z-index: 1;
}
.section-dactinh .slider-chinh::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  left: -5px !important; /* Vị trí đứng im so với toàn bộ vùng slider */
  width: 200px !important;
  height: calc(100% - 229px) !important;
  background: linear-gradient(180deg, transparent 0%, transparent 0%, color-mix(in srgb, transparent 97%, var(--fs-color-primary) 3%) 50%, color-mix(in srgb, transparent 82%, var(--fs-color-primary) 18%) 75%, color-mix(in srgb, transparent 72%, var(--fs-color-primary) 28%) 100%) !important;
  border-radius: 15px !important;
  z-index: -2 !important; /* Nằm dưới cùng của cả hệ thống slider */
  display: block !important;
}
.section-dactinh .slider-chinh::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  left: 35px !important;
  width: 200px !important;
  height: calc(100% - 150px) !important;
  background-color: color-mix(in srgb, white 40%, var(--fs-color-primary) 60%) !important;
  border-radius: 15px !important;
  z-index: -1 !important; /* Nằm trên lớp 1 nhưng dưới ảnh */
  display: block !important;
}
.section-dactinh .slider-chinh .gallery-slide, .section-dactinh .slider-chinh .flickity-slider > div {
  z-index: 1;
  padding-left: 55px !important;
  background: transparent !important;
  box-sizing: border-box !important;
}
.section-dactinh .slider-chinh .gallery-slide .img-inner, .section-dactinh .slider-chinh .flickity-slider > div .img-inner {
  left: 5px !important;
}
.section-dactinh .slider-chinh .gallery-slide .box, .section-dactinh .slider-chinh .gallery-slide .img, .section-dactinh .slider-chinh .gallery-slide .img-inner, .section-dactinh .slider-chinh .gallery-slide .banner, .section-dactinh .slider-chinh .gallery-slide img, .section-dactinh .slider-chinh .flickity-slider > div .box, .section-dactinh .slider-chinh .flickity-slider > div .img, .section-dactinh .slider-chinh .flickity-slider > div .img-inner, .section-dactinh .slider-chinh .flickity-slider > div .banner, .section-dactinh .slider-chinh .flickity-slider > div img {
  border-radius: 15px !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 2 !important;
}
.section-dactinh .so-dactinh h1 {
  margin-bottom: 5px !important;
  color: var(--fs-color-secondary);
  line-height: 0.5;
  margin-top: 40px;
  font-size: 2.5em;
}
.section-dactinh .flickity-page-dots {
  display: grid !important;
  /* Ép đúng 6 cột cho dòng đầu tiên, mỗi cột rộng 35px */
  grid-template-columns: repeat(6, 35px) !important;
  left: 107% !important; /* Đẩy cụm số sang cột bên phải */
  bottom: 35px !important; /* Điều chỉnh khoảng cách lên xuống từ đáy slider */
  margin-top: 20px;
}

.section-slide-so-thu-tu {
  /* 1. Ép Slider cho phép hiển thị phần tử tràn ra ngoài biên */
  /* 2. Định hình vùng chứa bằng Grid và đẩy sang phải */
}
.section-slide-so-thu-tu .flickity-page-dots {
  /* Khoảng cách: 12px giữa dòng trên/dưới, 16px giữa các cột */
  gap: 12px 16px !important;
  /* Căn cụm số ra giữa */
  justify-content: center !important;
  counter-reset: slider-counter;
  position: absolute !important;
  width: max-content !important;
  max-width: max-content !important;
  z-index: 99 !important; /* Đảm bảo cụm số luôn nằm trên cùng, không bị che khuất */
}
.section-slide-so-thu-tu {
  /* Ép các nút số từ vị trí số 7 trở đi tự động tràn xuống hàng thứ 2 */
}
.section-slide-so-thu-tu .flickity-page-dots .dot:nth-child(n+7) {
  grid-column: auto !important;
}
.section-slide-so-thu-tu {
  /* Định dạng giao diện các nút số */
}
.section-slide-so-thu-tu .flickity-page-dots .dot {
  width: 35px !important;
  height: 35px !important;
  background: #ffffff !important;
  border: 1px solid #ffffff !important;
  border-radius: 8px !important;
  opacity: 1 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 14px !important;
  font-weight: bold !important;
  color: var(--fs-color-primary) !important;
  margin: 0 !important;
  text-indent: 0 !important;
  cursor: pointer !important;
}
.section-slide-so-thu-tu {
  /* Tự động điền số 0 phía trước */
}
.section-slide-so-thu-tu .flickity-page-dots .dot::before {
  counter-increment: slider-counter;
  content: "0" counter(slider-counter);
}
.section-slide-so-thu-tu {
  /* Riêng số 10 thì không thêm số 0 */
}
.section-slide-so-thu-tu .flickity-page-dots .dot:nth-child(n+10)::before {
  content: counter(slider-counter);
}
.section-slide-so-thu-tu {
  /* Giao diện khi nút được click chọn (Active) */
}
.section-slide-so-thu-tu .flickity-page-dots .dot.is-selected, .section-slide-so-thu-tu .flickity-page-dots .dot:hover {
  background: var(--fs-color-primary) !important;
  color: #ffffff !important;
}

.section-baochi {
  --border: color-mix(in srgb, var(--primary-color) 58%, #0000004b);
  --radius: 10px;
}
.section-baochi .align-equal > .col > .col-inner {
  height: 100%;
}
.section-baochi .box.has-hover {
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr; /* icon | nội dung */
  border-radius: var(--radius);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.06), 0 2px 12px color-mix(in srgb, var(--fs-color-primary) 60%, white 40%);
  transition: transform 0.25s, box-shadow 0.25s;
}
.section-baochi .box.has-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.08);
}
.section-baochi .box-image {
  width: 100%;
}
.section-baochi .box-image img {
  height: auto;
  object-fit: cover;
  width: 100%;
  aspect-ratio: 16/9;
}
.section-baochi {
  /* Nội dung text trái, kiểu chữ */
}
.section-baochi .box-text {
  text-align: left;
  padding: 10px 20px !important;
  border-radius: var(--radius);
  border: solid 1px;
  position: relative !important;
  z-index: 5 !important;
  margin-top: -6px !important;
  background: linear-gradient(180deg, #fff 0%, #fff 0%, color-mix(in srgb, #fff 97%, var(--fs-color-primary) 3%) 50%, color-mix(in srgb, #fff 82%, var(--fs-color-primary) 18%) 75%, color-mix(in srgb, #fff 72%, var(--fs-color-primary) 28%) 100%) !important;
}
.section-baochi .box-text h3, .section-baochi .box-text h4 {
  margin: 10px 0 8px;
  font-size: clamp(16px, 2.1vw, 20px);
  color: var(--fs-color-primary);
  line-height: 1.5em; /* Đặt chiều cao dòng */
  min-height: 1.5em; /* Đặt chiều cao tối thiểu cho 2 dòng */
  display: -webkit-box;
  -webkit-line-clamp: 1; /* Hiển thị tối đa 2 dòng */
  -webkit-box-orient: vertical;
  overflow: hidden; /* Ẩn nội dung thừa nếu có */
  white-space: normal;
}
.section-baochi .box-text p {
  margin: 0;
  line-height: 1.5em; /* Đặt chiều cao dòng */
  min-height: 3em; /* Đặt chiều cao tối thiểu cho 2 dòng */
  display: -webkit-box;
  -webkit-line-clamp: 2; /* Hiển thị tối đa 2 dòng */
  -webkit-box-orient: vertical;
  overflow: hidden; /* Ẩn nội dung thừa nếu có */
  white-space: normal;
}
.section-baochi .box.has-hover {
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.section-baochi .box.has-hover .box-text {
  border-color: color-mix(in srgb, white 40%, var(--fs-color-primary) 60%);
}
.section-baochi .flickity-page-dots {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  /* Ép đúng 6 cột cho dòng đầu tiên, mỗi cột rộng 35px */
  margin-bottom: -60px;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

.slide-button .flickity-prev-next-button {
  top: auto !important;
  transform: none !important;
  width: 50px !important;
  height: 50px !important;
  background: color-mix(in srgb, white 65%, var(--fs-color-primary) 35%) !important;
  border-radius: 7px !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
  opacity: 1 !important;
  transition: all 0.3s ease;
  border: 4px solid color-mix(in srgb, white 80%, var(--fs-color-primary) 20%) !important;
}
.slide-button .flickity-prev-next-button svg {
  display: none !important;
}
.slide-button .flickity-prev-next-button::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  display: inline-block;
  color: var(--fs-color-primary);
  font-size: 1.2rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.slide-button .flickity-prev-next-button:hover {
  background: color-mix(in srgb, white 40%, var(--fs-color-primary) 60%) !important;
  transform: translateY(-2px) !important;
}
.slide-button .flickity-prev-next-button.previous::before {
  content: "\f060";
}
.slide-button .flickity-prev-next-button.next::before {
  content: "\f061";
}

.banner-home {
  border-radius: 15px;
  overflow: hidden;
}
.banner-home .button.button-lightbg {
  margin-bottom: 20px !important;
}

@media (min-width: 850px) {
  .irasta-left .irasta-card {
    border-radius: 0;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='5,5 80,5 95,95 5,95' fill='black' stroke='black' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='5,5 80,5 95,95 5,95' fill='black' stroke='black' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }
  .irasta-center .irasta-card {
    border-radius: 0;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='5,5 95,5 80,95 20,95' fill='black' stroke='black' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='5,5 95,5 80,95 20,95' fill='black' stroke='black' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }
  .irasta-right .irasta-card {
    border-radius: 0;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='20,5 95,5 95,95 5,95' fill='black' stroke='black' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='20,5 95,5 95,95 5,95' fill='black' stroke='black' stroke-width='10' stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }
}
.section-irasta {
  padding: 70px 0;
  overflow: hidden; /* BẮT BUỘC: Giấu phần vát chéo thừa và chống scroll ngang */
}

.row-irasta {
  max-width: 1460px !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important; /* BẮT BUỘC: Đảm bảo 3 cột cao bằng nhau để khớp nét vát */
}

@media (min-width: 850px) {
  .row-irasta .col {
    padding: 0 !important;
    width: 33.3333% !important;
    max-width: 33.3333% !important;
    flex: 0 0 33.3333% !important;
  }
  /* KHỐI TRÁI */
  .irasta-left {
    z-index: 1;
    margin-right: -60px !important;
  }
  /* KHỐI GIỮA */
  .irasta-center {
    z-index: 3;
  }
  .irasta-center .irasta-card {
    margin: 0 !important;
  }
  /* KHỐI PHẢI */
  .irasta-right {
    z-index: 2;
    margin-left: -60px !important;
  }
}
.irasta-card {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--fs-color-primary);
  border-radius: 15px !important;
  isolation: isolate;
  border-color: color-mix(in srgb, white 40%, var(--fs-color-primary) 60%);
  border: solid 1px;
}

.irasta-card .box-text {
  z-index: 5;
  padding: 15px !important; /* Padding mặc định chung */
}

@media (min-width: 850px) {
  /* Khối trái: Cần né lề phải vì lề phải vát chéo và bị khối giữa đè lên */
  .irasta-left .box-text {
    text-align: left;
    padding-left: 25px !important;
    padding-right: 80px !important;
  }
  /* Khối giữa: Bị vát hẹp cả 2 bên đáy (20% -> 80%), cần bóp padding 2 bên rất rộng */
  .irasta-center .box-text {
    text-align: center;
    padding-left: 18% !important;
    padding-right: 18% !important;
    padding-bottom: 15px !important;
  }
  /* Khối phải: Cần né lề trái vì lề trái vát chéo và chui dưới khối giữa */
  .irasta-right .box-text {
    text-align: right;
    padding-left: 80px !important;
    padding-right: 25px !important;
  }
}
/* --- Các phần CSS còn lại giữ nguyên của bạn --- */
.irasta-card h4 {
  color: color-mix(in srgb, white 40%, var(--fs-color-secondary) 60%) !important;
  text-transform: uppercase;
}

.irasta-card p {
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 0;
  opacity: 0.95;
}

.irasta-card .box-image {
  position: relative;
  width: 100%;
  height: 100%;
}

.irasta-card .box-image img {
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  display: block;
}

.irasta-card .box-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(180deg, transparent 40%, color-mix(in srgb, transparent 70%, var(--fs-color-primary) 30%) 50%, var(--fs-color-primary) 75%) !important;
}

/* RESPONSIVE MOBILE */
@media (max-width: 849px) {
  .row-irasta {
    display: block !important;
  }
  .row-irasta .col {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 24px 0 !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .irasta-left .irasta-card,
  .irasta-center .irasta-card,
  .irasta-right .irasta-card {
    -webkit-mask-image: none !important; /* Xóa mask khi về mobile */
    mask-image: none !important;
    margin: 0 !important;
    border-radius: 16px !important;
  }
  .irasta-card .box-image img {
    height: 300px;
  }
  .irasta-card .box-text {
    padding: 20px !important;
    text-align: center !important;
  }
}
.post-sidebar, .sidebar-wrapper {
  border-left: unset !important;
}
.post-sidebar .widget-title, .sidebar-wrapper .widget-title {
  text-transform: uppercase;
  font-size: 1.4em;
  color: var(--fs-color-primary);
}
.post-sidebar .flatsome_recent_posts, .sidebar-wrapper .flatsome_recent_posts {
  margin-top: 30px;
}
.post-sidebar .is-divider, .sidebar-wrapper .is-divider {
  display: none;
}
.post-sidebar .recent-blog-posts, .sidebar-wrapper .recent-blog-posts {
  align-items: center !important;
}
.post-sidebar .recent-blog-posts a, .sidebar-wrapper .recent-blog-posts a {
  margin-bottom: 0;
  font-size: 0.9em;
}
.post-sidebar .recent-blog-posts-li, .sidebar-wrapper .recent-blog-posts-li {
  border-top: unset !important;
}
.post-sidebar .recent-blog-posts-li .badge, .sidebar-wrapper .recent-blog-posts-li .badge {
  height: 5em;
  width: 5em;
  border-radius: 6px;
  overflow: hidden;
}
.post-sidebar .flex-grow a, .sidebar-wrapper .flex-grow a {
  font-weight: 600;
  color: black;
}
.post-sidebar .flex-grow a:hover, .sidebar-wrapper .flex-grow a:hover {
  color: var(--fs-color-primary);
}
.post-sidebar .custom-recent-posts-widget, .sidebar-wrapper .custom-recent-posts-widget {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 5px 0;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item {
  display: flex;
  align-items: flex-start;
  gap: 15px;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item .custom-post-thumb img, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item .custom-post-thumb img {
  width: 90px !important;
  height: 90px !important;
  object-fit: cover;
  border-radius: 10px !important;
  display: block;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item .custom-post-info, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item .custom-post-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-date, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-date {
  font-size: 13px;
  color: #999999;
  font-weight: 500;
  line-height: 1.2;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-title, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-title {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-title a, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-title a {
  color: #333333 !important;
  transition: color 0.2s ease;
}
.post-sidebar .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-title a:hover, .sidebar-wrapper .custom-recent-posts-widget .custom-post-item .custom-post-info .custom-post-title a:hover {
  color: var(--fs-color-primary) !important;
}

.section-new .ux-relay--pagination .row {
  row-gap: 10px;
}
.section-new .post-item .box-blog-post {
  display: flex;
  align-items: flex-start;
  gap: 25px;
  background: transparent;
}
.section-new .post-item .box-blog-post .box-image .image-cover {
  border-radius: 12px;
  overflow: hidden;
}
.section-new .post-item .box-blog-post .box-text {
  padding: 0 !important;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner {
  display: flex !important;
  flex-direction: column;
  gap: 3px;
  /* ==========================================================================
     LOGIC ĐẨY NGÀY THÁNG THẬT (.post-meta) LÊN SONG SONG VỚI DANH MỤC (.cat-label)
     ========================================================================== */
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .cat-label {
  order: 1;
  display: inline-block;
  margin-bottom: 0;
  color: #000000;
  text-transform: capitalize;
  font-weight: 500;
  float: left;
  font-size: 0.9em;
  margin-right: 5px;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .cat-label::after {
  content: "|";
  margin-left: 5px;
  color: #000000;
  font-weight: 600;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .post-meta {
  order: 2;
  display: inline-block !important;
  margin-top: 0;
  margin-bottom: 0;
  color: #000000;
  font-weight: 400;
  text-transform: none;
  position: relative;
  top: -20px;
  margin-left: 100px !important;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .post-title {
  order: 3;
  margin-top: -12px;
  margin-bottom: 4px;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .post-title a {
  color: #333333;
  font-weight: 700;
  line-height: 1.35;
  transition: color 0.2s ease;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .post-title a:hover {
  color: var(--fs-color-primary);
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .from_the_blog_excerpt {
  order: 4;
  color: #666666;
  line-height: 1.5;
  margin-bottom: 10px;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button {
  position: relative !important;
  overflow: hidden;
  text-transform: none;
  isolation: isolate;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background-color: var(--fs-color-primary);
  border-radius: 50px;
  transition: width 0.4s ease-in-out;
  z-index: -1 !important;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button.is-outline {
  order: 5;
  align-self: flex-start;
  border-radius: 50px;
  background-color: color-mix(in srgb, transparent 95%, var(--fs-color-primary) 5%) !important;
  padding: 4px 20px;
  box-shadow: none;
  transition: all 0.3s ease;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button.is-outline.primary {
  border: 1px solid var(--fs-color-primary);
  color: var(--fs-color-primary);
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button.is-outline.primary:hover {
  border-color: var(--fs-color-primary) !important;
  color: #ffffff !important;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button.is-outline.primary:hover::before {
  width: 100%;
}
.section-new .post-item .box-blog-post .box-text .blog-post-inner .button.is-outline:hover {
  background-color: transparent !important;
}
.section-new .post-item .is-divider {
  display: none !important;
}
.section-new .ux-relay__control {
  padding-top: 30px !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 10px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  flex-wrap: wrap !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers li {
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .page-number, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .page-numbers, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .dots, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-prev, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-next {
  height: 35px !important;
  min-width: 35px !important;
  padding: 0 10px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 14px !important;
  font-weight: bold !important;
  color: var(--fs-color-primary) !important;
  text-decoration: none !important;
  transition: all 0.2s ease-in-out !important;
  cursor: pointer !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .page-number.current, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .page-number:hover, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .page-numbers.current, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .page-numbers:hover, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .dots.current, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .dots:hover, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-prev.current, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-prev:hover, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-next.current, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-next:hover {
  background: var(--fs-color-primary) !important;
  color: #ffffff !important;
  border-color: var(--fs-color-primary) !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .prev, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .next, .section-new .ux-relay__control .ux-relay__pagination.page-numbers .last {
  width: auto !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .prev::before {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  content: "\f104" !important;
  margin-right: 6px !important;
  font-size: 13px !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .next::after {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  content: "\f105" !important;
  margin-left: 6px !important;
  font-size: 13px !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .last::after {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  content: "\f101" !important;
  margin-left: 6px !important;
  font-size: 12px !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-prev::before {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  content: "\f060" !important;
  font-size: 13px !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .skip-next::before {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  content: "\f061" !important;
  font-size: 13px !important;
}
.section-new .ux-relay__control .ux-relay__pagination.page-numbers .icon-angle-right {
  display: none !important;
}

.blog-single .entry-title {
  color: var(--fs-color-primary);
  margin-bottom: 0;
}
.blog-single .entry-divider.is-divider {
  display: none !important;
}
.blog-single img {
  border-radius: 15px !important;
  overflow: hidden;
}

.section-banner-product {
  position: relative !important;
  padding: 0 !important;
  overflow: visible !important;
  z-index: 9 !important;
  /* ==========================================================================
     1. BOX-SHADOW ĐÁY BANNER
     ========================================================================== */
  box-shadow: 0 16px 24px -10px color-mix(in srgb, var(--fs-color-primary) 100%, transparent), 0 40px 60px -15px color-mix(in srgb, var(--fs-color-primary) 85%, transparent), 0 90px 120px -20px color-mix(in srgb, var(--fs-color-primary) 60%, transparent) !important;
}
.section-banner-product .section-content {
  padding: 0 !important;
}
.section-banner-product .section-content .banner {
  height: auto !important;
  aspect-ratio: 1920/600 !important;
  padding-top: 0 !important;
  background-color: transparent !important;
}
.section-banner-product .section-content .banner .banner-bg {
  background-image: none !important;
  background: radial-gradient(circle at 50% 100%, #a3d6f8 0%, #a3d6f8 15%, #7cbeee 15%, #7cbeee 30%, #59a7e7 30%, #59a7e7 45%, #4ea1e4 45%, #4ea1e4 60%, #2484d7 60%, #2484d7 75%, #1871be 75%, #1871be 90%, #1265ab 90%) !important;
  transform: none !important;
  clip-path: none !important;
  border-radius: 0 !important;
}
.section-banner-product .section-content .banner {
  /* Đè (override) toàn bộ các lớp bọc mặc định của Flatsome để không bị ép padding */
}
.section-banner-product .section-content .banner .banner-inner,
.section-banner-product .section-content .banner .banner-inner .container,
.section-banner-product .section-content .banner .banner-inner .container .row,
.section-banner-product .section-content .banner .banner-inner .container .row .col {
  position: absolute !important;
  inset: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.section-banner-product .section-content .banner {
  /* ==========================================================================
     2. HỆ THỐNG HIỂN THỊ LỚP (Z-INDEX)
     ========================================================================== */
}
.section-banner-product .section-content .banner .banner-layers {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 10 !important;
}
.section-banner-product .section-content .banner .banner-layers .text-box-text {
  position: absolute !important;
  left: 15% !important;
  top: 20% !important;
  transform: translateY(-50%) !important;
  width: 35% !important;
  z-index: 99 !important;
}
.section-banner-product .section-content .banner .banner-layers .text-box-text .text-inner {
  color: #ffffff !important;
}
.section-banner-product .section-content .banner .banner-layers .text-box-text h3, .section-banner-product .section-content .banner .banner-layers .text-box-text p, .section-banner-product .section-content .banner .banner-layers .text-box-text span, .section-banner-product .section-content .banner .banner-layers .text-box-text strong {
  color: #ffffff !important;
}
.section-banner-product .section-content .banner .banner-layers .text-box-text span, .section-banner-product .section-content .banner .banner-layers .text-box-text p {
  position: relative;
  display: inline-block;
  padding-bottom: 8px;
}
.section-banner-product .section-content .banner .banner-layers .text-box-text span::after, .section-banner-product .section-content .banner .banner-layers .text-box-text p::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.6);
}
.section-banner-product .section-content .banner .banner-layers .text-box-img {
  position: absolute !important;
  left: 50% !important;
  /* THAY BOTTOM THÀNH TOP */
  top: 0 !important;
  bottom: auto !important;
  transform: translate(-50%, -5%) !important;
  width: auto !important;
  height: 100% !important;
  max-height: 100% !important;
  z-index: 50 !important;
}
.section-banner-product .section-content .banner .banner-layers .text-box-img .img-inner {
  height: 100% !important;
  background-color: transparent !important;
  display: flex !important;
  align-items: flex-start !important;
}
.section-banner-product .section-content .banner .banner-layers .text-box-img .img-inner img {
  width: auto !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

/* ==========================================================================
   TỐI ƯU RESPONSIVE TRÊN DI ĐỘNG (MOBILE)
   ========================================================================== */
@media (max-width: 767px) {
  .section-banner-product {
    box-shadow: 0 10px 20px rgba(12, 55, 100, 0.18) !important;
  }
  .section-banner-product .section-content .banner {
    padding-top: 130% !important;
  }
  .section-banner-product .section-content .banner .banner-bg {
    background: radial-gradient(circle at 50% 100%, #a3d6f8 0%, #a3d6f8 20%, #7cbeee 20%, #7cbeee 40%, #59a7e7 40%, #59a7e7 55%, #4ea1e4 55%, #4ea1e4 70%, #2484d7 70%, #2484d7 85%, #1871be 85%, #1871be 95%, #1265ab 95%) !important;
  }
  .section-banner-product .section-content .banner .banner-layers {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 40px 20px 0 20px !important;
  }
  .section-banner-product .section-content .banner .banner-layers .text-box-text {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    transform: none !important;
    width: 100% !important;
    text-align: center;
    margin-bottom: 20px;
    z-index: 99 !important;
  }
  .section-banner-product .section-content .banner .banner-layers .text-box-img {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    transform: none !important;
    z-index: 50 !important;
    width: 80% !important;
    margin-top: auto;
  }
}
.product-small.box {
  background-color: transparent !important;
  box-shadow: none !important;
  transition: all 0.95s ease;
}
.product-small.box .box-image {
  border-radius: 16px !important;
  overflow: hidden !important;
  background-color: #f5f5f5;
}
.product-small.box .box-image .image-zoom, .product-small.box .box-image a, .product-small.box .box-image img {
  border-radius: 16px !important;
  object-fit: cover;
  width: 100%;
  height: auto;
}
.product-small.box .box-text-products {
  padding: 12px 0 0 0 !important;
  height: auto !important;
}
.product-small.box .box-text-products .title-wrapper {
  padding-bottom: 12px !important;
  margin-bottom: 12px !important;
  border-bottom: 1px solid var(--fs-color-primary) !important;
  height: auto !important;
}
.product-small.box .box-text-products .title-wrapper .product-cat {
  color: var(--fs-color-primary) !important;
  text-transform: capitalize !important;
  font-weight: 500 !important;
  opacity: 1 !important;
  margin-bottom: 4px !important;
}
.product-small.box .box-text-products .title-wrapper .product-title {
  height: auto !important;
  margin: 0 !important;
}
.product-small.box .box-text-products .title-wrapper .product-title a {
  text-transform: uppercase;
  color: var(--fs-color-secondary) !important;
  font-weight: bold !important;
  line-height: 1.5em; /* Đặt chiều cao dòng */
  min-height: 3em; /* Đặt chiều cao tối thiểu cho 2 dòng */
  display: -webkit-box;
  -webkit-line-clamp: 2; /* Hiển thị tối đa 2 dòng */
  -webkit-box-orient: vertical;
  overflow: hidden; /* Ẩn nội dung thừa nếu có */
  white-space: normal;
}
.product-small.box .box-text-products .title-wrapper .product-title a:hover {
  color: var(--fs-color-primary) !important;
}
.product-small.box .box-text-products .price-wrapper {
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.product-small.box .box-text-products .price-wrapper .price {
  display: block !important;
  width: 100% !important;
  background-color: var(--fs-color-primary) !important;
  padding: 10px 15px !important;
  border-radius: 10px !important;
  text-align: center !important;
  transition: background 0.2s ease;
  opacity: 0.5;
}
.product-small.box .box-text-products .price-wrapper .price .woocommerce-Price-amount {
  color: #ffffff !important;
  font-weight: bold !important;
  font-size: 16px !important;
  letter-spacing: 0.5px;
}
.product-small.box .box-text-products .price-wrapper .price .woocommerce-Price-amount bdi, .product-small.box .box-text-products .price-wrapper .price .woocommerce-Price-amount span {
  color: #ffffff !important;
}
.product-small.box:hover .price {
  opacity: 1 !important;
}

.single-product .section-banner-product .text-box-text {
  display: none !important;
}
.single-product .product-page-title.page-title {
  background: transparent !important;
  padding: 90px 0 0 0 !important;
  min-height: auto !important;
  box-shadow: none !important;
  border: none !important;
  z-index: 999;
}
.single-product .product-page-title.page-title .page-title-bg,
.single-product .product-page-title.page-title .title-overlay,
.single-product .product-page-title.page-title .is-large {
  display: none !important;
}
.single-product .product-page-title.page-title .page-title-inner {
  min-height: auto !important;
  padding: 0 !important;
  justify-content: flex-start !important;
}
.single-product .product-page-title.page-title .page-title-inner .flex-col {
  display: none !important;
}
.single-product .product-page-title.page-title .page-title-inner .flex-col.flex-center {
  display: block !important;
  flex: 1 !important;
  text-align: left !important;
  padding: 0 !important;
}
.single-product .product-page-title.page-title h1.product-title {
  color: var(--fs-color-secondary) !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
  letter-spacing: -0.5px;
}
.single-product form.cart {
  display: none !important;
}
.single-product .product-footer .entry-content h4 {
  color: var(--fs-color-primary);
}
.single-product .product-footer .entry-content h5 {
  color: var(--fs-color-secondary);
}
.single-product .product-main .woocommerce-product-gallery__image, .single-product .product-main .flickity-slider > .col a {
  border-radius: 12px;
  overflow: hidden;
}
.single-product .product-info .product-short-description h3, .single-product .product-info .product-short-description h4 {
  color: var(--fs-color-primary);
}
.single-product .product-info .price-wrapper {
  margin-top: 40px;
}
.single-product .product-info .price-wrapper .woocommerce-Price-amount {
  font-weight: 600 !important;
  position: relative;
  overflow: hidden;
  color: var(--fs-color-secondary);
  text-transform: uppercase;
  overflow: hidden;
  white-space: nowrap;
  border-radius: 12px !important;
  padding: 12px 34px;
  background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, #fff 70%, var(--fs-color-secondary) 30%) 50%, color-mix(in srgb, #fff 60%, var(--fs-color-secondary) 40%) 65%, color-mix(in srgb, #fff 50%, var(--fs-color-secondary) 50%) 85%) !important;
}
.single-product .related-products-wrapper .product-section-title {
  color: var(--fs-color-primary);
  text-transform: capitalize;
}
.single-product .product-gallery .product-images {
  width: 100% !important;
}
.single-product .product-gallery .product-images .flickity-viewport {
  aspect-ratio: 6/6 !important;
  height: auto !important;
}
.single-product .product-gallery .product-images {
  /* 2. CẤU HÌNH TỪNG CELL SLIDE */
}
.single-product .product-gallery .product-images .woocommerce-product-gallery__image {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}
.single-product .product-gallery .product-images .woocommerce-product-gallery__image a {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  height: 100% !important;
}
.single-product .product-gallery .product-images .woocommerce-product-gallery__image {
  /* 3. XỬ LÝ ẢNH ĐỂ KHÔNG BỊ PHÌNH HOẶC BỊ BÓP MÉO TRONG KHUNG 16:9 */
}
.single-product .product-gallery .product-images .woocommerce-product-gallery__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}
.single-product .product-gallery {
  /* 4. ĐẢM BẢO CÁC NÚT ĐIỀU HƯỚNG VÀ CHẤM TRÒN SLIDER NẰM ĐÚNG VỊ TRÍ */
}
.single-product .product-gallery .flickity-prev-next-button {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.absolute-footer {
  display: none;
}

.section-footer {
  background: linear-gradient(color-mix(in srgb, #fff 35%, var(--fs-color-primary) 65%) 20%, color-mix(in srgb, #fff 20%, var(--fs-color-primary) 80%) 50%, color-mix(in srgb, #fff 10%, var(--fs-color-primary) 90%) 75%, var(--fs-color-primary) 100%) !important;
}
.section-footer p {
  margin-bottom: 10px;
}
.section-footer .col:nth-child(1)::after,
.section-footer .col:nth-child(2)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 1px;
  height: 150px;
  background: rgba(255, 255, 255, 0.2);
}
.section-footer .col:nth-child(2) .col-inner, .section-footer .col:nth-child(3) .col-inner {
  padding: 0 30px;
}
.section-footer {
  /* Mobile tắt */
}
@media (max-width: 767px) {
  .section-footer .col::after {
    display: none;
  }
  .section-footer .col:nth-child(2) .col-inner, .section-footer .col:nth-child(3) .col-inner {
    padding: 0;
  }
}
.section-footer .ux-menu .ux-menu-link__link {
  min-height: 1em;
  position: relative;
  display: flex;
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
  border-bottom-style: unset !important;
  padding-top: 0;
}
.section-footer .ux-menu .ux-menu-link__link::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: 0;
  background-color: var(--fs-color-secondary);
  transition: width 0.5s ease;
}
.section-footer .ux-menu .ux-menu-link__link:hover {
  color: var(--fs-color-secondary) !important;
  font-weight: bold;
}
.section-footer .ux-menu .ux-menu-link__link:hover::before {
  width: 100%;
}

.back-to-top.button {
  color: var(--fs-color-primary);
  border-color: var(--fs-color-primary);
  background: white !important;
  border: none !important;
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.45);
  line-height: 40px !important;
}
.back-to-top.button:hover {
  color: white;
  background: var(--fs-color-primary) !important;
}