/* ================ Header ================ */
.d-none {
  display: none !important;
}

a:hover {
  color: #BB9067 !important;
}

#gap-5 {
  padding: 2px 0;
}

header .top_bar-mobile,
.header-main .chose-language,
.header-main .nav-bar-mobile,
#menu-mobile {
  display: none;
}

header .top_bar-desktop .text-right {
  display: flex;
  justify-content: end;
  gap: 10px;
}

header .top_bar-desktop .text-right .user-logged {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  /* border: 1px solid #FFF; */
  border-radius: 25px;
  width: auto;
  padding: 0px 7px;
  background: linear-gradient(to bottom right, rgba(246, 203, 132, 1), rgba(187, 144, 103, 1));
  padding-left: 3px;
  position: relative;
}

header .top_bar-desktop .text-right .user-logged:after {
  content: "";
  display: block;
  height: 20px;
  width: 100%;
  bottom: -15px;
  left: 0;
  position: absolute;
}

header .top_bar-desktop .text-right .user-logged img {
  width: 30px;
}

header .top_bar-desktop .text-right .user-logged .user-name {
  color: rgba(41, 70, 100, 1);
  font-weight: 600;
  font-size: 14px;
}

header .top_bar-desktop .text-right .user-logged .user-icon-dropdown {
  transform: rotate(90deg);
  cursor: pointer;
  font-size: 13px;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub {
  position: absolute;
  right: 0;
  top: 48px;
  background-color: #FFF;
  width: 212px;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 10px;
  z-index: 10;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub ul {
  text-align: left !important;
  padding-left: 0;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub ul i>img {
  width: 20px;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub ul li {
  margin-bottom: 10px;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub {
  display: none;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub::before {
  position: absolute;
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-bottom: 20px solid #FFF;
  right: 24px;
  top: -13px;
}

header .top_bar-desktop .text-right .user-logged:hover .user-menu-sub {
  display: block !important;
}

header .top_bar-desktop .text-right .user-logged .user-menu-sub:hover {
  display: block !important;
}

header .menu-desktop .aligncenter .col-md-2 .text-right {
  margin-bottom: 0 !important;
}

#footer .container>.row:nth-child(2) .col-12 .social>ul {
  padding: 0 !important;
}

#footer .container>.row:nth-child(2) .q_gg-map>.map {
  width: 380px;
  height: 230px;
}

#footer .container>.row:nth-child(2) .q_gg-map>.map iframe {
  width: 380px;
  height: 230px;
}

#check-success-form {
  margin-top: 10px;
}

.q_tra-cuu .row_tracuu_chitieu .col-md-8 .m_body .slick-slider .slick-dots {
  display: none !important;
  bottom: 0px !important;
}

.q_tra-cuu .row_tracuu_chitieu .col-md-8 .m_body .slick-track {
  gap: 10px;
}

.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh form .input_chiso_bmi {
  background: transparent;
  font-size: 55px;
  line-height: 55px;
  font-weight: 400;
  text-align: center;
  border: none;
  width: 250px;
  max-width: 100%;
  display: inline-block;
  vertical-align: middle;
}

.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh form .row:nth-child(2) .col-md-6 .chi-so-ca-nhan {
  display: flex;
  margin-bottom: 29px;
  justify-content: center;
  align-items: end;
}

.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh form .row:nth-child(2) .col-md-6 .chi-so-ca-nhan>.cm-default,
.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh form .row:nth-child(2) .col-md-6 .chi-so-ca-nhan>.kg-default {
  font-size: 55px;
  line-height: 55px;
  font-weight: 400;
}

.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh form .row:nth-child(2) .col-md-6 .chi-so-ca-nhan>span {
  font-size: 20px;
  line-height: 25px;
  color: #BB9067;
  font-weight: 400;
}

.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh {
  padding-bottom: 30px !important;
}

.page_bmi .q_bang-tinh-BMI .col-md-9 .bang_tinh .button.flex.aligncenter {
  gap: 10px;
}

.range-input {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  cursor: pointer;
  outline: none;
  border-radius: 15px;
  height: 6px;
  background: #ccc;
  overflow: unset !important;
}

.range-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  height: 20px;
  width: 20px;
  background-color: #E2BF9D;
  border-radius: 50%;
  border: 4px solid #BB9067;
  transition: .2s ease-in-out;
}

.range-input::-moz-range-thumb {
  height: 15px;
  width: 15px;
  background-color: #294664;
  border-radius: 50%;
  border: none;
  transition: .2s ease-in-out;
}

.loading_overlay {
  display: none;
  background-color: rgba(0, 0, 0, 0.4);
  position: fixed;
  z-index: 1001;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.page_csskgd:has(.show-progress-waiting) .loading_overlay {
  display: block;
}

.progress-container {
  position: relative;
  width: 20px;
  height: 20px;
  left: 50%;
  top: 50%;
  z-index: 1002;
  transform: translateX(-50%);
}

.page_csskgd .progress-container {
  width: 35px;
  height: 35px;
}

.span-progress-waiting {
  display: block;
  width: 25px;
  height: 25px;
  margin: 0 auto;
  border-radius: 50%;
  animation: spin 2s linear infinite;
  border: solid 5px #fff;
  border-top-color: transparent;
  font-size: 0;
}

.checkmark {
  transform: rotate(45deg);
  height: 28px;
  width: 16px;
  border: none;
  border-radius: 0;
  border-bottom: 5px solid #fff;
  border-right: 5px solid #fff;
  animation: none;
  margin-top: -10px;
  box-shadow: 6px 3px 5px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 6px 3px 5px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 6px 3px 5px 0px rgba(0, 0, 0, 0.1);
}

.progress-waiting {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 5px solid #294664;
  border-radius: 50%;
  border-top-color: transparent;
  animation: spin 2s linear infinite;
  display: none;
}

.progress-waiting {
  border: solid 5px #fff;
  border-top-color: transparent;
}

.show-progress-waiting {
  display: block;
}

.q_page_blvp_dtbl .slick-track .item .anh {
  display: flex;
  justify-content: center;
}

.chitiet-tracuu .chitiet-tracuu-content .sidebar ul.cat-list {
  padding-left: 0 !important;
}

.chitiet-tracuu .chitiet-tracuu-content .col-sm-8 .social>ul {
  padding-left: 0 !important;
}

.q_page_specialist .container-fluid .box_news {
  padding-bottom: 0 !important;
}

.q_page_specialist .q_page_specialist-danhsach .row:nth-child(2) .col-md-3 .nav-pills button {
  width: 95%;
  height: 50px;
  margin-bottom: 10px !important;
}

.q_page_specialist .q_page_specialist-danhsach .row:nth-child(2) .col-md-3 .nav-pills {
  display: block;
  padding: 10px;
}

#exampleModal .modal-content {
  border-radius: 15px;
}

#exampleModal .modal-content .modal-header {
  border-bottom: none;
  padding-bottom: 0 !important;
}

#exampleModal .modal-content .modal-body .modal-h1 {
  text-align: center;
  font-size: 35px;
  font-weight: 700;
  font-family: Montserrat;
  line-height: 50px;
  color: #294664;
}

#exampleModal .modal-content .modal-body .modal-p {
  text-align: center;
  color: #4A4A4A;
  font-size: 16px;
  font-weight: 400;
  font-family: Montserrat;
  line-height: 24px;
}

#exampleModal .modal-content .modal-body form .modal-input {
  position: relative;
  margin-top: 16px;
}

#exampleModal .modal-content .modal-body form .modal-input input {
  padding: 10px 14px 10px 40px;
  background-color: #F1F4F7;
  border-radius: 48px;
  width: 100%;
  outline: none;
  border: none;
}

#exampleModal .modal-content .modal-body form .modal-input i {
  min-width: 18px;
  width: 18px;
  position: absolute;
  top: 10px;
  left: 15px;
}q

#exampleModal .modal-content .modal-body form .modal-input label.error {
  color: red;
  font-weight: 500;
  margin-left: 16px;
}

#exampleModal .modal-content .modal-body form .modal-input input::placeholder {
  color: #4A4A4A;
}

#exampleModal .modal-content .modal-body form .modal-input .select-service {
  width: 100%;
  height: 50px;
  border: none;
  outline: none;
  background-color: #F1F4F7;
  border-radius: 48px;
  padding: 10px 14px 10px 35px;
  -webkit-appearance: none;
}

#exampleModal .modal-content .modal-body form .modal-input textarea {
  outline: none;
  border: none;
  background-color: transparent;
  border-radius: 48px;
  padding: 16px;
}

#exampleModal .modal-content .modal-body form .modal-input.modal-input-date {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #F1F4F7;
  border-radius: 48px;
  height: 48px;
}

#exampleModal .modal-content .modal-body form .modal-input.modal-input-date p {
  margin-bottom: 0;
  margin-left: 40px;
  width: max-content;
}

#exampleModal .modal-content .modal-body form .modal-input.modal-input-date input {
  width: 31%;
  padding: 10px;
}

#exampleModal .modal-content .modal-body form .modal-input.modal-input-area {
  background-color: #F1F4F7;
  border-radius: 15px;
}

#exampleModal .modal-content .modal-body form .modal-input .select-service option {
  color: #4A4A4A;
}

#exampleModal .modal-content .modal-footer {
  border-top: none;
  justify-content: center;
}

#exampleModal .modal-content .modal-body form .btn-submit {
  margin-top: 16px;
  width: 100%;
  height: 50px;
  background: linear-gradient(#F6CB84, #BB9067);
  font-size: 16px;
  font-weight: 500;
  color: #294664;
}

/* ===================== sbb essential ===================== */
.q_banner-essential {
  position: relative;
}

.q_banner-essential .container-fluid {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.q_banner-essential .container-fluid .slick-slider .slick-track {
  margin-bottom: 0;
}

.q_banner-essential .container-fluid .slick-slider .slick-dots {
  bottom: 10px !important;
}

.q_banner-essential .box-content {
  position: absolute;
  top: 125px;
  left: 16%;
}

.q_banner-essential .box-content .image_logo {
  width: max-content;
}

.q_banner-essential .box-content .ess_description {
  margin-top: 57px;
  margin-bottom: 60px;
  font-size: 48px;
  font-weight: 600;
  color: #fff;
  line-height: 58px;
  font-family: 'Montserrat';
  width: 465px;
}

.q_banner-essential .box-content .ess_breadcrumb>ul {
  padding-left: 0 !important;
  display: flex;
  align-items: center;
  gap: 8px;
}

.q_banner-essential .box-content .ess_breadcrumb>ul>li:first-child>a {
  color: #FFF;
  font-size: 14px;
  color: #FFF;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  font-family: 'Montserrat';
}

.q_banner-essential .box-content .ess_breadcrumb>ul>li:last-child {
  color: #F6CB84 !important;
  font-size: 14px;
  color: #FFF;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  font-family: 'Montserrat';
}

.ess_dich-vu {
  padding: 90px 0;
}

.ess_dich-vu>.container {
  display: flex;
  flex-wrap: wrap;
}

.ess_dich-vu>.container>.col-md-6:nth-child(1) {
  padding-right: 10px;
}

.ess_dich-vu>.container>.col-md-6:nth-child(2) {
  padding-left: 10px;
}

.ess_dich-vu .ess_tag {
  width: auto;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #BB9067;
}

.ess_dich-vu .ess_title {
  width: auto;
  font-size: 36px;
  font-weight: 700;
  line-height: 50px;
  font-family: 'Montserrat';
  color: #294664;
}

.ess_dich-vu .ess_content p {
  font-size: 16px;
  font-weight: 400;
  color: #4A4A4A;
  font-family: 'Montserrat';
}

.ess_dich-vu .box_page_dv {
  margin-bottom: 20px;
}

.ess_dich-vu .box_page_dv a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 10px;
  box-shadow: 0px 0px 15px 0px #29466433;
  border-radius: 20px;
}

.ess_dich-vu .box_page_dv .box_page_dv-text {
  padding-right: 45px;
}

.ess_dich-vu .box_page_dv .box_page_dv-text h4 {
  font-size: 24px;
  font-weight: 600;
  color: #294664;
}

.ess_dich-vu .box_page_dv .box_page_dv-text p {
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 400;
  color: #294664;
}

.ess_dich-vu .box_page_dv img {
  width: 100px;
  height: 100px;
  border-radius: 10px;
}

.ess_hinhanh_goikham {
  background-color: #F6F8FA;
  padding: 70px 0;
}

.ess_hinhanh_goikham .container {
  /* display: flex;
  flex-wrap: wrap; */
}

.ess_hinhanh_goikham .container .col-md-10 {
  padding-right: 15px;
}

.ess_hinhanh_goikham h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: #294664;
  margin-bottom: 16px;
}

.ess_hinhanh_goikham .gallery_goikham_slider .slick-track {
  margin-bottom: 0 !important;
  height: 636px;
}

.ess_hinhanh_goikham .gallery_goikham_slider .slick-track>img {
  object-fit: cover;
}

.ess_hinhanh_goikham .gallery_goikham_slider .slick-arrow {
  display: block !important;
  border-radius: 50% !important;
  background-color: #F0C581 !important;
  color: #294664 !important;
  width: 30px;
  height: 30px;
}

.ess_hinhanh_goikham .gallery_goikham_slider .slick-arrow.slick-prev {
  left: 25px;
}

.ess_hinhanh_goikham .gallery_goikham_slider .slick-arrow.slick-next {
  right: 25px;
}

.ess_hinhanh_goikham .gallery_goikham_column {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.ess_danh_gia {
  padding: 90px 0;
}

.ess_danh_gia .ess_danh_gia-p {
  width: max-content;
  margin: auto;
  font-size: 16px;
  font-weight: 500;
  color: #BB9067;
  margin-bottom: 10px;
}

.ess_danh_gia .ess_danh_gia-h1 {
  width: auto;
  text-align: center;
  margin: auto;
  font-size: 40px;
  font-weight: 700;
  color: #294664;
  margin-bottom: 25px;
}

.ess_danh_gia .box-user {
  width: 335px;
  height: 315px;
  border: 1px solid #ccc;
  box-shadow: 0px 4px 10px 0px #0000000F;
  border-radius: 15px;
  padding: 50px 15px 15px 15px;
}

.ess_danh_gia .box-user .star-vote {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 15px;
}

.ess_danh_gia .box-user .text-content {
  padding: 0 50px;
  text-align: center;
  margin-bottom: 25px;
}

.ess_danh_gia .box-user .text-content>p {
  color: #4A4A4A;
}

.ess_danh_gia .box-user .img-name-user {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

.ess_danh_gia .box-user .img-name-user>img {
  max-height: 50px;
  max-width: 50px;
  border-radius: 50%;
}

.ess_danh_gia .box-user .img-name-user>.info_user>p {
  margin-bottom: 8px !important;
}

.ess_danh_gia .box-user .img-name-user>.info_user>p:nth-child(1) {
  font-size: 14px;
  font-weight: 700;
  color: #294664;
  letter-spacing: 0.2px;
}

.ess_danh_gia .slick-track {
  gap: 10px;
  margin-bottom: 25px;
}

.xkld_banner .container-fluid {
  padding: 0;
  position: relative;
}

.xkld_banner .container-fluid .xkld_banner-title {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(41, 70, 100, 0.6);
}

.xkld_banner .container-fluid .xkld_banner-title p {
  text-align: center;
  margin-bottom: 0;
}

.xkld_banner .container-fluid .xkld_banner-title p>strong:first-child {
  color: #F6CB84;
  font-size: 22px;
  font-weight: 600;
}

.xkld_banner .container-fluid .xkld_banner-title p>strong:last-child {
  font-size: 30px;
  font-weight: 700;
  color: #FFF;
}

.xkld_breadcrumb {
  padding: 40px 0;
}

.xkld_breadcrumb ul {
  padding-left: 0;
  display: flex;
  gap: 8px;
  margin-bottom: 0;
  align-items: center;
  flex-wrap: wrap;
}

.xkld_breadcrumb ul li:first-child a,
.xkld_breadcrumb ul li:nth-child(3) {
  font-size: 14px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
}

.xkld_breadcrumb ul li:last-child {
  font-size: 14px;
  font-weight: 400;
  color: rgba(187, 144, 103, 1);
}

.xkld_all-content .container {
  padding: 40px;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 20px;
}

.xkld_all-content .container .xkld-h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
}

.xkld_all-content .container .xkld-thong-tin {
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
  letter-spacing: 0.2px;
  margin-bottom: 20px;
  text-align: justify;
}

.xkld_all-content .container .xkld-chon-quoc-gia {
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
  letter-spacing: 0.2px;
  margin-bottom: 10px;
}

.xkld_all-content .container .xkld-select {
  width: 100%;
  height: 46px;
  border-radius: 48px;
  background-color: rgba(241, 244, 247, 1);
  border: none;
  padding: 0 20px;
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.xkld_all-content .container .xkld-select img {
  max-width: 18px;
  max-height: 18px;
}

.xkld_all-content .container .xkld-select select {
  width: 96%;
  outline: none;
  border: none;
  background-color: transparent;
}

.xkld_all-content .container .xkld-btn {
  width: 100%;
  height: 43px;
  border-radius: 25px;
  border: none;
  outline: none;
  background-color: rgba(41, 70, 100, 1);
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
}

.xkld_all-content .container hr {
  margin-top: 50px;
  margin-bottom: 80px;
}

.xkld_all-content .row-tieu-chuan .tieu-chuan-tag {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
  margin-bottom: 10px;
}

.xkld_all-content .row-tieu-chuan .tieu-chuan-h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  letter-spacing: 0.2px;
  margin-bottom: 30px;
}

.xkld_all-content .row-tieu-chuan .box-dieu-kien-ngoai-hinh {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
}

.xkld_all-content .row-tieu-chuan .box-dieu-kien-ngoai-hinh .dk-text h6 {
  font-size: 18px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.xkld_all-content .row-tieu-chuan .box-dieu-kien-suc-khoe {
  display: flex;
  align-items: start;
  gap: 20px;
}

.xkld_all-content .row-tieu-chuan .box-dieu-kien-suc-khoe ul {
  padding-left: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.xkld_all-content .row-tieu-chuan .box-dieu-kien-suc-khoe ul li {
  min-width: 230px;
}

.xkld_all-content .row-tieu-chuan .box-dieu-kien-suc-khoe .dk-text h6 {
  font-size: 18px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.ksktd_all-content .container {
  padding: 40px;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 20px;
}

.ksktd_all-content .container .row-tuyen-dung {
  margin-bottom: 60px;
}

.ksktd_all-content .container .row-tuyen-dung .xkld-h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  letter-spacing: 0.2px;
}

.ksktd_all-content .container .row-tuyen-dung .xkld-thong-tin {
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
  margin-bottom: 30px;
}

.ksktd_all-content .container .row-tuyen-dung .btn-dat-lich {
  width: 180px;
  height: 43px;
  border: none;
  outline: none;
  border-radius: 25px;
  background-color: rgba(41, 70, 100, 1);
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
}

.ksktd_all-content .container .row-box-giai-thich {
  background-color: rgba(41, 70, 100, 1);
  border-radius: 15px;
}

.ksktd_all-content .container .row-box-giai-thich .col-sm-12:nth-child(1) {
  padding-left: 0 !important;
}

.ksktd_all-content .container .row-box-giai-thich .col-sm-12:nth-child(2) div {
  height: 100%;
  display: flex;
  align-items: center;
  padding-right: 65px;
}

.ksktd_all-content .container .row-box-giai-thich .col-sm-12:nth-child(2) div p {
  color: #FFF;
  font-size: 18px;
  font-weight: 400;
}

.ksktd_all-content .container .row-box-giai-thich .col-sm-12:nth-child(2) div strong {
  font-size: 22px;
  font-weight: 600;
  color: rgba(246, 203, 132, 1);
}

.ksk_working .container {
  border: 1px solid rgba(221, 227, 233, 1);
  padding: 40px;
  border-radius: 20px;
}

.ksk_working .container .ksk_working-h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  letter-spacing: 0.2px;
}

.ksk_working .container .ksk_working-p {
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
  text-align: justify;
}

.ksk_goi-dich-vu .container {
  padding: 90px 12px;
}

.ksk_goi-dich-vu .container .ksk_goi-dich-vu-tag {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
}

.ksk_goi-dich-vu .container .ksk_goi-dich-vu-h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  text-align: center;
  letter-spacing: 0.2px;
  margin-bottom: 35px;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 {
  padding: 0 25px;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu {
  border: 1px solid #ccc;
  border-radius: 15px;
  padding-top: 40px;
  padding-bottom: 85px;
  box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.06);
  height: 100%;
  position: relative;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 199px;
  height: 36px;
  background: url("../image/dam-may.png");
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .anh-goi-kham {
  text-align: center;
  margin-bottom: 20px;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu .ten-goi-kham {
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu .gia-goi-kham {
  text-align: center;
  color: rgba(187, 144, 103, 1);
  font-size: 36px;
  font-weight: 700;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu ul {
  padding-right: 32px;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu ul li {
  display: flex;
  align-items: start;
  margin-bottom: 16px;
  gap: 5px;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu ul li p {
  margin-bottom: 0 !important;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu .gia-goi-kham span:nth-child(1) {
  font-size: 18px;
  text-decoration: underline;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu .gia-goi-kham span:nth-child(2) {
  font-size: 18px;
}

.ksk_goi-dich-vu .row-cac-goi-kham .col-md-4 .column-dich-vu button {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 214px;
  height: 42px;
  border-radius: 25px;
  background-color: rgba(41, 70, 100, 1);
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
  border: none;
  outline: none;
}

.ksklx_dangky .container {
  padding: 40px;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 20px;
}

.ksklx_dangky .container .row-dang-ky {
  margin-bottom: 85px;
}

.ksklx_dangky .container .row-dang-ky h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  letter-spacing: 0.2px;
}

.ksklx_dangky .container .row-dang-ky p {
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
}

.ksklx_dangky .container .row-dang-ky a>button {
  width: 180px;
  height: 42px;
  border-radius: 25px;
  background-color: rgba(41, 70, 100, 1);
  color: #FFF;
  border: none;
  outline: none;
  font-size: 14px;
  font-weight: 500;
}

.ksklx_dangky .container .row-noi-dung .row {
  margin-bottom: 10px;
}

.ksklx_dangky .container .row-noi-dung .col-anh .row:nth-child(1) .col-md-6:nth-child(2) {
  text-align: right;
}

.ksklx_thong-tin {
  padding: 80px 0;
}

.ksklx_thong-tin .ksklx_thong-tin-tag {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
}

.ksklx_thong-tin .ksklx_thong-tin-h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  letter-spacing: 0.2px;
}

.ksklx_thong-tin .ksklx_thong-tin-p {
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan {
  margin-top: 40px;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3:nth-child(1) {
  height: 159px;
  border-radius: 15px 15px 0 0;
  position: relative;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3:nth-child(1) p {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3:nth-child(1)::before {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 290px;
  height: 50px;
  background: url("../image/dam-may-2.png");
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3 {
  background-color: rgba(41, 70, 100, 1);
  color: #FFF;
  text-align: center;
  border: 1px solid #FFF;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3 p {
  margin-top: 55px;
  font-size: 18px;
  font-weight: 600;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9>.row {
  height: 100%;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) {
  height: 159px;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .row {
  height: 100%;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4 {
  position: relative;
  background-color: rgba(241, 244, 247, 1);
  border: 1px solid #FFF;
  border-radius: 15px 15px 0 0;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4 p {
  position: relative;
  top: 75px;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4 {
  overflow: hidden;
}

.group-style {
  text-align: center;
  z-index: 1;
  position: relative;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  transform: translateY(20px);
  display: none;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(1) .group-style,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(2) .group-style,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(3) .group-style {
  display: block;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(1)>p,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(2)>p,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(3)>p {
  transform: translateY(-25px);
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(1)::before,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(2)::before,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(3)::before {
  position: absolute;
  top: -92px;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 165px;
  height: 165px;
  border-radius: 100%;
  background-color: rgba(41, 70, 100, 1);
  background-repeat: no-repeat;
}

/* .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(6) .col-md-4,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(10) .col-md-4,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(14) .col-md-4,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(18) .col-md-4,
.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(22) .col-md-4{
  background-color: rgba(248, 248, 248, 1);
} */

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(4n+4) .col-md-4 {
  background-color: rgba(248, 248, 248, 1);
  border: 1px solid #FFF;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(4n+6) .col-md-4 {
  background-color: rgba(241, 244, 247, 1);
  border: 1px solid #FFF;
}

.q_info_xn .row-text-heading h3 {
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.q_info_xn .row-info-user .col-user {
  background-color: rgba(241, 244, 247, 1);
  border-radius: 10px;
}

.q_info_xn .row-info-user .col-user .box_name {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 15px;
  border-radius: 10px;
  background-image: linear-gradient(to right, rgba(41, 70, 100, 1), rgba(78, 116, 155, 1));
}

.q_info_xn .row-info-user .col-user .box_name>img {
  width: 75px;
}

.q_info_xn .row-info-user .col-user .box_name h3 {
  font-size: 20px;
  font-weight: 600;
  color: rgba(246, 203, 132, 1);
}

.q_info_xn .row-info-user .col-user .box_name p {
  font-size: 16px;
  font-weight: 500;
  color: #FFF;
}

.q_info_xn .info {
  margin-bottom: 20px;
}

.q_info_xn .row-info-user .col-user .box_info {
  padding: 15px;
}

.q_info_xn .row-info-user .col-user .box_info tr {
  height: 30px;
}

.q_info_xn .row-info-user .col-user .box_info tr th {
  width: 150px;
}

.q_info_xn .row-info-user .col-user .box_info tr td {
  font-size: 18px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.q_info_xn .row-info-user .col-md-8 .row {
  height: 100%;
  background-color: rgba(241, 244, 247, 1);
  border-radius: 10px;
}

.q_info_xn .row-info-user .col-md-8 .row .col-md-4 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.q_info_xn .row-info-user .col-md-8 .row .item {
  width: 245px;
  height: 170px;
  background-color: #FFF;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.q_info_xn .row-info-user .col-md-8 .row .item p {
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 400;
  color: rgba(41, 70, 100, 1);
  text-align: center;
}

.q_info_xn .row-info-user .col-md-8 .row .item p.bmi {
  font-size: 18px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.q_info_xn .row-info-user .col-md-8 .row .item tr th {
  font-size: 17px;
  line-height: 1.3;
  text-align: center;
  font-weight: 400;
  color: rgba(41, 70, 100, 1);
  width: 100px;
}

.q_info_xn .row-info-user .col-md-8 .row .item tr td {
  font-size: 18px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.q_info_xn .list .card {
  padding: 0;
  border-radius: 10px;
}

.q_info_xn .list .card-header {
  height: 74px;
  color: #FFF;
  border-radius: 10px 10px 0 0;
  line-height: 58px;
  font-size: 20px;
  font-weight: 600;
  background: linear-gradient(to right, rgba(41, 70, 100, 1), rgba(78, 116, 155, 1));
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.q_info_xn .list .card-header>p {
  margin-bottom: 0;
}

.q_info_xn .list .card-header #select-kq-kham {
  border: none;
  outline: none;
  background-color: transparent;
  color: #FFF;
}

.q_info_xn .list .card-header #select-kq-kham>option {
  color: #000;
}

.q_info_xn .list .card-body table {
  width: 100%;
}

.q_info_xn .list .card-body table th {
  background-color: rgba(241, 244, 247, 1);
  text-align: center;
  color: rgba(41, 70, 100, 1);
}

.q_info_xn .list .card-body table td {
  text-align: center;
}

.q_info_xn .list .card-body table tr {
  height: 50px;
}



.kq_kham-suc-khoe-title {
  background: #fff;
}

.kq_kham-suc-khoe-title .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 16px;
  padding-bottom: 16px;
}

.kq_kham-suc-khoe-title .kq-kham-back {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  color: #294664;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-decoration: none;
}

.kq_kham-suc-khoe-title .kq-kham-back span {
  display: inline-block;
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border-bottom: 1.5px solid currentColor;
  border-left: 1.5px solid currentColor;
  color: inherit;
  font-size: 0;
  line-height: 0;
  transform: translateY(0px) rotate(45deg);
}

.kq-kham-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  color: #4a4a4a;
  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
}

.kq-kham-breadcrumb a {
  color: #4a4a4a;
  text-decoration: none;
  transition: color .2s ease;
}

.kq_kham-suc-khoe-title .kq-kham-back:hover,
.kq_kham-suc-khoe-title .kq-kham-back:focus-visible,
.kq-kham-breadcrumb a:hover,
.kq-kham-breadcrumb a:focus-visible,
.kq-kham-breadcrumb__current {
  /* !important để thắng rule 'a:hover { color: #BB9067 !important }' ở đầu file */
  color: #a78749 !important;
}

.kq-kham-breadcrumb__separator {
  display: inline-block;
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid #94a3b8;
  border-right: 1.5px solid #94a3b8;
  color: transparent;
  font-size: 0;
  line-height: 0;
  transform: translateY(-1px) rotate(45deg);
}

.kq-result-preview {
  padding-bottom: 120px;
  background: #fff;
}

.kq-result-preview__card {
  position: relative;
  padding: 0 30px 60px;
  border: 1px solid rgba(207, 179, 108, .30);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, .10);
}

.kq-result-preview__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 16px 20px;
  border-bottom: 4px solid #c5a059;
  border-radius: 0 0 20px 20px;
  background: linear-gradient(90deg, #294664 0%, #30649e 100%);
}

.kq-result-preview__heading {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 16px;
}

.kq-result-preview__icon {
  display: inline-flex;
  flex: 0 0 64px;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .20);
}

.kq-result-preview__icon img {
  display: block;
  width: 44px;
  height: 44px;
}

.kq-result-preview__heading-copy {
  min-width: 0;
}

.kq-result-preview__heading-copy h2 {
  margin: 0 0 4px;
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}

.kq-result-preview__heading-copy p {
  margin: 0;
  color: #cad5e2;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.kq-result-preview__heading-copy strong {
  font-weight: 600;
}

.kq-result-preview__download {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px;
  border: 0;
  border-radius: 80px;
  background: linear-gradient(90deg, #c5a059 0%, #cfb36c 100%);
  color: #fff;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  transition: filter .2s ease, transform .2s ease;
}

.kq-result-preview__download:hover,
.kq-result-preview__download:focus-visible {
  color: #fff;
  filter: brightness(1.06);
  transform: translateY(-1px);
}

.kq-result-preview__download svg {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
}

.kq-result-preview__content {
  min-height: 120px;
}

.kq-result-steps {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 32px 0;
  border-bottom: 1px solid rgba(207, 179, 108, .16);
  overflow-x: auto;
  scrollbar-width: none;
}

.kq-result-steps::-webkit-scrollbar {
  display: none;
}

.kq-result-steps__button {
  display: inline-flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  padding: 12px 14px;
  border: 1.4px solid rgba(207, 179, 108, .20);
  border-radius: 60px;
  background: #f9f5eb;
  color: #6c4c10;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: .32px;
  text-transform: uppercase;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.kq-result-steps__button:hover,
.kq-result-steps__button:focus-visible {
  border-color: #c5a059;
  color: #6c4c10;
}

.kq-result-steps__button.is-active {
  border-color: #c5a059;
  background: #c5a059;
  color: #fff;
}

.kq-result-steps__button svg {
  display: block;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
}

.kq-result-steps__separator {
  display: inline-block;
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid #a78749;
  border-right: 1.5px solid #a78749;
  transform: rotate(45deg);
}

.kq-lab-preview {
  padding-top: 20px;
  font-family: Inter, Arial, sans-serif;
}

.kq-lab-preview__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

.kq-lab-preview__heading h3 {
  margin: 0;
  color: #103051;
  font-family: Inter, Arial, sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.kq-lab-preview__legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  color: #4b4b4b;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}

.kq-lab-preview__legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.kq-lab-preview__legend i {
  display: inline-block;
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
}

.kq-lab-preview__legend .is-normal {
  background: #59c49c;
}

.kq-lab-preview__legend .is-outside {
  background: #ef4767;
}

.kq-lab-preview__legend .is-result {
  border-radius: 50% 50% 50% 0;
  background: #59c49c;
  transform: rotate(-45deg);
}

.kq-lab-preview__layout {
  display: grid;
  grid-template-columns: 212px minmax(0, 1fr);
  align-items: stretch;
  gap: 12px;
}

.kq-lab-preview__categories {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-height: 100%;
  padding: 6px;
  border-radius: 12px;
  background: linear-gradient(180deg, #cfb36c 0%, #a78749 100%);
}

.kq-lab-preview__category {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
  transition: border-color .2s ease, background-color .2s ease;
}

.kq-lab-preview__category:hover,
.kq-lab-preview__category:focus-visible,
.kq-lab-preview__category.is-active {
  border-color: rgba(255, 255, 255, .20);
  background: rgba(255, 255, 255, .12);
  color: #fff;
}

.kq-lab-preview__category-icon {
  display: inline-flex;
  flex: 0 0 26px;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #8f6e2e;
}

.kq-lab-preview__category-icon img {
  display: block;
  width: 18px;
  height: 18px;
  object-fit: contain;
}

.kq-lab-preview__panels,
.kq-lab-preview__panel {
  min-width: 0;
}

.kq-lab-preview__panel[hidden] {
  display: none !important;
}

.kq-lab-preview__table-wrap {
  min-width: 0;
  overflow-x: auto;
  border: 1px solid rgba(207, 179, 108, .16);
  border-radius: 12px;
  scrollbar-width: thin;
}

.kq-lab-preview__table {
  min-width: 820px;
  overflow: hidden;
  border-radius: inherit;
}

.kq-lab-preview__row {
  display: grid;
  grid-template-columns: minmax(145px, 1.2fr) minmax(90px, .72fr) minmax(220px, 1.65fr) minmax(110px, .9fr) 130px;
  align-items: stretch;
  min-height: 62px;
  background: #fff;
  color: #103051;
  font-size: 14px;
}

.kq-lab-preview__row:nth-child(odd):not(.kq-lab-preview__row--head) {
  background: #fffcf8;
}

.kq-lab-preview__row>div {
  display: flex;
  min-width: 0;
  align-items: center;
  padding: 10px 16px;
}

.kq-lab-preview__row--head {
  min-height: 48px;
  background: #f9f5eb;
  color: #a78749;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 18px;
}

.kq-lab-preview__row--head>div:not(:first-child) {
  justify-content: center;
  text-align: center;
}

.kq-lab-preview__name {
  gap: 8px;
  justify-content: space-between;
  font-weight: 500;
}

.kq-lab-preview__name .btn-xem-chi-tiet {
  display: inline-flex;
  flex: 0 0 18px;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
}

.kq-lab-preview__name .btn-xem-chi-tiet img {
  display: block;
  width: 14px;
  height: 14px;
  object-fit: contain;
}

.kq-lab-preview__value {
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.kq-lab-preview__value strong {
  color: #103051;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
}

.kq-lab-preview__value.is-outside strong {
  color: #f04444;
}

.kq-lab-preview__value span {
  color: #62748e;
  font-size: 11px;
  line-height: 16px;
}

.kq-lab-preview__reference {
  min-width: 0;
}

.kq-lab-preview__reference .thanh-chi-so {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}

.kq-lab-preview__reference .chi-so-be,
.kq-lab-preview__reference .chi-so-lon {
  width: 15%;
  height: 8px;
  background-color: rgba(255, 45, 91, 1);
}

.kq-lab-preview__reference .chi-so-can-bang {
  position: relative;
  width: 70%;
  height: 8px;
  background-color: rgba(0, 192, 146, 1);
}

.kq-lab-preview__reference .chi-so-can-bang.red,
.kq-lab-preview__reference .chi-so-be.red,
.kq-lab-preview__reference .chi-so-lon.red {
  background-color: rgba(255, 45, 91, 1);
}

.kq-lab-preview__reference .chi-so-can-bang.green,
.kq-lab-preview__reference .chi-so-be.green,
.kq-lab-preview__reference .chi-so-lon.green {
  background-color: rgba(0, 192, 146, 1);
}

.kq-lab-preview__reference .min,
.kq-lab-preview__reference .max {
  position: absolute;
  top: 10px;
  font-size: 12px;
}

.kq-lab-preview__reference .min {
  left: -5px;
}

.kq-lab-preview__reference .max {
  right: -5px;
}

.kq-lab-preview__reference .bong-bong {
  position: absolute;
  bottom: -7px;
  left: calc(50% - 6px);
  display: flex;
  gap: 5px;
  min-width: 51px;
  opacity: 0;
}

.kq-lab-preview__reference .one-color .bong-bong {
  bottom: 12px;
  left: 50%;
  justify-content: center;
  opacity: 1;
  transform: translateX(-50%);
}

.kq-lab-preview__reference .one-color .bong-bong p {
  color: #103051;
  white-space: nowrap;
}

.kq-lab-preview__reference .bong-bong>div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #103051;
}

.kq-lab-preview__reference .bong-bong img {
  display: initial;
  width: auto;
  height: auto;
}

.kq-lab-preview__reference .bong-bong p {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.kq-lab-preview__assessment {
  justify-content: center;
  gap: 6px;
  text-align: center;
}

.kq-lab-preview__assessment i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 11px;
  font-style: normal;
  line-height: 1;
}

.kq-lab-preview__assessment.is-high {
  color: #f04444;
}

.kq-lab-preview__assessment.is-low {
  color: #35b98a;
}

.kq-lab-preview__compare {
  justify-content: center;
}

.kq-lab-preview__compare .chart-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
}

.kq-lab-preview__compare svg {
  display: block;
  width: 27px;
  height: 27px;
}

.kq-result-preview__panel[hidden] {
  display: none;
}

.kq-result-tabs {
  padding-top: 24px;
  font-family: Inter, Arial, sans-serif;
}

.kq-result-tabs+.kq-result-tabs {
  padding-top: 32px;
}

.kq-result-tabs__title {
  margin: 0 0 16px;
  color: #294664;
  font-family: Inter, Arial, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}

.kq-result-tabs__nav {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}

.kq-result-tabs__nav::-webkit-scrollbar {
  display: none;
}

.kq-result-tabs__tab {
  flex: 0 0 auto;
  padding: 10px 30px;
  border: 1px solid rgba(207, 179, 108, .16);
  border-radius: 10px 10px 0 0;
  background: #fbf7ec;
  color: #294664;
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.kq-result-tabs__tab:hover,
.kq-result-tabs__tab:focus-visible {
  border-color: rgba(207, 179, 108, .5);
  color: #294664;
}

.kq-result-tabs__tab.is-active {
  border: 0;
  border-bottom: 2px solid #c5a059;
  border-radius: 10px 10px 0 0;
  background: #294664;
  color: #fff;
  font-weight: 600;
}

.kq-result-tabs__panel[hidden] {
  display: none;
}

.kq-result-detail {
  border: 1px solid rgba(207, 179, 108, .16);
  border-top: 0;
  border-radius: 0 0 13px 13px;
  overflow: hidden;
}

.kq-result-detail__row {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  padding: 16px 24px;
}

.kq-result-detail__row:nth-child(odd) {
  background: #fffcf8;
}

.kq-result-detail__row.is-plain {
  grid-template-columns: minmax(0, 1fr);
}

.kq-result-detail__label {
  color: #294664;
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
}

.kq-result-detail__value {
  color: #103051;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.kq-result-detail__text {
  margin: 0;
}

.kq-result-detail__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kq-result-detail__list li {
  position: relative;
  padding-left: 14px;
}

.kq-result-detail__list li::before {
  position: absolute;
  top: 0;
  left: 0;
  color: #c5a059;
  content: "•";
}

.kq-result-detail__bullet-label {
  color: #294664;
  font-weight: 600;
}

.kq-result-conclusion {
  padding-top: 24px;
  font-family: Inter, Arial, sans-serif;
}

.kq-result-conclusion__card {
  padding: 24px;
  border: 1px solid rgba(207, 179, 108, .16);
  border-radius: 13px;
  background: #fffcf8;
}

.kq-result-conclusion__card+.kq-result-conclusion__card {
  margin-top: 24px;
}

.kq-result-conclusion__card h4 {
  margin: 0 0 24px;
  color: #294664;
  font-family: Inter, Arial, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}

.kq-result-preview__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 220px;
  padding: 40px 20px;
}

.kq-result-preview__placeholder p {
  margin: 0;
  color: #8f6e2e;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.kq-result-preview__actions {
  position: absolute;
  bottom: 0;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  transform: translate(-50%, 50%);
}

.kq-result-preview__prev,
.kq-result-preview__next {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 10px 16px;
  border: 0;
  border-radius: 80px;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
  transition: filter .2s ease, background-color .2s ease, color .2s ease;
}

.kq-result-preview__prev[hidden],
.kq-result-preview__next[hidden] {
  display: none;
}

.kq-result-preview__prev {
  border: 1px solid rgba(207, 179, 108, .16);
  background: #fbf7ec;
  color: #8f6e2e;
}

.kq-result-preview__prev:hover,
.kq-result-preview__prev:focus-visible {
  border-color: rgba(207, 179, 108, .5);
  color: #8f6e2e;
}

.kq-result-preview__next {
  background: linear-gradient(83deg, #294664 -29.47%, #30649e 100%);
  color: #fff;
}

.kq-result-preview__next:hover,
.kq-result-preview__next:focus-visible {
  color: #fff;
  filter: brightness(1.08);
}

.kq-result-preview__prev svg,
.kq-result-preview__next svg {
  display: block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
}

@media only screen and (min-width: 1400px) {

  .kq_kham-suc-khoe-title>.container,
  .kq-result-preview>.container,
  .bang-ket-qua-xet-nghiem>.container,
  .nhan-dinh-ket-qua>.container,
  .ket-qua-lam-sang>.container {
    max-width: 1344px;
  }
}

@media only screen and (max-width: 1399.98px) {

  .kq_kham-suc-khoe-title>.container,
  .kq-result-preview>.container,
  .bang-ket-qua-xet-nghiem>.container,
  .nhan-dinh-ket-qua>.container,
  .ket-qua-lam-sang>.container {
    width: 100%;
    max-width: none;
    padding-right: 15px;
    padding-left: 15px;
  }
}

@media only screen and (max-width: 1199.98px) {
  .kq-result-preview__header {
    gap: 16px;
  }

  .kq-result-preview__heading {
    flex: 1 1 auto;
    gap: 12px;
  }

  .kq-result-preview__icon {
    flex-basis: 52px;
    width: 52px;
    height: 52px;
  }

  .kq-result-preview__icon img {
    width: 36px;
    height: 36px;
  }

  .kq-result-preview__heading-copy h2 {
    font-size: 22px;
  }

  .kq-result-preview__heading-copy p {
    font-size: 14px;
    line-height: 22px;
  }

  .kq-result-preview__download {
    padding: 12px 14px;
    font-size: 14px;
  }
}

@media only screen and (max-width: 991.98px) {
  .kq-lab-preview__layout {
    display: block;
  }

  .kq-lab-preview__categories {
    flex-direction: row;
    margin-bottom: 12px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .kq-lab-preview__categories::-webkit-scrollbar {
    display: none;
  }

  .kq-lab-preview__category {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
  }
}

@media only screen and (max-width: 575.98px) {
  .kq-lab-preview {
    padding-top: 16px;
  }

  .kq-lab-preview__heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
  }

  .kq-lab-preview__heading h3 {
    font-size: 18px;
    line-height: 24px;
  }

  .kq-lab-preview__legend {
    justify-content: flex-start;
    gap: 10px;
    font-size: 10px;
  }

  .kq-lab-preview__category {
    padding: 8px 10px;
    font-size: 13px;
  }
}

.bang-ket-qua-xet-nghiem .container {
  padding-top: 50px;
  padding-bottom: 0;
}

.bang-ket-qua-xet-nghiem .table-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bang-ket-qua-xet-nghiem .table-heading .tieu-de {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.bang-ket-qua-xet-nghiem .table-heading .tieu-de h3 {
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
  margin-bottom: 0;
}

.bang-ket-qua-xet-nghiem .table-heading .dich-vu-kham {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.bang-ket-qua-xet-nghiem .table-heading .dich-vu-kham span {
  font-size: 14px;
  font-weight: 400;
  color: rgba(0, 115, 198, 1);
}

.bang-ket-qua-xet-nghiem .table-heading .dich-vu-kham p {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.bang-ket-qua-xet-nghiem .container .table-chu-thich {
  display: flex;
  gap: 10px;
  justify-content: end;
}

.bang-ket-qua-xet-nghiem .container .table-chu-thich .children-x {
  display: flex;
  align-items: center;
  gap: 5px;
}

.bang-ket-qua-xet-nghiem .container .table-chu-thich .children-x span {
  font-size: 12px;
  font-weight: 400;
  color: rgba(41, 70, 100, 1);
}

.banner-health-premium {
  position: relative;
}

.banner-health-premium .container-fluid {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.banner-health-premium .container-fluid .slick-slider .slick-track {
  margin-bottom: 0;
}

.banner-health-premium .container-fluid .slick-slider .slick-dots {
  bottom: 10px !important;
}

.banner-health-premium .box-content {
  position: absolute;
  top: 125px;
  left: 16%;
}

.banner-health-premium .box-content .image_logo {
  width: max-content;
}

.banner-health-premium .box-content .ess_description p {
  width: 460px;
  margin-top: 57px;
  margin-bottom: 60px;
  font-size: 48px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
  line-height: 58px;
  font-family: 'Montserrat';
}

.banner-health-premium .box-content .ess_breadcrumb>ul {
  padding-left: 0 !important;
  display: flex;
  align-items: center;
  gap: 8px;
}

.banner-health-premium .box-content .ess_breadcrumb>ul>li:first-child>a {
  color: rgba(41, 70, 100, 1);
  font-size: 14px;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  font-family: 'Montserrat';
}

.banner-health-premium .box-content .ess_breadcrumb>ul>li:last-child {
  color: rgba(41, 70, 100, 1) !important;
  font-size: 14px;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  font-family: 'Montserrat';
}

.premium-dich-vu {
  padding: 90px 0;
}

.premium-dich-vu .premium-dich-vu-tag {
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
}

.premium-dich-vu .premium-dich-vu-h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
}

.premium-dich-vu .premium-dich-vu-p {
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
}

.premium-dich-vu .box-link-page .box-page {
  box-shadow: 0px 0px 15px 0px rgba(41, 70, 100, 0.2);
  padding: 15px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 30px;
}

.premium-dich-vu .box-link-page .box-page>img {
  border-radius: 10px;
}

.premium-dich-vu .box-link-page .box-page .box-page-text h4 {
  font-size: 22px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.premium-dich-vu .box-link-page .box-page .box-page-text p {
  font-size: 18px;
  font-weight: 400;
  color: rgba(41, 70, 100, 1);
}

.premium-chuyenkhoanoibat {
  padding: 70px;
  background-color: rgba(249, 244, 240, 1);
}

.premium-chuyenkhoanoibat .container h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  margin-bottom: 32px;
}

.premium-chuyenkhoanoibat .box-chuyen-khoa {
  position: relative;
  height: 100%;
}

.premium-chuyenkhoanoibat .container .row .col-md-3 {
  margin-bottom: 12px;
}

.premium-chuyenkhoanoibat .box-chuyen-khoa>img:nth-child(1) {
  height: 100%;
  border-radius: 12px;
}

.premium-chuyenkhoanoibat .box-chuyen-khoa h4 {
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
  color: #FFF;
  z-index: 2;
}

.premium-chuyenkhoanoibat .box-chuyen-khoa .sub-bg {
  position: absolute;
  bottom: 0;
  left: 0;
}

.kskdn-banner .container-fluid {
  position: relative;
  padding: 0;
}

.kskdn-banner .container-fluid .text-title {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: rgba(41, 70, 100, 0.6);
}

.kskdn-banner .container-fluid .text-title h3 {
  font-size: 22px;
  font-weight: 600;
  color: rgba(246, 203, 132, 1);
}

.kskdn-banner .container-fluid .text-title h1 {
  font-size: 30px;
  font-weight: 600;
  color: rgba(255, 255, 255, 1);
}

.form-dang-ky-sk .container {
  padding: 40px 50px;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 20px;
}

.form-dang-ky-sk .container .col-md-6:nth-child(2) {
  text-align: right;
}

.form-dang-ky-sk .box-input {
  height: 46px;
  background-color: rgba(241, 244, 247, 1);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 15px;
  border-radius: 48px;
  margin-bottom: 16px;
}

.form-dang-ky-sk .box-input input {
  border: none;
  outline: none;
  background-color: transparent;
  width: 100%;
}

.form-dang-ky-sk form .box-group {
  display: flex;
  justify-content: space-between;
}

.form-dang-ky-sk form .box-group .box-input {
  width: 49%;
}

.form-dang-ky-sk form .text-area {
  padding: 16px 21px;
  background-color: rgba(241, 244, 247, 1);
  border-radius: 15px;
  margin-bottom: 16px;
}

.form-dang-ky-sk form .text-area textarea {
  width: 100%;
  height: 127px;
  background-color: transparent;
  border: none;
  outline: none;
}

.form-dang-ky-sk form input,
.form-dang-ky-sk form textarea {
  font-size: 15px;
}

.form-dang-ky-sk form .btn-submit {
  width: 100%;
  height: 50px;
  border: none;
  border-radius: 48px;
  color: rgba(41, 70, 100, 1);
  font-size: 16px;
  font-weight: 700;
  background: linear-gradient(to bottom left, rgba(246, 203, 132, 1), rgba(187, 144, 103, 1));
}

.form-dang-ky-sk .col-md-6>h1 {
  font-size: 40px;
  font-weight: 700;
  color: #294664;
}

.card-gioi-thieu {
  padding: 70px 0;
}

.card-gioi-thieu .box-card {
  background-color: rgba(249, 244, 240, 1);
  padding: 20px 32px;
  border-radius: 15px;
  height: 100%;
}

.card-gioi-thieu .box-card .box-card-img {
  text-align: center;
}

.card-gioi-thieu .box-card .box-card-img img {
  width: 60px;
}

.card-gioi-thieu .box-card h4 {
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.card-gioi-thieu .box-card p {
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
  /* display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; */
}

.premium-quy-trinh-kham {
  padding: 30px 0;
}

.premium-quy-trinh-kham .container h6 {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
}

.premium-quy-trinh-kham .container h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  margin-bottom: 80px;
}

.premium-quy-trinh-kham .container .box-quytrinh {
  padding: 20px;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 15px;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.06);
  position: relative;
  padding-top: 80px;
  height: 100%;
}

.premium-quy-trinh-kham .container .box-quytrinh .box-quytrinh-img {
  position: absolute;
  width: 121px;
  top: -65px;
  left: 50%;
  transform: translateX(-50%);
}

.premium-quy-trinh-kham .container .box-quytrinh .box-quytrinh-img img:nth-child(2) {
  position: absolute;
  left: 50%;
  bottom: -15px;
  transform: translate(-50%);
}

.premium-quy-trinh-kham .container .box-quytrinh .box-quytrinh-text h5 {
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.premium-quy-trinh-kham .container .box-quytrinh .box-quytrinh-text p {
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  color: rgba(74, 74, 74, 1);
}

.premium-dich-vu-tang-kem {
  padding: 80px 0;
  background-color: rgba(187, 144, 103, 0.1);
}

.premium-dich-vu-tang-kem .container>h6 {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: rgba(187, 144, 103, 1);
}

.premium-dich-vu-tang-kem .container h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
}

.premium-dich-vu-tang-kem .row .col-md-2 {
  padding: 0 !important;
}

.premium-dich-vu-tang-kem .row .box_right {
  height: 100%;
  background-color: rgba(41, 70, 100, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px;
  gap: 10px;
}

.premium-dich-vu-tang-kem .row .box_right>h6 {
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #FFF;
}

.premium-dich-vu-tang-kem .row .box_right>img {
  width: 50px;
}

.premium-dich-vu-tang-kem .container .row-1 .col-md-2:nth-child(4) .box_right {
  background-color: rgba(187, 144, 103, 1);
}

.premium-dich-vu-tang-kem .container .row-2 .col-md-2:nth-child(4n+1) .box_right {
  background-color: rgba(187, 144, 103, 1);
}

.dich-vu-lay-mau-xn .container-fluid {
  padding: 0;
}

.dich-vu-lay-mau-xn {
  position: relative;
}

.dich-vu-lay-mau-xn .container-fluid .slick-track {
  margin-bottom: 0;
}

.dich-vu-lay-mau-xn .box-content {
  position: absolute;
  top: 50%;
  left: 16%;
  transform: translateY(-50%);
}

.thong-tin-cac-dv-xn .box-1 {
  position: relative;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 10px;
  padding: 15px;
  width: 392px;
  height: 254px;
}

.thong-tin-cac-dv-xn .box-2 {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 10px;
  background-color: rgba(41, 70, 100, 1);
  top: 0;
  left: 0;
  color: #FFF;
  padding: 15px;
  display: none;
}

.thong-tin-cac-dv-xn .box-1:hover .box-2 {
  display: block;
}

.goi-xet-nghiem {
  padding: 50px 0;
  background-color: rgba(246, 248, 250, 1);
}

.goi-xet-nghiem .container>h6 {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
}

.goi-xet-nghiem .container>h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  margin-bottom: 20px;
}

.goi-xet-nghiem .container .col-md-5 .nav-link.active {
  border: 1px solid rgba(187, 144, 103, 1);
}

.goi-xet-nghiem .container .col-md-5 .nav-link {
  background-color: #FFF;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding: 16px;
}

.goi-xet-nghiem .container .col-md-5 .nav-link h5 {
  font-size: 22px;
  font-weight: 600;
  color: rgba(37, 43, 66, 1);
  margin-bottom: 0;
  text-align: left;
  padding: 0 0px 0 10px;
  width: 100%;
}

.goi-xet-nghiem .container .col-md-5 .nav-link span {
  color: #FFF;
  border: 1px solid;
  min-width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: rgba(187, 144, 103, 1);
}

.goi-xet-nghiem .container .col-md-7 .tab-pane {
  border: 1px solid #ccc;
  border-radius: 16px;
  padding: 16px;
}

.goi-xet-nghiem .container .col-md-7 .tab-pane img {
  width: 740px;
  height: 376px;
}

.goi-xet-nghiem .container .col-md-7 .tab-pane .box-dv h5 {
  margin-top: 10px;
  font-size: 26px;
  font-weight: 600;
  color: rgba(37, 43, 66, 1);
}

.goi-xet-nghiem .container .col-md-7 .tab-pane .box-dv div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.goi-xet-nghiem .container .col-md-7 .tab-pane .box-dv div>p {
  margin-bottom: 0;
  color: rgba(36, 36, 36, 1);
  padding-right: 10px;
}

.goi-xet-nghiem .container .col-md-7 .tab-pane .box-dv button.btn_dat_lich {
  min-width: 170px;
  height: 48px;
  border-radius: 25px;
  color: #FFF;
  background-color: rgba(41, 70, 100, 1);
  border: none;
  outline: none;
}

.quy-trinh-kham {
  padding: 50px 0;
}

.quy-trinh-kham .container>h6 {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: rgba(187, 144, 103, 1);
}

.quy-trinh-kham .container>h1 {
  text-align: center;
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
  margin-bottom: 80px;
}

.quy-trinh-kham .container .box-quy-trinh {
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.06);
  border-radius: 15px;
  padding: 15px;
  position: relative;
  padding-top: 90px;
  height: 100%;
}

.quy-trinh-kham .container .box-quy-trinh .box-img-quytrinh {
  position: absolute;
  top: -52px;
  left: 50%;
  transform: translateX(-50%);
}

.quy-trinh-kham .container .box-quy-trinh .box-img-quytrinh img:nth-child(2) {
  position: absolute;
  left: 50%;
  bottom: -16px;
  transform: translateX(-50%);
}

.quy-trinh-kham .container .box-quy-trinh h5 {
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.quy-trinh-kham .container .box-quy-trinh p {
  text-align: center;
  color: rgba(74, 74, 74, 1);
}

.quang-cao-dvxn {
  padding: 100px 0;
}

.quang-cao-dvxn .box-quang-cao {
  background: linear-gradient(to bottom right, rgba(41, 70, 100, 1), rgba(78, 116, 155, 1));
  position: relative;
  padding: 20px 0;
  border-radius: 15px;
}

.quang-cao-dvxn .box-quang-cao .box-hinhanh>img {
  position: absolute;
  bottom: 0;
}

.quang-cao-dvxn .box-quang-cao .box-text h4 {
  font-size: 24px;
  font-weight: 600;
  color: #FFF;
}

.quang-cao-dvxn .box-quang-cao .box-text p {
  font-size: 16px;
  font-weight: 400;
  color: #FFF;
}

.quang-cao-dvxn .box-quang-cao .box-btn {
  display: flex;
  justify-content: center;
  align-items: center;
}

.quang-cao-dvxn .box-quang-cao .box-btn button {
  width: 179px;
  height: 46px;
  background: linear-gradient(to bottom, rgba(246, 203, 132, 1), rgba(187, 144, 103, 1));
  color: rgba(41, 70, 100, 1);
  font-weight: 500;
  border-radius: 36px;
  border: none;
  outline: none;
}

.banner-chuan-doan-online .container-fluid {
  padding: 0;
  position: relative;
}

.banner-chuan-doan-online .container-fluid .banner-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(41, 70, 100, 0.6);
}

.banner-chuan-doan-online .container-fluid .banner-text p {
  text-align: center;
}

.banner-chuan-doan-online .container-fluid .banner-text strong:nth-child(1) {
  font-size: 22px;
  font-weight: 600;
  color: rgba(246, 203, 132, 1);
}

.banner-chuan-doan-online .container-fluid .banner-text strong:nth-child(3) {
  font-size: 30px;
  font-weight: 600;
  color: #FFF;
}

.tra-cuu-kq-online {
  padding: 0px 0 80px 0 !important;
}

/* Online diagnosis checker – step 1 shell. The symptom content keeps its existing logic for now. */
.page_chuan_doan_online+.tra-cuu-kq-online {
  padding-top: 0 !important;
}

.page_chuan_doan_online+.tra-cuu-kq-online .kh_box_checker {
  padding: 30px 32px 0;
  border: 1px solid rgba(207, 179, 108, 0.30);
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.10);
}

.online-checker__header {
  margin-bottom: 14px;
  text-align: center;
}

.online-checker__header h1 {
  margin: 0;
  color: #103051;
  font-family: "Playfair Display", serif;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0.6px;
  line-height: normal;
  text-transform: uppercase;
}

.online-checker__header p {
  max-width: 794px;
  margin: 14px auto 0;
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.online-checker__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(207, 179, 108, 0.16);
}

.online-checker__steps .step-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-height: 58px;
  padding: 12px 24px;
  border: 1px solid #CAD5E2;
  border-radius: 12px;
  background: #FFF;
  box-shadow: 0 4px 12px rgba(17, 112, 136, 0.06);
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: normal;
  text-decoration: none;
}

.online-checker__steps .step-item::before,
.online-checker__steps .step-item::after {
  display: none;
}

.online-checker__steps .step-item span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border-radius: 60px;
  background: rgba(203, 213, 225, 0.20);
  color: #103051;
  font-size: 18px;
  font-weight: 700;
}

.online-checker__steps .step-item.active {
  border-color: transparent !important;
  background: #CFB36C !important;
  box-shadow: none;
  color: #FFF !important;
}

.online-checker__steps .step-item.active span {
  background: #FFF;
  color: #A78749;
}

.page_chuan_doan_online+.tra-cuu-kq-online .kh_step_checker .online-step {
  border: 0;
  border-radius: 0;
  padding: 0 0 80px;
}

.diagnosis-step-one__intro {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 50px;
}

.diagnosis-step-one__intro h2 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.diagnosis-step-one__intro p {
  margin: 0;
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.diagnosis-patients {
  margin-top: 40px;
}

.diagnosis-patients>h3 {
  color: #103051;
  font-size: 18px;
  font-family: Inter, sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0 0 14px;
}

.diagnosis-patients__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 14px;
}

.diagnosis-patient-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px;
  border: 1px solid #CAD5E2;
  border-radius: 12px;
  background: #FFF;
  box-shadow: 0 6px 16px rgba(17, 112, 136, 0.06);
  color: #103051;
  cursor: pointer;
  text-align: left;
  transition: border-color .2s ease, background-color .2s ease;
}

.diagnosis-patient-card.is-active {
  border-color: #CFB36C;
  background: #F9F5EA;
}

.diagnosis-patient-card__icon {
  display: inline-flex;
  flex: 0 0 46px;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: #FFF;
}

.diagnosis-patient-card__icon img {
  display: block;
  width: 30px;
  height: 30px;
  object-fit: contain;
}

.diagnosis-patient-card__content {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 5px;
}

.diagnosis-patient-card__content strong {
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
}

.diagnosis-patient-card__content small {
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: normal;
}

.diagnosis-symptoms {
  margin-top: 40px;
}

.diagnosis-symptoms>h3 {
  margin: 0 0 14px;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
}

.diagnosis-symptoms__search {
  position: relative;
  display: block;
}

.diagnosis-symptoms__search input {
  width: 100%;
  height: 46px;
  padding: 0 50px 0 16px;
  border: 1px solid #E2E8F0;
  border-radius: 60px;
  background: #F8FAFC;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 15px;
  outline: none;
}

.diagnosis-symptoms__search input::placeholder {
  color: #62748E;
}

.diagnosis-symptoms__search input:focus {
  border-color: #CFB36C;
}

.diagnosis-symptoms__search .fa {
  position: absolute;
  top: 50%;
  right: 18px;
  color: #103051;
  font-size: 18px;
  transform: translateY(-50%);
  pointer-events: none;
}

.diagnosis-symptoms__popular-title {
  margin-top: 40px !important;
}

.diagnosis-symptoms__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.diagnosis-symptom-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 7px 14px;
  border: 1px solid #E2E8F0;
  border-radius: 60px;
  background: #FFF;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
}

.diagnosis-symptom-chip .fa {
  display: none;
  color: #A78749;
  font-size: 12px;
}

.diagnosis-symptom-chip.is-active {
  border-color: #CFB36C;
  background: rgba(207, 179, 108, 0.16);
}

.diagnosis-symptom-chip.is-active .fa {
  display: inline-block;
}

.diagnosis-symptom-chip[hidden] {
  display: none;
}

.diagnosis-symptoms__empty {
  margin: 14px 0 0;
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 15px;
}

/* Online diagnosis – AJAX step 2 response. */
.online-diagnosis-step-two {
  padding-top: 50px;
}

.online-diagnosis-step-two__intro {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 40px;
}

.online-diagnosis-step-two__intro h2 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: normal;
}

.online-diagnosis-step-two__intro p {
  margin: 0;
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

.online-diagnosis-step-two .diaonl-item {
  margin-bottom: 34px;
}

.online-diagnosis-step-two .diaonl-item__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.online-diagnosis-step-two .diaonl-item h3 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: normal;
}

.online-diagnosis-step-two .diaonl-item h3::before {
  display: inline-block;
  margin-right: 6px;
  color: #A78749;
  content: "/";
}

.online-diagnosis-step-two .diaonl-item__selected-count {
  flex: 0 0 auto;
  color: #A78749;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.online-diagnosis-step-two .diaonl-item ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px 30px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.online-diagnosis-step-two .diaonl-item ul li {
  width: auto;
  margin: 0;
  padding: 0;
}

.online-diagnosis-step-two .diaonl-item label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
}

.online-diagnosis-step-two .diaonl-item input[type="checkbox"] {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  margin: 0;
  accent-color: #A78749;
  cursor: pointer;
}

.online-checker__actions {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 0 auto -16px;
}

.online-checker__actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 38px;
  padding: 8px 18px;
  border-radius: 80px;
  font-family: "Playfair Display", serif;
  font-size: 17px;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
}

.online-checker__reset {
  border: 1px solid rgba(207, 179, 108, 0.16);
  background: #FBF7EC;
  color: #8F6E2E;
}

.online-checker__reset .fa {
  color: #8F6E2E;
  font-size: 16px;
}

.online-checker__next {
  border: 1px solid transparent;
  background: linear-gradient(83deg, #294664 -29.47%, #30649E 100%);
  color: #FFF;
}

.online-checker__next .fa {
  color: #FFF;
  font-size: 16px;
}

.online-checker__next:hover,
.online-checker__next:focus {
  background: #A78749;
}

.online-checker__next:disabled {
  background: #CBD5E1;
  color: #FFF;
  cursor: not-allowed;
}

/* Online diagnosis – AJAX step 3 response. */
.online-diagnosis-step-three {
  padding-top: 50px;
}

.online-diagnosis-step-three__intro {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 40px;
}

.online-diagnosis-step-three__intro h2 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: normal;
}

.online-diagnosis-step-three__intro p {
  margin: 0;
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
}

.online-diagnosis-step-three__results {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.online-diagnosis-step-three .onlfinish-item {
  position: relative;
  padding: 18px;
  border: 1px solid rgba(203, 213, 225, 0.20);
  border-radius: 12px;
  background: #F6F7F8;
}

.online-diagnosis-step-three .onlfinish-item.active {
  border-color: rgba(207, 179, 108, 0.16);
  background: #FFFCF8;
}

.online-diagnosis-step-three .onlfinish-item__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.online-diagnosis-step-three .onlfinish-item h3 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: normal;
}

.online-diagnosis-step-three .onlfinish-item h3::before {
  display: inline-block;
  margin-right: 6px;
  color: #A78749;
  content: "/";
}

.online-diagnosis-step-three .onlfinish-item h3 a {
  color: inherit;
  text-decoration: none;
}

.online-diagnosis-step-three .onlfinish-item .show-content {
  display: inline-flex;
  position: static !important;
  align-items: center;
  gap: 8px;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
  background-position: initial !important;
  color: #A78749;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: normal;
  cursor: pointer;
}

.online-diagnosis-step-three .onlfinish-item .show-content .fa {
  display: inline-block;
  width: auto;
  height: auto;
  margin: 0;
  background: none !important;
  background-image: none !important;
  font-size: 14px;
  transition: transform .2s ease;
}

.online-diagnosis-step-three .onlfinish-item.active .show-content .fa {
  transform: rotate(180deg);
}

.online-diagnosis-step-three .onlfinish-item ul {
  display: none;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 24px;
  margin: 22px 0 0;
  padding: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 24px;
  list-style: none;
}

.online-diagnosis-step-three .onlfinish-item.active ul {
  display: grid;
}

.online-diagnosis-step-three .onlfinish-item.active .show-content {
  background-image: none !important;
}

.online-diagnosis-step-three .onlfinish-item ul li {
  margin: 0;
  padding: 0;
}

.online-diagnosis-step-three .onlfinish-item ul li::before {
  margin-right: 8px;
  color: #A78749;
  content: "•";
}

.online-diagnosis-step-three__empty {
  margin: 0;
  padding: 24px;
  border: 1px solid rgba(203, 213, 225, 0.20);
  border-radius: 12px;
  background: #F6F7F8;
  color: #4B4B4B;
  font-family: Inter, sans-serif;
  font-size: 16px;
  text-align: center;
}

/* Login result lookup */
.page_login {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 160px);
  padding: 60px 15px;
  background: url('../image/login-medical-background.png') center / cover no-repeat;
}

.login-glass-card {
  width: 100%;
  max-width: 560px;
  padding: 60px;
  border: 1px solid rgba(241, 245, 249, 0.20);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: 0 1px 2px -1px rgba(0, 0, 0, 0.10);
  backdrop-filter: blur(8px);
}

.login-glass-card__heading {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.login-glass-card__heading h1 {
  margin: 0;
  color: #FFF;
  font-family: "Playfair Display", serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 2px;
  text-align: center;
  text-transform: uppercase;
}

.login-glass-card__heading p {
  margin: 0;
  color: #F1F5F9;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  text-align: justify;
}

.login-glass-card .alert,
.login-glass-card .alert-danger {
  margin: 20px 0 0;
}

.login-glass-card__form {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 28px;
}

.login-glass-card__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.login-glass-card__field label {
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.login-glass-card__field input {
  width: 100%;
  padding: 16px 12px;
  border: 1px solid rgba(226, 232, 240, 0.20);
  border-radius: 60px;
  outline: 0;
  background: rgba(248, 250, 252, 0.10);
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.login-glass-card__field input::placeholder {
  color: #D1D5DB;
  opacity: 1;
}

.login-glass-card__field input:focus {
  border-color: rgba(255, 255, 255, 0.75);
}

.login-glass-card__submit {
  min-height: 52px;
  padding: 0 14px;
  border: 0;
  border-radius: 60px;
  background: linear-gradient(90deg, #A78749 0%, #CFB36C 100%);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
  color: #FFF;
  font-family: "Playfair Display", serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 24px;
  text-align: center;
  text-transform: uppercase;
}

.login-glass-card__submit:hover,
.login-glass-card__submit:focus {
  filter: brightness(1.08);
}

.login-glass-card__links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  margin-top: 20px;
}

.login-glass-card__links a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  text-align: center;
  text-decoration: none;
}

.login-glass-card__links img {
  display: block;
  width: 20px;
  height: 20px;
  object-fit: contain;
}

@media (max-width: 575.98px) {
  .page_login {
    min-height: calc(100vh - 100px);
    padding: 30px 15px;
  }

  .login-glass-card {
    padding: 36px 20px;
  }

  .login-glass-card__heading h1 {
    font-size: 25px;
    letter-spacing: 1px;
  }

  .login-glass-card__links {
    flex-direction: column;
    gap: 12px;
  }

  .login-glass-card__links a {
    font-size: 15px;
  }
}

@media (max-width: 767.98px) {
  .page_chuan_doan_online+.tra-cuu-kq-online .kh_box_checker {
    padding: 30px 15px 0;
  }

  .online-checker__header h1 {
    font-size: 24px;
  }

  .online-checker__actions button {
    font-size: 13px;
  }

  .online-checker__steps {
    grid-template-columns: 1fr;
  }

  .diagnosis-patients__list {
    grid-template-columns: 1fr;
  }

  .online-diagnosis-step-two .diaonl-item ul {
    grid-template-columns: 1fr;
  }

  .online-diagnosis-step-two .diaonl-item__heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .online-diagnosis-step-three .onlfinish-item ul {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

.tra-cuu-kq-online .the-step .step-item:nth-child(1) {
  border-radius: 10px 0 0 10px;
}

.tra-cuu-kq-online .the-step .step-item.active {
  background-color: rgba(187, 144, 103, 1) !important;
}

.tra-cuu-kq-online .the-step .step-item.active::after {
  border-left: 20px solid rgba(187, 144, 103, 1);
}

.tra-cuu-kq-online .kh_step_checker .online-step {
  border: 1px solid rgba(221, 227, 233, 1);
  padding: 20px;
  border-radius: 10px;
}

.tra-cuu-kq-online .kh_step_checker .online-step .btn-next {
  width: 194px;
  border-radius: 36px !important;
  background-color: rgba(41, 70, 100, 1) !important;
  color: #FFF !important;
}

.table-ket-qua {
  padding: 20px 0;
}

.table-ket-qua .col-btn {
  border: 1px solid #CCC;
  background-color: rgba(41, 70, 100, 1);
  border-radius: 10px;
  padding: 10px;
}

.table-ket-qua .col-btn button {
  width: 100%;
  height: 50px;
  margin-bottom: 10px;
  color: #FFF;
  background-color: rgba(34, 58, 83, 1) !important;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 10px;
}

.table-ket-qua .col-btn button h5 {
  margin-bottom: 0;
}

.table-ket-qua .col-btn button.active {
  border: 1px solid rgba(246, 203, 132, 1);
}

.table-ket-qua .noi-dung-tab {
  height: 100%;
  border: 1px solid rgba(221, 227, 233, 1);
  border-radius: 10px;
  padding: 10px;
}

.table-ket-qua .noi-dung-tab .row:nth-child(1) {
  margin: 0;
  background-color: rgba(78, 116, 155, 1);
  padding: 6px;
  border-radius: 5px;
}

.table-ket-qua .noi-dung-tab .row:nth-child(1) h5 {
  margin: 0;
  text-align: center;
  line-height: 44px;
  color: #FFF;
  font-size: 16px;
}

.table-ket-qua .noi-dung-tab .row-ket-qua {
  margin: 0;
  background-color: rgba(241, 244, 247, 1);
  padding: 10px;
  border-radius: 5px;
}

.table-ket-qua .noi-dung-tab .row-ket-qua.empty {
  display: none !important;
}

.table-ket-qua .noi-dung-tab .row-ket-qua h5 {
  margin-bottom: 0;
  text-align: center;
  color: rgba(41, 70, 100, 1);
  font-size: 15px;
  font-weight: 600;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .col-md-2:nth-child(1) h5 {
  width: 100px;
}

.table-ket-qua .noi-dung-tab .row-ket-qua h6 {
  font-size: 12px;
  text-align: center;
  margin-bottom: 0;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so {
  display: flex;
  align-items: center;
  height: 100%;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-be,
.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-lon {
  width: 15%;
  height: 8px;
  background-color: rgba(255, 45, 91, 1);
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang {
  width: 70%;
  height: 8px;
  background-color: rgba(0, 192, 146, 1);
  position: relative;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang.red,
.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-be.red,
.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-lon.red {
  background-color: rgba(255, 45, 91, 1);
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-be.green,
.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-lon.green {
  background-color: rgba(0, 192, 146, 1);
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang>.min {
  position: absolute;
  top: 10px;
  left: -5px;
  font-size: 12px;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang>.max {
  position: absolute;
  top: 10px;
  right: -5px;
  font-size: 12px;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang .bong-bong {
  position: absolute;
  display: flex;
  gap: 5px;
  bottom: -7px;
  min-width: 51px;
  opacity: 0;
  left: calc(50% - 6px);
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so.one-color .chi-so-can-bang .bong-bong {
  opacity: 1;
  left: 50%;
  transform: translateX(-50%);
  justify-content: center;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang.empty .bong-bong {
  display: none !important;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang .bong-bong div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .thanh-chi-so .chi-so-can-bang .bong-bong p {
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .chart-btn {
  display: flex;
  justify-content: center;
  height: 100%;
  align-items: center;
  margin: auto;
  outline: none;
  border: none;
  border-radius: 50%;
  background-color: transparent;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .chart-btn>img {
  cursor: pointer;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .ten-hang-muc,
.table-ket-qua .noi-dung-tab .row-ket-qua .ten-nhan-dinh {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .ten-hang-muc {
  position: relative;
}

.table-ket-qua .noi-dung-tab .row-ket-qua .ten-hang-muc div {
  position: absolute;
  right: 0;
  cursor: pointer;
}

.nhan-dinh-ket-qua .container {
  border: 1px solid rgba(221, 227, 233, 1);
  padding: 20px;
  border-radius: 13px;
}

.nhan-dinh-ket-qua .container h5 {
  font-size: 16px;
  font-weight: 500;
  color: rgba(41, 70, 100, 1);
  font-family: 'Montserrat';
}

.ket-qua-lam-sang {
  padding: 25px 0;
}

.ket-qua-lam-sang:has(.empty_content) {
  display: none !important;
}

.ket-qua-lam-sang .title-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ket-qua-lam-sang .title-heading h3 {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.ket-qua-lam-sang .ket-qua-lam-sang-content {
  /* padding: 30px 0; */
}

.ket-qua-lam-sang .ket-qua-lam-sang-content nav .nav-link {
  background-color: rgba(78, 116, 155, 1) !important;
  color: #FFF !important;
  border: 1px solid #FFF;
  border-radius: 10px 10px 0 0 !important;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content nav .nav-link.active {
  background-color: rgba(187, 144, 103, 0.8) !important;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .row {
  margin-bottom: 5px;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content {
  border: 1px solid rgba(41, 70, 100, 0.9);
  padding: 10px;
  border-radius: 0px 0px 10px 10px;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .col-md-2 {
  padding-right: 1px !important;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .col-md-2 div {
  height: 100%;
  background-color: rgba(241, 244, 247, 1);
  border: 1px solid rgba(221, 227, 233, 1);
  padding: 12px;
  border-radius: 5px;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .col-md-10 div {
  height: 100%;
  padding: 12px;
  background-color: #FFF;
  border-radius: 5px;
  border: 1px solid rgba(221, 227, 233, 1);
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .col-md-10 {
  padding-left: 1px !important;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .col-md-10 div>p {
  margin-bottom: 0;
}

.ket-qua-lam-sang .ket-qua-lam-sang-content .tab-content .row-hinhanh h3 {
  font-size: 16px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.ket-qua-tham-do {
  padding: 25px 0;
}

.ket-qua-tham-do .title-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ket-qua-tham-do .title-heading h3 {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.phan-loai-suc-khoe {
  padding: 25px 0;
}

.phan-loai-suc-khoe .title-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}

.phan-loai-suc-khoe .title-heading h3 {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.phan-loai-suc-khoe .phan-loai-suc-khoe-content {
  border: 1px solid rgba(221, 227, 233, 1);
  padding: 12px;
  border-radius: 10px;
}

.don-thuoc-benh {
  padding: 25px 0;
}

.don-thuoc-benh .title-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}

.don-thuoc-benh .title-heading h3 {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: 600;
  color: rgba(41, 70, 100, 1);
}

.don-thuoc-benh .don-thuoc-benh-sub table {
  width: 100%;
  text-align: center;
}

.don-thuoc-benh .don-thuoc-benh-sub table th {
  background-color: rgba(241, 244, 247, 1);
  border: 1px solid rgba(221, 227, 233, 1);
  padding: 10px;
}

.don-thuoc-benh .don-thuoc-benh-sub table th:nth-child(1) {
  width: 52px;
}

.don-thuoc-benh .don-thuoc-benh-sub table th:nth-child(2) {
  width: 115px;
}

.don-thuoc-benh .don-thuoc-benh-sub table td {
  padding: 10px;
  border: 1px solid rgba(221, 227, 233, 1);
}

.modal-popup .modal .modal-header {
  position: relative;
}

.modal-popup .modal .modal-header h5 {
  width: 100%;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
}

.modal-popup .modal .modal-header>.btn-close {
  position: absolute;
  right: 12px;
  top: 12px;
}

.modal-popup .modal .modal-body .row {
  margin-bottom: 16px;
}

.modal-popup .modal .modal-body .row .col-md-6 h6 {
  font-size: 12px;
  font-weight: 500;
  color: rgba(0, 192, 146, 1);
}

.kham-chuyen-sau-bai-viet .col-md-6 h1 {
  font-size: 40px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
}

.kham-chuyen-sau-dv .box-dv-chuyensau {
  border-radius: 15px;
}

.dich-vu-lay-mau-xn .box-content .ess_description {
  width: 560px;
}

.dich-vu-lay-mau-xn .box-content .ess_breadcrumb ul {
  padding-left: 0 !important;
}

.thong-tin-cac-dv-xn {
  padding: 30px 0;
}

.thong-tin-cac-dv-xn .col-md-4 .bac-si-img {
  background: url("../image/vong-tron-xanh.png");
  background-repeat: no-repeat;
  background-size: contain;
}

.thong-tin-cac-dv-xn .col-md-4 .thong-tin-bac-si {
  padding: 12px;
  border: 1px solid rgba(221, 227, 233, 1) !important;
  border-radius: 15px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(241, 244, 247, 1));
}

.thong-tin-cac-dv-xn .col-md-4 .thong-tin-bac-si h6 {
  margin-top: 5px !important;
}

.thong-tin-cac-dv-xn .col-md-4 .thong-tin-bac-si h6>p {
  color: rgba(41, 70, 100, 1);
}

.thong-tin-cac-dv-xn .col-md-4 .thong-tin-bac-si h2 {
  text-align: center;
  margin-bottom: 0;
  font-size: 28px;
  font-weight: 700;
  color: rgba(41, 70, 100, 1);
}

.q_info_nt .container {
  padding: 30px;
}

.page_csskgd .q_info_nt .container .col-12.text-center {
  font-size: 40px !important;
  font-weight: 700 !important;
  color: rgba(41, 70, 100, 1) !important;
}

.q_info_nt .row .table_nt {
  width: 100%;
}

.q_info_nt .row .table_nt tr {
  background-color: rgba(241, 244, 247, 1);
  border-bottom: 5px solid #FFF;
  height: 60px;
}

.q_info_nt .row .table_nt th {
  width: 35%;
  padding-left: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 60px;
}

.q_info_nt .row .table_nt th p {
  margin-bottom: 0;
}

.q_info_nt .row .table_nt td:nth-child(2) {
  width: 30%;
  text-align: center;
}

.q_info_nt .row .table_nt td:nth-child(3) {
  text-align: right;
  padding-right: 20px;
}

.q_info_nt .row .table_nt td:nth-child(3) a {
  color: rgba(41, 70, 100, 1);
}

#success-message {
  border: 1px solid rgba(41, 70, 100, 1);
  padding: 10px 20px;
  margin-top: 10px;
  border-radius: 30px;
  color: rgba(0, 192, 146, 1);
}

.btn-download-thuoc {
  width: 245px;
  height: 45px;
  padding: 10px;
  border: 2px solid rgba(41, 70, 100, 1);
  border-radius: 36px;
  background-color: #FFF;
  color: rgba(41, 70, 100, 1);
}

.btn-download-thuoc:hover {
  background-color: rgba(41, 70, 100, 1);
  color: #FFF;
}

.button-download-thuoc {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pdf-ket-qua-kham table th {
  min-width: 130px;
}

.pdf-ket-qua-kham .pdf-label {
  text-align: center;
}

.pdf-ket-qua-kham .pdf-name {
  text-align: left !important;
}

#footer .dieu-khoan h3,
#footer .dich-vu h3 {
  color: #FFF !important;
}

.q_banner .btn-lien-he {
  display: block;
  text-align: center;
  padding: 6px 12px;
  width: 150px;
  border: 1px solid #FFF;
  border-radius: 25px;
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
}

.q_banner .group-button {
  display: flex;
  align-items: center;
  gap: 10px;
}

.q_banner .group-button .btn-tim-hieu-them {
  color: #4A4A4A !important;
  font-weight: 600 !important;
}

.row_tracuu_chitieu .input-group {
  position: relative;
}

.row_tracuu_chitieu .input-group input {
  border-radius: 36px !important;
}

.row_tracuu_chitieu .input-group .input-group-prepend {
  position: absolute;
  right: 0;
  right: 10px;
  border-radius: 50%;
  height: 32px;
  background-color: transparent;
}

.q_cac-benh-pho-bien .slick-track .item img {
  border-radius: 10px;
}

.q_dang-ky .pad-t-100 h3 {
  font-size: 30px;
}

.q_dang-ky .pad-t-100 p {
  font-size: 19px;
}

.modal-input-date #date-error.error {
  position: absolute;
  bottom: -18px;
  font-size: 12px;
}

.page_csskgd .button-back {
  padding-top: 30px;
}

.page_csskgd .q_info_xn {
  padding: 32px 0;
}

.thiet_bi .nav_nav .text.content>p {
  color: #4A4A4A;
  font-weight: 600;
}

.thong-tin-cac-dv-xn .container .row .col-md-8 .row .col-md-6 .box-1 h5 {
  color: #294664;
}

.ksklx_dangky .container .row-noi-dung .col-anh .row .col-md-6>img {
  width: 100%;
  height: 100%;
}

.ksk_working .col-md-6>p {
  color: #4A4A4A;
}

.premium-dich-vu-tang-kem .row-1 .box_left {
  height: 100%;
}

.premium-dich-vu-tang-kem .row-2 .box_left {
  height: 100%;
}

.kskdn-banner .container-fluid>img {
  width: 100%;
}

.kham-chuyen-sau-bai-viet .row .col-md-6>img {
  border-radius: 10px;
}

.kham-chuyen-sau-dv .row .col-md-3 {
  margin-bottom: 38px;
}

.kham-chuyen-sau-dv .row .col-md-3 .box-dv-chuyensau {
  height: 100%;
}

.premium-chuyenkhoanoibat .col-md-4 {
  margin-bottom: 12px;
}

.pho_bien .slick-track .item>img:nth-child(1) {
  width: 100%;
  height: auto;
  border-radius: 12px;
}

.q_gg-map {
  display: flex;
  justify-content: end;
}




/* ======================================== Fix bug khách hàng ======================================== */
.header-main {
  position: fixed;
  z-index: 100;
  width: 100%;
}

/* --------------------------------------------------------------------------
   Header chung (bản giao diện mới)
   -------------------------------------------------------------------------- */
.header-main--refresh {
  box-shadow: none;
  border-bottom: 1px solid #E2E8F0;
  background: linear-gradient(180deg, #CAD5E2 -36%, #FFF 64%);
}

.header-main--refresh > .top_bar,
.header-main--refresh > .menu,
.header-main--refresh > .top_bar-mobile,
.header-main--refresh ~ #menu-mobile,
.header-main--refresh ~ #overlay {
  display: none !important;
}

.header-main--refresh ~ .gap-110px {
  height: 104px;
  padding-top: 104px !important;
}

.header-main--refresh .sbb-header-refresh__container {
  max-width: 1344px;
  min-height: 104px;
  padding: 0 30px;
}

.sbb-header-refresh__desktop {
  min-height: 104px;
  display: flex;
  align-items: center;
  gap: 56px;
}

.sbb-header-refresh__brand {
  display: block;
  flex: 0 0 auto;
}

.sbb-header-refresh__brand img {
  display: block;
  width: 188px;
  height: auto;
}

.sbb-header-refresh__navigation {
  min-width: 0;
  flex: 1;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sbb-header-refresh__quick-links,
.sbb-header-refresh__menu {
  display: flex;
  align-items: center;
}

.sbb-header-refresh__quick-links {
  min-height: 36px;
  justify-content: flex-end;
  gap: 18px;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 1;
}

.sbb-header-refresh__quick-links > a:not(.sbb-header-refresh__home-link) {
  color: #0F172B;
  text-decoration: none;
  letter-spacing: .1px;
}

.sbb-header-refresh__quick-links > a:not(.sbb-header-refresh__home-link):hover {
  color: #A78749;
}

.sbb-header-refresh__quick-links > a.is-active:not(.sbb-header-refresh__home-link) {
  color: #A78749;
  font-weight: 700;
}

.sbb-header-refresh__divider {
  width: 1px;
  height: 14px;
  background: #94A3B8;
}

.sbb-header-refresh__language {
  color: #0F172B;
  font-size: 15px;
}

.sbb-header-refresh__home-link {
  box-sizing: border-box;
  width: 200px;
  min-height: 40px;
  padding: 6px 14px 6px 6px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border-radius: 60px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

/*
  Ký tự › lấy khoảng đệm từ font nên không bao giờ nằm đúng tâm nút. Dùng svg
  và cho b thành hộp flex để căn giữa cả hai chiều.
*/
.sbb-header-refresh__home-link b {
  margin-left: auto;
  display: inline-flex;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  align-items: center;
  justify-content: center;
}

.sbb-header-refresh__home-link b svg {
  display: block;
  width: 14px;
  height: 14px;
}

.sbb-header-refresh__home-link--premium {
  border: 1px solid rgba(197, 160, 89, .4);
  background: #F9F5EA;
  color: #916819;
}

.sbb-header-refresh__home-link--basic {
  border: 1px solid rgba(48, 100, 158, .2);
  background: #E2E8F0;
  color: #30649E;
}

.sbb-header-refresh__home-icon {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 28px;
  border: 1px solid #FFF;
  border-radius: 50%;
}

.sbb-header-refresh__home-link--premium .sbb-header-refresh__home-icon {
  background: linear-gradient(0deg, #A78749 0%, #CFB36C 100%);
}

.sbb-header-refresh__home-link--basic .sbb-header-refresh__home-icon {
  background: linear-gradient(0deg, #30649E 0%, #96B2D4 100%);
}

.sbb-header-refresh__home-icon svg {
  width: 16px;
  height: 16px;
}

.sbb-header-refresh__menu {
  min-height: 42px;
  justify-content: flex-end;
  gap: 21px;
  font-family: Arial, sans-serif;
}

.sbb-header-refresh__menu > a,
.sbb-header-refresh__menu-group > a {
  color: #0F172B;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-decoration: none;
  white-space: nowrap;
  text-transform: uppercase;
}

.sbb-header-refresh__menu > a:hover,
.sbb-header-refresh__menu-group > a:hover,
.sbb-header-refresh__menu-group:focus-within > a {
  color: #A78749;
}

/* mục đang xem: cùng tông vàng với hover nhưng đậm hơn để phân biệt */
.sbb-header-refresh__menu > a.is-active,
.sbb-header-refresh__menu-group > a.is-active {
  color: #A78749;
  font-weight: 700;
}

.sbb-header-refresh__dropdown a.is-active {
  color: #A78749;
  font-weight: 700;
}

.sbb-header-refresh__menu-group {
  position: relative;
  height: 42px;
  display: flex;
  align-items: center;
}

.sbb-header-refresh__menu-group > a i {
  margin-left: 3px;
  font-size: 9px;
}

.sbb-header-refresh__home {
  color: #C5A059 !important;
  font-size: 15px !important;
}

.sbb-header-refresh__search,
.sbb-header-refresh__toggle {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #294664;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
}

.sbb-header-refresh__search:hover,
.sbb-header-refresh__toggle:hover {
  color: #A78749;
}

.sbb-header-refresh__round-action {
  width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  border-radius: 60px;
  color: #FFF;
  text-decoration: none;
}

.sbb-header-refresh__round-action svg,
.sbb-header-refresh__round-action i {
  width: 19px;
  height: 19px;
  font-size: 18px;
  line-height: 19px;
}

.sbb-header-refresh__round-action--result {
  background: linear-gradient(83deg, #294664 -29.47%, #30649E 100%);
}

.sbb-header-refresh__round-action--booking {
  background: linear-gradient(180deg, #CFB36C 0%, #C5A059 100%);
}

.sbb-header-refresh__dropdown {
  position: absolute;
  z-index: 110;
  top: calc(100% - 3px);
  left: 50%;
  width: max-content;
  min-width: 400px;
  max-width: min(620px, calc(100vw - 40px));
  padding: 12px;
  display: grid;
  gap: 8px;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  background: #FFF;
  box-shadow: 0 10px 24px rgba(15, 23, 43, .14);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}

.sbb-header-refresh__menu-group:hover .sbb-header-refresh__dropdown,
.sbb-header-refresh__menu-group.is-open .sbb-header-refresh__dropdown,
.sbb-header-refresh__menu-group:focus-within .sbb-header-refresh__dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.sbb-header-refresh__dropdown a {
  min-height: 48px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(197, 160, 89, .2);
  border-radius: 60px;
  background: #FFF;
  color: #0F172B;
  font-family: Arial, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 22px;
  text-decoration: none;
  white-space: nowrap;
}

.sbb-header-refresh__dropdown a:hover {
  border-color: #C5A059;
  background: #F9F5EA;
  color: #785F22;
}

.sbb-header-refresh__dropdown-arrow {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

.sbb-header-refresh__dropdown-arrow svg {
  display: block;
  width: 24px;
  height: 24px;
}

.sbb-header-refresh__mobile,
.sbb-header-refresh__mobile-menu {
  display: none;
}

@media (max-width: 1199.98px) {
  .header-main--refresh .sbb-header-refresh__container {
    min-height: 68px;
    padding: 0 15px;
  }
  .sbb-header-refresh__desktop {
    display: none;
  }
  /*
    3 ô bằng nhau nên logo luôn nằm chính giữa dù nút trái và cờ phải có bề
    rộng khác nhau. space-between sẽ làm logo lệch.
  */
  .sbb-header-refresh__mobile {
    min-height: 68px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    position: relative;
  }
  .sbb-header-refresh__mobile .sbb-header-refresh__toggle {
    justify-self: start;
  }
  .sbb-header-refresh__mobile .sbb-header-refresh__brand {
    justify-self: center;
  }
  .sbb-header-refresh__mobile-lang {
    justify-self: end;
  }
  .sbb-header-refresh__brand img {
    width: 150px;
  }
  .sbb-header-refresh__toggle {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    font-size: 18px;
  }

  /* --- ngăn kéo --- */
  .sbb-header-refresh__mobile-menu:not([hidden]) {
    position: absolute;
    z-index: 110;
    top: calc(100% + 1px);
    left: -15px;
    right: -15px;
    max-height: calc(100vh - 68px);
    padding: 12px 30px 20px;
    display: grid;
    gap: 2px;
    overflow-y: auto;
    border-top: 1px solid #E2E8F0;
    background: #FFF;
    box-shadow: 0 10px 18px rgba(15, 23, 43, .12);
  }
  .sbb-header-refresh__mobile-menu > a,
  .sbb-header-refresh__mobile-home,
  .sbb-header-refresh__mobile-group > summary {
    padding: 13px 0;
    border-bottom: 1px solid #E2E8F0;
    color: #0F172B;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
  }
  .sbb-header-refresh__mobile-menu > a:hover,
  .sbb-header-refresh__mobile-menu > a.is-active,
  .sbb-header-refresh__mobile-sub a.is-active {
    color: #A78749;
  }

  /* nhập thẳng trong ngăn kéo, không mở modal nữa */
  .sbb-header-refresh__mobile-search {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 0 0 6px;
    padding: 11px 14px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #F8FAFC;
    color: #62748E;
    font-size: 15px;
  }
  .sbb-header-refresh__mobile-search input {
    width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: #0F172B;
    font-family: Arial, sans-serif;
    font-size: 15px;
  }
  .sbb-header-refresh__mobile-search input::placeholder {
    color: #62748E;
  }

  /* mục trang chủ đứng đầu ngăn kéo, khớp với icon nhà trên desktop */
  .sbb-header-refresh__mobile-home {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .sbb-header-refresh__mobile-home svg {
    display: block;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
  }

  /* nhóm có mục con: dùng <details> nên đóng/mở không cần js */
  .sbb-header-refresh__mobile-group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    list-style: none;
    cursor: pointer;
  }
  .sbb-header-refresh__mobile-group > summary::-webkit-details-marker {
    display: none;
  }
  .sbb-header-refresh__mobile-group > summary::after {
    content: "\203A";
    color: #A78749;
    font-size: 20px;
    line-height: 1;
    transform: rotate(90deg);
    transition: transform .2s ease;
  }
  .sbb-header-refresh__mobile-group[open] > summary::after {
    transform: rotate(-90deg);
  }
  .sbb-header-refresh__mobile-sub {
    display: grid;
    padding: 4px 0 8px 14px;
  }
  .sbb-header-refresh__mobile-sub a {
    padding: 10px 0;
    color: #475569;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
  }

  /* 2 nút gói khám */
  .sbb-header-refresh__mobile-packs {
    display: grid;
    gap: 8px;
    margin-top: 14px;
  }
  .sbb-header-refresh__mobile-packs .sbb-header-refresh__home-link {
    width: 100%;
  }

  /* 2 nút hành động, thay cho 2 nút tròn ở desktop */
  .sbb-header-refresh__mobile-cta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 0;
  }
  .sbb-header-refresh__mobile-cta a {
    padding: 11px 10px;
    border: 1px solid #30649E;
    border-radius: 60px;
    background: #30649E;
    color: #FFF;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
  }
  .sbb-header-refresh__mobile-cta a.is-gold {
    border-color: rgba(187, 145, 103, .5);
    background: linear-gradient(270deg, #CFB36C 0%, #A78749 100%);
  }
  .sbb-header-refresh__mobile-cta a:hover {
    color: #FFF !important;
  }
  .header-main--refresh ~ .gap-110px {
    height: 68px;
    padding-top: 68px !important;
  }
}

@media (max-width: 479.98px) {
  .sbb-header-refresh__brand img {
    width: 128px;
  }
  .sbb-header-refresh__mobile-actions {
    gap: 6px;
  }
  .sbb-header-refresh__round-action {
    width: 29px;
    height: 29px;
  }
}

.gap-110px {
  padding-top: 110px;
}

.gap-65px {
  padding-top: 65px;
  display: none;
}

.q_service .row .col-12 .item:hover {
  transform: scale(1.1);
  border: 2px solid #F6CB84;
  transition: all 0.3s ease-in-out;
}

.q_service .row .col-12 .item:hover .back>img.white {
  z-index: -1;
  transition: all 0.3s ease-in-out;
}

.q_service .row .col-12 .item:hover .info>h3,
.q_service .row .col-12 .item:hover .info>p {
  color: #FFF;
}

.kham-chuyen-sau-dv .box-dv-chuyensau {
  position: relative;
}

.kham-chuyen-sau-dv .box-dv-chuyensau::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 199px;
  height: 36px;
  background: url("../image/dam-may-3.png");
}

.kham-chuyen-sau-dv .box-dv-chuyensau .btn_dat_lich {
  position: absolute;
  bottom: 12%;
  left: 50%;
  transform: translate(-50%);
  background: linear-gradient(to bottom, #DFAC7B, #BB9067);
  width: 160px;
  height: 43px;
  border-radius: 25px;
  color: #FFF;
  font-weight: 500;
}

.q_dang-ky .btn.btn_dat_lich {
  padding: 0 30px;
  height: 43px;
  background-color: #294664;
  color: #FFF;
  font-size: 14px;
  font-weight: 600;
  position: absolute;
  right: 0;
  bottom: 3px;
  transition: all .3s;
}

.ksklx_dangky .btn_dat_lich {
  width: 160px;
  height: 43px;
  color: #FFF;
  background-color: #294664;
  font-weight: 500;
}

body.page-template-page-cccn {
  position: relative;
}

.popup.show-cccn {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 100;
}

.popup.show-cccn .card-item {
  width: max-content;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.popup.show-cccn .card-item .btn-x {
  position: absolute;
  right: -30px;
  top: -20px;
  cursor: pointer;
}

.popup.show-cccn .card-item .popup-title {
  text-align: center;
  color: #FFF;
  font-weight: 600;
  font-size: 20px;
  margin-top: 20px;
}

.popup.show-cccn .card-item .popup-image {
  border-radius: 10px;
}

.popup.show-cccn .card-item .slide-left {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  left: -40px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: none;
  background-color: #F0C581;
  color: #294664;
}

.popup.show-cccn .card-item .slide-right {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  right: -40px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: none;
  background-color: #F0C581;
  color: #294664;
}

.row-ket-qua .ten-hang-muc .btn-xem-chi-tiet {
  width: 12px;
  height: 12px;
  border: none;
  outline: none;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: -15px;
}

.show-cccn {
  display: block !important;
}

.card-body td.kqsk {
  color: #FF9B3F;
}

.card-body td.kqsk span {
  display: block;
  max-width: 200px;
  margin: auto;
  padding: 5px 20px;
  background: #FFB72B1A;
  border-radius: 30px;
  font-weight: 600;
}

.card-body td.kqsb {
  color: #00C092;
}

.card-body td.kqsb span {
  display: block;
  width: 200px;
  margin: auto;
  padding: 5px 20px;
  background: #00C0921A;
  border-radius: 30px;
  font-weight: 600;
}


/* ======== FIX BUG NGÀY 25-06-2024 ======== */
.q_tin-tuc-moi .card-tin-tuc {
  position: relative;
}

.q_tin-tuc-moi .card-tin-tuc .box10sm {
  padding-bottom: 50px;
}

.q_tin-tuc-moi .card-tin-tuc .btn-xem-them {
  position: absolute;
  bottom: 25px;
}

.q_su_menh .col-su-menh .item {
  height: 100%;
}

.q_su_menh .col-su-menh .item .icon-su-menh {
  display: flex;
  justify-content: center;
}

.q_page_csvc-thiet-bi .right img {
  min-width: 24px;
}

.ess_danh_gia .box-user {
  position: relative;
}

.ess_danh_gia .box-user .img-name-user {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}

.ess_danh_gia .box-user .text-content {
  padding-bottom: 56px !important;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3.col-sm-2 {
  position: relative;
}

.ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3.col-sm-2 p {
  position: absolute;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin-top: 0;
}

.btn-sdt-hotline {
  width: max-content;
  position: fixed;
  right: 10px;
  bottom: 12px;
  z-index: 100;
}

.button-hotline {
  width: 58px;
  height: 58px;
  border-radius: 100px;
  border: 1px solid #F6CB84;
  background: #30649E;
  padding: 0;
  animation-name: trin;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.btn-zalo {
  width: max-content;
  position: fixed;
  right: 10px;
  bottom: 82px;
  z-index: 100;
}

.button-zalo {
  width: 58px;
  height: 58px;
  border-radius: 100px;
  border: 1px solid #F6CB84;
  background: #30649E;
  padding: 0;
  animation-name: trin;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

/* 2 file ảnh gốc (zalo-contact.png / hotline-contact.png) là hình tròn xanh có
   glyph trắng vẽ sẵn bên trong. Thiết kế mới yêu cầu hình tròn do css vẽ, nên
   dùng bản đã tách nền *-icon.png và tự căn giữa glyph ở đây.
   box-sizing: border-box để tổng kích thước đúng 58px (viền 1px tính vào trong). */
.button-hotline,
.button-zalo {
  box-sizing: border-box;
  cursor: pointer;
}

.button-hotline > a,
.button-zalo > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

/* Giữ đúng tỉ lệ glyph/hình tròn như ảnh gốc: zalo chiếm 54%, điện thoại 47%. */
.button-zalo img {
  display: block;
  width: 31px;
  height: 31px;
  object-fit: contain;
}

.button-hotline img {
  display: block;
  width: 27px;
  height: 27px;
  object-fit: contain;
}

@keyframes trin {

  from {
    transform: rotate3d(0, 0, 1, 0deg);
  }

  20%,
  32%,
  44%,
  56%,
  68% {
    transform: rotate3d(0, 0, 1, 0deg);
  }

  23%,
  35%,
  47%,
  59%,
  71% {
    transform: rotate3d(0, 0, 1, 15deg);
  }

  26%,
  38%,
  50%,
  62%,
  74% {
    transform: rotate3d(0, 0, 1, 0deg);
  }

  29%,
  41%,
  53%,
  65%,
  77% {
    transform: rotate3d(0, 0, 1, -15deg);
  }

  80% {
    transform: rotate3d(0, 0, 1, 0deg);
  }

}

.chitieuxetnghiem_breadcrumb {
  padding: 37px 0;
}

.chitieuxetnghiem_breadcrumb .container ul {
  display: flex;
  gap: 10px;
  padding: 0;
}

.chitieuxetnghiem_breadcrumb .container ul .color294664 a {
  color: #294664;
}

.chitieuxetnghiem_breadcrumb .container ul .colorBB9067 {
  color: #BB9067;
}

.chitieuxetnghiem-container {
  margin-bottom: 175px;
}

.chitieuxetnghiem-container .container .row {
  border: 1px solid #DDE3E9;
  margin: 0;
  border-radius: 10px;
}

.chitieuxetnghiem-container .container .row .col-md-12 {
  padding: 36px 33px;
}

.chitieuxetnghiem-container .tieu-de {
  font-size: 30px;
  font-weight: 700;
  color: #294664;
  margin-bottom: 48px;
}

.chitieuxetnghiem-container .cacchitieu-title {
  font-size: 16px;
  font-weight: 600;
  color: #294664;
}

.chitieuxetnghiem-container .cac-chi-tieu-chi-tiet {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  gap: 0;
}

.chitieuxetnghiem-container .cac-chi-tieu-chi-tiet .noidung-chi-tieu {
  width: 33.3333333%;
  padding: 5px 0;
}

.chitieuxetnghiem-container .cac-chi-tieu-chi-tiet .noidung-chi-tieu:before {
  content: url("../image/ciclre.png");
  width: 5px;
  height: 5px;
  vertical-align: 3px;
  margin-right: 5px;

}

.chitieuxetnghiem-container .cac-chi-tieu-chi-tiet .noidung-chi-tieu a {
  color: #294664;
}

.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front {
  max-height: 300px !important;
  overflow-x: hidden;
}

.card-gioi-thieu .box-card .box-card-img {
  margin-bottom: 10px;
}

.q_page_csvc-thiet-bi .nav-pills .nav_nav {
  position: relative;
}

.q_page_csvc-thiet-bi .nav-pills .nav_nav .right {
  position: absolute;
  right: 3%;
  top: 50%;
  transform: translateY(-50%);
}

#moi-quan-he-ca-nhan {
  display: none;
}

.pdf-content .pdf-header {
  position: relative;
  justify-content: center;
  align-items: center;
}

.pdf-content .pdf-header .btn-close {
  position: absolute;
  right: 15px;
}

.pdf-content .pdf-header .btn-download-pdf {
  position: absolute;
  left: 15px;
  border: 1px solid rgba(41, 70, 100, 1);
  padding: 8px 15px;
  border-radius: 55px;
  background-color: #fff;
  color: rgba(41, 70, 100, 1);
}

.pdf-content .pdf-header .btn-download-pdf:hover {
  color: #fff;
  background-color: rgba(41, 70, 100, 1);
  transition: 0.2s all ease-in-out;
}

.pdf-content .pdf-header .modal-title {
  height: 50px;
  line-height: 50px;
  color: rgba(41, 70, 100, 1);
  font-weight: 600;
}

h3.muc-ket-qua {
  font-size: 18px;
  font-weight: 600;
}

/* .table-kq-th:has(.empty_content) {
  display: none;
} */

.table-chi-so-co-the .list-chi-so {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.table-chi-so-co-the .list-chi-so .item-chi-so {
  padding: 8px;
  border: 1px solid;
}

@media only screen and (max-width: 767px) {

  /* Fix Feedback 15.08.2024 */
  #exampleModal .modal-content .modal-body form .modal-input.modal-input-date input {
    flex: 1;
    text-align: right;
  }

  .goi-xet-nghiem .container .col-md-7 .tab-pane img {
    width: 100%;
    height: auto;
  }

  .quang-cao-dvxn .box-quang-cao .box-hinhanh>img {
    max-width: 130px;
    z-index: 1;
  }

  .quang-cao-dvxn .box-quang-cao {
    padding-bottom: 50px;
  }

  .quang-cao-dvxn .box-quang-cao .box-text,
  .quang-cao-dvxn .box-quang-cao .box-btn {
    z-index: 3;
  }

  .box_contact_lh {
    background-size: cover;
    background-position: center;
  }

  .table-ket-qua .noi-dung-tab .row-ket-qua .ten-hang-muc,
  .table-ket-qua .noi-dung-tab .row-ket-qua .ten-nhan-dinh,
  .table-ket-qua .noi-dung-tab .row-ket-qua .chart-btn {
    align-items: start;
  }

  .premium-dich-vu-tang-kem .row-2 .col-md-2:nth-child(1) {
    order: 2;
  }

  .premium-dich-vu-tang-kem .row-2 .col-md-2:nth-child(2) {
    order: 1;
  }

  .premium-dich-vu-tang-kem .row-2 .col-md-2:nth-child(3) {
    order: 4;
  }

  .premium-dich-vu-tang-kem .row-2 .col-md-2:nth-child(4) {
    order: 3;
  }

  .premium-dich-vu-tang-kem .row-2 .col-md-2:nth-child(5) {
    order: 6;
  }

  .premium-dich-vu-tang-kem .row-2 .col-md-2:nth-child(6) {
    order: 5;
  }

  .table-ket-qua .noi-dung-tab .ketqua-ten {
    width: 40%;
  }

  .table-ket-qua .noi-dung-tab .ketqua-ketqua {
    width: 15%;
    padding: 0;
  }

  .table-ket-qua .noi-dung-tab .ketqua-nhandinh {
    width: 30%;
    padding: 0 5px;
  }

  .table-ket-qua .noi-dung-tab .row-ket-qua h5 {
    font-size: 12px;
  }

  .table-ket-qua .noi-dung-tab .ketqua-chart {
    width: 15%;
    padding: 0;
  }

  .table-ket-qua .noi-dung-tab .ketqua-thanhchiso {
    order: 5;
    width: 100%;
    margin-top: 25px;
    margin-bottom: 20px;
  }

  .noi-dung-tab.tab-content .tab-pane>.row:first-child {
    display: none;
  }

  .table-wrapper {
    overflow-x: scroll;
  }

  .q_page-tintuc .box_news {
    background-position: center;
  }

  .ksk_working .container .ksk_working-h1,
  .custom-content h1,
  .ksktd_all-content .container .row-tuyen-dung .xkld-h1,
  .premium-dich-vu .premium-dich-vu-h1,
  .philosophy h3,
  .su_menh h3,
  .gia_tri h3 {
    font-size: 20px !important;
  }

  .dang_ky img.banner {
    width: 30%;
  }

  .banner-health-premium .box-content {
    max-width: 100%;
    left: 0;
    top: 10%;
    padding: 20px;
  }

  .banner-health-premium .box-content .ess_description p {
    max-width: 100%;
  }

  .chitieuxetnghiem-container .cac-chi-tieu-chi-tiet .noidung-chi-tieu,
  .page_csskgd .q_info_xn .container.list .card {
    width: 100%;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body table {}

  /* Force table to not be like tables anymore */
  .page_csskgd .q_info_xn .container.list .card .card-body table,
  .page_csskgd .q_info_xn .container.list .card .card-body thead,
  .page_csskgd .q_info_xn .container.list .card .card-body tbody,
  .page_csskgd .q_info_xn .container.list .card .card-body th,
  .page_csskgd .q_info_xn .container.list .card .card-body td,
  .page_csskgd .q_info_xn .container.list .card .card-body tr {
    display: block;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  .page_csskgd .q_info_xn .container.list .card .card-body thead tr {
    font-size: 0;
    opacity: 0;
    visibility: hidden;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body tr {
    border: 1px solid #ccc;
    height: auto;
    padding: 5px;
    margin-bottom: 10px;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%;
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
  }

  /*
	Label the data
	*/
  .page_csskgd .q_info_xn .container.list .card .card-body td:nth-of-type(1):before {
    content: "Thời gian khám";
  }

  .page_csskgd .q_info_xn .container.list .card .card-body td:nth-of-type(2):before {
    content: "Dịch vụ khám";
  }

  .page_csskgd .q_info_xn .container.list .card .card-body td:nth-of-type(3):before {
    content: "Tiến độ";
  }

  .page_csskgd .q_info_xn .container.list .card .card-body td:nth-of-type(4):before {
    content: "Kết quả";
  }

  .card-body td span {
    width: auto !important;
  }

  header .top_bar {
    height: auto;
    text-align: center;
  }

  header .top_bar form .input-group {
    margin: 10px 0;
  }

  header .top_bar-desktop .text-right {
    justify-content: center;
    padding-bottom: 10px;
  }

  .menu.menu-desktop {
    display: none;
  }
}

@media only screen and (max-width: 440px) {
  .pdf-content .pdf-header {
    flex-wrap: wrap;
  }

  .pdf-content .pdf-header .btn-download-pdf {
    position: unset;
  }

  /* .ket-qua-lam-sang-content #nav-tab{
        flex-wrap: nowrap;
        overflow-x: scroll;
        overflow-y: hidden;
    } */

  /* .ket-qua-lam-sang-content #nav-tab button{
        min-width: max-content;
    } */

  .ket-qua-lam-sang-content #nav-tab::-webkit-scrollbar {
    height: 5px;
  }

  .ket-qua-lam-sang-content #nav-tab::-webkit-scrollbar-track {
    background-color: #ccc;
    border-radius: 10px;
    border: 1px solid rgba(234, 234, 235, 1);
  }

  .ket-qua-lam-sang-content #nav-tab::-webkit-scrollbar-thumb {
    background-color: #294664;
    border-radius: 10px;
  }
}

/* =================================== Class dùng chung =================================== */
.pd-8 {
  padding: 8px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-50 {
  margin-top: 50px;
}

.bd-w-1 {
  border-width: 1px;
  border-color: #000;
}

.w-full {
  width: 100%;
}

.bg-ccc {
  background-color: #ccc;
}

.style-no-results {
  font-size: 18px;
  text-align: center;
  padding: 8px;
  border: 1px dashed;
  color: rgba(41, 70, 100, 1);
}

/* =================================== ^^ Class dùng chung ^^ =================================== */


/* ======== END FIX BUG NGÀY 25-06-2024 ========  */

/* =========================== Sửa table kết quả khám =========================== */

@media only screen and (max-width: 440px) {

  /* .noi-dung-tab.tab-content{
        overflow-x: scroll;
    }

    .noi-dung-tab.tab-content .tab-pane{
        width: 962px;
    }
    
    .noi-dung-tab.tab-content .tab-pane .row{
        flex-wrap: nowrap;
        align-items: center;
    }
    
    .noi-dung-tab.tab-content .tab-pane .row .col-md-2{
        width: 16.66666667%;
    }
    
    .noi-dung-tab.tab-content .tab-pane .row .col-md-4{
        width: 33.33333334%;
    } */
  .table-ket-qua .noi-dung-tab .row:nth-child(1) {
    display: none;
  }

  .noi-dung-tab.tab-content .tab-pane .row.row-ket-qua {
    position: relative;
  }

  .bang-ket-qua-xet-nghiem .table-ket-qua .row-ket-qua .col-md-2 {
    width: 30%;
  }

  .noi-dung-tab.tab-content .tab-pane .row.row-ket-qua .col-md-2:nth-child(1) {
    width: 35%;
  }

  .noi-dung-tab.tab-content .tab-pane .row.row-ket-qua .col-md-2:nth-child(2) {
    width: 19%;
    padding: 0;
  }

  .noi-dung-tab.tab-content .tab-pane .row.row-ket-qua .col-md-2:nth-child(4) {
    position: absolute;
    right: 27px;
    width: 40%;
    height: 32px;
  }

  .noi-dung-tab.tab-content .tab-pane .row.row-ket-qua .col-md-2:nth-child(5) {
    position: absolute;
    height: 32px;
    right: 0;
    width: 16%;
  }

  .row-ket-qua .ten-hang-muc .btn-xem-chi-tiet {
    left: -12px;
    top: 2px;
  }

  .table-ket-qua .noi-dung-tab .row-ket-qua .chart-btn {
    min-width: 30px;
  }
}

/* ====================================== End Fix bug khách hàng ====================================== */






@media only screen and (max-width: 1440px) {
  #footer .container>.row:nth-child(2) .q_gg-map>.map {
    width: 345px;
    height: 209px;
  }

  #footer .container>.row:nth-child(2) .q_gg-map>.map iframe {
    width: 345px;
    height: 209px;
  }
}

@media only screen and (max-width: 767px) {

  /* ================ Header ================ */
  body {
    position: relative;
  }

  header .top_bar-desktop,
  header .menu-desktop {
    display: none;
  }

  header .top_bar-mobile,
  header .menu-mobile {
    display: block;
  }

  header.header-main {
    position: relative;
  }

  header .top_bar {
    height: 65px;
  }

  header .top_bar .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  header .img_banner {
    width: 200px !important;
  }

  header .top_bar .col-md-3 {
    text-align: center;
  }

  header .top_bar>.col-12 {
    padding: 5px 14px;
  }

  header .top_bar .col-md-4 {
    display: flex;
    justify-content: center;
    gap: 6px;
  }

  header .top_bar .col-md-4 .btn {
    min-width: 150px;
  }

  header .top_bar .top_bar .col-md-5,
  header .top_bar .top_bar .col-md-4 {
    display: none;
  }

  .header-main .nav-bar-mobile {
    display: block;
    position: absolute;
    top: 16px;
    left: 16px;
  }

  .header-main .chose-language {
    display: block;
    position: absolute;
    top: 16px;
    right: 16px;
  }

  #menu-mobile #menu-menu-main-1 {
    align-items: start;
  }

  #menu-mobile #menu-menu-main-1 li {
    padding-bottom: 0px !important;
  }

  #menu-mobile .kh_menu_header .col-md-4 .btn_dat_lich {
    background-color: #294664;
    color: #FFF;
    font-weight: 600;
    margin-bottom: 10px;
  }

  #menu-mobile .kh_menu_header .col-md-4 .btn_ket_qua {
    font-weight: 600;
    width: 100%;
  }

  #menu-mobile {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: #FFF;
    width: 320px;
    height: 100%;
    transform: translateX(-100%);
    transition: all 0.3s ease-in-out;
  }

  #menu-mobile .kh_menu_header {
    display: block !important;
    position: relative;
  }

  #overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 90;
    transform: translateX(-100%);
    transition: all 0.3s ease-in-out;
  }

  .active-menu-mobile {
    transform: translateX(0) !important;
    transition: all 0.3s ease-in-out !important;
  }

  /* ================ Banner Home ================ */
  .q_banner .box_big_1 .d_img_box {
    width: 100%;
    height: auto;
  }

  .box_big_1 img:not(.d_img_box) {
    display: none;
  }

  .q_banner .box_big_1 .container_img {
    max-width: 305px;
    left: 20px;
    right: auto;
  }

  .q_banner .container_img .d_with {
    margin-bottom: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: none;
  }

  .q_banner .btn-lien-he {
    background-color: #294664;
  }

  /* ================ Service Home ================ */
  .q_service {
    padding-top: 30px !important;
  }

  .q_service .row {
    gap: 16px;
  }

  .q_service .row .item {
    width: auto;
    height: 420px;
    box-shadow: 1px 2px 6px 0 #252B4226;
  }

  .q_service .row .info>img {
    margin-top: -65px;
    width: 60px;
    height: 60px;
  }

  .q_service .row .info>p {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .q_service .item>img {
    left: 50% !important;
    transform: translateX(-50%);
  }

  /* ================ Doctor Home ================ */
  .q_doctor {
    padding: 30px 0 !important;
  }

  .q_doctor .slick-list .boxslide .text_sl2 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .q_doctor .slick-slider .slick-dots {
    bottom: 25px !important;
  }

  /* ================ sbb premium Home ================ */
  .q_sbb_premium {
    padding-top: 0 !important;
    height: auto;
    background-size: cover;
  }

  .q_sbb_premium .col-12 .text-center {
    height: 500px;
  }

  .q_sbb_premium .col-12 .text-center .info {
    top: -185px;
    height: auto;
  }

  .q_sbb_premium .col-12 .text-center .info>img {
    display: none;
  }

  .q_sbb_premium .col-12.text-center {
    height: 500px;
  }

  .q_sbb_premium .col-12.text-center .itm h2 {
    font-size: 18px;
    margin-bottom: 0;
    line-height: 25px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .q_sbb_premium .col-12.text-center .itm p {
    font-size: 14px;
    margin-bottom: 0;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* ================ sbb premium Home ================ */
  .q_sbb_essential {
    height: auto;
    padding: 30px 0 0 0 !important;
    background-size: cover;
  }

  .q_sbb_essential .dv .item .itm h2 {
    font-size: 18px;
    line-height: 25px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .q_sbb_essential .dv .item .itm p {
    font-size: 14px;
    line-height: 20px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .q_sbb_essential .row .col-12:nth-child(2) .info {
    height: auto;
  }

  .q_sbb_essential .row .col-12:nth-child(2) .info>img {
    display: none;
  }

  /* ================ tra cuu Home ================ */
  .q_tra-cuu {
    padding: 50px 0 !important;
  }

  .q_tra-cuu .row_tracuu_chitieu {
    gap: 20px;
  }

  .q_tra-cuu .row_tracuu_chitieu .col-md-8 .m_body {
    height: auto;
  }

  .q_tra-cuu .row_tracuu_chitieu .col-md-8 .m_body .slick-track {
    gap: 10px;
  }

  .q_tra-cuu .row_tracuu_chitieu .col-md-8 .m_body .slick-slider .slick-dots {
    bottom: -12px !important;
  }

  .q_tra-cuu .row_tracuu_chitieu .m_body .alpha-list ul {
    flex-wrap: wrap;
    gap: 4px;
  }

  .q_tra-cuu .row_tracuu_chitieu .m_body hr {
    margin: 20px 0 !important;
  }

  /* ================ thong so Home ================ */
  .q_thong-so {
    padding: 30px 0 !important;
  }

  .q_thong-so .box6.fly {
    margin-bottom: 0 !important;
  }

  /* ================ thong so Home ================ */
  .q_rating {
    padding: 30px 0 !important;
  }

  .q_rating .slick-list {
    padding: 0 !important;
  }

  .q_rating .slick-list .item_slide {
    width: 98vw !important;
    height: auto !important;
    flex-direction: column;
  }

  .q_rating .slick-list .item_slide img {
    width: auto;
    height: auto;
    margin: auto;
  }

  .q_rating .slick-list .item_slide .info {
    width: auto;
    padding-top: 5px !important;
    text-align: center;
  }

  /* ================ tin tuc moi Home ================ */
  .q_tin-tuc-moi .slick-slide {
    box-shadow: unset;
    border: 1px solid #999;
    border-radius: 20px;
  }

  .q_tin-tuc-moi .slick-slider .slick-dots {
    bottom: -20px !important;
  }

  /* ================ video Home ================ */
  .q_video-home {
    padding: 50px 0 !important;
  }

  .q_video-home .row .col-12:nth-child(2) .banner_container {
    height: auto;
  }

  .q_video-home .row .col-12:nth-child(2) .banner_container .icon {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  /* ================ dang ky Home ================ */
  .q_dang-ky .row .col-12:nth-child(1) {
    padding-top: 50px !important;
  }

  .q_dang-ky .row .col-12:nth-child(2) {
    display: none;
  }

  .q_dang-ky .row .col-12:nth-child(1) .dv .itm h2 {
    font-size: 18px;
  }

  .q_dang-ky .row .col-12:nth-child(1) .dv .itm p {
    display: none;
  }

  .q_dang-ky .row .col-12:nth-child(1) .dv .itm a {
    left: 0;
  }

  .q_dang-ky .row .col-12:nth-child(1) .thac_mac {
    bottom: -45px;
  }

  .q_dang-ky .row .col-12:nth-child(1) .thac_mac>.info {
    flex-direction: column;
  }

  .q_dang-ky>img {
    display: none;
  }

  /* ================ footer Home ================ */
  #footer {
    margin-top: 0;
  }

  #footer>img {
    display: none;
  }

  #footer .container>.row:nth-child(1)>.col-12:nth-child(1) {
    text-align: center;
  }

  #footer .container>.row:nth-child(1)>.col-12:nth-child(1)>img {
    padding-bottom: 10px !important;
  }

  #footer .container>.row:nth-child(1)>.col-12:nth-child(2) .flex_right {
    padding: 0;
    flex-wrap: wrap;
    justify-content: start;
  }

  #footer .container>.row:nth-child(1)>.col-12:nth-child(2) .flex_right .text h3 {
    line-height: 35px;
    font-size: 22px;
  }

  #footer .container>.row:nth-child(1)>.col-12:nth-child(2) .flex_right .text {
    margin-bottom: 16px;
  }

  #footer .container>.row:nth-child(1)>.col-12:nth-child(2) .flex_right .time {
    margin-bottom: 20px;
  }

  #footer .container>.row:nth-child(2) .col-12 .social>ul {
    padding: 0 !important;
  }

  #footer .container>.row:nth-child(2) .q_gg-map>.map {
    width: 300px;
    height: 182px;
  }

  #footer .container>.row:nth-child(2) .q_gg-map>.map iframe {
    width: 300px;
    height: 182px;
  }

  /* ===================== tra cuu tu dien benh ly ===================== */
  .q_page_tctd .box_news {
    padding-bottom: 0;
  }

  .q_page_tctd .col-12:nth-child(1) .m_body {
    height: auto;
  }

  .q_page_tctd .col-12:nth-child(1) .m_body ul {
    flex-wrap: wrap;
    gap: 2px;
  }

  .q_page_tctd .col-12:nth-child(1) .m_body .slick-slider .slick-dots {
    bottom: -15px !important;
  }

  /* .q_page_tctd .col-12:nth-child(2){
    margin-top: 35px;
  } */

  .q_bangchucai .list-inline.m-0 {
    flex-wrap: wrap;
  }

  .chitiet-tracuu .chitiet-tracuu-content .col-sm-8 .social>ul {
    padding-left: 0 !important;
  }

  .chitiet-tracuu .chitiet-tracuu-content .col-sm-4 .widget:nth-child(1) .cat-list {
    padding-left: 0 !important;
  }

  .chitiet-tracuu .chitiet-tracuu-breadcrumb .breadcrumb {
    padding-bottom: 0 !important;
  }

  /* ===================== tra cuu tu dien benh ly ===================== */
  .page_bmi>.container-fluid>.box_news {
    padding-bottom: 0;
  }

  .page_bmi .q_bang-tinh-BMI .col-md-9>.bang_tinh {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .page_bmi .q_bang-tinh-BMI .col-md-9>.bang_tinh form .row:nth-child(1) {
    margin-bottom: 16px;
  }

  .page_bmi .q_bang-tinh-BMI .col-md-9>.bang_tinh form .row:nth-child(2) .col-md-6 {
    margin-bottom: 16px;
  }

  .page_bmi .q_bang-tinh-BMI .col-md-9 .content {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-bottom: 20px !important;
  }

  /* ===================== bao lanh vien phi ===================== */
  .q_baolanhvienphi .container-fluid .box_news {
    padding-bottom: 0 !important;
  }

  .q_page_blvp_dtbl {
    padding: 20px 0 !important;
  }

  .q_page_blvp_dtbl .slick-track .item .anh {
    display: flex;
    justify-content: center;
  }

  .q_qtbl {
    padding: 0;
  }

  .q_qtbl .container .row .col-12:nth-child(1) h3 {
    text-align: center;
  }

  .q_qtbl .container .row .col-12:nth-child(1) .flex.item .img>p {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .q_qtbl .container .row .col-12:nth-child(1) .flex.item .text>p {
    text-align: left;
  }

  .q_udblvp .tran2>.container>.row:nth-child(2) .flex.ud_item {
    height: auto;
  }

  /* ===================== tin tuc ===================== */
  .q_page-tintuc .box_news {
    padding-bottom: 0 !important;
  }

  .q_page-tintuc .q_all-news .col-md-8 h3.title {
    line-height: 35px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .q_page-tintuc .q_all-news .col-md-8 h3.title a {
    width: 28%;
    text-align: right;
  }

  .q_page-tintuc .q_all-news .col-md-8 .box {
    margin-bottom: 16px;
  }

  .q-page-cate-news .container-breadcrumb .breadcrumb {
    padding-bottom: 0 !important;
  }

  .q-page-cate-news .container-content-cate .row:nth-child(1) .col-md-8>h1 {
    margin-bottom: 16px;
  }

  .q-page-cate-news .container-content-cate .row:nth-child(1) .col-md-4>form {
    margin-bottom: 16px;
  }

  .q-page-cate-news .container-content-cate .row:nth-child(2) .col-sm-4 .widget:nth-child(1) ul {
    padding-left: 0 !important;
  }

  /* ===================== tin tuc ===================== */
  .q_page_guide .container-fluid .box_news {
    padding-bottom: 0 !important;
  }

  .q_page_guide .container-fluid .box_news .banner_contact {
    padding-top: 10px !important;
    padding-bottom: 0 !important;
  }

  .q_page_guide .container-breadcrumb .breadcrumb {
    padding-bottom: 0 !important;
  }

  /* ===================== ve chung toi ===================== */
  .q_banner .q_banner-breadcrumb .box_banner {
    padding-top: 30px !important;
  }

  .q_banner .q_banner-breadcrumb .box_banner h3,
  .q_banner .q_banner-breadcrumb .box_banner .d_with p {
    text-align: center;
    margin-bottom: 0;
    padding: 0 16px;
  }

  .q_banner .q_banner-breadcrumb {
    left: 0 !important;
    width: auto;
  }

  .q_banner .q_banner-breadcrumb .breadcrumb {
    justify-content: center;
  }

  .q_banner .q_banner-breadcrumb .breadcrumb ul {
    padding: 0;
  }



  .philosophy.q_philosophy {
    padding-top: 0;
  }

  .philosophy.q_philosophy .row .col-md-7 {
    padding-top: 10px !important;
  }

  .q_su_menh .row .col-12 {
    margin-bottom: 15px;
  }

  .q_su_menh .row .col-12 .item {
    margin-bottom: 24px;
  }

  .q_su_menh .text-center {
    margin-bottom: 16px;
  }

  .q_gia-tri {
    padding-top: 40px !important;
  }

  .q_gia-tri .gt_item .row {
    justify-content: space-around;
  }

  .q_gia-tri .gt_item .row .col-12 {
    width: max-content;
  }

  .q_gia-tri .gt_item .row .col-12 img {
    width: 120px;
  }

  /* ===================== doi ngu bac si ===================== */
  .q_page_dnbs .container-fluid .box_news {
    padding-bottom: 0;
  }

  .q_page_specialist .q_page_specialist-danhsach .row:nth-child(2) .col-md-3 {
    margin-bottom: 20px;
  }

  .q_page_specialist .q_page_specialist-danhsach .row:nth-child(2) .col-md-9 .tab-content {
    height: auto !important;
  }

  /* ===================== doi ngu bac si ===================== */
  .q_page_csvc .box_news {
    padding-bottom: 0 !important;
  }

  .q_page_csvc-thiet-bi .row .col-12 {
    margin-bottom: 20px;
  }

  .q_page_csvc-thiet-bi .row .col-12 .tab-content#v-pills-tabContent {
    height: auto !important;
  }

  .q_page_csvc-thiet-bi .row .col-12 .tab-content#v-pills-tabContent .tab-pane .slick-dots {
    bottom: -10px !important;
  }

  .q_page_cccn .container-fluid .box_news {
    padding-bottom: 0 !important;
  }

  .q_page_cccn .service .col-12 {
    margin-bottom: 30px !important;
  }

  .ess_hinhanh_goikham .gallery_goikham_slider .slick-track {
    height: auto;
  }

  .q_banner-essential .box-content {
    top: 25px;
    left: 5%;
    max-width: 305px;
  }

  .d_img_box {
    width: 100%;
    height: auto;
  }

  .ess_dich-vu {
    padding: 0;
  }

  .ess_hinhanh_goikham .container .row {
    gap: 10px;
  }

  .ess_hinhanh_goikham .gallery_goikham_column {
    gap: 10px;
  }

  .ess_danh_gia .slick-dots {
    bottom: -15px !important;
  }

  .xkld_banner .container-fluid {
    height: 165px;
  }

  .xkld_banner .container-fluid img {
    height: 100%;
  }

  .xkld_all-content {
    padding: 0 10px;
  }

  .xkld_all-content .container {
    padding: 15px !important;
  }

  .xkld_all-content .row-tieu-chuan .box-dieu-kien-ngoai-hinh {
    align-items: start;
    gap: 8px;
  }

  .xkld_all-content .row-tieu-chuan .box-dieu-kien-suc-khoe {
    gap: 8px;
  }

  .xkld_all-content .container .xkld-btn {
    margin-bottom: 16px;
  }

  .ksklx_dangky {
    padding: 0 10px;
  }

  .ksklx_dangky .container {
    padding: 15px !important;
  }

  .ksklx_dangky .container .row-dang-ky a>button {
    margin-bottom: 16px;
  }

  .ksklx_dangky .container .row-noi-dung .col-anh .row:nth-child(1) .col-md-6 {
    text-align: center !important;
  }

  .ksklx_dangky .container .row-noi-dung .row {
    gap: 10px;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4 {
    position: unset;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4 p {
    position: unset;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) {
    height: auto;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3 p {
    margin-top: 25px;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(1)::before,
  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(2)::before,
  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-9:nth-child(2) .col-md-4:nth-child(3)::before {
    display: none;
  }

  .ess_danh_gia {
    padding: 50px 0;
  }

  .ksk_working {
    padding: 0 10px;
  }

  .ksk_working .container {
    padding: 15px !important;
  }

  .ksk_goi-dich-vu {
    padding: 30px 0;
  }

  .ksk_goi-dich-vu .row-cac-goi-kham {
    gap: 16px;
  }

  .ksktd_all-content {
    padding: 0 10px;
  }

  .ksktd_all-content .container {
    padding: 15px !important;
  }

  .ksktd_all-content .container .row-tuyen-dung .btn-dat-lich {
    margin-bottom: 16px;
  }

  .ksktd_all-content .container .row-box-giai-thich .col-sm-12:nth-child(1) {
    padding-right: 0;
  }

  .ksktd_all-content .container .row-box-giai-thich .col-sm-12:nth-child(2) div {
    padding-right: 0;
    margin-top: 16px;
  }

  .bang-ket-qua-xet-nghiem .table-heading {
    flex-wrap: wrap;
    gap: 16px;
  }

  .bang-ket-qua-xet-nghiem .container .table-chu-thich {
    justify-content: start;
  }

  .kham-chuyen-sau-dv .box-dv-chuyensau {
    margin-right: 0 !important;
  }

  .kham-chuyen-sau-bai-viet {
    padding: 0 10px;
  }

  .kham-chuyen-sau-bai-viet .container {
    padding: 15px !important;
  }

  .kskdn-banner .container-fluid {
    height: 130px;
  }

  .kskdn-banner .container-fluid>img {
    height: 100%;
  }

  .kskdn-banner .container-fluid .text-title {
    text-align: center;
  }

  .mobile-dp-none {
    display: none;
  }

  .page_login .login .form {
    padding-right: 45px;
    padding: 36px;
  }
}

@media only screen and (max-width: 767px) {
  .kh_item_index .img-fluid {
    position: static;
    transform: none;
  }

  .banner .slick-track,
  .banner .slick-slide {
    /* max-height: 300px; */
  }

  .goi-xet-nghiem .container .col-md-7 .tab-pane .box-dv div {
    flex-direction: column;
  }

  .banner-health-premium.q_banner-health-premium .box-content .ess_description p,
  .banner-essentinal.q_banner-essential .box-content .ess_description {
    font-size: 23px;
    margin: 10px 0;
    line-height: 1.2;
  }

  .dich-vu-lay-mau-xn .box-content {
    left: 5%;
  }

  .banner_contact {
    padding: 30px 0;
  }

  .banner_contact h1,
  .kskdn-banner .container-fluid .text-title h1 {
    font-size: 23px;
  }

  .ksklx_dangky .btn_dat_lich {
    margin-bottom: 15px;
  }

  /* RESPONSIVE MENU MOBILE */
  #menu-mobile .navbar-nav .sub-menu a span {
    display: none !important;
  }

  #menu-mobile .navbar-nav .sub-menu {
    display: none;
    width: auto;
    position: unset;
  }



  #menu-mobile .navbar-nav {
    align-items: flex-start;
    gap: 10px;
    overflow-y: scroll;
  }

  #menu-mobile .navbar-nav>li>a {
    color: rgba(36, 36, 36, 1);
  }

  #menu-mobile .navbar-nav>li {
    width: 100%;
  }

  #menu-mobile .navbar-nav>li>a {
    color: rgba(36, 36, 36, 1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }

  #menu-mobile .navbar-nav>li>a span {
    width: 24px;
    text-align: center;
    transform: rotate(90deg);
  }

  #menu-mobile .navbar-nav>li:not(.menu-item-has-children) a span {
    display: none;
  }

  #menu-mobile .navbar-nav>li .sub-menu {
    padding: 20px 10px !important;
  }

  #menu-mobile .navbar-nav>li .sub-menu.has_lv2 .sub-menu {
    margin-top: 0 !important;
    padding: 10px !important;
  }

  #menu-mobile .navbar-nav>li .sub-menu.has_lv2 .sub-menu li {
    margin-bottom: 8px;
  }

  #menu-mobile .navbar-nav>li .sub-menu.has_lv2 .sub-menu li>a {
    color: rgba(36, 36, 36, 1);
  }

  #menu-mobile .container {
    padding-top: 20px !important;
    position: sticky;
    top: 0;
  }

  #menu-mobile .user-logged .user-menu-sub {
    display: none;
  }

  #menu-mobile .user-logged {
    display: flex;
    justify-content: space-between;
    background: linear-gradient(to bottom right, rgba(246, 203, 132, 1), rgba(187, 144, 103, 1));
    height: 36px;
    border-radius: 36px;
    align-items: center;
    padding: 0 10px 0 5px;
    gap: 5px;
    position: relative;
  }

  #menu-mobile .user-logged .user-avatar img {
    width: 28px;
    min-width: 28px;
  }

  #menu-mobile .user-logged .user-name {
    font-weight: 600;
    color: rgba(41, 70, 100, 1);
    font-size: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #menu-mobile .user-logged .user-icon-dropdown {
    transform: rotate(90deg);
    color: rgba(41, 70, 100, 1);
  }

  #menu-mobile .user-logged .user-menu-sub {
    position: absolute;
    top: 44px;
    left: 0;
    background-color: #FFF;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px;
  }

  #menu-mobile .user-logged .user-menu-sub ul {
    padding-left: 0 !important;
  }

  #menu-mobile .user-logged .user-menu-sub ul li {
    margin-bottom: 8px;
  }

  #menu-mobile .col-12 .btn_dat_lich {
    width: 100%;
  }

  .page_csskgd .box_cssk {
    padding: 0 15px !important;
  }

  .page_csskgd .container>.mt-50.mb-50 {
    gap: 40px;
  }

  .page_csskgd .q_info_xn .row-text-heading .col-md-8 {
    display: none;
  }

  .page_csskgd .q_info_xn .row-text-heading .col-md-4 {
    text-align: center;
  }

  .page_csskgd .q_info_xn .row-info-user {
    gap: 10px;
  }

  .page_csskgd .q_info_xn .row-info-user .col-md-8 .row {
    gap: 16px;
    padding: 15px 0;
    margin: 0;
  }

  .page_csskgd .q_info_xn .container.list .row {
    margin: 0;
  }

  .page_csskgd .q_info_xn .container.list .card {
    width: 100%;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body {
    overflow-x: auto;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body::-webkit-scrollbar {
    height: 10px;
  }

  .page_csskgd .q_info_xn .container.list .card .card-body::-webkit-scrollbar-track {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 10px;
    border: 1px solid rgba(234, 234, 235, 1);
  }

  .page_csskgd .q_info_xn .container.list .card .card-body::-webkit-scrollbar-thumb {
    background-color: rgba(234, 234, 235, 1);
    border-radius: 10px;
  }

  .q_info_nt .row .table_nt th {
    flex-wrap: wrap;
    gap: 0px;
    align-items: center;
    justify-content: center;
    width: 100px;
  }

  .q_info_nt .row .table_nt th>img {
    max-width: 20px;
  }

  .kq_kham-suc-khoe-title {
    margin: 0;
  }

  .kq_kham-suc-khoe-title .container {
    gap: 12px;
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .kq-kham-breadcrumb {
    gap: 6px;
  }

  .kq-result-preview {
    padding: 15px 0 60px;
  }

  .kq-result-preview .container {
    padding-right: 15px;
    padding-left: 15px;
  }

  .kq-result-preview__card {
    padding-right: 15px;
    padding-bottom: 50px;
    padding-left: 15px;
  }

  .kq-result-preview__header {
    align-items: flex-start;
    flex-direction: column;
    gap: 16px;
    padding: 15px;
  }

  .kq-result-preview__heading-copy h2 {
    font-size: 20px;
  }

  .kq-result-preview__heading-copy p {
    font-size: 14px;
    line-height: 22px;
  }

  .kq-result-preview__download {
    align-self: stretch;
    font-size: 13px;
  }

  .kq-result-preview__content {
    min-height: 80px;
  }

  .kq-result-steps {
    padding: 24px 0;
  }

  .kq-result-steps__button {
    flex: 0 0 auto;
    padding: 10px 12px;
    font-size: 13px;
  }

  .kq-result-preview__actions {
    gap: 8px;
    max-width: calc(100% - 30px);
  }

  .kq-result-preview__prev,
  .kq-result-preview__next {
    min-height: 42px;
    padding: 10px 14px;
    font-size: 15px;
  }

  .kq-result-preview__placeholder {
    min-height: 140px;
    padding: 30px 15px;
  }

  .kq-result-tabs__title {
    font-size: 17px;
  }

  .kq-result-tabs__tab {
    padding: 10px 16px;
    font-size: 14px;
  }

  .kq-result-detail__row {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 6px;
    padding: 14px 15px;
  }

  .kq-result-detail__label,
  .kq-result-detail__value {
    font-size: 14px;
    line-height: 22px;
  }

  .kq-result-conclusion__card {
    padding: 16px;
  }

  .kq-result-conclusion__card h4 {
    margin-bottom: 14px;
    font-size: 16px;
  }

  .kq-result-preview__placeholder p {
    font-size: 15px;
    text-align: center;
  }

  .bang-ket-qua-xet-nghiem .table-ket-qua {
    gap: 15px;
  }

  /* .bang-ket-qua-xet-nghiem .table-ket-qua .noi-dung-tab .row:nth-child(1){
    display: none;
  } */

  .bang-ket-qua-xet-nghiem .table-ket-qua .row-ket-qua .col-md-2 {
    /* width: 50%; */
  }

  .bang-ket-qua-xet-nghiem .table-ket-qua .row-ket-qua .col-md-4 {
    margin: 30px 0;
  }

  .nhan-dinh-ket-qua {
    padding: 0 15px;
  }

  .nhan-dinh-ket-qua .container {
    padding: 10px !important;
  }

  .q_info_xn .list .card-header {
    line-height: 30px;
  }

  .gap-110px {
    display: none !important;
  }

  .gap-65px {
    display: block !important;
  }

  .top_bar-mobile {
    position: fixed;
    width: 100%;
  }

  .card-gioi-thieu .row .col-md-4 {
    margin-bottom: 20px;
  }

  .premium-quy-trinh-kham .container .box-quytrinh .box-quytrinh-img {
    width: 100px;
  }

  .premium-quy-trinh-kham .container .col-sm-6 {
    margin-bottom: 95px !important;
  }

  .form-dang-ky-sk {
    padding: 0 15px;
  }

  .form-dang-ky-sk .container {
    padding: 15px 15px !important;
  }

  .premium-dich-vu-tang-kem .row-1,
  .premium-dich-vu-tang-kem .row-2 {
    margin: 0;
  }

  .premium-dich-vu-tang-kem .container {
    padding: 15px !important;
  }

  .premium-dich-vu-tang-kem .row-1 .box_left,
  .premium-dich-vu-tang-kem .row-1 .box_left img {
    width: 100%;
  }

  .premium-dich-vu-tang-kem .row-2 .box_left,
  .premium-dich-vu-tang-kem .row-2 .box_left img {
    width: 100%;
  }

  .q_gg-map {
    justify-content: start;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3.col-sm-2 {
    text-align: center;
    padding: 15px;
    height: 100px;
    width: 100%;
  }

  .ksklx_thong-tin .row-thong-tin-tieu-chuan .col-md-3.col-sm-2 p {
    width: 90%;
  }

  .ess_danh_gia .box-user {
    padding: 30px 15px;
  }

  .btn-search-mobile {
    margin-bottom: 10px;
    width: 100%;
    border: none;
    outline: none;
    padding: 8px;
    border-radius: 25px;
  }

  #search-benh-mobile {
    width: 100%;
    padding: 4px 10px;
    border-radius: 25px;
    border: 1px solid #ccc;
  }

  .icon-search-mobile {
    border: none;
    width: 25px;
    height: 25px;
    min-width: 25px;
    min-height: 25px;
    padding: 0;
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    right: 9px;
    top: 3px;
  }
}

@media only screen and (max-width: 575px) {
  .premium-chuyenkhoanoibat .box-chuyen-khoa>img {
    height: auto !important;
    width: 100%;
  }
}

@media only screen and (max-width: 375px) {
  .q_dang-ky .row .col-12:nth-child(1) .thac_mac {
    bottom: -18px;
  }

  .q_gg-map {
    justify-content: start;
  }
}

.show-menu {
  display: block !important;
}

.show-text-success {
  display: block !important;
}

/* BMI lookup redesign */
.page_bmi .q_bang-tinh-BMI {
  margin-bottom: 90px;
}

.page_bmi .q_bang-tinh-BMI .bang_tinh {
  padding: 30px 45px !important;
  border: 1px solid rgba(207, 179, 108, 0.30);
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.10);
}

.page_bmi .bmi-lookup-title {
  margin: 0 0 24px;
  color: #103051;
  font-family: "Playfair Display", serif;
  font-size: 30px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.6px;
  text-align: center;
  text-transform: uppercase;
}

.page_bmi .bmi-form-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(207, 179, 108, 0.30);
}

.page_bmi .bmi-form-heading h3 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.page_bmi .bang_tinh label.extra {
  float: none;
  margin: 0;
  color: #4A4A4A;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-align: right;
}

.page_bmi .bang_tinh label.extra span {
  color: #E33D3D;
}

.page_bmi .bmi-fields {
  margin-right: -6px;
  margin-left: -6px;
}

.page_bmi .bmi-fields>[class*="col-"] {
  padding-right: 6px;
  padding-left: 6px;
}

.page_bmi .bang_tinh .item {
  padding: 20px 40px 16px;
  border: 1px solid rgba(207, 179, 108, 0.16);
  border-radius: 10px;
  background: #FFFCF8;
  text-align: center;
}

.page_bmi .bang_tinh .item p {
  margin: 0 0 8px;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: center;
}

.page_bmi .q_bang-tinh-BMI .bang_tinh form .chi-so-ca-nhan {
  display: flex;
  align-items: baseline;
  justify-content: center;
  margin-bottom: 11px;
}

.page_bmi .q_bang-tinh-BMI .bang_tinh form .input_chiso_bmi {
  width: 1ch;
  min-width: 1ch;
  max-width: 4ch;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 55px;
  font-style: normal;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 1.1px;
  text-align: center;
  appearance: textfield;
}

.page_bmi .input_chiso_bmi::-webkit-inner-spin-button,
.page_bmi .input_chiso_bmi::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.page_bmi .bmi-unit {
  color: #4A4A4A;
  font-family: Inter, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.4px;
}

.page_bmi .range-input {
  width: 100%;
  height: 6px;
  border-radius: 15px;
  outline: 0;
  background: #CCC;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.page_bmi .range-input::-webkit-slider-thumb {
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  border: 4px solid #BB9067;
  border-radius: 50%;
  background: #E2BF9D;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
  cursor: grab;
  appearance: none;
  -webkit-appearance: none;
}

.page_bmi .range-input::-moz-range-thumb {
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  border: 4px solid #BB9067;
  border-radius: 50%;
  background: #E2BF9D;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
  cursor: grab;
}

.page_bmi .bmi-actions {
  gap: 10px;
  margin-top: 20px;
}

.page_bmi .bang_tinh .bmi-actions .bt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  height: auto;
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 80px;
  font-family: "Playfair Display", serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.page_bmi .bang_tinh .bmi-actions .bt i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  font-size: 16px;
}

.page_bmi .bang_tinh .bmi-actions .xkq {
  border: 1px solid transparent;
  background: linear-gradient(83deg, #294664 -29.47%, #30649E 100%);
  color: #FFF;
  cursor: not-allowed;
  opacity: 0.45;
}

.page_bmi .bang_tinh .bmi-actions .xkq.is-ready {
  cursor: pointer;
  opacity: 1;
}

.page_bmi .bang_tinh .bmi-actions .lm {
  border: 1px solid rgba(207, 179, 108, 0.16);
  background: #FBF7EC;
  color: #8F6E2E;
}

.page_bmi .bang_tinh .bmi-actions .xkq.is-ready:hover,
.page_bmi .bang_tinh .bmi-actions .xkq.is-ready:focus {
  border-color: #CFB36C;
  background: linear-gradient(83deg, #30649E -29.47%, #294664 100%);
  color: #FFF;
  transform: translateY(-1px);
}

.page_bmi .bang_tinh .bmi-actions .lm:hover,
.page_bmi .bang_tinh .bmi-actions .lm:focus {
  border-color: #CFB36C;
  background: #CFB36C;
  color: #FFF;
  transform: translateY(-1px);
}

.page_bmi .bang_tinh .bmi-actions .bt:active {
  transform: translateY(0);
  filter: brightness(0.92);
}

@media only screen and (max-width: 767.98px) {
  .page_bmi .q_bang-tinh-BMI .bang_tinh {
    padding: 24px 15px !important;
  }

  .page_bmi .bmi-lookup-title {
    font-size: 24px;
  }

  .page_bmi .bmi-form-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .page_bmi .bang_tinh label.extra {
    text-align: left;
  }

  .page_bmi .bmi-fields {
    row-gap: 12px;
  }

  .page_bmi .bang_tinh .item {
    padding-right: 15px;
    padding-left: 15px;
  }
}

.page_bmi .bmi-explanation {
  margin-top: 18px;
  overflow: hidden;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10);
}

.page_bmi .bmi-explanation__heading {
  display: flex;
  align-items: center;
  min-height: 50px;
  padding: 0 30px;
  border: 1px solid rgba(207, 179, 108, 0.16);
  border-radius: 20px 20px 0 0;
  background: #F9F5EB;
}

.page_bmi .bmi-explanation__heading h2 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.page_bmi .bmi-explanation__body {
  display: grid;
  grid-template-columns: minmax(0, 475px) minmax(0, 1fr);
  gap: 24px;
  width: 100%;
  max-width: 1200px;
  margin: 24px auto 30px;
}

.page_bmi .bmi-explanation__body--without-image {
  display: block;
}

.page_bmi .bmi-explanation__image img {
  display: block;
  width: 100%;
  max-width: 475px;
  height: auto;
  border-radius: 12px;
}

.page_bmi .bmi-explanation__content {
  min-width: 0;
  color: #4A4A4A;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.page_bmi .bmi-explanation__content> :first-child {
  margin-top: 0;
}

.page_bmi .bmi-explanation__content> :last-child {
  margin-bottom: 0;
}

.page_bmi .bmi-explanation__content h1,
.page_bmi .bmi-explanation__content h2,
.page_bmi .bmi-explanation__content h3,
.page_bmi .bmi-explanation__content h4 {
  margin: 0 0 8px;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
}

.page_bmi .bmi-explanation__content p {
  margin: 0 0 12px;
}

.page_bmi .bmi-explanation__content ul,
.page_bmi .bmi-explanation__content ol {
  margin: 0 0 12px;
  padding-left: 20px;
}

@media only screen and (max-width: 1230px) {
  .page_bmi .bmi-explanation__body {
    margin-right: 30px;
    margin-left: 30px;
    width: auto;
  }
}

@media only screen and (max-width: 767.98px) {
  .page_bmi .bmi-explanation__heading {
    min-height: 48px;
    padding: 0 15px;
  }

  .page_bmi .bmi-explanation__body {
    grid-template-columns: 1fr;
    margin: 12px 15px 24px;
  }

  .page_bmi .bmi-explanation__image img {
    max-width: none;
  }
}

.bmi-result-modal[hidden] {
  display: none;
}

.bmi-result-modal {
  position: fixed;
  z-index: 10050;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 15px;
  background: rgba(16, 48, 81, 0.22);
}

.bmi-result-modal-open {
  overflow: hidden;
}

.bmi-result-modal__dialog {
  width: min(600px, 100%);
  overflow: hidden;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 16px 40px rgba(16, 48, 81, 0.22);
}

.bmi-result-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 54px;
  padding: 0 30px;
  border-bottom: 1px solid rgba(207, 179, 108, 0.30);
  background: #F9F5EB;
}

.bmi-result-modal__header h2 {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.bmi-result-modal__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 34px;
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
}

.bmi-result-modal__close:hover,
.bmi-result-modal__close:focus {
  color: #A78749;
}

.bmi-result-modal__body {
  padding: 30px;
}

.bmi-result-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.bmi-result-card__value {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 326px;
  min-height: 180px;
  padding: 20px;
  border-radius: 6px;
  color: #FFF;
  text-align: center;
}

.bmi-result-card__value p {
  margin: 0 0 16px;
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-align: center;
}

.bmi-result-card__value strong {
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 55px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 1.1px;
  text-align: center;
}

.bmi-result-card__summary {
  margin: 0;
  color: #103051;
  font-family: Inter, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-align: center;
}

.bmi-result-card__summary strong {
  font-weight: 700;
}

/* Guarantee page introduction */
.q_baolanhvienphi+.guarantee-intro {
  margin-top: 0;
}

.guarantee-intro {
  padding: 0;
}

/* This section is outside .page_tctd, so give it the same 1320px content width. */
.guarantee-intro>.container {
  width: 100%;
  max-width: none;
  padding-right: 15px;
  padding-left: 15px;
}

@media only screen and (min-width: 1400px) {
  .guarantee-intro>.container {
    max-width: 1344px;
  }
}

.guarantee-intro__card {
  padding: 30px 45px 45px;
  border: 1px solid rgba(207, 179, 108, 0.30);
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.10);
  margin-bottom: 90px;
}

.guarantee-intro__card>h2 {
  margin: 0 0 34px;
  color: #103051;
  font-family: "Playfair Display", serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.6px;
  text-align: center;
  text-transform: uppercase;
}

.guarantee-intro__body {
  display: grid;
  grid-template-columns: minmax(0, 475px) minmax(0, 1fr);
  align-items: center;
  gap: 44px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.guarantee-intro__body--without-image {
  display: block;
}

.guarantee-intro__image img {
  display: block;
  width: 100%;
  max-width: 475px;
  height: auto;
  border-radius: 12px;
}

.guarantee-intro__features {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.guarantee-intro__feature {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  color: #1F2937;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.guarantee-intro__feature>img {
  flex: 0 0 24px;
  width: 24px;
  height: 28px;
  margin-top: 1px;
  object-fit: contain;
}

.guarantee-intro__feature p {
  margin: 0;
}

/* Guarantee process */
.guarantee-process {
  margin-top: 90px;
  padding: 0;
}

.guarantee-process__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 475px);
  align-items: center;
  gap: 48px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.guarantee-process__layout--without-image {
  display: block;
}

.guarantee-process__steps {
  display: flex;
  flex-direction: column;
  gap: 34px;
}

.guarantee-process__step {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.guarantee-process__number {
  display: inline-flex;
  flex: 0 0 52px;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 9999px;
  background: rgba(207, 179, 108, 0.16);
  color: #A78749;
  font-family: Inter, sans-serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.6px;
  text-align: center;
  text-transform: uppercase;
}

.guarantee-process__text {
  flex: 1 1 auto;
  color: #0F172B;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  text-align: justify;
}

.guarantee-process__text p {
  margin: 0;
}

.guarantee-process__image img {
  display: block;
  width: 100%;
  max-width: 475px;
  height: auto;
  max-height: 304px;
  border-radius: 12px;
}

/* Guarantee benefits */
.guarantee-benefits {
  margin-top: 90px;
}

.guarantee-benefits>h2 {
  margin: 0 0 34px;
  color: #103051;
  font-family: "Playfair Display", serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.6px;
  text-align: center;
  text-transform: uppercase;
}

.guarantee-benefits__cards,
.guarantee-benefits__checks {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.guarantee-benefits__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 196px;
  padding: 14px 15px 29px;
  border: 1.6px solid #3F82CE;
  border-radius: 10px;
  background: linear-gradient(180deg, #103051 0%, #30649E 100.85%);
  color: #FFF;
  text-align: center;
}

.guarantee-benefits__icon {
  display: flex;
  flex: 0 0 64px;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin-bottom: 10px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.20);
}

.guarantee-benefits__icon img {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.guarantee-benefits__card h3 {
  max-width: 130px;
  margin: 0 0 10px;
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
}

.guarantee-benefits__text {
  max-width: 130px;
  color: #FFF;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
}

.guarantee-benefits__text p {
  margin: 0;
}

.guarantee-benefits__pointer {
  position: absolute;
  top: 100%;
  left: 50%;
  width: 0;
  height: 0;
  border-top: 12px solid #30649E;
  border-right: 12px solid transparent;
  border-left: 12px solid transparent;
  transform: translateX(-50%);
}

.guarantee-benefits__checks {
  position: relative;
  margin-top: 24px;
}

.guarantee-benefits__checks::before {
  position: absolute;
  top: 50%;
  right: calc((100% - 50px) / 12);
  left: calc((100% - 50px) / 12);
  z-index: 0;
  height: 1px;
  background: rgba(207, 179, 108, 0.50);
  content: "";
}

.guarantee-benefits__check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  position: relative;
  z-index: 1;
  width: 40px;
  height: 40px;
  border: 4px solid #CFB36C;
  border-radius: 9999px;
  background: #A78749;
  color: #FFF;
  font-family: Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}

@media only screen and (max-width: 1199.98px) {

  .guarantee-benefits__cards,
  .guarantee-benefits__checks {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 28px;
  }

  .guarantee-benefits__checks {
    display: none;
  }

  .guarantee-benefits__card {
    min-height: 180px;
  }
}

@media only screen and (max-width: 767.98px) {
  .guarantee-process {
    margin-top: 50px;
  }

  .guarantee-process__layout {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .guarantee-process__steps {
    gap: 24px;
  }

  .guarantee-process__number {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
    font-size: 26px;
  }

  .guarantee-process__text {
    padding-top: 6px;
    font-size: 15px;
    line-height: 24px;
  }

  .guarantee-process__image img {
    max-width: none;
  }

  .guarantee-benefits {
    margin-top: 50px;
  }

  .guarantee-benefits>h2 {
    margin-bottom: 24px;
    font-size: 24px;
  }

  .guarantee-benefits__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .guarantee-benefits__card {
    min-height: 190px;
    padding: 14px 10px;
  }

  .guarantee-benefits__card h3 {
    font-size: 16px;
    line-height: 21px;
  }

  .guarantee-benefits__text {
    font-size: 13px;
    line-height: 18px;
  }
}

/* Guarantee partners */
.guarantee-partners-section {
  margin-top: 90px;
}

.guarantee-partners {
  position: relative;
  padding: 0 28px 28px;
  border: 1px solid rgba(207, 179, 108, 0.40);
  border-radius: 20px;
  background: #FFF;
}

.guarantee-partners>h2 {
  width: fit-content;
  margin: -17px auto 28px;
  padding: 0 24px;
  background: #FFF;
  color: #103051;
  font-family: "Playfair Display", serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.6px;
  text-align: center;
  text-transform: uppercase;
}

.guarantee-partners__slider {
  position: relative;
}

.guarantee-partners__track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.guarantee-partners__track::-webkit-scrollbar {
  display: none;
}

.guarantee-partners__logo {
  display: flex;
  flex: 0 0 calc((100% - 48px) / 5);
  align-items: center;
  justify-content: center;
  height: 80px;
  border-radius: 6px;
  background: #ffffff;
}

.guarantee-partners__logo img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.guarantee-partners__arrow {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #C2A55D;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.16);
  color: #FFF;
  font-size: 0;
  cursor: pointer;
  transform: translateY(-50%);
}

.guarantee-partners__arrow::before {
  display: block;
  width: 8px;
  height: 8px;
  border: solid #FFF;
  border-width: 0 0 2px 2px;
  content: "";
  transform: translateX(2px) rotate(45deg);
}

.guarantee-partners__arrow--next::before {
  border-width: 0 2px 2px 0;
  transform: translateX(-2px) rotate(-45deg);
}

.guarantee-partners__arrow:hover,
.guarantee-partners__arrow:focus {
  background: #A78749;
}

.guarantee-partners__arrow--previous {
  left: -48px;
}

.guarantee-partners__arrow--next {
  right: -48px;
}

@media only screen and (max-width: 1199.98px) {
  .guarantee-partners__logo {
    flex-basis: calc((100% - 24px) / 3);
  }
}

@media only screen and (max-width: 767.98px) {
  .guarantee-partners-section {
    margin-top: 50px;
  }

  .guarantee-partners {
    padding: 0 15px 20px;
  }

  .guarantee-partners>h2 {
    margin-top: -14px;
    margin-bottom: 20px;
    padding: 0 12px;
    font-size: 23px;
  }

  .guarantee-partners__logo {
    flex-basis: calc((100% - 12px) / 2);
  }

  .guarantee-partners__arrow--previous {
    left: -35px;
  }

  .guarantee-partners__arrow--next {
    right: -35px;
  }
}

@media only screen and (max-width: 991.98px) {
  .guarantee-intro__body {
    grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
    gap: 28px;
  }
}

@media only screen and (max-width: 767.98px) {
  .guarantee-intro {
    padding-bottom: 15px;
  }

  .guarantee-intro__card {
    padding: 24px 15px;
  }

  .guarantee-intro__card>h2 {
    margin-bottom: 24px;
    font-size: 24px;
  }

  .guarantee-intro__body {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .guarantee-intro__image img {
    max-width: none;
  }

  .guarantee-intro__feature {
    gap: 12px;
    font-size: 15px;
    line-height: 22px;
  }
}

@media only screen and (max-width: 575.98px) {

  .kq_kham-suc-khoe-title .container {
    flex-wrap: nowrap;
    gap: 8px;
  }

  .kq_kham-suc-khoe-title .kq-kham-back {
    gap: 4px;
    font-size: 13px;
    white-space: nowrap;
  }

  .kq-kham-breadcrumb {
    flex: 1 1 auto;
    flex-wrap: nowrap;
    gap: 4px;
    min-width: 0;
    font-size: 12px;
    line-height: 18px;
    white-space: nowrap;
  }

  .kq-kham-breadcrumb__separator {
    flex-basis: 5px;
    width: 5px;
    height: 5px;
  }

  .bmi-result-modal__header,
  .bmi-result-modal__body {
    padding-right: 20px;
    padding-left: 20px;
  }

  .bmi-result-modal__body {
    padding-top: 24px;
    padding-bottom: 24px;
  }

  .bmi-result-card__summary {
    font-size: 18px;
  }
}

/* ==========================================================================
   Đặt lịch khám trực tuyến (template/booking-work.php)
   ========================================================================== */

.booking-hero {
  position: relative;
  display: block;
  padding: 80px 0 100px;
  background: #294664;
  overflow: hidden;
}

.booking-hero__bg {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.booking-hero__bg::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 43, .30) 0%, rgba(15, 23, 43, .50) 100%);
  content: "";
}

.booking-hero > .container {
  position: relative;
  z-index: 1;
}

@media only screen and (min-width: 1400px) {
  .booking-hero > .container {
    max-width: 1344px;
  }
}

@media only screen and (max-width: 1399.98px) {
  .booking-hero > .container {
    width: 100%;
    max-width: none;
    padding-right: 15px;
    padding-left: 15px;
  }
}

.booking-hero__intro {
  margin: 0 0 56px;
  text-align: center;
}

.booking-hero__intro h1 {
  margin: 0 0 12px;
  color: #fff;
  text-align: center;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .72px;
  text-transform: uppercase;
}

.booking-hero__intro p {
  margin: 0;
  color: #cad5e2;
  text-align: center;
  font-family: Inter, Arial, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 29.25px;
}

.booking-hero__body {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  align-items: stretch;
  gap: 48px;
}

/* --- Cột trái: ảnh + 2 badge nổi --- */

.booking-hero__visual {
  position: relative;
}

.booking-hero__visual img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 24px;
  object-fit: cover;
}

.booking-hero__badge {
  position: absolute;
  display: flex;
  border-radius: 16px;
}

.booking-hero__badge--support {
  top: 52.5px;
  left: -66px;
  flex-direction: column;
  gap: 12px;
  padding: 16px 20px;
  background: linear-gradient(135deg, #cfb36c 0%, #a78749 100%);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .10), 0 8px 10px -6px rgba(0, 0, 0, .10);
}

.booking-hero__badge-label {
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
}

.booking-hero__badge--support strong {
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 800;
  line-height: 30px;
}

.booking-hero__badge--certified {
  right: -19px;
  bottom: 48px;
  align-items: center;
  gap: 12px;
  width: 226px;
  padding: 14px 16px;
  background: #fff;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
}

.booking-hero__badge-icon {
  display: inline-flex;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #ffe6be;
}

.booking-hero__badge-icon svg {
  display: block;
  width: 20px;
  height: 20px;
}

.booking-hero__badge-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.booking-hero__badge-copy strong {
  color: #0f172b;
  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 17.5px;
}

.booking-hero__badge-copy span {
  color: #4b4b4b;
  font-family: Inter, Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

/* --- Cột phải: form kính mờ --- */

.booking-hero__form {
  padding: 60px 40px;
  border: 1px solid rgba(241, 245, 249, .20);
  border-radius: 24px;
  background: rgba(255, 255, 255, .16);
  box-shadow: 0 1px 2px -1px rgba(0, 0, 0, .10);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.booking-hero__form h2 {
  margin: 0 0 32px;
  color: #fff;
  text-align: center;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.booking-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.booking-form__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.booking-form__field--full {
  grid-column: 1 / -1;
}

.booking-form__field label {
  margin: 0;
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.booking-form__field label i {
  color: #ff6b6b;
  font-style: normal;
}

.booking-form__control {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid rgba(226, 232, 240, .20);
  border-radius: 60px;
  background: rgba(248, 250, 252, .10);
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  transition: border-color .2s ease, background-color .2s ease;
}

.booking-form__control:focus {
  border-color: rgba(207, 179, 108, .60);
  background: rgba(248, 250, 252, .16);
  color: #fff;
  outline: none;
}

.booking-form__control::placeholder {
  color: #d1d5db;
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  opacity: 1;
}

.booking-form__control--select {
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%23D1D5DB' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right 16px center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  -webkit-appearance: none;
  appearance: none;
}

/* Select rỗng hiển thị như placeholder, chọn rồi thì trắng */
.booking-form__control--select:invalid {
  color: #d1d5db;
}

.booking-form__control--select option {
  color: #0f172b;
}

.booking-form__control--date::-webkit-datetime-edit {
  color: #d1d5db;
}

.booking-form__control--date:focus::-webkit-datetime-edit,
.booking-form__control--date:valid::-webkit-datetime-edit {
  color: #fff;
}

.booking-form__control--date::-webkit-calendar-picker-indicator {
  cursor: pointer;
  filter: invert(1);
  opacity: .7;
}

.booking-form__control--note {
  min-height: 100px;
  border-radius: 24px;
  resize: vertical;
}

.booking-form__submit {
  display: block;
  width: 100%;
  padding: 14px 24px;
  border: 0;
  border-radius: 60px;
  background: linear-gradient(90deg, #a78749 0%, #cfb36c 100%);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .10), 0 1px 2px -1px rgba(0, 0, 0, .10);
  color: #fff;
  text-align: center;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: filter .2s ease;
}

.booking-form__submit:hover,
.booking-form__submit:focus-visible {
  color: #fff;
  filter: brightness(1.06);
}

.booking-hero .alert {
  margin-bottom: 24px;
  border-radius: 16px;
}

/*
  Badge nhô ra ngoài mép ảnh nên cần lề trống hai bên container.
  Lề đó = (100vw - 1344px) / 2 + 12px, hẹp dần khi thu màn hình:
  1500px -> 90px, 1440px -> 60px, 1400px -> 40px, dưới 1400px chỉ còn 15px.
  Nên giảm dần độ nhô rồi đưa hẳn badge vào trong ảnh, tránh bị overflow cắt mất.
*/
@media only screen and (max-width: 1499.98px) {
  .booking-hero__badge--support {
    left: -32px;
  }
}

@media only screen and (max-width: 1399.98px) {
  .booking-hero__badge--support {
    top: 24px;
    left: 24px;
  }

  .booking-hero__badge--certified {
    right: 24px;
    bottom: 24px;
  }
}

@media only screen and (max-width: 1199.98px) {
  .booking-hero__body {
    gap: 32px;
  }

  .booking-hero__form {
    padding: 40px 28px;
  }
}

@media only screen and (max-width: 991.98px) {
  .booking-hero__body {
    grid-template-columns: minmax(0, 1fr);
  }

  .booking-hero__visual img {
    height: auto;
    aspect-ratio: 1 / 1;
  }
}

@media only screen and (max-width: 767.98px) {
  .booking-hero {
    padding: 48px 0 60px;
  }

  .booking-hero__intro {
    margin-bottom: 32px;
  }

  .booking-hero__intro h1 {
    font-size: 26px;
  }

  .booking-hero__intro p {
    font-size: 15px;
    line-height: 24px;
  }

  .booking-hero__badge--support {
    top: 16px;
    left: 16px;
    padding: 12px 16px;
  }

  .booking-hero__badge--support strong {
    font-size: 24px;
    line-height: 24px;
  }

  .booking-hero__badge--certified {
    right: 16px;
    bottom: 16px;
    width: auto;
    max-width: calc(100% - 32px);
  }

  .booking-hero__form {
    padding: 28px 20px;
  }

  .booking-hero__form h2 {
    margin-bottom: 24px;
    font-size: 24px;
    letter-spacing: 1px;
  }

  .booking-form__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ==========================================================================
   Chi tiết bệnh - Thư viện bệnh (single-thu_vien_benh.php)
   ========================================================================== */

.disease-hero > .container,
.disease-body > .container,
.disease-related > .container {
  position: relative;
}

@media only screen and (min-width: 1400px) {
  .disease-hero > .container,
  .disease-body > .container,
  .disease-related > .container {
    max-width: 1344px;
  }
}

@media only screen and (max-width: 1399.98px) {
  .disease-hero > .container,
  .disease-body > .container,
  .disease-related > .container {
    width: 100%;
    max-width: none;
    padding-right: 15px;
    padding-left: 15px;
  }
}

/* --- Khối đầu trang --- */

.disease-hero {
  padding: 40px 0;
  background: #f4f7fb;
  font-family: Arial, sans-serif;
}

.disease-hero__breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.disease-hero__breadcrumb a {
  overflow: hidden;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-decoration: none;
  text-overflow: ellipsis;
  transition: color .2s ease;
}

.disease-hero__breadcrumb a:hover,
.disease-hero__breadcrumb a:focus-visible {
  color: #a78749 !important;
  text-decoration: none;
}

.disease-hero__breadcrumb span[aria-hidden] {
  color: #4b4b4b;
}

.disease-hero__breadcrumb-current {
  overflow: hidden;
  color: #a78749;
  text-overflow: ellipsis;
}

/* Mục breadcrumb không phải link: giữ nguyên màu chữ, không đổi khi hover */
.disease-hero__breadcrumb-plain {
  overflow: hidden;
  color: #4b4b4b;
  text-overflow: ellipsis;
}

.disease-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}

.disease-badge {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border-radius: 60px;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  line-height: normal;
  text-transform: uppercase;
  white-space: nowrap;
}

.disease-badge--outline {
  border: 1px solid #c5a059;
  background: #f9f5eb;
  color: #916819;
  font-weight: 400;
}

.disease-badge--solid {
  background: #c5a059;
  color: #fff;
  font-weight: 700;
}

.disease-hero__title {
  margin: 0 0 20px;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
}

.disease-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.disease-hero__author {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.disease-hero__author svg {
  display: block;
  flex: 0 0 16px;
}

/* --- Thân bài --- */

.disease-body {
  padding: 40px 0 60px;
  background: #fff;
  font-family: Inter, Arial, sans-serif;
}

.disease-body__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  align-items: start;
  gap: 40px;
}

.disease-article__thumb {
  margin: 0 0 28px;
}

.disease-article__thumb img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.disease-article__content {
  color: #4b5b6b;
  font-size: 16px;
  line-height: 28px;
}

.disease-article__content h2,
.disease-article__content h3,
.disease-article__content h4 {
  margin: 32px 0 12px;
  color: #294664;
  font-weight: 700;
  text-align: left;
}

.disease-article__content h2 { font-size: 22px; }
.disease-article__content h3 { font-size: 19px; }
.disease-article__content h4 { font-size: 17px; }

.disease-article__content p {
  margin: 0 0 16px;
}

.disease-article__content img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

.disease-article__content a {
  color: #30649e;
  text-decoration: underline;
}

.disease-article__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 36px;
  padding-top: 24px;
  border-top: 1px solid #e8edf3;
}

.disease-article__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.disease-article__tags-label {
  color: #6b7d92;
  font-size: 14px;
  font-weight: 600;
}

.disease-article__tag {
  padding: 6px 12px;
  border-radius: 60px;
  background: #eef2f7;
  color: #4b5b6b;
  font-family: Arial, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}

.disease-article__share {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.disease-share {
  display: inline-flex;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #fff;
  line-height: 1;
  transition: background-color .2s ease, filter .2s ease;
}

.disease-share svg {
  display: block;
  width: 16px;
  height: 16px;
}

.disease-share:hover,
.disease-share:focus-visible {
  color: #fff !important;
  filter: brightness(1.1);
}

.disease-share--fb    { background: #1877f2; }
.disease-share--zalo  { background: #0068ff; }
.disease-share--link  { background: #294664; }
.disease-share--link.is-copied { background: #35b98a; }
.disease-share--link.is-copy-failed { background: #f04444; }

/* --- Sidebar --- */

.disease-sidebar {
  display: flex;
  flex-direction: column;
  gap: 28px;
  min-width: 0;
}

.disease-widget__title {
  margin: 0 0 16px;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}

.disease-widget__cats {
  margin: 0;
  padding: 0;
  list-style: none;
}

.disease-widget__cats li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
}

.disease-widget__cats a {
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  transition: color .2s ease;
}

.disease-widget__cats a:hover {
  color: #916819 !important;
}

.disease-widget__cats span {
  display: flex;
  flex: 0 0 auto;
  align-items: flex-start;
  padding: 2px 8px;
  border-radius: 12px;
  background: #f9f5eb;
  color: #916819;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.disease-widget__posts {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.disease-widget__posts li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.disease-widget__thumb {
  display: block;
  flex: 0 0 68px;
  width: 68px;
  height: 52px;
  border-radius: 8px;
  background: #eef2f7;
  overflow: hidden;
}

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

.disease-widget__copy {
  min-width: 0;
}

.disease-widget__copy a {
  display: block;
  overflow: hidden;
  margin-bottom: 4px;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  text-overflow: ellipsis;
  transition: color .2s ease;
}

.disease-widget__copy a:hover {
  color: #916819 !important;
}

.disease-widget__copy time {
  color: #916819;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/* Cách widget phía trên 60px: 28px từ gap của .disease-sidebar + 32px ở đây */
.disease-newsletter {
  margin-top: 32px;
  padding: 28px;
  border-radius: 16px;
  background: #294664;
}

.disease-newsletter h2 {
  margin: 0 0 20px;
  color: #f6cb84;
  font-family: Arial, sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}

.disease-newsletter > p {
  margin: 0 0 20px;
  color: #d1d5db;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}

.disease-newsletter__form input {
  width: 100%;
  margin-bottom: 20px;
  padding: 12px 16px;
  border: 1px solid rgba(255, 255, 255, .20);
  border-radius: 60px;
  background: rgba(255, 255, 255, .10);
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.disease-newsletter__form input::placeholder {
  color: #9ca3af;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  opacity: 1;
}

.disease-newsletter__form input:focus {
  border-color: rgba(246, 203, 132, .6);
  color: #fff;
  outline: none;
}

/* Email sai định dạng */
.disease-newsletter__form input.is-invalid {
  border-color: #f87171;
}

.disease-newsletter__note {
  display: none;
  margin: -12px 0 16px;
  padding-left: 16px;
  color: #f87171;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

.disease-newsletter__note.is-visible {
  display: block;
}

.disease-newsletter__note.is-success {
  color: #6ee7b7;
}

.disease-newsletter__form button[disabled] {
  cursor: progress;
  opacity: .7;
}

.disease-newsletter__form button {
  width: 100%;
  padding: 12px 24px;
  border: 0;
  border-radius: 60px;
  background: #c5a059;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  transition: filter .2s ease;
}

.disease-newsletter__form button:hover,
.disease-newsletter__form button:focus-visible {
  color: #fff;
  filter: brightness(1.06);
}


/* --- Bài viết liên quan --- */

.disease-related {
  padding: 80px 0 100px;
  background: #f4f7fb;
  font-family: Arial, sans-serif;
}

.disease-related__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 40px;
}

.disease-related__head h2 {
  margin: 0 0 6px;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
  text-transform: uppercase;
}

.disease-related__head p {
  margin: 0;
  color: #6b7d92;
  font-size: 15px;
  line-height: 24px;
}

.disease-related__all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #a78749;
  font-size: 15px;
  font-weight: 500;
  transition: color .2s ease;
}

.disease-related__all:hover {
  color: #8f6e2e !important;
}

.disease-related__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.disease-card {
  display: flex;
  flex-direction: column;
  padding: 16px;
  border: 1px solid #e8edf3;
  border-radius: 16px;
  background: #fff;
  transition: box-shadow .2s ease, transform .2s ease;
}

.disease-card:hover {
  box-shadow: 0 12px 24px -12px rgba(41, 70, 100, .25);
  transform: translateY(-2px);
}

.disease-card__thumb {
  display: block;
  margin-bottom: 16px;
  aspect-ratio: 16 / 10;
  border-radius: 12px;
  background: #eef2f7;
  overflow: hidden;
}

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

.disease-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.disease-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.disease-card__body h3 {
  overflow: hidden;
  margin: 0 0 16px;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
  text-align: left;
  text-overflow: ellipsis;
}

.disease-card__body h3 a {
  color: #103051;
  transition: color .2s ease;
}

.disease-card__body h3 a:hover {
  color: #916819 !important;
}

.disease-card__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  color: #a78749;
  font-size: 14px;
  font-weight: 500;
  transition: color .2s ease;
}

.disease-card__more:hover {
  color: #8f6e2e !important;
}

@media only screen and (max-width: 1199.98px) {
  .disease-body__layout {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 28px;
  }
}

@media only screen and (max-width: 991.98px) {
  .disease-body__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .disease-related__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media only screen and (max-width: 767.98px) {
  .disease-hero {
    padding: 16px 0 28px;
  }

  .disease-hero__title {
    font-size: 26px;
  }

  .disease-hero__meta {
    gap: 16px;
  }

  .disease-body {
    padding: 28px 0 40px;
  }

  .disease-article__footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .disease-related {
    padding: 36px 0 48px;
  }

  .disease-related__head h2 {
    font-size: 22px;
  }

  .disease-related__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ==========================================================================
   Trang 404 (404.php)
   ========================================================================== */

/*
  Ảnh 404.png tỉ lệ 1920x951 (~2:1). Phần minh hoạ chiếm khoảng 63% chiều cao,
  còn lại là vùng xanh phẳng dành cho chữ — nên dùng aspect-ratio để giữ đúng
  tỉ lệ rồi dồn nội dung xuống đáy. #0d2b51 là màu lấy từ mép dưới của ảnh,
  dùng làm background-color để không thấy đường ghép.
*/
.error-404 {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  aspect-ratio: 1920 / 951;
  min-height: 560px;
  padding: 0 15px 6%;
  background-color: #0d2b51;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  font-family: Arial, sans-serif;
}

.error-404__content {
  width: 100%;
  max-width: 660px;
  text-align: center;
}

.error-404__content h1 {
  margin: 0;
  color: #cfb36c;
  font-family: Arial, sans-serif;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .6px;
  text-align: center;
  text-transform: uppercase;
}

.error-404__content p {
  margin: 20px 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 29.25px;
  text-align: center;
}

.error-404__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 20px;
  border-radius: 60px;
  background: linear-gradient(83deg, #a78749 4.55%, #cfb36c 117.94%);
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: uppercase;
  transition: filter .2s ease;
}

.error-404__button:hover,
.error-404__button:focus-visible {
  /* !important để thắng rule 'a:hover { color: #BB9067 !important }' ở đầu file */
  color: #fff !important;
  filter: brightness(1.08);
}

@media only screen and (max-width: 991.98px) {
  .error-404 {
    min-height: 480px;
  }

  .error-404__content h1 {
    font-size: 24px;
  }

  .error-404__content p {
    font-size: 16px;
    line-height: 26px;
  }
}

/*
  Màn nhỏ: 'cover' sẽ cắt mất phần minh hoạ ở hai bên vì khung cao và hẹp,
  nên chuyển sang bám đủ chiều ngang rồi chừa padding-top cho ảnh.
*/
@media only screen and (max-width: 767.98px) {
  .error-404 {
    display: block;
    aspect-ratio: auto;
    min-height: 0;
    padding: 36% 15px 48px;
    background-size: 100% auto;
  }

  .error-404__content {
    margin: 0 auto;
  }

  .error-404__content h1 {
    font-size: 20px;
  }

  .error-404__content p {
    margin: 16px 0;
    font-size: 15px;
    line-height: 24px;
  }

  .error-404__button {
    height: 42px;
    font-size: 15px;
  }
}

/* ==========================================================================
   Cơ sở vật chất - khối album theo nhóm (template/page-csvc.php)
   ========================================================================== */

.csvc-facility {
  padding: 80px 0 100px;
  background-color: #f0f0f0;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  font-family: Arial, sans-serif;
}

@media only screen and (min-width: 1400px) {
  .csvc-facility > .container {
    max-width: 1344px;
  }
}

@media only screen and (max-width: 1399.98px) {
  .csvc-facility > .container {
    width: 100%;
    max-width: none;
    padding-right: 15px;
    padding-left: 15px;
  }
}

.csvc-facility__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 60px;
}

.csvc-facility__intro {
  min-width: 0;
  max-width: 520px;
}

.csvc-facility__intro h2 {
  margin: 0 0 16px;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .64px;
  text-align: left;
  text-transform: uppercase;
}

.csvc-facility__desc,
.csvc-facility__desc p {
  margin: 0;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.csvc-facility__desc p + p {
  margin-top: 12px;
}

/* --- Tab nhóm --- */

.csvc-facility__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.csvc-facility__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 14px;
  border: 1.4px solid rgba(207, 179, 108, .20);
  border-radius: 60px;
  background: #f9f5eb;
  color: #6c4c10;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: .32px;
  white-space: nowrap;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.csvc-facility__tab:hover,
.csvc-facility__tab:focus-visible {
  border-color: rgba(207, 179, 108, .6);
  color: #6c4c10;
}

.csvc-facility__tab.is-active {
  border-color: transparent;
  background: linear-gradient(90deg, #a78749 0%, #cfb36c 100%);
  color: #fff;
}

/* --- Lưới ảnh --- */

.csvc-facility__panel[hidden] {
  display: none;
}

.csvc-facility__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  max-width: 100%;
}

.csvc-facility__item {
  margin: 0;
  /* Tỉ lệ đặt trên khung để height:100% của <img> có mốc xác định mà tính */
  aspect-ratio: 16 / 10;
  border-radius: 20px;
  overflow: hidden;
}

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

.csvc-facility__empty {
  margin: 0;
  padding: 40px 0;
  color: #6b7d92;
  font-family: Arial, sans-serif;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
}

@media only screen and (max-width: 1199.98px) {
  .csvc-facility__head {
    flex-direction: column;
    /* Ở chiều column, align-items điều khiển trục NGANG.
       Phải là stretch, nếu để flex-end thì cả chữ lẫn nút đều bị đẩy sang phải. */
    align-items: stretch;
    gap: 24px;
    margin-bottom: 40px;
  }

  .csvc-facility__intro {
    max-width: none;
    text-align: left;
  }

  /* Vẫn cho phép wrap ở dải này để không xung đột với justify-content: flex-end */
  .csvc-facility__tabs {
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 100%;
  }
}

@media only screen and (max-width: 991.98px) {
  .csvc-facility__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media only screen and (max-width: 767.98px) {
  .csvc-facility {
    padding: 48px 0 60px;
  }

  .csvc-facility__intro h2 {
    font-size: 24px;
  }

  .csvc-facility__desc,
  .csvc-facility__desc p {
    font-size: 15px;
    line-height: 24px;
  }

  /* flex-end + overflow-x cuộn sẽ làm không kéo về được đầu danh sách, nên căn trái ở đây */
  .csvc-facility__tabs {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .csvc-facility__tabs::-webkit-scrollbar {
    display: none;
  }

  .csvc-facility__tab {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 12px;
    font-size: 14px;
  }

  .csvc-facility__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}

/* ==========================================================================
   Trang thiết bị (template/page-csvc.php)
   ========================================================================== */

.equip {
  padding: 80px 0 100px;
  background: #fff;
  font-family: Arial, sans-serif;
}

@media only screen and (min-width: 1400px) {
  .equip > .container {
    max-width: 1344px;
  }
}

@media only screen and (max-width: 1399.98px) {
  .equip > .container {
    width: 100%;
    max-width: none;
    padding-right: 15px;
    padding-left: 15px;
  }
}

.equip__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid #e8edf3;
  margin-bottom: 48px;
}

.equip__intro {
  min-width: 0;
  max-width: 460px;
}

.equip__intro h2 {
  margin: 0 0 12px;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .64px;
  text-align: left;
  text-transform: uppercase;
}

.equip__intro p {
  margin: 0;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

/* --- Dải ảnh tròn --- */

.equip__thumbs {
  /* Đổi 3 biến này là đổi được kích thước và số ảnh hiển thị cùng lúc */
  --equip-thumb-size: 90px;
  --equip-thumb-gap: 12px;
  --equip-thumb-visible: 6;
  display: flex;
  align-items: center;
  gap: 12px;
  /* Ép cụm ảnh tròn dính hẳn mép phải, không để phần dư rơi ra sau nó */
  margin-left: auto;
  min-width: 0;
}

.equip__thumbs-track {
  display: flex;
  align-items: center;
  gap: var(--equip-thumb-gap);
  /*
    Dùng 'width' (kích thước xác định) chứ không phải 'max-width: min(100%, ...)':
    phần trăm bị bỏ qua khi trình duyệt tính intrinsic size, khiến max-content của
    track bằng TẤT CẢ ảnh và bóp méo cột bên cạnh.
    width chốt đúng 6 ảnh + 5 khoảng cách, số còn lại cuộn ngang.
  */
  width: calc(
    var(--equip-thumb-visible) * var(--equip-thumb-size)
    + (var(--equip-thumb-visible) - 1) * var(--equip-thumb-gap)
  );
  max-width: 100%;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.equip__thumbs-track::-webkit-scrollbar {
  display: none;
}

/*
  Ảnh nền lấy từ inline style --equip-thumb.
  Trạng thái thường có thêm lớp phủ xanh 40%, trạng thái active bỏ lớp phủ và thêm viền.
*/
.equip__thumb {
  box-sizing: border-box;
  flex: 0 0 var(--equip-thumb-size);
  width: var(--equip-thumb-size);
  height: var(--equip-thumb-size);
  padding: 0;
  border: 0;
  border-radius: 100px;
  background-color: lightgray;
  background-image: linear-gradient(0deg, rgba(41, 70, 100, .40) 0%, rgba(41, 70, 100, .40) 100%), var(--equip-thumb);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  transition: border-color .2s ease;
}

.equip__thumb.is-active {
  border: 2px solid #30649e;
  background-image: var(--equip-thumb);
}

.equip__nav {
  display: inline-flex;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(90deg, #a78749 0%, #cfb36c 100%);
  color: #fff;
  transition: filter .2s ease;
}

.equip__nav[hidden] {
  display: none;
}

.equip__nav:hover,
.equip__nav:focus-visible {
  color: #fff;
  filter: brightness(1.08);
}

.equip__nav svg {
  display: block;
}

/* --- Nội dung thiết bị --- */

.equip__panel[hidden] {
  display: none;
}

.equip__panel {
  display: grid;
  grid-template-columns: minmax(0, 480px) minmax(0, 1fr);
  align-items: start;
  gap: 60px;
}

.equip__media {
  margin: 0;
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  background: #f4f7fb;
  overflow: hidden;
}

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

.equip__body h3 {
  margin: 0 0 10px;
  color: #103051;
  font-family: Arial, sans-serif;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 30px;
  text-align: left;
}

/* Dòng đầu của wysiwyg là 'Model: ...' */
.equip__content > p {
  margin: 0 0 20px;
  color: #a78749;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.equip__content ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.equip__content ul li {
  position: relative;
  padding-left: 32px;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.equip__content ul li + li {
  margin-top: 14px;
}

.equip__content ul li::before {
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23A78749'/%3E%3Cpath d='M6 10.2l2.6 2.6L14 7.4' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  content: "";
}

@media only screen and (max-width: 1199.98px) {
  .equip__head {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
    margin-bottom: 32px;
  }

  .equip__intro {
    max-width: none;
  }

  .equip__thumbs {
    margin-left: 0;
  }

  .equip__panel {
    grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
    gap: 32px;
  }
}

@media only screen and (max-width: 991.98px) {
  .equip__panel {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
}

@media only screen and (max-width: 767.98px) {
  .equip {
    padding: 48px 0 60px;
  }

  .equip__intro h2 {
    font-size: 24px;
  }

  .equip__intro p {
    font-size: 15px;
    line-height: 24px;
  }

  .equip__thumbs {
    --equip-thumb-size: 64px;
    --equip-thumb-gap: 10px;
  }

  .equip__body h3 {
    font-size: 19px;
    line-height: 26px;
  }
}

/* Thiết bị chưa có ảnh (hoặc file ảnh đã mất): bỏ cột ảnh, nội dung chiếm đủ chiều ngang */
.equip__panel--no-media {
  grid-template-columns: minmax(0, 1fr);
}

/* Ảnh tròn không có hình: dùng nền trung tính + icon, tránh trông như ảnh lỗi */
.equip__thumb[data-equip-empty] {
  background-color: #e8edf3;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5' stroke='%2394A3B8' stroke-width='1.6'/%3E%3Ccircle cx='8.5' cy='10' r='1.6' fill='%2394A3B8'/%3E%3Cpath d='M4 17l4.5-4.5L12 16l3-3 5 5' stroke='%2394A3B8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 28px 28px;
}

.equip__thumb[data-equip-empty].is-active {
  border: 2px solid #30649e;
  background-color: #dbe4ee;
}

/* ==========================================================================
   Trang intro (template/page-intro.php) — toàn màn hình, video nền
   ========================================================================== */
body.intro-body {
    margin: 0;
    background: #294664;
    overflow-x: hidden;
}

.intro-page {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;

    /* kích thước thẻ — khai báo 1 chỗ để media query chỉ cần đổi biến */
    --intro-card-w: 380px;
    --intro-card-h: 480px;
    --intro-card-w-active: 469px;
    --intro-card-h-active: 600px;
    --intro-card-gap: 54px;
    --intro-side: 200px;
    --intro-foot-gap: 150px;   /* khoảng cách từ hàng thẻ xuống chân trang */
}

/* --- nền --- */
.intro-page__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

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

.intro-page__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, #294664 0%, #2C5E96 76.6%, #FFA6C6 110%);
    background-blend-mode: plus-darker;
    mix-blend-mode: plus-darker;
    pointer-events: none;
}

/* plus-darker chưa được hỗ trợ ở mọi trình duyệt — fallback về multiply
   để lớp nền vẫn tối đi đúng tinh thần thiết kế thay vì phủ kín màu. */
@supports not (mix-blend-mode: plus-darker) {
    .intro-page__overlay {
        mix-blend-mode: multiply;
    }
}

.intro-page__inner {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    /* Không đặt min-height: 100vh ở đây — flex: 1 của thẻ cha đã kéo đủ cao. */
    box-sizing: border-box;
}

/* --- cụm đầu trang --- */
.intro-page__head {
    box-sizing: border-box;
    padding: 30px 15px 0;
    text-align: center;
}

.intro-page__logo {
    display: inline-block;
    margin-bottom: 26px;
}

.intro-page__logo img {
    display: block;
    width: 185px;
    height: 44px;
    max-width: 100%;
    object-fit: contain;
}

.intro-page__title {
    margin: 0 0 14px;
    color: #FFF;
    text-align: center;
    font-family: Arial;
    font-size: 42px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.42px;
}

.intro-page__desc {
    margin: 0 auto;
    max-width: 950px;
    color: rgba(255, 255, 255, 0.70);
    text-align: center;
    font-family: Arial;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    letter-spacing: 0.36px;
}

/* --- hàng thẻ --- */
.intro-page__cards {
    flex: 1 1 auto;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--intro-card-gap);
    padding: 40px 15px var(--intro-foot-gap);
    min-height: calc(var(--intro-card-h-active) + 40px);
}

.intro-page__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.intro-card {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: var(--intro-card-w);
    height: var(--intro-card-h);
    max-width: 100%;
    border-radius: 20px;
    border: 1px solid transparent;
    background: #000;
    overflow: hidden;
    text-decoration: none;
    transition: width .6s cubic-bezier(.25, .1, .25, 1),
                height .6s cubic-bezier(.25, .1, .25, 1),
                border-color .6s ease;
}

.intro-card__img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
    /* thẻ chưa được chọn thì hiển thị đen trắng */
    filter: grayscale(1);
    transition: filter .6s ease;
}

/* nhãn dưới ảnh — chỉ hiện ở thẻ chưa được chọn */
.intro-card__label {
    color: rgba(255, 255, 255, 0.70);
    text-align: center;
    font-family: Arial;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

/* khung chữ trong ảnh — chỉ hiện ở thẻ được chọn */
.intro-card__caption {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 12px;
    box-sizing: border-box;
    display: none;
    padding: 16px 24px;
    border-radius: 12px;
    border: 1px solid rgba(255, 224, 174, 0.35);
    background: linear-gradient(267deg, rgba(57, 112, 174, 0.70) 0%, rgba(41, 70, 100, 0.70) 100%);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    text-align: center;
}

.intro-card__caption-title {
    display: block;
    color: #FFF;
    font-family: Arial;
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.6px;
}

.intro-card__caption-desc {
    display: block;
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.70);
    font-family: Arial;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

/* --- trạng thái được chọn ---
   Thứ tự 3 bước dưới đây quyết định hiệu ứng, không được đảo:
     (1) thẻ nổi bật mặc định            -> to
     (2) khi trỏ chuột vào hàng thẻ      -> thẻ mặc định thu nhỏ lại
     (3) thẻ đang được trỏ vào           -> to
   (2) và (3) cùng độ ưu tiên (0,4,0) nên (3) phải đứng sau để thắng — nhờ đó
   trỏ vào chính thẻ mặc định thì nó vẫn giữ nguyên kích thước lớn.
   Toàn bộ chạy bằng css, không cần js; thiết bị cảm ứng không có hover nên
   thẻ mặc định luôn giữ trạng thái nổi bật. */

/* (1) */
.intro-card.is-featured {
    width: var(--intro-card-w-active);
    height: var(--intro-card-h-active);
    border-color: rgba(255, 224, 174, 0.50);
}

.intro-card.is-featured .intro-card__img {
    filter: none;
}

.intro-card.is-featured .intro-card__caption {
    display: block;
}

.intro-card.is-featured + .intro-card__label {
    display: none;
}

/*
  Hiệu ứng phóng to theo con trỏ chỉ dành cho thiết bị có chuột thật.
  Trên cảm ứng, chạm vào thẻ sẽ kích :hover và dính ở đó: thẻ tự co giãn,
  cú chạm bị nuốt mất nên không mở được trang.
*/
@media (hover: hover) and (pointer: fine) {
    /* (2) */
    .intro-page__cards:hover .intro-card.is-featured {
        width: var(--intro-card-w);
        height: var(--intro-card-h);
        border-color: transparent;
    }

    .intro-page__cards:hover .intro-card.is-featured .intro-card__img {
        filter: grayscale(1);
    }

    .intro-page__cards:hover .intro-card.is-featured .intro-card__caption {
        display: none;
    }

    .intro-page__cards:hover .intro-card.is-featured + .intro-card__label {
        display: block;
    }

    /* (3) */
    .intro-page__cards:hover .intro-card:hover {
        width: var(--intro-card-w-active);
        height: var(--intro-card-h-active);
        border-color: rgba(255, 224, 174, 0.50);
    }

    .intro-page__cards:hover .intro-card:hover .intro-card__img {
        filter: none;
    }

    .intro-page__cards:hover .intro-card:hover .intro-card__caption {
        display: block;
    }

    .intro-page__cards:hover .intro-card:hover + .intro-card__label {
        display: none;
    }
}

/* --- chân trang --- */
.intro-page__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    box-sizing: border-box;
    padding: 16px var(--intro-side);
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    color: #FFF;
    font-family: Arial;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.2px;
}

.intro-page__foot span {
    min-width: 0;
}

.intro-page__license {
    text-align: right;
}

.intro-page__foot strong {
    font-weight: 700;
}

/* --- màn nhỏ dần --- */
@media (max-width: 1599px) {
    .intro-page {
        --intro-card-w: 320px;
        --intro-card-h: 404px;
        --intro-card-w-active: 395px;
        --intro-card-h-active: 505px;
        --intro-card-gap: 36px;
        --intro-side: 80px;
        --intro-foot-gap: 100px;
    }

    .intro-card__caption {
        padding: 14px 20px;
    }

    .intro-card__caption-title {
        font-size: 26px;
    }

    .intro-card__caption-desc {
        font-size: 18px;
    }
}

@media (max-width: 1199px) {
    .intro-page {
        --intro-card-w: 236px;
        --intro-card-h: 298px;
        --intro-card-w-active: 292px;
        --intro-card-h-active: 373px;
        --intro-card-gap: 24px;
        --intro-side: 40px;
        --intro-foot-gap: 70px;
    }

    .intro-page__title {
        font-size: 34px;
    }

    .intro-page__desc {
        font-size: 16px;
        line-height: 24px;
    }

    .intro-card__caption {
        padding: 12px 16px;
    }

    .intro-card__caption-title {
        font-size: 22px;
    }

    .intro-card__caption-desc {
        font-size: 16px;
    }

    .intro-card__label {
        font-size: 16px;
    }
}

/* Từ đây trở xuống xếp thẻ theo cột: 3 thẻ nằm ngang không còn đủ chỗ,
   và thiết bị cảm ứng không có hover nên mọi thẻ đều hiển thị đầy đủ. */
@media (max-width: 991px) {
    .intro-page {
        --intro-side: 15px;
        --intro-foot-gap: 40px;
    }

    .intro-page__inner {
        min-height: 0;
    }

    .intro-page__head {
        padding-top: 24px;
    }

    .intro-page__title {
        font-size: 26px;
        letter-spacing: 0.26px;
    }

    .intro-page__desc {
        font-size: 15px;
        line-height: 23px;
        letter-spacing: 0.3px;
    }

    .intro-page__cards {
        flex-direction: column;
        gap: 24px;
        padding: 28px 15px var(--intro-foot-gap);
        min-height: 0;
    }

    .intro-page__cell {
        width: 100%;
        max-width: 420px;
    }

    /* trên màn nhỏ tất cả thẻ đều hiển thị như thẻ được chọn */
    .intro-card,
    .intro-card.is-featured,
    .intro-page__cards:hover .intro-card.is-featured {
        width: 100%;
        height: auto;
        aspect-ratio: 469 / 600;
        border-color: rgba(255, 224, 174, 0.50);
    }

    .intro-card__img,
    .intro-page__cards:hover .intro-card.is-featured .intro-card__img {
        filter: none;
    }

    .intro-card__caption,
    .intro-page__cards:hover .intro-card.is-featured .intro-card__caption {
        display: block;
    }

    .intro-card__label,
    .intro-page__cards:hover .intro-card.is-featured + .intro-card__label {
        display: none;
    }

    .intro-page__foot {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        padding: 14px 15px;
        font-size: 13px;
        line-height: 20px;
    }

    .intro-page__license {
        text-align: left;
    }
}

/* ==========================================================================
   Cụm nút nổi bên phải màn hình — in ở wp_footer nên có ở mọi trang
   (xem sbb_quick_dock() trong functions.php)
   ========================================================================== */
.sbb-dock {
    position: fixed;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    /* dưới modal của bootstrap (1050) để không che popup đặt lịch có sẵn */
    z-index: 1030;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 12px;
    border-radius: 20px;
    /* Kính trắng như thiết kế, nhưng đục 0.45 thay vì 0.20.
       Chữ #0F172A là chữ tối, nên nền dock phải luôn sáng — kể cả khi cụm nút
       trôi qua banner/video tối. Đo với nền tối nhất trên site (#103051):
         0.20 -> 2.47:1   0.30 -> 3.39:1   0.40 -> 4.56:1   0.45 -> 5.25:1
       WCAG cần tối thiểu 4.5:1, chọn 0.45 để còn biên an toàn.
       Trên nền trắng kính trắng thành gần trắng -> 17.85:1.
       Viền và bóng dùng màu tối (không phải trắng) để trên nền trắng vẫn
       thấy được đường bao của khung. */
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.45);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    box-shadow: 0 8px 24px rgba(16, 48, 81, 0.12);
}

.sbb-dock__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 52px;
    text-decoration: none;
}

.sbb-dock__icon {
    box-sizing: border-box;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 100px;
    border: 1px solid #FFE6BE;
    background: linear-gradient(180deg, #CFB36C 0%, #A78749 100%);
    transition: transform .25s ease, box-shadow .25s ease;
}

.sbb-dock__icon svg {
    display: block;
    width: 24px;
    height: 24px;
}

.sbb-dock__label {
    color: #0F172A;
    text-align: center;
    font-family: Arial;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.sbb-dock__link:hover .sbb-dock__icon {
    transform: scale(1.06);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}

/* quan.css dòng 6 có a:hover { color: #BB9067 !important } áp cho toàn site,
   nên phải !important ở đây mới giữ được màu chữ khi hover. */
.sbb-dock__link:hover .sbb-dock__label {
    color: #0F172A !important;
}

@media (max-width: 991px) {
    .sbb-dock {
        gap: 12px;
        padding: 10px;
        border-radius: 16px;
    }

    .sbb-dock__link {
        width: 56px;
        gap: 6px;
    }

    .sbb-dock__icon {
        width: 52px;
        height: 52px;
    }

    .sbb-dock__icon svg {
        width: 22px;
        height: 22px;
    }

    .sbb-dock__label {
        font-size: 11px;
    }
}

/* ==========================================================================
   Chân trang (footer.php) — prefix sbb-ft
   Cố tình không dùng lại class .footer / .footer_lastc cũ: css của chúng nằm rải
   ở style.css, footer.css, main.css và updatecss.css, ghi đè lại sẽ rất khó lần.
   ========================================================================== */
.sbb-ft {
  position: relative;
  background: url("../image/bg-footer.png") #294664 50% / cover no-repeat;
  font-family: Arial, sans-serif;
}

.sbb-ft__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: 1344px;
  margin: 0 auto;
  padding: 40px 15px 40px;
}

/* --- hàng trên: logo + 2 ô liên hệ --- */
.sbb-ft__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.sbb-ft__logo {
  display: block;
  flex: 0 0 auto;
}

.sbb-ft__logo img {
  display: block;
  width: 280px;
  height: 67px;
  max-width: 100%;
  object-fit: contain;
}

.sbb-ft__pills {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.sbb-ft__pill {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px;
  border-radius: 60px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: rgba(255, 255, 255, 0.10);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
  text-decoration: none;
}

.sbb-ft__pill-icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 100px;
  background: linear-gradient(180deg, #F6CB84 0%, #A78749 100%);
}

.sbb-ft__pill-icon svg {
  display: block;
  width: 28px;
  height: 28px;
}

.sbb-ft__pill-body {
  display: flex;
  flex-direction: column;
  padding-right: 14px;
  align-items: flex-start;
}

.sbb-ft__pill-label {
  color: #CAD5E2;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.sbb-ft__pill-value {
  color: #FFF;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.4px;
}

/* quan.css dòng 6 có a:hover { color: #BB9067 !important } cho toàn site */
.sbb-ft__pill:hover .sbb-ft__pill-label {
  color: #CAD5E2 !important;
}

.sbb-ft__pill:hover .sbb-ft__pill-value {
  color: #FFF !important;
}

/* --- đường kẻ ngăn cách --- */
.sbb-ft__divider {
  height: 0;
  margin: 40px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.20);
}

/* --- 4 cột --- */
.sbb-ft__cols {
  display: flex;
  align-items: flex-start;
  gap: 30px;
}

.sbb-ft__col {
  min-width: 0;
}

.sbb-ft__col--info {
  flex: 1 1 340px;
}

.sbb-ft__col--menu {
  flex: 0 0 auto;
}

.sbb-ft__col--menu:last-child {
  margin-left: auto;
}

.sbb-ft__brand {
  margin: 0 0 20px;
  color: #FFF;
  font-family: Arial;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.48px;
  text-transform: uppercase;
}

.sbb-ft__row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 12px;
}

.sbb-ft__row-icon {
  flex: 0 0 auto;
  display: block;
  /* căn icon 24px vào giữa dòng chữ line-height 28px */
  margin-top: 2px;
}

.sbb-ft__row-icon svg {
  display: block;
  width: 24px;
  height: 24px;
}

.sbb-ft__row-body {
  display: block;
  min-width: 0;
}

.sbb-ft__row-label {
  display: block;
  color: #FFF;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.sbb-ft__row-value {
  display: block;
  color: #F6CB84;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.sbb-ft__address {
  display: block;
  min-width: 0;
  color: #C0CFC8;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

/* --- mạng xã hội --- */
.sbb-ft__social {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}

.sbb-ft__social-link {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 18px;
  border: 1px solid rgba(203, 213, 225, 0.20);
  background: #294664;
  transition: background .2s ease, border-color .2s ease;
}

.sbb-ft__social-link svg {
  display: block;
  width: 22px;
  height: 22px;
}

.sbb-ft__social-link:hover {
  border-color: rgba(246, 203, 132, 0.60);
  background: #30649E;
}

/* --- 3 cột menu --- */
.sbb-ft__col-title {
  margin: 0 0 20px;
  color: #CFB36C;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.sbb-ft__menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sbb-ft__menu li + li {
  margin-top: 14px;
}

/*
  Figma ghi justify-content: center cho ô link, nhưng đó là hệ quả của auto-layout
  bên Figma — trong ảnh thiết kế chữ vẫn căn trái thẳng cột với tiêu đề, nên dùng
  flex-start. Bề rộng 190px giữ đúng theo spec.
*/
.sbb-ft__menu-link {
  display: flex;
  width: 190px;
  max-width: 100%;
  padding: 1px 0;
  justify-content: flex-start;
  align-items: center;
  color: #CAD5E2;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  text-decoration: none;
  transition: color .2s ease;
}

.sbb-ft__menu-link:hover {
  color: #F6CB84 !important;
}

/* --- 2 ô chữ nhỏ về giấy phép --- */
.sbb-ft__legal {
  display: flex;
  align-items: stretch;
  gap: 8px;
  margin-top: 30px;
}

.sbb-ft__legal-box {
  box-sizing: border-box;
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  padding: 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #CAD5E2;
  font-family: Arial;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

/* --- dải chữ dưới cùng --- */
.sbb-ft__bottom {
  padding: 13px 15px;
  background: linear-gradient(90deg, #A78749 0%, #F6CB84 100%);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.sbb-ft__bottom p {
  margin: 0;
  color: #FFF;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

/* --- màn nhỏ --- */
@media (max-width: 1199px) {
  .sbb-ft__cols {
    flex-wrap: wrap;
    gap: 30px 24px;
  }

  .sbb-ft__col--info {
    flex: 1 1 100%;
  }

  .sbb-ft__col--menu {
    flex: 1 1 200px;
  }

  .sbb-ft__col--menu:last-child {
    margin-left: 0;
  }

  .sbb-ft__menu-link {
    width: auto;
  }
}

@media (max-width: 991px) {
  .sbb-ft__inner {
    padding: 30px 15px;
  }

  .sbb-ft__top {
    justify-content: center;
    text-align: center;
  }

  .sbb-ft__pills {
    justify-content: center;
  }

  .sbb-ft__divider {
    margin: 30px 0;
  }

  .sbb-ft__legal {
    flex-direction: column;
  }
}

@media (max-width: 575px) {
  .sbb-ft__logo img {
    width: 220px;
    height: 53px;
  }

  .sbb-ft__pill {
    width: 100%;
  }

  .sbb-ft__pill-value {
    font-size: 18px;
  }

  .sbb-ft__col--menu {
    flex: 1 1 100%;
  }

  .sbb-ft__brand {
    font-size: 20px;
  }

  .sbb-ft__bottom p {
    font-size: 14px;
    line-height: 22px;
  }
}

/* ==========================================================================
   Trang Liên hệ — các ô thông tin (template/contact.php)
   ========================================================================== */
.lh-boxes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin: 48px 0;
}

.lh-box {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 24px;
  border-radius: 12px;
  border: 1px solid rgba(207, 179, 108, 0.16);
  background: #FFFCF8;
}

.lh-box__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #CFB36C;
}

.lh-box__icon svg {
  display: block;
  width: 24px;
  height: 24px;
}

.lh-box__title {
  margin: 0;
  color: #103051;
  text-align: center;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.28px;
  text-transform: uppercase;
}

.lh-box__desc {
  margin: 0;
  color: #103051;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}

/* dòng giờ mở cửa in đậm — nhập bằng thẻ <strong> trong ô Nội dung của ACF */
.lh-box__desc strong {
  font-weight: 700;
}

@media (max-width: 991px) {
  .lh-boxes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 32px 0;
  }
}

@media (max-width: 575px) {
  .lh-boxes {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ==========================================================================
   Container riêng cho trang Liên hệ và trang Đội ngũ y khoa
   Bootstrap đặt max-width theo bậc (540/720/960/1140/1320), nên ở màn 768px
   nội dung chỉ rộng 720px và thừa lề hai bên rất lớn. Hai trang này chỉ cần
   chặn ở 1320px, còn lại tràn hết bề ngang với 15px mỗi bên.
   ========================================================================== */
.page_contact .container,
.q_page_dnbs .container {
  box-sizing: border-box;
  width: 100%;
  max-width: 1344px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

/* ==========================================================================
   Trang Liên hệ — khối "Liên hệ với chúng tôi" + form tư vấn (Contact Form 7)
   ========================================================================== */
.cta {
  padding: 96px 0;
  background: #F8FAFC;
}

.cta__head {
  margin-bottom: 56px;
  text-align: center;
}

.cta__title {
  margin: 0 0 12px;
  color: #103051;
  text-align: center;
  font-family: Arial;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.72px;
  text-transform: uppercase;
}

.cta__desc {
  margin: 0 auto;
  max-width: 720px;
  color: #0F172B;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.cta__body {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 48px;
}

/* --- cột ảnh --- */
.cta__media {
  position: relative;
  flex: 0 0 auto;
  width: 632px;
  max-width: 100%;
  /* 2 thẻ nổi tràn ra ngoài mép ảnh (-41px / -20px) nên không được cắt */
}

.cta__image {
  display: block;
  width: 100%;
  height: 603px;
  max-width: 100%;
  border-radius: 24px;
  object-fit: cover;
}

/* Lớp phủ tối dần từ đáy ảnh. Phải là pseudo-element chứ không đặt thẳng lên
   <img> được, vì background của thẻ img nằm DƯỚI nội dung ảnh.
   z-index mặc định 0, còn 2 thẻ nổi có z-index 1 nên vẫn nằm trên. */
.cta__media::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  background: linear-gradient(0deg,
              rgba(7, 22, 41, 0.50) 0%,
              rgba(7, 22, 41, 0.00) 50%,
              rgba(0, 0, 0, 0.00) 50%,
              rgba(0, 0, 0, 0.00) 100%);
  pointer-events: none;
}

/* chưa up ảnh thì không phủ gì cả */
.cta__media:not(:has(.cta__image))::after {
  display: none;
}

.cta__badge {
  position: absolute;
  z-index: 1;
}

.cta__badge--stat {
  right: -20px;
  top: 52.5px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 20px;
  border-radius: 16px;
  background: linear-gradient(135deg, #30649E 0%, #314158 100%);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.10), 0 8px 10px -6px rgba(0, 0, 0, 0.10);
}

.cta__badge-num {
  color: #FFF;
  font-family: Arial;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: 30px;
}

.cta__badge-text {
  color: #CAD5E2;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

.cta__badge--cert {
  left: -41px;
  bottom: 111.5px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 16px;
  background: #FFF;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.cta__badge-icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #FFE6BE;
}

.cta__badge-icon svg {
  display: block;
  width: 20px;
  height: 20px;
}

.cta__badge-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cta__badge-title {
  color: #0F172B;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 17.5px;
}

.cta__badge-sub {
  color: #4B4B4B;
  font-family: Arial;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

/* --- thẻ form --- */
.cta__card {
  box-sizing: border-box;
  flex: 1 1 0;
  min-width: 0;
  max-width: 630px;
  padding: 40px;
  border-radius: 24px;
  border: 1px solid #F1F5F9;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.cta__card-title {
  margin: 0 0 24px;
  color: #0F172B;
  font-family: Arial;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
}

.cta__card-note {
  margin: 12px 0 0;
  color: #45556C;
  text-align: center;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

/*
  Contact Form 7 tự bọc mỗi ô bằng <span class="wpcf7-form-control-wrap">, và
  quan.css/style.css có sẵn rule cho .wpcf7-form-control ở form khác. Vì vậy các
  rule dưới đây đều bám vào .cta__card để chỉ ảnh hưởng đúng khối này.
*/
.cta__card .wpcf7 form .wpcf7-response-output {
  margin: 16px 0 0;
  padding: 10px 14px;
  border-radius: 12px;
  font-family: Arial;
  font-size: 14px;
  line-height: 20px;
}

.cta__card .cta-form__row {
  display: flex;
  gap: 18px;
}

.cta__card .cta-form__row .cta-form__field {
  flex: 1 1 0;
  min-width: 0;
}

.cta__card .cta-form__field {
  margin: 0 0 18px;
}

.cta__card .cta-form__label {
  display: block;
  margin-bottom: 6px;
  color: #314158;
  font-family: Arial;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.cta__card .cta-form__req {
  color: #E7000B;
}

.cta__card .wpcf7-form-control-wrap {
  display: block;
}

.cta__card .cta-form__control {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid #E2E8F0;
  background: #F8FAFC;
  color: #0F172B;
  font-family: Arial;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.cta__card .cta-form__control::placeholder {
  color: #62748E;
  opacity: 1;
}

.cta__card .cta-form__control:focus {
  outline: none;
  border-color: #30649E;
}

/* mũi tên của thẻ select vẽ bằng nền, để bỏ giao diện mặc định của trình duyệt */
.cta__card .cta-form__select {
  height: 46px;
  padding-right: 40px;
  color: #62748E;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%2362748E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
}

.cta__card .cta-form__textarea {
  height: 96px;
  resize: vertical;
}

.cta__card .cta-form__actions {
  margin: 28px 0 0;
}

.cta__card .cta-form__submit {
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 58px;
  padding: 10px 20px;
  border-radius: 60px;
  border: 1.4px solid #FFF;
  background: linear-gradient(83deg, #1A3568 3.99%, #30649E 100%);
  color: #FFF;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.16px;
  cursor: pointer;
  transition: filter .2s ease;
}

.cta__card .cta-form__submit:hover {
  filter: brightness(1.08);
}

/* vòng quay chờ của CF7 nằm ngay sau nút, tách ra cho khỏi đội chiều cao */
.cta__card .wpcf7-spinner {
  display: block;
  margin: 12px auto 0;
}

/* --- màn nhỏ --- */
@media (max-width: 1399px) {
  .cta__media {
    width: 520px;
  }

  .cta__image {
    height: 520px;
  }

  .cta__badge--cert {
    left: -24px;
  }
}

@media (max-width: 1199px) {
  .cta {
    padding: 64px 0;
  }

  .cta__body {
    flex-direction: column;
    gap: 32px;
  }

  .cta__media,
  .cta__card {
    width: 100%;
    max-width: 632px;
  }

  .cta__image {
    height: auto;
    aspect-ratio: 632 / 603;
  }
}

@media (max-width: 767px) {
  .cta {
    padding: 48px 0;
  }

  .cta__head {
    margin-bottom: 32px;
  }

  .cta__title {
    font-size: 26px;
    letter-spacing: 0.52px;
  }

  .cta__card {
    padding: 24px 20px;
  }

  .cta__card-title {
    font-size: 20px;
    line-height: 28px;
  }

  .cta__card .cta-form__row {
    flex-direction: column;
    gap: 0;
  }

  /* 2 thẻ nổi thụt vào trong ảnh, tràn ra ngoài sẽ bị màn hình cắt mất */
  .cta__badge--stat {
    right: 8px;
    top: 16px;
  }

  .cta__badge--cert {
    left: 8px;
    bottom: 16px;
  }

  .cta__badge-num {
    font-size: 24px;
    line-height: 24px;
  }
}

/* --- Trang Liên hệ: khối bản đồ --- */
.clinic-map {
  padding: 96px 0;
}

.clinic-map__title {
  margin: 0 0 32px;
  color: #103051;
  text-align: center;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.84px;
  text-transform: uppercase;
}

.clinic-map__frame {
  overflow: hidden;
  border-radius: 16px;
  line-height: 0;
}

/* Iframe của Google Maps mang sẵn width/height trong thuộc tính html,
   phải ép lại bằng css mới chiếm đủ bề ngang. */
.clinic-map__frame iframe {
  display: block;
  width: 100%;
  height: 400px;
  border: 0;
}

@media (max-width: 991px) {
  .clinic-map {
    padding: 48px 0;
  }

  .clinic-map__title {
    margin-bottom: 24px;
    font-size: 28px;
    letter-spacing: 0.56px;
  }

  .clinic-map__frame iframe {
    height: 300px;
  }
}

/* ==========================================================================
   Trang Tin tức (template/news.php) — các khối chia theo danh mục
   Lưới 3 ô dùng lại .disease-related__grid / .disease-card của trang bệnh lý.
   ========================================================================== */
.news-sec {
  padding: 56px 0;
  background: #FFF;
}

/* nền xen kẽ: khối chẵn trắng, khối lẻ xanh nhạt */
.news-sec--alt {
  background: #F4F7FB;
}

.news-sec__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 40px;
}

.news-sec__heading {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.news-sec__title {
  margin: 0;
  color: #103051;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.84px;
  text-transform: uppercase;
}

.news-sec__desc {
  margin: 0;
  color: #4B4B4B;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.news-sec__more {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #C5A059;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
}

.news-sec__more:hover {
  color: #916819 !important;
}

/* thiết kế cho ô ngày tháng nét 400, khác .disease-badge--solid vốn là 700 */
.news-sec .disease-badge--solid {
  font-weight: 400;
}

/* --- kiểu "1 bài lớn + 3 bài nhỏ" --- */
.news-feat {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 624px);
  align-items: stretch;
  gap: 24px;
}

/* chỉ có đúng 1 bài thì bài lớn chiếm trọn bề ngang */
.news-feat--solo {
  grid-template-columns: minmax(0, 1fr);
}

.news-feat__lead {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 511px;
  border-radius: 20px;
  overflow: hidden;
  background: #071428;
  text-decoration: none;
}

.news-feat__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* lớp phủ tối dần lên trên để chữ trắng luôn đọc được, bất kể ảnh sáng hay tối */
.news-feat__lead::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg,
              rgba(7, 20, 40, 0.90) 0%,
              rgba(7, 20, 40, 0.30) 50%,
              rgba(7, 20, 40, 0.00) 100%);
  pointer-events: none;
}

.news-feat__body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px;
}

.news-feat__badges,
.news-mini__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.news-feat__title {
  color: #FFF;
  font-family: Arial;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 33px;
}

.news-feat__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #C5A059;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.news-feat__lead:hover .news-feat__title {
  color: #FFF !important;
}

/* --- cột 3 bài nhỏ --- */
.news-feat__list {
  display: flex;
  flex-direction: column;
  gap: 17px;
  min-width: 0;
}

.news-mini {
  box-sizing: border-box;
  flex: 1 1 0;
  display: flex;
  align-items: center;
  gap: 24px;
  min-width: 0;
  padding: 16px 12px;
  border-radius: 20px;
  border: 1px solid #EAEAEA;
  background: #FFFCF8;
  text-decoration: none;
  transition: box-shadow .2s ease;
}

.news-mini:hover {
  box-shadow: 0 12px 24px -12px rgba(41, 70, 100, .25);
}

.news-mini__thumb {
  flex: 0 0 200px;
  display: block;
  width: 200px;
  height: 127px;
  border-radius: 10px;
  background: #EEF2F7;
  overflow: hidden;
}

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

.news-mini__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

.news-mini__title {
  color: #0F172A;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
  transition: color .2s ease;
}

.news-mini:hover .news-mini__title {
  color: #916819 !important;
}

/* --- màn nhỏ --- */
@media (max-width: 1199px) {
  .news-sec__title {
    font-size: 32px;
    letter-spacing: 0.64px;
  }

  .news-feat {
    grid-template-columns: minmax(0, 1fr);
  }

  .news-feat__lead {
    min-height: 360px;
  }

  .news-mini__thumb {
    flex-basis: 160px;
    width: 160px;
    height: 102px;
  }

  .news-mini {
    gap: 16px;
  }

  .disease-related__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .news-sec {
    padding: 40px 0;
  }

  .news-sec__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 24px;
  }

  .news-sec__title {
    font-size: 26px;
    letter-spacing: 0.52px;
  }

  .news-sec__desc {
    font-size: 16px;
  }

  .news-feat__lead {
    min-height: 300px;
  }

  .news-feat__title {
    font-size: 20px;
    line-height: 28px;
  }

  /* ảnh 200px + chữ không đủ chỗ trên màn hẹp, xếp dọc lại */
  .news-mini {
    flex-direction: column;
    align-items: stretch;
  }

  .news-mini__thumb {
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    aspect-ratio: 200 / 127;
  }

  .disease-related__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* --- Trang danh mục: phân trang + trạng thái rỗng --- */
.news-pagi {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 40px;
}

.news-pagi .page-numbers {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 60px;
  border: 1px solid #EAEAEA;
  background: #FFF;
  color: #103051;
  font-family: Arial;
  font-size: 15px;
  font-weight: 400;
  line-height: normal;
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}

.news-pagi a.page-numbers:hover {
  border-color: #C5A059;
  color: #916819 !important;
}

.news-pagi .page-numbers.current {
  border-color: #C5A059;
  background: #C5A059;
  color: #FFF;
  font-weight: 700;
}

.news-pagi .page-numbers.dots {
  border-color: transparent;
  background: none;
}

.news-empty {
  margin: 0;
  padding: 40px 0;
  color: #4B4B4B;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  line-height: 26px;
}

/* ==========================================================================
   Trang Đội ngũ y khoa (template/page-team.php)
   ========================================================================== */
.team-sec {
  padding: 56px 0;
}

.team-sec__head {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 40px;
  text-align: center;
}

.team-sec__title {
  margin: 0;
  color: #103051;
  text-align: center;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.84px;
  text-transform: uppercase;
}

.team-sec__desc {
  margin: 0 auto;
  max-width: 1000px;
  color: #0F172B;
  text-align: center;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 40px 24px;
}

.team-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.team-card__photo {
  height: 464px;
  margin-bottom: 18px;
  overflow: hidden;
  background: #EEF2F7;
}

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

.team-card__name {
  margin: 0;
  color: #0F172B;
  text-align: center;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.team-card__dept {
  margin: 4px 0 0;
  color: #A78749;
  text-align: center;
  font-family: Arial;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.team-card__desc {
  margin: 18px 0 0;
  color: #4B4B4B;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

@media (max-width: 1199px) {
  .team-sec__title {
    font-size: 32px;
    letter-spacing: 0.64px;
  }

  .team-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .team-card__photo {
    height: 380px;
  }
}

@media (max-width: 767px) {
  .team-sec {
    padding: 40px 0;
  }

  .team-sec__title {
    font-size: 26px;
    letter-spacing: 0.52px;
  }

  .team-sec__desc {
    font-size: 16px;
    line-height: 24px;
  }

  .team-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 16px;
  }

  /* chiều cao cố định 464px quá cao so với cột hẹp, chuyển sang giữ tỉ lệ */
  .team-card__photo {
    height: auto;
    aspect-ratio: 303 / 464;
  }
}

@media (max-width: 479px) {
  .team-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* --- 3 page gói khám SBB: container 1344px, lề 15px như trang Liên hệ --- */
.q_sbb_corporate .container,
.q_sbb_premium .container,
.q_sbb_basic .container {
  box-sizing: border-box;
  width: 100%;
  max-width: 1344px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

/* SBB Premium: khối đầu trang là video do ACF quản lý. */
.q_sbb_premium .premium-video-hero {
  width: 100%;
  overflow: hidden;
  background: #103051;
}

.q_sbb_premium .premium-video-hero__media {
  display: block;
  width: 100%;
  max-height: min(56.25vw, 960px);
  object-fit: cover;
}

.q_sbb_premium .premium-page-content {
  padding-top: 0;
  padding-bottom: 0;
}

.q_sbb_premium .premium-specialties {
  padding: 100px 0;
  background-color: #fff;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_premium .premium-specialties__head {
  display: flex;
  max-width: 850px;
  margin: 0 auto 42px;
  flex-direction: column;
  gap: 16px;
  text-align: center;
  box-shadow: none;
  max-width: 640px;
}

.q_sbb_premium .premium-specialties__head h2 {
  margin: 0;
  color: #a78749;
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: 54px;
  letter-spacing: .84px;
  text-transform: uppercase;
}

.q_sbb_premium .premium-specialties__head p {
  margin: 0;
  color: #0f172b;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.q_sbb_premium .premium-specialties__carousel {
  position: relative;
}

/*
  Nút chỉ hiện khi số thẻ vượt quá một khung. Class do js gắn sau khi đo
  scrollWidth, nên 3 thẻ vừa đủ 3 cột thì không có nút thừa.
*/
.q_sbb_premium .premium-specialties__arrow {
  display: none;
}

.q_sbb_premium .premium-specialties__carousel.is-scrollable .premium-specialties__arrow {
  display: inline-flex;
}

.q_sbb_premium .premium-specialties__viewport {
  overflow-x: auto;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}

.q_sbb_premium .premium-specialties__viewport::-webkit-scrollbar { display: none; }

.q_sbb_premium .premium-specialties__track {
  display: flex;
  gap: 24px;
}

.q_sbb_premium .premium-specialties__slide {
  width: calc((100% - 48px) / 3);
  min-width: calc((100% - 48px) / 3);
  scroll-snap-align: start;
}

.q_sbb_premium .premium-service-card { height: 100%; }

.q_sbb_premium .premium-service-card .disease-card__thumb { position: relative; }

.q_sbb_premium .premium-service-card__icon {
  position: absolute;
  top: 11px;
  left: 11px;
  display: inline-flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #f9f5eb;
}

.q_sbb_premium .premium-service-card__icon img {
  display: block;
  width: 34px;
  height: 34px;
}

.q_sbb_premium .premium-service-card__desc {
  margin: -6px 0 16px;
  color: #4b4b4b;
  text-align: justify;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: -.5px;
}

.q_sbb_premium .premium-specialties__arrow {
  position: absolute;
  z-index: 2;
  top: 50%;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease, opacity .2s ease;
}

.q_sbb_premium .premium-specialties__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_premium .premium-specialties__arrow:hover { background: #8f6e2e; }

.q_sbb_premium .premium-specialties__arrow:disabled {
  opacity: .35;
  cursor: default;
}

.q_sbb_premium .premium-specialties__arrow:disabled:hover { background: #b49753; }

/* dịch ra nửa nút để nó nằm đè đúng nửa mép thẻ ngoài cùng */
.q_sbb_premium .premium-specialties__arrow--prev {
  left: 0;
  transform: translate(-50%, -50%);
}

.q_sbb_premium .premium-specialties__arrow--next {
  right: 0;
  transform: translate(50%, -50%);
}

@media (max-width: 1199.98px) {
  .q_sbb_premium .premium-specialties { padding: 80px 0; }
  .q_sbb_premium .premium-specialties .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_premium .premium-specialties__head h2 { font-size: 34px; line-height: 44px; }
  .q_sbb_premium .premium-specialties__slide {
    width: calc((100% - 24px) / 2);
    min-width: calc((100% - 24px) / 2);
  }
}

@media (max-width: 767px) {
  .q_sbb_premium .premium-video-hero__media {
    min-height: 220px;
    max-height: none;
    object-fit: cover;
  }

  .q_sbb_premium .premium-specialties { padding: 56px 0; }
  .q_sbb_premium .premium-specialties__head { margin-bottom: 32px; }
  .q_sbb_premium .premium-specialties__head h2 { font-size: 28px; line-height: 36px; letter-spacing: .56px; }
  .q_sbb_premium .premium-specialties__head p { font-size: 16px; line-height: 24px; }
  .q_sbb_premium .premium-specialties__track { gap: 16px; }
  .q_sbb_premium .premium-specialties__slide { width: 100%; min-width: 100%; }
  .q_sbb_premium .premium-specialties__arrow { width: 34px; height: 34px; }
  .q_sbb_premium .premium-specialties__arrow svg { width: 17px; height: 17px; }
  .q_sbb_premium .premium-specialties .container {
    padding-right: 28px;
    padding-left: 28px;
  }
}

/* ==========================================================================
   Trang SBB Basic (template/page-sbb-basic.php)
   Banner dạng carousel: cột trái đổi theo banner, cột phải (form) cố định.
   ========================================================================== */
.bs-page .container {
  box-sizing: border-box;
  width: 100%;
  max-width: 1344px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

.bs-hero {
  position: relative;
  /* z-index: 0 để tạo stacking context riêng — nhờ đó ảnh nền dùng được
     z-index: -1 mà không tụt xuống dưới nền trang, và các khối bên trong không
     cần position, để .bs-nav neo thẳng vào .bs-hero (rộng hết bề ngang). */
  z-index: 0;
  padding: 81px 0 82px;
  overflow: hidden;
}

/* --- ảnh nền xếp lớp, chuyển mờ khi đổi banner --- */
.bs-hero__bgs {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.bs-hero__bg {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity .5s ease;
}

.bs-hero__bg.is-active {
  opacity: 1;
}

.bs-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 590px);
  align-items: center;
  gap: 40px;
}

.bs-hero__left {
  min-width: 0;
}

/* --- nút điều hướng dọc ở mép trái --- */
.bs-nav {
  position: absolute;
  top: 50%;
  left: 24px;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.bs-nav__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: linear-gradient(270deg, #CFB36C 0%, #A78749 100%);
  cursor: pointer;
  transition: filter .2s ease, transform .2s ease;
}

.bs-nav__btn:hover {
  filter: brightness(1.12);
  transform: scale(1.06);
}

.bs-nav__btn svg {
  display: block;
  width: 20px;
  height: 20px;
}

.bs-nav__dots {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.bs-nav__dot {
  width: 6px;
  height: 6px;
  padding: 0;
  border: none;
  border-radius: 60px;
  background: rgba(255, 255, 255, 0.40);
  cursor: pointer;
  transition: height .25s ease, background .25s ease;
}

.bs-nav__dot.is-active {
  height: 22px;
  background: #CFB36C;
}

/* --- các banner xếp chồng, chỉ hiện banner đang chọn --- */
.bs-slides {
  position: relative;
}

.bs-slide {
  display: none;
}

.bs-slide.is-active {
  display: block;
  animation: bs-fade .45s ease both;
}

@keyframes bs-fade {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

.bs-slide__badge {
  display: inline-flex;
  align-items: center;
  margin-bottom: 18px;
  padding: 4px 16px;
  border-radius: 33554400px;
  border: 1px solid rgba(99, 163, 234, 0.20);
  background: rgba(99, 163, 234, 0.10);
  color: #63A3EA;
  font-family: Arial;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.bs-slide__title {
  margin: 0;
}

.bs-slide__title-1,
.bs-slide__title-2 {
  display: block;
  font-family: Arial;
  font-size: 60px;
  font-style: normal;
  font-weight: 700;
  line-height: 77.76px;
  letter-spacing: -3px;
}

.bs-slide__title-1 {
  color: #FFF;
  letter-spacing: 1.5px;
}

.bs-slide__title-2 {
  color: #CFB36C;
}

.bs-slide__desc {
  margin: 23px 0 0;
  max-width: 619px;
  color: #CAD5E2;
  text-align: justify;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 29.25px;
}

.bs-slide__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 23px;
}

.bs-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  border-radius: 60px;
  color: #FFF;
  text-align: center;
  font-family: Arial;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-decoration: none;
  transition: background .25s ease, border-color .25s ease, filter .25s ease, transform .25s ease;
}

.bs-btn:hover {
  color: #FFF !important;
  transform: translateY(-2px);
}

.bs-btn--ghost {
  border: 1px solid #FFF;
  background: transparent;
}

.bs-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.16);
}

.bs-btn--gold {
  border: 1px solid rgba(187, 145, 103, 0.50);
  background: linear-gradient(270deg, #CFB36C 0%, #A78749 100%);
}

.bs-btn--gold:hover {
  filter: brightness(1.12);
}

/* --- số liệu --- */
.bs-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  margin-top: 56px;
}

.bs-stat {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.bs-stat__num {
  color: #FFF;
  font-family: Arial;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 2px;
}

.bs-stat__label {
  color: #CAD5E2;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

/* --- form đặt lịch (cột phải, cố định) --- */
.bs-form {
  box-sizing: border-box;
  padding: 40px;
  border-radius: 24px;
  border: 1px solid #F1F5F9;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.bs-form__title {
  margin: 0 0 28px;
  color: #0F172B;
  font-family: Arial;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
}

.bs-form__msg {
  margin: 0 0 16px;
  padding: 10px 14px;
  border-radius: 12px;
  font-family: Arial;
  font-size: 14px;
  line-height: 20px;
}

.bs-form__msg--ok {
  background: #ECFDF3;
  color: #067647;
}

.bs-form__msg--err {
  background: #FEF3F2;
  color: #B42318;
}

.bs-form__row {
  display: flex;
  gap: 18px;
}

.bs-form__row .bs-form__field {
  flex: 1 1 0;
  min-width: 0;
}

.bs-form__field {
  margin: 0 0 18px;
}

.bs-form__label {
  display: block;
  margin-bottom: 6px;
  color: #314158;
  font-family: Arial;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.bs-form__req {
  color: #E7000B;
}

.bs-form__control {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid #E2E8F0;
  background: #F8FAFC;
  color: #0F172B;
  font-family: Arial;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.bs-form__control::placeholder {
  color: #62748E;
  opacity: 1;
}

.bs-form__control:focus {
  outline: none;
  border-color: #30649E;
}

.bs-form__control--select {
  height: 46px;
  padding-right: 40px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%2362748E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
}

.bs-form__control--note {
  height: 96px;
  resize: vertical;
}

.bs-form__submit {
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 58px;
  margin-top: 10px;
  padding: 10px 20px;
  border-radius: 60px;
  border: none;
  background: #30649E;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
  color: #FFF;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.16px;
  cursor: pointer;
  transition: filter .2s ease;
}

.bs-form__submit:hover {
  filter: brightness(1.08);
}

.bs-form__note {
  margin: 32px 0 0;
  color: #45556C;
  text-align: center;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

/* --- màn nhỏ --- */
@media (max-width: 1499px) {
  /*
    Hết chỗ ở mép ngoài -> cụm nút trở thành một ô grid trải hết 2 cột, nằm
    hàng dưới và căn giữa theo cả trang. Dùng grid-row tường minh nên không
    phụ thuộc thứ tự trong DOM.
  */
  .bs-hero__left  { grid-row: 1; grid-column: 1; }
  .bs-hero__right { grid-row: 1; grid-column: 2; }

  .bs-nav {
    position: static;
    transform: none;
    grid-row: 2;
    grid-column: 1 / -1;
    flex-direction: row;
    justify-content: center;
  }

  .bs-nav__dots {
    flex-direction: row;
  }

  .bs-nav__dot.is-active {
    width: 22px;
    height: 6px;
  }

  /* nút nằm ngang thì mũi tên phải chỉ sang trái / phải, không còn lên / xuống */
  .bs-nav__btn svg {
    transform: rotate(-90deg);
  }
}

@media (max-width: 1199px) {
  .bs-hero__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
  }

  /* 1 cột: cụm nút nằm giữa cụm số liệu và form */
  .bs-hero__left  { grid-row: 1; grid-column: 1; }
  .bs-nav         { grid-row: 2; grid-column: 1; }
  .bs-hero__right { grid-row: 3; grid-column: 1; }

  .bs-slide__title-1,
  .bs-slide__title-2 {
    font-size: 40px;
    line-height: 52px;
  }
}

@media (max-width: 767px) {
  .bs-hero {
    padding: 40px 0;
  }

  .bs-slide__badge {
    font-size: 18px;
  }

  .bs-slide__title-1,
  .bs-slide__title-2 {
    font-size: 28px;
    line-height: 38px;
  }

  .bs-slide__desc {
    font-size: 16px;
    line-height: 26px;
  }

  .bs-stats {
    gap: 24px;
    margin-top: 32px;
  }

  .bs-stat__num {
    font-size: 32px;
  }

  .bs-form {
    padding: 20px;
  }

  .bs-form__row {
    flex-direction: column;
    gap: 0;
  }
}

/* --- SBB Basic: khối hướng dẫn chuẩn bị --- */
.bs-guide {
  padding: 96px 0;
  /*
    Header cố định cao 110px (.header-main position: fixed), nên khi nhảy tới
    neo #huong-dan phải chừa đúng khoảng đó, không thì tiêu đề bị header che.
    scroll-margin-top áp cho cả anchor thường lẫn scrollIntoView.
  */
  scroll-margin-top: 130px;
}

.bs-guide__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.bs-guide__copy {
  flex: 1 1 600px;
  max-width: 600px;
  min-width: 0;
}

.bs-guide__eyebrow {
  display: block;
  color: #30649E;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.bs-guide__title {
  margin: 12px 0 0;
  color: #0F172B;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.bs-guide__lead {
  margin-top: 40px;
}

.bs-guide__lead strong,
.bs-guide__lead span {
  display: block;
  color: #0F172B;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  line-height: 26px;
}

.bs-guide__lead strong {
  font-weight: 700;
}

.bs-guide__lead span {
  font-weight: 400;
}

.bs-guide__steps {
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.bs-step {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.bs-step + .bs-step {
  margin-top: 20px;
}

.bs-step__num {
  box-sizing: border-box;
  flex: 0 0 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  border: 1px solid rgba(48, 100, 158, 0.20);
  background: rgba(48, 100, 158, 0.10);
  color: #30649E;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.bs-step__body {
  min-width: 0;
}

.bs-step__title {
  display: block;
  color: #0F172B;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 25.5px;
}

.bs-step__desc {
  display: block;
  color: #45556C;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.bs-guide__media {
  flex: 0 1 580px;
  max-width: 580px;
  min-width: 0;
}

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

@media (max-width: 1199px) {
  .bs-guide {
    padding: 64px 0;
  }

  .bs-guide__title {
    font-size: 32px;
    line-height: 40px;
    letter-spacing: 1.5px;
  }
}

@media (max-width: 991px) {
  /* 600px + 580px không còn đủ chỗ, xếp dọc và đưa ảnh xuống dưới */
  .bs-guide__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 32px;
  }

  .bs-guide__copy,
  .bs-guide__media {
    flex: 1 1 auto;
    max-width: 100%;
  }

  .bs-guide__media {
    order: 2;
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .bs-guide {
    padding: 40px 0;
    scroll-margin-top: 80px;
  }

  .bs-guide__title {
    font-size: 26px;
    line-height: 34px;
    letter-spacing: 1px;
  }

  .bs-guide__lead strong,
  .bs-guide__lead span {
    font-size: 17px;
    line-height: 24px;
  }

  .bs-step__num {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 17px;
  }

  .bs-step {
    gap: 14px;
  }

  .bs-step__title {
    font-size: 17px;
    line-height: 23px;
  }

  .bs-step__desc {
    font-size: 16px;
    line-height: 25px;
  }
}

/* --- SBB Basic: khối ảnh trái + danh sách lưu ý --- */
.bs-note {
  padding: 96px 0;
  background: #F8FAFC;
}

.bs-note__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.bs-note__media {
  flex: 0 1 560px;
  max-width: 560px;
  min-width: 0;
}

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

.bs-note__copy {
  flex: 1 1 600px;
  max-width: 600px;
  min-width: 0;
}

/* nhãn nhỏ và tiêu đề dùng lại .bs-guide__eyebrow / .bs-guide__title */
.bs-note__desc {
  margin: 24px 0 24px;
  color: #45556C;
  text-align: justify;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 29.25px;
}

.bs-note__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.bs-note__list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.bs-note__list li + li {
  margin-top: 12px;
}

.bs-note__icon {
  flex: 0 0 24px;
  display: block;
  width: 24px;
  height: 24px;
  /* căn dấu tích vào giữa dòng chữ line-height 28px */
  margin-top: 2px;
}

.bs-note__icon svg {
  display: block;
  width: 24px;
  height: 24px;
}

.bs-note__text {
  color: #45556C;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.bs-note__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 24px;
}

.bs-note__btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 240px;
  height: 58px;
  padding: 10px 20px;
  border-radius: 60px;
  color: #FFF;
  text-align: center;
  font-family: Arial;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: uppercase;
  text-decoration: none;
  transition: filter .25s ease, transform .25s ease, box-shadow .25s ease;
}

.bs-note__btn:hover {
  color: #FFF !important;
  filter: brightness(1.1);
  transform: translateY(-2px);
  box-shadow: 0 10px 20px -10px rgba(15, 23, 43, 0.45);
}

.bs-note__btn--blue {
  border: 1px solid #FFF;
  background: linear-gradient(270deg, #3987DE 0%, #30649E 100%);
}

.bs-note__btn--gold {
  border: 1px solid rgba(187, 145, 103, 0.50);
  background: linear-gradient(270deg, #CFB36C 0%, #A78749 100%);
}

@media (max-width: 1199px) {
  .bs-note {
    padding: 64px 0;
  }
}

@media (max-width: 991px) {
  /* 560px + 600px không còn đủ chỗ, xếp dọc, ảnh lên trên */
  .bs-note__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 32px;
  }

  .bs-note__media,
  .bs-note__copy {
    flex: 1 1 auto;
    max-width: 100%;
  }

  .bs-note__media {
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .bs-note {
    padding: 40px 0;
  }

  .bs-note__desc,
  .bs-note__text {
    font-size: 16px;
    line-height: 26px;
  }

  .bs-note__btn {
    min-width: 0;
    width: 100%;
  }
}

/* --- SBB Basic: khối các gói khám (đổi nội dung theo icon đang chọn) --- */
.bs-pack {
  padding: 120px 0 165px;
  background-color: #294664;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.bs-pack__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.20);
}

.bs-pack__heading {
  min-width: 0;
}

.bs-pack__eyebrow {
  display: block;
  margin-bottom: 12px;
  color: #CFB36C;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.bs-pack__title {
  margin: 0;
}

.bs-pack__title span {
  display: block;
  color: #FFF;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* --- icon tròn chọn gói --- */
.bs-pack__tabs {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
}

.bs-pack__tab {
  box-sizing: border-box;
  width: 94px;
  height: 94px;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 100px;
  background-color: #D9D9D9;
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  /* gói chưa chọn làm mờ và xám lại để icon đang chọn nổi lên */
  filter: grayscale(0.6);
  opacity: .75;
  transition: border-color .25s ease, filter .25s ease, opacity .25s ease, transform .25s ease;
}

.bs-pack__tab:hover {
  opacity: 1;
  transform: scale(1.04);
}

.bs-pack__tab.is-active {
  border-color: #C5A059;
  filter: none;
  opacity: 1;
}

/* --- 2 cột: chữ + nút bên trái, ảnh bên phải --- */
.bs-pack__body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin-top: 40px;
}

.bs-pack__left {
  flex: 1 1 auto;
  min-width: 0;
}

.bs-pack__right {
  flex: 0 1 620px;
  max-width: 620px;
  min-width: 0;
}

/* các gói xếp chồng, chỉ hiện gói đang chọn */
.bs-pack__panel,
.bs-pack__media {
  display: none;
}

.bs-pack__panel.is-active,
.bs-pack__media.is-active {
  display: block;
  animation: bs-fade .4s ease both;
}

.bs-pack__name {
  margin: 0 0 20px;
  color: #FFF;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
}

.bs-pack__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.bs-pack__list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #E4EAF2;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.bs-pack__list li + li {
  margin-top: 12px;
}

.bs-pack__check {
  flex: 0 0 20px;
  display: block;
  width: 20px;
  height: 20px;
  margin-top: 3px;
}

.bs-pack__check svg {
  display: block;
  width: 20px;
  height: 20px;
}

.bs-pack__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 20px;
}

/* --- 2 nút cố định --- */
.bs-pack__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 32px;
}

.bs-pack__btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 58px;
  padding: 10px 20px;
  border-radius: 60px;
  color: #FFF;
  text-align: center;
  font-family: Arial;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: uppercase;
  text-decoration: none;
  transition: filter .25s ease, transform .25s ease, background .25s ease;
}

.bs-pack__btn:hover {
  color: #FFF !important;
  transform: translateY(-2px);
}

.bs-pack__btn-icon,
.bs-pack__btn-icon svg {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

.bs-pack__btn--gold {
  border: 1px solid rgba(187, 145, 103, 0.50);
  background: linear-gradient(270deg, #CFB36C 0%, #A78749 100%);
}

.bs-pack__btn--gold:hover {
  filter: brightness(1.1);
}

.bs-pack__btn--ghost {
  border: 1px solid #FFF;
  background: transparent;
}

.bs-pack__btn--ghost:hover {
  background: rgba(255, 255, 255, 0.16);
}

@media (max-width: 1199px) {
  .bs-pack {
    padding: 80px 0 100px;
  }

  .bs-pack__title span {
    font-size: 32px;
    line-height: 40px;
    letter-spacing: 1.5px;
  }

  .bs-pack__tab {
    width: 76px;
    height: 76px;
  }
}

@media (max-width: 991px) {
  .bs-pack__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }

  .bs-pack__body {
    flex-direction: column;
    align-items: stretch;
    gap: 28px;
  }

  .bs-pack__right {
    flex: 1 1 auto;
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .bs-pack {
    padding: 48px 0 56px;
  }

  .bs-pack__title span {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 1px;
  }

  .bs-pack__tab {
    width: 60px;
    height: 60px;
  }

  .bs-pack__btn {
    width: 100%;
  }
}

/* --- SBB Basic: khối đánh giá khách hàng --- */
.bs-rev {
  padding: 100px 0;
  background-color: #F8FAFC;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.bs-rev__head {
  margin-bottom: 60px;
  text-align: center;
}

.bs-rev__eyebrow {
  display: block;
  margin-bottom: 12px;
  color: #30649E;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.bs-rev__title {
  margin: 0;
  color: #0F172B;
  text-align: center;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/*
  Số thẻ hiện cùng lúc khai báo ở --bs-cols. Bề rộng vùng cuộn được chặn đúng
  bằng N thẻ + N-1 khoảng cách, nên thẻ kế tiếp nằm hẳn ngoài vùng nhìn thay vì
  lòi ra một mẩu. Thẻ co lại khi container hẹp, nhưng không bao giờ quá 300px.
*/
.bs-rev__slider {
  --bs-cols: 4;
  --bs-gap: 24px;
  position: relative;
  max-width: calc(var(--bs-cols) * 300px + (var(--bs-cols) - 1) * var(--bs-gap));
  margin: 0 auto;
}

/* 2 nút cố ý đè lên thẻ đầu/cuối 50% nên không chừa chỗ hai bên */

/*
  Cuộn ngang bằng scroll-snap thay vì thư viện slider: vuốt được trên điện thoại,
  và khi có ít hơn 5 thẻ thì các thẻ tự dàn đủ 4 cột mà không cần js.
*/
.bs-rev__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - (var(--bs-cols) - 1) * var(--bs-gap)) / var(--bs-cols));
  gap: var(--bs-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.bs-rev__track::-webkit-scrollbar {
  display: none;
}

.bs-rev__card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 25px;
  border-radius: 15px;
  background: #FFF;
  box-shadow: 0 4px 26px 0 rgba(0, 0, 0, 0.06);
  scroll-snap-align: start;
}

.bs-rev__person {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 0 30px;
}

.bs-rev__avatar {
  flex: 0 0 50px;
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
}

.bs-rev__who {
  min-width: 0;
}

.bs-rev__name {
  display: block;
  color: #30649E;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.2px;
}

.bs-rev__role {
  display: block;
  color: #4B4B4B;
  font-family: Arial;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/* Padding 30px bên trong padding 25px của thẻ, đúng như bản thiết kế */
.bs-rev__body {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 30px;
}

.bs-rev__stars {
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-rev__star,
.bs-rev__star svg {
  display: block;
  width: 22px;
  height: 22px;
}

.bs-rev__text {
  margin: 15px 0 0;
  color: #0F172B;
  text-align: center;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.2px;
}

/* --- 2 nút trái / phải, chỉ hiện khi có hơn 4 đánh giá --- */
.bs-rev__nav {
  position: absolute;
  top: 50%;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  transform: translateY(-50%);
  border: none;
  border-radius: 50px;
  background: #C5A059;
  cursor: pointer;
  transition: filter .2s ease, transform .2s ease;
}

.bs-rev__nav:hover {
  filter: brightness(1.1);
  transform: translateY(-50%) scale(1.08);
}

.bs-rev__nav svg {
  display: block;
  width: 20px;
  height: 20px;
}

/* nút 32px, lệch ra ngoài 16px = đè lên thẻ đúng một nửa */
.bs-rev__nav--prev {
  left: -16px;
}

.bs-rev__nav--next {
  right: -16px;
}

@media (max-width: 1199px) {
  .bs-rev {
    padding: 72px 0;
  }

  /*
    Từ đây trở xuống bỏ trần 300px: để thẻ giãn kín container, không còn lề
    trống hai bên. Nút trái/phải vẫn giữ ở mọi kích thước.
  */
  .bs-rev__slider {
    --bs-cols: 3;
    max-width: 100%;
  }

  .bs-rev__title {
    font-size: 32px;
    line-height: 40px;
    letter-spacing: 1.5px;
  }

  .bs-rev__head {
    margin-bottom: 40px;
  }

}

@media (max-width: 991px) {
  .bs-rev__slider {
    --bs-cols: 2;
  }

  .bs-rev__card {
    padding: 20px;
  }
}

@media (max-width: 767px) {
  .bs-rev {
    padding: 48px 0;
  }



  .bs-rev__title {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 1px;
  }

}

@media (max-width: 659px) {
  .bs-rev__slider {
    --bs-cols: 1;
    --bs-gap: 16px;
  }

  .bs-rev__card {
    padding: 16px;
  }

  /* nút thu nhỏ lại nhưng vẫn giữ, không ẩn */
  .bs-rev__nav {
    width: 28px;
    height: 28px;
  }

  .bs-rev__nav svg {
    width: 16px;
    height: 16px;
  }

  .bs-rev__nav--prev {
    left: -14px;
  }

  .bs-rev__nav--next {
    right: -14px;
  }
}

/* --- SBB Basic: khối mời sang gói khám khác ---
   Nằm bên trong section .bs-rev để dùng chung ảnh nền của khối đánh giá. */
.bs-cross__box {
  box-sizing: border-box;
  margin-top: 120px;
  padding: 40px;
  border-radius: 24px;
  border: 1.6px solid #CFB36C;
  /*
    Gradient vàng phủ lên ảnh nền đặt lệch sang phải. Ảnh truyền qua biến
    --bs-cross-bg trong markup nên css không cần biết đường dẫn.
  */
  background-image: linear-gradient(270deg, rgba(207, 179, 108, 0.10) 6.34%, #BD9F5D 43.11%, #A78749 100%),
                    var(--bs-cross-bg, none);
  background-color: #A78749;
  background-position: center, right center;
  background-size: cover, 48.333% 159.536%;
  background-repeat: no-repeat, no-repeat;
  box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.20);
}

.bs-cross__title {
  margin: 0;
  color: #FFF;
  font-family: Arial;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 37.5px;
}

.bs-cross__desc {
  margin: 8px 0 0;
  max-width: 620px;
  color: #F5EEE0;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24.375px;
}

.bs-cross__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 24px;
}

.bs-cross__card {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 6px;
  border-radius: 60px;
  border: 1px solid #CFB36C;
  background: #FFF;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease;
}

.bs-cross__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px -8px rgba(0, 0, 0, 0.22);
}

.bs-cross__icon {
  flex: 0 0 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
}

.bs-cross__icon svg {
  display: block;
  width: 32px;
  height: 32px;
}

.bs-cross__card--premium .bs-cross__icon {
  background: linear-gradient(180deg, #CFB36C 0%, #A78749 100%);
}

.bs-cross__card--corporate .bs-cross__icon {
  background: linear-gradient(180deg, #30649E 0%, #294664 100%);
}

.bs-cross__body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.bs-cross__name {
  color: #916819;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.4px;
}

.bs-cross__card--corporate .bs-cross__name {
  color: #294664;
}

.bs-cross__sub {
  color: #4B4B4B;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.bs-cross__arrow {
  flex: 0 0 24px;
  display: block;
  width: 24px;
  height: 24px;
  margin-right: 12px;
}

.bs-cross__arrow svg {
  display: block;
  width: 24px;
  height: 24px;
}

@media (max-width: 1199px) {
  .bs-cross__box {
    margin-top: 72px;
    padding: 32px;
  }

  .bs-cross__title {
    font-size: 28px;
    line-height: 34px;
  }
}

@media (max-width: 767px) {
  .bs-cross__box {
    margin-top: 40px;
    padding: 24px 20px;
    /* ảnh nền lệch phải trên màn hẹp chỉ còn thấy một góc, bỏ đi cho chữ rõ */
    background-image: linear-gradient(270deg, #BD9F5D 0%, #A78749 100%);
  }

  .bs-cross__title {
    font-size: 22px;
    line-height: 28px;
  }

  .bs-cross__card {
    width: 100%;
  }

  .bs-cross__arrow {
    margin-left: auto;
    margin-right: 8px;
  }
}

@media (max-width: 991px) {
  .bs-rev__body {
    padding: 20px 8px;
  }
}

/* --- SBB Basic: cửa sổ sơ đồ phòng khám --- */
.bs-modal[hidden] {
  display: none;
}

.bs-modal {
  position: fixed;
  inset: 0;
  /* header cố định có z-index 100, cụm nút nổi 1030 -> cửa sổ phải cao hơn */
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.bs-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.60);
}

.bs-modal__box {
  position: relative;
  box-sizing: border-box;
  display: flex;
  width: 1260px;
  max-width: 100%;
  height: 600px;
  max-height: 100%;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  border-radius: 20px;
  background: #FFF;
  overflow: hidden;
}

.bs-modal__head {
  box-sizing: border-box;
  display: flex;
  height: 54px;
  padding: 0 30px;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
  align-self: stretch;
  border-radius: 20px 20px 0 0;
  border: 1px solid rgba(207, 179, 108, 0.16);
  background: #F9F5EB;
}

.bs-modal__title {
  margin: 0;
  color: #103051;
  font-family: Inter, Arial, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.bs-modal__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}

.bs-modal__close svg {
  display: block;
  width: 24px;
  height: 24px;
}

.bs-modal__body {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  padding: 0 30px 30px;
}

.bs-modal__body img {
  display: block;
  width: 638px;
  max-width: 100%;
  height: 480px;
  max-height: 100%;
  object-fit: contain;
}

/* chặn cuộn trang phía sau khi cửa sổ đang mở */
body.bs-modal-open {
  overflow: hidden;
}

@media (max-width: 767px) {
  .bs-modal {
    padding: 12px;
  }

  .bs-modal__box {
    height: auto;
    max-height: 90vh;
    gap: 16px;
  }

  .bs-modal__head {
    padding: 0 16px;
  }

  .bs-modal__title {
    font-size: 16px;
  }

  .bs-modal__body {
    padding: 0 16px 16px;
  }

  .bs-modal__body img {
    height: auto;
  }
}

/* --- SBB Basic: cửa sổ bảng tiêu chuẩn khám --- */
.bs-modal--wide .bs-modal__box {
  height: auto;
}

/*
  .bs-std dùng chung class .bs-modal__body, mà class đó có
  justify-content: center để canh giữa ảnh sơ đồ. Ở đây phải trả về
  flex-start, không thì 2 cột bị dồn vào giữa.
*/
.bs-std {
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 74px;
  width: 100%;
  padding: 0 30px 30px;
  overflow-y: auto;
}

.bs-std__col {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  min-width: 0;
}

/* Bề rộng cố định theo thiết kế: cột trái 428px, cột phải 628px */
.bs-std__col:first-child {
  flex: 0 1 428px;
  max-width: 428px;
}

.bs-std__col:last-child {
  flex: 0 1 628px;
  max-width: 628px;
}

.bs-std__icon {
  box-sizing: border-box;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  border-radius: 15px;
  background: #F1F4F7;
}

.bs-std__icon svg {
  display: block;
  width: 50px;
  height: 50px;
}

.bs-std__copy {
  min-width: 0;
}

.bs-std__title {
  margin: 0 0 8px;
  color: #0F172A;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 174.9%;
}

.bs-std__text,
.bs-std__bullets,
.bs-std__diseases {
  color: #0F172A;
  text-align: justify;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 174.9%;
}

.bs-std__text {
  margin: 0;
}

.bs-std__text + .bs-std__text {
  margin-top: 12px;
}

.bs-std__bullets {
  margin: 0;
  padding-left: 20px;
}

/* danh sách bệnh xếp 2 cột như bản thiết kế */
.bs-std__diseases {
  margin: 12px 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 24px;
}

.bs-std__diseases li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  /* tránh một dòng bị cắt đôi giữa 2 cột */
  break-inside: avoid;
}

.bs-std__x,
.bs-std__x svg {
  flex: 0 0 24px;
  display: block;
  width: 24px;
  height: 24px;
}

.bs-std__x {
  margin-top: 3px;
}

@media (max-width: 1199px) {
  .bs-std {
    gap: 32px;
  }
}

@media (max-width: 991px) {
  .bs-std {
    flex-direction: column;
    gap: 24px;
  }

  .bs-std__col:first-child,
  .bs-std__col:last-child {
    flex: 1 1 auto;
    max-width: 100%;
  }

  .bs-std__diseases {
    columns: 2;
  }
}

@media (max-width: 767px) {
  .bs-std {
    padding: 0 16px 16px;
  }

  .bs-std__icon {
    flex-basis: 64px;
    width: 64px;
    height: 64px;
  }

  .bs-std__icon svg {
    width: 34px;
    height: 34px;
  }

  .bs-std__col {
    gap: 14px;
  }

  .bs-std__diseases {
    columns: 1;
  }
}

/* ==========================================================================
   Trang Chuyên khoa (template/page-chuyen-khoa.php)
   Nhãn nhỏ / tiêu đề dùng lại .bs-guide__eyebrow, .bs-guide__title;
   khối bệnh lý cuối trang dùng lại .news-sec + .disease-card.
   ========================================================================== */
.q_page_ck .container {
  box-sizing: border-box;
  width: 100%;
  max-width: 1344px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

/* --- khối dịch vụ --- */
.ck-services {
  padding: 100px 0;
  background: #F8FAFC;
}

.ck-services__head {
  margin-bottom: 48px;
  text-align: center;
}

.ck-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.ck-card {
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  border: 1px solid #EAEAEA;
  background: #FFF;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ck-card:hover {
  box-shadow: 0 12px 24px -12px rgba(41, 70, 100, .25);
  transform: translateY(-2px);
}

.ck-card__thumb {
  height: 220px;
  background: #EEF2F7;
  overflow: hidden;
}

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

.ck-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px;
}

.ck-card__title {
  margin: 0;
  color: #103051;
  font-family: Arial;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.ck-card__desc {
  margin: 0;
  color: #4B4B4B;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

@media (max-width: 1199px) {
  .ck-services {
    padding: 72px 0;
  }

  .ck-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .ck-services {
    padding: 48px 0;
  }

  .ck-cards {
    grid-template-columns: minmax(0, 1fr);
  }

  .ck-card__thumb {
    height: 200px;
  }

  .ck-card__body {
    padding: 20px;
  }
}

/* --- Trang Chuyên khoa: banner đầu trang --- */
.ck-hero {
  padding: 100px 0;
  background-color: #0B1C33;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.ck-hero__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 80px;
}

.ck-hero__copy {
  flex: 1 1 0;
  min-width: 0;
}

.ck-hero__badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 100px;
  border: 1px solid #A78749;
  background: rgba(167, 135, 73, 0.15);
  color: #F6CB84;
  font-family: Arial;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.ck-hero__title {
  margin: 20px 0 0;
}

.ck-hero__title-1,
.ck-hero__title-2 {
  display: block;
  font-family: Arial;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  letter-spacing: 0.96px;
  text-transform: uppercase;
}

.ck-hero__title-1 {
  color: #FFF;
}

.ck-hero__title-2 {
  color: #F6CB84;
}

.ck-hero__desc {
  margin: 32px 0 0;
  max-width: 620px;
  color: #E2E8F0;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

/* 2 nút dùng lại .bs-btn của trang SBB Basic */
.ck-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 32px;
}

/*
  Nút tải PDF dùng .bs-btn--ghost (viền + chữ trắng) nhưng thiết kế của trang
  chuyên khoa muốn viền và chữ màu vàng, nên ghi đè tại đây.
*/
.ck-hero__pdf {
  gap: 8px;
  border-color: #F6CB84;
  color: #F6CB84;
}

.ck-hero__pdf:hover {
  color: #F6CB84 !important;
  background: rgba(246, 203, 132, 0.14);
}

.ck-hero__pdf-icon,
.ck-hero__pdf-icon svg {
  flex: 0 0 20px;
  display: block;
  width: 20px;
  height: 20px;
}

.ck-hero__breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 32px;
  color: #F6CB84;
  font-family: Arial;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.ck-hero__breadcrumb a {
  color: #FFF;
}

.ck-hero__breadcrumb a:hover {
  /* !important để thắng a:hover { color: #BB9067 !important } ở quan.css dòng 6 */
  color: #F6CB84 !important;
}

.ck-hero__breadcrumb span[aria-hidden] {
  color: #FFF;
}

.ck-hero__media {
  flex: 0 1 560px;
  max-width: 560px;
  min-width: 0;
}

.ck-hero__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 20px;
}

@media (max-width: 1199px) {
  .ck-hero {
    padding: 64px 0;
  }

  .ck-hero__inner {
    gap: 40px;
  }

  .ck-hero__title-1,
  .ck-hero__title-2 {
    font-size: 34px;
    line-height: 44px;
  }
}

@media (max-width: 991px) {
  .ck-hero__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 32px;
  }

  .ck-hero__media {
    flex: 1 1 auto;
    max-width: 100%;
    order: 2;
  }
}

@media (max-width: 767px) {
  .ck-hero {
    padding: 40px 0;
  }

  .ck-hero__title-1,
  .ck-hero__title-2 {
    font-size: 26px;
    line-height: 34px;
    letter-spacing: 0.52px;
  }

  .ck-hero__desc {
    margin-top: 20px;
    font-size: 16px;
  }

  .ck-hero__actions {
    margin-top: 24px;
  }

  .ck-hero__actions .bs-btn {
    width: 100%;
  }

  .ck-hero__breadcrumb {
    margin-top: 24px;
  }
}

/* --- Trang Chuyên khoa: khối tổng quan dịch vụ --- */
.ck-over {
  padding: 80px 0;
  background: #F8FAFC;
}

.ck-over__head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 48px;
  text-align: center;
}

.ck-over__title {
  margin: 0;
  color: #103051;
  text-align: center;
  font-family: Arial;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.ck-over__desc {
  margin: 0 auto;
  max-width: 760px;
  color: #475569;
  text-align: center;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.ck-over__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.ck-box {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  padding: 24px;
  border-radius: 16px;
  border: 1px solid #E2E8F0;
  background: #FFF;
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.03);
}

.ck-box__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.ck-box__icon {
  flex: 0 0 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: rgba(167, 135, 73, 0.08);
}

.ck-box__icon svg {
  display: block;
  width: 20px;
  height: 20px;
}

.ck-box__label {
  color: #A78749;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.ck-box__title {
  margin: 0 0 8px;
  color: #103051;
  font-family: Arial;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.ck-box__desc {
  margin: 0;
  color: #475569;
  text-align: justify;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

@media (max-width: 1199px) {
  .ck-over {
    padding: 56px 0;
  }

  .ck-over__title {
    font-size: 32px;
  }

  .ck-over__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .ck-over {
    padding: 40px 0;
  }

  .ck-over__head {
    margin-bottom: 28px;
  }

  .ck-over__title {
    font-size: 26px;
  }

  .ck-over__desc,
  .ck-box__desc {
    font-size: 16px;
    line-height: 24px;
  }

  .ck-over__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ck-box__title {
    font-size: 20px;
  }
}

/* --- Trang Chuyên khoa: danh mục khám & chẩn đoán --- */
.ck-list {
  padding: 100px 0;
}

.ck-list__rows {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ck-row {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 16px 24px;
  border: 1px solid #E2E8F0;
  background: #FFF;
}

/* dòng lẻ nền xám nhạt, dòng chẵn nền trắng */
.ck-row:nth-child(odd) {
  background: #F8FAFC;
}

/* các dòng dính nhau nên gộp viền, chỉ bo góc đầu và cuối */
.ck-row + .ck-row {
  border-top: none;
}

.ck-row:first-child {
  border-radius: 12px 12px 0 0;
}

.ck-row:last-child {
  border-radius: 0 0 12px 12px;
}

.ck-row__icon {
  flex: 0 0 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  background: rgba(167, 135, 73, 0.08);
}

.ck-row__icon svg {
  display: block;
  width: 16px;
  height: 16px;
}

.ck-row__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.ck-row__title {
  color: #103051;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.ck-row__desc {
  color: #475569;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.ck-row__tag {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 6px;
  background: rgba(16, 48, 81, 0.06);
  color: #103051;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
}

@media (max-width: 1199px) {
  .ck-list {
    padding: 56px 0;
  }
}

@media (max-width: 767px) {
  .ck-list {
    padding: 40px 0;
  }

  /* nhãn xuống dòng riêng, không thì chữ bị bóp lại còn vài từ mỗi dòng */
  .ck-row {
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px 16px;
  }

  .ck-row__body {
    flex: 1 1 100%;
    order: 2;
  }

  .ck-row__title,
  .ck-row__desc {
    font-size: 16px;
  }

  .ck-row__tag {
    order: 1;
    margin-left: auto;
    font-size: 14px;
  }
}

/* --- Trang Chuyên khoa: quy trình khám --- */
.ck-process {
  padding: 100px 0;
  background-color: #294664;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.ck-process__head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 900px;
  margin: 0 auto 60px;
  text-align: center;
}

.ck-process__title {
  margin: 0;
  color: #F6CB84;
  text-align: center;
  font-family: Arial;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.ck-process__desc {
  margin: 0;
  color: #E2E8F0;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.ck-process__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 16px;
}

.ck-process-card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  padding: 24px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  background: rgba(255, 255, 255, 0.12);
}

.ck-process-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.ck-process-card__number {
  color: #F6CB84;
  font-family: Arial;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.ck-process-card__icon,
.ck-process-card__icon svg {
  flex: 0 0 24px;
  display: block;
  width: 24px;
  height: 24px;
}

.ck-process-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ck-process-card__title {
  margin: 0;
  color: #FFF;
  font-family: Arial;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.ck-process-card__desc {
  margin: 0;
  color: #E2E8F0;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
}

@media (max-width: 1199px) {
  .ck-process {
    padding: 72px 0;
  }

  .ck-process__head {
    margin-bottom: 40px;
  }

  .ck-process__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .ck-process {
    padding: 48px 0;
  }

  .ck-process__head {
    margin-bottom: 28px;
  }

  .ck-process__title {
    font-size: 26px;
  }

  .ck-process__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ck-process-card {
    padding: 20px;
  }
}

/* --- Trang Chuyên khoa: CTA liên hệ --- */
.ck-cta {
  padding: 80px 0;
  background-color: #8F6E2E;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.ck-cta__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.ck-cta__title {
  margin: 0;
  max-width: 900px;
  color: #FFF;
  text-align: center;
  font-family: Arial;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.ck-cta__desc {
  margin: 16px auto 0;
  max-width: 900px;
  color: #E2E8F0;
  text-align: center;
  font-family: Arial;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.ck-cta__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 32px;
}

.ck-cta__actions .bs-btn {
  min-width: 240px;
  padding: 16px 32px;
  border-radius: 60px;
  font-family: Arial;
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
}

.ck-cta__quote {
  border: 0;
  background: linear-gradient(267deg, #30649E 0.21%, #103051 100.21%);
  color: #FFF;
}

.ck-cta__quote:hover {
  color: #FFF !important;
  filter: brightness(1.08);
}

.ck-cta__hotline {
  border: 1px solid #FFF;
  background: rgba(255, 255, 255, 0.10);
  color: #FFF;
}

.ck-cta__hotline:hover {
  border-color: #F6CB84;
  background: rgba(246, 203, 132, 0.18);
  color: #FFF !important;
}

@media (max-width: 767px) {
  .ck-cta {
    padding: 56px 0;
  }

  .ck-cta__title {
    font-size: 26px;
  }

  .ck-cta__actions {
    width: 100%;
    margin-top: 24px;
  }

  .ck-cta__actions .bs-btn {
    width: 100%;
    min-width: 0;
    font-size: 14px;
  }
}
.faq-page {
    background: #fff;
    overflow-x: hidden;
}

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

.faq-hero {
    min-height: 250px;
    background: url('../image/family-health-cover.png') center / cover no-repeat;
}

.faq-hero .container,
.faq-hero__inner {
    min-height: inherit;
}

.faq-hero .container {
    box-sizing: border-box;
    width: 100%;
    max-width: 1344px;
    padding-right: 15px;
    padding-left: 15px;
}

.faq-hero__inner {
    display: flex;
    padding: 32px 15px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    text-align: center;
}

.faq-hero__title {
    margin: 0;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
    white-space: normal;
}

.faq-hero__breadcrumb {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #f6cb84;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
}

.faq-hero__breadcrumb a {
    color: #fff;
    text-decoration: none;
    transition: color .2s ease;
}

.faq-hero__breadcrumb a:hover,
.faq-hero__breadcrumb a:focus {
    color: #f6cb84;
}

.faq-hero__separator {
    color: #fff;
}

@media (max-width: 767.98px) {
    .faq-hero {
        min-height: 205px;
    }

    .faq-hero__inner {
        padding-right: 15px;
        padding-left: 15px;
    }

    .faq-hero__title {
        font-size: 26px;
    }
}

.faq-content .container,
.faq-cross .container {
    box-sizing: border-box;
    width: 100%;
    max-width: 1344px;
    padding-right: 15px;
    padding-left: 15px;
}

.faq-content {
    padding-top: 100px;
}

.faq-layout {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
    align-items: start;
    gap: 20px;
}

.faq-categories {
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    max-width: 300px;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    background: #FFF;
    overflow: hidden;
}

.faq-categories__head {
    display: flex;
    padding: 16px 20px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    gap: 8px;
    background: #1A3568;
}

.faq-categories__eyebrow {
    position: relative;
    padding-left: 10px;
    color: #A78749;
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px;
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.faq-categories__eyebrow::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    border-radius: 2px;
    background: #A78749;
    content: "";
}

.faq-categories__title {
    margin: 0;
    color: #FFF;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}

.faq-categories__list {
    display: flex;
    padding: 8px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    gap: 2px;
}

.faq-category {
    box-sizing: border-box;
    display: flex;
    width: 100%;
    min-height: 48px;
    padding: 10px 12px;
    align-items: center;
    gap: 10px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #4A5565;
    text-align: left;
    cursor: pointer;
    transition: color .2s ease, background .2s ease;
}

.faq-category:hover,
.faq-category:focus,
.faq-category.is-active {
    background: #F0F5FF;
    color: #1A3568;
}

.faq-category__icon {
    flex: 0 0 20px;
    display: inline-flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
}

.faq-category__icon svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: #C5A059;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.faq-category__label {
    flex: 1 1 auto;
    min-width: 0;
    color: currentColor;
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.faq-category.is-active .faq-category__label {
    font-weight: 700;
}

.faq-category__count {
    flex: 0 0 24px;
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: #F3F4F6;
    color: #6A7282;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px;
}

.faq-category.is-active .faq-category__count {
    background: #1A3568;
    color: #FFF;
}

.faq-accordion {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 12px;
}

.faq-item {
    border: 1px solid transparent;
    border-radius: 12px;
    background: #F0F5FF;
    overflow: hidden;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.faq-item[hidden] {
    display: none !important;
}

.faq-item.is-open {
    border-color: rgba(201, 162, 39, .40);
    background: #FFF;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .10), 0 2px 4px -2px rgba(0, 0, 0, .10);
}

.faq-item__toggle {
    display: flex;
    width: 100%;
    padding: 20px 24px;
    align-items: center;
    gap: 16px;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.faq-item__number {
    flex: 0 0 28px;
    display: inline-flex;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: #A78749;
    color: #FFF;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px;
}

.faq-item:not(.is-open) .faq-item__number {
    background: transparent;
    color: #1A3568;
}

.faq-item__question {
    flex: 1 1 auto;
    min-width: 0;
    color: #1A3568;
    font-family: Arial, sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    overflow-wrap: anywhere;
}

.faq-item.is-open .faq-item__question {
    color: #A78749;
}

.faq-item__chevron {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    margin: 0 4px;
    border-right: 1.8px solid #A78749;
    border-bottom: 1.8px solid #A78749;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .2s ease;
}

.faq-item.is-open .faq-item__chevron {
    transform: rotate(225deg) translate(-2px, -2px);
}

.faq-item__answer {
    padding: 0 24px 20px 68px;
    color: #0F172B;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.faq-item__answer[hidden] {
    display: none !important;
}

.faq-item__answer p {
    margin: 0;
}

.faq-item__answer p + p {
    margin-top: 12px;
}

.faq-cross {
    padding: 100px 0;
}

.faq-cross .bs-cross__box {
    margin-top: 0;
}

@media (max-width: 991.98px) {
    .faq-content .container,
    .faq-cross .container,
    .faq-hero .container {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .faq-content {
        padding-top: 64px;
    }

    .faq-layout {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        grid-template-columns: 1fr;
    }

    .faq-categories,
    .faq-accordion,
    .faq-item {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .faq-categories {
        max-width: none;
    }

    .faq-categories__list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .faq-cross {
        padding: 64px 0;
    }
}

@media (max-width: 575.98px) {
    .faq-content {
        padding-top: 40px;
    }

    .faq-categories__list {
        display: flex;
    }

    .faq-item__toggle {
        padding: 16px;
        gap: 10px;
    }

    .faq-item__number {
        flex-basis: 26px;
        width: 26px;
        height: 26px;
        font-size: 15px;
    }

    .faq-item__question {
        font-size: 18px;
        line-height: 24px;
    }

    .faq-hero__title {
        width: 100%;
        font-size: 24px;
        line-height: 30px;
        overflow-wrap: anywhere;
        text-wrap: balance;
    }

    .faq-item__answer {
        padding: 0 16px 16px;
        font-size: 16px;
        line-height: 25px;
    }

    .faq-cross {
        padding: 40px 0;
    }
}

/* The legacy mobile rules make the old header relative and insert a 65px
 * spacer. The refreshed header keeps its own fixed height instead. */
@media only screen and (max-width: 767px) {
    header.header-main--refresh {
        position: fixed !important;
    }

    .header-main--refresh ~ .gap-110px {
        display: block !important;
        height: 68px;
        padding-top: 68px !important;
    }

    .header-main--refresh ~ .gap-65px {
        display: none !important;
    }
}

/* Keep the refreshed header as three visual zones on wide screens:
   logo / navigation / Premium-Basic actions. */
@media (min-width: 1200px) {
    .header-main--refresh .sbb-header-refresh__container {
        width: 100% !important;
        max-width: none !important;
        padding-right: 30px !important;
        padding-left: 30px !important;
    }

    .sbb-header-refresh__desktop {
        gap: 56px;
    }


    .sbb-header-refresh__menu > a,
    .sbb-header-refresh__menu-group > a {
        font-size: 17px;
        font-weight: 400;
        line-height: normal;
        letter-spacing: .17px;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .sbb-header-refresh__desktop {
        gap: 26px;
    }


    .sbb-header-refresh__menu {
        gap: 14px;
    }

    .sbb-header-refresh__menu > a,
    .sbb-header-refresh__menu-group > a {
        font-size: 13px;
    }
}

/* Header refresh: centred navigation, original Polylang switcher and right actions. */
.sbb-header-refresh__language ul {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sbb-header-refresh__language li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sbb-header-refresh__language a {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.sbb-header-refresh__language img {
    display: block;
    width: 18px;
    height: auto;
}

.sbb-header-refresh__home svg {
    display: block;
    width: 17px;
    height: 17px;
}

.sbb-header-refresh__home-link {
    min-width: 140px;
    min-height: 0;
    padding: 8px 12px;
    gap: 7px;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 22px;
}

.sbb-header-refresh__home-link b {
    width: 15px;
    height: 15px;
    flex-basis: 15px;
}

.sbb-header-refresh__home-link b svg {
    width: 15px;
    height: 15px;
}

.sbb-header-refresh__home-icon {
    width: 22px;
    height: 22px;
    flex-basis: 22px;
}

.sbb-header-refresh__home-icon svg {
    width: 16px;
    height: 16px;
}

@media (min-width: 1200px) {
    .sbb-header-refresh__desktop {
        display: grid;
        grid-template-columns: minmax(200px, 1fr) auto minmax(200px, 1fr);
        grid-template-rows: auto auto;
        align-items: center;
        gap: 0;
    }

    .sbb-header-refresh__brand {
        grid-column: 1;
        grid-row: 1 / span 2;
        align-self: center;
    }

    /*
      __navigation xếp dọc: hàng liên kết phụ ở trên (căn phải), hàng menu ở
      dưới, cách nhau 12px. Cả cụm vẫn nằm ở cột 2 nên tổng thể vẫn ở giữa.
    */
    .sbb-header-refresh__navigation {
        grid-column: 2;
        grid-row: 1 / span 2;
        width: max-content;
        gap: 12px;
        padding-right: 0 !important;
    }

    .sbb-header-refresh__quick-links {
        justify-content: flex-end;
        min-height: 0;
        gap: 18px;
    }

    .sbb-header-refresh__menu {
        justify-content: center;
        min-height: 0;
    }

    .sbb-header-refresh__quick-links > a:not(.sbb-header-refresh__home-link) {
        color: #0F172B;
        font-family: Arial, sans-serif;
        font-size: 15px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: .15px;
        text-transform: uppercase;
    }

    .sbb-header-refresh__home-actions {
        grid-column: 3;
        grid-row: 1 / span 2;
        justify-self: end;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 7px;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .sbb-header-refresh__desktop {
        grid-template-columns: minmax(188px, 1fr) auto minmax(140px, 1fr);
    }

    /* giữ đúng 200px như thiết kế, chỉ thu nhỏ chữ cho vừa cột hẹp */
    .sbb-header-refresh__home-link {
        padding: 6px 12px 6px 6px;
        font-size: 13px;
    }
}

/* ==========================================================================
   Modal tra cứu bệnh lý (icon kính lúp trên header)
   Đặt cuối file để thắng các rule #search-benh-mobile cũ trong @media 767px.
   ========================================================================== */
.sbb-search-modal .modal-dialog {
  max-width: 560px;
  padding: 0 15px;
}

.sbb-search-modal .modal-content {
  padding: 8px;
  border: 0;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 24px 48px rgba(15, 23, 43, .18);
}

.sbb-search-modal .modal-header {
  padding: 16px 16px 12px;
  border: 0;
}

.sbb-search-modal .modal-title {
  margin: 0;
  color: #0F172B;
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
}

.sbb-search-modal .btn-close {
  padding: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  opacity: .55;
  transition: opacity .2s ease, background-color .2s ease;
}

.sbb-search-modal .btn-close:hover {
  opacity: 1;
  background-color: #F1F5F9;
}

.sbb-search-modal .modal-body {
  position: relative;
  padding: 0 16px 20px;
}

.sbb-search-modal .modal-body > form > div {
  display: flex;
  align-items: center;
}

.sbb-search-modal #search-benh-mobile {
  width: 100%;
  height: 52px;
  padding: 0 62px 0 20px;
  border: 1px solid #E2E8F0;
  border-radius: 999px;
  outline: none;
  background: #F8FAFC;
  color: #0F172B;
  font-family: Arial, sans-serif;
  font-size: 15px;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.sbb-search-modal #search-benh-mobile::placeholder {
  color: #90A1B9;
}

.sbb-search-modal #search-benh-mobile:focus {
  border-color: #A78749;
  background: #FFF;
  box-shadow: 0 0 0 3px rgba(167, 135, 73, .15);
}

.sbb-search-modal .icon-search-mobile {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: #A78749;
  cursor: pointer;
  transition: background-color .2s ease;
}

.sbb-search-modal .icon-search-mobile:hover {
  background: #8C6F37;
}

/* icon gốc màu tối, đảo sang trắng cho nổi trên nền vàng */
.sbb-search-modal .icon-search-mobile img {
  width: 18px;
  height: 18px;
  filter: brightness(0) invert(1);
}

/* gợi ý tự động dùng chung cho cả 3 ô tra cứu */
.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front {
  padding: 6px;
  border: 1px solid #E2E8F0;
  border-radius: 14px;
  background: #FFF;
  box-shadow: 0 16px 32px rgba(15, 23, 43, .14);
  overflow-y: auto !important;
}

.ui-autocomplete .ui-menu-item-wrapper {
  padding: 10px 14px;
  border: 0;
  border-radius: 10px;
  color: #0F172B;
  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 1.4;
}

.ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
  margin: 0;
  border: 0;
  background: rgba(167, 135, 73, .1);
  color: #A78749;
}

/*
  Danh sách gợi ý phải nổi trên modal (bootstrap modal z-index 1055), nếu không
  nó nằm dưới lớp phủ và bị xám mờ không đọc được. Vị trí để jQuery UI tự tính
  theo ô nhập, css chỉ lo phần nhìn.
*/
.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front {
  position: absolute;
  z-index: 1060;
  max-height: 288px !important;
  overflow-y: auto !important;
}

/* Nút gói SBB Corporate, dùng trên header Basic và header Premium */
.sbb-header-refresh__home-link--corporate {
  border: 1px solid rgba(41, 70, 100, .2);
  background: #EEF2F7;
  color: #294664;
}

.sbb-header-refresh__home-link--corporate .sbb-header-refresh__home-icon {
  background: linear-gradient(0deg, #294664 0%, #5C7EA5 100%);
}

/* ==========================================================================
   SBB Premium – khối Workshop đào tạo
   Ảnh giữa nổi lên, 2 ảnh hai bên nằm dưới và bị phủ trắng. Vị trí tính theo
   data-offset do js gán, không phụ thuộc số lượng ảnh.
   ========================================================================== */
.q_sbb_premium .premium-workshop {
  padding: 100px 0;
  background: #fff;
}

.q_sbb_premium .premium-workshop__title {
  margin: 0 0 50px;
  color: #a78749;
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: 54px;
  letter-spacing: .84px;
  text-align: center;
  text-transform: uppercase;
}

.q_sbb_premium .premium-workshop__carousel {
  position: relative;
}

.q_sbb_premium .premium-workshop__stage {
  position: relative;
  height: 348px;
}

.q_sbb_premium .premium-workshop__slide {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 648px;
  max-width: 100%;
  height: 348px;
  margin: 0;
  display: block;
  border-radius: 20px;
  opacity: 0;
  pointer-events: none;
  text-decoration: none;
  transform: translate(-50%, -50%);
  transition: left .45s ease, transform .45s ease, opacity .45s ease;
}

.q_sbb_premium .premium-workshop__media {
  position: absolute;
  inset: 0;
  display: block;
  border-radius: 20px;
  background-color: #d3d3d3;
  background-image: var(--ws-image);
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

/* ảnh đang chọn */
.q_sbb_premium .premium-workshop__slide[data-offset="0"] {
  z-index: 3;
  opacity: 1;
  pointer-events: auto;
  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, .35);
  transform: translate(-50%, -50%) scale(1);
}

/* 2 ảnh hai bên: thu nhỏ, lùi ra và phủ trắng 80% */
.q_sbb_premium .premium-workshop__slide[data-offset="-1"],
.q_sbb_premium .premium-workshop__slide[data-offset="1"] {
  z-index: 2;
  opacity: 1;
  cursor: pointer;
  pointer-events: auto;
}

.q_sbb_premium .premium-workshop__slide[data-offset="-1"] {
  left: 0;
  transform: translate(-7%, -50%) scale(.86);
}

.q_sbb_premium .premium-workshop__slide[data-offset="1"] {
  left: 100%;
  transform: translate(-93%, -50%) scale(.86);
}

.q_sbb_premium .premium-workshop__slide[data-offset="-1"] .premium-workshop__media,
.q_sbb_premium .premium-workshop__slide[data-offset="1"] .premium-workshop__media {
  background-image: linear-gradient(0deg, rgba(255, 255, 255, .8) 0%, rgba(255, 255, 255, .8) 100%), var(--ws-image);
}

.q_sbb_premium .premium-workshop__arrow {
  position: absolute;
  z-index: 4;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}

.q_sbb_premium .premium-workshop__carousel.is-scrollable .premium-workshop__arrow {
  display: inline-flex;
}

.q_sbb_premium .premium-workshop__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_premium .premium-workshop__arrow:hover { background: #8f6e2e; }
.q_sbb_premium .premium-workshop__arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_premium .premium-workshop__arrow--next { right: 0; transform: translate(50%, -50%); }

@media (max-width: 1199.98px) {
  .q_sbb_premium .premium-workshop { padding: 80px 0; }
  .q_sbb_premium .premium-workshop .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_premium .premium-workshop__title { margin-bottom: 40px; font-size: 34px; line-height: 44px; }
  .q_sbb_premium .premium-workshop__stage { height: 300px; }
  .q_sbb_premium .premium-workshop__slide { width: 560px; height: 300px; }
}

@media (max-width: 767px) {
  .q_sbb_premium .premium-workshop { padding: 56px 0; }
  .q_sbb_premium .premium-workshop .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_premium .premium-workshop__title { margin-bottom: 28px; font-size: 24px; line-height: 32px; letter-spacing: .48px; }
  .q_sbb_premium .premium-workshop__stage { height: 190px; }
  .q_sbb_premium .premium-workshop__slide { width: 100%; height: 190px; }
  /* màn hẹp không đủ chỗ cho 2 ảnh bên, chỉ giữ ảnh giữa */
  .q_sbb_premium .premium-workshop__slide[data-offset="-1"],
  .q_sbb_premium .premium-workshop__slide[data-offset="1"] {
    opacity: 0;
    pointer-events: none;
  }
  .q_sbb_premium .premium-workshop__arrow { width: 34px; height: 34px; }
  .q_sbb_premium .premium-workshop__arrow svg { width: 17px; height: 17px; }
}

/* ==========================================================================
   SBB Premium – nền chung cho 3 khối: Hành trình chăm sóc, Cơ sở vật chất,
   Trang thiết bị. Hai khối sau dùng lại part của trang Cơ sở vật chất nên chỉ
   cần đổi màu chữ cho hợp nền tối, không đụng vào bố cục gốc.
   ========================================================================== */
.q_sbb_premium .premium-journey {
  padding: 150px 0;
  background-repeat: no-repeat;
}

.q_sbb_premium .premium-journey__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 34px;
  margin-bottom: 55px;
}

.q_sbb_premium .premium-journey__logo {
  display: block;
  width: auto;
  max-width: 240px;
  height: auto;
}

.q_sbb_premium .premium-journey__title {
  margin: 0;
  color: #e7c677;
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .84px;
  text-align: center;
  text-transform: uppercase;
}

.q_sbb_premium .premium-journey__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
}

.q_sbb_premium .premium-journey__card {
  position: relative;
  display: flex;
  min-height: 500px;
  align-items: flex-end;
  overflow: hidden;
  border-radius: 20px;
  border-bottom: 4px solid #cfb36c;
  background-color: #d3d3d3;
  background-image: linear-gradient(180deg, rgba(36, 108, 183, 0) 33.8%, #103051 100%), var(--jn-image);
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_premium .premium-journey__card-body {
  width: 100%;
  padding: 0 28px 48px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.q_sbb_premium .premium-journey__card-title {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #e7c677;
  font-family: Arial, sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.q_sbb_premium .premium-journey__card-icon {
  display: inline-flex;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
}

.q_sbb_premium .premium-journey__card-icon svg {
  display: block;
  width: 30px;
  height: 30px;
}

.q_sbb_premium .premium-journey__card-text {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
}

@media (max-width: 1199.98px) {
  /*
    Màn to section thấp hơn ảnh nền (2560x1440) nên để ảnh vẽ nguyên khổ, giữ
    được mép răng cưa trên dưới. Màn nhỏ 3 khối xếp dọc làm section cao vượt
    1440px, hết ảnh là trơ nền trắng, chữ trắng biến mất -> mới cần phủ.
  */
  .q_sbb_premium .premium-journey {
    padding: 100px 0;
    background-color: #103051;
    background-position: center;
    background-size: cover;
  }
  .q_sbb_premium .premium-journey__head { gap: 26px; margin-bottom: 40px; }
  .q_sbb_premium .premium-journey__title { font-size: 34px; }
  .q_sbb_premium .premium-journey__cards { gap: 20px; }
  .q_sbb_premium .premium-journey__card { min-height: 420px; }
  .q_sbb_premium .premium-journey__card-body { padding: 0 20px 34px; }
  .q_sbb_premium .premium-journey__card-title { font-size: 22px; }
  .q_sbb_premium .premium-journey__card-text { font-size: 16px; line-height: 22px; }
}

@media (max-width: 767px) {
  .q_sbb_premium .premium-journey { padding: 56px 0; }
  .q_sbb_premium .premium-journey__head { gap: 20px; margin-bottom: 28px; }
  .q_sbb_premium .premium-journey__logo { max-width: 180px; }
  .q_sbb_premium .premium-journey__title { font-size: 24px; letter-spacing: .48px; }
  .q_sbb_premium .premium-journey__cards { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .q_sbb_premium .premium-journey__card { min-height: 340px; }
}

/* ==========================================================================
   SBB Premium – 2 khối Cơ sở vật chất và Trang thiết bị.
   Css riêng hoàn toàn, không dùng chung với trang Cơ sở vật chất: nền tối,
   tiêu đề vàng, ảnh trượt ngang — khác hẳn bản lưới trên nền sáng bên kia.
   ========================================================================== */
.q_sbb_premium .premium-facility,
.q_sbb_premium .premium-equip {
  margin-top: 80px;
}

.q_sbb_premium .premium-block__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 32px;
  padding-bottom: 24px;
  margin-bottom: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, .18);
}

.q_sbb_premium .premium-block__intro {
  max-width: 460px;
}

.q_sbb_premium .premium-block__title {
  margin: 0 0 10px;
  color: #e7c677;
  font-family: Arial, sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .64px;
  text-transform: uppercase;
}

.q_sbb_premium .premium-block__desc {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

/* --- tab dạng viên thuốc --- */
.q_sbb_premium .premium-facility__tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 6px;
}

.q_sbb_premium .premium-facility__tab {
  padding: 8px 18px;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 60px;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.q_sbb_premium .premium-facility__tab:hover {
  border-color: #e7c677;
  color: #e7c677;
}

.q_sbb_premium .premium-facility__tab.is-active {
  border-color: #cfb36c;
  background: linear-gradient(0deg, #a78749 0%, #cfb36c 100%);
  color: #fff;
  font-weight: 700;
}

/* --- dải ảnh trượt ngang --- */
.q_sbb_premium .premium-facility__body {
  position: relative;
}

.q_sbb_premium .premium-facility__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.q_sbb_premium .premium-facility__track::-webkit-scrollbar {
  display: none;
}

.q_sbb_premium .premium-facility__item {
  width: calc((100% - 48px) / 3);
  min-width: calc((100% - 48px) / 3);
  height: 240px;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  scroll-snap-align: start;
}

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

.q_sbb_premium .premium-arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}

.q_sbb_premium .premium-facility.is-scrollable .premium-arrow {
  display: inline-flex;
}

.q_sbb_premium .premium-arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_premium .premium-arrow:hover { background: #8f6e2e; }
.q_sbb_premium .premium-arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_premium .premium-arrow--next { right: 0; transform: translate(50%, -50%); }

/* --- trang thiết bị: hàng ảnh tròn --- */
.q_sbb_premium .premium-equip__thumbs {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.q_sbb_premium .premium-equip__thumbs-track {
  display: flex;
  align-items: center;
  gap: 12px;
  overflow-x: auto;
  scrollbar-width: none;
}

.q_sbb_premium .premium-equip__thumbs-track::-webkit-scrollbar {
  display: none;
}

.q_sbb_premium .premium-equip__thumb {
  width: 94px;
  height: 94px;
  min-width: 94px;
  aspect-ratio: 1 / 1;
  padding: 0;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  cursor: pointer;
  transition: border-color .2s ease, opacity .2s ease;
  opacity: .75;
}

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

.q_sbb_premium .premium-equip__thumb:hover { opacity: 1; }

.q_sbb_premium .premium-equip__thumb.is-active {
  border-color: #cfb36c;
  opacity: 1;
}

.q_sbb_premium .premium-equip__more {
  display: inline-flex;
  width: 94px;
  height: 94px;
  min-width: 94px;
  aspect-ratio: 1 / 1;
  padding: 0 8px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  cursor: pointer;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  text-decoration: none;
  transition: background-color .2s ease;
}

.q_sbb_premium .premium-equip__more:hover { background: rgba(255, 255, 255, .22); }

.q_sbb_premium .premium-equip__more svg {
  display: block;
  width: 14px;
  height: 14px;
}

/* --- trang thiết bị: ảnh trái, nội dung phải --- */
.q_sbb_premium .premium-equip__panel {
  display: grid;
  grid-template-columns: minmax(0, 480px) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}

.q_sbb_premium .premium-equip__panel[hidden] {
  display: none;
}

.q_sbb_premium .premium-equip__media {
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
}

.q_sbb_premium .premium-equip__media img {
  display: block;
  width: 100%;
  height: auto;
}

.q_sbb_premium .premium-equip__body h3 {
  margin: 0 0 8px;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: normal;
}

.q_sbb_premium .premium-equip__content,
.q_sbb_premium .premium-equip__content p,
.q_sbb_premium .premium-equip__content li {
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

/* dòng Model in vàng, thường là đoạn đầu tiên */
.q_sbb_premium .premium-equip__content > p:first-child {
  color: #e7c677;
  font-weight: 700;
}

.q_sbb_premium .premium-equip__content ul {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.q_sbb_premium .premium-equip__content li {
  position: relative;
  padding-left: 30px;
}

/* dấu tích vàng thay cho bullet mặc định */
.q_sbb_premium .premium-equip__content li::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #cfb36c url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

@media (max-width: 1199.98px) {
  .q_sbb_premium .premium-facility,
  .q_sbb_premium .premium-equip { margin-top: 56px; }
  .q_sbb_premium .premium-block__head { flex-direction: column; gap: 18px; }
  .q_sbb_premium .premium-facility__tabs { justify-content: flex-start; }
  .q_sbb_premium .premium-block__title { font-size: 26px; }
  .q_sbb_premium .premium-facility__track { gap: 16px; }
  .q_sbb_premium .premium-facility__item {
    width: calc((100% - 16px) / 2);
    min-width: calc((100% - 16px) / 2);
    height: 200px;
  }
  .q_sbb_premium .premium-equip__panel { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .q_sbb_premium .premium-equip__media { max-width: 480px; }
  /* 6 ảnh 94px không đủ chỗ ở màn hẹp, cho trượt ngang thay vì co lại */
  .q_sbb_premium .premium-equip__thumbs { width: 100%; }
}

@media (max-width: 767px) {
  .q_sbb_premium .premium-facility__item { width: 100%; min-width: 100%; height: 190px; }
  .q_sbb_premium .premium-arrow { width: 34px; height: 34px; }
  .q_sbb_premium .premium-arrow svg { width: 17px; height: 17px; }
  .q_sbb_premium .premium-equip__body h3 { font-size: 20px; }
}

/* ==========================================================================
   SBB Premium – khối Đội ngũ chuyên gia.
   Css riêng, không dùng lại khối đội ngũ của trang Đội ngũ y khoa.
   ========================================================================== */
.q_sbb_premium .premium-team {
  padding: 150px 0 300px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin: -50px 0 0;
}

.q_sbb_premium .premium-team__head {
  max-width: 640px;
  margin: 0 auto 42px;
  text-align: center;
}

.q_sbb_premium .premium-team__title {
  margin: 0 0 16px;
  color: #a78749;
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .84px;
  text-transform: uppercase;
}

.q_sbb_premium .premium-team__desc {
  margin: 0;
  color: #0f172b;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.q_sbb_premium .premium-team__carousel {
  position: relative;
}

.q_sbb_premium .premium-team__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.q_sbb_premium .premium-team__track::-webkit-scrollbar {
  display: none;
}

.q_sbb_premium .premium-team__card {
  width: calc((100% - 72px) / 4);
  min-width: calc((100% - 72px) / 4);
  scroll-snap-align: start;
  text-align: center;
}

.q_sbb_premium .premium-team__photo {
  margin: 0 0 16px;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 3 / 4;
  background: #eef2f7;
}

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

.q_sbb_premium .premium-team__name {
  margin: 0 0 6px;
  color: #0f172b;
  font-family: Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 24px;
}

.q_sbb_premium .premium-team__role {
  margin: 0 0 10px;
  color: #a78749;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.q_sbb_premium .premium-team__note {
  margin: 0;
  color: #475569;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.q_sbb_premium .premium-team__arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease, opacity .2s ease;
}

.q_sbb_premium .premium-team__carousel.is-scrollable .premium-team__arrow {
  display: inline-flex;
}

.q_sbb_premium .premium-team__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_premium .premium-team__arrow:hover { background: #8f6e2e; }

.q_sbb_premium .premium-team__arrow:disabled {
  opacity: .35;
  cursor: default;
}

.q_sbb_premium .premium-team__arrow:disabled:hover { background: #b49753; }

/* nút đè đúng nửa mép thẻ ngoài cùng, canh giữa theo chiều dọc của ảnh */
.q_sbb_premium .premium-team__arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_premium .premium-team__arrow--next { right: 0; transform: translate(50%, -50%); }

@media (max-width: 1199.98px) {
  .q_sbb_premium .premium-team { padding: 100px 0 200px; }
  .q_sbb_premium .premium-team__head { margin-bottom: 32px; }
  .q_sbb_premium .premium-team__title { font-size: 34px; }
  .q_sbb_premium .premium-team__track { gap: 16px; }
  .q_sbb_premium .premium-team__card {
    width: calc((100% - 32px) / 3);
    min-width: calc((100% - 32px) / 3);
  }
  /* chừa chỗ cho nút nhô ra, container dưới 1200px chỉ còn padding 12px */
  .q_sbb_premium .premium-team .container {
    padding-right: 34px;
    padding-left: 34px;
  }
}

@media (max-width: 767px) {
  .q_sbb_premium .premium-team { padding: 56px 0 110px; }
  .q_sbb_premium .premium-team__title { font-size: 24px; letter-spacing: .48px; }
  .q_sbb_premium .premium-team__card {
    width: calc((100% - 16px) / 2);
    min-width: calc((100% - 16px) / 2);
  }
  .q_sbb_premium .premium-team .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_premium .premium-team__arrow { width: 34px; height: 34px; }
  .q_sbb_premium .premium-team__arrow svg { width: 17px; height: 17px; }
}

/* ==========================================================================
   SBB Premium – khối mời sang gói khám khác.
   Css riêng, không dùng chung với .bs-cross bên trang SBB Basic.
   ========================================================================== */
.q_sbb_premium .premium-cross {
  position: relative;
  z-index: 3;
}

/*
  Đè lên nửa dưới khối phía trên: translateY(-50%) kéo hộp lên đúng nửa chiều
  cao của chính nó, khỏi phải biết trước hộp cao bao nhiêu. Nửa chiều cao còn
  trống bên dưới trở thành khoảng cách tới khối kế tiếp.
*/
.q_sbb_premium .premium-cross__box {
  box-sizing: border-box;
  padding: 40px;
  border-radius: 24px;
  border: 1.6px solid #cfb36c;
  /* gradient vàng phủ lên ảnh nền đặt lệch sang phải */
  background-image: linear-gradient(270deg, rgba(207, 179, 108, .1) 6.34%, #bd9f5d 43.11%, #a78749 100%),
                    var(--px-cross-bg, none);
  background-color: #a78749;
  background-position: center, right center;
  background-size: cover, 48.333% 159.536%;
  background-repeat: no-repeat, no-repeat;
  box-shadow: 0 6px 20px 0 rgba(0, 0, 0, .2);
  transform: translateY(-50%);
}

.q_sbb_premium .premium-cross__title {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 37.5px;
}

.q_sbb_premium .premium-cross__desc {
  margin: 8px 0 0;
  max-width: 620px;
  color: #f5eee0;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24.375px;
}

.q_sbb_premium .premium-cross__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 24px;
}

.q_sbb_premium .premium-cross__card {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 6px;
  border-radius: 60px;
  border: 1px solid #cfb36c;
  background: #fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease;
}

.q_sbb_premium .premium-cross__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px -8px rgba(0, 0, 0, .22);
}

.q_sbb_premium .premium-cross__icon {
  flex: 0 0 56px;
  display: flex;
  width: 56px;
  height: 56px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.q_sbb_premium .premium-cross__icon svg {
  display: block;
  width: 32px;
  height: 32px;
}

.q_sbb_premium .premium-cross__card--premium .premium-cross__icon {
  background: linear-gradient(180deg, #cfb36c 0%, #a78749 100%);
}

.q_sbb_premium .premium-cross__card--corporate .premium-cross__icon {
  background: linear-gradient(180deg, #30649e 0%, #294664 100%);
}

.q_sbb_premium .premium-cross__card--basic .premium-cross__icon {
  background: linear-gradient(180deg, #96b2d4 0%, #3b73b3 100%);
}

.q_sbb_premium .premium-cross__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.q_sbb_premium .premium-cross__name {
  color: #916819;
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .4px;
}

.q_sbb_premium .premium-cross__card--corporate .premium-cross__name {
  color: #294664;
}

.q_sbb_premium .premium-cross__card--basic .premium-cross__name {
  color: #3b73b3;
}

.q_sbb_premium .premium-cross__sub {
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

.q_sbb_premium .premium-cross__arrow {
  flex: 0 0 24px;
  display: block;
  width: 24px;
  height: 24px;
  margin-right: 12px;
}

.q_sbb_premium .premium-cross__arrow svg {
  display: block;
  width: 24px;
  height: 24px;
}

@media (max-width: 1199.98px) {
  .q_sbb_premium .premium-cross__box { padding: 28px; }
  .q_sbb_premium .premium-cross__title { font-size: 28px; line-height: 34px; }
}

@media (max-width: 767px) {
  /* màn hẹp hộp cao gấp đôi, đè 50% sẽ trùm hết khối trên nên chỉ đè nhẹ */
  .q_sbb_premium .premium-cross__box {
    padding: 20px;
    background-size: cover, 0 0;
    transform: translateY(-24px);
  }
  .q_sbb_premium .premium-cross__title { font-size: 22px; line-height: 28px; }
  .q_sbb_premium .premium-cross__desc { font-size: 15px; line-height: 22px; }
  .q_sbb_premium .premium-cross__cards { flex-direction: column; }
  .q_sbb_premium .premium-cross__card { width: 100%; }
  .q_sbb_premium .premium-cross__arrow { margin-left: auto; margin-right: 8px; }
}

/* ==========================================================================
   SBB Premium – khối Góc sức khoẻ (tin tức mới nhất).
   Css riêng, không dùng chung với khối tin tức của trang Tin tức.
   ========================================================================== */
.q_sbb_premium .premium-news {
  padding: 0 0 100px;
  background: #fff;
}

.q_sbb_premium .premium-news__head {
  max-width: 720px;
  margin: 0 auto 42px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: center;
}

.q_sbb_premium .premium-news__title {
  margin: 0;
  color: #294664;
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .84px;
  text-transform: uppercase;
}

.q_sbb_premium .premium-news__desc {
  margin: 0;
  color: #0f172b;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.q_sbb_premium .premium-news__layout {
  display: grid;
  grid-template-columns: minmax(0, 660px) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
}

.q_sbb_premium .premium-news__layout--solo {
  grid-template-columns: minmax(0, 1fr);
}

/* --- tin lớn bên trái --- */
.q_sbb_premium .premium-news__lead {
  display: flex;
  flex-direction: column;
  padding: 16px;
  border: 1px solid #eaeaea;
  border-radius: 20px;
  background: #fffdf9;
  text-decoration: none;
  transition: box-shadow .25s ease, transform .25s ease;
}

.q_sbb_premium .premium-news__lead:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px -10px rgba(15, 23, 43, .22);
}

/*
  Ảnh nhận phần cao dư của thẻ nên cột trái luôn cao bằng cột phải; min-height
  giữ đúng 400px như thiết kế khi cột phải ngắn hơn.
*/
.q_sbb_premium .premium-news__lead-thumb {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  min-height: 400px;
  overflow: hidden;
  border-radius: 10px;
  background: #eef2f7;
}

.q_sbb_premium .premium-news__lead-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.q_sbb_premium .premium-news__lead-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 16px;
}

.q_sbb_premium .premium-news__lead-title {
  display: block;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.q_sbb_premium .premium-news__lead-desc {
  display: block;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.q_sbb_premium .premium-news__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #c5a059;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.q_sbb_premium .premium-news__more svg {
  display: block;
  width: 14px;
  height: 14px;
}

/* --- nhãn chuyên mục và ngày --- */
.q_sbb_premium .premium-news__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.q_sbb_premium .premium-news__badge {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border-radius: 60px;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: normal;
  text-transform: uppercase;
  white-space: nowrap;
}

.q_sbb_premium .premium-news__badge--outline {
  border: 1px solid #c5a059;
  background: #f9f5eb;
  color: #916819;
  font-weight: 400;
}

.q_sbb_premium .premium-news__badge--solid {
  background: #c5a059;
  color: #fff;
  font-weight: 700;
}

/* --- danh sách tin nhỏ bên phải --- */
.q_sbb_premium .premium-news__list {
  display: flex;
  flex-direction: column;
  gap: 17px;
}

.q_sbb_premium .premium-news__item {
  display: flex;
  gap: 16px;
  padding: 12px 16px;
  border: 1px solid #eaeaea;
  border-radius: 20px;
  background: #fff;
  text-decoration: none;
  transition: border-color .25s ease, box-shadow .25s ease;
  background: #FFFDF9;
}

.q_sbb_premium .premium-news__item:hover {
  border-color: #c5a059;
  box-shadow: 0 10px 20px -12px rgba(15, 23, 43, .25);
}

.q_sbb_premium .premium-news__item-thumb {
  display: block;
  width: 200px;
  min-width: 200px;
  aspect-ratio: 200 / 127;
  overflow: hidden;
  border-radius: 10px;
  background: #eef2f7;
}

.q_sbb_premium .premium-news__item-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.q_sbb_premium .premium-news__item-body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 10px;
}

.q_sbb_premium .premium-news__item-title {
  display: block;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

/* --- nút xem thêm --- */
.q_sbb_premium .premium-news__foot {
  margin-top: 42px;
  text-align: center;
}

.q_sbb_premium .premium-news__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
  border-radius: 60px;
  background: #294664;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: .28px;
  text-decoration: none;
  text-transform: uppercase;
  transition: background-color .2s ease;
}

.q_sbb_premium .premium-news__btn:hover { background: #1d3350; }

.q_sbb_premium .premium-news__btn svg {
  display: block;
  width: 16px;
  height: 16px;
}

@media (max-width: 1199.98px) {
  .q_sbb_premium .premium-news { padding: 80px 0; }
  .q_sbb_premium .premium-news__title { font-size: 34px; }
  .q_sbb_premium .premium-news__layout { grid-template-columns: minmax(0, 1fr); }
  .q_sbb_premium .premium-news__lead-thumb { min-height: 320px; }
}

@media (max-width: 767px) {
  .q_sbb_premium .premium-news { padding: 56px 0; }
  .q_sbb_premium .premium-news__head { margin-bottom: 28px; gap: 12px; }
  .q_sbb_premium .premium-news__title { font-size: 24px; letter-spacing: .48px; }
  .q_sbb_premium .premium-news__desc { font-size: 16px; line-height: 24px; }
  .q_sbb_premium .premium-news__lead-thumb { min-height: 220px; }
  .q_sbb_premium .premium-news__lead-title { font-size: 20px; line-height: 28px; }
  .q_sbb_premium .premium-news__lead-desc { font-size: 16px; line-height: 24px; }
  /* ảnh 200px chiếm quá nửa bề ngang, xếp dọc cho dễ đọc */
  .q_sbb_premium .premium-news__item { flex-direction: column; }
  .q_sbb_premium .premium-news__item-thumb { width: 100%; min-width: 0; }
  .q_sbb_premium .premium-news__item-title { font-size: 17px; line-height: 24px; }
}

/* ==========================================================================
   SBB Corporate – video đầu trang. Css riêng, không dùng chung với trang Premium.
   ========================================================================== */
.q_sbb_corporate .corp-video-hero {
  overflow: hidden;
  background: #103051;
}

.q_sbb_corporate .corp-video-hero__media {
  display: block;
  width: 100%;
  height: auto;
  /* khoá theo tỉ lệ 16:9 để video không cao quá màn trên desktop rộng */
  max-height: min(56.25vw, 960px);
  object-fit: cover;
}

.q_sbb_corporate .corp-page-content {
  padding-top: 40px;
  padding-bottom: 40px;
}

.q_sbb_corporate .corp-page-content:empty {
  padding: 0;
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-video-hero__media {
    min-height: 220px;
    max-height: none;
    object-fit: cover;
  }
}

/* ==========================================================================
   SBB Corporate – băng chuyền ảnh. Cùng cách bố trí với khối Workshop của trang
   Premium nhưng css riêng, hai trang không phụ thuộc nhau.
   ========================================================================== */
.q_sbb_corporate .corp-carousel {
  padding: 100px 0;
  background: #fff;
}

.q_sbb_corporate .corp-carousel__head {
  margin: 0 0 50px;
  text-align: center;
}

.q_sbb_corporate .corp-carousel__title {
  margin: 0 0 8px;
  color: #a78749;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .72px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-carousel__subtitle {
  margin: 0;
  color: #294664;
  font-family: Arial, sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .6px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-carousel__wrap {
  position: relative;
}

.q_sbb_corporate .corp-carousel__stage {
  position: relative;
  height: 348px;
}

.q_sbb_corporate .corp-carousel__slide {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 648px;
  max-width: 100%;
  height: 348px;
  margin: 0;
  display: block;
  border-radius: 20px;
  opacity: 0;
  pointer-events: none;
  text-decoration: none;
  transform: translate(-50%, -50%);
  transition: left .45s ease, transform .45s ease, opacity .45s ease;
}

.q_sbb_corporate .corp-carousel__media {
  position: absolute;
  inset: 0;
  display: block;
  border-radius: 20px;
  background-color: #d3d3d3;
  background-image: var(--cc-image);
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

/* ảnh đang chọn */
.q_sbb_corporate .corp-carousel__slide[data-offset="0"] {
  z-index: 3;
  opacity: 1;
  pointer-events: auto;
  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, .35);
  transform: translate(-50%, -50%) scale(1);
}

/* 2 ảnh hai bên: thu nhỏ, neo vào mép sân khấu và phủ trắng 80% */
.q_sbb_corporate .corp-carousel__slide[data-offset="-1"],
.q_sbb_corporate .corp-carousel__slide[data-offset="1"] {
  z-index: 2;
  opacity: 1;
  cursor: pointer;
  pointer-events: auto;
}

/* scale .86 làm mép co vào (1-.86)/2 = 7%, bù lại bằng translate cho sát lề */
.q_sbb_corporate .corp-carousel__slide[data-offset="-1"] {
  left: 0;
  transform: translate(-7%, -50%) scale(.86);
}

.q_sbb_corporate .corp-carousel__slide[data-offset="1"] {
  left: 100%;
  transform: translate(-93%, -50%) scale(.86);
}

.q_sbb_corporate .corp-carousel__slide[data-offset="-1"] .corp-carousel__media,
.q_sbb_corporate .corp-carousel__slide[data-offset="1"] .corp-carousel__media {
  background-image: linear-gradient(0deg, rgba(255, 255, 255, .8) 0%, rgba(255, 255, 255, .8) 100%), var(--cc-image);
}

.q_sbb_corporate .corp-carousel__arrow {
  position: absolute;
  z-index: 4;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}

.q_sbb_corporate .corp-carousel__wrap.is-scrollable .corp-carousel__arrow {
  display: inline-flex;
}

.q_sbb_corporate .corp-carousel__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_corporate .corp-carousel__arrow:hover { background: #8f6e2e; }
.q_sbb_corporate .corp-carousel__arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_corporate .corp-carousel__arrow--next { right: 0; transform: translate(50%, -50%); }

@media (max-width: 1199.98px) {
  .q_sbb_corporate .corp-carousel { padding: 80px 0; }
  .q_sbb_corporate .corp-carousel .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_corporate .corp-carousel__head { margin-bottom: 40px; }
  .q_sbb_corporate .corp-carousel__title { font-size: 28px; }
  .q_sbb_corporate .corp-carousel__subtitle { font-size: 24px; }
  .q_sbb_corporate .corp-carousel__stage { height: 300px; }
  .q_sbb_corporate .corp-carousel__slide { width: 560px; height: 300px; }
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-carousel { padding: 56px 0; }
  .q_sbb_corporate .corp-carousel .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_corporate .corp-carousel__head { margin-bottom: 28px; }
  .q_sbb_corporate .corp-carousel__title { font-size: 20px; letter-spacing: .4px; }
  .q_sbb_corporate .corp-carousel__subtitle { font-size: 17px; letter-spacing: .34px; }
  .q_sbb_corporate .corp-carousel__stage { height: 190px; }
  .q_sbb_corporate .corp-carousel__slide { width: 100%; height: 190px; }
  /* màn hẹp không đủ chỗ cho 2 ảnh bên, chỉ giữ ảnh giữa */
  .q_sbb_corporate .corp-carousel__slide[data-offset="-1"],
  .q_sbb_corporate .corp-carousel__slide[data-offset="1"] {
    opacity: 0;
    pointer-events: none;
  }
  .q_sbb_corporate .corp-carousel__arrow { width: 34px; height: 34px; }
  .q_sbb_corporate .corp-carousel__arrow svg { width: 17px; height: 17px; }
}

/* ==========================================================================
   SBB Corporate – khối "Vì sao chọn SBB Corporate".
   ========================================================================== */
.q_sbb_corporate .corp-why {
  padding: 200px 0 100px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_corporate .corp-why__title {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .84px;
  text-align: center;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-why__title span {
  color: #f6cb84;
}

/* 2 cột: tiêu đề trái, mô tả phải */
.q_sbb_corporate .corp-why__intro {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px;
  align-items: start;
  margin-top: 70px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.q_sbb_corporate .corp-why__heading {
  margin: 0;
  max-width: 500px;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .64px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-why__desc {
  margin: 0;
  color: #cad5e2;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  text-align: justify;
}

/* --- băng thẻ dịch vụ --- */
.q_sbb_corporate .corp-why__carousel {
  position: relative;
  margin-top: 42px;
}

.q_sbb_corporate .corp-why__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.q_sbb_corporate .corp-why__track::-webkit-scrollbar {
  display: none;
}

.q_sbb_corporate .corp-why__card {
  box-sizing: border-box;
  width: calc((100% - 48px) / 3);
  min-width: calc((100% - 48px) / 3);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-radius: 20px;
  border: 1px solid rgba(245, 238, 224, .2);
  background: rgba(255, 255, 255, .16);
  backdrop-filter: blur(8px);
  scroll-snap-align: start;
}

.q_sbb_corporate .corp-why__card-thumb {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 396 / 220;
  background: rgba(255, 255, 255, .1);
}

.q_sbb_corporate .corp-why__card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.q_sbb_corporate .corp-why__card-icon {
  position: absolute;
  top: 11px;
  left: 11px;
  display: inline-flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #f9f5eb;
}

.q_sbb_corporate .corp-why__card-icon svg {
  display: block;
  width: 34px;
  height: 34px;
}

.q_sbb_corporate .corp-why__card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 4px 4px;
}

.q_sbb_corporate .corp-why__card-badge {
  align-self: flex-start;
  padding: 5px 12px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 60px;
  color: #f5eee0;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: .22px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-why__card-title {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

.q_sbb_corporate .corp-why__card-desc {
  margin: 0;
  color: #cad5e2;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
}

.q_sbb_corporate .corp-why__card-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  color: #f6cb84;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
}

.q_sbb_corporate .corp-why__card-more svg {
  display: block;
  width: 14px;
  height: 14px;
}

.q_sbb_corporate .corp-why__arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease, opacity .2s ease;
}

/* chỉ hiện khi thẻ tràn khỏi khung, đúng 3 thẻ thì không cần nút */
.q_sbb_corporate .corp-why__carousel.is-scrollable .corp-why__arrow {
  display: inline-flex;
}

.q_sbb_corporate .corp-why__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_corporate .corp-why__arrow:hover { background: #8f6e2e; }

.q_sbb_corporate .corp-why__arrow:disabled {
  opacity: .35;
  cursor: default;
}

.q_sbb_corporate .corp-why__arrow:disabled:hover { background: #b49753; }

.q_sbb_corporate .corp-why__arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_corporate .corp-why__arrow--next { right: 0; transform: translate(50%, -50%); }

@media (max-width: 1199.98px) {
  .q_sbb_corporate .corp-why { padding: 170px 0 80px; }
  .q_sbb_corporate .corp-why .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_corporate .corp-why__title { font-size: 32px; }
  .q_sbb_corporate .corp-why__intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    margin-top: 48px;
  }
  .q_sbb_corporate .corp-why__heading { max-width: none; font-size: 24px; }
  .q_sbb_corporate .corp-why__card {
    width: calc((100% - 24px) / 2);
    min-width: calc((100% - 24px) / 2);
  }
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-why { padding: 150px 0 56px; }
  .q_sbb_corporate .corp-why .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_corporate .corp-why__title { font-size: 22px; letter-spacing: .44px; }
  .q_sbb_corporate .corp-why__intro { margin-top: 32px; }
  .q_sbb_corporate .corp-why__heading { font-size: 20px; }
  .q_sbb_corporate .corp-why__desc { font-size: 16px; line-height: 24px; }
  .q_sbb_corporate .corp-why__card { width: 100%; min-width: 100%; }
  .q_sbb_corporate .corp-why__arrow { width: 34px; height: 34px; }
  .q_sbb_corporate .corp-why__arrow svg { width: 17px; height: 17px; }
}

/* ==========================================================================
   SBB Corporate – 3 cụm: Hành trình chăm sóc, Cơ sở vật chất, Trang thiết bị.
   Cùng logic với bên SBB Premium nhưng nền sáng nên chữ và viền đổi hết,
   css riêng để hai trang không kéo nhau.
   ========================================================================== */
.q_sbb_corporate .corp-journey {
  padding: 100px 0;
  background-color: #f5f7fa;
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_corporate .corp-journey__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: 42px;
}

.q_sbb_corporate .corp-journey__logo {
  display: block;
  width: auto;
  max-width: 180px;
  height: auto;
}

.q_sbb_corporate .corp-journey__title {
  margin: 0;
  color: #294664;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .72px;
  text-align: center;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-journey__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.q_sbb_corporate .corp-journey__card {
  position: relative;
  display: flex;
  min-height: 420px;
  align-items: flex-end;
  overflow: hidden;
  border-radius: 16px;
  border-bottom: 4px solid #cfb36c;
  background-color: #d3d3d3;
  background-image: linear-gradient(180deg, rgba(36, 108, 183, 0) 33.8%, #103051 100%), var(--cj-image);
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_corporate .corp-journey__card-body {
  width: 100%;
  padding: 0 20px 28px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.q_sbb_corporate .corp-journey__card-title {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #e7c677;
  font-family: Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-journey__card-icon {
  display: inline-flex;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
}

.q_sbb_corporate .corp-journey__card-icon svg {
  display: block;
  width: 26px;
  height: 26px;
}

.q_sbb_corporate .corp-journey__card-text {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
}

/* --- đầu khối Cơ sở vật chất / Trang thiết bị --- */
.q_sbb_corporate .corp-facility,
.q_sbb_corporate .corp-equip {
  margin-top: 70px;
}

.q_sbb_corporate .corp-block__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 32px;
  padding-bottom: 20px;
  margin-bottom: 28px;
  border-bottom: 1px solid #dbe3ec;
}

.q_sbb_corporate .corp-block__intro {
  max-width: 460px;
}

.q_sbb_corporate .corp-block__title {
  margin: 0 0 10px;
  color: #294664;
  font-family: Arial, sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .6px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-block__desc {
  margin: 0;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
}

/* --- tab dạng viên thuốc, nền sáng --- */
.q_sbb_corporate .corp-facility__tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 6px;
}

.q_sbb_corporate .corp-facility__tab {
  padding: 8px 18px;
  border: 1px solid #cfb36c;
  border-radius: 60px;
  background: #fff;
  color: #916819;
  cursor: pointer;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
  transition: background-color .2s ease, color .2s ease;
}

.q_sbb_corporate .corp-facility__tab:hover { background: #f9f5eb; }

.q_sbb_corporate .corp-facility__tab.is-active {
  background: linear-gradient(0deg, #a78749 0%, #cfb36c 100%);
  color: #fff;
  font-weight: 700;
}

/* --- dải ảnh trượt ngang --- */
.q_sbb_corporate .corp-facility__body {
  position: relative;
}

.q_sbb_corporate .corp-facility__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.q_sbb_corporate .corp-facility__track::-webkit-scrollbar { display: none; }

.q_sbb_corporate .corp-facility__item {
  width: calc((100% - 48px) / 3);
  min-width: calc((100% - 48px) / 3);
  height: 240px;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  scroll-snap-align: start;
}

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

.q_sbb_corporate .corp-arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}

.q_sbb_corporate .corp-facility.is-scrollable .corp-arrow { display: inline-flex; }

.q_sbb_corporate .corp-arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_corporate .corp-arrow:hover { background: #8f6e2e; }
.q_sbb_corporate .corp-arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_corporate .corp-arrow--next { right: 0; transform: translate(50%, -50%); }

/* --- trang thiết bị: hàng ảnh tròn --- */
.q_sbb_corporate .corp-equip__thumbs {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.q_sbb_corporate .corp-equip__thumbs-track {
  display: flex;
  align-items: center;
  gap: 12px;
  overflow-x: auto;
  scrollbar-width: none;
}

.q_sbb_corporate .corp-equip__thumbs-track::-webkit-scrollbar { display: none; }

.q_sbb_corporate .corp-equip__thumb {
  width: 66px;
  height: 66px;
  min-width: 66px;
  aspect-ratio: 1 / 1;
  padding: 0;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 50%;
  background: #eef2f7;
  cursor: pointer;
  opacity: .8;
  transition: border-color .2s ease, opacity .2s ease;
}

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

.q_sbb_corporate .corp-equip__thumb:hover { opacity: 1; }

.q_sbb_corporate .corp-equip__thumb.is-active {
  border-color: #cfb36c;
  opacity: 1;
}

.q_sbb_corporate .corp-equip__more {
  display: inline-flex;
  width: 66px;
  height: 66px;
  min-width: 66px;
  aspect-ratio: 1 / 1;
  padding: 0 6px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border-radius: 50%;
  background: linear-gradient(0deg, #294664 0%, #4a6d94 100%);
  color: #fff;
  cursor: pointer;
  font-family: Arial, sans-serif;
  font-size: 10px;
  line-height: 13px;
  text-align: center;
  text-decoration: none;
  transition: filter .2s ease;
}

.q_sbb_corporate .corp-equip__more:hover { filter: brightness(1.1); }

.q_sbb_corporate .corp-equip__more svg {
  display: block;
  width: 12px;
  height: 12px;
}

/* --- trang thiết bị: ảnh trái, nội dung phải --- */
.q_sbb_corporate .corp-equip__panel {
  display: grid;
  grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}

.q_sbb_corporate .corp-equip__panel[hidden] { display: none; }

.q_sbb_corporate .corp-equip__media {
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
}

.q_sbb_corporate .corp-equip__media img {
  display: block;
  width: 100%;
  height: auto;
}

.q_sbb_corporate .corp-equip__body h3 {
  margin: 0 0 8px;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: normal;
}

.q_sbb_corporate .corp-equip__content,
.q_sbb_corporate .corp-equip__content p,
.q_sbb_corporate .corp-equip__content li {
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
}

/* dòng Model in vàng, thường là đoạn đầu tiên */
.q_sbb_corporate .corp-equip__content > p:first-child {
  color: #a78749;
  font-weight: 700;
}

.q_sbb_corporate .corp-equip__content ul {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.q_sbb_corporate .corp-equip__content li {
  position: relative;
  padding-left: 28px;
}

/* dấu tích vàng thay cho bullet mặc định */
.q_sbb_corporate .corp-equip__content li::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #cfb36c url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

@media (max-width: 1199.98px) {
  .q_sbb_corporate .corp-journey { padding: 80px 0; }
  .q_sbb_corporate .corp-journey .container,
  .q_sbb_corporate .corp-facility,
  .q_sbb_corporate .corp-equip {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_corporate .corp-journey__title { font-size: 28px; }
  .q_sbb_corporate .corp-journey__cards { gap: 16px; }
  .q_sbb_corporate .corp-journey__card { min-height: 360px; }
  .q_sbb_corporate .corp-facility,
  .q_sbb_corporate .corp-equip { margin-top: 56px; }
  .q_sbb_corporate .corp-block__head { flex-direction: column; gap: 18px; }
  .q_sbb_corporate .corp-facility__tabs { justify-content: flex-start; }
  .q_sbb_corporate .corp-block__title { font-size: 24px; }
  .q_sbb_corporate .corp-facility__item {
    width: calc((100% - 16px) / 2);
    min-width: calc((100% - 16px) / 2);
    height: 200px;
  }
  .q_sbb_corporate .corp-equip__panel { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .q_sbb_corporate .corp-equip__media { max-width: 420px; }
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-journey { padding: 56px 0; }
  .q_sbb_corporate .corp-journey .container,
  .q_sbb_corporate .corp-facility,
  .q_sbb_corporate .corp-equip {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_corporate .corp-journey__title { font-size: 22px; letter-spacing: .44px; }
  .q_sbb_corporate .corp-journey__cards { grid-template-columns: minmax(0, 1fr); }
  .q_sbb_corporate .corp-journey__card { min-height: 300px; }
  .q_sbb_corporate .corp-facility__item { width: 100%; min-width: 100%; height: 190px; }
  .q_sbb_corporate .corp-arrow { width: 34px; height: 34px; }
  .q_sbb_corporate .corp-arrow svg { width: 17px; height: 17px; }
  .q_sbb_corporate .corp-equip__body h3 { font-size: 19px; }
}

/* ==========================================================================
   SBB Corporate – khối Đội ngũ chuyên gia và hộp mời sang gói khám khác.
   Nền tối nên chữ đảo sang sáng, css riêng của trang này.
   ========================================================================== */
.q_sbb_corporate .corp-team {
  padding: 100px 0 200px;
  background-color: #1b3a63;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_corporate .corp-team__head {
  max-width: 640px;
  margin: 0 auto 42px;
  text-align: center;
}

.q_sbb_corporate .corp-team__title {
  margin: 0 0 16px;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .72px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-team__desc {
  margin: 0;
  color: #cad5e2;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.q_sbb_corporate .corp-team__carousel {
  position: relative;
}

.q_sbb_corporate .corp-team__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.q_sbb_corporate .corp-team__track::-webkit-scrollbar { display: none; }

.q_sbb_corporate .corp-team__card {
  width: calc((100% - 72px) / 4);
  min-width: calc((100% - 72px) / 4);
  scroll-snap-align: start;
  text-align: center;
}

.q_sbb_corporate .corp-team__photo {
  margin: 0 0 16px;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 3 / 4;
  background: rgba(255, 255, 255, .12);
}

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

.q_sbb_corporate .corp-team__name {
  margin: 0 0 6px;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 24px;
}

.q_sbb_corporate .corp-team__role {
  margin: 0 0 10px;
  color: #f6cb84;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.q_sbb_corporate .corp-team__note {
  margin: 0;
  color: #cad5e2;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.q_sbb_corporate .corp-team__arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #b49753;
  box-shadow: 0 4px 10px rgba(15, 23, 43, .2);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease, opacity .2s ease;
}

.q_sbb_corporate .corp-team__carousel.is-scrollable .corp-team__arrow { display: inline-flex; }

.q_sbb_corporate .corp-team__arrow svg {
  display: block;
  width: 20px;
  height: 20px;
}

.q_sbb_corporate .corp-team__arrow:hover { background: #8f6e2e; }

.q_sbb_corporate .corp-team__arrow:disabled {
  opacity: .35;
  cursor: default;
}

.q_sbb_corporate .corp-team__arrow:disabled:hover { background: #b49753; }
.q_sbb_corporate .corp-team__arrow--prev { left: 0; transform: translate(-50%, -50%); }
.q_sbb_corporate .corp-team__arrow--next { right: 0; transform: translate(50%, -50%); }

/* --- hộp mời sang gói khám khác --- */
.q_sbb_corporate .corp-cross {
  position: relative;
  z-index: 3;
}

/*
  Đè lên nửa dưới khối đội ngũ: translateY(-50%) kéo hộp lên đúng nửa chiều cao
  của chính nó nên không cần biết trước hộp cao bao nhiêu.
*/
.q_sbb_corporate .corp-cross__box {
  box-sizing: border-box;
  padding: 40px;
  border-radius: 24px;
  border: 1.6px solid #cfb36c;
  background-image: linear-gradient(270deg, rgba(207, 179, 108, .1) 6.34%, #bd9f5d 43.11%, #a78749 100%),
                    var(--cx-image, none);
  background-color: #a78749;
  background-position: center, right center;
  background-size: cover, 48.333% 159.536%;
  background-repeat: no-repeat, no-repeat;
  box-shadow: 0 6px 20px 0 rgba(0, 0, 0, .2);
  transform: translateY(-50%);
}

.q_sbb_corporate .corp-cross__title {
  margin: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 37.5px;
}

.q_sbb_corporate .corp-cross__desc {
  margin: 8px 0 0;
  max-width: 620px;
  color: #f5eee0;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24.375px;
}

.q_sbb_corporate .corp-cross__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 24px;
}

.q_sbb_corporate .corp-cross__card {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 6px;
  border-radius: 60px;
  border: 1px solid #cfb36c;
  background: #fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease;
}

.q_sbb_corporate .corp-cross__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px -8px rgba(0, 0, 0, .22);
}

.q_sbb_corporate .corp-cross__icon {
  flex: 0 0 56px;
  display: flex;
  width: 56px;
  height: 56px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.q_sbb_corporate .corp-cross__icon svg {
  display: block;
  width: 32px;
  height: 32px;
}

.q_sbb_corporate .corp-cross__card--premium .corp-cross__icon {
  background: linear-gradient(180deg, #cfb36c 0%, #a78749 100%);
}

.q_sbb_corporate .corp-cross__card--corporate .corp-cross__icon {
  background: linear-gradient(180deg, #30649e 0%, #294664 100%);
}

.q_sbb_corporate .corp-cross__card--basic .corp-cross__icon {
  background: linear-gradient(180deg, #96b2d4 0%, #3b73b3 100%);
}

.q_sbb_corporate .corp-cross__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.q_sbb_corporate .corp-cross__name {
  color: #916819;
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .4px;
}

.q_sbb_corporate .corp-cross__card--corporate .corp-cross__name { color: #294664; }
.q_sbb_corporate .corp-cross__card--basic .corp-cross__name { color: #3b73b3; }

.q_sbb_corporate .corp-cross__sub {
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

.q_sbb_corporate .corp-cross__arrow {
  flex: 0 0 24px;
  display: block;
  width: 24px;
  height: 24px;
  margin-right: 12px;
}

.q_sbb_corporate .corp-cross__arrow svg {
  display: block;
  width: 24px;
  height: 24px;
}

@media (max-width: 1199.98px) {
  .q_sbb_corporate .corp-team { padding: 80px 0 160px; }
  .q_sbb_corporate .corp-team .container,
  .q_sbb_corporate .corp-cross .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_corporate .corp-team__title { font-size: 28px; }
  .q_sbb_corporate .corp-team__track { gap: 16px; }
  .q_sbb_corporate .corp-team__card {
    width: calc((100% - 32px) / 3);
    min-width: calc((100% - 32px) / 3);
  }
  .q_sbb_corporate .corp-cross__box { padding: 28px; }
  .q_sbb_corporate .corp-cross__title { font-size: 28px; line-height: 34px; }
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-team { padding: 56px 0 110px; }
  .q_sbb_corporate .corp-team .container,
  .q_sbb_corporate .corp-cross .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_corporate .corp-team__title { font-size: 22px; letter-spacing: .44px; }
  .q_sbb_corporate .corp-team__card {
    width: calc((100% - 16px) / 2);
    min-width: calc((100% - 16px) / 2);
  }
  .q_sbb_corporate .corp-team__arrow { width: 34px; height: 34px; }
  .q_sbb_corporate .corp-team__arrow svg { width: 17px; height: 17px; }
  /* màn hẹp hộp cao gấp đôi, đè 50% sẽ trùm hết khối trên nên chỉ đè nhẹ */
  .q_sbb_corporate .corp-cross__box {
    padding: 20px;
    background-size: cover, 0 0;
    transform: translateY(-24px);
  }
  .q_sbb_corporate .corp-cross__title { font-size: 22px; line-height: 28px; }
  .q_sbb_corporate .corp-cross__desc { font-size: 15px; line-height: 22px; }
  .q_sbb_corporate .corp-cross__cards { flex-direction: column; }
  .q_sbb_corporate .corp-cross__card { width: 100%; }
  .q_sbb_corporate .corp-cross__arrow { margin-left: auto; margin-right: 8px; }
}

/* ==========================================================================
   SBB Corporate – khối Tin mới nhất. Css riêng, không dùng chung với khối
   Góc sức khoẻ bên Premium hay khối tin của trang Tin tức.
   ========================================================================== */
.q_sbb_corporate .corp-news {
  padding: 0 0 100px;
  background: #fff;
}

.q_sbb_corporate .corp-news__head {
  max-width: 720px;
  margin: 0 auto 42px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: center;
}

.q_sbb_corporate .corp-news__title {
  margin: 0;
  color: #294664;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .72px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-news__desc {
  margin: 0;
  color: #0f172b;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.q_sbb_corporate .corp-news__layout {
  display: grid;
  grid-template-columns: minmax(0, 660px) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
}

.q_sbb_corporate .corp-news__layout--solo {
  grid-template-columns: minmax(0, 1fr);
}

/* --- tin lớn bên trái --- */
.q_sbb_corporate .corp-news__lead {
  display: flex;
  flex-direction: column;
  padding: 16px;
  border: 1px solid #eaeaea;
  border-radius: 20px;
  background: #fffdf9;
  text-decoration: none;
  transition: box-shadow .25s ease, transform .25s ease;
}

.q_sbb_corporate .corp-news__lead:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px -10px rgba(15, 23, 43, .22);
}

/* ảnh nhận phần cao dư nên 2 cột luôn bằng nhau; min-height giữ khổ thiết kế */
.q_sbb_corporate .corp-news__lead-thumb {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  min-height: 400px;
  overflow: hidden;
  border-radius: 10px;
  background: #eef2f7;
}

.q_sbb_corporate .corp-news__lead-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.q_sbb_corporate .corp-news__lead-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 16px;
}

.q_sbb_corporate .corp-news__lead-title {
  display: block;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.q_sbb_corporate .corp-news__lead-desc {
  display: block;
  color: #4b4b4b;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}

.q_sbb_corporate .corp-news__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #c5a059;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.q_sbb_corporate .corp-news__more svg {
  display: block;
  width: 14px;
  height: 14px;
}

/* --- nhãn chuyên mục và ngày --- */
.q_sbb_corporate .corp-news__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.q_sbb_corporate .corp-news__badge {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border-radius: 60px;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: normal;
  text-transform: uppercase;
  white-space: nowrap;
}

.q_sbb_corporate .corp-news__badge--outline {
  border: 1px solid #c5a059;
  background: #f9f5eb;
  color: #916819;
  font-weight: 400;
}

.q_sbb_corporate .corp-news__badge--solid {
  background: #c5a059;
  color: #fff;
  font-weight: 700;
}

/* --- danh sách tin nhỏ bên phải --- */
.q_sbb_corporate .corp-news__list {
  display: flex;
  flex-direction: column;
  gap: 17px;
}

.q_sbb_corporate .corp-news__item {
  display: flex;
  gap: 16px;
  padding: 12px 16px;
  border: 1px solid #eaeaea;
  border-radius: 20px;
  background: #fff;
  text-decoration: none;
  transition: border-color .25s ease, box-shadow .25s ease;
}

.q_sbb_corporate .corp-news__item:hover {
  border-color: #c5a059;
  box-shadow: 0 10px 20px -12px rgba(15, 23, 43, .25);
}

.q_sbb_corporate .corp-news__item-thumb {
  display: block;
  width: 200px;
  min-width: 200px;
  aspect-ratio: 200 / 127;
  overflow: hidden;
  border-radius: 10px;
  background: #eef2f7;
}

.q_sbb_corporate .corp-news__item-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.q_sbb_corporate .corp-news__item-body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 10px;
}

.q_sbb_corporate .corp-news__item-title {
  display: block;
  color: #0f172a;
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
}

/* --- nút xem thêm --- */
.q_sbb_corporate .corp-news__foot {
  margin-top: 42px;
  text-align: center;
}

.q_sbb_corporate .corp-news__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
  border-radius: 60px;
  background: #294664;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: .28px;
  text-decoration: none;
  text-transform: uppercase;
  transition: background-color .2s ease;
}

.q_sbb_corporate .corp-news__btn:hover { background: #1d3350; }

.q_sbb_corporate .corp-news__btn svg {
  display: block;
  width: 16px;
  height: 16px;
}

@media (max-width: 1199.98px) {
  .q_sbb_corporate .corp-news { padding-bottom: 80px; }
  .q_sbb_corporate .corp-news .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_corporate .corp-news__title { font-size: 28px; }
  .q_sbb_corporate .corp-news__layout { grid-template-columns: minmax(0, 1fr); }
  .q_sbb_corporate .corp-news__lead-thumb { min-height: 320px; }
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-news { padding-bottom: 56px; }
  .q_sbb_corporate .corp-news .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_corporate .corp-news__head { margin-bottom: 28px; gap: 12px; }
  .q_sbb_corporate .corp-news__title { font-size: 22px; letter-spacing: .44px; }
  .q_sbb_corporate .corp-news__desc { font-size: 15px; line-height: 22px; }
  .q_sbb_corporate .corp-news__lead-thumb { min-height: 220px; }
  .q_sbb_corporate .corp-news__lead-title { font-size: 20px; line-height: 28px; }
  .q_sbb_corporate .corp-news__lead-desc { font-size: 16px; line-height: 24px; }
  /* ảnh 200px chiếm quá nửa bề ngang, xếp dọc cho dễ đọc */
  .q_sbb_corporate .corp-news__item { flex-direction: column; }
  .q_sbb_corporate .corp-news__item-thumb { width: 100%; min-width: 0; }
  .q_sbb_corporate .corp-news__item-title { font-size: 17px; line-height: 24px; }
}

/* ==========================================================================
   SBB Corporate – khối Đối tác / Khách hàng.
   Một hàng ngang: ô đang mở giãn thành thẻ đánh giá, các ô còn lại co về ô logo.
   Thứ tự hiển thị do js xoay vòng nên ô đang mở luôn nằm giữa hàng.
   ========================================================================== */
.q_sbb_corporate .corp-partner {
  padding: 80px 0 100px;
  background: #f1f5f9;
}

.q_sbb_corporate .corp-partner__head {
  max-width: 760px;
  margin: 0 auto 42px;
  text-align: center;
}

.q_sbb_corporate .corp-partner__title {
  margin: 0 0 16px;
  color: #294664;
  font-family: Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .72px;
  text-transform: uppercase;
}

.q_sbb_corporate .corp-partner__desc {
  margin: 0;
  color: #0f172b;
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

/*
  Dạng slide: khung ngoài cắt phần thừa, dải bên trong trượt bằng transform để
  ô đang mở luôn nằm chính giữa — kể cả ô đầu và ô cuối.
*/
.q_sbb_corporate .corp-partner__viewport {
  overflow: hidden;
  min-height: 300px;
  display: flex;
  align-items: center;
}

.q_sbb_corporate .corp-partner__row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 16px;
  /* cùng thời lượng và nhịp với hiệu ứng co giãn của ô, để 2 chuyển động ăn khớp */
  transition: transform .38s cubic-bezier(.4, 0, .2, 1);
  will-change: transform;
}

/* --- ô đóng: hộp logo --- */
/*
  Cả 2 trạng thái đều có width và height bằng số cụ thể nên co giãn chạy được
  hoạt ảnh. height khi mở do js đo nội dung rồi ghi vào --pt-open-height:
  height:auto không bao giờ animate được, để auto là giật.
*/
.q_sbb_corporate .corp-partner__item {
  box-sizing: border-box;
  position: relative;
  flex: 0 0 auto;
  --pt-closed-width: 200px;
  --pt-open-width: 420px;
  --pt-open-height: 260px;
  width: var(--pt-closed-width);
  height: 100px;
  padding: 18px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid #cad5e2;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  text-align: left;
  transition: width .38s cubic-bezier(.4, 0, .2, 1), height .38s cubic-bezier(.4, 0, .2, 1),
              border-radius .38s ease, box-shadow .3s ease, border-color .3s ease;
}

.q_sbb_corporate .corp-partner__item:hover { border-color: #cfb36c; }

/* logo phủ hết phần trống trong ô, contain nên không méo dù logo ngang hay dọc */
.q_sbb_corporate .corp-partner__logo {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.q_sbb_corporate .corp-partner__logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* nội dung đánh giá chỉ tồn tại khi ô mở, để ô đóng không bị giãn theo chữ */
/*
  Panel nằm ngoài luồng (absolute) nên bật/tắt nó không đụng tới kích thước ô —
  kích thước đã do width/height quyết định. Nhờ vậy không còn cú nhảy bố cục.
*/
.q_sbb_corporate .corp-partner__panel {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  padding: 24px;
  flex-direction: column;
  gap: 14px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
}

/* --- ô đang mở: thẻ đánh giá --- */
.q_sbb_corporate .corp-partner__item.is-active {
  width: var(--pt-open-width);
  height: var(--pt-open-height);
  border-color: transparent;
  border-radius: 12px;
  /*
    Gradient xanh chồng lên ảnh nền theo kiểu multiply. Ảnh truyền qua biến
    --pt-card-bg trong markup nên css không cần biết đường dẫn.
  */
  background-image: linear-gradient(180deg, rgba(48, 100, 158, .9) 0%, rgba(41, 70, 100, .9) 100%),
                    var(--pt-card-bg, none);
  background-color: #294664;
  background-position: center, 50%;
  background-size: cover, cover;
  background-repeat: no-repeat, no-repeat;
  background-blend-mode: multiply, normal;
  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .2);
  cursor: default;
}

.q_sbb_corporate .corp-partner__logo {
  transition: opacity .18s ease;
}

/* lúc js đo chiều cao nội dung: tắt hết hiệu ứng để không thấy ô chớp */
.q_sbb_corporate .corp-partner__row.is-measuring,
.q_sbb_corporate .corp-partner__row.is-measuring * {
  transition: none !important;
}

.q_sbb_corporate .corp-partner__item.is-active .corp-partner__logo {
  opacity: 0;
  pointer-events: none;
}

.q_sbb_corporate .corp-partner__item.is-active .corp-partner__panel {
  opacity: 1;
  pointer-events: auto;
  /* chờ ô nở gần xong mới hiện chữ cho đỡ rối mắt */
  transition-delay: .16s;
}

.q_sbb_corporate .corp-partner__panel-head {
  display: flex;
  align-items: center;
  gap: 14px;
}

.q_sbb_corporate .corp-partner__avatar {
  display: block;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  border: 1px solid #cad5e2;
  border-radius: 80px;
  background-color: #fff;
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

.q_sbb_corporate .corp-partner__meta {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.q_sbb_corporate .corp-partner__name {
  color: #cfb36c;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

.q_sbb_corporate .corp-partner__role {
  color: #cad5e2;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: .2px;
}

.q_sbb_corporate .corp-partner__quote {
  display: block;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  text-align: justify;
}

@media (max-width: 1199.98px) {
  .q_sbb_corporate .corp-partner { padding: 60px 0 80px; }
  .q_sbb_corporate .corp-partner .container {
    padding-right: 34px;
    padding-left: 34px;
  }
  .q_sbb_corporate .corp-partner__title { font-size: 28px; }
  .q_sbb_corporate .corp-partner__row { gap: 12px; }
  .q_sbb_corporate .corp-partner__item { --pt-closed-width: 168px; --pt-open-width: 360px; height: 88px; padding: 14px 12px; }
  .q_sbb_corporate .corp-partner__panel { padding: 20px; }

  .q_sbb_corporate .corp-partner__quote { font-size: 16px; line-height: 24px; }
}

@media (max-width: 767px) {
  .q_sbb_corporate .corp-partner { padding: 48px 0 56px; }
  .q_sbb_corporate .corp-partner .container {
    padding-right: 28px;
    padding-left: 28px;
  }
  .q_sbb_corporate .corp-partner__title { font-size: 22px; letter-spacing: .44px; }
  .q_sbb_corporate .corp-partner__desc { font-size: 15px; line-height: 22px; }
  /*
    Màn hẹp không đủ chỗ cho một hàng ngang, chuyển thành danh sách xếp dọc:
    ô đang mở giãn cao ra, các ô còn lại vẫn là hộp logo.
  */
  .q_sbb_corporate .corp-partner__viewport { min-height: 0; }
  .q_sbb_corporate .corp-partner__row { gap: 10px; }
  .q_sbb_corporate .corp-partner__item {
    --pt-closed-width: 140px;
    --pt-open-width: min(320px, 78vw);
    height: 76px;
  }
  .q_sbb_corporate .corp-partner__panel { padding: 18px; }
  .q_sbb_corporate .corp-partner__quote { font-size: 15px; line-height: 23px; }
}