@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
*/
.col-icon-header .col-inner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 20px;
}
.col-icon-header .col-inner * {
  color: var(--fs-color-primary);
}

.header-vertical-menu .header-vertical-menu__fly-out--open {
  opacity: 0;
}

.header-main .search-field {
  border-radius: 5px 0 0 5px;
}

@media (max-width: 1278px) {
  .header-main .col-phone-header .icon-box-text {
    display: none !important;
  }
}
.header-bottom {
  background-color: var(--fs-color-primary) !important;
}
.header-bottom .header-vertical-menu__opener {
  background-color: var(--fs-color-secondary);
}
.header-bottom .container {
  padding-left: 0;
  padding-right: 30px;
}
@media (max-width: 768px) {
  .header-bottom .container {
    padding-right: 15px;
  }
}
.header-bottom .nav > li {
  margin: 0 18px;
}
.header-bottom .nav > li > a {
  color: white;
  position: relative;
}
.header-bottom .nav > li > a::after {
  content: "";
  width: 0%;
  height: 2px;
  background-color: white;
  transition: all 0.3s;
  position: absolute;
  bottom: 0;
}
.header-bottom .nav > li > a:hover::after {
  width: 100%;
}
.header-bottom .nav > li > a:hover, .header-bottom .nav > li.current-menu-item > a {
  color: white;
}
.header-bottom .nav > li > a:hover::after, .header-bottom .nav > li.current-menu-item > a::after {
  width: 100%;
}

.nav-dropdown {
  border-bottom: 3px solid var(--fs-color-primary);
  padding: 0 !important;
  box-shadow: color-mix(in srgb, var(--fs-color-primary) 30%, black 70%) !important;
  background-image: url(/wp-content/uploads/2025/09/dark-brick-wall.png);
  background-color: color-mix(in srgb, black 40%, var(--fs-color-primary) 60%);
  border-color: var(--fs-color-primary);
  border-radius: 0 0 10px 10px;
  min-width: 300px !important;
}
.nav-dropdown li.active > a {
  color: white !important;
  background-color: var(--fs-color-primary);
}
.nav-dropdown li > a {
  border-bottom: none !important;
  color: color-mix(in srgb, white 70%, var(--fs-color-primary) 30%);
  padding: 10px !important;
  margin: 0 !important;
}
.nav-dropdown li > a::before {
  content: "\f568";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: white;
  font-size: 0;
  display: inline;
  transition: all 0.3s;
}
.nav-dropdown li > a:hover {
  color: white !important;
  background: color-mix(in srgb, var(--fs-color-primary) 80%, transparent);
}
.nav-dropdown li > a:hover::before {
  font-size: 16px;
  margin-right: 10px;
}

.gtranslate_wrapper .glink {
  padding-left: 20px;
}

.page-header .title-breadcrumbs {
  padding-bottom: 0;
}
.page-header .breadcrumbs {
  font-weight: 500 !important;
  font-size: 1.7em;
}
.page-header .entry-title {
  text-transform: uppercase;
  font-size: 2.8em;
}

.customwp-title-wrapper .customwp-title-text {
  -webkit-text-stroke: 0.5px transparent; /* giữ viền mượt */
  text-shadow: 0 0 0.6px rgba(0, 0, 0, 0.15); /* thêm nhẹ để không bị rỗ mép */
}

.title-master-left .customwp-title-heading::after {
  content: "";
  display: block;
  margin-top: 16px;
  border-radius: 2px;
  background: var(--fs-color-primary);
  height: 3px;
  width: 92px;
  border-radius: 2px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--fs-color-primary) 25%, transparent), var(--fs-color-primary));
  animation: about-underline 3.6s ease-in-out infinite;
}

.title-master-center .customwp-title-heading::after {
  content: "";
  display: block;
  margin-top: 16px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 3px;
  width: 92px;
  border-radius: 2px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--fs-color-primary) 25%, transparent), var(--fs-color-primary));
  animation: about-underline 3.6s ease-in-out infinite;
}

@keyframes about-underline {
  0%, 100% {
    width: 92px;
    opacity: 0.95;
  }
  50% {
    width: 160px;
    opacity: 1;
  }
}
.section_pagecontact {
  background: color-mix(in srgb, var(--fs-color-primary) 10%, white);
}
.section_pagecontact .col-form {
  padding: 20px;
  background: linear-gradient(145deg, color-mix(in srgb, white 90%, var(--fs-color-primary) 10%), #ffffff);
  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%);
  border-radius: 10px;
}
.section_pagecontact .col-form P {
  margin-bottom: 0.9em;
}
.section_pagecontact .flex-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
@media (max-width: 767px) {
  .section_pagecontact .flex-row {
    gap: 0 !important;
  }
}
.section_pagecontact .flex-row .wpcf7-form-control-wrap {
  flex: 1;
  min-width: 200px;
}
.section_pagecontact .wpcf7 form .wpcf7-form-control:not([type=submit]) {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid transparent !important;
  border-radius: 7px;
  opacity: 0.6;
  background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, var(--fs-color-primary), var(--fs-color-secondary));
  background-origin: border-box;
  background-clip: padding-box, border-box;
  transition: box-shadow 0.2s ease, background-image 0.25s ease;
  box-shadow: none !important;
  outline: none;
}
.section_pagecontact .wpcf7 form .wpcf7-form-control:not([type=submit]):focus {
  background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, var(--fs-color-secondary), var(--fs-color-primary));
  box-shadow: 0 0 0 4px rgba(var(--fs-color-secondary), 0.2);
}
.section_pagecontact .wpcf7 form select.wpcf7-form-control {
  appearance: none;
  -webkit-appearance: none;
  border: 2px solid transparent !important;
  border-radius: 10px;
  padding: 12px 38px 12px 14px;
  background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, var(--fs-color-primary), var(--fs-color-secondary));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}
.section_pagecontact .wpcf7 form select.wpcf7-form-control:focus {
  background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, var(--fs-color-secondary), var(--fs-color-primary));
  box-shadow: 0 0 0 4px rgba(var(--fs-color-primary), 0.2);
}
.section_pagecontact .wpcf7 .wpcf7-spinner {
  display: none;
}
.section_pagecontact .icon-box {
  display: flex;
  align-items: center;
}
.section_pagecontact .icon-box p {
  margin-bottom: 0 !important;
}
.section_pagecontact .icon-box .icon {
  background: white;
  padding: 10px;
  width: 55px;
  height: 55px;
  border-radius: 50%;
}
.section_pagecontact .icon-box .icon svg {
  padding-top: 0 !important;
  fill: var(--fs-color-primary);
  color: var(--fs-color-primary);
}
.section_pagecontact .icon-box .icon-box-text {
  padding-left: 2em !important;
}
.section_pagecontact .button-row {
  display: flex;
  gap: 10px;
  margin-top: 10px;
  justify-content: center;
}
.section_pagecontact .wpcf7 .wpcf7-submit {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  padding: 0px 20px;
  background: linear-gradient(135deg, var(--fs-color-primary) 0%, color-mix(in srgb, var(--fs-color-primary) 50%, var(--fs-color-secondary) 50%) 50%, var(--fs-color-secondary) 100%);
  background-size: 130% 100%;
  color: white;
  background-position: left bottom;
  border-radius: 15px !important;
  white-space: nowrap;
  transition: background-position 0.9s ease;
  width: auto !important;
  overflow: hidden;
  z-index: 1;
  text-transform: unset;
}
.section_pagecontact .wpcf7 .wpcf7-submit:hover {
  background-position: right bottom;
  background-color: white !important;
  color: white !important;
  box-shadow: unset;
}
.section_pagecontact .wpcf7 .wpcf7-submit:hover i::before {
  transform: rotate(360deg);
}
.section_pagecontact .wpcf7 .wpcf7-submit i::before {
  font-family: "Font Awesome 6 Free";
  content: "\f061";
  font-weight: 900;
  display: inline-block;
  transition: transform 0.3s ease;
  transform: rotate(315deg);
  margin-left: 8px;
  margin-bottom: -1px;
}

.home-reviews .flickity-viewport {
  overflow: visible;
}
.home-reviews .flickity-slider {
  padding-bottom: 80px;
}
.home-reviews .flickity-slider > .row {
  margin-bottom: 80px;
}
.home-reviews .flickity-slider > .row:not(.is-selected) {
  opacity: 1;
  transform: translateY(80px);
}
.home-reviews .flickity-slider > .row.is-selected > .col > .col-inner::after {
  background-color: var(--fs-color-primary);
  color: #fff;
}
.home-reviews .col > .col-inner {
  border-radius: 24px;
  background: linear-gradient(145deg, color-mix(in srgb, white 90%, var(--fs-color-primary) 10%), #ffffff);
  margin-top: 70px;
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff;
  padding: 40px 40px 50px 40px;
}
.home-reviews .col > .col-inner::after {
  content: "\f10d"; /* mã icon: fa-comment-dots */
  font-family: "Font Awesome 6 Free";
  font-weight: 900; /* solid icon */
  font-size: 34px;
  text-align: center;
  line-height: 2;
  color: var(--fs-color-primary);
  display: block;
  background-color: #fff;
  width: 78px;
  height: 78px;
  border-radius: 99px;
  border: 5px solid #fff;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -40px;
  margin: auto;
  transition-duration: 0.4s;
}
.home-reviews .testimonial-box {
  margin-bottom: 15px;
  margin-top: 40px;
}
.home-reviews .icon-box-text .star-rating {
  font-size: 22px;
}
.home-reviews .icon-box-text .star-rating span:before {
  color: #f4ab37;
}
.home-reviews .icon-box-img.testimonial-image {
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff;
  position: absolute;
  top: -60px;
  left: 50%;
  transform: translateX(-50%);
}
.home-reviews .icon-box-img.testimonial-image img {
  padding-top: 0;
}
.home-reviews .testimonial-meta {
  line-height: 1.4;
}
.home-reviews .testimonial-meta .testimonial-name {
  display: block;
  font-size: 25px;
  color: var(--fs-color-primary);
}
.home-reviews .testimonial-meta .testimonial-name-divider {
  display: none;
}
.home-reviews .testimonial-meta .testimonial-company {
  font-size: 20px;
  font-style: italic;
  opacity: 0.8;
}
.home-reviews .review-content {
  font-size: 20px;
  font-weight: 500;
}

.section-danhgia {
  background: color-mix(in srgb, var(--fs-color-primary) 10%, white);
}

.about-banner img {
  border-radius: 24px;
  border: 5px solid #fff;
}

.moving-x {
  border-radius: 24px;
  background-color: white;
  -webkit-animation: movingX 8s linear infinite;
  animation: movingX 8s linear infinite;
}
.moving-x img {
  border: 5px solid white;
}

@keyframes movingX {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.section-vision-mission {
  box-shadow: color-mix(in srgb, var(--fs-color-primary) 30%, black 70%) !important;
  background-image: url(/wp-content/uploads/2025/10/diagmonds.webp);
  background-color: color-mix(in srgb, transparent 30%, var(--fs-color-primary) 70%) !important;
  background-attachment: fixed; /* cảm giác cao cấp khi cuộn */
}
.section-vision-mission .icon-light .title-master-left h3::after, .section-vision-mission .corre.title-master-center .customwp-title-heading::after {
  background: white !important;
}
.section-vision-mission .row-vision-mission .col-vision-mission .col-mission .col-inner {
  padding: 20px;
  background: color-mix(in srgb, var(--fs-color-primary) 16%, rgba(255, 255, 255, 0.7294117647));
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.section-vision-mission .row-vision-mission .col-vision-mission .col-vission .col-inner {
  padding: 20px;
  margin-bottom: 30px;
  background: color-mix(in srgb, var(--fs-color-primary) 16%, rgba(255, 255, 255, 0.7294117647));
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.section-vision-mission .row-vision-mission .col-vision-mission p {
  color: var(--fs-color-primary) !important;
}
.section-vision-mission .row-vision-mission .col-corevalue .col-inner {
  padding: 20px;
  background: color-mix(in srgb, var(--fs-color-primary) 80%, transparent);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.section-vision-mission .row-vision-mission .col-corevalue .col-inner .customwp-title-heading::after {
  background: white !important;
}
.section-vision-mission .row-vision-mission .icon-dark {
  color: var(--fs-color-primary);
}
.section-vision-mission .row-vision-mission .icon-dark h3 {
  color: var(--fs-color-primary);
}
.section-vision-mission .row-vision-mission .title-master-left h3 {
  line-height: 1em;
}
.section-vision-mission .row-vision-mission .title-master-left h3::after {
  content: "";
  display: block;
  margin-top: 16px;
  border-radius: 2px;
  background: var(--fs-color-primary);
  height: 3px;
  width: 92px;
  border-radius: 2px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--fs-color-primary) 25%, transparent), var(--fs-color-primary));
  animation: about-underline 3.6s ease-in-out infinite;
}

@keyframes about-underline {
  0%, 100% {
    width: 92px;
    opacity: 0.95;
  }
  50% {
    width: 160px;
    opacity: 1;
  }
}
.section-faq .accordion .toggle {
  display: none;
}
.section-faq .accordion-title {
  transition: background-color 0.3s ease, padding-left 0.3s ease;
  cursor: pointer;
  padding-left: 20px;
}
.section-faq .accordion-title::before {
  content: "\f059"; /* fa-question-circle */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: var(--fs-color-secondary);
  margin-right: 8px;
  transition: transform 0.3s ease;
}
.section-faq .accordion-title.active::before {
  color: var(--fs-color-primary) !important;
}
.section-faq .accordion-title:hover {
  background-color: rgba(6, 80, 158, 0.05);
  padding-left: 12px;
}
.section-faq .accordion-title:hover::before, .section-faq .accordion-title:hover.active::before {
  color: var(--fs-color-primary) !important;
}

.img-radius {
  border-radius: 15px;
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
}
.img-radius:hover {
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff;
  transform: scale(1.07) translateY(-4px);
}

.title-style-left h4 {
  padding: 0px 10px;
  margin-bottom: 15px;
  border-left: 4px solid var(--fs-color-primary);
}

.section-overview .ux-menu-link__link {
  color: var(--fs-color-primary);
  font-weight: 600;
}
.section-overview .col-slide .col-inner {
  position: relative;
}

.slidehome {
  position: relative;
  z-index: 0;
  overflow: hidden;
  isolation: isolate; /* pseudo-layer blend không ảnh hưởng con */
  mask-image: linear-gradient(to right, transparent 0%, white 5%, white 95%, transparent 100%);
  /* Vignette trung tâm cho cảm giác cine */
  /* tránh các UA lạ */
  /* Hiệu ứng động nhẹ khi hover: như khe mở rộng */
  /* ===== Mobile: nhẹ tay bớt tối và bớt rộng “vách” ===== */
}
.slidehome .flickity-viewport {
  overflow: visible;
}
.slidehome .slider.slider-nav-simple {
  padding-top: 0;
}
.slidehome .flickity-slider > .img.is-selected .img-inner {
  transform: none;
  filter: none;
  overflow: hidden;
  transition: transform 0.6s ease, box-shadow 0.6s ease;
}
.slidehome .flickity-slider > .img {
  transition: opacity 0.5s ease-out, transform 0.5s ease-out, filter 0.5s ease-out;
  transform: scale(0.9);
  opacity: 0.7;
  filter: blur(1px); /* Làm mờ nhẹ */
}
.slidehome .flickity-slider > .img.is-selected {
  z-index: 10;
  transform: scale(1);
  opacity: 1;
  filter: none;
}
.slidehome .flickity-viewport {
  overflow: visible;
}
.slidehome .img-inner {
  border-radius: 12px !important;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.42) !important;
  transform: perspective(900px) translateZ(0);
  transition: transform 0.6s ease;
}
.slidehome::marker {
  content: none;
}
.slidehome:hover .img-inner {
  transform: perspective(900px) translateZ(0) scale(1.01);
}
.slidehome:hover::after {
  filter: contrast(110%) brightness(102%);
}
@media (max-width: 549.98px) {
  .slidehome::after {
    background-size: 12% 100%, 12% 100%, 12% 100%, 12% 100%, 12% 100%, 12% 100%;
    filter: contrast(102%) brightness(100%);
  }
  .slidehome .flickity-prev-next-button {
    width: 36px;
    height: 36px;
  }
}

.img-banner .img-inner {
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.54);
}

.section-services-home {
  background-image: url(/wp-content/uploads/2025/10/backsafdh.png);
  background-color: color-mix(in srgb, transparent 80%, var(--fs-color-primary) 20%);
  background-attachment: fixed;
  --radius: 7px;
  --shadow-h: 0 16px 38px rgba(0,0,0,.58);
  --overlay-dark: rgba(0,0,0,.55);
  --overlay-grad: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 38%, rgba(0,0,0,.65) 100%);
  --btn-bg: color-mix(in srgb, var(--fs-color-primary) 92%, #fff);
  --btn-tx: #fff;
  /* Ảnh full card theo tỷ lệ, không chừa khoảng trắng */
  /* overlay gradient để chữ nổi rõ */
  /* Text area đặt đè trên ảnh – sát mép dưới */
  /* Ẩn cat label mặc định */
  /* Tiêu đề */
  /* CTA pill */
  /* Hover card */
  /* --- Responsive --- */
}
.section-services-home .box.box-blog-post {
  position: relative;
  border-radius: var(--radius);
  overflow: clip; /* mượt hơn hidden */
  background: #000; /* tránh nháy trắng khi ảnh load */
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.54);
  transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
}
.section-services-home .box.box-blog-post .box-image {
  position: relative;
  z-index: 1; /* dưới text */
}
.section-services-home .box.box-blog-post .box-image .overlay {
  position: absolute;
  inset: 0;
  background: var(--overlay-grad) !important;
  opacity: 1 !important;
  mix-blend-mode: normal;
}
.section-services-home .box.box-blog-post .box-text {
  position: absolute;
  inset-inline: 18px; /* left & right */
  bottom: 18px;
  z-index: 2;
  background: none !important;
  padding: 0 !important;
  text-align: left !important;
  color: #fff;
}
.section-services-home .box.box-blog-post .cat-label {
  color: white !important;
  opacity: 1;
}
.section-services-home .box.box-blog-post .post-title {
  margin: 0 0 12px;
  font-size: clamp(20px, 1.6vw, 24px);
  font-weight: 800;
  line-height: 1.22;
  letter-spacing: 0.2px;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.section-services-home .box.box-blog-post .post-title a.plain {
  color: #fff;
  text-decoration: none;
}
.section-services-home .box.box-blog-post .button.is-underline {
  padding-bottom: 10px;
  margin: 0;
  color: #fff;
  text-transform: none;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.section-services-home .box.box-blog-post .button.is-underline:hover {
  transform: translateY(-1px);
  background: color-mix(in srgb, var(--fs-color-primary) 48%, transparent);
  border-color: #fff;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24);
}
.section-services-home .box.box-blog-post:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-h);
}
.section-services-home .box.box-blog-post:hover .box-image img {
  transform: scale(1.07);
}
@media (max-width: 1024px) {
  .section-services-home .box.box-blog-post .box-text {
    inset-inline: 16px;
    bottom: 16px;
  }
}
@media (max-width: 767.98px) {
  .section-services-home .box.box-blog-post .post-title {
    font-size: clamp(18px, 5.2vw, 22px);
  }
  .section-services-home .box.box-blog-post .button.is-underline {
    padding: 9px 14px;
  }
}

.section-product-blog .box.box-blog-post {
  border: 0;
  box-shadow: none;
  background: #fff;
  transition: 0.25s ease;
}
.section-product-blog .box.box-blog-post:hover {
  transform: translateY(-4px);
}
.section-product-blog .box.box-blog-post .box-image img {
  width: 100%;
  object-fit: cover;
  transition: 0.5s ease;
}
.section-product-blog .box.box-blog-post:hover .box-image img {
  transform: scale(1.03);
}
.section-product-blog .cat-label {
  display: inline-block;
  background: var(--fs-color-primary, #b87944);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 3px;
  text-transform: uppercase;
}
.section-product-blog .post-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #333;
  margin: 4px 0;
}
.section-product-blog .post-title a {
  color: inherit;
  text-decoration: none;
}
.section-product-blog .post-title a:hover {
  color: var(--fs-color-primary);
}
.section-product-blog img {
  border-radius: 7px;
}
.section-product-blog .button, .section-product-blog .read-more {
  background: none;
  border: 0;
  color: var(--fs-color-primary, #b87944);
  font-style: italic;
  font-size: 15px;
  font-weight: 500;
  margin-top: 0 !important;
  padding: 0;
  text-transform: lowercase;
  border-left: 1px solid var(--fs-color-primary);
  transition: color 0.2s ease;
}
.section-product-blog .button:hover, .section-product-blog .read-more:hover {
  color: color-mix(in srgb, var(--fs-color-primary) 80%, black);
}

@media (min-width: 850px) {
  .section-custom .row.large-columns-3.medium-columns-2.small-columns-1 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .section-custom .row.large-columns-3.medium-columns-2.small-columns-1 > .col {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  .section-custom .row.large-columns-3.medium-columns-2.small-columns-1 > .col.post-item:first-child {
    grid-column: span 2;
  }
  .section-custom .row.large-columns-3.medium-columns-2.small-columns-1 > .col.post-item:first-child .box-image .image-cover {
    padding-top: 27% !important; /* 2.63:1 – chỉnh 36–42% tuỳ ý */
  }
  .section-custom .row.large-columns-3.medium-columns-2.small-columns-1 > .col.post-item:not(:first-child) .box-image .image-cover {
    padding-top: 56.25% !important;
  }
}
.post-sidebar .widget-title {
  text-transform: none;
  font-size: 1.4em;
}
.post-sidebar .recent-blog-posts {
  align-items: center !important;
}
.post-sidebar .recent-blog-posts-li .badge {
  height: 5em;
  width: 5em;
  border-radius: 6px;
  overflow: hidden;
}
.post-sidebar .flex-grow a {
  font-weight: 600;
  color: black;
}
.post-sidebar .flex-grow a:hover {
  color: var(--fs-color-primary);
}

.post-sidebar.col {
  padding-left: 0 !important;
}

.widget {
  padding: 30px;
  border-radius: 8px;
  border: 1px dashed var(--fs-color-primary);
  margin-bottom: 40px !important;
}
.widget .widget-title {
  font-size: 24px;
  color: var(--fs-color-primary);
}
.widget .is-divider {
  max-width: 100%;
  background-color: #E9EDF5;
  position: relative;
}
.widget .is-divider::before {
  content: "";
  width: 30px;
  height: 100%;
  display: inline;
  background-color: var(--fs-color-secondary);
  position: absolute;
  left: 0;
  bottom: 0;
}
.widget.widget_search {
  background-color: color-mix(in srgb, white 80%, var(--fs-color-primary) 20%);
  border: none;
}
.widget.widget_search input[type=search] {
  height: 56px;
  box-shadow: none;
  border: none;
  border-radius: 99px;
  padding-left: 20px;
  padding-right: 100px;
}
.widget.widget_search button {
  border-radius: 99px !important;
  width: 56px;
  height: 56px;
  border: none;
  min-width: 80px;
  text-align: center;
  position: absolute;
  right: 0;
  top: 0;
}
.widget.widget_search button:hover .icon-search {
  color: var(--fs-color-primary);
}
.widget .badge {
  width: 80px;
  height: 80px;
  border-radius: 4px;
  overflow: hidden;
}
.widget ul > li > a {
  font-size: 18px;
  color: var(--fs-color-primary);
}
.widget.widget_categories ul li {
  display: flex;
  flex-direction: row;
  padding: 15px 0;
}
.widget.widget_categories ul li a {
  padding: 0;
}
.widget .tagcloud a {
  font-size: 16px !important;
  background-color: color-mix(in srgb, white 80%, var(--fs-color-primary) 20%);
  padding: 5px 10px;
  border-radius: 4px;
  display: inline-flex;
  margin-bottom: 5px;
  transition: all 0.3s;
}
.widget .tagcloud a:hover {
  background-color: var(--fs-color-secondary);
  color: #fff;
}

.row-divided > .col + .col:not(.large-12) {
  border-left: none !important;
}

.box.box-blog-post .is-divider {
  display: none;
}

.section-blog .row.large-columns-1 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  justify-content: center;
  align-items: stretch;
  padding: 1rem 0;
}
@media (max-width: 1024px) {
  .section-blog .row.large-columns-1 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .section-blog .row.large-columns-1 {
    grid-template-columns: 1fr;
  }
}
.section-blog .post-item .box {
  position: relative;
  height: 100%;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  transition: all 0.35s ease;
  border: 1px solid rgba(0, 0, 0, 0.05);
  z-index: 0;
  /* Tạo link toàn vùng click */
}
.section-blog .post-item .box:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}
.section-blog .post-item .box a.plain {
  inset: 0;
}
.section-blog .box-image {
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  position: relative;
  z-index: 1;
}
.section-blog .box-image .image-cover {
  height: 100%;
}
.section-blog .box-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
  display: block;
}
.box:hover .section-blog .box-image img {
  transform: scale(1.08);
}
.section-blog .box-text {
  padding: 1rem 1.4rem 1.5rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  z-index: 2;
  position: relative;
}
.section-blog .box-text .post-title {
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.4;
  color: #222;
  margin-bottom: 0.6rem;
  transition: color 0.3s ease;
}
.section-blog .box-text .post-title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.section-blog .box-text p {
  font-size: 0.95rem;
  color: #555;
  margin-bottom: 0;
  position: relative;
  z-index: 3;
}
.section-blog .post-item .box::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.03));
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: inherit;
  z-index: 1;
  pointer-events: none; /* Không chặn click */
}
.section-blog .post-item .box:hover::after {
  opacity: 1;
}

.box-blog-post .from_the_blog_excerpt {
  margin: 0.25rem 0 1.1rem;
  font-size: clamp(0.95rem, 1.05vw, 1.05rem);
  line-height: 1.7;
  opacity: 0.96;
  /* gọn gàng, tránh tràn chữ quá dài */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.archive.category .post-item .col-inner {
  transition: all 0.3s ease;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 3px 3px 6px color-mix(in srgb, color-mix(in srgb, white 70%, var(--fs-color-primary) 30%) 30%, var(--fs-color-primary) 70%), -2px -2px 5px #ffffff;
  background: linear-gradient(145deg, color-mix(in srgb, white 90%, var(--fs-color-primary) 10%), #ffffff);
}
.archive.category .post-item .col-inner:hover {
  transform: scale(1.07) translateY(-4px);
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff;
  z-index: 2;
}
.archive.category .post-item .col-inner img {
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: 10px;
}
.archive.category .post-item .col-inner .box-blog-post {
  background: linear-gradient(145deg, color-mix(in srgb, white 90%, var(--fs-color-primary) 10%), #ffffff);
}
.archive.category .post-item .col-inner .box-blog-post .box-text .post-title a {
  line-height: 1.5em;
  font-size: 1.3em;
  min-height: 3em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
}
.archive.category .post-item .col-inner .box-blog-post .box-text .is-divider {
  display: none;
}

.single-post .entry-header-text .is-divider {
  margin-bottom: 0;
}
.single-post .blog-single {
  padding-bottom: 0;
}
.single-post .entry-content {
  padding-top: 0;
}
.single-post .entry-content #ft-toc h1, .single-post .entry-content #ft-toc h2, .single-post .entry-content #ft-toc h3 {
  color: var(--fs-color-primary) !important;
}
.single-post .entry-content #ft-toc li::marker {
  font-weight: bold;
}

.absolute-footer {
  display: none !important;
}

.section_footer {
  box-shadow: color-mix(in srgb, var(--fs-color-primary) 30%, black 70%) !important;
  background-image: url(/wp-content/uploads/2025/10/skulls.png);
  background-color: color-mix(in srgb, transparent 80%, var(--fs-color-primary) 20%);
}
.section_footer .text-copyright p {
  margin-bottom: 0 !important;
}
.section_footer .ux-menu .ux-menu-link__link {
  position: relative;
  display: flex;
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
  border-bottom-style: unset !important;
}
.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-primary);
  transition: width 0.5s ease;
}
.section_footer .ux-menu .ux-menu-link__link:hover {
  color: var(--fs-color-primary) !important;
  font-weight: bold;
}
.section_footer .ux-menu .ux-menu-link__link:hover::before {
  width: 100%;
}
.section_footer .ux-menu.link-menu .ux-menu-link__link .ux-menu-link__icon::before {
  font-family: "Font Awesome 6 Free";
  content: "\f061";
  font-weight: 900;
  display: inline-block;
  transition: transform 0.3s ease;
  transform: rotate(315deg);
  margin-left: 0.1em;
  margin-bottom: 1px;
}
.section_footer .ux-menu.link-menu .ux-menu-link__link:hover .ux-menu-link__icon::before {
  transform: rotate(360deg);
}

.icon-call .icon-inner svg {
  fill: var(--fs-color-primary);
  color: var(--fs-color-primary);
  animation: ringPhone 1.5s infinite;
  display: inline-block;
  font-size: 1.4em;
}

.button-call-zoom {
  border-radius: 20px !important;
  padding: 8px 24px;
  overflow: hidden;
  animation: pulseCall 2s infinite;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  margin-bottom: 1.4em !important;
}
.button-call-zoom:hover {
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff !important;
  transform: scale(1.05);
  color: var(--fs-color-primary) !important;
  border: solid 1px var(--fs-color-primary);
  background: white;
}
.button-call-zoom:hover .icon-phone::before {
  color: var(--fs-color-primary);
}
.button-call-zoom .icon-phone::before {
  fill: white;
  color: white;
  animation: ringPhone 1.5s infinite;
  display: inline-block;
  font-size: 1.4em;
}

@keyframes pulseCall {
  0% {
    box-shadow: 0 0 0 0 var(--fs-color-primary);
  }
  70% {
    box-shadow: 0 0 0 20px rgba(229, 53, 126, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(229, 53, 161, 0);
  }
}
@keyframes ringPhone {
  0% {
    transform: scale(1) rotate(0deg);
  }
  20% {
    transform: scale(1.2) rotate(15deg);
  }
  40% {
    transform: scale(1.3) rotate(-10deg);
  }
  60% {
    transform: scale(1.2) rotate(5deg);
  }
  80% {
    transform: scale(1.1) rotate(-3deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
  }
}
.social-icons.follow-icons.full-width.text-center {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px; /* khoảng cách giữa icon */
}

.social-icons.follow-icons.full-width.text-center::before,
.social-icons.follow-icons.full-width.text-center::after {
  content: "";
  flex: 1;
  height: 1px;
  background-color: #000; /* màu đường kẻ */
  opacity: 0.4;
  margin: 0 10px;
}

.social-icons a {
  width: 50px;
  height: 50px;
  line-height: 50px !important;
  text-align: center;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  border-radius: 6px !important;
  margin-right: 10px !important;
  box-shadow: 5px 5px 15px color-mix(in srgb, black 40%, var(--fs-color-primary) 60%), -5px -5px 15px #ffffff;
  background: linear-gradient(145deg, color-mix(in srgb, white 90%, var(--fs-color-primary) 10%), #ffffff);
  border: unset !important;
}
.social-icons a:hover {
  transform: translateY(-3px);
  background: linear-gradient(135deg, var(--fs-color-primary) 0%, color-mix(in srgb, var(--fs-color-primary) 50%, var(--fs-color-secondary) 50%) 50%, var(--fs-color-secondary) 100%);
}
.social-icons a:hover i::before {
  color: white !important;
}
.social-icons a i::before {
  color: black !important;
}

.button-cta-right {
  border-radius: 20px 0 0 20px !important;
  position: fixed !important;
  right: 0 !important;
  top: 50%;
  transform: translateY(-50%) !important;
  z-index: 999999 !important;
  cursor: pointer;
  writing-mode: vertical-rl; /* chữ chạy dọc từ trên xuống dưới */
  text-orientation: mixed; /* giữ chữ đứng thẳng */
  margin: 0 !important;
  padding: 25px 12px !important;
  box-shadow: inset 3px -2px 0 0 rgba(0, 0, 0, 0.3) !important;
}
.button-cta-right span {
  font-weight: 700 !important;
}
.button-cta-right .icon-envelop {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.button-cta-right .icon-envelop:before {
  content: "\f0e0"; /* FA6 Free: envelope */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #fff;
  display: inline-block;
  width: 22px;
  height: 22px;
  vertical-align: middle;
  transform: rotate(90deg);
}

.section-lbs-cares {
  /* token nhanh để chỉnh */
  --border: color-mix(in srgb, var(--primary-color) 58%, #0000004b);
  --radius: 15px;
  /* bảo đảm bằng chiều cao khi dùng align-equal của Flatsome */
  /* ===== Card ===== */
  /* Icon tròn lớn */
  /* Nội dung text trái, kiểu chữ */
}
.section-lbs-cares .align-equal > .col > .col-inner {
  height: 100%;
}
.section-lbs-cares .icon-box {
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr; /* icon | nội dung */
  gap: 18px;
  padding: 28px;
  border-radius: var(--radius);
  border: 2px solid var(--border);
  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 .icon-box:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.08);
}
.section-lbs-cares .icon-box-img {
  margin: 0; /* bỏ spacing mặc định */
  width: 100px !important;
  height: 100px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  border: 2px solid var(--border);
  box-shadow: inset 0 8px 18px rgba(0, 0, 0, 0.04);
}
.section-lbs-cares .icon-box-img img {
  width: 66%;
  height: auto;
  object-fit: contain;
}
.section-lbs-cares .icon-box-img svg {
  color: var(--fs-color-primary);
}
.section-lbs-cares .icon-box-text {
  text-align: left;
}
.section-lbs-cares .icon-box-text h3, .section-lbs-cares .icon-box-text h4 {
  margin: 10px 0 8px;
  font-weight: 800;
  font-size: clamp(18px, 2.1vw, 22px);
  line-height: 1.3;
  color: var(--fs-color-primary);
}
.section-lbs-cares .icon-box-text p {
  margin: 0;
  color: var(--primary-color);
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1.7;
}

.background-mosi {
  background-image: url(/wp-content/uploads/2025/10/backsafdh.png);
  background-color: color-mix(in srgb, transparent 80%, var(--fs-color-primary) 20%);
  background-attachment: fixed;
}
.background-mosi .icon-box {
  background: color-mix(in srgb, var(--fs-color-primary) 15%, rgba(255, 255, 255, 0.4901960784));
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.background-mosi .row .col:nth-child(even) .icon-box {
  background: color-mix(in srgb, var(--fs-color-primary) 80%, transparent);
}
.background-mosi .row .col:nth-child(even) .icon-box p, .background-mosi .row .col:nth-child(even) .icon-box h4 {
  color: white !important;
}

.section-formcontact {
  /* ---- Tokens ---- */
  /* ---- Placeholders & Mixins ---- */
  background: color-mix(in srgb, var(--fs-color-primary) 10%, white);
  padding: clamp(40px, 6vw, 80px) 0;
  /* Left side */
  /* Right side title */
  /* Button */
  /* Messages */
  /* Responsive */
}
.section-formcontact .wpcf7-form :is(input[type=text], input[type=email], input[type=tel], .wpcf7-textarea, .wpcf7-select) {
  width: 100%;
  background: #fff;
  border: 1px solid rgba(184, 184, 184, 0.8705882353);
  border-radius: 7px;
  font-size: 16px;
  line-height: 1.2;
  color: #000000;
  outline: 0;
  box-shadow: none;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.12s, background-color 0.2s;
}
.section-formcontact .wpcf7-form :is(input[type=text], input[type=email], input[type=tel], .wpcf7-textarea, .wpcf7-select)::placeholder {
  color: color-mix(in srgb, #818181 70%, #fff);
}
.section-formcontact .wpcf7-form :hover:is(input[type=text], input[type=email], input[type=tel], .wpcf7-textarea, .wpcf7-select), .section-formcontact .wpcf7-form :focus:is(input[type=text], input[type=email], input[type=tel], .wpcf7-textarea, .wpcf7-select) {
  border-color: color-mix(in srgb, var(--fs-color-primary) 70%, #fff);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--fs-color-primary) 18%, transparent);
  transform: translateY(-1px);
}
.section-formcontact .customwp-title-heading {
  color: #000000;
  margin: 0 0 0.8rem;
}
.section-formcontact .col-inner > p {
  color: #818181;
  line-height: 1.9;
  font-size: clamp(15px, 1.05vw, 17px);
  max-width: 62ch;
}
.section-formcontact .is-divider {
  height: 1px !important;
  background: color-mix(in srgb, rgba(184, 184, 184, 0.8705882353) 88%, transparent) !important;
  margin: 20px 0 20px !important;
  border-radius: 999px;
  opacity: 0.85;
}
.section-formcontact .testimonial-box {
  position: relative;
  padding-left: 70px;
  color: #000000;
}
.section-formcontact .testimonial-box::before, .section-formcontact .testimonial-box::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.9;
  pointer-events: none;
  display: block;
}
.section-formcontact .testimonial-box::before {
  background-image: url(/wp-content/uploads/2025/10/before.png);
  width: 56px;
  height: 56px;
  left: 0;
  top: 0;
}
.section-formcontact .testimonial-box::after {
  background-image: url(/wp-content/uploads/2025/10/after.png);
  width: 100px;
  height: 100px;
  right: 48%;
  bottom: -60px;
}
.section-formcontact .testimonial-box p {
  margin: 0 0 14px;
  font-style: italic;
  font-size: 16px;
  font-weight: 400;
  color: rgba(36, 36, 36, 0.829);
  font-family: Roboto, sans-serif !important;
}
.section-formcontact .testimonial-name {
  color: rgba(63, 63, 63, 0.849);
  font-weight: 600;
}
.section-formcontact h4 {
  text-align: center;
  color: #000000;
  margin: 0 0 18px;
}
.section-formcontact .col-form .col-inner {
  position: relative;
  background: white;
  border-radius: 10px;
  padding: clamp(24px, 3.2vw, 34px);
  text-align: left;
  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%);
}
.section-formcontact .col-form .col-inner label {
  font-weight: 500;
}
.section-formcontact .col-form .col-inner .wpcf7-spinner {
  display: none !important;
}
.section-formcontact select::-ms-expand {
  display: none;
}
.section-formcontact .wpcf7-submit {
  display: block;
  width: 100%;
  margin-top: 24px;
  padding: 6px 12px;
  border: 0;
  border-radius: 10px;
  color: #fff;
  letter-spacing: 0.3px;
  cursor: pointer;
  background: linear-gradient(180deg, var(--fs-color-primary), var(--fs-color-primary));
  box-shadow: 0 16px 32px rgba(48, 48, 48, 0.25);
  transition: transform 0.12s, filter 0.2s, box-shadow 0.2s;
}
.section-formcontact .wpcf7-submit:hover {
  transform: translateY(-1px);
  filter: brightness(1.03);
  box-shadow: 0 20px 38px rgba(44, 44, 44, 0.3);
}
.section-formcontact .wpcf7-submit:active {
  transform: translateY(0);
}
.section-formcontact .wpcf7-response-output {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(184, 184, 184, 0.8705882353);
  background: #f6fbf5;
  color: #000000;
}
.section-formcontact .wpcf7-not-valid-tip {
  margin-top: 6px;
  color: #b42318 !important;
  font-size: 13px;
}
@media (max-width: 849.98px) {
  .section-formcontact .wpcf7-form {
    border-radius: 20px;
  }
  .section-formcontact .wpcf7-form::after {
    left: 20px;
    right: 20px;
    bottom: 90px;
  }
  .section-formcontact .testimonial-box::after {
    right: 6%;
    bottom: -52px;
    font-size: 75px;
  }
}