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

@font-face {
	font-family: 'Manrope';
	font-display: swap;
  src: url(../fonts/Manrope-SemiBold.woff2) format('woff2'), url(../fonts/Manrope-SemiBold.woff) format('woff');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Manrope';
	font-display: swap;
  src: url(../fonts/Manrope-Bold.woff2) format('woff2'), url(../fonts/Manrope-Bold.woff) format('woff');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: "Poppins", sans-serif;
	font-display: swap;
	src: url(../fonts/Poppins-Light.ttf) format('ttf');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: "Poppins", sans-serif;
	font-display: swap;
	src: url(../fonts/Poppins-Regular.ttf) format('ttf');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "Poppins", sans-serif;
	font-display: swap;
	src: url(../fonts/Poppins-Medium.ttf) format('ttf');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: "Poppins", sans-serif;
	font-display: swap;
	src: url(../fonts/Poppins-SemiBold.ttf) format('ttf');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: "Poppins", sans-serif;
	font-display: swap;
	src: url(../fonts/Poppins-Bold.ttf) format('ttf');
	font-weight: 700;
	font-style: normal;
}

:root {
  --hk-primary: #0d6efd;
  --hk-text: rgba(0, 0, 0, 1);
  --hk-muted: #6c757d;
  --hk-bg: #f8f9fa;
  --hk-deep: #00416b;
  --hk-ice: #eef5f9;
  --hk-topbar: #df2818;
  --white: #ffffff;
  --hk-green: #2E9B5A;
}

body {
  font-family: "Poppins", sans-serif;
  color: var(--hk-text);
  background-color: #fff;
  margin: 0;
  font-weight: 400;
}

a{
  outline: none;
}

ul,ol{
  margin: 0;
  padding: 0;
  list-style: none;
}

.post, .page{
  margin: 0;
}

a {
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.py-lg-6 {
  padding-top: 6rem !important;
  padding-bottom: 6rem !important;
}

.cmn-tag{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 16px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.blue-tag{
  background-color: rgb(121 215 255 / 18%);
  color: var(--hk-deep);
}

.red-tag{
  background-color: rgb(223 40 24 / 10%);
  color: var(--hk-topbar);
}

.topbar {
  background-color: var(--hk-topbar);
}

.top-bar-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 35px;
  padding: 5px 0;
}

.topbar-left-side {
  display: flex;
  align-items: center;
  column-gap: 16px;
}

.topbar-left-side a {
  color: #fff;
  display: flex;
  align-items: center;
  column-gap: 4px;
  font-size: 13px;
  line-height: 18px;
}

.topbar-left-side a:hover {
  opacity: 0.7;
}

.topbar-right-side {
  display: flex;
  align-items: center;
  column-gap: 15px;
}

.social-icons {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
}

.social-icons:hover {
  transform: scale(1.1);
}

.header-logo {
  max-width: 135px;
  padding: 0;
  margin: 0;
  transition: max-width 0.35s ease;
}

.hk-navbar {
  background-color: var(--hk-deep) !important;
  min-height: 84px;
  padding: 5px 0;
  transition: min-height 0.35s ease, padding 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease;
}
.hk-navbar.hk-navbar-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  min-height: 70px;
  padding: 2px 0;
  box-shadow: 0 5px 20px rgba(0, 65, 107, 0.35);
  animation: hkNavSlideDown 0.38s ease-out;
}
.hk-navbar.hk-navbar-sticky .header-logo {
  max-width: 110px;
}
@keyframes hkNavSlideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}
.hk-navbar-spacer {
  transition: none;
}
.hk-navbar .navbar-brand {
  color: #fff;
}
.hk-navbar .navbar-toggler {
  border-color: rgba(255, 255, 255, 0.25);
}
.hk-navbar .navbar-toggler-icon {
  filter: invert(1);
}
.hk-navbar .nav-link,
.book-appointment-btn {
  background: rgba(255, 255, 255, 0.07);
  border-radius: 999px;
  padding: 10px 20px !important;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
  min-height: 54px;
  color: #fff;
}
.hk-navbar .nav-link:hover,
.hk-navbar .nav-link:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
}
.hk-navbar-sticky.hk-navbar .nav-link{
  padding: 8px 16px !important;
  font-size: 16px;
  line-height: 26px;
  min-height: 44px;
}

.hk-navbar-sticky.hk-navbar .nav-link img,
.hk-navbar-sticky .book-appointment-btn svg{
  width: 26px;
  height: 26px;
}
.hk-navbar .btn-primary {
  background: #fff;
  color: var(--hk-deep);
  border: none;
}
.hk-navbar .btn-primary:hover {
  filter: brightness(0.95);
}

.hk-navbar .nav-link img,
.book-appointment-btn svg {
  width: 30px;
  height: 30px;
  margin: 0;
  transition: width 0.35s ease, height 0.35s ease;
}

.book-appointment-btn{
  margin-left: 8px;
  border: 0;
}

.book-appointment-btn .latepoint-book-button{
  color: #fff;
}

.hk-navbar-sticky .book-appointment-btn {
  padding: 8px 16px !important;
  font-size: 16px;
  line-height: 26px;
  min-height: 44px;
}

/* Offcanvas tweaks */
.offcanvas .nav-link {
  color: var(--hk-text);
  padding: 0.75rem 0;
}
.offcanvas .nav-link i {
  margin-right: 0.5rem;
}
.offcanvas .nav-link:hover {
  color: var(--hk-deep);
}

/* Dropdown animation: slide up on open */
.dropdown-menu {
  background: rgba(255, 255, 255, 1);
  transform: translateY(70px);
  top: 70px;
  opacity: 0;
  transition: transform 0.3s ease-out, opacity 0.3s ease-out;
  border-radius: 10px;
  padding: 12px 0px;
  max-width: 400px;
  min-width: 400px;
  display: inline-flex;
  flex-direction: column;
  visibility: hidden;
  left: 0;
}
.dropdown-menu.show {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
  display: flex;
  flex-direction: column;
  row-gap: 5px;
}
.dropdown-item {
  border-radius: 0px;
  display: flex;
  align-items: flex-start;
  column-gap: 10px;
  padding: 8px 10px;
  color: #000;
}
.dropdown-item:hover {
  background-color: rgb(247 247 247);
  color: #000;
}

/* .dropdown-item:visited{
  color: #000;
} */

.dropdown-menu-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  color: var(--hk-deep);
}

.dropdown-menu-heading {
  display: flex;
  flex-direction: column;
  width: calc(100% - 42px);
}

.dropdown-menu-heading p {
  margin-bottom: 0;
  font-size: 13px;
  color: rgba(100, 100, 100, 1);
  display: none;
}

.icon-circle {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
}

.object-fit-cover {
  object-fit: cover;
}

.navbar .nav-link.dropdown-toggle:after {
  border: 0px;
  background-image: url(../images/dropdown-icon.svg);
  background-repeat: no-repeat;
  background-position: right;
  width: 10px;
  height: 5px;
  background-size: contain;
  margin: 0;
}

.btn-primary {
  --bs-btn-bg: var(--hk-primary);
  --bs-btn-border-color: var(--hk-primary);
}

.text-secondary {
  color: var(--hk-muted) !important;
}

.common-padding {
  padding: 80px 0;
}

/* New sections */
.bg-deep {
  background-color: var(--hk-deep);
}
.bg-ice {
  background-color: rgba(0, 64, 108, 0.06);
}

.partner-logo {
  opacity: 0.8;
  height: 28px;
}

.hero-mosaic {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}
.hero-mosaic img {
  width: 100%;
  height: 140px;
  object-fit: cover;
  border-radius: 0.75rem;
}

.mosaic-sm img {
  width: 120px;
  height: 90px;
  border-radius: 0.75rem;
  object-fit: cover;
}

.header-section-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 10px;
  margin-bottom: 35px;
}

.header-section-alt-center {
  text-align: left;
  align-items: flex-start;
  margin-bottom: 40px;
}

.cmn-section-title {
  font-size: 50px;
  line-height: 64px;
  margin-bottom: 0;
  letter-spacing: -2.75px;
  font-weight: 400;
  color: rgba(0, 65, 107, 1);
  text-transform: capitalize;
  position: relative;
  display: flex;
  flex-direction: column;
  padding-bottom: 18px;
}

.cmn-section-sub {
  font-size: 30px;
  line-height: 36px;
  font-weight: 500;
  /* letter-spacing: -1.5px; */
  margin: 0;
  color: rgba(0, 0, 0, 1);
}

.custom-tabbing-wrapper {
  column-gap: 20px;
  justify-content: center;
  margin-bottom: 120px;
}

.feature-tile {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.75rem;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.feature-tile i {
  font-size: 1.5rem;
}
.feature-tile span {
  font-size: 0.95rem;
}

.card.lang {
  border: 0;
  overflow: hidden;
  border-radius: 0.75rem;
}
.card.lang .card-img {
  height: 160px;
  object-fit: cover;
  filter: saturate(1.1);
}

.avatar {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  object-fit: cover;
}

/* hero banner */
.hero-banner-section,
.insight-sections {
  position: relative;
}

/* .hero-banner-section:before, */
.insight-sections:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../images/gradient-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
  opacity: 0.2;
}

.hero-banner-left-side {
  /* padding: 120px 0; */
  max-width: 660px;
  padding: 60px 0
}

.hero-banner-left-side .hero-sub-tag{
  margin-bottom: 10px;
}

.hero-banner-left-side .hero-title{
  margin-bottom: 25px;
}

.hero-banner-left-side .hero-banner-text{
  margin-bottom: 30px;
}

.hero-banner-wrapper {
  display: flex;
  justify-content: space-between;
  /* align-items: center; */
  align-items: stretch;
}

.hero-sub-tag {
  background-color: rgb(223 40 24 / 10%);
  color: var(--hk-topbar);
  padding: 6px 14px;
  display: inline-flex;
  border-radius: 999px;
  font-size: 14px;
  line-height: 20px;
}

.hero-title {
  font-size: 70px;
  line-height: 78px;
  font-weight: 500;
  margin: 0;
}

.hero-title .red-text {
  font-weight: 700;
}

.hero-banner-text {
  font-weight: 300;
  font-size: 26px;
  line-height: 40px;
  color: #000;
  margin: 40px 0;
}

.hero-banner-btn-wrap {
  display: flex;
  align-items: center;
  column-gap: 10px;
}

.our-partners-wrapper {
  margin-top: 60px;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.our-partners-title {
  font-size: 30px;
  line-height: 47px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  margin-bottom: 0;
}

.client-logo-marquee-wrapper {
  position: relative;
}

.client-logo-marquee {
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.hk-logo-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  width: auto;
  overflow: hidden;
  animation-name: marquee-to-left;
  animation-duration: 30s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.hk-logo-marquee {
  height: 60px;
  border-radius: 0px;
  padding: 0px 20px 0px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-banner-right-side {
  max-width: 600px;
}

.slider-container {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 15px;
  height: 100%;
}

.slider-box {
  height: 100%;
  width: 295px;
  overflow: hidden;
}

.slider-box .bx-wrapper {
  height: 100vh;
  box-shadow: none;
  border: 0;
  background: transparent;
  margin: 0;
}

.slider-box .bxslider li {
  position: relative;
  margin-bottom: 20px;
}

.slider-box .bxslider li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 50px;
}

.slider-box img {
  width: 100%;
  display: block;
  border-radius: 50px;
}

@keyframes marquee-to-left {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

/* google rating & counter */
.grcounter-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-top: 48px;
  width: 100%;
  max-width: 100%;
  flex-direction: column;
}

.grcounter-rating {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  padding: 8px 12px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.2);
  border-radius: 16px;
  box-shadow: 0 6px 24px rgba(0, 65, 107, 0.08);
}

.grcounter-rating-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

.grcounter-rating-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.grcounter-stars {
  display: flex;
  align-items: center;
  gap: 2px;
  color: #f4b400;
  font-size: 11px;
  line-height: 1;
}

.grcounter-rating-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.3;
  color: var(--hk-muted);
  white-space: nowrap;
}

.grcounter-rating-score {
  font-weight: 700;
  color: var(--hk-deep);
}

.grcounter-rating-label {
  margin-left: 4px;
  font-weight: 400;
  color: var(--hk-muted);
}

.grcounter-counters {
  display: flex;
  flex: 1;
  width: 100%;
  align-items: stretch;
  padding: 16px 2px;
  background: rgba(0, 64, 108, 0.06);
  border: 1px solid rgba(0, 65, 107, 0.2);
  border-radius: 16px;
  box-shadow: 0 6px 24px rgba(0, 65, 107, 0.08);
}

.grcounter-card {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 4px;
  border-left: 1px solid rgba(0, 65, 107, 0.2);
}

.grcounter-card:first-child {
  border-left: none;
}

.grcounter-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  color: var(--hk-deep);
  font-size: 20px;
  line-height: 1;
}

.grcounter-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: calc(100% - 34px);
}

.grcounter-number {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--hk-deep);
}

.grcounter-label {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.25;
  color: var(--hk-muted);
}


/* New Services section */
.nservices-section {
  position: relative;
  overflow: hidden;
  background:#f6f7fc url(../images/new-services-section-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.nservices-section .container {
  position: relative;
  z-index: 1;
}

.cmn-section-title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 48px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
}
.header-section-alt-center .cmn-section-title::after{
  left: 0;
  transform: none;
}
.red-text {
  color: var(--hk-topbar);
}
.blue-text{
  color: var(--hk-deep);
}
.green-text{
  color: var(--hk-green);
}
.nservices-tabs {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: center;
  gap: 14px;
  margin-bottom: 40px;
  border: 0;
}
.nservices-tabs .nav-item {
  flex: 1;
  max-width: 155px;
}
.nservices-tabs .nav-link.nservices-tab {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  padding: 18px 10px 16px;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.08);
  color: var(--hk-deep);
  cursor: pointer;
  transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
  text-align: center;
}
.nservices-tabs .nav-link.nservices-tab:hover {
  border-color: rgba(0, 65, 107, 0.2);
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.12);
  transform: translateY(-2px);
  color: var(--hk-deep);
  background: #ffffff;
}
.nservices-tabs .nav-link.nservices-tab.active {
  border-color: rgba(0, 65, 107, 0.22);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.14);
  color: var(--hk-deep);
  background: #ffffff;
}
.nservices-tab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 24px;
  line-height: 1;
  flex-shrink: 0;
}
.nservices-tab-icon-red {
  color: #df2818;
  background: rgba(223, 40, 24, 0.12);
}
.nservices-tab-icon-blue {
  color: #025d98;
  background: rgba(2, 93, 152, 0.12);
}
.nservices-tab-icon-green {
  color: #2e9b5a;
  background: rgba(46, 155, 90, 0.12);
}
.nservices-tab-icon-purple {
  color: #5f6cde;
  background: rgba(95, 108, 222, 0.12);
}
.nservices-tab-icon-orange {
  color: #e8a317;
  background: rgba(232, 163, 23, 0.14);
}
.nservices-tab-icon-teal {
  color: #0d9b8a;
  background: rgba(13, 155, 138, 0.12);
}
.nservices-tab-icon-yellow {
  color: #c9a000;
  background: rgba(201, 160, 0, 0.14);
}
.nservices-tab-icon-maroon {
  color: #8b1f2d;
  background: rgba(139, 31, 45, 0.12);
}
.nservices-tab-label {
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
  color: var(--hk-deep);
  letter-spacing: -0.2px;
}
.nservices-tab-content {
  margin-bottom: 32px;
}
.nservices-tab-content > .tab-pane {
  display: none;
}
.nservices-tab-content > .tab-pane.active {
  display: block;
}
.nservices-tab-content > .tab-pane.fade.active.show {
  opacity: 1;
}

/* Responsive tab dropdowns (≤1199px) — shared for services & blog tabs */
.services-tabs-dropdown-wrap,
.blog-tabs-dropdown-wrap {
  display: none;
  margin-bottom: 40px;
}

.services-tabs-select,
.blog-tabs-select {
  width: 100%;
  padding: 14px 44px 14px 16px;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
  color: var(--hk-deep);
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 12px;
  background-color: #fff;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.08);
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2300416b' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 14px;
}

.services-tabs-select:focus,
.blog-tabs-select:focus {
  outline: none;
  border-color: rgba(0, 65, 107, 0.28);
  box-shadow: 0 0 0 3px rgba(0, 65, 107, 0.12);
}

@media (max-width: 1199px) {
  /* Hide tab nav rows */
  .nav.services-tabs,
  .nav.nservices-tabs,
  .blog-tabs[role="tablist"] {
    display: none !important;
  }
  /* Show dropdown when active */
  .services-tabs-dropdown-wrap.is-visible,
  .blog-tabs-dropdown-wrap.is-visible {
    display: block;
  }
}

@media (min-width: 1200px) {
  /* Always hide dropdowns on desktop */
  .services-tabs-dropdown-wrap,
  .blog-tabs-dropdown-wrap {
    display: none !important;
  }
}

/* Select2 overrides for services tab dropdown */
.common-select2-wrap .select2-container {
  width: 100% !important;
}

.common-select2-wrap .select2-container.select2-container--focus .select2-selection{
  box-shadow: none !important;
}

.common-select2-wrap .select2-container--default .select2-selection--single {
  height: auto;
  padding: 13px 44px 13px 16px;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 12px;
  background-color: #fff;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.08);
}

.common-select2-wrap .select2-container--default .select2-selection--single .select2-selection__rendered {
  font-size: 15px;
  font-weight: 600;
  color: var(--hk-deep);
  line-height: 1.4;
  padding: 0;
}

.common-select2-wrap .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%;
  right: 14px;
  top: 0;
}

.common-select2-wrap .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--hk-deep) transparent transparent transparent;
  border-width: 6px 5px 0 5px;
}

.common-select2-wrap .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--hk-deep) transparent;
  border-width: 0 5px 6px 5px;
}

.common-select2-wrap .select2-container--default.select2-container--focus .select2-selection--single,
.common-select2-wrap .select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--hk-deep);
  box-shadow: 0 0 0 3px rgba(0, 65, 107, 0.12);
  outline: none;
}

.common-select2-wrap .select2-dropdown {
  border: 1px solid rgba(0, 65, 107, 0.15);
  border-radius: 12px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.12);
  overflow: hidden;
  margin-top: 4px;
}

.common-select2-wrap .select2-results__option {
  font-size: 14px;
  font-weight: 500;
  color: var(--hk-deep);
  padding: 11px 16px;
  transition: background 0.2s ease;
}

.common-select2-wrap .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--hk-ice);
  color: var(--hk-deep);
}

.common-select2-wrap .select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: var(--hk-deep);
  color: #fff;
}

/* TABBING CONTENT - COMMON SECTIONS CSS */

/* Tab panel wrapper */
.homepage-tabs {
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.tab-hero:empty,
.tab-specific-content:empty,
.tab-cta:empty {
  display: none;
}

.tab-main {
  display: flex;
  flex-direction: column;
  gap: 28px;
  background: #ffffff;
  padding: 20px;
  border-radius: 24px;
  border: 1px solid rgba(0, 65, 107, 0.08);
  box-shadow: 0 12px 40px rgba(0, 65, 107, 0.1);
}

/* Common Hero Section */
.tab-hero {
  position: relative;
  overflow: hidden;
}

.tab-hero-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 56px;
}

.tab-hero-content {
  flex: 0 0 650px;
  max-width: 650px;
  min-width: 0;
}

.tab-hero-media {
  position: relative;
  flex: 1;
  align-self: stretch;
  display: flex;
  align-items: center;
  max-width: 550px;
  height: 350px;
}

.tab-hero-title {
  margin: 0 0 20px;
  padding: 0;
}

.tab-hero-title::after {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  margin-top: 16px;
  background: var(--hk-topbar);
  border-radius: 2px;
}

.tab-hero-title-line {
  display: block;
  font-size: 42px;
  line-height: 50px;
  font-weight: 700;
  letter-spacing: -0.5px;
}

.tab-hero-desc {
  margin: 0;
  max-width: 520px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}

.tab-hero-image {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
  object-position: top;
}

.tab-hero-deco {
  position: absolute;
  pointer-events: none;
  z-index: 1;
}

.tab-hero-deco-dots-right {
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 56px;
  height: 112px;
  background-image: radial-gradient(circle, rgba(223, 40, 24, 0.45) 2.5px, transparent 2.5px);
  background-size: 12px 12px;
  opacity: 0.85;
}

.tab-hero-deco-wave {
  left: -18px;
  bottom: -12px;
  width: 120px;
  height: 90px;
  z-index: 3;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 90' fill='none'%3E%3Cpath d='M0 60C20 40 35 75 55 55C75 35 90 70 120 45V90H0V60Z' fill='%23eef5f9'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Tab-specific content container */
.tab-specific-content {
  min-width: 0;
}

/* Common CTA Section */
.tab-cta {
  background: linear-gradient(135deg, var(--hk-deep) 0%, #003556 100%);
  border-radius: 20px;
  box-shadow: 0 12px 40px rgba(0, 65, 107, 0.18);
  padding: 25px;
}

.tab-cta-inner {
  display: flex;
  align-items: center;
  gap: 32px;
}

.tab-cta-lead {
  display: flex;
  align-items: center;
  gap: 18px;
  flex: 0 0 34%;
  max-width: 34%;
  min-width: 0;
}

.tab-cta-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  font-size: 24px;
  line-height: 1;
}

.tab-cta-title {
  margin: 0;
  font-size: 22px;
  line-height: 30px;
  font-weight: 600;
  color: #ffffff;
}

.tab-cta-title .red-text {
  color: var(--hk-topbar);
}

.tab-cta-divider {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  background: rgba(255, 255, 255, 0.18);
}

.tab-cta-desc {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  color: rgba(238, 245, 249, 0.92);
}

.tab-cta-actions {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
}

.tab-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 210px;
  min-height: 50px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  padding: 0 24px;
  white-space: nowrap;
  border-radius: 999px;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.tab-cta-btn-outline {
  background: transparent;
  border: 2px solid rgba(255, 255, 255, 0.85);
  color: #ffffff;
}

.tab-cta-btn-outline:hover,
.tab-cta-btn-outline:focus {
  background: #ffffff !important;
  border-color: #ffffff !important;;
  color: var(--hk-deep) !important;;
}

.tab-cta-btn i {
  font-size: 18px;
  line-height: 1;
}

/* TABBING CONTENT - SCHOOL OF FOREIGN LANGUAGE */

.sfl-tab-programs {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.sfl-tab-programs-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.sfl-tab-program-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 18px 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
}

.sfl-tab-program-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 18px;
  border-radius: 50%;
  font-size: 24px;
  line-height: 1;
}

.sfl-tab-program-icon-red {
  color: var(--hk-topbar);
  background: rgba(223, 40, 24, 0.12);
}

.sfl-tab-program-icon-blue {
  color: var(--hk-deep);
  background: rgba(2, 93, 152, 0.12);
}

.sfl-tab-program-icon-green {
  color: var(--hk-green);
  background: rgba(46, 155, 90, 0.12);
}

.sfl-tab-program-icon-purple {
  color: #7c3aed;
  background: rgba(124, 58, 237, 0.12);
}

.sfl-tab-program-icon-orange {
  color: #ea580c;
  background: rgba(234, 88, 12, 0.12);
}

.sfl-tab-program-title {
  margin: 0 0 12px;
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  color: var(--hk-deep);
}

.sfl-tab-program-line {
  display: block;
  width: 36px;
  height: 3px;
  margin-bottom: 14px;
  background: var(--hk-topbar);
  border-radius: 2px;
}

.sfl-tab-program-desc {
  margin: 0;
  font-size: 13px;
  line-height: 22px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}

.sfl-tab-features-bar {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 22px 28px;
  background: #eef2f7;
  border: 1px solid rgba(0, 65, 107, 0.06);
  border-radius: 16px;
}

.sfl-tab-feature-item {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 0;
  padding: 0 16px;
}

.sfl-tab-feature-item:first-child {
  padding-left: 0;
}

.sfl-tab-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
}

.sfl-tab-feature-icon-blue {
  color: var(--hk-deep);
  background: rgba(0, 65, 107, 0.1);
}

.sfl-tab-feature-icon-teal {
  color: #0d9488;
  background: rgba(13, 148, 136, 0.12);
}

.sfl-tab-feature-icon-green {
  color: var(--hk-green);
  background: rgba(46, 155, 90, 0.12);
}

.sfl-tab-feature-icon-purple {
  color: #7c3aed;
  background: rgba(124, 58, 237, 0.12);
}

.sfl-tab-feature-text {
  min-width: 0;
}

.sfl-tab-feature-title {
  margin: 0 0 4px;
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  color: var(--hk-deep);
}

.sfl-tab-feature-sub {
  margin: 0;
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}

.sfl-tab-feature-divider {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  background: rgba(0, 65, 107, 0.12);
}

.sfl-tab-feature-brand {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
  flex-shrink: 0;
  padding-left: 16px;
  flex-direction: column;
}

.sfl-tab-vaksudha-logo {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sfl-tab-vaksudha-img {
  display: block;
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.sfl-tab-vaksudha-name {
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #e8872a;
  font-family: Georgia, "Times New Roman", serif;
}

.sfl-tab-enroll-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 150px;
  min-height: 46px;
  padding: 0 22px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  white-space: nowrap;
}

.sfl-tab-enroll-btn i {
  font-size: 18px;
  line-height: 1;
}

/* TABBING CONTENT - SCHOOL OF FINISHING */

/* Outer wrapper */
.fs-tab-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Section heading */
.fs-tab-section-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  margin-bottom: 8px;
}

.fs-tab-section-title {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.3;
}

.fs-tab-section-line {
  display: block;
  width: 44px;
  height: 4px;
  border-radius: 3px;
  background: var(--hk-topbar);
}

/* Row 1 — 7 skill cards */
.fs-tab-skills-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 14px;
}

.fs-tab-skill-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 22px 12px 20px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.07);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.fs-tab-skill-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(0, 65, 107, 0.13);
}

.fs-tab-skill-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  margin-bottom: 14px;
  flex-shrink: 0;
}

.fs-skill-icon-red    { color: var(--hk-topbar); background: rgba(223, 40, 24, 0.1); }
.fs-skill-icon-orange { color: #ea580c;           background: rgba(234, 88, 12, 0.1); }
.fs-skill-icon-green  { color: var(--hk-green);   background: rgba(46, 155, 90, 0.1); }
.fs-skill-icon-purple { color: #7c3aed;           background: rgba(124, 58, 237, 0.1); }
.fs-skill-icon-yellow { color: #ca8a04;           background: rgba(202, 138, 4, 0.1); }
.fs-skill-icon-teal   { color: #0d9488;           background: rgba(13, 148, 136, 0.1); }
.fs-skill-icon-blue   { color: var(--hk-deep);    background: rgba(0, 65, 107, 0.1); }

.fs-tab-skill-title {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
}

.fs-tab-skill-desc {
  margin: 0;
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}

/* Row 2 — 4 highlights bar */
.fs-tab-highlights-bar {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 20px 28px;
  background: #f0f4f9;
  border: 1px solid rgba(0, 65, 107, 0.07);
  border-radius: 14px;
}

.fs-tab-highlight-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex: 1;
  min-width: 0;
  padding: 0 18px;
}

.fs-tab-highlight-item:first-child {
  padding-left: 0;
}

.fs-tab-highlight-item:last-child {
  padding-right: 0;
}

.fs-tab-highlight-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
  color: var(--hk-deep);
  background: rgba(0, 65, 107, 0.09);
}

.fs-tab-highlight-text {
  min-width: 0;
}

.fs-tab-highlight-title {
  margin: 0 0 4px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
}

.fs-tab-highlight-sub {
  margin: 0;
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}

.fs-tab-highlight-divider {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  background: rgba(0, 65, 107, 0.12);
}

/* TABBING CONTENT - SCHOOL OF TRAVEL, TOURISM & HOSPITALITY */

/* Outer wrapper — reuses fs-tab-section-header, fs-tab-skill-card, fs-tab-highlights-bar */
.tth-tab-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Split row: skill cards left (60%) + photo mosaic right (40%) */
.tth-tab-main-row {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.tth-tab-skills-col {
  flex: 1;
  min-width: 0;
}

/* 5-column grid for skills — slightly narrower than SFL's 7 */
.tth-tab-skills-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

/* Accent card — purple border highlight (Customer Service card) */
.tth-card-accent {
  border-color: rgba(124, 58, 237, 0.3);
  background: rgba(124, 58, 237, 0.03);
}

/* 2×2 photo mosaic */
.tth-tab-mosaic {
  flex: 0 0 260px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
  height: 240px;
}

.tth-tab-mosaic-img {
  border-radius: 10px;
  overflow: hidden;
}

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

/* Highlight icon colour variants for TTH */
.tth-icon-red    { color: var(--hk-topbar); background: rgba(223, 40, 24, 0.1); }
.tth-icon-blue   { color: var(--hk-deep);   background: rgba(0, 65, 107, 0.1); }
.tth-icon-green  { color: var(--hk-green);  background: rgba(46, 155, 90, 0.1); }
.tth-icon-purple { color: #7c3aed;          background: rgba(124, 58, 237, 0.1); }
.tth-icon-orange { color: #ea580c;          background: rgba(234, 88, 12, 0.1); }

/* TABBING CONTENT - SCHOOL OF ENTREPRENEURSHIP */

/* Outer wrapper */
.ent-tab-content {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

/* BLOCK 1 — top row: desc left + pathways right */
.ent-tab-top-row {
  display: flex;
  align-items: flex-start;
  gap: 32px;
}

/* Left description column */
.ent-tab-desc-col {
  flex: 0 0 340px;
  max-width: 340px;
}

.ent-tab-block-title {
  margin: 0 0 8px;
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.3;
}

.ent-tab-para {
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.7;
  color: #4a5568;
  font-weight: 400;
}

.ent-tab-para:last-child {
  margin-bottom: 0;
}

/* Right pathway column */
.ent-tab-pathway-col {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Individual pathway card */
.ent-pathway-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 24px 20px 22px;
  border-radius: 16px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.07);
}

/* Career card — subtle blue tint */
.ent-pathway-career {
  background: #f0f6ff;
  border-color: rgba(0, 65, 107, 0.15);
}

/* Venture card — subtle teal tint */
.ent-pathway-venture {
  background: #f0fdf9;
  border-color: rgba(13, 148, 136, 0.18);
}

.ent-pathway-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 22px;
  margin-bottom: 12px;
}

.ent-pathway-icon-blue { color: var(--hk-deep); background: rgba(0, 65, 107, 0.1); }
.ent-pathway-icon-teal { color: #0d9488; background: rgba(13, 148, 136, 0.12); }

.ent-pathway-title {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
}

.ent-pathway-venture .ent-pathway-title {
  color: #0d9488;
}

.ent-pathway-sub {
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 500;
  color: var(--hk-muted);
}

/* Checklist inside pathway card */
.ent-pathway-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
  width: 100%;
  margin: 0;
  padding: 0;
}

.ent-pathway-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  line-height: 1.5;
  color: #374151;
}

.ent-pathway-career .ent-pathway-list li i { color: var(--hk-deep); font-size: 13px; flex-shrink: 0; margin-top: 1px; }
.ent-pathway-venture .ent-pathway-list li i { color: #0d9488; font-size: 13px; flex-shrink: 0; margin-top: 1px; }

/* Arrow between cards */
.ent-pathway-arrows {
  flex-shrink: 0;
  font-size: 24px;
  color: var(--hk-deep);
  opacity: 0.5;
  padding: 0 4px;
}

/* BLOCK 2 — Core Philosophy */
.ent-tab-philosophy {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 24px 28px;
  background: #f8fafc;
  border-radius: 14px;
  border: 1px solid rgba(0, 65, 107, 0.07);
}

.ent-tab-philosophy-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.ent-tab-philosophy-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.ent-philosophy-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.ent-philosophy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
}

.ent-phil-red    { color: var(--hk-topbar); background: rgba(223, 40, 24, 0.1); }
.ent-phil-blue   { color: var(--hk-deep);   background: rgba(0, 65, 107, 0.1); }
.ent-phil-green  { color: #0d9488;          background: rgba(13, 148, 136, 0.1); }
.ent-phil-orange { color: #ea580c;          background: rgba(234, 88, 12, 0.1); }

.ent-philosophy-title {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.3;
}

.ent-philosophy-desc {
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  color: rgba(100, 100, 100, 1);
}

/* BLOCK 3 — Who Can Join */
.ent-tab-who {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 28px;
  background: #ffffff;
  border-radius: 14px;
  border: 1px solid rgba(0, 65, 107, 0.08);
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.06);
}

.ent-tab-who-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.ent-tab-who-tags {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  flex-wrap: wrap;
}

.ent-who-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
}

.ent-who-tag i {
  font-size: 16px;
  color: var(--hk-topbar);
  flex-shrink: 0;
}

/* TABBING CONTENT - TRAIN THE TRAINER PROGRAMME */

.ttt-tab-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Top two-column row */
.ttt-tab-top-row {
  display: flex;
  align-items: flex-start;
  gap: 32px;
}

/* ---- LEFT column ---- */
.ttt-tab-left {
  flex: 0 0 340px;
  max-width: 340px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ttt-tab-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: #4a5568;
}

/* Image with tag bar overlay */
.ttt-tab-image-wrap {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  flex-shrink: 0;
}

.ttt-tab-image {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 14px;
}

.ttt-tab-image-tags {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 10px 16px;
  background: rgba(0, 0, 0, 0.62);
  backdrop-filter: blur(4px);
}

.ttt-image-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

.ttt-image-tag i {
  font-size: 13px;
  flex-shrink: 0;
}

.ttt-image-tag-divider {
  width: 1px;
  height: 18px;
  background: rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
}

/* ---- RIGHT column ---- */
.ttt-tab-right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ttt-sub-heading {
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.3;
}

.ttt-sub-heading-line {
  display: block;
  width: 40px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
  margin-bottom: 4px;
}

/* Programme card */
.ttt-prog-card-wrapper{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.ttt-prog-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 14px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.07);
}

.ttt-prog-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--hk-deep);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  font-family: "Manrope", sans-serif;
  margin-top: 2px;
}

.ttt-prog-body {
  flex: 1;
  min-width: 0;
}

.ttt-prog-title {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.4;
}

.ttt-prog-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
}

.ttt-prog-list li {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  font-size: 12px;
  line-height: 1.5;
  color: #4a5568;
}

.ttt-prog-list li i {
  color: var(--hk-topbar);
  font-size: 13px;
  flex-shrink: 0;
  margin-top: 1px;
}

.ttt-prog-img {
  flex-shrink: 0;
  width: 130px;
  height: 90px;
  border-radius: 10px;
  overflow: hidden;
}

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

/* Note + CTA strip */
.ttt-note-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  background: #f0f6ff;
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 12px;
}

.ttt-note-content {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}

.ttt-note-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  font-size: 18px;
}

.ttt-note-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--hk-deep);
  font-weight: 500;
}

.ttt-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  padding: 11px 22px;
  background: var(--hk-topbar);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  border-radius: 8px;
  border: none;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.22s ease, transform 0.22s ease;
  font-family: "Poppins", sans-serif;
}

.ttt-cta-btn:hover {
  background: #c0201a;
  color: #fff;
  transform: translateY(-2px);
}

.ttt-cta-btn i {
  font-size: 15px;
}

/* ---- Counter bar ---- */
.ttt-counter-bar {
  display: flex;
  align-items: center;
  padding: 22px 28px;
  margin-top: 20px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 14px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.06);
}

.ttt-counter-item {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  justify-content: center;
}

.ttt-counter-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
  color: var(--hk-deep);
  background: rgba(0, 65, 107, 0.08);
}

.ttt-counter-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ttt-counter-number {
  display: block;
  font-size: 28px;
  font-weight: 800;
  color: var(--hk-deep);
  font-family: "Manrope", sans-serif;
  line-height: 1.1;
}

.ttt-counter-label {
  font-size: 12px;
  color: var(--hk-muted);
  font-weight: 400;
  line-height: 1.3;
}

.ttt-counter-divider {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  background: rgba(0, 65, 107, 0.1);
  margin: 0 8px;
}

/* TABBING CONTENT - LANGUAGE LABORATORIES */

/* Hero CTA button — appears inside tab-hero-content */
.ll-hero-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 11px 22px;
  background: var(--hk-deep);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  border-radius: 8px;
  border: none;
  text-decoration: none;
  font-family: "Poppins", sans-serif;
  transition: background 0.22s ease, transform 0.22s ease;
}

.ll-hero-cta-btn:hover {
  background: #002f50;
  color: #fff;
  transform: translateY(-2px);
}

/* Outer wrapper */
.ll-tab-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Two cards side by side */
.ll-tab-cards-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

/* Individual card */
.ll-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px;
  border-radius: 16px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  background: #fff;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.08);
}

.ll-card-physical {
  background: #f8fbff;
}

.ll-card-cloud {
  background: #f4fdf8;
  border-color: rgba(16, 185, 129, 0.15);
}

/* Card header: icon + title */
.ll-card-header {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.ll-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 22px;
}

.ll-icon-blue  { background: rgba(0, 65, 107, 0.1); color: var(--hk-deep); }
.ll-icon-green { background: rgba(16, 185, 129, 0.12); color: #059669; }

.ll-card-title {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.35;
}

.ll-vaksudha-name {
  color: #059669;
}

.ll-card-line {
  display: block;
  width: 36px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
}

.ll-card-line-green {
  background: #059669;
}

/* Card body: image + desc col */
.ll-card-body {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.ll-card-img-wrap {
  flex-shrink: 0;
  width: 130px;
  height: 100px;
  border-radius: 10px;
  overflow: hidden;
}

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

.ll-vaksudha-mockup {
  flex-shrink: 0;
  width: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ll-vaksudha-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.ll-card-desc-col {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ll-card-desc {
  margin: 0;
  font-size: 12px;
  line-height: 1.65;
  color: #4a5568;
}

/* 3 feature icons under physical lab image */
.ll-card-features {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ll-card-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  text-align: center;
}

.ll-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 16px;
}

.ll-feat-teal { background: rgba(13, 148, 136, 0.1); color: #0d9488; }
.ll-feat-red  { background: rgba(223, 40, 24, 0.1);  color: var(--hk-topbar); }
.ll-feat-blue { background: rgba(0, 65, 107, 0.1);   color: var(--hk-deep); }

.ll-feature-label {
  font-size: 10px;
  font-weight: 600;
  color: var(--hk-deep);
  line-height: 1.3;
}

/* Checklist for cloud lab */
.ll-cloud-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
}

.ll-cloud-list li {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  line-height: 1.5;
  color: #374151;
}

.ll-cloud-list li i {
  color: #059669;
  font-size: 13px;
  flex-shrink: 0;
}

/* Card buttons */
.ll-card-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 8px;
  border: none;
  text-decoration: none;
  white-space: nowrap;
  font-family: "Poppins", sans-serif;
  transition: background 0.22s ease, transform 0.22s ease;
  align-self: flex-start;
}

.ll-card-btn:hover {
  transform: translateY(-2px);
}

.ll-btn-dark {
  background: var(--hk-deep);
  color: #fff;
}

.ll-btn-dark:hover {
  background: #002f50;
  color: #fff;
}

.ll-btn-green {
  background: #059669;
  color: #fff;
}

.ll-btn-green:hover {
  background: #047857;
  color: #fff;
}

/* TABBING CONTENT - INTERPRETATION SERVICES */

.interp-tab-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 3×2 card grid — matches image exactly */
.interp-tab-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}

/* Individual service card — white, rounded, centered */
.interp-service-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 20px 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
}

.interp-service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.12);
}

/* Large circular icon */
.interp-service-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  font-size: 28px;
  margin-bottom: 18px;
  flex-shrink: 0;
}

/* Per-card icon colours — matching the image */
.interp-icon-red    { background: rgba(239, 68, 68, 0.1);   color: #ef4444; }
.interp-icon-blue   { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.interp-icon-green  { background: rgba(16, 185, 129, 0.1);  color: #10b981; }
.interp-icon-purple { background: rgba(124, 58, 237, 0.1);  color: #7c3aed; }
.interp-icon-orange { background: rgba(249, 115, 22, 0.1);  color: #f97316; }
.interp-icon-teal   { background: rgba(14, 116, 144, 0.1);  color: #0e7490; }

.interp-service-title {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 22px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
}

.interp-service-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #64748b;
  font-weight: 400;
}

/* Language support strip */
.interp-lang-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 16px 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 14px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.06);
}

.interp-lang-strip-left {
  display: flex;
  align-items: center;
  gap: 14px;
}

.interp-lang-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
  color: var(--hk-deep);
  background: rgba(0, 65, 107, 0.08);
}

.interp-lang-title {
  margin: 0 0 2px;
  font-size: 14px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
}

.interp-lang-sub {
  margin: 0;
  font-size: 12px;
  color: #64748b;
}

/* Flag row */
.interp-lang-flags {
  display: flex;
  align-items: center;
  gap: 8px;
}

.interp-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.interp-flag-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--hk-deep);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  font-family: "Poppins", sans-serif;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
}

/* Trust bar — 5 items with dividers */
.interp-trust-bar {
  display: flex;
  align-items: center;
  padding: 16px 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 14px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.06);
}

.interp-trust-item {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
  padding: 0 14px;
}

.interp-trust-item:first-child {
  padding-left: 0;
}

.interp-trust-item:last-child {
  padding-right: 0;
}

.interp-trust-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 18px;
  color: var(--hk-deep);
  background: rgba(0, 65, 107, 0.07);
}

.interp-trust-title {
  margin: 0 0 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.3;
}

.interp-trust-sub {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
  color: #64748b;
}

.interp-trust-divider {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  background: rgba(0, 65, 107, 0.1);
}

/* TABBING CONTENT - TRANSLATION SERVICES */

/* Outer wrapper */
.trans-tab-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 4×2 card grid — same container style as interpretation, 4 columns */
.trans-tab-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

/* Translation icon colour variants */
.trans-icon-red    { background: rgba(239, 68, 68, 0.1);   color: #ef4444; }
.trans-icon-blue   { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.trans-icon-green  { background: rgba(16, 185, 129, 0.1);  color: #10b981; }
.trans-icon-orange { background: rgba(249, 115, 22, 0.1);  color: #f97316; }
.trans-icon-purple { background: rgba(124, 58, 237, 0.1);  color: #7c3aed; }
.trans-icon-amber  { background: rgba(245, 158, 11, 0.1);  color: #f59e0b; }
.trans-icon-teal   { background: rgba(14, 116, 144, 0.12); color: #0e7490; }
.trans-icon-sky    { background: rgba(14, 165, 233, 0.1);  color: #0ea5e9; }

/* Other Services in Languages bar */
.trans-other-services {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Centered heading with decorative lines on both sides */
.trans-other-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.trans-other-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  white-space: nowrap;
}

.trans-other-line {
  flex: 1;
  max-width: 80px;
  height: 2px;
  background: var(--hk-topbar);
  border-radius: 2px;
  display: block;
}

/* 9-column icon grid */
.trans-other-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 10px;
}

/* Each small card */
.trans-other-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 14px 8px 12px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid rgba(0, 65, 107, 0.07);
  box-shadow: 0 2px 8px rgba(0, 65, 107, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.trans-other-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 7px 20px rgba(0, 65, 107, 0.11);
}

.trans-other-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
  flex-shrink: 0;
}

/* Icon colour variants */
.trans-other-icon-red     { background: rgba(239, 68, 68, 0.1);   color: #ef4444; }
.trans-other-icon-blue    { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.trans-other-icon-green   { background: rgba(16, 185, 129, 0.1);  color: #10b981; }
.trans-other-icon-purple  { background: rgba(124, 58, 237, 0.1);  color: #7c3aed; }
.trans-other-icon-orange  { background: rgba(249, 115, 22, 0.1);  color: #f97316; }
.trans-other-icon-sky     { background: rgba(14, 165, 233, 0.1);  color: #0ea5e9; }
.trans-other-icon-teal    { background: rgba(14, 116, 144, 0.1);  color: #0e7490; }
.trans-other-icon-pink    { background: rgba(236, 72, 153, 0.1);  color: #ec4899; }
.trans-other-icon-emerald { background: rgba(5, 150, 105, 0.1);   color: #059669; }

.trans-other-name {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--hk-deep);
  font-family: "Poppins", sans-serif;
  line-height: 1.3;
}

.trans-other-desc {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
  color: #64748b;
}

.tab-single-cta{
  display: flex;
  align-items: center;
  justify-content: center;
}

.tab-single-cta .btn-accent{
  gap: 10px;
}

/* Services section refinements */
.tabbing-wrapper {
  display: flex;
  align-items: center;
  column-gap: 100px;
}

.tabbing-image-wrapper {
  max-width: 560px;
  width: 100%;
}

.tabbing-content-wrapper {
  max-width: calc(100% - 660px);
}

.tabbing-image {
  border-radius: 20px;
  position: relative;
  z-index: 1;
}

.pill-tabs .nav-link {
  border-radius: 999px;
  background: rgba(246, 246, 246, 0.04);
  color: #e6f1f7;
  border: 1px solid rgba(255, 255, 255, 1);
  min-width: 290px;
  min-height: 62px;
  font-size: 26px;
  line-height: 32px;
}
.pill-tabs .nav-link.active {
  background-color: rgba(255, 255, 255, 0.22);
}

.img-decor {
  position: relative;
}
.img-decor::before,
.img-decor::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 20px;
}
.img-decor::before {
  transform: rotate(-4deg);
  background: rgba(2, 93, 152, 1);
  left: -15px;
}

.img-decor::after {
  left: 15px;
  background: rgba(5, 95, 153, 0.56);
  transform: rotate(4deg);
}

.check-list li {
  margin-bottom: 0.5rem;
}

.btn-accent {
  background: #df2818;
  border: 2px solid rgba(223, 40, 24, 1);
  color: #fff;
  border-radius: 999px;
  font-size: 20px;
  line-height: 32px;
  font-weight: 600;
  min-width: 190px;
  min-height: 52px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(223, 40, 24, 0.3);
}

.btn-accent:hover,
.btn-accent:active{
  color: #fff !important;
  background-color: #df2818 !important;
  transform: translateY(-2px);
  box-shadow: none;
}

.btn-accent-alt {
  background: transparent;
  border: 2px solid var(--hk-deep);
  color: var(--hk-deep);
  border-radius: 999px;
  font-size: 20px;
  line-height: 32px;
  font-weight: 600;
  min-width: 190px;
  min-height: 52px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 65, 107, 0.3);
}

.btn-accent-alt:hover {
  color: #fff;
  background-color: rgb(0 65 107);
  transform: translateY(-2px);
  box-shadow: none;
}

/* .btn-accent-alt:visited{
  color: rgb(0 65 107);
} */

.common-sub-section-title {
  font-size: 26px;
  line-height: 32px;
  font-weight: 600;
  margin-bottom: 20px;
}

.section-content {
  font-size: 24px;
  line-height: 36px;
  font-weight: 300;
  margin-bottom: 70px;
}

.faculty-section-content {
  font-weight: 300;
  margin-bottom: 70px;
  line-height: 40px;
  font-size: 26px;
  text-align: center;
}

.tabbing-listing-title {
  margin-bottom: 40px;
  font-size: 26px;
  line-height: 32px;
}

.check-list {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  margin-bottom: 50px;
  font-size: 26px;
  line-height: 32px;
}

.check-list li {
  margin: 0;
  padding: 0 0 0 48px;
  background-image: url(../images/listing-up-arrow.svg);
  background-repeat: no-repeat;
  background-position: left;
  background-size: 17px;
  font-style: italic;
}

/* Counter card */
.counter-card {
  background: var(--hk-deep);
  border-radius: 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 65, 107, 0.18);
}
.counter-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.counter-overlay {
  position: absolute;
  inset: 0;
  background: rgb(0 65 107 / 70%);
}
.counter-content {
  position: relative;
  padding: 48px 24px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: stretch;
  text-align: center;
}
.counter-content-grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 28px;
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  max-width: none;
  margin: 0;
  width: 100%;
}
.counter-content-grid:first-child {
  border-left: none;
}
.counter-content-grid img {
  width: 74px;
  height: 74px;
  object-fit: contain;
  margin-bottom: 10px;
}
.counter-icon {
  font-size: 40px;
  line-height: 1;
  color: #ffffff;
  margin-bottom: 24px;
}
.counter-seprator {
  display: none;
}
.counter-numbers {
  font-size: 56px;
  line-height: 64px;
  color: #fff;
  font-family: "Manrope", sans-serif;
  font-weight: 700;
  margin-bottom: 12px;
}
.counter-title {
  color: rgba(255, 255, 255, 0.92);
  font-size: 18px;
  line-height: 26px;
  font-weight: 400;
}

/* pathways */
.pathways-header {
  margin-bottom: 56px;
}

/* Slick container — replaces CSS grid */
.pathways-grid {
  display: block;
}

/* Each card inside the slick slide needs px margin for the gap effect */
.pathways-grid .pathways-card {
  margin: 0 10px;
}
.pathways-card {
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
  display: flex;
  flex-direction: column;
}
.pathways-card-media {
  position: relative;
}
.pathways-card-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  object-position: top;
  display: block;
  border-radius: 20px 20px 0 0;
}
.pathways-card-icon {
  position: absolute;
  left: 20px;
  bottom: -24px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(0, 65, 107, 0.12);
  z-index: 2;
}
.pathways-card-body {
  padding: 40px 24px 28px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.pathways-card-title {
  font-size: 22px;
  line-height: 30px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 14px;
}
.pathways-card-text {
  font-size: 16px;
  line-height: 26px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  margin-bottom: 24px;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pathways-card-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding: 10px 20px;
  border-radius: 999px;
  border: 2px solid currentColor;
  background: transparent;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}
.pathways-card-btn:hover {
  color: #ffffff;
}
.pathways-card-blue .pathways-card-icon,
.pathways-card-blue .pathways-card-btn {
  color: #025d98;
}
.pathways-card-blue .pathways-card-icon{
  background: #d0ecff;
}
.pathways-card-blue .pathways-card-btn:hover {
  background: #025d98;
  border-color: #025d98;
}
.pathways-card-pink .pathways-card-icon,
.pathways-card-pink .pathways-card-btn {
  color: #e84d6f;
}
.pathways-card-pink .pathways-card-icon{
  background: #ffe6eb;
}
.pathways-card-pink .pathways-card-btn:hover {
  background: #e84d6f;
  border-color: #e84d6f;
}
.pathways-card-orange .pathways-card-icon,
.pathways-card-orange .pathways-card-btn {
  color: #e8a317;
}
.pathways-card-orange .pathways-card-icon{
  background: #fff5e2;
}
.pathways-card-orange .pathways-card-btn:hover {
  background: #e8a317;
  border-color: #e8a317;
}
.pathways-card-green .pathways-card-icon,
.pathways-card-green .pathways-card-btn {
  color: #2e9b5a;
}
.pathways-card-green .pathways-card-icon{
  background: #deffec;
}
.pathways-card-green .pathways-card-btn:hover {
  background: #2e9b5a;
  border-color: #2e9b5a;
}
.pathways-card-yellow .pathways-card-icon,
.pathways-card-yellow .pathways-card-btn {
  color: #E8A317;
}
.pathways-card-yellow .pathways-card-icon{
  background: #ffeecd;
}
.pathways-card-yellow .pathways-card-btn:hover {
  background: #E8A317;
  border-color: #E8A317;
}
.pathways-card-purple .pathways-card-icon,
.pathways-card-purple .pathways-card-btn {
  color: #7c3aed;
}
.pathways-card-purple .pathways-card-icon{
  background: rgb(221, 202, 255);
}
.pathways-card-purple .pathways-card-btn:hover {
  background: #7c3aed;
  border-color: #7c3aed;
}
.pathways-card-skyblue .pathways-card-icon,
.pathways-card-skyblue .pathways-card-btn {
  color: #79D7FF;
}
.pathways-card-skyblue .pathways-card-icon{
  background: #eaf8ff;
}
.pathways-card-skyblue .pathways-card-btn:hover {
  background: #79D7FF;
  border-color: #79D7FF;
}
.pathways-card-violet .pathways-card-icon,
.pathways-card-violet .pathways-card-btn {
  color: #3d458b;
}
.pathways-card-violet .pathways-card-icon{
  background: #d2d6ff;
}
.pathways-card-violet .pathways-card-btn:hover {
  background: #5f6cde;
  border-color: #5f6cde;
}
.pathways-card-btn:hover {
  color: #fff;
}
.pathways-footer {
  margin-top: 48px;
  text-align: center;
}
.pathways-view-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 280px;
  min-height: 56px;
  padding: 0 28px;
  border: 2px solid var(--hk-deep);
  border-radius: 999px;
  color: var(--hk-deep);
  background: #ffffff;
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 65, 107, 0.12);
}
.pathways-view-all:hover {
  background: var(--hk-deep);
  color: #ffffff;
  transform: translateY(-2px);
}

/* Pathways slick slider — arrows & dots */
.pathways-slick .slick-list {
  overflow: hidden;
  padding: 8px 0 16px;
  margin: 0 -10px;
}

.pathways-slick .slick-track {
  display: flex;
  align-items: stretch;
}

.pathways-slick .slick-slide {
  height: auto;
  float: none;
  display: flex !important;
  flex-direction: column;
}

.pathways-slick .slick-slide > div {
  display: flex;
  flex-direction: column;
}

.pathways-slick .pathways-card {
  flex: 1;
}

/* Prev / next arrow buttons */
.pathways-slick .slick-arrow {
  position: absolute;
  top: -60px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--hk-deep);
  border: none;
  cursor: pointer;
  z-index: 2;
  transition: background 0.22s ease, transform 0.22s ease;
}

.pathways-slick .slick-arrow:hover {
  background: var(--hk-topbar);
  transform: scale(1.08);
}

.pathways-slick .slick-prev {
  right: 54px;
  left: auto;
}

.pathways-slick .slick-next {
  right: 4px;
}

.pathways-slick .slick-prev::before,
.pathways-slick .slick-next::before {
  font-family: "bootstrap-icons";
  font-size: 18px;
  color: #fff;
  opacity: 1;
  line-height: 1;
}

.pathways-slick .slick-prev::before { content: "\F12F"; }
.pathways-slick .slick-next::before { content: "\F138"; }

/* Dots */
.pathways-slick-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}

.pathways-slick-dots .slick-dots {
  position: static;
  display: flex !important;
  justify-content: center;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.pathways-slick-dots .slick-dots li {
  width: auto;
  height: auto;
  margin: 0;
}

.pathways-slick-dots .slick-dots li button {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.2);
  border: none;
  padding: 0;
  font-size: 0;
  cursor: pointer;
  transition: background 0.22s ease, transform 0.22s ease;
}

.pathways-slick-dots .slick-dots li button::before {
  display: none;
}

.pathways-slick-dots .slick-dots li.slick-active button {
  background: var(--hk-deep);
  transform: scale(1.2);
}

/* welcome folks */
/* Language slider styles */
.faculty-section-combined {
  position: relative;
}

.faculty-section-combined:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/gradient-bg.png);
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
  opacity: 0.2;
}

.bg-image-top:before {
  background-position: bottom;
}

.language-card {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.language-card img {
  width: 100%;
  height: 415px;
  object-fit: cover;
  display: block;
}
.language-label {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  background: rgba(246, 246, 246, 0.04);
  backdrop-filter: blur(40px);
  border: 1px solid rgba(255, 255, 255, 1);
  color: #fff;
  border-radius: 999px;
  padding: 10px 24px;
  font-weight: 500;
  min-width: 180px;
  text-align: center;
  font-size: 24px;
  line-height: 32px;
  width: calc(100% - 48px);
  transition: transform 0.3s ease-out;
}
.language-label:hover {
  transform: translate(-50%, -10px);
  background: rgba(246, 246, 246, 0.2);
  color: #fff;
}
.language-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 88px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.lang-arrow {
  border: none;
  background: transparent;
  font-size: 28px;
  color: var(--hk-deep);
}
.carousel-indicators [data-bs-target] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #b8c1c7;
}
.carousel-indicators .active {
  background-color: var(--hk-deep);
}

/* New horizontal slider behavior */
/* Slick slider placeholder styles (arrows/dots will be controlled by JS init) */
.language-slick .language-card {
  margin: 0 8px;
}
.slick-dots {
  display: flex !important;
  justify-content: center;
  gap: 8px;
  margin: 0px;
  padding: 0;
  list-style: none;
}
.slick-dots li {
  width: 8px;
  height: 8px;
}
.slick-dots button {
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 50%;
  background: #b8c1c7;
  text-indent: -9999px;
  border: 0;
}
.slick-dots .slick-active button {
  background: var(--hk-deep);
}
.slick-arrow {
  background: transparent;
  border: 0;
  position: absolute;
  bottom: -114px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background-repeat: no-repeat;
  background-position: center;
}
/* features section */
.features-section {
  position: relative;
  background-image: url(../images/join-us-section-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
.features-section::before,
.features-section::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 0;
}
.features-section::before {
  left: 0;
  top: 120px;
  width: 280px;
  height: 280px;
  background-image: url(../images/gradient-bg-1.svg);
  opacity: 0.45;
}
.features-section::after {
  right: 0;
  top: 80px;
  width: 300px;
  height: 300px;
  background-image: url(../images/gradient-bg-2.svg);
  opacity: 0.45;
}
.features-section .container {
  position: relative;
  z-index: 1;
}
.features-intro {
  font-size: 22px;
  line-height: 34px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  margin: 0;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
.features-section .study-grid-wrapper {
  align-items: stretch;
  margin-bottom: 48px;
}
.features-section .study-grid-item {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  text-align: left;
  gap: 24px;
  padding: 28px;
  border-radius: 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
  overflow: hidden;
}
.features-section .study-grid-side {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  flex: 0 0 72px;
  min-height: 100%;
}
.features-section .study-grid-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  gap: 30px;
}
.features-section .study-grid-image {
  flex-shrink: 0;
  margin-bottom: 0;
  width: 70px;
  height: 70px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.features-section .study-grid-image img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}
.features-section .study-title {
  font-size: 20px;
  line-height: 28px;
  position: relative;
  color: var(--hk-deep);
  padding-bottom: 0px;
  display: inline-block;
  max-width: 100%;
  font-family: "Manrope", sans-serif;
  font-weight: 700;
  position: relative;
  margin-bottom: 0px;
}
.features-section .study-title:before{
  content: "";
  position: absolute;
  left: 0;
  bottom: -15px;
  width: 30px;
  height: 3px;
}
.features-section .study-grid-item:nth-child(6n + 1) .study-title:before {
  background-color: rgba(2, 93, 152, 1);
}
.features-section .study-grid-item:nth-child(6n + 2) .study-title:before {
  background-color: rgba(46, 155, 90, 1);
}
.features-section .study-grid-item:nth-child(6n + 3) .study-title:before {
  background-color: rgba(95, 108, 222, 1);
}
.features-section .study-grid-item:nth-child(6n + 4) .study-title:before {
  background-color: rgba(232, 163, 23, 1);
}
.features-section .study-grid-item:nth-child(6n + 5) .study-title:before {
  background-color: rgba(232, 77, 111, 1);
}
.features-section .study-grid-item:nth-child(6n + 6) .study-title:before {
  background-color: rgba(2, 93, 152, 1);
}
.features-section .study-desc {
  font-family: "Manrope", sans-serif;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  font-size: 15px;
  line-height: 24px;
  margin-bottom: 0;
  margin-top: auto;
}
.features-section .study-grid-num {
  position: static;
  font-family: "Manrope", sans-serif;
  font-size: 32px;
  line-height: 1;
  font-weight: 300;
  letter-spacing: -2px;
}

.features-section .study-grid-item:nth-child(6n + 1) .study-grid-image {
  background-color: rgba(2, 93, 152, 0.12);
}
.features-section .study-grid-item:nth-child(6n + 1) .study-grid-num {
  color: rgba(2, 93, 152, 0.14);
}
.features-section .study-grid-item:nth-child(6n + 2) .study-grid-image {
  background-color: rgba(46, 155, 90, 0.12);
}
.features-section .study-grid-item:nth-child(6n + 2) .study-grid-num {
  color: rgba(46, 155, 90, 0.14);
}
.features-section .study-grid-item:nth-child(6n + 3) .study-grid-image {
  background-color: rgba(95, 108, 222, 0.12);
}
.features-section .study-grid-item:nth-child(6n + 3) .study-grid-num {
  color: rgba(95, 108, 222, 0.14);
}
.features-section .study-grid-item:nth-child(6n + 4) .study-grid-image {
  background-color: rgba(232, 163, 23, 0.14);
}
.features-section .study-grid-item:nth-child(6n + 4) .study-grid-num {
  color: rgba(232, 163, 23, 0.16);
}
.features-section .study-grid-item:nth-child(6n + 5) .study-grid-image {
  background-color: rgba(232, 77, 111, 0.12);
}
.features-section .study-grid-item:nth-child(6n + 5) .study-grid-num {
  color: rgba(232, 77, 111, 0.14);
}
.features-section .study-grid-item:nth-child(6n + 6) .study-grid-image {
  background-color: rgba(2, 93, 152, 0.12);
}
.features-section .study-grid-item:nth-child(6n + 6) .study-grid-num {
  color: rgba(2, 93, 152, 0.14);
}

.study-grid-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}
.slick-prev {
  left: 50%;
  margin-left: -80px;
  background-image: url(../images/slider-arrow-left.svg);
}

.slick-next {
  right: 50%;
  margin-right: -80px;
  background-image: url(../images/slider-arrow-right.svg);
}

/* featstats counter */
.features-stats-container{
  max-width: 1600px;
}

.featstats-bar {
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.2);
  border-radius: 24px;
  box-shadow: 0 10px 32px rgba(0, 65, 107, 0.1);
  overflow: hidden;
  padding: 40px 20px;
  gap: 50px;
}
.cmn-featstats{
  position: relative;
}
.cmn-featstats:before {
  content: "";
  position: absolute;
  right: -25px;
  top: 0;
  width: 2px;
  height: 100%;
  background: rgba(0, 65, 107, 0.1);
}
.featstats-mission {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1.4;
}
.featstats-mission-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.featstats-mission-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(2, 93, 152, 0.12);
  color: #025d98;
  font-size: 36px;
  line-height: 1;
}
.featstats-mission-title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
  margin: 0;
}
.featstats-mission-text {
  font-size: 14px;
  line-height: 22px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  margin: 0;
}
.featstats-highlight {
  color: #025d98;
  font-weight: 500;
}
.featstats-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: left;
  gap: 25px;
  flex: 1;
}
.featstats-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  border-radius: 0;
  font-size: 46px;
  line-height: 1;
  margin-bottom: 0;
  flex-shrink: 0;
}
.featstats-item-blue .featstats-icon {
  background: transparent;
  color: #025d98;
}
.featstats-item-blue .featstats-value {
  color: var(--hk-deep);
}
.featstats-item-green .featstats-icon {
  background: transparent;
  color: #2e9b5a;
}
.featstats-item-green .featstats-value {
  color: var(--hk-deep);
}
.featstats-item-purple .featstats-icon {
  background: transparent;
  color: #5f6cde;
}
.featstats-item-purple .featstats-value {
  color: var(--hk-deep);
}
.featstats-value {
  font-family: "Manrope", sans-serif;
  font-size: 32px;
  line-height: 38px;
  font-weight: 700;
  margin-bottom: 0px;
  color: var(--hk-deep);
}
.featstats-label {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  color: var(--hk-muted);
}
.featstats-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.featstats-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 24px;
  border-radius: 999px;
  background: #df2818;
  border: 2px solid #df2818;
  color: #ffffff;
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.3s ease;
  box-shadow: 0 4px 14px rgba(223, 40, 24, 0.28);
}
.featstats-btn:hover {
  color: #ffffff;
  background: #c92214;
  border-color: #c92214;
  transform: translateY(-2px);
}
/* about */

/* Testimonials */
.testimonial-section{
  background: #f9fbfe url(../images/testimonial-sec-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.testi-stats-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 48px;
}
.testi-stat-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 0 28px;
  border-left: 1px solid #e0e0e0;
}
.testi-stat-item:first-child {
  border-left: none;
}
.testi-stat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  font-size: 30px;
  line-height: 1;
}
.testi-stat-blue .testi-stat-icon {
  color: #025d98;
  background: rgba(2, 93, 152, 0.12);
}
.testi-stat-green .testi-stat-icon {
  color: #2e9b5a;
  background: rgba(46, 155, 90, 0.12);
}
.testi-stat-orange .testi-stat-icon {
  color: #e8a317;
  background: rgba(232, 163, 23, 0.14);
}
.testi-stat-purple .testi-stat-icon {
  color: #5f6cde;
  background: rgba(95, 108, 222, 0.12);
}
.testi-stat-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.testi-stat-value {
  font-family: "Manrope", sans-serif;
  font-size: 32px;
  line-height: 38px;
  font-weight: 700;
  color: var(--hk-deep);
}
.testi-stat-label {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}
.testi-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 20px;
  padding: 24px;
  margin: 10px;
  box-shadow: 0 3px 8px rgba(0, 65, 107, 0.08);
}
.testi-company-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.testi-company-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.testi-company-logo {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 50%;
}
.testi-company-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.testi-company-name {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: #000000;
}
.testi-company-type {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #025d98;
}
.testi-quote-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 40px;
  line-height: 1;
  color: rgba(121, 215, 255, 0.9);
}
.testi-stars {
  color: #ff7f22;
  letter-spacing: 3px;
  font-size: 18px;
  line-height: 1;
  margin-bottom: 16px;
}
.testi-text {
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: #000000;
  margin: 0 0 24px;
  flex: 1;
}
.testi-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
  padding-top: 20px;
  border-top: 1px solid rgba(233, 239, 245, 1);
}
.testi-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.testi-name {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: #000000;
}
.testi-role {
  font-size: 14px;
  line-height: 20px;
  color: rgba(113, 114, 118, 1);
}
.testimonial-controls {
  display: flex;
  justify-content: center;
  margin-top: 38px;
}
.testi-slick .testi-card {
  height: 100%;
}
.testi-slick .slick-dots {
  display: flex !important;
  gap: 8px;
  margin: 0;
  padding: 0;
}
.testi-slick .slick-dots li {
  width: 8px;
  height: 8px;
}
.testi-slick .slick-dots button {
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 50%;
  background: #b8c1c7;
  text-indent: -9999px;
  border: 0;
}
.testi-slick .slick-dots .slick-active button {
  background: var(--hk-deep);
}
.testi-slick .slick-arrow {
  background: transparent;
  border: 0;
  position: absolute;
  bottom: -64px;
  width: 44px;
  height: 44px;
}
.testi-slick .slick-prev {
  left: 50%;
  margin-left: -80px;
  background-image: url(../images/slider-arrow-left.svg);
  background-repeat: no-repeat;
  background-position: center;
}
.testi-slick .slick-next {
  right: 50%;
  margin-right: -80px;
  background-image: url(../images/slider-arrow-right.svg);
  background-repeat: no-repeat;
  background-position: center;
}
/* Blog cards */
.insight-sections {
  /* background-color: #f7f9fc; */
}
.insight-sections:before {
  opacity: 0.12;
}
.insight-sections .container {
  position: relative;
  z-index: 1;
}
.blog-header .cmn-section-title {
  position: relative;
  padding-bottom: 18px;
}
.blog-header .cmn-section-title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 48px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
}
.blog-hub-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: rgb(121 215 255 / 18%);
  color: var(--hk-deep);
  padding: 6px 16px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.blog-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 48px;
}
.blog-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 999px;
  border: 1px solid rgba(0, 65, 107, 0.12);
  background: #ffffff;
  color: var(--hk-deep);
  font-size: 15px;
  line-height: 22px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
}
.blog-tab i {
  font-size: 16px;
  line-height: 1;
}
.blog-tab:hover {
  border-color: rgba(0, 65, 107, 0.28);
  box-shadow: 0 4px 14px rgba(0, 65, 107, 0.1);
}
.blog-tab-active {
  background: var(--hk-deep);
  border-color: var(--hk-deep);
  color: #ffffff;
}
.blog-tab-active:hover {
  background: var(--hk-deep);
  color: #ffffff;
}
.blog-tabs-content {
  position: relative;
}
.blog-tab-panel {
  display: block;
}
.blog-tab-empty {
  text-align: center;
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
  padding: 48px 16px;
  margin: 0;
}
.blog-tab-empty[hidden] {
  display: none;
}
.blog-grid {
  align-items: stretch;
}
.blog-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.blog-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 36px rgba(0, 65, 107, 0.14);
}
.blog-media {
  position: relative;
}
.blog-image {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}
.blog-category {
  position: absolute;
  top: 16px;
  left: 16px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #ffffff;
  background: var(--hk-deep);
  display: none;
}
.blog-category:not(:empty) {
  display: inline-flex;
}
.blog-card-icon {
  position: absolute;
  left: 20px;
  bottom: -22px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(0, 65, 107, 0.12);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  line-height: 1;
  z-index: 2;
}
.blog-card-blue .blog-card-icon {
  color: #025d98;
}
.blog-card-blue .blog-category:not(:empty) {
  background: #025d98;
}
.blog-card-blue .blog-read-more {
  color: #025d98;
}
.blog-card-green .blog-card-icon {
  color: #2e9b5a;
}
.blog-card-green .blog-category:not(:empty) {
  background: #2e9b5a;
}
.blog-card-green .blog-read-more {
  color: #2e9b5a;
}
.blog-card-purple .blog-card-icon {
  color: #5f6cde;
}
.blog-card-purple .blog-category:not(:empty) {
  background: #5f6cde;
}
.blog-card-purple .blog-read-more {
  color: #5f6cde;
}
.blog-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 36px 24px 28px;
  gap: 10px;
}
.blog-meta-line {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  font-size: 13px;
  line-height: 20px;
  color: rgba(100, 100, 100, 1);
}
.blog-date {
  color: rgba(100, 100, 100, 1);
  position: relative;
}
.blog-date:before{
  content: "";
  position: absolute;
  right: -12px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  background: rgba(100, 100, 100, 1);
  border-radius: 50%;
}
.blog-read-time {
  color: rgba(100, 100, 100, 1);
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  white-space: nowrap;
}
.blog-title {
  font-weight: 600;
  font-size: 22px;
  line-height: 30px;
  color: var(--hk-deep);
  margin: 0;
}
.blog-sub {
  font-size: 15px;
  line-height: 24px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  margin: 0 0 6px;
}
.blog-read-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  text-decoration: none;
  transition: gap 0.3s ease;
}
.blog-read-more:hover {
  gap: 12px;
}
.blog-footer-cta {
  padding-top: 48px;
  margin-top: 8px;
}
.see-all-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 28px;
  border: 1px solid rgba(38, 38, 38, 1);
  border-radius: 999px;
  color: rgba(38, 38, 38, 1);
  background: #fff;
  text-decoration: none;
  font-size: 16px;
  line-height: 24px;
  min-width: 215px;
  font-weight: 600;
  transition: all 0.3s ease;
}
.see-all-btn:hover {
  background: rgba(38, 38, 38, 1);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(38, 38, 38, 0.3);
}

/* Blog listing page — pagination & empty state */
.blog-pagination {
  margin-top: 48px;
  display: flex;
  justify-content: center;
}

.blog-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  list-style: none;
  margin: 0;
  flex-wrap: wrap;
  justify-content: center;
}

.blog-pagination .page-numbers li {
  display: inline-flex;
}

.blog-pagination .page-numbers a,
.blog-pagination .page-numbers span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  border: 1px solid rgba(0, 65, 107, 0.15);
  font-size: 14px;
  font-weight: 500;
  color: var(--hk-deep);
  background: var(--white);
  text-decoration: none;
  transition: all 0.3s ease;
}

.blog-pagination .page-numbers a:hover {
  background: var(--hk-deep);
  color: var(--white);
  border-color: var(--hk-deep);
}

.blog-pagination .page-numbers .current {
  background: var(--hk-topbar);
  color: var(--white);
  border-color: var(--hk-topbar);
  font-weight: 700;
}

.blog-pagination .page-numbers .dots {
  border: none;
  background: transparent;
  color: var(--hk-muted);
  pointer-events: none;
}

.blog-empty-state {
  text-align: center;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.blog-empty-icon {
  font-size: 64px;
  color: rgba(0, 65, 107, 0.15);
  line-height: 1;
}

.blog-empty-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--hk-deep);
  margin: 0;
  font-family: "Poppins", sans-serif;
}

.blog-empty-desc {
  font-size: 16px;
  color: var(--hk-muted);
  margin: 0;
}

.about-left-image-wrap,
.about-right-image-wrap {
  max-width: 620px;
  width: 100%;
}

.about-right-image-wrap .faculty-section-content {
  margin-bottom: 40px;
}

.about-left-image-wrap {
  display: flex;
  flex-wrap: wrap;
  column-gap: 30px;
  row-gap: 20px;
}

.about-left-image-wrap img {
  object-fit: cover;
  position: relative;
}

.cmn-about-img-wrap {
  position: relative;
}

.cmn-about-img-wrap:before {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.about-rect-img {
  max-width: 340px;
  height: 100%;
  border-radius: 30px;
}

.cmn-curv-img {
  max-width: 250px;
}

.about-bottom-radius {
  border-bottom-left-radius: 150px;
  border-bottom-right-radius: 150px;
}

.about-top-radius {
  border-top-left-radius: 150px;
  border-top-right-radius: 150px;
}

.about-top-img:before {
  width: 160px;
  height: 160px;
  background-color: rgba(121, 215, 255, 1);
  left: -90px;
  top: -24px;
}

.about-bottom-img:before {
  width: 120px;
  height: 120px;
  background-color: rgba(255, 206, 80, 1);
  bottom: -24px;
  right: -50px;
}

.about-bottom-radius-img:before {
  width: 30px;
  height: 30px;
  background-color: rgba(255, 100, 118, 1);
  right: -25px;
  top: 100px;
}

.about-top-radius-img:before {
  width: 80px;
  height: 80px;
  background-color: rgba(95, 108, 222, 1);
  top: 55px;
  left: -46px;
}

.about-mission-vision-wrap,
.multiple-interpretation-content-wrap{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 32px;
  margin-top: 70px;
}

.abt-msn-vsn-title {
  background-image: url(../images/about-up-arrow.svg);
  background-repeat: no-repeat;
  background-position: left;
  background-size: 17px;
  padding: 0 0 0 48px;
  margin-bottom: 34px;
}

.abt-msn-vsn-content {
  font-size: 22px;
  line-height: 34px;
  margin: 0;
  font-weight: 300;
}

.welcome-content .hero-sub-tag {
  background-color: rgba(121, 215, 255, 0.22);
  color: var(--hk-deep);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  font-size: 13px;
}

/* get in touch */
.contact-content {
  display: flex;
  justify-content: space-between;
  gap: 50px;
}

.contact-info {
  max-width: 100%;
  width: 100%;
  position: relative;
}

.contact-info-header {
  margin-bottom: 24px;
}

.contact-info-header .cmn-section-sub {
  position: relative;
  padding-bottom: 16px;
  margin: 0;
}

.contact-description {
  font-size: 16px;
  color: rgba(100, 100, 100, 1);
  line-height: 26px;
  font-weight: 300;
  margin-bottom: 28px;
}

.contact-details {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 0 0 32px;
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 16px;
  text-decoration: none;
}

.contact-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border: 1px solid var(--hk-topbar);
  border-radius: 10px;
  background: #ffffff;
  color: var(--hk-topbar);
  font-size: 20px;
  line-height: 1;
}

.contact-item-text {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
  transition: color 0.3s ease;
}

.contact-link:hover .contact-item-text {
  color: var(--hk-topbar);
}

.contact-item img {
  margin-top: 6px;
  flex-shrink: 0;
}

.contact-offices {
  /* display: grid;
  grid-template-columns: repeat(4, 1fr); */
  gap: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
}

.contact-office-card {
width: calc(30% - 10px);
  display: flex;
  flex-direction: column;
  padding: 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.06);
  overflow: hidden;
}

.contact-office-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.contact-office-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
}

.contact-office-red .contact-office-icon {
  color: var(--hk-topbar);
  background: rgba(223, 40, 24, 0.1);
}

.contact-office-blue .contact-office-icon {
  color: #025d98;
  background: rgba(2, 93, 152, 0.12);
}

.contact-office-title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
}

.contact-office-address {
  font-size: 14px;
  line-height: 22px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  margin: 0 0 12px;
  min-height: 80px;
}

.contact-office-map-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #025d98;
  text-decoration: none;
  margin-bottom: 16px;
  transition: gap 0.3s ease;
}

.contact-office-map-link:hover {
  gap: 10px;
}

.contact-office-map {
  margin-top: auto;
  width: 100%;
  height: 180px;
  border-radius: 10px;
  overflow: hidden;
}

.contact-office-map iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}

.contact-maps-wrapper {
  display: flex;
  align-items: stretch;
  gap: 15px;
}

.contact-map {
  border-radius: 10px;
  overflow: hidden;
  height: 250px;
  width: 100%;
  flex: 1;
}

.contact-map iframe {
  width: 100%;
  height: 100%;
  display: block;
}

.social-section {
  margin-top: 100px;
  padding: 0 16px;
}

.social-section h3 {
  font-size: 26px;
  font-weight: 500;
  color: #000000;
  margin-bottom: 14px;
}

.footer-social-icons {
  display: flex;
  gap: 24px;
  margin-top: 30px;
}

.social-icon-wrap {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff2b;
  border-radius: 5px;
  transition: all 0.3s ease;
}

.social-icon-wrap:hover {
  transform: translateY(-2px);
}

.social-icon-wrap img {
  width: 30px;
  height: 30px;
}

.contact-details-wrapper{
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.contact-form {
  flex: 1;
  min-width: 0;
}

.contact-form-details{
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 60px;
}

.cf-steps-heading{
  color: var(--hk-deep);
  font-weight: 600;
  margin-bottom: 20px;
  font-size: 30px;
  line-height: 38px;
}

.cf-steps-sub{
  color: var(--hk-muted);
}

/* -----------------------------------------------
   NEW CONTACT FORM DESIGN — cf-* classes
----------------------------------------------- */

/* Premium card wrapping the form */
.cf-card {
  background: rgb(0 65 107 / 7%);
  border: 2px solid var(--hk-deep);
  border-radius: 20px;
  padding: 36px 32px 32px;
  box-shadow: 0 8px 40px rgba(0, 65, 107, 0.1);
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* Card heading */
.cf-card-title {
  font-family: "Poppins", sans-serif;
  font-size: 30px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 38px;
  margin: 0;
}

.cf-card-title-accent {
  color: var(--hk-topbar);
}

.cf-card-sub {
  font-size: 13px;
  line-height: 1.65;
  color: #64748b;
  margin: 0;
}

/* Two-column row */
.cf-row {
  display: flex;
  gap: 14px;
}

.cf-field {
  flex: 1;
  min-width: 0;
}

.cf-field label{
  color: var(--hk-deep);
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}

.cf-field.cf-field-large {
  display: inline-flex;
  align-items: center;
  flex-direction: column;
  row-gap: 5px;
}

.cf-field-full .cf-field.cf-field-small p {
  flex-direction: column;
  align-items: flex-start;
}

.cf-field.cf-field-small {
  display: inline-flex;
  align-items: center;
}

.cf-field-small p{
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
}

.wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.cf-field.cf-field-large p {
  width: 100%;
}

.cf-field.cf-field-large label {
  margin-bottom: 5px;
}

.cf-input-select .wpcf7-form-control-wrap input[type="file"] {
  width: 100%;
  font-size: 14px;
  color: var(--hk-muted);
}

.cf-input-select .wpcf7-form-control-wrap input[type="file"]::file-selector-button {
  background: var(--hk-deep);
  color: #fff;
  border: none;
  padding: 6px 12px;
  margin-right: 15px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.cf-input-select .wpcf7-form-control-wrap input[type="file"]::file-selector-button:hover {
  background: var(--hk-deep);
}

.cf-field-full {
  width: 100%;
}

/* Input / select / textarea base */
.cf-field .wpcf7-form-control-wrap{
  display: flex;
  flex-wrap: wrap;
}

.cf-input-select.cf-field .wpcf7-form-control-wrap {
  padding: 10px;
  border: 2px dashed #0242692b !important;
}

.cf-field .wpcf7-form-control-wrap .wpcf7-not-valid-tip{
  font-size: 13px;
  width: 100%;
}

.cf-input,
.wpcf7-form-control-wrap .select2-selection {
  width: 100%;
  padding: 6px 16px !important;
  font-size: 14px;
  font-family: "Poppins", sans-serif;
  color: var(--hk-deep) !important;
  background: #fff;
  border: 2px solid #0242692b !important;
  border-radius: 0px !important;
  outline: none;
  transition: border-color 0.22s ease, box-shadow 0.22s ease;
  -webkit-appearance: none;
  min-height: 52px;
}

.wpcf7-form-control-wrap .select2-selection .select2-search__field{
  color: var(--hk-deep) !important;
}

.wpcf7-form-control-wrap .select2-selection {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 6px 12px !important;
}

.wpcf7-form-control-wrap .select2-selection .select2-search{
  width: 100%;
}

.wpcf7-form-control-wrap .select2-selection--multiple .select2-selection__rendered{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: calc(100% - 20px);
}

.wpcf7-form-control-wrap .select2-container:before{
  content: "\F282";
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  font-family: 'bootstrap-icons';
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wpcf7-form-control-wrap .select2-container.select2-container--open:before{
  transform: translateY(-50%) rotate(-180deg);
}

.wpcf7-form-control-wrap .select2-container--default .select2-selection--multiple .select2-selection__choice{
  background-color: var(--white);
  color: var(--hk-deep);
  border-color: var(--hk-deep);
}

.wpcf7-form-control-wrap .select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
  color: var(--hk-topbar);
}

.wpcf7-form-control-wrap .select2-container--default .select2-selection--multiple .select2-selection__choice__display{
  color: var(--hk-deep);
}

.wpcf7-form-control-wrap .select2-container--default .select2-selection--multiple .select2-selection__clear{
  display: flex;
  align-items: center;
  font-size: 20px;
  color: var(--hk-topbar);
}

.select2-container--open .select2-dropdown--below{
  border: 2px solid #0242692b !important;
}

.select2-container--default .select2-results__option--selected{
  background-color: var(--hk-ice);
  color: var(--hk-deep);
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
  background-color: var(--hk-deep);
  color: var(--white);
}

.cf-input:focus {
  border-color: var(--hk-deep);
  box-shadow: 0 0 0 3px rgba(0, 65, 107, 0.08);
  background: var(--white);
}

.cf-input::placeholder,
.wpcf7-form-control-wrap .select2-selection .select2-search__field::placeholder {
  color: #a0aec0;
  font-weight: 400;
}

.cf-textarea {
  height: 120px;
  resize: none;
  line-height: 1.6;
}

.cf-select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300416b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}

/* Phone field with flag + dial code prefix */
.cf-phone-wrap {
  display: flex;
  align-items: center;
  background: #f8fafc;
  border: 2px solid #0242692b !important;
  border-radius: 0;
  overflow: hidden;
  transition: border-color 0.22s ease, box-shadow 0.22s ease;
}

.cf-phone-wrap:focus-within {
  border-color: var(--hk-deep);
  box-shadow: 0 0 0 3px rgba(0, 65, 107, 0.08);
}

.cf-phone-prefix {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  flex-shrink: 0;
  border: 0;
  border-right: 2px solid var(--hk-ice);
  height: 100%;
  min-height: 46px;
  font-size: 13px;
  font-weight: 600;
  color: var(--hk-deep);
  cursor: default;
  background: #fff;
  border-radius: 0px;
}

.cf-flag { font-size: 16px; line-height: 1; }
.cf-dial-code { font-size: 12px; font-weight: 600; }
.cf-phone-chevron { font-size: 10px; color: #94a3b8; }

/* .cf-input-phone {
  border: none !important;
  border-radius: 0 !important;
  background: #fff;
  box-shadow: none;
  flex: 1;
  min-width: 0;
  padding-left: 10px !important;
  min-height: 48px;
}

.cf-input-phone:focus {
  border: none;
  box-shadow: none;
  background: transparent;
} */

/* Submit row */
.cf-submit-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 4px;
}

.cf-submit-center-row{
  justify-content: center;
  margin-top: 50px;
}

.cf-submit-center-row p {
  display: inline-flex;
  position: relative;
  margin: 0;
}

.cf-submit-center-row .wpcf7-spinner {
  position: absolute;
  right: -40px;
  margin: 0;
  top: 10px;
}

input[type="submit"].cf-submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 12px;
  background: var(--hk-deep);
  color: var(--white);
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 700;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.22s ease, box-shadow 0.22s ease;
  white-space: nowrap;
  min-height: 44px;
  min-width: 150px;
}

.cf-submit-btn:hover {
  background: #002f50;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.28);
}

.cf-submit-btn i { font-size: 15px; }

.cf-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--hk-green);
}

.wpcf7-response-output{
 display: none;
}

/* -----------------------------------------------
   NEXT STEPS LIST — left side of contact section
----------------------------------------------- */
.cf-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0 0;
  padding: 0;
  position: relative;
}

.cf-step {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 20px 0;
  position: relative;
}

.cf-step:last-child {
  border-bottom: none;
}

.cf-step:not(:last-child):before{
  content: '';
  position: absolute;
  left: 6px;
  top: 40px;
  width: 2px;
  height: 100%;
  background-color: #00416b29;
  z-index: 2;
}

.cf-step-dot {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--hk-deep);
  margin-top: 6px;
  box-shadow: 0 0 0 4px #00416b29;
  position: relative;
  z-index: 3;
}

.cf-step-title {
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  color: var(--hk-deep);
  margin: 0 0 6px;
}

.cf-step-text {
  font-size: 14px;
  line-height: 24px;
  color: var(--hk-muted);
  margin: 0;
}

.contact-form-spacing {
  margin-bottom: 100px;
  position: relative;
}

/* Contact page */
.contact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}
.contact-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}
.contact-heading {
  margin: 0 0 10px;
  color: var(--hk-deep);
  font-size: 20px;
}
.contact-link {
  font-size: 22px;
  color: #000;
}
.contact-link:hover { color: var(--hk-topbar); }
.contact-address { margin: 0; font-size: 16px; line-height: 26px; }

.contact-form-wrap {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 22px;
}
.contact-form-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}
.contact-side-card {
  background: rgba(0, 65, 107, 0.06);
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 18px;
  padding: 24px;
}


/* newsletter */
.newsletter-cta-section {
  padding-bottom: 80px;
}

.newsletter-cta-section .container{
  max-width: 1600px;
}

.newletter-cta-bg {
  border-radius: 24px;
  background-image: url(../images/newsletter-cta-bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
}

.newsletter-bg-gradient {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 24px;
  background-color: rgba(0, 65, 107, 0.9);
}

.cta-section-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  min-height: 220px;
  padding: 48px 40px;
  max-width: calc(100% - 350px);
  margin-left: auto;
}

.student-image {
  position: absolute;
  left: 60px;
  bottom: 0;
  width: 280px;
  max-width: 32%;
  height: auto;
  z-index: 1;
}

.newsletter-cta-content-wrapper {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.newsletter-cta-content-wrapper .cmn-section-title {
  font-size: 32px;
  line-height: 42px;
  letter-spacing: -1px;
  padding-bottom: 0;
}

.newsletter-cta-content-wrapper .cmn-section-title:after {
  display: none;
}

.newsletter-cta-content-wrapper .hero-banner-text{
  margin: 0;
  color: var(--white);
}

.newsletter-cta-sub {
  font-size: 16px;
  line-height: 26px;
  font-weight: 300;
  margin: 0;
  opacity: 0.95;
}

.newsletter-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 28px;
  border-radius: 999px;
  background: #ffffff;
  border: 2px solid #ffffff;
  color: var(--hk-deep);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

.newsletter-cta-btn i {
  color: var(--hk-topbar);
  font-size: 18px;
  line-height: 1;
}

.newsletter-cta-btn:hover {
  background: #ffffff;
  color: var(--hk-deep);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
}

.newsletter-cta-features {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
}

.newsletter-cta-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 32px;
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  max-width: 220px;
}

.newsletter-cta-feature:first-child {
  border-left: none;
}

.newsletter-cta-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin-bottom: 14px;
  border-radius: 50%;
  background: #ffffff;
  color: var(--hk-deep);
  font-size: 24px;
  line-height: 1;
}

.newsletter-cta-feature-title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 8px;
  white-space: nowrap;
}

.newsletter-cta-feature-desc {
  font-size: 14px;
  line-height: 22px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
}

.newsletter-cta-feature-desc:hover{
  text-decoration: none;
  color: rgba(255, 255, 255, 1);
}

.footer-slanted {
  position: relative;
  padding: 70px 0 30px;
  background-color: var(--hk-deep);
}

.footer-row-wrap .footer-col:not(:last-child) {
  border-right: 1px solid rgb(255 255 255 / 15%);
}

.footer-content {
  display: flex;
  justify-content: space-between;
  position: relative;
}

.footer-top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
}

.footer-logo {
  width: 134px;
  margin-bottom: 16px;
}

.footer-description {
  font-size: 16px;
  color: #ffffff;
  line-height: 1.6;
  margin-bottom: 0;
}

.footer-links {
  display: flex;
  justify-content: space-between;
  width: 66%;
}

.footer-column {
  flex: 1;
}

.footer-column + .footer-column {
  margin-top: 30px;
}

.footer-column h3 {
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 20px;
}

.footer-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}

.footer-column ul.footer-link-badge-wrapper {
  display: flex;
  flex-wrap: wrap;
  flex-direction: unset;
  row-gap: 10px;
  column-gap: 10px;
}

.footer-column ul.footer-link-badge-wrapper li {
  margin: 0px;
}

.footer-column ul.footer-link-badge-wrapper li a {
  border: 1px solid #fff;
  border-radius: 20px;
  padding: 3px 15px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(255 255 255 / 10%);
  color: #fff;
  transition: all 0.3s;
  font-size: 15px;
  pointer-events: none;
}

.footer-column ul.footer-link-badge-wrapper li a:hover {
  transform: scale(1.1);
  background-color: rgb(255 255 255 / 20%);
}

.footer-column ul li a {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-column ul li a:hover {
  color: #ffffff;
}

.footer-contact-details {
  list-style: none;
  padding: 0;
  margin: 30px 0 0 0;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.footer-contact .footer-contact-links {
  color: rgba(255, 255, 255, 0.6);
  display: flex;
  align-items: flex-start;
  column-gap: 10px;
}

.footer-contact .footer-contact-links img{
  margin-top: 4px;
}

.footer-contact a img {
  width: 18px;
  height: 18px;
}

.footer-contact a:hover {
  color: rgba(255, 255, 255, 1);
}

.footer-contact h3 {
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 14px;
}

.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 16px;
}

.footer-contact-item img {
  margin-top: 6px;
}

.footer-contact-item span {
  font-size: 16px;
  font-family: "Plus Jakarta Sans", Arial, sans-serif;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.4;
}

.footer-bottom {
  text-align: center;
}

.footer-copyright {
  font-size: 16px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.4);
}

.footer-input-form {
  display: flex;
  align-items: stretch;
  justify-content: center;
  margin-bottom: 0px;
}

.form-group .footer-input {
  border: 1px solid #fff;
  border-radius: 6px;
  background-color: #ffffff1a;
  color: #fff;
  padding: 4px 10px;
  min-height: 44px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.form-group .footer-input:focus {
  outline: none;
  color: #fff;
}

.form-group .footer-input::placeholder {
  color: #fff;
}

.footer-form-submit {
  background-color: #fff;
  color: var(--hk-deep);
  border-radius: 6px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border: 1px solid #fff;
}

.footer-form-submit:hover,
.footer-form-submit:focus,
.footer-form-submit:active {
  background-color: #ffffff52 !important;
  color: #fff !important;
  border: 1px solid #fff !important;
}

.footer-sec-border-top {
  border-top: 1px solid rgb(255 255 255 / 15%);
}

.scrolling-section {
  position: relative;
  overflow: hidden;
  background-color: #00406c21;
  padding: 25px 0;
}

.scrolling-section::before,
.scrolling-section::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0px;
  background-color: transparent;
  /* background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 50%, #ffffff 100%); */
  width: 160px;
}

.scrolling-section::before {
  z-index: 10;
  background: linear-gradient(
    90deg,
    #ffffff 0%,
    rgba(250, 251, 252, 0.03) 106.33%
  );
}

.scrolling-section::after {
  right: 0;
  left: auto;
  background: linear-gradient(
    270deg,
    #ffffff 0%,
    rgba(250, 251, 252, 0.03) 106.33%
  );
}

.scrolling-text {
  display: flex;
  animation: apsro-scroller 15s linear infinite;
}

.scrolling-text-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  margin: 0;
  padding: 0;
  list-style: none;
}

.scrolling-text-wrapper li {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 15px;
  font-size: 28px;
  line-height: 36px;
  white-space: nowrap;
}

.scrolling-text-wrapper li svg {
  width: 20px;
  height: 20px;
}

.scrolling-text-wrapper + .scrolling-text-wrapper,
.scrolling-text-wrapper li + li {
  margin-left: 40px;
}

@keyframes apsro-scroller {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

.inner-banner-section {
  /* margin: 20px; */
}
.inner-banner-wrapper {
  padding: 50px 15px;
  background-color: #df2818;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  row-gap: 25px;
  text-align: center;
  border-radius: 0px;
}
.inner-banner-title {
  margin: 0;
  font-size: 42px;
  line-height: 48px;
}

.hero-banner-desc{
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 12px;
  font-size: 20px;
  line-height: 28px;
}

/* Image variant for inner banner */
.inner-banner-image {
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 0px;
  overflow: hidden;
}
.inner-banner-image:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.35));
}
.inner-banner-image .inner-banner-wrapper {
  background: transparent;
  position: relative;
  z-index: 1;
  padding: 110px 15px;
}
.inner-banner-image .inner-banner-title {
  color: #fff;
  font-size: 56px;
  line-height: 64px;
  letter-spacing: -2px;
}

/* Reusable tall inner banner */
.inner-banner-xl .inner-banner-wrapper {
  min-height: 400px;
  padding: 70px 15px;
}
.inner-banner-xl .inner-banner-title {
  font-size: 64px;
  line-height: 72px;
}

/* Intro compact */
.intro-lead {
  font-size: 20px;
  line-height: 32px;
  margin: 0;
  font-weight: 300;
}

/* Manifesto split */
.manifesto-split {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 36px;
}
.manifesto-card {
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.15);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
  padding: 22px 22px 22px 18px;
  display: grid;
  grid-template-columns: 8px 1fr;
  gap: 16px;
}
.manifesto-card .bar {
  border-radius: 6px;
  background: var(--hk-deep);
}
.manifesto-card h3 {
  margin: 2px 0 8px;
  font-size: 22px;
}
.manifesto-card p {
  margin: 0;
  font-size: 18px;
  line-height: 30px;
}

/* Think Global section */
.global-local-section {
  position: relative;
  overflow: hidden;
  background: url(../images/think-global-bg-img.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.global-local-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
  margin-bottom: 40px;
}
.global-local-copy {
  position: relative;
  z-index: 1;
  max-width: 560px;
}
.global-local-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #ffffff;
  color: var(--hk-deep);
  font-size: 34px;
  line-height: 1;
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.12);
  margin-bottom: 24px;
}
.global-local-title {
  position: relative;
  font-size: 44px;
  line-height: 52px;
  font-weight: 600;
  color: var(--hk-deep);
  letter-spacing: -1.5px;
  margin: 0 0 18px;
  padding-bottom: 16px;
}
.global-local-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 48px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
}
.global-local-sub {
  margin: 0 0 18px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
  color: var(--hk-deep);
}
.global-local-text {
  margin: 0;
  font-size: 18px;
  line-height: 30px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
}
.global-local-map {
  position: relative;
  min-height: 340px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.global-local-map-dots {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(0, 65, 107, 0.16) 1.5px, transparent 1.5px);
  background-size: 12px 12px;
  mask-image: radial-gradient(circle at 58% 52%, #000 0%, #000 42%, transparent 72%);
  -webkit-mask-image: radial-gradient(circle at 58% 52%, #000 0%, #000 42%, transparent 72%);
}
.global-local-map-node {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(2, 93, 152, 0.55);
}
.global-local-map-node-one {
  top: 28%;
  left: 22%;
}
.global-local-map-node-two {
  top: 18%;
  right: 18%;
}
.global-local-map-node-three {
  bottom: 24%;
  right: 24%;
}
.global-local-map-india {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  transform: translate(18%, -4%);
}
.global-local-map-india i {
  font-size: 42px;
  line-height: 1;
  color: var(--hk-topbar);
}
.global-local-map-india span {
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--hk-deep);
}
.global-local-info-bar {
  display: flex;
  align-items: stretch;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 20px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
  overflow: hidden;
  padding: 18px 22px;
}
.global-local-info-item {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 4px 22px;
  border-left: 1px solid #e0e0e0;
}
.global-local-info-item:first-child {
  border-left: none;
}
.global-local-info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #e6f1ff;
  color: var(--hk-deep);
  font-size: 22px;
  line-height: 1;
}
.global-local-info-text {
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  color: var(--hk-deep);
}

/* Building Future CTA */
.future-cta-section {
  background: #faf8f3;
}
.future-cta-split {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 0;
  align-items: stretch;
  overflow: hidden;
}
.future-cta-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.future-cta-title {
  position: relative;
  font-size: 42px;
  line-height: 50px;
  font-weight: 600;
  color: var(--hk-deep);
  letter-spacing: -1.5px;
  margin: 0 0 14px;
  padding-bottom: 16px;
}
.future-cta-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 48px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
}
.future-cta-sub {
  margin: 0 0 18px;
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
  color: var(--hk-deep);
}
.future-cta-text {
  margin: 0 0 28px;
  font-size: 17px;
  line-height: 28px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
  max-width: 560px;
}
.future-cta-btn {
  gap: 10px;
  min-width: 170px;
  align-self: flex-start;
}
.future-cta-btn i {
  font-size: 18px;
  line-height: 1;
}
.future-cta-features {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 28px;
}
.future-cta-feature {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.future-cta-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(223, 40, 24, 0.12);
  color: var(--hk-topbar);
  font-size: 24px;
  line-height: 1;
}
.future-cta-feature-title {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
}
.future-cta-feature-text {
  margin: 0;
  font-size: 15px;
  line-height: 24px;
  font-weight: 300;
  color: rgba(100, 100, 100, 1);
}

/* Professional timeline */
.hk-timeline {
  position: relative;
  padding-top: 10px;
  margin-top: 40px;
}
.hk-timeline:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 44px;
  height: 3px;
  background: rgba(0, 65, 107, 0.3);
  border-radius: 3px;
}
.hk-timeline-list {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.tl-item {
  text-align: center;
  position: relative;
  padding-top: 16px;
}
.tl-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #df2818;
  border: 3px solid #fff;
  margin: 0 auto;
  position: relative;
  top: 36px;
  box-shadow: 0 0 0 6px rgba(223, 40, 24, 0.18);
}
.tl-year {
  font-weight: 700;
  color: var(--hk-deep);
  margin-top: 38px;
  font-size: 16px;
}
.tl-caption {
  font-size: 13px;
  color: #444;
  max-width: 160px;
  margin: 6px auto 0;
}

/* Values grid */
.values-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 34px;
}
.value-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.04);
  text-align: center;
}
.value-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--hk-deep);
  margin: 0 0 6px;
}
.value-text {
  font-size: 14px;
  color: #444;
  margin: 0;
}

/* Empower banner (About page) */
.empower-banner {
  position: relative;
}
.empower-bg {
  position: relative;
  min-height: 520px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.empower-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0, 31, 63, 0.92) 0%,
    rgba(0, 45, 90, 0.78) 42%,
    rgba(0, 20, 40, 0.45) 72%,
    rgba(0, 10, 25, 0.25) 100%
  );
}
.empower-content {
  position: relative;
  z-index: 1;
  min-height: 520px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  text-align: left;
}
.empower-copy {
  flex: 1;
  max-width: 640px;
}
.empower-label {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
}
.empower-tag {
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #ffffff;
}
.empower-label-line {
  display: inline-block;
  width: 48px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
  flex-shrink: 0;
}
.empower-title {
  color: #fff;
  font-size: 52px;
  line-height: 1.15;
  letter-spacing: -1.5px;
  margin: 0 0 20px;
  font-weight: 600;
}
.empower-sub {
  margin: 0;
  max-width: 560px;
  font-size: 18px;
  line-height: 30px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.88);
}
.empower-media {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.play-wrap {
  position: relative;
  width: 180px;
  height: 180px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.circular-text {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  opacity: 0.35;
  animation: spin 18s linear infinite;
}
.circular-text-content {
  font-family: "Manrope", sans-serif;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  fill: rgba(255, 255, 255, 0.85);
}
.play-btn {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: #df2818;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  margin: 0;
  position: relative;
  z-index: 2;
  box-shadow: 0 10px 30px rgba(223, 40, 24, 0.45);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.play-btn:hover {
  transform: scale(1.04);
  color: #fff;
}
.play-icon {
  width: 0;
  height: 0;
  border-left: 18px solid #fff;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  margin-left: 4px;
}
.empower-journey-title {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
  color: #ffffff;
}
.empower-journey-meta {
  margin: 0;
  font-size: 15px;
  line-height: 22px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.82);
}

@keyframes spin {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Welcome split */
.welcome-split {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 60px;
  align-items: center;
  position: relative;
}

.welcome-image {
  position: relative;
  height: 520px;
  padding-left: 24px;
  background-image: radial-gradient(rgba(0, 65, 107, 0.14) 1.5px, transparent 1.5px);
  background-size: 16px 16px;
  background-position: 0 42%;
  background-repeat: repeat;
}

.welcome-image:before,
.welcome-image:after {
  content: "";
  position: absolute;
  z-index: 3;
}

.welcome-image:before {
  left: 0;
  bottom: 28px;
  width: 72px;
  height: 72px;
  border-radius: 14px;
  background-color: rgb(156 103 249);
}

.welcome-image:after {
  right: -24px;
  top: 48px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background-color: rgba(121, 215, 255, 1);
}

.welcome-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-top-left-radius: 200px;
  border-bottom-right-radius: 200px;
  position: relative;
  z-index: 2;
}

.welcome-content .header-section-alt-center {
  margin-bottom: 24px;
  row-gap: 12px;
}

.welcome-content .cmn-section-title {
  font-size: 44px;
  line-height: 54px;
}

.welcome-content .cmn-section-sub {
  font-size: 26px;
  line-height: 32px;
  font-weight: 600;
}

.welcome-content .intro-lead + .intro-lead {
  margin-top: 16px;
}

.welcome-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 32px 0 0;
  padding: 20px;
  list-style: none;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 20px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
}

.welcome-kpis li {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  border: 0;
}

.welcome-kpi-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
}

.welcome-kpi-number {
  font-family: "Manrope", sans-serif;
  font-size: 28px;
  line-height: 34px;
  font-weight: 700;
  color: var(--hk-deep);
}

.welcome-kpi-label {
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
  color: rgba(100, 100, 100, 1);
}

.welcome-kpi-blue .welcome-kpi-icon {
  color: #025d98;
  background: rgba(2, 93, 152, 0.14);
}

.welcome-kpi-red .welcome-kpi-icon {
  color: #df2818;
  background: rgba(223, 40, 24, 0.14);
}

.welcome-kpi-purple .welcome-kpi-icon {
  color: #7b4fd4;
  background: rgba(156, 103, 249, 0.2);
}

.welcome-kpi-green .welcome-kpi-icon {
  color: #2e9b5a;
  background: rgba(46, 155, 90, 0.18);
}

/* Vision & Mission cards */
.vm-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  margin-top: 70px;
}
.about-mission-vision-wrap.vm-grid {
  margin-top: 56px;
}
.vm-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  padding: 30px;
  border-radius: 20px;
  gap: 25px;
}
.vm-card-vision {
  background-color: #f2f7fd;
}
.vm-card-mission {
  background-color: rgba(156, 103, 249, 0.14);
}
.vm-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
  gap: 14px;
  position: relative;
  z-index: 2;
}
.vm-card-vision .vm-head:before,
.vm-card-mission .vm-head:before{
  content: "";
  position: absolute;
  left: 0px;
  top: 10px;
  width: 70px;
  height: 70px;
  z-index: -1;
  background-size: 8px 8px;
}
.vm-card-vision .vm-head:before{
  background-image: radial-gradient(rgba(0, 65, 107, 0.14) 1px, transparent 1px);
}

.vm-card-mission .vm-head:before{
  background-image: radial-gradient(rgba(0, 65, 107, 0.14) 1px, transparent 1px);
}
.vm-grid-icon {
  width: 120px;
  height: 120px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 110px;
  line-height: 1;
  opacity: 0.18;
  pointer-events: none;
  z-index: 1;
}
.vm-card-vision .vm-grid-icon {
  color: rgba(2, 93, 152, 0.55);
}
.vm-card-mission .vm-grid-icon {
  color: rgba(123, 79, 212, 0.55);
}
.vm-grid-icon svg {
  width: 100%;
  height: 100%;
}
.vm-body{
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.vm-title {
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--hk-deep);
  margin: 0;
  position: relative;
}
.vm-title:before{
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 30px;
  height: 2px;
}
.vm-card-vision .vm-title{
  color: #025d98;
}
.vm-card-mission .vm-title{
  color: #7b4fd4;
}
.vm-card-vision .vm-title:before{
  background-color: #025d98;
}
.vm-card-mission .vm-title:before{
  background-color: #7b4fd4;
}
.vm-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  flex-shrink: 0;
  background: #ffffff;
  border: 0;
}
.vm-card-vision .vm-icon {
  color: #025d98;
  box-shadow: 0 4px 14px rgba(2, 93, 152, 0.15);
}
.vm-card-mission .vm-icon {
  color: #7b4fd4;
  box-shadow: 0 4px 14px rgba(156, 103, 249, 0.2);
}
.vm-text {
  font-size: 16px;
  line-height: 28px;
  margin: 0;
  color: rgba(30, 30, 30, 1);
  position: relative;
  z-index: 2;
}

/* Highlights grid (replacing timeline) */
.highlights-section {
  position: relative;
  background-image: url(../images/new-services-section-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.highlights-section .container {
  position: relative;
  z-index: 1;
}
.highlights {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}
.highlight-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.06);
  border-radius: 20px;
  padding: 24px 22px;
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.08);
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.highlight-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 24px;
  line-height: 1;
  border: 0;
}
.highlight-body {
  min-width: 0;
  flex: 1;
}
.highlight-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 26px;
  color: var(--hk-deep);
  margin: 0 0 10px;
}
.highlight-accent {
  display: block;
  width: 36px;
  height: 3px;
  border-radius: 2px;
  margin-bottom: 12px;
}
.highlight-text {
  font-size: 16px;
  line-height: 26px;
  color: rgba(100, 100, 100, 1);
  margin: 0;
  font-weight: 300;
}
.highlight-card-blue .highlight-icon {
  color: #025d98;
  background: rgba(121, 215, 255, 0.28);
}
.highlight-card-blue .highlight-accent {
  background: #025d98;
}
.highlight-card-red .highlight-icon {
  color: #df2818;
  background: rgba(223, 40, 24, 0.12);
}
.highlight-card-red .highlight-accent {
  background: #df2818;
}
.highlight-card-green .highlight-icon {
  color: #2e9b5a;
  background: rgba(46, 155, 90, 0.14);
}
.highlight-card-green .highlight-accent {
  background: #2e9b5a;
}
.highlight-card-purple .highlight-icon {
  color: #7b4fd4;
  background: rgba(156, 103, 249, 0.16);
}
.highlight-card-purple .highlight-accent {
  background: #7b4fd4;
}
.highlight-card-orange .highlight-icon {
  color: #e8a317;
  background: rgba(232, 163, 23, 0.16);
}
.highlight-card-orange .highlight-accent {
  background: #e8a317;
}
.highlight-card-teal .highlight-icon {
  color: #025d98;
  background: rgba(2, 93, 152, 0.12);
}
.highlight-card-teal .highlight-accent {
  background: #025d98;
}
.highlights-stats-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px 24px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 20px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
}
.highlights-stat-item {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  justify-content: center;
  padding: 0 18px;
  border-left: 1px solid #e0e0e0;
}
.highlights-stat-item:first-child {
  border-left: none;
}
.highlights-stat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
}
.highlights-stat-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: calc(100% - 65px);
}
.highlights-stat-number {
  font-family: "Manrope", sans-serif;
  font-size: 28px;
  line-height: 34px;
  font-weight: 700;
  color: var(--hk-deep);
}
.highlights-stat-label {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  color: rgba(100, 100, 100, 1);
}
.highlights-stat-blue .highlights-stat-icon {
  color: #025d98;
  background: rgba(121, 215, 255, 0.28);
}
.highlights-stat-red .highlights-stat-icon {
  color: #df2818;
  background: rgba(223, 40, 24, 0.12);
}
.highlights-stat-purple .highlights-stat-icon {
  color: #7b4fd4;
  background: rgba(156, 103, 249, 0.16);
}
.highlights-stat-green .highlights-stat-icon {
  color: #2e9b5a;
  background: rgba(46, 155, 90, 0.14);
}
.highlights-stat-orange .highlights-stat-icon {
  color: #e8a317;
  background: rgba(232, 163, 23, 0.16);
}

/* What we do text block */
.whatwedo-block {
  max-width: 1000px;
  margin: 0 auto;
}
.whatwedo-card {
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
}

/* What We Do - new layout */
.wwd-intro {
  max-width: 100%;
  margin: 0 auto 50px;
  text-align: center;
}

.wwd-grid {
  display: flex;
  align-items: flex-start;
  gap: 100px;
}

/* LEFT column */
.wwd-left {
  flex: 0 0 520px;
  max-width: 520px;
}

/* Venn bubble layout */
.wwd-venn {
  position: relative;
  width: 520px;
  height: 520px;
  margin: 0;
  border-radius: 50%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 10px;
  padding: 10px;
}

/* Outer dashed decorative ring */
.wwd-venn-ring {
  position: absolute;
  inset: -18px;
  border-radius: 50%;
  border: 2px dashed rgba(0, 65, 107, 0.12);
  pointer-events: none;
  z-index: 0;
}

/* Each quadrant panel */
.wwd-quad {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px;
  text-align: center;
  position: relative;
  transition: all 0.2s ease;
}

.wwd-quad:before{
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.wwd-quad:hover {
  opacity: 0.9;
}

/* Outer corners rounded, inner corners sharp — creates the quadrant-in-circle look */
.wwd-quad-education    { border-radius: 100% 10px 0 10px; background: rgba(219, 234, 254, 0.7);}
.wwd-quad-translation  { border-radius: 10px 100% 10px 0; background: rgba(254, 226, 226, 0.7); }
.wwd-quad-interpretation { border-radius: 10px 0 10px 100%; background: rgba(237, 233, 254, 0.7); justify-content: flex-start;}
.wwd-quad-labs         { border-radius: 0 10px 100% 10px; background: rgba(209, 250, 229, 0.7); justify-content: flex-start;}

.wwd-quad-education:hover      { background: rgba(219, 234, 254, 1); box-shadow: 0 4px 10px #ccc;}
.wwd-quad-translation:hover    { background: rgba(254, 226, 226, 1); box-shadow: 0 4px 10px #ccc;}
.wwd-quad-interpretation:hover { background: rgba(237, 233, 254, 1); box-shadow: 0 4px 10px #ccc;}
.wwd-quad-labs:hover           { background: rgba(209, 250, 229, 1); box-shadow: 0 4px 10px #ccc;}

.wwd-quad-education:before{
  background-color: var(--hk-deep);  
  left: 0;
}
.wwd-quad-translation:before{
  right: 0;
  background-color: var(--hk-topbar);  
}
.wwd-quad-interpretation:before{
  left: 0;
  background-color: #7c3aed;  
}
.wwd-quad-labs:before{
  right: 0;
  background-color: var(--hk-green);  
}

/* Icon circle in each quadrant */
.wwd-quad-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fff;
  font-size: 24px;
  margin-bottom: 15px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.1);
  flex-shrink: 0;
}

.wwd-quad-education    .wwd-quad-icon { color: var(--hk-deep); }
.wwd-quad-translation  .wwd-quad-icon { color: var(--hk-topbar); }
.wwd-quad-interpretation .wwd-quad-icon { color: #7c3aed; }
.wwd-quad-labs         .wwd-quad-icon { color: var(--hk-green); }

/* Title */
.wwd-quad-title {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.3px;
  line-height: 1.35;
  margin-bottom: 5px;
}

.wwd-quad-education    .wwd-quad-title { color: var(--hk-deep); }
.wwd-quad-translation  .wwd-quad-title { color: var(--hk-topbar); }
.wwd-quad-interpretation .wwd-quad-title { color: #7c3aed; }
.wwd-quad-labs         .wwd-quad-title { color: var(--hk-green); }

/* Description */
.wwd-quad-text {
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
  color: var(--hk-muted);
  font-weight: 400;
  max-width: 80%;
}

/* Centre white circle — absolutely positioned over the grid gap */
.wwd-venn-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 15;
  text-align: center;
  background: #fff;
  border-radius: 50%;
  width: 140px;
  height: 140px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 24px rgba(0, 65, 107, 0.18);
  border: 3px solid #fff;
  padding: 10px;
}

.wwd-venn-logo {
  width: 30px;
  height: 30px;
  object-fit: contain;
  margin-bottom: 5px;
}

.wwd-venn-brand {
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 1.2;
}

.wwd-venn-tagline {
  font-size: 10px;
  color: var(--hk-muted);
  line-height: 1.4;
}

/* Keep old bubble classes for any remnant references */
.wwd-bubble { display: none; }
.wwd-bubble-icon { display: none; }
.wwd-bubble-icon-red, .wwd-bubble-icon-teal, .wwd-bubble-icon-green { display: none; }

/* Purpose note below venn */
.wwd-purpose-note {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--white);
  border-radius: 12px;
  padding: 14px 16px;
  border: 1px solid rgba(0,65,107,0.1);
  margin-top: 60px;
  box-shadow: 0 4px 18px rgba(0,65,107,0.07);
}

.wwd-purpose-icon {
  font-size: 22px;
  color: var(--hk-deep);
  background-color: var(--hk-ice);
  flex-shrink: 0;
  margin-top: 0;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wwd-purpose-note p {
  font-size: 14px;
  line-height: 1.55;
  color: var(--hk-deep);
  margin: 0;
  font-weight: 500;
}

/* RIGHT column — about-right-image-wrap already exists */
.about-right-image-wrap {
  flex: 1;
  max-width: calc(100% - 620px);
}

.wwd-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  row-gap: 30px;
}

.wwd-step {
  display: flex;
  align-items: stretch;
  gap: 16px;
  padding: 20px;
  box-shadow: 0 4px 18px rgba(0,65,107,0.07);
  border-radius: 16px;
}

/* Icon circle for each step */
.wwd-step-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 24px;
  flex-shrink: 0;
  color: #fff;
}

.wwd-icon-red    { background: var(--hk-topbar); }
.wwd-icon-teal   { background: #0d9488; }
.wwd-icon-blue   { background: var(--hk-deep); }
.wwd-icon-orange { background: #ea580c; }

.wwd-step-content {
  flex: 1;
  min-width: 0;
}

.wwd-step-title {
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
}

.wwd-title-red    { color: var(--hk-topbar); }
.wwd-title-teal   { color: #0d9488; }
.wwd-title-blue   { color: var(--hk-deep); }
.wwd-title-orange { color: #ea580c; }

.wwd-step-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: #4a5568;
  font-weight: 400;
}

/* Step image */
.wwd-step-img {
  flex-shrink: 0;
  width: 150px;
  height: 100px;
  border-radius: 10px;
  overflow: hidden;
}

.wwd-step-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 10px;
}

/* Stats bar below the grid */
.wwd-stats-bar {
  margin-top: 48px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--hk-ice);
  box-shadow: 0 4px 18px rgba(0,65,107,0.07);
}


/* Team page */
.team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.team-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.05);
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 16px;
}
.team-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--hk-deep);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}
.team-name {
  margin: 0 0 4px;
  font-size: 20px;
  color: var(--hk-deep);
}
.team-role {
  margin: 0 0 10px;
  font-size: 14px;
  color: #444;
}
.team-bio {
  margin: 0;
  font-size: 16px;
  line-height: 26px;
}

.whatwedo-card p {
  background: #fff;
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
  border: 0;
}
.whatwedo-card p {
  margin: 0;
  font-size: 18px;
  line-height: 32px;
}



/* Capabilities cards */
.capabilities {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.cap-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.15);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}
.cap-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}
.cap-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 2px solid rgba(0, 65, 107, 0.2);
}
.cap-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
  color: var(--hk-deep);
}
.cap-text {
  font-size: 18px;
  line-height: 30px;
  color: #000;
  margin: 0;
}
.cap-list {
  margin: 10px 0 0;
  padding-left: 18px;
}
.cap-list li {
  font-size: 14px;
  margin-bottom: 6px;
}


.featured-team-wrapper{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  align-items: stretch;
}
.faculty-card {
  perspective: 1200px;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  overflow: visible;
  transition: none;
  cursor: pointer;
  border-radius: 20px;
  height: 100%;
}
.faculty-card:hover {
  box-shadow: none;
  transform: none;
}
.faculty-card-inner {
  display: grid;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.6s ease, box-shadow 0.4s ease;
  border-radius: 20px;
}
.faculty-card:hover .faculty-card-inner {
  transform: rotateY(180deg);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}
.faculty-card-front,
.faculty-card-back {
  grid-area: 1 / 1;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  padding: 24px 20px 28px;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
}
.faculty-card-back {
  transform: rotateY(180deg);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 24px;
  position: relative;
  z-index: 2;
}

/* Header */
.faculty-header {
  position: relative;
  background: transparent;
  color: #000;
  padding: 0;
  text-align: left;
}
.faculty-header .overlay {
  display: none;
}
.header-content {
  position: relative;
  z-index: 1;
}
.profile-img {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
}
.profile-img img {
  width: 100%;
  height: 100%;
  border-radius: 14px;
  border: none;
  object-fit: cover;
  object-position: top center;
  box-shadow: none;
  display: block;
}
.badge {
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #facc15;
  color: #92400e;
  padding: 3px 10px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: bold;
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
.faculty-header h3 {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 20px;
  color: var(--hk-deep);
}
.designation {
  color: #333;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.4;
  margin: 0 0 8px;
}
.experience {
  font-size: 0.9rem;
  color: #00416b;
  font-weight: 600;
  margin: 16px 0;
}

/* Wave */
.wave {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 24px;
  color: #fff;
}

/* Content */
.faculty-content {
  padding: 0;
}
.faculty-card-back .stats {
  margin-bottom: 0;
}
.faculty-section {
  margin-bottom: 24px;
}
.faculty-section h4 {
  font-size: 22px;
  line-height: 32px;
  font-weight: 600;
  margin-bottom: 10px;
}
.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tags span {
  background: #dbf1ff;
  color: #00416b;
  padding: 4px 10px;
  border-radius: 9999px;
  font-size: 0.85rem;
  font-weight: 500;
}
.faculty-section ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.faculty-section p,
.faculty-section ul li {
  font-size: 0.9rem;
  color: #4b5563;
  margin-bottom: 6px;
}

/* Stats */
.stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 12px;
  background: #f9fafb;
  border-radius: 12px;
  margin-bottom: 1.5rem;
  text-align: center;
}
.stats .num {
  font-size: 1.4rem;
  font-weight: bold;
}
.stats .blue { color: #2563eb; }
.stats .purple { color: #7c3aed; }
.stats .label {
  font-size: 12px;
  color: #6b7280;
}

/* Actions */
.actions-social-icons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.member-social-icon-wrap{
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #dbf1ff;
  color: #00416b;
  border-radius: 5px;
}

.member-social-icon-wrap svg{
  width: 18px;
}

.member-social-icon-wrap:hover{
  transform: translateY(-2px);
}

.faculty-cta-card {
  background-image: url(../images/newsletter-cta-bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
  padding: 50px 15px;
  border: 1px solid #f3f4f6;
  max-width: 100%;
  margin: 100px 0 0 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.faculty-cta-card:before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 65 107 / 90%);
}

.faculty-card-wrapper{
  position: relative;
  z-index: 2;
}

.faculty-cta-card h3 {
  font-size: 42px;
  line-height: 48px;
  font-weight: bold;
  margin-bottom: 0;
  color: #fff;
}

.faculty-cta-card p {
  font-size: 18px;
  line-height: 28px;
  max-width: 60%;
  margin: 30px auto;
  color: #fff;
}

.faculty-cta-card .buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: center;
}

/* FAQ styles */
.faq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}

.faq-accordion .accordion-item {
  border: 0;
  border-left: 5px solid transparent;
  padding: 18px 22px;
  margin-bottom: 14px;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  overflow: hidden;
}

.faq-accordion .accordion-item.active{
  border-left: 5px solid #df2818;
  background: rgba(223, 40, 24, 0.06);
}

.faq-accordion .accordion-button {
  font-weight: 600;
  font-size: 18px;
  color: #101828;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.faq-accordion .accordion-button:focus{
  outline: none;
  box-shadow: none;
}

.faq-accordion .accordion-button:not(.collapsed) {
  color: #df2818;
}

.faq-accordion .accordion-body {
  padding: 20px 0 0 0;
  background: transparent;
}

.cms-page-bg{
  position: relative;
}

.cms-page-bg:before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../images/gradient-bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
  opacity: 0.4;
}

.cms-styling{
  font-size: 18px;
  line-height: 28px;
  color: rgba(0, 0, 0, 1);
}

.cms-styling p,
.cms-styling ul li{
  margin-bottom: 10px;
}

.cmn-section + .cmn-section{
  margin-top: 30px;
}

.cmn-section h2{
  font-size: 28px;
  line-height: 36px;
}

.cms-footer{
  font-size: 14px;
  line-height: 26px;
  margin-top: 40px;
}

.cms-footer p{
  margin: 0;
}

.interpretation-grid{
  grid-template-columns: repeat(2, 1fr);
}

.interpretation-card:first-child{
  grid-column: span 2;
}

.interpretation-card:not(:first-child){
  flex-direction: column;
}

.common-inner-section-content{
  font-size: 18px;
  line-height: 30px;
  font-weight: 300;
}

.common-multi-section-wrapper{
  display: flex;
  flex-direction: column;
  row-gap: 25px;
}

.common-multi-section .abt-msn-vsn-title{
  margin-bottom: 20px;
}

.translation-right-content .section-content{
  margin-bottom: 30px;
}

.alt-check-list-wrap.check-list{
  font-size: 20px;
  line-height: 28px;
  margin: 0;
}

.alt-check-list-wrap.check-list li{
  background-image: url(../images/about-up-arrow.svg);
  font-weight: 300;
  background-position: top 6px left 0;
}

.bg-deep .alt-check-list-wrap.check-list li{
  background-image: url(../images/listing-up-arrow.svg);
}

.translation-image-wrap,
.translation-about-image-wrap{
  width: 100%;
  height: 100%;
}

.translation-center-image-wrap{
  position: relative;
}

.translation-image-wrap img{
  max-width: 100%;
  width: 100%;
  height: 100%;
  border-radius: 30px;
  position: relative;
  z-index: 2;
}

.translation-center-image-wrap img{
  max-width: 100%;
  width: 100%;
  height: 100%;
  border-radius: 30px;
  position: relative;
  z-index: 2;
}

.translation-center-image-wrap:before{
  content: '';
  position: absolute;
  background-image: url(../images/bg-stroke-img.png);
  background-repeat: no-repeat;
  background-position: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw;
  height: 100%;
  opacity: 0.6;
}

.bg-deep .translation-center-image-wrap:before{
  background-image: url(../images/white-bg-stroke-img.png);
}

.restrict-content{
  overflow: hidden;
}

.translation-counter-content{
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.translation-counter-content .counter-content-grid{
  max-width: 100%;
}

.footer-counter-content{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  column-gap: 20px;
}

.footer-counter-content-grid{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
}

.footer-counter-numbers{
  font-size: 32px;
  line-height: 40px;
  font-family: "Manrope", sans-serif;
  margin-bottom: 5px;
  font-weight: 600;
}

.footer-counter-title{
  font-weight: 300;
  font-size: 14px;
  line-height: 20px;
}

.footer-bottom-section{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.footer-made-with-text{
  font-size: 14px;
  line-height: 20px;
  display: flex;
  align-items: center;
  column-gap: 5px;
  min-width: 230px;
}

.footer-center-text{
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 14px;
  line-height: 22px;
}

.footer-center-text p{
  margin: 0;
}

.footer-right-page-link{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  column-gap: 15px;
  min-width: 230px;
}

.footer-page-link{
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
  line-height: 22px;
}

.footer-page-link:hover{
  color: rgba(255, 255, 255, 1);
}

.video-popup-wrapper .modal-dialog{
  max-width: 800px;
}

.video-popup-wrapper .modal-content{
  background-color: transparent;
  border: 0;
  border-radius: 10px;
}

.video-popup-wrapper .modal-content .btn-close{
  position: absolute;
  right: -20px;
  top: -20px;
  width: 40px;
  height: 40px;
  opacity: 1;
  z-index: 1;
  background: no-repeat;
}

.video-popup-wrapper .modal-body{
  padding: 0;
}

.about-video-wrapper{
  width: 100%;
  height: 400px;
}

.about-video{
  aspect-ratio: 1 / 1;
  max-inline-size: 100%;
  width: 100%;
  height: 100%;
}

.interpretation-image-wrap{
  position: relative;  
}

.interpretation-image-wrap img{
  border-radius: 20px;
  position: relative;
  z-index: 2;
}

.image-left-pattern:before,
.image-right-pattern:before{
  content: '';
  position: absolute;
  top: 0;
  border-radius: 20px;
  background: rgba(5, 95, 153, 0.56);
  width: 100%;
  height: 100%;
}

.image-left-pattern:before{
  transform: rotate(-4deg);
  left: -5px;
}

.image-right-pattern:before{
  left: 5px;
  transform: rotate(4deg);
}

.interpretation-header-section{
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
}

.center-interpretation-img{
  position: relative;
}

.center-interpretation-img img{
  border-radius: 20px;
  position: relative;
  z-index: 2;
}

.center-interpretation-img:before,
.center-interpretation-img:after{
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  z-index: 1;
}

.center-interpretation-img:before {
  transform: rotate(-4deg);
  background: rgba(2, 93, 152, 1);
  left: -15px;
}

.center-interpretation-img:after{
  left: 15px;
  background: rgba(5, 95, 153, 0.56);
  transform: rotate(4deg);
}

.header-content-inner-section{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.header-content-inner-section .section-content{
  margin-bottom: 50px;
}

.center-content-inner-section-wrapper{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 32px;
  margin-top: 50px;
}

.center-content-section{
  display: flex;
  flex-direction: column;
}

/* finishing school */
/* -----------------------------------------------
   HERO BANNER
----------------------------------------------- */
.sf-hero-section .container{
  max-width: 1600px;
}

.fs-hero {
  position: relative;
  overflow: hidden;
}

.fs-hero:before,
.fs-hero:after{
  content: "";
  position: absolute;
  top: 0;
  width: 30%;
  height: 100%;
  background: #FFF;
  z-index: 1;
}

.fs-hero:before{
  left: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.85) 20%, rgba(255, 255, 255, 0) 100%);
}

.fs-hero:after{
  right: 0;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0.85) 20%, rgba(255, 255, 255, 0) 100%);
}

.fs-hero-bg {
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
  position: relative;
  padding: 70px 0;
}

.fs-banner-main-section{
  background-image: none !important;
}

.fs-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0, 65, 107, 0.82) 0%, rgba(0, 65, 107, 0.65) 60%, rgba(0, 65, 107, 0.50) 100%);
}

.fs-hero-container {
  z-index: 10;
}

.fs-hero-row-bridge {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: #f0f4f68c;
  border: 1px solid rgba(0, 65, 107, 0.2);
  border-radius: 16px;
  backdrop-filter: blur(15px);
  margin-top: 60px;
}

.fs-hero-col-bridge{
  flex: 1;
}

/* Hero left content */
.inner-bnr-sec .hero-title{
  margin-bottom: 20px;
}

.hero-banner-sub-title{
  margin: 0 0 30px 0;
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
}

.hero-banner-text{
  font-size: 18px;
  line-height: 30px;
  color: #000;
  margin: 0;
  font-weight: 500;
}

.hero-banner-text + .hero-banner-text{
  margin-top: 10px;
}

/* Generic hero card base */
/* Training card */
.fs-training-card {
  padding: 24px;
  max-width: 240px;
  border-radius: 16px;
  padding: 20px;
  background: #f0f4f68c;
  border: 1px solid rgba(0, 65, 107, 0.2);
  border-radius: 16px;
  backdrop-filter: blur(15px);
}

.fs-training-icon {
  font-size: 40px;
  color: var(--hk-deep);
  display: block;
  margin-bottom: 6px;
}

.fs-training-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--hk-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 4px;
}

.fs-training-number {
  font-size: 36px;
  line-height: 42px;
  font-weight: 800;
  color: var(--hk-topbar);
  margin-bottom: 4px;
  font-family: "Manrope", sans-serif;
}

.fs-training-sub {
  font-size: 13px;
  font-weight: 600;
  color: var(--hk-deep);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0;
}

/* 4 C's card */
.fs-fourcee-card {
  padding: 24px;
  max-width: 300px;
  margin-left: auto;
  border-radius: 16px;
  background-color: var(--hk-deep)
}

.fs-fourcee-title {
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 20px;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-wrap: wrap;
  gap: 5px;
}

.fs-fourcee-title .red-text{
  color: var(--hk-topbar);
}

.fs-fourcee-title span {
  display: block;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  color: var(--white);
  text-transform: uppercase;
  width: 100%;
}

.fs-fourcee-list {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.fs-fourcee-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.fs-fourcee-item:not(:last-child) {
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgb(255 255 255 / 20%);
}

.fs-fourcee-item strong {
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
  color: var(--white);
  display: block;
  text-transform: uppercase;
}

.fs-fourcee-item p {
  font-size: 12px;
  line-height: 18px;
  color: var(--white);
  margin-bottom: 0;
  letter-spacing: 0.5px;
}

.fs-fourcee-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid var(--white);
  color: var(--white);
  font-size: 16px;
  flex-shrink: 0;
}

.fs-fourcee-content{
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: calc(100% - 52px);
}

/* Bridge text */
.fs-bridge-text {
  font-size: 20px;
  line-height: 32px;
  font-weight: 700;
  color: var(--hk-deep);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0;
}

/* Campus / Corporate labels */
.fs-campus-label {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  color: var(--hk-deep);
}

.fs-campus-label-right {
  justify-content: flex-end;
}

.fs-campus-icon {
  font-size: 54px;
  line-height: normal;
  flex-shrink: 0;
  margin-top: 0;
  display: flex;
  align-items: flex-start;
}

.fs-campus-text{
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.fs-campus-label strong {
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  display: block;
  margin-bottom: 0;
}

.fs-campus-label p {
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 0;
  color: var(--hk-muted);
  font-weight: 500;
}

/* Skill card & Outcomes card (bottom row) */
.fs-skill-card{
  background-color: #f2f7fd;
}

.fs-outcomes-card{
  background-color: rgba(156, 103, 249, 0.14);
}

.fs-skill-card,
.fs-outcomes-card {
  height: 100%;
  padding: 28px;
  border-radius: 16px;
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 30px;
  overflow: hidden;
}

.fs-skill-card:before,
.fs-outcomes-card:before{
  content: "";
  position: absolute;
  right: 0px;
  bottom: 0;
  width: 120px;
  height: 120px;
  z-index: 0;
  background-size: 8px 8px;
}

.fs-skill-card:before{
  background-image: radial-gradient(rgba(0, 65, 107, 0.14) 1px, transparent 1px);
}

.fs-outcomes-card:before{
  background-image: radial-gradient(rgba(0, 65, 107, 0.14) 1px, transparent 1px);
}

.fs-skill-card-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: var(--hk-deep);
  margin: 0;
  position: relative;
}

.fs-skill-card-title sup {
  font-size: 9px;
}

.fs-outcomes-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  color: #7b4fd4;
  margin: 0;
  position: relative;
}

/* Checklist (hero cards) */
.fs-checklist {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.fs-checklist li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 16px;
  line-height: 28px;
  margin: 0;
  color: rgba(30, 30, 30, 1);
}

.fs-checklist li i {
  font-size: 14px;
  flex-shrink: 0;
}

.fs-skill-card .fs-checklist li i {
  color: var(--hk-deep);
}

.fs-outcomes-card .fs-checklist li i {
  color: #7b4fd4;
}

/* Programme hero card */
.fs-programme-hero-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 64, 108, 0.06);
  border-radius: 16px;
}

.fs-programme-hero-label {
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: var(--hk-deep);
  text-transform: uppercase;
  margin-bottom: 30px;
}

.fs-programme-hero-blocks {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
}

.fs-programme-hero-block {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 15px;
  flex: 1;
}

.fs-programme-hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  font-size: 28px;
}

.fs-programme-hero-content{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.fs-programme-hero-content strong {
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  color: var(--hk-topbar);
  font-family: "Manrope", sans-serif;
}

.fs-programme-hero-content span {
  font-size: 16px;
  line-height: 20px;
  color: #000;
}

/* -----------------------------------------------
  SECTION 3: SKILL GRID
----------------------------------------------- */
.fs-skill-grid-section {
  background: rgba(0, 64, 108, 0.04);
}

.fs-skill-item {
  background: #fff;
  border-radius: 14px;
  padding: 20px 12px 16px;
  border: 1px solid rgba(0, 65, 107, 0.08);
  box-shadow: 0 4px 16px rgba(0, 65, 107, 0.06);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.fs-skill-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.13);
}

.fs-skill-icon,
.fs-outcomes-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 24px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(2, 93, 152, 0.15);
}

.fs-skill-icon{
  color: var(--hk-deep);
}

.fs-outcomes-icon{
  color: #7b4fd4;
}

.fs-skill-item-icon{
  width: 50px;
  height: 50px;
  font-size: 26px;
  margin-bottom: 10px;
  background: rgba(2, 93, 152, 0.12);
  color: #025d98;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fs-skill-item p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
  color: var(--hk-muted);
  margin-bottom: 0;
}

.fs-skill-content{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* -----------------------------------------------
  SECTION 4: STATES
----------------------------------------------- */
.fs-states {
  background: #fff;
}

.fs-state-wrapper{
  padding: 30px 10px;
  border-radius: 18px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  box-shadow: 0 6px 22px rgba(0, 65, 107, 0.07);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fs-state-card{
  max-width: 190px;
  min-width: 190px;
}

.fs-state-map {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  min-height: 110px;
}

.fs-state-center-card{
  padding: 0px 10px;
  margin: 0 10px;
  border-left: 1px solid rgba(0, 65, 107, 0.1);
  border-right: 1px solid rgba(0, 65, 107, 0.1);
}

.fs-state-name {
  font-size: 16px;
  font-weight: 800;
  text-transform: uppercase;
  margin-bottom: 0;
}

/* -----------------------------------------------
  SECTION 5: IMPACT
----------------------------------------------- */
.fa-impact-row{
  padding: 30px 10px;
  display: flex;
  align-items: center;
  border-radius: 18px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  box-shadow: 0 6px 22px rgba(0, 65, 107, 0.07);
  background: #fff;
}

.fs-impact-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(2, 93, 152, 0.12);
  color: rgb(2 93 152);
  font-size: 28px;
  margin-bottom: 16px;
  border: 2px solid rgb(2 93 152);
}

.fs-impact-icon-red {
  background: rgba(232, 77, 111, 0.12);
  color: rgba(232, 77, 111, 1);
  border-color: rgba(232, 77, 111, 1);
}

.fs-impact-icon-green {
  background: rgba(46, 155, 90, 0.12);
  color: rgb(46 155 90);
  border-color: rgb(46 155 90);
}

.fs-impact-number {
  font-size: 30px;
  line-height: 38px;
  font-weight: 800;
  margin-bottom: 6px;
  font-family: "Manrope", sans-serif;
}

.fs-impact-label {
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
  margin: 0;
  margin-top: auto;
}

/* -----------------------------------------------
  SECTION 6: WHY PROGRAMME STANDS OUT
----------------------------------------------- */
.fs-why-programme {
  margin-bottom: 120px;
}

.fs-why-checklist {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 0;
}

.fs-why-checklist li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.fs-why-check-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--hk-topbar);
  font-size: 22px;
  flex-shrink: 0;
}

.fs-why-checklist li strong {
  font-size: 18px;
  font-weight: 700;
  color: var(--hk-deep);
  display: block;
  margin-bottom: 4px;
}

.fs-why-checklist li p {
  font-size: 14px;
  line-height: 22px;
  color: var(--hk-muted);
  margin-bottom: 0;
}

.fs-why-image-wrap {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 65, 107, 0.15);
}

.fs-why-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 20px;
}


/* school foreign languages */

/* -----------------------------------------------
   SHARED SECTION UTILITIES
----------------------------------------------- */
.sfl-section-header {
  margin-bottom: 52px;
}

.sfl-section-tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--hk-topbar);
  background: #FFF1F2;
  border: 1px solid rgba(239, 43, 45, 0.15);
  padding: 4px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.sfl-section-title {
  font-size: 34px;
  line-height: 42px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 10px;
  font-family: "Poppins", sans-serif;
}

.sfl-section-underline {
  display: block;
  width: 52px;
  height: 4px;
  background: var(--hk-topbar);
  border-radius: 4px;
  margin: 0 auto;
}

/* -----------------------------------------------
   SECTION 1 — HERO
----------------------------------------------- */
.sfl-hero {
  position: relative;
  background: #f8fafc url(../images/school-language-bg-image.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: cover;
  padding: 70px 0 60px;
  overflow: hidden;
}

.sfl-hero:before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 70%;
  height: 100%;
  background: linear-gradient(90deg, rgb(255 255 255) 50%, rgba(255, 255, 255, 0) 100%);
}

.sfl-hero .container{
  max-width: 1600px;
}

/* Hero breadcrumb tag */
.sfl-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hk-deep);
  background: var(--hk-ice);
  border: 1px solid rgba(11, 45, 107, 0.12);
  padding: 5px 14px;
  border-radius: 999px;
  margin-bottom: 20px;
}

.sfl-hero-tag i {
  font-size: 13px;
}

/* Heading */
.hero-inner-content .hero-title{
  display: flex;
  flex-direction: column;
  position: relative;
  margin-bottom: 40px;
  padding-bottom: 20px;
  font-weight: 700;
}

.hero-inner-content .hero-title:before{
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 30px;
  height: 3px;
  background-color: var(--hk-topbar);
}

.hero-inner-content .hero-banner-sub-title{
  font-size: 22px;
  line-height: 30px;
  margin: 0 0 15px 0;
}

.hero-inner-content .hero-banner-text{
  font-size: 16px;
  line-height: 28px;
}


/* -------- RIGHT SIDE ILLUSTRATION -------- */
.sfl-hero-illustration {
  width: 100%;
  max-width: 540px;
}

.sfl-illus-desk {
  position: relative;
  background: var(--white);
  border-radius: 24px;
  padding: 36px 28px 28px;
  box-shadow: 0 4px 24px rgba(0, 65, 107, 0.09);
  border: 1px solid var(--hk-ice);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  min-height: 360px;
}

/* Globe */
.sfl-illus-globe {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}

.sfl-illus-globe-glow {
  position: absolute;
  inset: -12px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(11, 45, 107, 0.06) 0%, transparent 70%);
  pointer-events: none;
}

/* Headphones badge */
.sfl-illus-headphones {
  position: absolute;
  top: 20px;
  right: 20px;
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--hk-deep);
  color: var(--white);
  font-size: 11px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 999px;
  box-shadow: 0 3px 12px rgba(11, 45, 107, 0.25);
}

.sfl-illus-headphones i {
  font-size: 14px;
}

/* Stacked books */
.sfl-illus-books {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  max-width: 300px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(11, 45, 107, 0.12);
}

.sfl-book {
  display: flex;
  align-items: center;
  padding: 9px 18px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.sfl-book span {
  flex: 1;
}

.sfl-book-1 { background: #1a2e6b; color: #fff; }
.sfl-book-2 { background: #c0392b; color: #fff; }
.sfl-book-3 { background: #e67e22; color: #fff; }
.sfl-book-4 { background: #2980b9; color: #fff; }
.sfl-book-5 { background: #8e44ad; color: #fff; }
.sfl-book-6 { background: #e74c3c; color: #fff; }
.sfl-book-7 { background: #27ae60; color: #fff; }

/* Floating stat cards */
.sfl-illus-stat {
  position: absolute;
  bottom: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--white);
  border: 1px solid var(--hk-ice);
  padding: 8px 14px;
  border-radius: 12px;
  box-shadow: 0 4px 24px rgba(0, 65, 107, 0.09);
  font-size: 12px;
}

.sfl-illus-stat-left { left: 20px; }
.sfl-illus-stat-right { right: 20px; }

.sfl-illus-stat i {
  font-size: 18px;
  color: var(--hk-deep);
}

.sfl-illus-stat strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 1.2;
}

.sfl-illus-stat span {
  font-size: 11px;
  color: var(--hk-topbar);
  font-weight: 500;
}

/* -----------------------------------------------
   SECTION 2 — WHY CHOOSE US
----------------------------------------------- */
.sfl-why-section {
  background: var(--hk-bg);
}

.sfl-why-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 16px;
  padding: 32px 24px 28px;
  text-align: center;
  height: 100%;
  box-shadow: 0 4px 24px rgba(0, 65, 107, 0.09);
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.sfl-why-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 40px rgba(0, 65, 107, 0.16);
}

.sfl-why-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  font-size: 26px;
  margin-bottom: 16px;
  transition: transform 0.25s ease;
}

.sfl-why-card:hover .sfl-why-icon-wrap {
  transform: scale(1.1);
}

.sfl-why-icon-blue   { background: #EEF4FF; color: #0B2D6B; }
.sfl-why-icon-red    { background: #FFF1F2; color: #EF2B2D; }
.sfl-why-icon-green  { background: #F0FFF4; color: #16A34A; }
.sfl-why-icon-purple { background: #F5F0FF; color: #7C3AED; }
.sfl-why-icon-orange { background: #FFF7ED; color: #EA580C; }
.sfl-why-icon-teal   { background: #F0FDFA; color: #0D9488; }
.sfl-why-icon-pink   { background: #FFF1F2; color: #DB2777; }
.sfl-why-icon-indigo { background: #EEF2FF; color: #4338CA; }

.sfl-why-card-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 8px;
  line-height: 1.4;
}

.sfl-why-card-text {
  font-size: 13px;
  line-height: 1.6;
  color: #64748b;
  margin-bottom: 0;
}

/* -----------------------------------------------
   SECTION 3 — PROGRAMME PATHWAY
----------------------------------------------- */
.sfl-programmes {
  background: var(--white);
}

.sfl-prog-card {
  background: var(--white);
  border-radius: 24px;
  border: 1px solid var(--hk-ice);
  box-shadow: 0 4px 24px rgba(0, 65, 107, 0.09);
  overflow: visible;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sfl-prog-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 40px rgba(0, 65, 107, 0.16);
}

/* Illustration area */
.sfl-prog-img-area {
  border-radius: 24px 24px 0 0;
  position: relative;
  overflow: hidden;
  min-height: 180px;
}

.sfl-prog-img-blue  { background: var(--hk-ice); }
.sfl-prog-img-green { background: #F0FFF4; }
.sfl-prog-img-pink  { background: #FFF1F2; }

/* Illustration content inside area */
.sfl-prog-illus-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  position: relative;
  z-index: 1;
}

.sfl-prog-illus-globe i,
.sfl-prog-illus-laptop i,
.sfl-prog-illus-healthcare i {
  font-size: 56px;
  display: block;
}

.sfl-prog-img-blue  .sfl-prog-illus-globe i    { color: #0B2D6B; }
.sfl-prog-img-green .sfl-prog-illus-laptop i   { color: #16A34A; }
.sfl-prog-img-pink  .sfl-prog-illus-healthcare i { color: #EF2B2D; }

.sfl-prog-illus-flags,
.sfl-prog-cefr-badges,
.sfl-prog-healthcare-badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}

.sfl-prog-illus-flags span {
  font-size: 22px;
  line-height: 1;
}

.sfl-prog-cefr-badges span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 6px;
  background: #16A34A;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

.sfl-prog-healthcare-badges span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(239, 43, 45, 0.12);
  color: #EF2B2D;
  font-size: 15px;
}

/* Mini books inside illustration */
.sfl-prog-illus-books {
  display: flex;
  gap: 4px;
}

.sfl-pb {
  font-size: 10px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: #fff;
}

.sfl-pb-blue    { background: #0B2D6B; }
.sfl-pb-navy    { background: #1e3a8a; }
.sfl-pb-sky     { background: #0284c7; }
.sfl-pb-green   { background: #16A34A; }
.sfl-pb-lime    { background: #65A30D; }
.sfl-pb-emerald { background: #059669; }
.sfl-pb-pink    { background: #DB2777; }
.sfl-pb-rose    { background: #E11D48; }
.sfl-pb-red     { background: #EF2B2D; }

/* Floating circular icon */
.sfl-prog-float-icon {
  position: absolute;
  bottom: -22px;
  left: 28px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  z-index: 10;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  border: 3px solid #fff;
}

.sfl-prog-float-blue  { background: linear-gradient(135deg, #0B2D6B, #1e5cb8); }
.sfl-prog-float-green { background: linear-gradient(135deg, #16A34A, #22c55e); }
.sfl-prog-float-red   { background: linear-gradient(135deg, #EF2B2D, #f87171); }

/* Card body */
.sfl-prog-body {
  padding: 38px 24px 28px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.sfl-prog-title {
  font-size: 28px;
  line-height: 36px;
  font-weight: 700;
  margin-bottom: 25px;
  padding-bottom: 15px;
  font-family: "Poppins", sans-serif;
  position: relative;
}

.sfl-prog-title:before{
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 30px;
  height: 3px;
}

.sfl-blue-card .sfl-prog-title{
  color: var(--hk-deep);
}

.sfl-blue-card .sfl-prog-title:before{
  background-color: var(--hk-deep);
}

.sfl-green-card .sfl-prog-title{
  color: var(--hk-green);
}

.sfl-green-card .sfl-prog-title:before{
  background-color: var(--hk-green);
}

.sfl-red-card .sfl-prog-title{
  color: var(--hk-topbar);
}

.sfl-red-card .sfl-prog-title:before{
  background-color: var(--hk-topbar);
}

.sfl-prog-desc {
  font-size: 16px;
  line-height: 1.65;
  color: var(--hk-muted);
  margin-bottom: 16px;
}

/* Feature list */
.sfl-prog-features {
  margin-bottom: 30px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sfl-prog-features li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--hk-muted);
}

.sfl-prog-features li i {
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 1px;
}

/* Feature icon colors per card */
.sfl-prog-img-blue  ~ .sfl-prog-body .sfl-prog-features li i { color: #0B2D6B; }
.sfl-prog-img-green ~ .sfl-prog-body .sfl-prog-features li i { color: #16A34A; }
.sfl-prog-img-pink  ~ .sfl-prog-body .sfl-prog-features li i { color: #EF2B2D; }

/* CTA Buttons */
.sfl-prog-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 600;
  padding: 14px 22px;
  border-radius: 30px;
  text-decoration: none;
  transition: all 0.25s ease;
  border: none;
  cursor: pointer;
  margin-top: auto;
}

.sfl-prog-btn-blue {
  background: var(--hk-deep);
  color: #fff;
}

.sfl-prog-btn-blue:hover,
.sfl-prog-btn-blue:focus{
  opacity: 0.8;
  color: #fff;
}

.sfl-prog-btn-green {
  background: var(--hk-green);
  color: #fff;
}

.sfl-prog-btn-green:hover,
.sfl-prog-btn-green:focus {
  opacity: 0.8;
  color: #fff;
}

.sfl-prog-btn-red {
  background: var(--hk-topbar);
  color: #fff;
}

.sfl-prog-btn-red:hover,
.sfl-prog-btn-red:focus {
  opacity: 0.8;
  color: #fff;
}

/* CTA_PLACEHOLDER *//* foreign language programme */

/* -----------------------------------------------
   BANNER SECTION
----------------------------------------------- */
.flp-banner {
  position: relative;
  background: #f8fafc url(../images/school-language-bg-image.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: cover;
  padding: 70px 0 60px;
  overflow: hidden;
}

.flp-banner::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 70%;
  height: 100%;
  background: linear-gradient(90deg, rgb(255 255 255) 50%, rgba(255, 255, 255, 0) 100%);
}

/* -----------------------------------------------
   SECTION 2: WHY CHOOSE US
----------------------------------------------- */
.flp-why {
  background: #f8fafc;
}

.flp-why-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  padding: 28px 16px 22px;
  text-align: center;
  height: 100%;
  box-shadow: 0 3px 16px rgba(0, 65, 107, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.flp-why-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 32px rgba(0, 65, 107, 0.13);
}

.flp-why-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  font-size: 28px;
  margin-bottom: 14px;
}

/* Per-card icon bg colours — 8 cards */
.flp-why-grid .col:nth-child(1) .flp-why-icon { background: #EEF4FF; color: var(--hk-deep); }
.flp-why-grid .col:nth-child(2) .flp-why-icon { background: #FFF1F2; color: var(--hk-topbar); }
.flp-why-grid .col:nth-child(3) .flp-why-icon { background: #F0FFF4; color: var(--hk-green); }
.flp-why-grid .col:nth-child(4) .flp-why-icon { background: #F5F0FF; color: #7c3aed; }
.flp-why-grid .col:nth-child(5) .flp-why-icon { background: #FFF7ED; color: #ea580c; }
.flp-why-grid .col:nth-child(6) .flp-why-icon { background: #F0FDFA; color: #0d9488; }
.flp-why-grid .col:nth-child(7) .flp-why-icon { background: #FDF4FF; color: #a21caf; }
.flp-why-grid .col:nth-child(8) .flp-why-icon { background: #EEF2FF; color: #4338ca; }

.flp-why-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
  line-height: 1.45;
}

/* -----------------------------------------------
   SECTION 3: LANGUAGE LEARNING PROGRAMMES
----------------------------------------------- */
.flp-programmes {
  background: var(--white);
}

.flp-prog-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 16px;
  padding: 28px 24px 24px;
  height: 100%;
  box-shadow: 0 3px 18px rgba(0, 65, 107, 0.07);
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.flp-prog-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 32px rgba(0, 65, 107, 0.13);
}

.flp-prog-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  font-size: 24px;
  margin-bottom: 16px;
  flex-shrink: 0;
}

.flp-prog-icon-red    { background: #fff1f2; color: var(--hk-topbar); }
.flp-prog-icon-blue   { background: var(--hk-ice); color: var(--hk-deep); }
.flp-prog-icon-green  { background: #f0fff4; color: var(--hk-green); }
.flp-prog-icon-orange { background: #fff7ed; color: #ea580c; }
.flp-prog-icon-purple { background: #f5f0ff; color: #7c3aed; }

.flp-prog-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 8px;
  font-family: "Poppins", sans-serif;
}

.flp-prog-desc {
  font-size: 16px;
  line-height: 1.65;
  color: #64748b;
  margin-bottom: 14px;
}

.flp-prog-list {
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex: 1;
}

.flp-prog-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 16px;
  line-height: 1.5;
  color: #374151;
}

.flp-prog-list li i {
  color: var(--hk-topbar);
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 3px;
}

.flp-prog-ideal {
  border-radius: 10px;
  padding: 12px 16px;
  margin-top: auto;
}

/* Per-card ideal block bg colours */
.flp-programmes .row .col-lg-4:nth-child(1) .flp-prog-ideal { background: #fff1f2; }
.flp-programmes .row .col-lg-4:nth-child(2) .flp-prog-ideal { background: #EEF4FF; }
.flp-programmes .row .col-lg-4:nth-child(3) .flp-prog-ideal { background: #F0FFF4; }
.flp-programmes .row .col-lg-4:nth-child(4) .flp-prog-ideal { background: #FFF7ED; }
.flp-programmes .row .col-lg-4:nth-child(5) .flp-prog-ideal { background: #F5F0FF; }

.flp-prog-ideal-title {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--hk-deep);
  display: block;
  margin-bottom: 4px;
}

.flp-prog-ideal-text {
  font-size: 14px;
  line-height: 1.6;
  color: var(--hk-muted);
  margin-bottom: 0;
}

/* -----------------------------------------------
   SECTION 4: WHY LEARN A FOREIGN LANGUAGE
----------------------------------------------- */
.flp-why-learn {
  background: #f8fafc;
}

.flp-learn-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  padding: 28px 12px 20px;
  text-align: center;
  height: 100%;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.flp-learn-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.12);
}

.flp-learn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  font-size: 28px;
  margin-bottom: 14px;
}

/* Per-card icon bg colours — 6 cards */
.flp-why-learn .row .col:nth-child(1) .flp-learn-icon { background: #EEF4FF; color: var(--hk-deep); }
.flp-why-learn .row .col:nth-child(2) .flp-learn-icon { background: #FFF7ED; color: #ea580c; }
.flp-why-learn .row .col:nth-child(3) .flp-learn-icon { background: #FFF1F2; color: var(--hk-topbar); }
.flp-why-learn .row .col:nth-child(4) .flp-learn-icon { background: #F0FFF4; color: var(--hk-green); }
.flp-why-learn .row .col:nth-child(5) .flp-learn-icon { background: #F5F0FF; color: #7c3aed; }
.flp-why-learn .row .col:nth-child(6) .flp-learn-icon { background: #F0FDFA; color: #0d9488; }

.flp-learn-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
  line-height: 1.45;
}

/* -----------------------------------------------
   SECTION 5: POPULAR LANGUAGES
----------------------------------------------- */
.flp-languages {
    background: var(--white);
}

.flp-lang-card-row{
  display: flex;
  flex-wrap: wrap;
  row-gap: 20px;
  column-gap: 20px;
  justify-content: center;
}

.flp-lang-card {
  width: calc(33% - 10px);
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.flp-lang-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.13);
}

.flp-lang-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}

.flp-lang-flag img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.flp-lang-info {
  flex: 1;
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.flp-lang-name {
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 5px;
  font-family: "Poppins", sans-serif;
}

.flp-lang-desc {
  font-size: 14px;
  line-height: 1.55;
  color: var(--hk-muted);
  margin-bottom: 10px;
}

.flp-lang-link {
  font-size: 12px;
  font-weight: 600;
  color: var(--hk-topbar);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: gap 0.2s ease;
  margin-top: auto;
}

.flp-lang-link:hover {
  color: var(--hk-topbar);
  gap: 8px;
}

/* More languages card */
.flp-more-card {
  background: var(--hk-ice);
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 14px;
  padding: 20px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.06);
  flex-direction: column;
  gap: 10px;
}

.flp-more-text {
  font-size: 14px;
  line-height: 1.65;
  color: #4a5568;
  margin-bottom: 0;
}

.flp-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  padding: 10px 20px;
  background: var(--hk-deep);
  color: var(--white);
  border-radius: 30px;
  text-decoration: none;
  transition: all 0.25s ease;
}

.flp-more-btn:hover {
  background: #002f50;
  color: var(--white);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.28);
}

/* -----------------------------------------------
   SECTION 6: DUAL CARDS
----------------------------------------------- */
.flp-dual-section {
    background: #f8fafc;
}

.flp-dual-card {
  border: 1px solid var(--hk-ice);
  border-radius: 18px;
  padding: 28px 24px;
  height: 100%;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* Card 1 — Additional Languages Offered: deep blue bg */
.flp-dual-section .row .col-lg-6:nth-child(1) .flp-dual-card {
  background: #f2f7fc;
  border-color: #b5cfff;
}

/* Card 1 — adjust text colours for dark bg */
.flp-dual-section .row .col-lg-6:nth-child(1) .flp-dual-icon-blue {
  background: var(--hk-deep);
  color: #fff;
}

/* Card 2 — Learn Your Way: light ice bg */
.flp-dual-section .row .col-lg-6:nth-child(2) .flp-dual-card {
  background: var(--hk-ice);
  border-color: rgba(0, 65, 107, 0.15);
}

.flp-dual-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 36px rgba(0, 65, 107, 0.13);
}

.flp-dual-card-inner {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 20px;
}

.flp-dual-head-col{
  display: flex;
  align-items: center;
  gap: 15px;
}

.flp-dual-icon-col {
  flex-shrink: 0;
}

.flp-dual-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 26px;
}

.flp-dual-icon-green  { 
  background: var(--hk-green); 
  color: var(--white); 
}

.flp-dual-content-col {
  display: flex;
  flex-direction: column;
}

.flp-dual-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 0px;
  font-family: "Poppins", sans-serif;
}

.flp-dual-section .row .col-lg-6:nth-child(2) .flp-dual-title{
  color: var(--hk-green);  
}

.flp-dual-sub {
  font-size: 16px;
  color: var(--hk-muted);
  margin-bottom: 14px;
}

/* Language tags */
.flp-lang-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 16px;
}

.flp-lang-tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: var(--hk-deep);
  background: var(--hk-ice);
  border: 1px solid var(--hk-deep);
  padding: 4px 12px;
  border-radius: 999px;
  transition: background 0.2s ease, color 0.2s ease;
}

.flp-lang-tag:hover {
  background: var(--hk-deep);
  color: var(--white);
}

.flp-dual-footer-text {
  font-size: 14px;
  line-height: 20px;
  color: var(--hk-deep);
  margin-bottom: 0;
  font-weight: 600;
}

/* Learn Your Way list */
.flp-dual-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 0;
}

.flp-dual-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--hk-muted);
}

.flp-dual-list li i {
  color: var(--hk-green);
  font-size: 16px;
  flex-shrink: 0;
}

.flp-dual-info-line {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 600;
  color: var(--hk-green);
  margin-top: 16px;
  margin-bottom: 0;
}


/* -----------------------------------------------
  COMMON VAKSUDHA CTA — shared across all inner pages
----------------------------------------------- */
.common-inner-cta-section {
  padding: 60px 0;
}

.common-inner-cta-card {
  background: #f0f3fe;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 24px;
  padding: 30px;
  box-shadow: 0 4px 24px rgba(0, 65, 107, 0.09);
  display: flex;
  align-items: center;
  gap: 30px;
}

.common-cta-center-sec{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: calc(100% - 560px);
  position: relative;
}

.common-inner-cta-illus {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 250px;
  width: 100%;
}

.common-inner-cta-illus img {
  max-width: 100%;
  height: auto;
  display: block;
}

.common-cta-end-sec{
  max-width: 250px;
  width: 100%;
  margin-left: auto;
  display: flex;
  align-items: flex-start;
  justify-content: left;
  flex-direction: column;
}

.cmn-cta-tag {
  font-size: 13px;
  line-height: 20px;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 5px;
  font-weight: 500;
}

/* CTA title */
.inner-cta-title {
  font-family: "Poppins", sans-serif;
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 10px;
}

/* CTA sub title */
.inner-cta-sub-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--hk-topbar);
    margin-bottom: 20px;
    line-height: 1.5;
}

/* CTA description */
.inner-cta-desc {
  font-size: 16px;
  line-height: 1.75;
  color: var(--hk-muted);
  margin-bottom: 0px;
}

.inner-cta-desc + .inner-cta-desc{
  margin-top: 10px;
}

/* CTA button — Option A */
.inner-cta-btn {
  background: transparent;
  border: 2px solid var(--hk-deep);
  color: var(--hk-deep);
  border-radius: 999px;
  font-size: 16px;
  line-height: 26px;
  gap: 5px;
  font-weight: 600;
  min-width: 190px;
  min-height: 48px;
  padding: 2px 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 65, 107, 0.3);
}

.inner-cta-btn:hover {
  background: var(--hk-deep);
  color: var(--white);
  transform: translateY(-2px);
  box-shadow: 0 6px 22px rgba(0, 65, 107, 0.25);
}

.common-cta-sml-title{
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
}

/* CTA listing — Option B */
.inner-cta-listing {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 0;
}

.inner-cta-listing li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--hk-muted);
  font-family: "Poppins", sans-serif;
}

.inner-cta-listing li i {
  color: var(--hk-muted);
  font-size: 14px;
  flex-shrink: 0;
}

/* CTA info line — optional */
.cta-info-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 500;
  color: var(--hk-topbar);
  margin-top: 15px;
  margin-bottom: 0;
}

.cta-info-line i {
    font-size: 16px;
    flex-shrink: 0;
}

/* english mastery programme */

/* -----------------------------------------------
   SECTION 1 — BANNER
----------------------------------------------- */
.ep-banner {
  background: #f8fafc url(../images/english-mastery-programme.png);
  background-repeat: no-repeat;
  background-position: right;
  padding: 60px 0 50px;
  position: relative;
  overflow: hidden;
}

.ep-banner:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 80%;
  height: 100%;
  background: linear-gradient(90deg, rgb(255 255 255) 50%, rgba(255, 255, 255, 0) 100%);
}

/* Feature list */
.ep-feature-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.ep-feature-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
  min-width: 80px;
}

.ep-feature-item:not(:last-child){
  border-right: 1px solid #00416b2b;
}

.ep-feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 26px;
  flex-shrink: 0;
}

.ep-icon-blue   { border: 1px solid var(--hk-deep); color: var(--hk-deep); }
.ep-icon-green  { border: 1px solid var(--hk-green); color: var(--hk-green); }
.ep-icon-orange { border: 1px solid #ea580c; color: #ea580c; }
.ep-icon-purple { border: 1px solid #7c3aed; color: #7c3aed; }

.ep-feature-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--hk-deep);
  line-height: 1.35;
}

/* -----------------------------------------------
  SHARED SECTION WRAPPER
----------------------------------------------- */
.ep-section {
  padding: 70px 0;
}

/* -----------------------------------------------
  SECTION 2 — LEARNING LEVELS
----------------------------------------------- */
.ep-levels {
  background: #fff;
}

.ep-level-card {
  border-radius: 18px;
  padding: 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.07);
  position: relative;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ep-level-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 36px rgba(0, 65, 107, 0.13);
}

.ep-level-red{
  background: rgb(223 40 24 / 5%);
  border: 1px solid var(--hk-topbar);
}

.ep-level-blue{
  background: rgb(0 65 107 / 5%);
  border: 1px solid var(--hk-deep);
}

.ep-level-green{
  background: rgb(46 155 90 / 5%);
  border: 1px solid var(--hk-green);
}

/* Level label badge — top left */
.ep-level-label {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 6px 14px;
  border-radius: 10px;
  margin-bottom: 0;
  width: fit-content;
  position: absolute;
  top: -15px;
  left: 30px;
}

.ep-label-red   { background: var(--hk-topbar); color: #fff; }
.ep-label-blue  { background: var(--hk-deep);   color: #fff; }
.ep-label-green { background: var(--hk-green);  color: #fff; }

/* Icon circle */
.ep-level-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  font-size: 30px;
  margin-bottom: 18px;
}

.ep-level-icon-red   { border: 1px solid var(--hk-topbar); color: var(--hk-topbar); }
.ep-level-icon-blue  { border: 1px solid var(--hk-deep); color: var(--hk-deep); }
.ep-level-icon-green { border: 1px solid var(--hk-green); color: var(--hk-green); }

.ep-level-title {
  font-family: "Poppins", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #000;
  margin-bottom: 10px;
}

.ep-level-desc {
  font-size: 16px;
  line-height: 1.7;
  color: var(--hk-muted);
  margin-bottom: 0px;
  flex: 1;
}

/* -----------------------------------------------
  SECTION 3 — CEFR TABLE
----------------------------------------------- */
.ep-cefr {
  background: var(--hk-bg);
}

/* Scroll wrapper */
.ep-table-wrap {
  margin-bottom: 20px;
}

.ep-cefr-table {
  width: 100%;
  min-width: 700px;
  border-collapse: collapse;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  background: #fff;
}

/* Header row */
.ep-cefr-table thead tr th {
  background: var(--hk-deep);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 16px 20px;
  white-space: nowrap;
  border: 1px solid var(--hk-ice);
  border-top: 0;
}

.ep-cefr-table thead tr th:first-child{
  border-left: 0;
  text-align: center;
}

.ep-cefr-table thead tr th:last-child{
  border-right: 0;
}

.ep-cefr-table thead tr th:nth-child(2),
.ep-cefr-table tbody tr td:nth-child(2),
.ep-cefr-table thead tr th:last-child,
.ep-cefr-table tbody tr td:last-child{
  text-align: center;
}

/* Sticky first column */
.ep-cefr-table .ep-col-level {
  position: sticky;
  left: 0;
  min-width: 120px;
  z-index: 2;
}

.ep-cefr-table thead th.ep-col-level {
  background: var(--hk-deep);
  z-index: 3;
}

/* Body rows */
.ep-cefr-table tbody tr {
  border-bottom: 1px solid var(--hk-ice);
  transition: background 0.2s ease;
}

.ep-cefr-table tbody tr:last-child {
  border-bottom: none;
}

/* Alternate row bg */
.ep-cefr-table tbody tr:nth-child(even) {
  background: #f8fafc;
}

.ep-cefr-table tbody td {
  padding: 16px 20px;
  vertical-align: top;
  line-height: 1.6;
  color: var(--hk-deep);
  border: 1px solid rgb(0 65 107 / 20%);
}

.ep-cefr-table tbody tr:first-child td{
  border-top: 0;
}

.ep-cefr-table tbody tr:nth-child(1) td:not(:first-child),
.ep-cefr-table tbody tr:nth-child(2) td:not(:first-child) {
  background: rgb(223 40 24 / 10%);
}

.ep-cefr-table tbody tr:nth-child(3) td:not(:first-child),
.ep-cefr-table tbody tr:nth-child(4) td:not(:first-child) {
  background: rgb(0 65 107 / 10%);
}

.ep-cefr-table tbody tr:nth-child(5) td:not(:first-child),
.ep-cefr-table tbody tr:nth-child(6) td:not(:first-child) {
  background: rgb(46 155 90 / 10%);
}

.ep-cefr-table tbody tr td:first-child{
  border-left: 0;
}

.ep-cefr-table tbody tr td:last-child{
  border-right: 0;
}

/* Sticky first column body cells */
.ep-cefr-table tbody td.ep-col-level {
  min-width: 120px;
  text-align: center;
}

/* CEFR level badges */
.ep-cefr-badge {
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  line-height: 1;
  width: 100%;
  display: inline-flex;
  text-align: center;
  align-items: center;
  justify-content: center;
}

.ep-badge-red   { background: var(--hk-topbar); }
.ep-badge-blue  { background: var(--hk-deep); }
.ep-badge-green { background: var(--hk-green); }

.ep-cefr-user {
  font-size: 14px;
  font-weight: 500;
  color: var(--hk-ice);
  letter-spacing: 0.03em;
}

/* Info bar */
.ep-info-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #f0f3fe;
  border: 1px solid #ced9ff;
  border-radius: 14px;
  padding: 18px 24px;
}

.ep-info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #6185ff;
  color: #2153ff;
  font-size: 24px;
  flex-shrink: 0;
}

.ep-info-text {
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 0;
  color: var(--hk-deep);
}

/* -----------------------------------------------
  SECTION 4 — PROGRAMME FEATURES
----------------------------------------------- */
.ep-features {
  background: #fff;
}

.ep-feat-card {
  background: #fff;
  border: 1px solid var(--hk-ice);
  border-radius: 16px;
  padding: 24px;
  height: 100%;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.ep-feat-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 36px rgba(0, 65, 107, 0.13);
}

.ep-feat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  font-size: 26px;
  margin-bottom: 16px;
  transition: transform 0.25s ease;
}

.ep-feat-card:hover .ep-feat-icon {
  transform: scale(1.1);
}

.ep-feat-icon-red    { background: #FFF1F2; color: var(--hk-topbar); }
.ep-feat-icon-blue   { background: #EEF4FF; color: var(--hk-deep); }
.ep-feat-icon-green  { background: #F0FFF4; color: var(--hk-green); }
.ep-feat-icon-orange { background: #FFF7ED; color: #ea580c; }
.ep-feat-icon-purple { background: #F5F0FF; color: #7c3aed; }
.ep-feat-icon-teal   { background: #F0FDFA; color: #0d9488; }

.ep-feat-title {
  font-family: "Poppins", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 15px;
}

.ep-feat-desc {
  font-size: 16px;
  line-height: 1.7;
  color: var(--hk-muted);
  margin-bottom: 0;
}

/* -----------------------------------------------
  SECTION 5 — CTA MODIFIER (English Programme)
----------------------------------------------- */
.english-programme-cta .common-inner-cta-card {
  background: var(--hk-deep) url(../images/eng-cta-globle.png);
  background-repeat: no-repeat;
  background-position: right 0px bottom -10px;
  background-size: contain;
  position: relative;
  overflow: hidden;
}

/* Subtle world map watermark */
.english-programme-cta .inner-cta-title {
  color: #fff;
}

.english-programme-cta .inner-cta-sub-title {
  color: rgba(255, 255, 255, 0.85);
}

.english-programme-cta .inner-cta-desc {
  color: rgba(255, 255, 255, 0.75);
}

.english-programme-cta .inner-cta-btn {
  border-color: var(--hk-topbar);
  color: #fff;
  background: var(--hk-topbar);
}

.english-programme-cta .inner-cta-btn:hover {
  background: #fff;
  color: var(--hk-deep);
  border-color: #fff;
}

.english-programme-cta .cmn-tag.red-tag {
  background: rgba(223, 40, 24, 0.25);
  color: #ffb3ab;
  border-color: rgba(223, 40, 24, 0.3);
}

.english-programme-cta .common-cta-sml-title {
  color: rgba(255, 255, 255, 0.7);
}

.english-programme-cta .inner-cta-listing li {
  color: rgba(255, 255, 255, 0.9);
}

.english-programme-cta .inner-cta-listing li i {
  color: #7dffb3;
}

/* care connect programme */

/* -----------------------------------------------
   SECTION 1 — BANNER
----------------------------------------------- */
.cc-banner {
  background: #f8fafc url(../images/care-connect-banner.png);
  background-repeat: no-repeat;
  background-position: right 0 center;
  background-size: cover;
  padding: 70px 0;
  overflow: hidden;
  position: relative;
}

.cc-banner::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 70%;
  height: 100%;
  background: linear-gradient(90deg, rgb(255 255 255) 50%, rgba(255, 255, 255, 0) 100%);
}

/* Benefit listing cards */
.cc-benefit{
  margin-top: -40px;
  position: relative;
  z-index: 2;
}

.cc-benefit-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  padding: 30px 0px;
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 16px;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.07);
}

.cc-benefit-item {
  display: flex;
  align-items: center;
  gap: 14px;
  position: relative;
  padding: 0 15px;
}

.cc-benefit-item:not(:last-child):before{
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: calc(100% - 10px);
  background-color: var(--hk-ice);
  width: 2px;
}

.cc-benefit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  font-size: 32px;
  flex-shrink: 0;
}

.cc-icon-blue  { background: #EEF4FF; color: var(--hk-deep); }
.cc-icon-teal  { background: #F0FDFA; color: #0d9488; }
.cc-icon-red   { background: #FFF1F2; color: var(--hk-topbar); }
.cc-icon-green { background: #F0FFF4; color: var(--hk-green); }

.cc-benefit-label {
  font-size: 16px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
}

/* -----------------------------------------------
   SHARED SECTION WRAPPER
----------------------------------------------- */
.cc-section {
  padding: 70px 0;
}

/* -----------------------------------------------
   SECTION 2 — PROGRAMME HIGHLIGHTS
----------------------------------------------- */
.cc-highlights {
  background: #fff;
}

.cc-highlight-card {
  border-radius: 20px;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.cc-highlight-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 40px rgba(0, 65, 107, 0.14);
}

.cc-highlight-blue{background-color: rgb(0 65 107 / 5%); border: 1px solid rgb(0 65 107 / 20%);}
.cc-highlight-green{background-color: rgb(46 155 90 / 5%); border: 1px solid rgb(46 155 90 / 20%);} 
.cc-highlight-purple{background-color: rgb(124 58 237 / 5%); border: 1px solid rgb(124 58 237 / 20%);}

/* Image area */
.cc-highlight-img-area {
  width: 100%;
  height: 250px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}

.cc-img-blue   { background: #EEF4FF; }
.cc-img-green  { background: #F0FFF4; }
.cc-img-purple { background: #F5F0FF; }

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

/* Card body */
.cc-highlight-body {
  padding: 28px 24px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Icon — top of card body, inline flow */
.cc-highlight-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  font-size: 36px;
  margin-bottom: 16px;
  align-self: center;
}

.cc-h-icon-blue{
  color: var(--hk-deep);
  background: rgb(0 65 107 / 10%);
  border: 1px solid rgb(0 65 107 / 30%); 
}
.cc-h-icon-green{
  color: rgb(46 155 90 / 100%);
  background-color: rgb(46 155 90 / 10%);
  border: 1px solid rgb(46 155 90 / 20%);
}
.cc-h-icon-purple{
  color: rgb(124 58 237 / 100%);
  background-color: rgb(124 58 237 / 10%);
  border: 1px solid rgb(124 58 237 / 20%);
}

.cc-highlight-title {
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
  line-height: 1.4;
  text-align: center;
}

.cc-highlight-blue{
  color: var(--hk-deep);
}

.cc-highlight-green{
  color: rgb(46 155 90 / 100%);
}

.cc-highlight-purple{
  color: rgb(124 58 237 / 100%); 
}

/* Highlight listing */
.cc-highlight-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 0;
  flex: 1;
}

.cc-highlight-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 16px;
  line-height: 1.55;
  color: #374151;
}

.cc-highlight-list li i {
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 1px;
}

/* Per-card check icon colour */
.cc-highlight-blue .cc-highlight-list li i { color: var(--hk-deep); }
.cc-highlight-green .cc-highlight-list li i { color: var(--hk-green); }
.cc-highlight-purple .cc-highlight-list li i { color: #7c3aed; }

/* -----------------------------------------------
   CTA 1 MODIFIER — Care Connect Advantage
   Light teal/ice background, map watermark
----------------------------------------------- */
.care-connect-cta-primary {
  border-color: rgba(0, 65, 107, 0.14);
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #d4e1f4 0%, rgba(243, 246, 252, 1) 100%);
}

.care-connect-cta-primary::before {
  content: '';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 100%;
  background-image: url(../images/map-heart-bg-img.png);
  background-repeat: no-repeat;
  background-size: 30%;
  pointer-events: none;
  background-position: right;
}

.care-connect-cta-primary .inner-cta-title {
  color: var(--hk-deep);
}

.care-connect-cta-primary .inner-cta-sub-title {
  color: var(--hk-deep);
  opacity: 0.85;
}

.care-connect-cta-primary .inner-cta-desc {
  color: #4a5568;
}

.care-connect-cta-primary .inner-cta-btn {
  border-color: var(--hk-deep);
  color: var(--hk-deep);
  background: transparent;
}

.care-connect-cta-primary .inner-cta-btn:hover {
  background: var(--hk-deep);
  color: var(--white);
}

.care-connect-cta-primary .cta-info-line {
  color: var(--hk-topbar);
  gap: 4px;
}

/* -----------------------------------------------
   CTA 2 MODIFIER — Enrol Now (dark navy)
----------------------------------------------- */
.care-connect-cta-secondary {
  background: var(--hk-deep);
  border-color: rgba(255, 255, 255, 0.12);
  position: relative;
  overflow: hidden;
}
.care-connect-cta-secondary .inner-cta-title {
  color: #fff;
}

.care-connect-cta-secondary .inner-cta-sub-title {
  color: rgba(255, 255, 255, 0.82);
}

.care-connect-cta-secondary .inner-cta-desc {
  color: rgba(255, 255, 255, 0.7);
}

.care-connect-cta-secondary .cmn-cta-tag {
  background: rgba(223, 40, 24, 0.25);
  color: #ffb3ab;
  border-color: rgba(223, 40, 24, 0.3);
}

/* Enrol button — red filled */
.cc-enrol-btn {
  background: var(--hk-topbar) !important;
  border-color: var(--hk-topbar) !important;
  color: #fff !important;
}

.cc-enrol-btn:hover {
  background: #c0201a !important;
  border-color: #c0201a !important;
  color: #fff !important;
  box-shadow: 0 6px 22px rgba(223, 40, 24, 0.35) !important;
}

/* */

/* foreign single language */

/* -----------------------------------------------
  SECTION 1 — HERO BANNER
----------------------------------------------- */
.fsl-banner {
  position: relative;
  overflow: hidden;
}

.fsl-banner-bg {
  background-repeat: no-repeat;
  background-position: center right;
  background-size: cover;
  position: relative;
  padding: 70px 0 60px;
}

.fsl-banner-bg:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 65%;
  height: 100%;
  background: linear-gradient(90deg, rgb(255 255 255 / 75%) 50%, rgba(255, 255, 255, 0) 100%);
}

.fsl-banner-bg .container{
  max-width: 1600px;
}

/* Banner title */
.fsl-banner-title {
  font-family: "Poppins", sans-serif;
  font-size: 56px;
  line-height: 1.1;
  font-weight: 800;
  color: #fff;
  margin-bottom: 12px;
  letter-spacing: -1px;
}

.fsl-banner-title span {
  font-size: 38px;
  font-weight: 700;
  letter-spacing: -0.5px;
  display: block;
  color: rgba(255, 255, 255, 0.92);
}

/* Feature tags */
.fsl-feature-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 25px 0;
}

.fsl-feature-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 18px;
  font-weight: 600;
  color: #000;
}

.fsl-feature-tag i {
  font-size: 24px;
}

.fsl-feature-tag:hover {
  background: rgba(255, 255, 255, 0.22);
}

/* Banner action buttons */
.fsl-banner-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}

.fsl-enrol-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Right reasons card */
.fsl-reasons-card {
  background: var(--hk-deep);
  border-radius: 16px;
  padding: 20px;
  width: 100%;
  max-width: 300px;
}

.fsl-reasons-title {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 20px;
  text-transform: uppercase;
}

.fsl-reasons-list {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.fsl-reasons-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: var(--white);
  line-height: 1.4;
}

.fsl-reasons-list li:not(:last-child){
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgb(255 255 255 / 20%);
}

.fsl-reasons-list li i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid var(--white);
  color: var(--white);
  font-size: 16px;
  flex-shrink: 0;
}

/* -----------------------------------------------
  SHARED SECTION WRAPPER
----------------------------------------------- */
.fsl-section {
  padding: 60px 0;
}

/* -----------------------------------------------
  SECTION 2 — WHY LEARN + CEFR
----------------------------------------------- */
.fsl-why-grid {
  row-gap: 20px;
}

.fsl-why-grid .fsl-why-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  padding: 20px 14px;
  height: 100%;
  text-align: center;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.07);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.fsl-why-grid .fsl-why-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.12);
}

.fsl-why-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 22px;
  margin-bottom: 12px;
  color: #fff;
}

/* Solid icon backgrounds — white icon colour */
.fsl-col:nth-child(1) .fsl-why-icon { background: var(--hk-topbar); }
.fsl-col:nth-child(2) .fsl-why-icon { background: var(--hk-deep); }
.fsl-col:nth-child(3) .fsl-why-icon { background: #0d9488; }
.fsl-col:nth-child(4) .fsl-why-icon { background: #a21caf; }
.fsl-col:nth-child(5) .fsl-why-icon { background: #ea580c; }
.fsl-col:nth-child(6) .fsl-why-icon { background: var(--hk-green); }

.fsl-why-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 6px;
  line-height: 1.35;
}

.fsl-why-text {
  font-size: 16px;
  color: #64748b;
  line-height: 1.5;
  margin-bottom: 0;
}

/* -----------------------------------------------
  SECTION 2B — TOPIK CARD TRACK
----------------------------------------------- */
.fsl-cefr-section {
  padding-bottom: 60px;
}

/* Horizontal row — cards + arrows — centred, equal height */
.fsl-cefr-track {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  margin-bottom: 0;
}

/* Each column just holds the card — no extra spacing */
.fsl-cefr-col {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex: 1;
  min-width: 140px;
  max-width: 175px;
}

/* Arrow connector between cards */
.fsl-cefr-arrow {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-shrink: 0;
  font-size: 20px;
  color: var(--hk-deep);
  padding: 0 6px;
  margin-top: 10px;
}

/* The card — white bg, rounded corners, full height */
.fsl-cefr-bar {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1);
  height: 100%;
  background: #fff;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.fsl-cefr-bar:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.15);
}

/* Coloured top header strip */
.fsl-cefr-code {
  display: block;
  width: 100%;
  padding: 12px 14px;
  font-size: 16px;
  font-weight: 800;
  color: #fff;
  font-family: "Poppins", sans-serif;
  line-height: 1.2;
  letter-spacing: 0.02em;
}

/* Per-card header colours */
.fsl-cefr-col:nth-child(1) .fsl-cefr-code { background: #3baef0; }
.fsl-cefr-col:nth-child(3) .fsl-cefr-code { background: #16a085; }
.fsl-cefr-col:nth-child(5) .fsl-cefr-code { background: #27ae60; }
.fsl-cefr-col:nth-child(7) .fsl-cefr-code { background: #f39c12; }
.fsl-cefr-col:nth-child(9) .fsl-cefr-code { background: #e67e22; }
.fsl-cefr-col:nth-child(11) .fsl-cefr-code { background: var(--hk-topbar); }

/* Remove old height/bg from bar classes — cards now use white bg */
.fsl-cefr-bar-a1,
.fsl-cefr-bar-a2,
.fsl-cefr-bar-b1,
.fsl-cefr-bar-b2,
.fsl-cefr-bar-c1,
.fsl-cefr-bar-c2 {
  background: #fff;
  border-radius: 12px;
}

/* Card body — name + list */
.fsl-cefr-name {
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  padding: 10px 14px 6px;
  text-align: left;
}

.fsl-cefr-bar-a1 .fsl-cefr-name { color: #3baef0; }
.fsl-cefr-bar-a2 .fsl-cefr-name { color: #16a085; }
.fsl-cefr-bar-b1 .fsl-cefr-name { color: #27ae60; }
.fsl-cefr-bar-b2 .fsl-cefr-name { color: #f39c12; }
.fsl-cefr-bar-c1 .fsl-cefr-name { color: #e67e22; }
.fsl-cefr-bar-c2 .fsl-cefr-name { color: var(--hk-topbar); }

/* Bullet list inside each card */
.fsl-cefr-list {
  list-style: none;
  padding: 0 14px 14px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.fsl-cefr-list li {
  font-size: 12px;
  line-height: 1.45;
  color: #374151;
  font-weight: 400;
  font-family: "Poppins", sans-serif;
  position: relative;
  padding-left: 0;
}

/* Group label — hidden in new design (arrows replace it) */
.fsl-cefr-group-label {
  display: none;
}

/* old col-head — not used */
.fsl-cefr-col-head {
  display: contents;
}

/* Keep old classes that may be referenced elsewhere */
.fsl-cefr-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 18px;
  padding: 28px 24px;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.08);
}

.fsl-cefr-badges { display: flex; gap: 8px; }
.fsl-cefr-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  padding: 10px 8px;
  border-radius: 10px;
  text-align: center;
}
.fsl-cefr-red    { background: var(--hk-topbar); }
.fsl-cefr-blue   { background: var(--hk-deep); }
.fsl-cefr-green  { background: var(--hk-green); }
.fsl-cefr-orange { background: #ea580c; }
.fsl-cefr-light  { opacity: 0.75; }

.fsl-cefr-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 0;
  letter-spacing: 0.04em;
}

.fsl-cefr-note i {
  color: var(--hk-topbar);
  font-size: 18px;
}

/* -----------------------------------------------
  SECTION 3 — LEARNING FORMATS
----------------------------------------------- */
.fsl-format-grid{
  row-gap: 20px;
}

.fsl-format-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 12px;
  padding: 14px 10px;
  height: 100%;
  text-align: center;
  box-shadow: 0 3px 12px rgba(0, 65, 107, 0.06);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.fsl-format-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.12);
}

.fsl-format-card-accent {
  border-color: var(--hk-topbar);
  background: #FFF8F7;
}

.fsl-format-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 34px;
  margin-bottom: 12px;
}

.fsl-format-grid .fsl-col:nth-child(1) .fsl-format-icon   { color: var(--hk-deep); }
.fsl-format-grid .fsl-col:nth-child(2) .fsl-format-icon  { color: var(--hk-green); }
.fsl-format-grid .fsl-col:nth-child(3) .fsl-format-icon { color: #ea580c; }
.fsl-format-grid .fsl-col:nth-child(4) .fsl-format-icon    { color: var(--hk-topbar); }
.fsl-format-grid .fsl-col:nth-child(5) .fsl-format-icon { color: #7c3aed; }
.fsl-format-grid .fsl-col:nth-child(6) .fsl-format-icon   { color: #0d9488; }

.fsl-format-title {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 10px;
}

.fsl-format-text {
  font-size: 16px;
  color: var(--hk-muted);
  line-height: 1.5;
  margin-bottom: 0;
}

/* Career grid */
.fsl-career-grid{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.fsl-career-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 12px;
  padding: 20px;
  height: 100%;
  text-align: center;
  box-shadow: 0 3px 12px rgba(0, 65, 107, 0.06);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.fsl-career-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.12);
}

.fsl-career-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  font-size: 30px;
  margin-bottom: 12px;
  color: var(--hk-deep);
}

.fsl-career-title {
  font-size: 18px;
  line-height: 1.5;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
}

/* -----------------------------------------------
  SECTION 4 — EXPERTS + EXAMS + WHY HK
----------------------------------------------- */

/* Expert cards */
.fsl-experts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.fsl-expert-card {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 10px;
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 3px 12px rgba(0, 65, 107, 0.06);
  transition: transform 0.22s ease;
}


.fsl-expert-img-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 22px;
  flex-shrink: 0;
}

.fsl-experts-grid .fsl-expert-card:nth-child(1) .fsl-expert-img-wrap   { background: #EEF4FF; color: var(--hk-deep); }
.fsl-experts-grid .fsl-expert-card:nth-child(2) .fsl-expert-img-wrap { background: #FFF7ED; color: #ea580c; }
.fsl-experts-grid .fsl-expert-card:nth-child(3) .fsl-expert-img-wrap  { background: #F0FFF4; color: var(--hk-green); }

.fsl-expert-info{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.fsl-expert-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
}

.fsl-expert-text {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 0;
  line-height: 1.45;
}

/* Exam cards */
.fsl-exams-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.fsl-exam-card {
  background: var(--white);
  border-radius: 14px;
  padding: 20px;
  row-gap: 10px;
  box-shadow: 0 3px 12px rgba(0, 65, 107, 0.07);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.fsl-exam-card img{
  height: 25px;
  object-fit: contain;
}

.fsl-exam-full {
  font-size: 14px;
  line-height: 1.4;
  color: var(--hk-muted);
  text-align: center;
}

/* Why HK card */
.fsl-why-hk-card {
  background: var(--hk-deep);
  border-radius: 18px;
  padding: 30px;
  display: flex;
  align-items: center;
  gap: 30px;
  flex-direction: column;
  margin-top: 40px;
}

.fsl-why-hk-card .header-section-center{
  margin: 0;
}

.fsl-why-hk-card .header-section-center .cmn-section-title::after{
  background-color: var(--hk-ice);
}

.fsl-why-hk-card .cmn-section-title {
  color: #fff;
}

.fsl-why-hk-card .cmn-tag {
  background: rgba(255, 255, 255, 0.15);
  color: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.2);
}

.fsl-why-hk-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 30px;
  row-gap: 10px;
  margin-bottom: 0;
}

.fsl-why-hk-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.5;
}

.fsl-why-hk-list li i {
  color: #fff;
  font-size: 16px;
  flex-shrink: 0;
  margin-top: 0;
}

/* -----------------------------------------------
  SECTION 5 — LANGUAGE STRIP + JOURNEY CTA
----------------------------------------------- */

/* Language strip */
.fsl-lang-strip-wrap {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 18px;
  padding: 30px 20px;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.07);
  display: flex;
  align-items: center;
  gap: 15px;
  height: 100%;
}

.fsl-lang-strip-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 0;
  background-color: var(--hk-deep);
  padding: 5px;
  border-radius: 12px;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  width: 100px;
  height: 120px;
}

.fsl-lang-strip-count {
  font-size: 32px;
  font-weight: 600;
  color: var(--white);
  line-height: 1;
}

.fsl-lang-strip-label {
  font-size: 14px;
  font-weight: 500;
  color: var(--hk-ice);
  line-height: 1.3;
}

.fsl-lang-strip-flags {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 8px;
  row-gap: 10px;
  width: calc(100% - 115px);
}

.fsl-lang-flag-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

.fsl-lang-flag-item img{
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
}

.fsl-lang-flag-item span {
  font-size: 22px;
  line-height: 1;
}

.fsl-lang-flag-item small {
  font-size: 13px;
  font-weight: 600;
  color: var(--hk-deep);
  text-align: left;
  line-height: 1.2;
  width: calc(100% - 38px);
}

.fsl-lang-more span {
  width: 30px;
  height: 30px;
  font-size: 20px;
  background-color: var(--hk-deep);
  color: var(--hk-ice);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Journey CTA */
.fsl-journey-cta {
  background: var(--hk-deep);
  border-radius: 18px;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.18);
  position: relative;
  overflow: hidden;
}


.fsl-journey-title {
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
  line-height: 1.35;
}

.fsl-journey-sub {
  font-size: 16px;
  color: var(--hk-ice);
  margin-bottom: 0;
}

.fsl-journey-cta-actions .btn-accent{
  font-size: 18px;
  line-height: 30px;
  font-weight: 600;
  min-width: 170px;
  min-height: 46px;
  padding: 0 16px;
}

/* -----------------------------------------------
  SECTION 6 — BOTTOM STATS BAR (counters only)
----------------------------------------------- */
.fsl-stats-bar {
  margin: 60px 0 120px;
}

/* Full-width counter row */
.fsl-stats-counters {
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 0;
  flex-wrap: wrap;
  padding: 40px 0;
  border-radius: 24px;
  border: 1px solid rgba(0, 65, 107, 0.2);
  box-shadow: 0 10px 32px rgba(0, 65, 107, 0.1);
}

.fsl-stat-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0px 32px;
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  flex: 1;
  min-width: 160px;
}

.fsl-stat-item:last-child {
  border-right: none;
}

.fsl-stat-icon {
  font-size: 36px;
  color: var(--hk-deep);
  flex-shrink: 0;
}

.fsl-stat-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.fsl-stat-info strong,
.fsl-stat-number {
  font-size: 32px;
  font-weight: 600;
  color: var(--hk-deep);
  line-height: 1.1;
  display: block;
}

.fsl-stat-info span {
  font-size: 16px;
  color: var(--hk-deep);
  line-height: 1.3;
}

.fsl-cta-enrol.newsletter-cta-section{
  padding-bottom: 70px;
}

.fsl-cta-enrol .newsletter-cta-feature{
  padding: 0 12px;
  min-width: 200px;
}

/* Keep old action classes — no longer used in fsl but kept for safety */
.fsl-stat-action { display: none; }
.fsl-action-red, .fsl-action-blue, .fsl-action-green { display: none; }


/* school enterpreneur */

/* -----------------------------------------------
   SECTION 1: HERO BANNER
----------------------------------------------- */
.edp-hero .container{
  max-width: 1600px;
}

.edp-hero:after{
  display: none;
}

.edp-hero:before{
  width: 80%;
}

.edp-hero-row {
  --bs-gutter-x: 2rem;
}

.edp-hero-image-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
}

.edp-hero-image {
  width: 100%;
  max-width: 360px;
  border-radius: 20px;
  box-shadow: 0 16px 40px rgba(0, 65, 107, 0.18);
  object-fit: cover;
  aspect-ratio: 4 / 5;
}

.edp-hero-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  z-index: 2;
}

.edp-fourcee-card {
  max-width: 100%;
  margin-left: 0;
  border: 1px solid rgba(0, 65, 107, 0.12);
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.1);
  padding: 20px;
  border-radius: 20px;
  background-color: var(--white);
}

.edp-fourcee-card .fs-fourcee-title {
  margin-bottom: 16px;
}

.edp-fourcee-card .fs-fourcee-title span {
  display: inline;
  width: auto;
  font-size: inherit;
  line-height: inherit;
}

.edp-fourcee-grid{
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.edp-fourcee-icon{
  width: 52px;
  height: 52px;
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
}

.edp-fourcee-content{
  width: calc(100% - 66px);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.edp-fourcee-content li,
.edp-fourcee-content p{
  color: var(--hk-muted);
}

.edp-fourcee-content p{
  font-size: 16px;
  line-height: 26px;
  margin-bottom: 0;
}

.edp-fourcee-title{
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
  margin: 0;
}

.edp-fourcee-green .edp-fourcee-title{
  color: var(--hk-green);
}

.edp-fourcee-blue .edp-fourcee-title{
  color: var(--hk-deep);
}

.edp-fourcee-green .edp-fourcee-icon{
  background: rgba(46, 155, 90, 0.12);
  color: var(--hk-green);
}

.edp-fourcee-blue .edp-fourcee-icon{
  background: rgb(0 65 107 / 12%);
  color: var(--hk-deep);
}

/* -----------------------------------------------
   SECTION 2: PATHWAY TO SUCCESS
----------------------------------------------- */
.edp-pathway-section {
  padding-top: 80px;
}

.edp-pathway-row {
  margin-top: 10px;
}

.edp-path-card {
  background: #fff;
  border-radius: 18px;
  border: 2px solid rgba(0, 65, 107, 0.12);
  padding: 28px 24px 24px;
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.08);
  display: flex;
  flex-direction: column;
}

.edp-path-fieldset{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: -65px 0 20px 0;
}

.edp-path-green {
  border-color: rgba(46, 155, 90, 0.35);
}

.edp-path-blue {
  border-color: rgba(0, 65, 107, 0.25);
}

.edp-path-head {
  text-align: left;
  margin-bottom: 20px;
}

.edp-path-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  font-size: 30px;
  margin-bottom: 0px;
}

.edp-path-icon-green {
  background: #e6fff0;
  color: var(--hk-green);
  border: 2px solid var(--hk-green);
}

.edp-path-icon-blue {
  background: #e0f3ff;
  color: var(--hk-deep);
  border: 2px solid var(--hk-deep);
}

.edp-path-badge {
  display: inline-block;
  font-size: 12px;
  line-height: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 4px 12px;
  border-radius: 999px;
  margin-bottom: 0px;
}

.edp-path-badge-green {
  background: #e6fff0;
  color: var(--hk-green);
}

.edp-path-badge-blue {
  background: #e0f3ff;
  color: var(--hk-deep);
}

.edp-path-title {
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  margin-bottom: 4px;
}

.edp-path-sub {
  font-size: 16px;
  line-height: 24px;
  color: var(--hk-muted);
  margin-bottom: 0;
  font-weight: 500;
}

.edp-path-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
  flex: 1;
}

.edp-path-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 16px;
  line-height: 26px;
  color: var(--hk-text);
  font-weight: 500;
}

.edp-path-green .edp-path-list li i {
  color: var(--hk-green);
  flex-shrink: 0;
  margin-top: 0px;
}

.edp-path-blue .edp-path-list li i {
  color: var(--hk-deep);
  flex-shrink: 0;
  margin-top: 0px;
}

.edp-path-outcome {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 90px 10px 15px;
  width: 100%;
  border-radius: 12px;
  font-size: 14px;
  line-height: 22px;
  font-weight: 500;
  position: relative;
}

.edp-pathway-sml-img {
  position: absolute;
  right: 10px;
  bottom: 0;
  width: 80px;
  height: 80px;
}

.edp-path-outcome-green {
  background: rgba(46, 155, 90, 0.12);
  color: var(--hk-deep);
}

.edp-path-outcome-green i {
  color: var(--hk-green);
}

.edp-path-outcome-blue {
  background: rgba(0, 65, 107, 0.08);
  color: var(--hk-deep);
}

.edp-path-outcome-blue i {
  color: var(--hk-deep);
}

.edp-training-hub {
  background: var(--hk-deep);
  border-radius: 18px;
  padding: 20px;
  color: var(--white);
  text-align: center;
  box-shadow: 0 12px 32px rgba(0, 65, 107, 0.25);
  display: flex;
  flex-direction: column;
}

.edp-training-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  border: 2px solid rgba(255, 255, 255, 0.35);
  font-size: 28px;
  margin-bottom: 14px;
}

.edp-training-image{

}

.edp-training-title {
  font-size: 22px;
  line-height: 30px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 8px;
  text-transform: capitalize;
}

.edp-training-sub {
  font-size: 15px;
  line-height: 22px;
  color: var(--white);
  margin-bottom: 0;
  font-weight: 500;
}

/* -----------------------------------------------
   SECTIONS 3–5: INFO CARDS & IMPACT
----------------------------------------------- */
.edp-info-card-wrapper{
  display: flex;
  flex-direction: column;
  height: 100%;
}

.edp-info-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.08);
  overflow: hidden;
  height: 100%;
}

.edp-about-list {
  padding: 22px;
}

.edp-about-list .fs-why-check-icon.edp-check-green {
  color: var(--hk-green);
}

.edp-philosophy-list {
  padding: 8px 0;
}

.edp-philosophy-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 22px;
}

.edp-philosophy-row:not(:last-child) {
  border-bottom: 1px solid rgba(0, 65, 107, 0.1);
}

.edp-philosophy-row strong {
  display: block;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 4px;
  text-transform: capitalize;
}

.edp-philosophy-row p {
  font-size: 14px;
  line-height: 22px;
  color: var(--hk-muted);
  margin-bottom: 0;
}

.edp-philosophy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 20px;
  flex-shrink: 0;
}

.edp-phil-icon-green {
  background: rgba(46, 155, 90, 0.12);
  color: var(--hk-green);
  border: 2px solid var(--hk-green);
}

.edp-phil-icon-blue {
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  border: 2px solid var(--hk-deep);
}

.edp-phil-icon-purple {
  background: rgba(123, 79, 212, 0.12);
  color: #7b4fd4;
  border: 2px solid #7b4fd4;
}

.edp-phil-icon-orange {
  background: rgba(232, 126, 44, 0.12);
  color: #e87e2c;
  border: 2px solid #e87e2c;
}

.edp-impact-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.08);
  overflow: hidden;
  position: relative;
}

.edp-impact-head {
  border-radius: 0;
}

.edp-impact-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid rgba(0, 65, 107, 0.1);
  background: url(../images/edp-impact-bg-img.png);
  padding: 40px 0 200px;
  background-repeat: no-repeat;
  background-position: bottom -100px center;
  background-size: cover;
  position: relative;
}

.edp-impact-stats:before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 0) 100%);
  width: 100%;
  height: 100%;
}

.edp-impact-stat {
  text-align: center;
  height: 100%;
  position: relative;
  z-index: 6;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.edp-impact-stat:not(:last-child):before{
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 60%;
  background:  rgba(0, 65, 107, 0.1);
}

.edp-impact-stat:last-child{
  border-right: 0;
}

.edp-impact-highlight {
  font-size: 15px;
  line-height: 24px;
  max-width: 220px;
  margin: auto auto 0;
}

/* -----------------------------------------------
   SECTIONS 6–8: BOTTOM STRIPS
----------------------------------------------- */
.edp-bottom-strip-section {
  margin-bottom: 120px;
}

.edp-incubation-cta {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 10px 20px;
  border-radius: 18px;
  background: var(--hk-deep);
  box-shadow: 0 10px 28px rgb(0 65 107 / 25%);
  text-decoration: none;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.edp-incubation-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px 0 10px 28px rgb(0 65 107 / 40%);
}

.edp-incubation-illus {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  flex-shrink: 0;
}

.edp-incubation-illus img {
  max-width: 100%;
  height: auto;
}

.edp-incubation-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.edp-incubation-title {
  font-size: 24px;
  line-height: 32px;
  font-weight: 800;
  color: var(--white);
  text-transform: capitalize;
}

.edp-incubation-sub {
  font-size: 15px;
  line-height: 22px;
  color: var(--white);
  font-weight: 500;
}

.edp-outcome-bar {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 18px 24px;
  border-radius: 16px;
  border: 2px solid rgba(0, 65, 107, 0.18);
  background: #fff;
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.07);
}

.edp-outcome-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  flex-shrink: 0;
}

.edp-outcome-icon img {
  max-width: 100%;
  height: auto;
}

.edp-outcome-content {
  font-size: 18px;
  line-height: 28px;
  color: var(--hk-deep);
  font-weight: 500;
}

.edp-outcome-content strong {
  font-weight: 700;
  width: 100%;
  display: flex;
}

.edp-contact-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  padding: 22px 28px;
  border-radius: 16px;
  background: linear-gradient(90deg, #eef5f9 0%, #f2f7fd 100%);
  border: 1px solid rgba(0, 65, 107, 0.12);
}

.edp-contact-title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 0;
}

.edp-contact-items {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.edp-contact-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  color: var(--hk-deep);
  text-decoration: none;
  transition: color 0.3s ease;
}

.edp-contact-item:hover {
  color: var(--hk-topbar);
}

.edp-contact-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  font-size: 16px;
}

.edp-fourcee-card.fs-fourcee-card{
  padding: 20px;
}

.edp-fourcee-card .fs-fourcee-title{
  font-size: 20px;
  line-height: 28px;
}

.edp-fourcee-card .fs-fourcee-item{
  align-items: center;
}

/* */

/* incubation school */

/* -----------------------------------------------
   SECTION 2: WHAT WE OFFER
----------------------------------------------- */
.is-hero.fs-hero:after{
  display: none;
}

.fs-hero-bg.is-hero-bg{
  background-position: center;
}

.is-offer-section {
  padding-top: 80px;
}

.is-offer-card {
  border-radius: 16px;
  padding: 22px 20px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.07);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.is-offer-card-header{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 15px;
}

.is-offer-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 22px;
  flex-shrink: 0;
}

.is-offer-card-title{
  width: calc(100% - 64px);
  display: flex;
  flex-direction: column;
  gap: 0;
}

.is-offer-title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 700;
  margin-bottom: 0px;
  text-transform: capitalize;
}

.is-offer-sub {
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  margin-bottom: 0px;
  text-transform: capitalize;
}

.is-offer-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 0;
  flex: 1;
}

.is-offer-list li {
  position: relative;
  padding-left: 14px;
  font-size: 13px;
  line-height: 20px;
  color: var(--hk-muted);
  font-weight: 500;
}

.is-offer-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.55;
}

.is-offer-blue {
  background: #f2f7fd;
}

.is-offer-blue .is-offer-icon {
  background: rgba(2, 93, 152, 0.14);
  color: #025d98;
  border: 2px solid #025d98;
}

.is-offer-blue .is-offer-title,
.is-offer-blue .is-offer-sub {
  color: #025d98;
}

.is-offer-green {
  background: #f4fbf7;
}

.is-offer-green .is-offer-icon {
  background: rgba(46, 155, 90, 0.14);
  color: var(--hk-green);
  border: 2px solid var(--hk-green);
}

.is-offer-green .is-offer-title,
.is-offer-green .is-offer-sub {
  color: var(--hk-green);
}

.is-offer-purple {
  background: #f7f3fd;
}

.is-offer-purple .is-offer-icon {
  background: rgba(123, 79, 212, 0.14);
  color: #7b4fd4;
  border: 2px solid #7b4fd4;
}

.is-offer-purple .is-offer-title,
.is-offer-purple .is-offer-sub {
  color: #7b4fd4;
}

.is-offer-orange {
  background: #fff8f2;
}

.is-offer-orange .is-offer-icon {
  background: rgba(232, 126, 44, 0.14);
  color: #e87e2c;
  border: 2px solid #e87e2c;
}

.is-offer-orange .is-offer-title,
.is-offer-orange .is-offer-sub {
  color: #e87e2c;
}

.is-offer-red {
  background: #fff5f6;
}

.is-offer-red .is-offer-icon {
  background: rgba(232, 77, 111, 0.14);
  color: #e84d6f;
  border: 2px solid #e84d6f;
}

.is-offer-red .is-offer-title,
.is-offer-red .is-offer-sub {
  color: #e84d6f;
}

.is-offer-teal {
  background: #f0faf9;
}

.is-offer-teal .is-offer-icon {
  background: rgba(32, 178, 170, 0.14);
  color: #20b2aa;
  border: 2px solid #20b2aa;
}

.is-offer-teal .is-offer-title,
.is-offer-teal .is-offer-sub {
  color: #20b2aa;
}

.is-offer-gold {
  background: #fffbf0;
}

.is-offer-gold .is-offer-icon {
  background: rgba(201, 162, 39, 0.14);
  color: #c9a227;
  border: 2px solid #c9a227;
}

.is-offer-gold .is-offer-title,
.is-offer-gold .is-offer-sub {
  color: #c9a227;
}

.is-offer-navy {
  background: #f2f5f8;
}

.is-offer-navy .is-offer-icon {
  background: rgba(0, 65, 107, 0.12);
  color: var(--hk-deep);
  border: 2px solid var(--hk-deep);
}

.is-offer-navy .is-offer-title,
.is-offer-navy .is-offer-sub {
  color: var(--hk-deep);
}

.is-offer-pink {
  background: #fdf3f8;
}

.is-offer-pink .is-offer-icon {
  background: rgba(214, 51, 132, 0.12);
  color: #d63384;
  border: 2px solid #d63384;
}

.is-offer-pink .is-offer-title,
.is-offer-pink .is-offer-sub {
  color: #d63384;
}

/* Key Benefits sidebar */
.is-benefits-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(0, 65, 107, 0.12);
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.is-benefits-list {
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  flex: 1;
  margin-bottom: 0;
}

.is-benefits-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 22px;
  color: var(--hk-text);
  font-weight: 500;
}

.is-benefits-list li i {
  color: var(--hk-green);
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 2px;
}

.is-benefits-callout {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--hk-green);
  margin-top: auto;
}

.is-benefits-callout-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  color: var(--white);
  font-size: 20px;
  flex-shrink: 0;
}

.is-benefits-callout p {
  font-size: 14px;
  line-height: 22px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 0;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* -----------------------------------------------
   SECTION 3: JOURNEY
----------------------------------------------- */
.is-journey-track {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  margin-top: 20px;
  position: relative;
}

.is-journey-step {
  flex: 1;
  text-align: center;
  padding: 0 10px;
  position: relative;
  z-index: 2;
}

.is-journey-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  font-size: 30px;
  margin: 0 auto 14px;
  border: 2px solid transparent;
}

.is-journey-title {
  font-size: 18px;
  line-height: 26px;
  font-weight: 700;
  margin-bottom: 6px;
  text-transform: capitalize;
}

.is-journey-desc {
  font-size: 13px;
  line-height: 20px;
  color: var(--hk-muted);
  margin-bottom: 0;
  font-weight: 500;
  max-width: 180px;
  margin-left: auto;
  margin-right: auto;
}

.is-journey-connector {
  flex: 0 0 40px;
  height: 2px;
  margin: auto 0;
  border-top: 2px dashed;
  position: relative;
}

.is-journey-connector::after {
  content: "";
  position: absolute;
  right: -8px;
  top: -7px;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 8px solid;
}

.is-journey-blue .is-journey-icon {
  background: rgba(2, 93, 152, 0.12);
  color: #025d98;
  border-color: #025d98;
}

.is-journey-blue .is-journey-title {
  color: #025d98;
}

.is-journey-green .is-journey-icon {
  background: rgba(46, 155, 90, 0.12);
  color: var(--hk-green);
  border-color: var(--hk-green);
}

.is-journey-green .is-journey-title {
  color: var(--hk-green);
}

.is-journey-purple .is-journey-icon {
  background: rgba(123, 79, 212, 0.12);
  color: #7b4fd4;
  border-color: #7b4fd4;
}

.is-journey-purple .is-journey-title {
  color: #7b4fd4;
}

.is-journey-orange .is-journey-icon {
  background: rgba(232, 126, 44, 0.12);
  color: #e87e2c;
  border-color: #e87e2c;
}

.is-journey-orange .is-journey-title {
  color: #e87e2c;
}

.is-journey-pink .is-journey-icon {
  background: rgba(214, 51, 132, 0.12);
  color: #d63384;
  border-color: #d63384;
}

.is-journey-pink .is-journey-title {
  color: #d63384;
}

.is-connector-blue-green {
  border-color: var(--hk-deep);
}

.is-connector-blue-green::after {
  border-left-color: var(--hk-deep);
}

.is-connector-green-purple {
  border-color: var(--hk-green);
}

.is-connector-green-purple::after {
  border-left-color: var(--hk-green);
}

.is-connector-purple-orange {
  border-color: #7b4fd4;
}

.is-connector-purple-orange::after {
  border-left-color: #7b4fd4;
}

.is-connector-orange-pink {
  border-color: #e87e2c;
}

.is-connector-orange-pink::after {
  border-left-color: #e87e2c;
}

/* -----------------------------------------------
   SECTION 4: IMPACT
----------------------------------------------- */
.is-impact-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(0, 65, 107, 0.12);
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.08);
  overflow: hidden;
}

.is-impact-stat {
  text-align: center;
  padding: 32px 0;
  border-right: 1px solid rgba(0, 65, 107, 0.1);
  height: 100%;
}

.is-impact-stat:last-child {
  border-right: 0;
}

.is-impact-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  font-size: 28px;
  margin-bottom: 14px;
  border: 2px solid transparent;
}

.is-impact-icon-green {
  background: rgba(46, 155, 90, 0.12);
  color: var(--hk-green);
  border-color: var(--hk-green);
}

.is-impact-icon-purple {
  background: rgba(123, 79, 212, 0.12);
  color: #7b4fd4;
  border-color: #7b4fd4;
}

.is-impact-icon-orange {
  background: rgba(232, 126, 44, 0.12);
  color: #e87e2c;
  border-color: #e87e2c;
}

.is-impact-icon-navy {
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  border-color: var(--hk-deep);
}

.is-impact-number {
  font-size: 30px;
  line-height: 38px;
  font-weight: 800;
  color: var(--hk-deep);
  margin-bottom: 6px;
  font-family: "Manrope", sans-serif;
}

.is-impact-label {
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
  color: var(--hk-muted);
  margin-bottom: 0;
  max-width: 220px;
  margin-left: auto;
  margin-right: auto;
}

/* -----------------------------------------------
   SECTION 5: APPLY CTA BAR
----------------------------------------------- */
.is-apply-section {
  padding: 0 0 60px;
  margin-bottom: 150px;
}

.is-apply-bar {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
  background: var(--hk-deep);
  border-radius: 18px;
  padding: 28px 32px;
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.2);
}

.is-apply-content {
  flex: 1;
  min-width: 240px;
}

.is-apply-title {
  font-size: 24px;
  line-height: 32px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 6px;
  text-transform: capitalize;
}

.is-apply-desc {
  font-size: 15px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.88);
  margin-bottom: 0;
  font-weight: 500;
}

.is-apply-action {
  flex-shrink: 0;
}

.is-apply-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  border-radius: 999px;
  background: var(--hk-green);
  color: var(--white);
  font-size: 16px;
  line-height: 26px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: background 0.3s ease, transform 0.3s ease;
  box-shadow: 0 6px 18px rgba(46, 155, 90, 0.35);
}

.is-apply-btn:hover {
  background: #268a4a;
  color: var(--white);
  transform: translateY(-2px);
}


/* train the trainer programme */
.ttp-hero .container{
  max-width: 1600px;
}

.fs-hero.ttp-hero{
  height: 600px;
}

.ttp-hero-bg{
  height: 100%;
  display: flex;
  align-items: center;
}

.ttp-hero.fs-hero:before{
  width: 50%;
}

.ttp-hero.fs-hero:after{
  background: linear-gradient(270deg, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 0) 100%);
}

.edp-fourcee-grid.ttp-fourcee-grid{
  flex-direction: column;
}

.edp-fourcee-content.ttp-fourcee-content{
  width: 100%;
}

.ttp-fourcee-card.edp-fourcee-card{
  background-color: var(--hk-deep);
}

.edp-fourcee-green .edp-fourcee-icon.ttp-fourcee-icon{
  border: 1px solid var(--white);
  color: var(--white);
  border-radius: 50%;
  background: transparent;
}

.edp-fourcee-green .edp-fourcee-title.ttp-fourcee-title{
  color: var(--white);  
}

.ttp-fourcee-content ul {
  display: flex;
  align-items: center;
  column-gap: 0px;
}

.ttp-fourcee-content ul li{
  padding: 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ttp-fourcee-content ul li,
.ttp-fourcee-content p{
  color: var(--hk-ice);
  font-size: 14px;
  line-height: 24px;
}

.ttp-fourcee-content ul li:first-child{
  padding-left: 0;
}

.ttp-fourcee-content ul li:not(:last-child){
  border-right: 2px solid var(--hk-ice);
}

/* -----------------------------------------------
   SECTION 2: INFO PANELS
----------------------------------------------- */
.ttp-info-section {
  padding-top: 80px;
}

.ttp-panel-card-wrap{
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ttp-panel-card {
  background: #fff;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 16px;
  padding: 24px 20px;
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.07);
}

.ttp-panel-card-wrap .ttp-panel-card{
  height: 100%;
}

.ttp-about-wrap {
  display: flex;
  align-items: center;
  gap: 14px;
}

.ttp-about-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--hk-deep);
  color: var(--white);
  font-size: 28px;
  flex-shrink: 0;
}

.ttp-about-text.cmn-section-sub {
  font-size: 20px;
  line-height: 32px;
  text-align: center;
}

.ttp-icon-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 16px;
  column-gap: 10px;
  margin-bottom: 0;
}

.ttp-icon-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  line-height: 24px;
  color: var(--hk-text);
  font-weight: 500;
}

.ttp-list-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.08);
  color: var(--hk-deep);
  font-size: 16px;
  flex-shrink: 0;
}

.ttp-highlight-grid{
  row-gap: 20px;
}

.ttp-highlight-item {
  text-align: center;
  padding: 10px 6px;
  height: 100%;
  border-radius: 12px;
  background: rgba(0, 65, 107, 0.03);
  border: 1px solid rgba(0, 65, 107, 0.08);
}

.ttp-highlight-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  font-size: 26px;
  margin-bottom: 12px;
}

.ttp-highlight-item p {
  font-size: 16px;
  line-height: 26px;
  color: var(--hk-deep);
  margin-bottom: 0;
  font-weight: 600;
  text-transform: capitalize;
}

/* -----------------------------------------------
   SECTION 3: 5E MODEL + TAKEAWAYS
----------------------------------------------- */
.ttp-approach-section {
  padding-top: 80px;
  padding-bottom: 80px;
}

.ttp-model-wrap {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 65, 107, 0.12);
}

.ttp-model-head {
  background: var(--hk-deep);
  padding: 16px 24px;
  text-align: center;
}

.ttp-model-title {
  font-size: 24px;
  line-height: 34px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 0;
  text-transform: capitalize;
}

.ttp-model-body {
  background: var(--hk-deep);
  padding: 24px 20px 28px;
}

.ttp-model-track {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.ttp-model-step {
  flex: 1;
  background: var(--white);
  border-radius: 14px;
  padding: 18px 14px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ttp-model-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  color: var(--hk-deep);
  font-size: 40px;
  margin-bottom: 10px;
}

.ttp-model-step-title {
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ttp-model-step p {
  font-size: 16px;
  line-height: 24px;
  color: var(--hk-muted);
  margin-bottom: 0;
  font-weight: 500;
}

.ttp-model-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  font-size: 22px;
  flex-shrink: 0;
  align-self: center;
}

.ttp-takeaway-card {
  display: flex;
  flex-direction: column;
}

.ttp-takeaway-wrap {
  display: flex;
  align-items: center;
  gap: 40px;
  flex: 1;
}

.ttp-check-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 0;
  flex: 1;
}

.ttp-check-list li {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 24px;
  color: var(--hk-text);
  font-weight: 500;
}

.ttp-check-list li i {
  color: var(--hk-green);
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 2px;
}

.ttp-panel-title{
  font-size: 24px;
  line-height: 34px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 20px;
  text-align: center;
  text-transform: capitalize;
}

/* -----------------------------------------------
   SECTION 4: STATS | QUOTE | CAREER
----------------------------------------------- */
.ttp-bottom-row{
  row-gap: 60px;
}

.ttp-bottom-section {
  margin-bottom: 140px;
}

.ttp-stats-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  height: 100%;
  align-items: stretch;
}

.ttp-stat-item {
  text-align: center;
  padding: 20px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  background: #fff;
  box-shadow: 0 4px 16px rgba(0, 65, 107, 0.06);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.ttp-stat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 24px;
  margin-bottom: 10px;
  border: 2px solid transparent;
}

.ttp-stat-icon-red {
  background: rgba(223, 40, 24, 0.12);
  color: var(--hk-topbar);
  border-color: var(--hk-topbar);
}

.ttp-stat-icon-blue {
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  border-color: var(--hk-deep);
}

.ttp-stat-icon-green {
  background: rgba(46, 155, 90, 0.12);
  color: var(--hk-green);
  border-color: var(--hk-green);
}

.ttp-stat-icon-purple {
  background: rgba(123, 79, 212, 0.12);
  color: #7b4fd4;
  border-color: #7b4fd4;
}

.ttp-stat-number {
  font-size: 28px;
  line-height: 34px;
  font-weight: 800;
  margin-bottom: 4px;
  font-family: "Manrope", sans-serif;
}

.ttp-stat-label {
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
  text-transform: capitalize;
}

.ttp-stat-text-only {
  font-size: 14px;
  line-height: 22px;
  margin-top: 4px;
}

.ttp-quote-box {
  position: relative;
  background: #f2f7fd;
  border: 1px solid rgba(0, 65, 107, 0.12);
  border-radius: 16px;
  padding: 32px 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-shadow: 0 6px 20px rgba(0, 65, 107, 0.07);
}

.ttp-quote-mark {
  position: absolute;
  font-size: 44px;
  line-height: 1;
  font-weight: 700;
  color: var(--hk-deep);
  opacity: 0.25;
  font-family: Georgia, serif;
}

.ttp-quote-open {
  top: 0px;
  left: 10px;
}

.ttp-quote-close {
  bottom: 0;
  right: 10px;
  transform: rotate(180deg);
}

.ttp-quote-text {
  font-size: 16px;
  line-height: 28px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
  position: relative;
  z-index: 1;
  max-width: 320px;
}

.ttp-career-card {
  display: flex;
  flex-direction: column;
}

.ttp-career-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  flex: 1;
}

.ttp-career-item {
  text-align: center;
}

.ttp-career-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(0, 65, 107, 0.1);
  color: var(--hk-deep);
  font-size: 24px;
  margin-bottom: 12px;
}

.ttp-career-item p {
  font-size: 16px;
  line-height: 26px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
  text-transform: capitalize;
}

/* */

/* interpreation services */
.ips-hero .container{
  max-width: 1600px;
}

.ips-hero.fs-hero:before{
  background: linear-gradient(90deg, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 0) 100%);
  width: 65%;
}

.ips-hero.fs-hero:after{
  width: 38%;
  background: linear-gradient(270deg, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 0) 100%);
}

.ips-hero .hero-inner-content .hero-banner-text{
  max-width: 600px;
}

.ips-fourcee-card{
  background: var(--hk-deep);
  border: 1px solid var(--hk-deep);
  padding: 20px;
  border-radius: 20px;
}

.ips-fourcee-icon{
  color: var(--hk-ice);
  font-size: 48px;
  line-height: 1;
  display: flex;
  margin-bottom: 8px;
}

.ips-fourcee-content h3{
  font-size: 28px;
  line-height: 36px;
  font-weight: 600;
  color: var(--white);
}

.ips-fourcee-content h3 span{
  color: var(--hk-ice);
}

.ips-feature-list{
  display: flex;
  align-items: center;
  column-gap: 5px;
}

.ips-feature-list .ep-feature-item{
  width: calc(20% - 5px);
  padding: 0 5px;
}

.ep-icon-red {
  border: 1px solid var(--hk-topbar);
  color: var(--hk-topbar);
}
/* */

/* -----------------------------------------------
   INTERPRETATION SERVICES — ips-* classes
----------------------------------------------- */
/* -----------------------------------------------
   SECTION 2 — TYPES OF INTERPRETATION
----------------------------------------------- */
.ips-icon-blue   { background: #EEF4FF; color: var(--hk-deep); }
.ips-icon-red    { background: #FFF1F2; color: var(--hk-topbar); }
.ips-icon-green  { background: #F0FFF4; color: var(--hk-green); }
.ips-icon-purple { background: #F5F0FF; color: #7c3aed; }
.ips-icon-teal   { background: #F0FDFA; color: #0d9488; }
.ips-icon-orange { background: #FFF7ED; color: #ea580c; }

.ips-title-red    { color: var(--hk-topbar); }
.ips-title-green  { color: var(--hk-green); }
.ips-title-purple { color: #7c3aed; }
.ips-title-teal   { color: #0d9488; }
.ips-title-orange { color: #ea580c; }

/* ---- Section 2: Types ---- */
.ips-types-section {
  background: #f4f7fc;
}

.ips-type-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 16px;
  padding: 26px 18px 22px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ips-type-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 32px rgba(0, 65, 107, 0.13);
}

.ips-type-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  font-size: 23px;
  margin-bottom: 14px;
  flex-shrink: 0;
}

.ips-type-title {
  font-size: 24px;
  line-height: 1.4;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 10px;
}

.ips-type-desc {
  font-size: 18px;
  line-height: 1.65;
  color: var(--hk-muted);
  margin-bottom: 14px;
  flex: 1;
}

.ips-type-ideal {
  margin-top: auto;
  background: #f8fafc;
  border-radius: 10px;
  padding: 10px 14px;
  border: 1px solid var(--hk-ice);
}

.ips-type-ideal-label {
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--hk-muted);
  margin-bottom: 7px;
}

.ips-type-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 0;
  padding: 0;
}

.ips-type-list li {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  line-height: 1.4;
  color: var(--hk-text);
}

.ips-type-list li i {
  font-size: 11px;
  color: var(--hk-green);
  flex-shrink: 0;
}

/* ---- Section 3: Gallery ---- */
.ips-gallery-section {
  background: var(--white);
}

.ips-gallery-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  min-height: 240px;
}

.ips-gallery-item {
  overflow: hidden;
  border-radius: 8px;
}

.ips-gallery-placeholder {
  width: 100%;
  height: 100%;
  background: #eef2f7;
  border: 2px dashed #c7d4e4;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #94a3b8;
  font-size: 34px;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.ips-gallery-placeholder:hover {
  background: #dce8f5;
  border-color: var(--hk-deep);
  color: var(--hk-deep);
}

.ips-gallery-placeholder::after {
  content: 'Add Photo';
  font-size: 11px;
  font-weight: 600;
  color: #94a3b8;
  font-family: "Poppins", sans-serif;
  letter-spacing: 0.04em;
}

/* ---- Section 4: Languages We Cover ---- */
.ips-languages-section {
  background: #eef5fb;
  padding: 40px 0;
}

.ips-lang-cover-inner {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  background: var(--white);
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 18px;
  padding: 28px 32px;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.07);
}

.ips-lang-cover-left {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex-shrink: 0;
  min-width: 190px;
}

.ips-lang-cover-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 22px;
  background: var(--hk-deep);
  color: var(--white);
  flex-shrink: 0;
}

.ips-lang-cover-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 5px;
  line-height: 1.3;
}

.ips-lang-cover-count {
  font-size: 16px;
  color: var(--hk-topbar);
  margin-bottom: 0;
}

.ips-lang-cover-body {
  flex: 1;
  min-width: 0;
  border-left: 2px solid rgba(0, 65, 107, 0.12);
  padding-left: 28px;
}

.ips-lang-list-text {
  font-size: 16px;
  line-height: 2;
  color: var(--hk-deep);
  margin-bottom: 10px;
}

.ips-lang-rare {
  font-size: 16px;
  line-height: 1.75;
  color: var(--hk-muted);
  margin-bottom: 0;
}

/* ---- Section 5: Industries We Serve ---- */
.ips-industries-section {
  background: var(--white);
}

.ips-industry-card {
  background: var(--hk-ice);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  padding: 22px 12px 18px;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 3px 12px rgba(0, 65, 107, 0.06);
  transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}

.ips-industry-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.12);
  background: var(--white);
}

.ips-industry-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  font-size: 24px;
  color: var(--hk-deep);
  margin-bottom: 12px;
  flex-shrink: 0;
  transition: background 0.22s ease, color 0.22s ease;
}

.ips-industry-card:hover .ips-industry-icon {
  background: var(--hk-deep);
  color: var(--white);
}

.ips-industry-name {
  font-size: 16px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 0;
  line-height: 1.4;
}

/* ---- Section 6: Why Choose HK + Map ---- */
.ips-why-list {
  display: flex;
  flex-direction: column;
  gap: 13px;
  margin-bottom: 28px;
  padding: 0;
}

.ips-why-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  font-weight: 500;
  color: var(--hk-deep);
  line-height: 1.5;
}

.ips-why-list li i {
  font-size: 16px;
  color: var(--hk-topbar);
  flex-shrink: 0;
}

/* Counter bar inside why section */
.ips-map-wrap{
  border-radius: 14px 14px 0px 0px;
  overflow: hidden;
}

.ips-counter-bar {
  display: flex;
  align-items: stretch;
  background: var(--hk-deep);
  border-radius: 0px 0px 14px 14px;
  padding: 22px 28px;
  box-shadow: 0 6px 24px rgba(0, 65, 107, 0.2);
}

.ips-counter-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  text-align: center;
}

.ips-counter-number {
  font-size: 38px;
  font-weight: 800;
  color: var(--white);
  font-family: "Manrope", sans-serif;
  line-height: 1.1;
  display: block;
}

.ips-counter-label {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
  margin-top: 5px;
}

.ips-counter-divider {
  width: 1px;
  background: rgba(255, 255, 255, 0.2);
  margin: 0 20px;
  align-self: stretch;
}

/* Map */


/* ---- Section 7: Counters strip ---- */
.ips-counters-section {
  margin-bottom: 160px
}

.ips-counters-section.common-padding{
  padding: 0px 0 60px;
}

.ips-counters-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: #ffffff;
  border: 1px solid rgba(0, 65, 107, 0.2);
  border-radius: 24px;
  box-shadow: 0 10px 32px rgba(0, 65, 107, 0.1);
  padding: 40px 20px;
}

.ips-counter-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  transition: background 0.22s ease;
}

.ips-counter-stat:last-child {
  border-right: none;
}

.ips-counter-stat:hover {
  background: rgba(255, 255, 255, 0.05);
}

.ips-counter-stat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  font-size: 24px;
  margin-bottom: 14px;
}

.ips-cstat-blue   { background: #dbf1ff; color: var(--hk-deep); }
.ips-cstat-red    { background: #ffe4e2; color: var(--hk-topbar); }
.ips-cstat-green  { background: #e4ffef; color: var(--hk-green); }
.ips-cstat-orange { background: #F5F0FF;  color: #7c3aed; }

.ips-counter-stat-number {
  display: block;
  font-size: 48px;
  font-weight: 800;
  color: var(--hk-deep);
  font-family: "Manrope", sans-serif;
  line-height: 1.05;
}

.ips-counter-stat-label {
  font-size: 18px;
  color: var(--hk-muted);
  margin-top: 6px;
  line-height: 1.3;
  font-weight: 600;
}

.ips-counter-stat-icon {
  width: 56px;
  height: 56px;
  font-size: 24px;
}


/* translation */

/* -----------------------------------------------
   SECTION 2 — LANGUAGES WE TRANSLATE
----------------------------------------------- */

/* Section wrapper */
.trl-section {
  padding: 50px 0;
  background: #f4f7fc;
}

/* Shared card base */
.trl-lang-card {
  border-radius: 18px;
  padding: 28px 32px;
  height: 100%;
  box-shadow: 0 6px 28px rgba(0, 65, 107, 0.09);
  position: relative;
  overflow: hidden;
}

/* ---- LEFT: Major Languages Card ---- */
.trl-major-card {
  background: var(--white);
  border: 1.5px solid var(--hk-ice);
}

.trl-major-header {
  display: flex;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 22px;
}

.trl-major-count {
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  margin: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.trl-major-count .red-text {
  font-size: 28px;
  color: var(--hk-topbar);
}

.trl-major-badge {
  display: inline-block;
  background: var(--hk-deep);
  color: var(--white);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 5px 14px;
  border-radius: 999px;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Three-column language list */
.trl-major-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 16px;
}

.trl-major-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.trl-lang-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.trl-lang-flag {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  overflow: hidden;
  line-height: 1;
  flex-shrink: 0;
}

.trl-lang-flag img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.trl-lang-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--hk-deep);
  line-height: 1.4;
}

.trl-lang-more-text {
  margin-top: 2px;
}

.trl-lang-more-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--hk-muted);
  font-style: italic;
}

/* ---- RIGHT: Rare Languages Card ---- */
.trl-rare-card {
  display: flex;
  flex-direction: column;
  background: var(--white);
  border: 1.5px solid var(--hk-ice);
}

/* Globe watermark */
.trl-rare-bg-globe {
  position: absolute;
  right: -30px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 200px;
  color: rgba(0, 65, 107, 0.035);
  line-height: 1;
  pointer-events: none;
  z-index: 0;
}

.trl-rare-header {
  position: relative;
  z-index: 1;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.trl-rare-title {
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0 0 6px;
  line-height: 1.3;
  text-align: center;
}

.trl-rare-sub {
  font-size: 13px;
  color: var(--hk-muted);
  margin: 0;
  font-weight: 400;
  text-align: center;
  line-height: normal;
}

/* Rare language grid — horizontal row */
.trl-rare-grid {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  flex: 1;
  position: relative;
  z-index: 1;
  border-radius: 12px;
  overflow: hidden;
}

.trl-rare-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  padding: 0px 8px;
  text-align: center;
  border-right: 1px solid rgba(0, 65, 107, 0.08);
  gap: 8px;
  transition: background 0.22s ease;
}

.trl-rare-item:last-child {
  border-right: none;
}

.trl-rare-item:hover {
  background: #f0f4ff;
}

.trl-rare-latin {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--hk-deep);
  line-height: 1.3;
}

.trl-rare-native {
  display: block;
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-topbar);
  line-height: 1.3;
  font-family: serif;
}

.trl-rare-more {
  background: #f4f7fc;
}

.trl-rare-more .trl-rare-latin {
  font-size: 12px;
  color: var(--hk-muted);
  font-weight: 600;
}

/* ---- SECTION 3: Types of Translation Services ---- */
.trl-types-section {
  background: var(--white);
  padding: 60px 0;
}

/* 9-column icon grid */
.trl-types-grid {
  display: flex;
  flex-wrap: wrap;
  row-gap: 24px;
  column-gap: 16px;
  justify-content: center;
}

/* Each card */
.trl-type-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc(33% - 8px);
  text-align: center;
  padding: 20px 10px;
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 14px;
  box-shadow: 0 3px 14px rgba(0, 65, 107, 0.07);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.trl-type-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 65, 107, 0.13);
}

/* Icon box — rounded square matching the reference */
.trl-type-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  font-size: 24px;
  margin-bottom: 12px;
  flex-shrink: 0;
  color: var(--white);
}

/* Per-card icon colours — matching the reference image */
.trl-icon-blue   { background: #3b82f6; }
.trl-icon-green  { background: #16a34a; }
.trl-icon-navy   { background: var(--hk-deep); }
.trl-icon-orange { background: #f97316; }
.trl-icon-red    { background: var(--hk-topbar); }
.trl-icon-teal   { background: #0d9488; }
.trl-icon-cyan   { background: #0891b2; }
.trl-icon-purple { background: #7c3aed; }
.trl-icon-pink   { background: #db2777; }

/* Card text */
.trl-type-title {
  font-family: "Poppins", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 6px;
  line-height: 1.35;
}

.trl-type-desc {
  font-size: 16px;
  line-height: 1.55;
  color: #64748b;
  margin-bottom: 0;
}

.trl-feature-grid{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  column-gap: 16px;
  row-gap: 16px;
}

.trl-feature-grid-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 10px;
  background: var(--white);
  border: 1.5px solid var(--hk-ice);
  padding: 15px;
  box-shadow: 0 6px 28px rgba(0, 65, 107, 0.09);
  border-radius: 18px;
}

.trl-feature-grid-item i{
  font-size: 28px;
  color: var(--hk-deep);
}

.trl-feature-grid-item span{
  font-size: 18px;
  line-height: 1.5;
  color: var(--hk-deep);
  font-weight: 700;
  text-align: center;
}

/* ---- SECTION 4: Additional Services + Industries ---- */
.trl-addl-section {
  background: #f4f7fc;
  padding: 50px 0;
}

.trl-addl-card-wrapper{
  display: flex;
  flex-direction: column;
  height: 100%;
}

.trl-addl-card {
  background: var(--white);
  border: 1px solid var(--hk-ice);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.07);
}

.trl-addl-heading.cmn-section-title {
  font-size: 22px;
  line-height: 1.3;
  margin-bottom: 0;
}

.trl-addl-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 20px;
  row-gap: 30px;
}

.trl-addl-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: calc(50% - 20px);
}

.trl-addl-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 6px;
  font-size: 18px;
  margin-bottom: 10px;
  color: var(--white);
  flex-shrink: 0;
}

.trl-addl-purple { background: #7c3aed; }
.trl-addl-green  { background: #16a34a; }
.trl-addl-orange { background: #f97316; }
.trl-addl-navy   { background: var(--hk-deep); }
.trl-addl-red    { background: var(--hk-topbar); }

.trl-addl-title {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 6px;
  line-height: 1.3;
}

.trl-addl-desc {
  font-size: 14px;
  line-height: 1.55;
  color: var(--hk-muted);
  margin-bottom: 0;
}

.trl-industries-card {
  background: var(--hk-deep);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 6px 28px rgba(0, 65, 107, 0.2);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.trl-industries-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  flex: 1;
}

.trl-industry-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  gap: 8px;
}


.trl-industry-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 24px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  flex-shrink: 0;
}

.trl-industry-name {
  font-size: 14px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.3;
  font-family: "Poppins", sans-serif;
}

.trl-quote-box.ttp-quote-box{
  background: #fff;
}

.trl-quote-box .ttp-quote-text{
  max-width: 100%;
}

.trl-quote-box .ttp-quote-mark{
  opacity: 1;
}

/* ---- SECTION 5: Translation Counter Bar ---- */
.trl-counter-bar-section {
  margin-bottom: 120px;
}

.trl-counter-bar-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  row-gap: 20px;
  column-gap: 20px;
  flex-wrap: wrap;
}

/* Each stat item */
.trl-cbar-item {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: auto;
  width: calc(50% - 20px);
  justify-content: flex-start;
  padding: 0 0px;
}

/* Vertical divider between items */
.trl-cbar-divider {
  flex-shrink: 0;
  width: 1px;
  height: 52px;
  background: rgba(0, 65, 107, 0.12);
}

/* Circular icon */
.trl-cbar-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  font-size: 24px;
  flex-shrink: 0;
  background: #eef4ff;
  color: var(--hk-deep);
  border: 1.5px solid rgba(0, 65, 107, 0.12);
}

/* Text group */
.trl-cbar-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

/* Animated counter number — red bold */
.trl-cbar-number {
  display: block;
  font-size: 30px;
  font-weight: 800;
  color: var(--hk-topbar);
  font-family: "Manrope", sans-serif;
  line-height: 1.05;
}

/* "Global Reach" static title — same bold red */
.trl-cbar-reach-title {
  display: block;
  font-size: 18px;
  font-weight: 800;
  color: var(--hk-topbar);
  font-family: "Poppins", sans-serif;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Label below the number */
.trl-cbar-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--hk-deep);
  text-transform: uppercase;
  letter-spacing: 0.09em;
  line-height: 1.2;
}

.ttp-incubation-cta.edp-incubation-cta{
  background-color: var(--hk-topbar);
  box-shadow: 0 10px 28px rgb(223 40 24 / 25%);
  padding: 20px;
  height: 100%;
}

.ttp-incubation-cta .edp-incubation-illus{
  width: 60px;
  height: 60px;
  font-size: 32px;
  background-color: #fff;
  color: var(--hk-topbar);
  border-radius: 12px;
}

/* */

/* language lab */
.lls-hero .container{
  max-width: 1600px;
}

.lls-hero.fs-hero:before{
  width: 60%;
}

.ips-forcee-grid-two.ips-fourcee-card{
  background: var(--hk-topbar);
  border: 1px solid var(--hk-topbar);
}

.ips-forcee-grid-two .ips-fourcee-content p{
  margin: 0;
  color: var(--white);
}

/* -----------------------------------------------
   SECTION 2 — WHAT IS A LANGUAGE LAB
----------------------------------------------- */
.lls-what-section {
  background: var(--white);
}

/* Main horizontal card */
.lls-what-row {
  display: flex;
  align-items: stretch;
  flex-direction: column;
  row-gap: 20px;
  border-radius: 0;
  overflow: hidden;
}

/* --- LEFT: icon box + text --- */
.lls-what-left {
  display: flex;
  align-items: center;
  gap: 30px;
  flex: 0 0 auto;
  max-width: 100%;
}

/* Large dark navy icon box */
.lls-what-icon-box {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: 100%;
  background: var(--hk-deep);
  position: relative;
  padding: 10px;
  align-self: stretch;
  width: 120px;
  height: 120px;
  border-radius: 12px;
}

.lls-what-icon-box > i {
  font-size: 44px;
  color: var(--white);
  opacity: 0.9;
}

.lls-what-icon-overlay {
  position: absolute;
  bottom: 20px;
  right: 10px;
  font-size: 22px !important;
  color: rgba(255, 255, 255, 0.5) !important;
  opacity: 1 !important;
}

/* Text block beside icon */
.lls-what-content {
  padding: 0;
  flex: 1;
  min-width: 0;
}

.lls-what-title {
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 10px;
  line-height: 1.3;
  position: relative;
  padding-bottom: 10px;
}

.lls-what-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 44px;
  height: 3px;
  background: var(--hk-topbar);
  border-radius: 2px;
}

.lls-what-desc {
  font-size: 16px;
  line-height: 1.7;
  color: #374151;
  margin-bottom: 0;
}

.lls-what-desc br{
  display: none;
}

/* --- RIGHT: 5 feature tag cards --- */
.lls-what-tags {
  display: flex;
  align-items: stretch;
  flex: 1;
  min-width: 0;
}

.lls-what-tag {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  text-align: center;
  padding: 22px 10px;
  gap: 10px;
  background: var(--white);
  transition: background 0.22s ease;
  position: relative;
}

.lls-what-tag:not(:last-child):before{
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 60%;
  background-color: var(--hk-ice);
}

.lls-what-tag-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #eef4ff;
  color: var(--hk-deep);
  font-size: 24px;
  flex-shrink: 0;
  border: 1.5px solid rgba(0, 65, 107, 0.12);
  transition: background 0.22s ease, color 0.22s ease;
}

.lls-what-tag-label {
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: normal;
  font-family: "Poppins", sans-serif;
}

/* -----------------------------------------------
   SECTION 3 — PHYSICAL LANGUAGE LAB
----------------------------------------------- */

/* Section wrapper */
.lls-physical-section {
  background: #f4f7fc;
}

/* Outer card container */
.lls-physical-card {
  background: var(--white);
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 6px 28px rgba(0, 65, 107, 0.08);
}

/* ---- Row 1: Image + Content ---- */
.lls-physical-top {
  display: flex;
  align-items: stretch;
}

/* Left: Image with overlay banner */
.lls-physical-img-wrap {
  position: relative;
  flex: 0 0 50%;
  max-width: 50%;
  overflow: hidden;
  min-height: 300px;
}

.lls-physical-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Red triangle accent — right side of banner */
.lls-physical-img-triangle {
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 60px 40px 0 0;
  border-color: var(--hk-topbar) transparent transparent transparent;
  z-index: 2;
}

/* Right: Description + list */
.lls-physical-content {
  flex: 1;
  min-width: 0;
  padding: 32px 36px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px solid rgba(0, 65, 107, 0.08);
}

.lls-physical-desc {
  font-size: 18px;
  line-height: 1.75;
  color: var(--hk-text);
  font-weight: 500;
  margin-bottom: 20px;
}

/* Red-check bullet list */
.lls-physical-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 0;
  padding: 0;
}

.lls-physical-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 500;
  color: var(--hk-deep);
  line-height: 1.45;
}

.lls-physical-list li i {
  font-size: 18px;
  color: var(--hk-topbar);
  font-weight: 900;
  flex-shrink: 0;
}

/* ---- Row 2: Equipment icons ---- */
.lls-physical-equipment {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  border-top: 1px solid rgba(0, 65, 107, 0.08);
  background: #f8fafc;
}

.lls-equip-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px 10px 18px;
  border-right: 1px solid rgba(0, 65, 107, 0.08);
  gap: 10px;
  transition: background 0.22s ease;
}

.lls-equip-item:last-child {
  border-right: none;
}

.lls-equip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  font-size: 28px;
  color: var(--hk-deep);
}

.lls-equip-label {
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 0;
  line-height: 1.35;
  font-family: "Poppins", sans-serif;
}

/* -----------------------------------------------
   SECTION 4 — VAKSUDHA CLOUD LAB
----------------------------------------------- */

/* Section wrapper */

/* Outer card */
.lls-vaksudha-card {
  background: var(--white);
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 6px 28px rgba(0, 65, 107, 0.08);
}

/* Red triangle accent — same as physical lab */
.lls-vaksudha-banner-triangle {
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 56px 40px 0 0;
  border-color: var(--hk-topbar) transparent transparent transparent;
  z-index: 2;
}

/* Three-column content row */
.lls-vaksudha-content-row {
  display: flex;
  align-items: center;
  gap: 0;
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0fb 100%);
}

/* ---- LEFT column: Brand + Description + List ---- */
.lls-vaksudha-left {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Brand logo row */
.lls-vaksudha-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.lls-vaksudha-brand-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 26px;
  color: var(--hk-deep);
  width: 60px;
  height: 60px;
}

.lls-vaksudha-brand-icon i {
  font-size: 52px;
  line-height: normal;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lls-vaksudha-v {
  position: absolute;
  font-size: 18px;
  line-height: normal;
  font-weight: 600;
  color: var(--hk-deep);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.lls-vaksudha-brand-name {
  font-size: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 2px;
  line-height: 1.1;
}

.lls-vaksudha-brand-sub {
  font-size: 14px;
  font-weight: 700;
  color: var(--hk-muted);
  text-transform: uppercase;
  margin-bottom: 0;
  line-height: 1.2;
}

.lls-vaksudha-desc {
  font-size: 16px;
  line-height: 1.7;
  color: var(--hk-muted);
  font-weight: 500;
  margin-bottom: 0;
}

/* Checklist */
.lls-vaksudha-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 0;
  padding: 0;
}

.lls-vaksudha-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 500;
  color: var(--hk-deep);
  line-height: 1.4;
}

.lls-vaksudha-list li i {
  font-size: 16px;
  color: var(--hk-deep);
  flex-shrink: 0;
}

/* ---- CENTER column: Device mockup ---- */
.lls-vaksudha-mockup {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 20px;
}

.lls-vaksudha-mockup-img {
  display: block;
  max-width: 100%;
  max-height: 280px;
  object-fit: contain;
  filter: drop-shadow(0 8px 24px rgba(0, 65, 107, 0.14));
}

/* -----------------------------------------------
   SECTION 5 — KEY BENEFITS
----------------------------------------------- */

.lls-benefits-section {
  background: #f4f7fc;
}

/* Heading with flanking lines */
.lls-benefits-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 40px;
}

.lls-benefits-heading {
  font-family: "Poppins", sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: var(--hk-deep);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
  white-space: nowrap;
  line-height: 1.2;
}

.lls-benefits-header-line {
  flex: 1;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0, 65, 107, 0.15) 20%, rgba(0, 65, 107, 0.15) 80%, transparent);
  display: block;
  max-width: 200px;
}

/* 6-column benefit grid */
.lls-benefits-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 3px 16px rgba(0, 65, 107, 0.06);
}

/* Each benefit item */
.lls-benefit-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  padding: 28px 10px;
  border-right: 1px solid rgba(0, 65, 107, 0.08);
  gap: 14px;
  transition: background 0.22s ease;
  background-color: #fff;
}

.lls-benefit-item:last-child {
  border-right: none;
}

.lls-benefit-item:hover {
  background: #f0f6ff;
}

/* Icon */
.lls-benefit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  font-size: 28px;
  color: var(--hk-deep);
  background: transparent;
  flex-shrink: 0;
}

/* Label */
.lls-benefit-label {
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 1.4;
  margin-bottom: 0;
  font-family: "Poppins", sans-serif;
}

/* -----------------------------------------------
   SECTION 6 — COUNTER
----------------------------------------------- */

.lls-counter-section {
  background: var(--white);
  padding: 50px 0;
  margin-bottom: 150px;
}

.lls-counter-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 65, 107, 0.07);
}

.lls-counter-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 32px 20px 28px;
  border-right: 1px solid rgba(0, 65, 107, 0.1);
  gap: 8px;
  background: var(--white);
  transition: background 0.22s ease;
}

.lls-counter-item:last-child {
  border-right: none;
}

.lls-counter-item:hover {
  background: #f8fafc;
}

.lls-counter-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  font-size: 30px;
  color: var(--hk-deep);
  background: transparent;
  flex-shrink: 0;
  margin-bottom: 6px;
}

.lls-counter-number {
  display: block;
  font-size: 42px;
  font-weight: 800;
  color: var(--hk-topbar);
  font-family: "Manrope", sans-serif;
  line-height: 1.05;
}

.lls-counter-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 1.4;
  font-family: "Poppins", sans-serif;
}

/* */

/* career */
.career-intro {
  background-color: var(--hk-ice);
}

.career-intro-inner {
  margin: 0 auto;
  text-align: center;
}

.career-intro-title {
  font-size: 42px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 24px;
  line-height: 1.3;
  font-family: "Poppins", sans-serif;
}

.career-intro-text {
  font-size: 16px;
  line-height: 1.8;
  color: var(--hk-muted);
  margin-bottom: 16px;
  font-family: "Poppins", sans-serif;
}

.career-contact-card {
  background: var(--white);
  border-radius: 12px;
  padding: 30px;
  margin-top: 40px;
  box-shadow: 0 8px 28px rgba(0, 65, 107, 0.08);
  border: 1px solid rgba(0, 65, 107, 0.08);
  display: inline-block;
  text-align: center;
}

.career-contact-heading {
  font-size: 16px;
  font-weight: 500;
  color: var(--hk-deep);
  margin-bottom: 16px;
}

.career-contact-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 600;
  color: var(--hk-topbar);
  text-decoration: none;
  transition: color 0.3s ease, transform 0.3s ease;
}

.career-contact-link:hover {
  color: var(--hk-deep);
  transform: translateY(-2px);
}

.career-contact-link i {
  font-size: 20px;
}

.career-contact-or {
  font-size: 14px;
  font-weight: 600;
  color: var(--hk-muted);
  margin: 12px 0;
  text-transform: uppercase;
}

.career-contact-phone {
  font-size: 16px;
}

.career-contact-sep {
  display: inline-block;
  margin: 0 12px;
  color: var(--hk-muted);
  font-weight: 300;
}

/* Hiring Section */
.career-hiring {
  background: var(--white);
}

.career-hiring-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 40px;
  text-align: center;
  line-height: 1.4;
  font-family: "Poppins", sans-serif;
}

.career-jobs {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 100%;
  margin: 0 auto;
}

.career-job-card {
  background: var(--white);
  border: 1px solid rgba(0, 65, 107, 0.1);
  border-radius: 12px;
  padding: 20px;
  transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.career-job-card:hover {
  box-shadow: 0 8px 32px rgba(0, 65, 107, 0.1);
  border-color: rgba(0, 65, 107, 0.2);
  transform: translateY(-2px);
}

.career-job-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.career-job-info {
  flex: 1;
}

.career-job-name {
  font-size: 28px;
  line-height: 1.4;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 15px;
}

.career-job-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
}

.career-job-meta-item {
  display: flex;
  align-items: center;
  font-size: 16px;
  line-height: 1.5;
  row-gap: 10px;
  column-gap: 6px;
}

.career-job-meta-item:last-child{
  width: 100%;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 0;
}

.career-job-meta-item:last-child .career-meta-label{
  margin-bottom: 6px;
}

.career-meta-label {
  font-weight: 600;
  color: var(--hk-deep);
}

.career-meta-value {
  color: var(--hk-muted);
}

.career-meta-value + .career-meta-value{
  margin-top: 3px;
}

.career-job-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

/* Job Details Accordion */
.career-job-details {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(0, 65, 107, 0.08);
  animation: careerSlideDown 0.35s ease;
}

.career-job-details h3{
  font-size: 24px;
  line-height: 30px;
}

.career-job-details p + h3,
.career-job-details ul + h3,
.career-job-details ul + p{
  margin-top: 20px;
}

@keyframes careerSlideDown {
  from {
    opacity: 0;
    max-height: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    max-height: 600px;
    transform: translateY(0);
  }
}

.career-job-details p {
  font-size: 18px;
  line-height: 1.7;
  color: var(--hk-muted);
  margin-bottom: 14px;
}

.career-job-details ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.career-job-details ul li {
  position: relative;
  padding-left: 16px;
  font-size: 16px;
  line-height: 1.8;
  color: var(--hk-muted);
  margin-bottom: 8px;
}

.career-job-details ul li:last-child{
  margin-bottom: 0;
}

.career-job-details ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--hk-topbar);
}

/* Modal Styles */
.career-modal-content {
  border: none;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.15);
}

.career-modal-header {
  background: var(--hk-deep);
  padding: 20px 28px;
  border-bottom: none;
}

.career-modal-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--white);
  font-family: "Poppins", sans-serif;
}

.career-modal-header .btn-close {
  filter: invert(1);
  opacity: 0.8;
}

.career-modal-header .btn-close:hover {
  opacity: 1;
}

.career-modal-body {
  padding: 32px 28px;
}

.career-apply-form {
  width: 100%;
}

.career-form-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--hk-deep);
  margin-bottom: 6px;
  display: block;
}

.career-form-input {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid rgba(0, 65, 107, 0.15);
  border-radius: 8px;
  font-size: 14px;
  font-family: "Poppins", sans-serif;
  color: var(--hk-text);
  background: var(--white);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
  outline: none;
}

.career-form-input:focus {
  border-color: var(--hk-deep);
  box-shadow: 0 0 0 3px rgba(0, 65, 107, 0.08);
}

.career-form-input::placeholder {
  color: var(--hk-muted);
  opacity: 0.7;
}

.career-form-textarea {
  resize: vertical;
  min-height: 100px;
}

.career-form-file {
  padding: 10px 16px;
  cursor: pointer;
}

/* Life at HSF Section */
.career-life {
  background: var(--white);
}

.career-life-desc {
  font-size: 16px;
  line-height: 1.7;
  color: var(--hk-muted);
  text-align: center;
  max-width: 800px;
  margin: 12px auto 0;
}

.career-life-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 50px;
  border-radius: 0;
  overflow: hidden;
}

.career-life-cell {
  height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.career-life-img {
  overflow: hidden;
}

.career-life-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  display: block;
  transition: transform 0.4s ease;
}

.career-life-img:hover img {
  transform: scale(1.05);
}

.career-life-text {
  background: var(--hk-ice);
  padding: 32px 28px;
  text-align: center;
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
}

.career-life-cell-title { 
  font-size: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 12px;
  line-height: 1.3;
  font-family: "Poppins", sans-serif;
}

.career-life-cell-desc {
  font-size: 16px;
  line-height: 1.7;
  color: var(--hk-muted);
  margin: 0;
}

.career-life-philosophy-list {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  text-align: center;
}

.career-life-philosophy-list li {
  font-size: 14px;
  line-height: 1.8;
  color: var(--hk-deep);
  font-weight: 500;
  position: relative;
  padding-left: 18px;
  text-align: left;
}

.career-life-philosophy-list li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: var(--hk-green);
  font-weight: 700;
}

.career-life-different {
  text-align: center;
  margin-top: 60px;
}

.career-life-different-title {
  font-size: 32px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 1.3;
  font-family: "Poppins", sans-serif;
}

.career-life-join {
  text-align: center;
  margin-top: 32px;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.career-life-join-title {
  font-size: 24px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 14px;
  font-family: "Poppins", sans-serif;
}

.career-life-join-desc {
  font-size: 15px;
  line-height: 1.7;
  color: var(--hk-muted);
  margin-bottom: 20px;
}

.career-life-join-cta {
  font-size: 18px;
  font-weight: 700;
  color: var(--hk-topbar);
  line-height: 1.5;
}

/* */

/* blog detail */

/* ── Hero Image ─────────────────────────────────── */
.bd-hero {
  width: 100%;
}

.bd-hero-img-wrap {
  position: relative;
  max-height: 520px;
  overflow: hidden;
  border-radius: 16px;
}

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

.bd-cat-badge {
  position: absolute;
  top: 24px;
  left: 24px;
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  background: var(--hk-green);
  color: var(--white);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 999px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.bd-cat-badge:hover {
  background: var(--hk-deep);
  color: var(--white);
}

/* ── Layout ─────────────────────────────────────── */
.bd-main {
  background: var(--white);
}

.bd-layout {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
}

/* ── Meta ───────────────────────────────────────── */
.bd-meta {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.bd-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  color: var(--hk-muted);
  font-weight: 500;
}

.bd-meta-item i {
  font-size: 15px;
  color: var(--hk-topbar);
}

.bd-meta-sep {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--hk-muted);
  opacity: 0.5;
}

/* ── Title ──────────────────────────────────────── */
.bd-title {
  font-size: 36px;
  font-weight: 700;
  color: var(--hk-deep);
  line-height: 1.3;
  margin-bottom: 28px;
  font-family: "Poppins", sans-serif;
}

/* ── Body Content ───────────────────────────────── */
.bd-body {
  font-size: 16px;
  line-height: 1.85;
  color: var(--hk-text);
}

.bd-body p {
  margin-bottom: 20px;
}

.bd-body h2 {
  font-size: 26px;
  font-weight: 700;
  color: var(--hk-deep);
  margin: 36px 0 14px;
  font-family: "Poppins", sans-serif;
}

.bd-body h3 {
  font-size: 22px;
  font-weight: 600;
  color: var(--hk-deep);
  margin: 28px 0 12px;
  font-family: "Poppins", sans-serif;
}

.bd-body h4 {
  font-size: 18px;
  font-weight: 600;
  color: var(--hk-deep);
  margin: 24px 0 10px;
}

.bd-body ul,
.bd-body ol {
  padding-left: 22px;
  margin-bottom: 20px;
}

.bd-body ul{
  list-style-type: disc;
}

.bd-body ol{
  list-style-type: decimal;
}

.bd-body ul li,
.bd-body ol li {
  margin-bottom: 7px;
  font-size: 16px;
  line-height: 24px;
}

.bd-body blockquote {
  border-left: 4px solid var(--hk-topbar);
  background: var(--hk-ice);
  padding: 20px 24px;
  margin: 28px 0;
  border-radius: 0 10px 10px 0;
  font-size: 17px;
  font-style: italic;
  color: var(--hk-deep);
  line-height: 1.7;
}

.bd-body img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  margin: 20px 0;
}

.bd-body a {
  color: var(--hk-topbar);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bd-body a:hover {
  color: var(--hk-deep);
}

.bd-body strong {
  font-weight: 700;
  color: var(--hk-deep);
}

/* ── Tags ───────────────────────────────────────── */
.bd-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid rgba(0, 65, 107, 0.08);
}

.bd-tags-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--hk-deep);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.bd-tag {
  display: inline-flex;
  align-items: center;
  padding: 5px 14px;
  border-radius: 999px;
  border: 1px solid rgba(0, 65, 107, 0.15);
  background: var(--hk-ice);
  color: var(--hk-deep);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
}

.bd-tag:hover {
  background: var(--hk-deep);
  color: var(--white);
  border-color: var(--hk-deep);
}

/* ── Post Navigation ────────────────────────────── */
.bd-post-nav {
  display: flex;
  align-items: stretch;
  gap: 16px;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid rgba(0, 65, 107, 0.08);
}

.bd-nav-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  padding: 16px 20px;
  border-radius: 10px;
  border: 1px solid rgba(0, 65, 107, 0.1);
  background: var(--hk-ice);
  text-decoration: none;
  transition: all 0.3s ease;
}

.bd-nav-item:hover {
  background: var(--hk-deep);
  border-color: var(--hk-deep);
}

.bd-nav-item:hover .bd-nav-dir,
.bd-nav-item:hover .bd-nav-title {
  color: var(--white);
}

.bd-nav-next {
  text-align: right;
}

.bd-nav-dir {
  font-size: 12px;
  font-weight: 600;
  color: var(--hk-topbar);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color 0.3s ease;
}

.bd-nav-next .bd-nav-dir {
  justify-content: flex-end;
}

.bd-nav-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--hk-deep);
  line-height: 1.4;
  transition: color 0.3s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── Author Box ─────────────────────────────────── */
.bd-author-box {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-top: 36px;
  padding: 28px 24px;
  background: var(--hk-ice);
  border-radius: 14px;
  border-left: 4px solid var(--hk-deep);
}

.bd-author-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 3px solid var(--white);
  box-shadow: 0 4px 14px rgba(0, 65, 107, 0.12);
}

.bd-author-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bd-author-label {
  font-size: 12px;
  color: var(--hk-muted);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.bd-author-name {
  font-size: 17px;
  font-weight: 700;
  color: var(--hk-deep);
  text-decoration: none;
  font-family: "Poppins", sans-serif;
}

.bd-author-name:hover {
  color: var(--hk-topbar);
}

.bd-author-bio {
  font-size: 14px;
  color: var(--hk-muted);
  line-height: 1.6;
  margin: 0;
}

/* ── Sidebar ────────────────────────────────────── */
.bd-sidebar {
  display: flex;
  flex-direction: column;
  gap: 28px;
  position: sticky;
  top: 100px;
}

.bd-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: 8px;
  background: var(--hk-ice);
  border: 1px solid rgba(0, 65, 107, 0.12);
  color: var(--hk-deep);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  width: 100%;
  justify-content: center;
}

.bd-back-btn:hover {
  background: var(--hk-deep);
  color: var(--white);
  border-color: var(--hk-deep);
}

.bd-sidebar-box {
  background: var(--white);
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 12px;
  padding: 22px 20px;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.06);
}

.bd-share-box {
  background: var(--white);
  border: 1px solid rgba(0, 65, 107, 0.08);
  border-radius: 12px;
  padding: 22px 20px;
  box-shadow: 0 4px 18px rgba(0, 65, 107, 0.06);
}

.bd-sidebar-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--hk-deep);
  margin-bottom: 16px;
  font-family: "Poppins", sans-serif;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--hk-ice);
}

.bd-share-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.bd-share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  font-size: 18px;
  text-decoration: none;
  transition: all 0.3s ease;
  color: var(--white);
}

.bd-share-linkedin  { background: #0077b5; }
.bd-share-twitter   { background: #000000; }
.bd-share-facebook  { background: #1877f2; }
.bd-share-whatsapp  { background: #25d366; }

.bd-share-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
  color: var(--white);
}

.bd-cat-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bd-cat-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 12px;
  border-radius: 8px;
  color: var(--hk-deep);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
  background: transparent;
}

.bd-cat-link:hover,
.bd-cat-item.active .bd-cat-link {
  background: var(--hk-ice);
  color: var(--hk-topbar);
}

.bd-cat-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(0, 65, 107, 0.08);
  color: var(--hk-deep);
  font-size: 12px;
  font-weight: 600;
}

.bd-cat-item.active .bd-cat-count {
  background: var(--hk-topbar);
  color: var(--white);
}

/* ── Related Posts ──────────────────────────────── */
.bd-related {
  background: var(--hk-ice);
}

/* */

.floating-icon-wrap{
  position: fixed;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 999;
}

.floating-icon-wrap .floating-icon{
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 10px 3px rgb(0 0 0 / 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
}

.floating-icon-wrap .floating-icon:hover{
  box-shadow: 0 1px 10px 3px rgb(0 0 0 / 30%);
}