.slide-home{margin-bottom:0px !important; width: 100%; height: auto;}
.slide-home .slick-dots {
  position: absolute;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: auto;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  list-style: none;
  padding: 6px 14px;
  margin: 0;
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}
.slide-home .slick-dots li {
  margin: 0 4px;
  padding: 0;
  display: inline-block;
}
.slide-home .slick-dots button {
  border: none;
  background: rgba(0, 0, 0, 0.25);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  padding: 0;
  text-indent: -9999px;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.slide-home .slick-dots button:before {
  display: none !important;
}
.slide-home .slick-dots li.slick-active button {
  background: #1c7232;
  width: 24px;
  border-radius: 4px;
}
.slide-home .slick-dots li:hover button {
  background: rgba(0, 0, 0, 0.6);
}
.item-side {
  position: relative;
  overflow: hidden;
  border: none;
  box-shadow: none;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.item-side img {
  border-radius: 0px !important;
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  display: block;
}
.item-side:hover img {
  transform: scale(1.05);
}
#gioi-thieu p{
    text-align: justify;
}
.row p{
    text-align: justify;
}
.row img{
    border-radius: 10px;
}
#gioi-thieu {
  background-color: #dce7dd;
  background-image: 
    radial-gradient(circle 90px at var(--mouse-x, -9999px) var(--mouse-y, -9999px), rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.05) 60%, transparent 100%),
    linear-gradient(to bottom, rgba(220, 231, 221, 0.96) 0%, rgba(220, 231, 221, 0.2) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='41.56' viewBox='0 0 24 41.56'%3E%3Cpath d='M12 0 L24 6.93 L24 20.78 L12 27.71 L0 20.78 L0 6.93 Z M0 41.56 L12 34.63 L24 41.56' fill='none' stroke='rgba(28, 114, 50, 0.16)' stroke-width='1'/%3E%3C/svg%3E");
  background-size: auto, 100% 100%, 24px 41.56px;
  border: none;
  border-top: 1px solid rgba(28, 114, 50, 0.12);
  border-bottom: 1px solid rgba(28, 114, 50, 0.12);
  padding: 0px;
  line-height: 26px;
  font-size: 16px;
  color: #28422f;
  overflow: hidden;
  margin-top: 30px;
  margin-bottom: 30px;
  position: relative;
  z-index: 1;
  transition: background 0.6s ease, border-color 0.6s ease;
}
#gioi-thieu:hover {
  background-color: #d3e0d5;
  background-image: 
    radial-gradient(circle 90px at var(--mouse-x, -9999px) var(--mouse-y, -9999px), rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.1) 60%, transparent 100%),
    linear-gradient(to bottom, rgba(211, 224, 213, 0.96) 0%, rgba(211, 224, 213, 0.2) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='41.56' viewBox='0 0 24 41.56'%3E%3Cpath d='M12 0 L24 6.93 L24 20.78 L12 27.71 L0 20.78 L0 6.93 Z M0 41.56 L12 34.63 L24 41.56' fill='none' stroke='rgba(28, 114, 50, 0.22)' stroke-width='1'/%3E%3C/svg%3E");
  border-top-color: rgba(28, 114, 50, 0.25);
  border-bottom-color: rgba(28, 114, 50, 0.25);
}
#gioi-thieu::before {
  content: "";
  position: absolute;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(39, 195, 80, 0.15) 0%, rgba(39, 195, 80, 0) 70%);
  bottom: -100px;
  left: -100px;
  border-radius: 50%;
  filter: blur(50px);
  z-index: 1;
  pointer-events: none;
  animation: floatBlob1 18s ease-in-out infinite;
  transition: background 0.6s ease, filter 0.6s ease, transform 0.6s ease;
}
#gioi-thieu:hover::before {
  background: radial-gradient(circle, rgba(39, 195, 80, 0.22) 0%, rgba(39, 195, 80, 0) 70%);
  filter: blur(35px);
  transform: translate(30px, -20px) scale(1.1);
}
#gioi-thieu::after {
  content: "";
  position: absolute;
  width: 250px;
  height: 250px;
  background: radial-gradient(circle, rgba(0, 210, 255, 0.10) 0%, rgba(0, 210, 255, 0) 70%);
  top: -50px;
  right: -50px;
  border-radius: 50%;
  filter: blur(40px);
  z-index: 1;
  pointer-events: none;
  animation: floatBlob2 22s ease-in-out infinite;
  transition: background 0.6s ease, filter 0.6s ease, transform 0.6s ease;
}
#gioi-thieu:hover::after {
  background: radial-gradient(circle, rgba(0, 210, 255, 0.16) 0%, rgba(0, 210, 255, 0) 70%);
  filter: blur(30px);
  transform: translate(-30px, 20px) scale(1.1);
}
#gioi-thieu .container {
  position: relative;
  z-index: 2;
}
#gioi-thieu .row {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  #gioi-thieu .col-sm-6:first-of-type {
    padding-top: 60px;
    padding-bottom: 60px;
    padding-right: 40px;
    position: relative;
  }
  #gioi-thieu .col-sm-6:first-of-type::after {
    content: "";
    position: absolute;
    top: 10%;
    right: 0;
    width: 1px;
    height: 80%;
    background: rgba(28, 114, 50, 0.12);
    transition: background 0.5s ease;
  }
  #gioi-thieu:hover .col-sm-6:first-of-type::after {
    background: rgba(28, 114, 50, 0.25);
  }
  #gioi-thieu .col-sm-6:last-of-type {
    padding: 0;
    display: flex;
  }
  .slide-home {
    width: 100%;
    height: 100% !important;
  }
  .slide-home .slick-list,
  .slide-home .slick-track,
  .slide-home .slick-slide,
  .slide-home .slick-slide > div,
  .slide-home .item-side {
    height: 100% !important;
  }
  .slide-home .item-side {
    aspect-ratio: auto;
  }
}

@media (max-width: 767px) {
  #gioi-thieu .row{display:block !important;}
  #gioi-thieu .col-sm-6{width:100% !important;}
  #gioi-thieu .col-sm-6:first-of-type {padding: 40px 20px 30px;}
  #gioi-thieu .col-sm-6:last-of-type {padding: 0;}
  .slide-home {width: 100%;}
  .slide-home .item-side {aspect-ratio: 1.5;}
}
#gioi-thieu h1 {
  margin-top: 0px;
  text-transform: uppercase;
  font-size: 30px;
  font-weight: 700;
  background: linear-gradient(135deg, #165224 0%, #27c350 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 25px;
  position: relative;
  display: inline-block;
  padding-bottom: 12px;
}
#gioi-thieu h1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 70px;
  height: 4px;
  background-color: #1c7232;
  border-radius: 2px;
  transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.5s ease;
}
#gioi-thieu:hover h1::after {
  width: 120px;
  background-color: #209c42;
}
.content-gt {
  line-height: 28px;
  font-size: 15.5px;
  color: #28422f;
  height: auto;
  overflow: visible;
}
.content-gt strong {
  color: #165224;
}
.content-gt > p:first-of-type,
.content-gt > p:first-of-type strong {
  color: #165224;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 12px;
  display: block;
}
.title-home{text-align:center;padding:10px 0;margin-top:20px;}
.title-home span{display:inline-block;color:#27c350;position:relative;text-align:center;padding-bottom:10px;font-weight:600;text-transform:uppercase;font-size:22px;border-bottom:1px solid #ccc;}
.title-home span:before{content:"";width:50px;height:3px;background:#27c350;position:absolute;left:0;right:0;margin:auto;bottom:-2px;}
.noidung-gt *{font-size:14px !important;line-height:22px;}
.noidung-gt h3{font-size:17px !important;color:#000;margin-top:0px;}
.noidung-gt{max-height:285px;overflow:hidden;}
.btn-xemthem{height:37px;width:122px;color:#888888;font-size:12px;line-height:35px;border-radius:4px;display:inline-block;text-transform:uppercase;border:1px solid #b9b9b9;transition:all ease-in-out .4s;-moz-transition:all ease-in-out .4s;-webkit-transition:all ease-in-out .4s;text-align:center;background:#27c350;color:#fff;border:none;line-height:37px;margin-top:14px;}
.btn-xemthem:hover{background:transparent;border:1px solid #2ab56f;color:#2ab56f;text-decoration:none;}
.btn-xemthem:after{content:"\f105";font-family:FontAwesome;padding-left:5px;}
.camket{background:url(../images/br-camket.jpg) no-repeat center top;background-size:cover;padding-top:30px;padding-bottom:10px;position:relative;margin-top:30px;margin-bottom:0;background-attachment:fixed;}
@supports (background-image: url('../images/br-camket.webp')){.camket{background-image:url(../images/br-camket.webp);}}
.item-camket{margin-top:10px;margin-bottom:20px;}
.item-camket img{width:40px;height:40px;float:left;margin-right:10px;margin-top:4px;}
.item-camket p{color:#fff;margin-bottom:3px;}
.item-camket span{width:80%;float:left;color:#fff;font-size:13px;}
.camket:before{content:"";position:absolute;top:0;bottom:0;left:0;right:0;background-color:#4e4c4c8c;}
#san-pham{background-color:#fff;padding-top:30px;padding-bottom:30px;}
.sanpham_hot{margin-bottom:30px;background:url(../images/br-sanpham.png) no-repeat center left;position:relative;height:270px;padding-left:20px;}
.sanpham_hot h2{font-weight:600;font-size:30px;margin-top:30px;margin-bottom:20px;padding-left:0px;text-transform:uppercase;}
.sanpham_hot h2 a{color:#fff;}
.sanpham_hot ul, .item-sanphamc ul{padding-left:0px;list-style:none;}
.sanpham_hot ul{height:145px;overflow:auto;}
.sanpham_hot ul::-webkit-scrollbar {width:3px;background-color:#F5F5F5;} 
.sanpham_hot ul::-webkit-scrollbar-thumb {background-color:#818181;}
.sanpham_hot ul::-webkit-scrollbar-track {-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);background-color:#F5F5F5;}
.sanpham_hot ul li a, .item-sanphamc ul li a{color:#fff;font-style:italic;display:block;padding-top:5px;padding-bottom:5px;}
.sanpham_hot ul li a:hover, .item-sanphamc ul li a:hover{text-decoration:none;color:#00dd01;}
.item-sanphamc ul{padding-left:5px;}
.item-sanphamc ul li a{font-size:13px;}
.right-sphot{position:relative;height:270px;text-align:right;}
.right-sphot a{display:inline-block;}
.right-sphot a img{position:absolute;bottom:-35px;right:30px;z-index:10;}
.xemtatca{background-color:#fff;margin-bottom:10px;}
.xemtatca a{background-color:#27c350;color:#fff;padding:18px 40px;display:inline-block;font-size:18px;position:relative;}
.xemtatca a:before{content:"";width:0;height:0;border-top:31px solid transparent;border-left:50px solid #27c350;border-bottom:31px solid transparent;position:absolute;left:100%;top:-1px;}
.xemtatca a:hover{background-color:#58ba49;text-decoration:none;color:#fff;}
.item-sanphamc{height:150px;background-color:#fff;margin-top:15px;margin-bottom:15px;border:1px solid #58ba49;padding:15px;background:url(../images/br-sanpham.png) no-repeat center left;}
.hinhsp_c{height:100%;display:flex;justify-content:center;align-items:center;}
.hinhsp_c img{max-width:100%;max-height:150px;}
.item-sanphamc h3{font-weight:600;text-transform:uppercase;font-size:16px;margin:0px;line-height:20px;}
.item-sanphamc h3 a{color:#f7fbf7;}
.quytrinh{background:url(../images/br-camket.jpg) no-repeat center top;background-size:cover;padding-top:30px;padding-bottom:30px;position:relative;margin-top:0px;margin-bottom:0;color:#fff;background-attachment:fixed;}
@supports (background-image: url('../images/br-camket.webp')){.quytrinh{background-image:url(../images/br-camket.webp);}}
.quytrinh:before{content:"";position:absolute;top:0;bottom:0;left:0;right:0;background-color:#4e4c4c8c;}
.quytrinh h3{text-align:center;margin-bottom:30px;font-size:30px;text-transform:uppercase;color:#fff;position:relative;font-weight:600;}
.img-quytrinh{text-align:center;background:url(../images/process-step.png) no-repeat center;width:70%;height:150px;background-size:contain;line-height:140px;position:relative;z-index:1000;margin-bottom:20px;}
.quytrinh:after{content:"";background:url(../images/1560831552_process-line.png);z-index:0;position:absolute;top:39%;height:108px;width:100%;background-size:auto 100%;margin-top:-22px;left:0;}
.img-quytrinh img{height:auto;width:auto;}
.content-qt{padding-left:15px;margin-bottom:30px;}
.content-qt span{font-size:14px;}
.news{background:url(../images/br-news.jpg) no-repeat center;background-size:cover;padding-top:20px;padding-bottom:30px;font-weight:600;margin-top:30px;}
@supports (background-image: url('../images/br-news.webp')){.news{background-image:url(../images/br-news.webp);}}
.title-home{color:#fff;border-bottom:1px dashed #fff;padding-bottom:8px;text-transform:uppercase;font-size:18px;margin-bottom:20px;position:relative;}
.title-home:before{content:"";position:absolute;width:50px;height:3px;background-color:#26b372;bottom:-2px;}
.item-news{padding-left:15px;padding-right:15px;}
.item-news h4{font-size:13px;text-transform:uppercase;line-height:20px;margin-top:15px;font-weight:600;}
.item-news h4 a{color:#fff;}
.item-news h4 a:hover{color:#ccc;}
.item-news .ngaydang{color:#fff;margin-bottom:20px;font-weight:300;}
.list-news{margin-left:-15px;margin-right:-15px;}
.list-news .slick-prev{position:absolute;top:-34px;right:39px;left:auto;background:url(../images/prev.png) no-repeat center;background-size:100%;}
.list-news .slick-next{position:absolute;top:-34px;right:16px;background:url(../images/next.png) no-repeat center;background-size:100%;}
.item-yk{padding-left:15px;padding-right:15px;}
.item-yk .hinh-kh{width:90px;height:90px;border-radius:50%;border:3px solid #fff;float:right;}
.item-yk .hinh-kh img{height:100%;width:100%;object-fit:cover;border-radius:50%;}
.thongtin{background-color:#27c350;padding:20px;position:relative;}
.thongtin-kh{display:inline-block;margin-top:0px;padding-right:30px;}
.thongtin-kh p{color:#fff;font-size:15px;}
.thongtin-kh p strong{font-size:18px;}
.content-yk{margin-top:5px;padding:15px;background:#eee;text-align:left;}
.thongtin:after{content:"";width:0;height:0;border-style:solid;border-width:0 15px 15px 0px;border-color:transparent transparent #fff transparent;position:absolute;bottom:0;right:50px;}
.star{letter-spacing:-1px;color:#ffeb3b;font-size:13px;}
.star i{display:inline-block;margin-left:5px;}
.list-kh .slick-dots li button{height:3px;width:27px;background-color:#c3c3c3;margin-left:0px;padding:0px;}
.list-kh .slick-dots li button:before{height:3px;content:'';width:27px;line-height:3px;}
.list-kh .slick-dots li.slick-active button:before{background-color:#676464;}
.list-kh .slick-dots{bottom:-40px;}
.fanpage{margin-top:20px;}
.fanpage iframe{width:100%;height:349px;}
.danhgia{background-color:#fff;margin-top:20px;}
.br-mau{background-color:#fff;padding-top:30px;padding-bottom:30px;}
/* Khai báo trùng lặp cũ đã được loại bỏ để nhường chỗ cho style nghệ thuật phía trên */
.title-home{text-align:center;padding:10px 0;margin-top:20px;}
.title-home span{display:inline-block;color:#27c350;position:relative;text-align:center;padding-bottom:10px;font-weight:600;text-transform:uppercase;font-size:22px;border-bottom:1px solid #ccc;}
.title-home span:before{content:"";width:50px;height:3px;background:#27c350;position:absolute;left:0;right:0;margin:auto;bottom:-2px;}
.noidung-gt *{font-size:14px !important;line-height:22px;}
.noidung-gt h3{font-size:17px !important;color:#000;margin-top:0px;}
.noidung-gt{max-height:285px;overflow:hidden;}
.btn-xemthem{height:37px;width:122px;color:#888888;font-size:12px;line-height:35px;border-radius:4px;display:inline-block;text-transform:uppercase;border:1px solid #b9b9b9;transition:all ease-in-out .4s;-moz-transition:all ease-in-out .4s;-webkit-transition:all ease-in-out .4s;text-align:center;background:#27c350;color:#fff;border:none;line-height:37px;margin-top:14px;}
.btn-xemthem:hover{background:transparent;border:1px solid #2ab56f;color:#2ab56f;text-decoration:none;}
.btn-xemthem:after{content:"\f105";font-family:FontAwesome;padding-left:5px;}
.camket{background:url(../images/br-camket.jpg) no-repeat center top;background-size:cover;padding-top:30px;padding-bottom:10px;position:relative;margin-top:30px;margin-bottom:0;background-attachment:fixed;}
@supports (background-image: url('../images/br-camket.webp')){.camket{background-image:url(../images/br-camket.webp);}}
.item-camket{margin-top:10px;margin-bottom:20px;}
.item-camket img{width:40px;height:40px;float:left;margin-right:10px;margin-top:4px;}
.item-camket p{color:#fff;margin-bottom:3px;}
.item-camket span{width:80%;float:left;color:#fff;font-size:13px;}
.camket:before{content:"";position:absolute;top:0;bottom:0;left:0;right:0;background-color:#4e4c4c8c;}
#san-pham{background-color:#fff;padding-top:30px;padding-bottom:30px;}
.sanpham_hot{margin-bottom:30px;background:url(../images/br-sanpham.png) no-repeat center left;position:relative;height:270px;padding-left:20px;}
.sanpham_hot h2{font-weight:600;font-size:30px;margin-top:30px;margin-bottom:20px;padding-left:0px;text-transform:uppercase;}
.sanpham_hot h2 a{color:#fff;}
.sanpham_hot ul, .item-sanphamc ul{padding-left:0px;list-style:none;}
.sanpham_hot ul{height:145px;overflow:auto;}
.sanpham_hot ul::-webkit-scrollbar {width:3px;background-color:#F5F5F5;} 
.sanpham_hot ul::-webkit-scrollbar-thumb {background-color:#818181;}
.sanpham_hot ul::-webkit-scrollbar-track {-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);background-color:#F5F5F5;}
.sanpham_hot ul li a, .item-sanphamc ul li a{color:#fff;font-style:italic;display:block;padding-top:5px;padding-bottom:5px;}
.sanpham_hot ul li a:hover, .item-sanphamc ul li a:hover{text-decoration:none;color:#00dd01;}
.item-sanphamc ul{padding-left:5px;}
.item-sanphamc ul li a{font-size:13px;}
.right-sphot{position:relative;height:270px;text-align:right;}
.right-sphot a{display:inline-block;}
.right-sphot a img{position:absolute;bottom:-35px;right:30px;z-index:10;}
.xemtatca{background-color:#fff;margin-bottom:10px;}
.xemtatca a{background-color:#27c350;color:#fff;padding:18px 40px;display:inline-block;font-size:18px;position:relative;}
.xemtatca a:before{content:"";width:0;height:0;border-top:31px solid transparent;border-left:50px solid #27c350;border-bottom:31px solid transparent;position:absolute;left:100%;top:-1px;}
.xemtatca a:hover{background-color:#58ba49;text-decoration:none;color:#fff;}
.item-sanphamc{height:150px;background-color:#fff;margin-top:15px;margin-bottom:15px;border:1px solid #58ba49;padding:15px;background:url(../images/br-sanpham.png) no-repeat center left;}
.hinhsp_c{height:100%;display:flex;justify-content:center;align-items:center;}
.hinhsp_c img{max-width:100%;max-height:150px;}
.item-sanphamc h3{font-weight:600;text-transform:uppercase;font-size:16px;margin:0px;line-height:20px;}
.item-sanphamc h3 a{color:#f7fbf7;}
.quytrinh{background:url(../images/br-camket.jpg) no-repeat center top;background-size:cover;padding-top:30px;padding-bottom:30px;position:relative;margin-top:0px;margin-bottom:0;color:#fff;background-attachment:fixed;}
@supports (background-image: url('../images/br-camket.webp')){.quytrinh{background-image:url(../images/br-camket.webp);}}
.quytrinh:before{content:"";position:absolute;top:0;bottom:0;left:0;right:0;background-color:#4e4c4c8c;}
.quytrinh h3{text-align:center;margin-bottom:30px;font-size:30px;text-transform:uppercase;color:#fff;position:relative;font-weight:600;}
.img-quytrinh{text-align:center;background:url(../images/process-step.png) no-repeat center;width:70%;height:150px;background-size:contain;line-height:140px;position:relative;z-index:1000;margin-bottom:20px;}
.quytrinh:after{content:"";background:url(../images/1560831552_process-line.png);z-index:0;position:absolute;top:39%;height:108px;width:100%;background-size:auto 100%;margin-top:-22px;left:0;}
.img-quytrinh img{height:auto;width:auto;}
.content-qt{padding-left:15px;margin-bottom:30px;}
.content-qt span{font-size:14px;}
.news{background:url(../images/br-news.jpg) no-repeat center;background-size:cover;padding-top:20px;padding-bottom:30px;font-weight:600;margin-top:30px;}
@supports (background-image: url('../images/br-news.webp')){.news{background-image:url(../images/br-news.webp);}}
.title-home{color:#fff;border-bottom:1px dashed #fff;padding-bottom:8px;text-transform:uppercase;font-size:18px;margin-bottom:20px;position:relative;}
.title-home:before{content:"";position:absolute;width:50px;height:3px;background-color:#26b372;bottom:-2px;}
.item-news{padding-left:15px;padding-right:15px;}
.item-news h4{font-size:13px;text-transform:uppercase;line-height:20px;margin-top:15px;font-weight:600;}
.item-news h4 a{color:#fff;}
.item-news h4 a:hover{color:#ccc;}
.item-news .ngaydang{color:#fff;margin-bottom:20px;font-weight:300;}
.list-news{margin-left:-15px;margin-right:-15px;}
.list-news .slick-prev{position:absolute;top:-34px;right:39px;left:auto;background:url(../images/prev.png) no-repeat center;background-size:100%;}
.list-news .slick-next{position:absolute;top:-34px;right:16px;background:url(../images/next.png) no-repeat center;background-size:100%;}
.item-yk{padding-left:15px;padding-right:15px;}
.item-yk .hinh-kh{width:90px;height:90px;border-radius:50%;border:3px solid #fff;float:right;}
.item-yk .hinh-kh img{height:100%;width:100%;object-fit:cover;border-radius:50%;}
.thongtin{background-color:#27c350;padding:20px;position:relative;}
.thongtin-kh{display:inline-block;margin-top:0px;padding-right:30px;}
.thongtin-kh p{color:#fff;font-size:15px;}
.thongtin-kh p strong{font-size:18px;}
.content-yk{margin-top:5px;padding:15px;background:#eee;text-align:left;}
.thongtin:after{content:"";width:0;height:0;border-style:solid;border-width:0 15px 15px 0px;border-color:transparent transparent #fff transparent;position:absolute;bottom:0;right:50px;}
.star{letter-spacing:-1px;color:#ffeb3b;font-size:13px;}
.star i{display:inline-block;margin-left:5px;}
.list-kh .slick-dots li button{height:3px;width:27px;background-color:#c3c3c3;margin-left:0px;padding:0px;}
.list-kh .slick-dots li button:before{height:3px;content:'';width:27px;line-height:3px;}
.list-kh .slick-dots li.slick-active button:before{background-color:#676464;}
.list-kh .slick-dots{bottom:-40px;}
.fanpage{margin-top:20px;}
.fanpage iframe{width:100%;height:349px;}
.danhgia{background-color:#fff;margin-top:20px;}
.br-mau{background-color:#fff;padding-top:30px;padding-bottom:30px;}
/* ============================================================
   REDESIGN: Khu vực "Sản phẩm nổi bật" trang chủ
   (.sanpham_hot - 2 khối lớn  /  .item-sanphamc - 3 khối nhỏ)
   Thêm đoạn này vào CUỐI file templates/css/home.css
   (các rule dưới sẽ override rule cũ cùng tên ở phía trên)
   ============================================================ */

/* ===== 2 khối lớn: CỬA NHÔM / MẶT DỰNG ===== */
.sanpham_hot {
  height: 280px;
  padding-left: 0;
  border-radius: 8px;
  overflow: hidden;              /* chặn ảnh tràn ra ngoài khối */
  background-size: cover !important;
  background-position: center !important;
  transition: box-shadow 0.3s ease;
}
.sanpham_hot:hover {
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.35);
}

/* Lớp phủ tối để chữ trắng luôn nổi rõ trên ảnh nền */
.sanpham_hot:before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(
    100deg,
    rgba(0, 0, 0, 0.78) 0%,
    rgba(0, 0, 0, 0.55) 45%,
    rgba(0, 0, 0, 0.15) 100%
  );
  z-index: 1;
}

.sanpham_hot h2 {
  position: relative;
  z-index: 2;
  margin-top: 26px;
  margin-bottom: 16px;
  padding-left: 24px;
  font-size: 24px;
}

.sanpham_hot ul {
  position: relative;
  z-index: 2;
  padding-left: 24px;
  height: auto;
  max-height: 170px;
}
.sanpham_hot ul li a {
  font-style: normal;
  font-size: 14px;
  transition: padding-left 0.25s ease, color 0.25s ease;
}
.sanpham_hot ul li a:hover {
  color: #8fffb0;
  padding-left: 6px;
}

/* Ảnh minh hoạ bên phải - chứa gọn trong khối, KHÔNG tràn ra ngoài */
.right-sphot {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 46%;
  height: 100%;
  z-index: 2;
  text-align: center;
}
.right-sphot a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.right-sphot a img {
  position: static;          /* bỏ absolute + bottom âm gây tràn */
  max-width: 90%;
  max-height: 230px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.45));
  transition: transform 0.3s ease;
}
.sanpham_hot:hover .right-sphot a img {
  transform: scale(1.04);
}

/* ===== 3 khối nhỏ: CẦU THANG KÍNH / CỬA KÍNH VÁCH KÍNH / PHÒNG TẮM KÍNH ===== */
.item-sanphamc {
  height: auto;
  min-height: 150px;
  padding: 14px 18px;
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  background-image: none;        /* bỏ ảnh nền lặp gây rối mắt */
  background-color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.item-sanphamc:hover {
  border-color: #27c350;
  box-shadow: 0 6px 16px rgba(39, 195, 80, 0.18);
  transform: translateY(-3px);
}
.item-sanphamc h3 {
  margin-bottom: 10px;
}
.item-sanphamc h3 a {
  color: #1f1f1f !important;
}
.item-sanphamc ul li a {
  color: #555 !important;
  font-style: normal;
  font-size: 13.5px;
  transition: color 0.25s ease, padding-left 0.25s ease;
}
.item-sanphamc ul li a:hover {
  color: #27c350 !important;
  padding-left: 4px;
}

/* Ảnh minh hoạ trong khối nhỏ - chứa gọn, bo góc */
.hinhsp_c {
  height: 150px;
  border-radius: 6px;
  overflow: hidden;
  background-color: #f6f6f6;
}
.hinhsp_c img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;             /* lấp đầy khung, không méo, không tràn */
  transition: transform 0.3s ease;
}
.item-sanphamc:hover .hinhsp_c img {
  transform: scale(1.05);
}

/* ===== Responsive ===== */
@media (max-width: 991px) {
  .sanpham_hot {
    height: auto;
    padding-bottom: 20px;
  }
  .right-sphot {
    position: static;
    width: 100%;
    height: 160px;
    margin-top: 10px;
  }
  .sanpham_hot ul {
    max-height: none;
  }
}

@media (max-width: 767px) {
  .item-sanphamc {
    margin-bottom: 15px;
  }
}

/* ===== Artistic Background Floating Blobs Keyframes ===== */
@keyframes floatBlob1 {
  0% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(40px, -40px) scale(1.15); }
  66% { transform: translate(-20px, 20px) scale(0.9); }
  100% { transform: translate(0, 0) scale(1); }
}
@keyframes floatBlob2 {
  0% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-30px, 30px) scale(0.85); }
  100% { transform: translate(0, 0) scale(1); }
}
