/* ==========================================================================
   Custom Healthcare IT Solutions In UAE — page styles (v2)
   Palette: Ink #0A1428 · Blue #1D6FE0 · Sky #4D94F5 · White #FFFFFF · Mist #F4F8FD
   Type: Sora (display) · Inter (body)
   All selectors are section scoped. No global selectors.
   ========================================================================== */

/* ---------- Page base (scoped to main wrapper) ---------- */
.hcPage {
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
  color: #1B2A44;
  background: #FFFFFF;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
.hcPage h1,
.hcPage h2,
.hcPage h3 {
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  letter-spacing: -0.015em;
}
.hcPage p,
.hcPage li {
  line-height: 1.7;
}
.hcPage a:focus-visible,
.hcPage button:focus-visible,
.hcPage summary:focus-visible {
  outline: 3px solid #4D94F5;
  outline-offset: 3px;
}

/* ---------- Inline text links (interlinking) ---------- */
.hcLink {
  color: #1D6FE0;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}
.hcLink:hover,
.hcLink:focus {
  color: #1559B8;
  text-decoration: underline;
}
.hcLink--dark {
  color: #7FB3F7;
}
.hcLink--dark:hover,
.hcLink--dark:focus {
  color: #A9CCFA;
}

/* ---------- Shared section rhythm ---------- */
.hcSection {
  padding: 30px 0;
}
.hcSection--light {
  background: #FFFFFF;
  color: #1B2A44;
}
.hcSection--light:nth-of-type(even) {
  background: #F4F8FD;
}
.hcSection--dark {
  background: #0A1428;
  color: #E8EEF8;
}
.hcSection__header {
  max-width: 860px;
  margin: 0 auto 56px;
}
.hcSection__title {
  font-size: 2.1rem;
  font-weight: 700;
  margin-bottom: 18px;
}
.hcSection--dark .hcSection__title {
  color: #FFFFFF;
}
.hcSection__lead {
  font-size: 1.06rem;
  color: #4A5B78;
  margin-bottom: 0;
}
.hcSection--dark .hcSection__lead {
  color: #A9BBD6;
}
.hcSection__header .hcSection__lead + .hcSection__lead {
  margin-top: 14px;
}

/* ---------- Buttons ---------- */
.hcBtn {
  display: inline-block;
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-weight: 600;
  font-size: 1rem;
  padding: 15px 38px;
  border-radius: 6px;
  text-decoration: none;
  transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
.hcBtn:hover,
.hcBtn:focus {
  text-decoration: none;
  transform: translateY(-2px);
}
.hcBtn--primary {
  background: #1D6FE0;
  color: #FFFFFF;
  box-shadow: 0 10px 24px rgba(29, 111, 224, 0.28);
  cursor: pointer;
}
.hcBtn--primary:hover,
.hcBtn--primary:focus {
  background: #1559B8;
  color: #FFFFFF;
}
.hcBtn--light {
  background: #FFFFFF;
  color: #0A1428;
  box-shadow: 0 10px 24px rgba(4, 12, 28, 0.30);
}
.hcBtn--light:hover,
.hcBtn--light:focus {
  background: #E7F0FD;
  color: #0A1428;
}

/* ---------- Reveal animation (only when JS has loaded) ---------- */
.hcPage--js .hcReveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.hcPage--js .hcReveal.hcReveal--visible {
  opacity: 1;
  transform: none;
}

/* ---------- Hero ---------- */
.hcHero {
  position: relative;
  min-height: 84vh;
  display: flex;
  align-items: center;
  background-image: url("../images/healthcare-it-solutions-uae/healthcare-it-solutions.webp");
  background-size: cover;
  background-position: center;
  padding: 30px;
}
.hcHero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(6 14 32 / 94%) 0%, rgb(8 20 44 / 93%) 100%);
}
.hcHero__inner {
  position: relative;
  z-index: 1;
}
.hcHero__title {
  color: #FFFFFF;
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 22px;
}
.hcHero__text {
  color: #CBD9EF;
  font-size: 1.15rem;
  margin-bottom: 36px;
}

/* ---------- Services: CSS-only vertical tabs (radio-driven, no JS needed) ---------- */
.hcServices__widget {
  position: relative;
}
.hcServices__radio {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}
.hcServices__layout {
  align-items: flex-start;
}
.hcServices__tabs {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: #F4F8FD;
  border: 1px solid #E1EAF7;
  border-radius: 12px;
  padding: 12px;
}
.hcServices__tab {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  border-left: 3px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-weight: 600;
  font-size: 0.92rem;
  color: #4A5B78;
  padding: 13px 14px;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  -webkit-user-select: none;
  user-select: none;
}
.hcServices__tab:hover {
  background: #E9F2FE;
  color: #0A1428;
}
.hcServices__tabIcon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  background: #E9F2FE;
  color: #1D6FE0;
  transition: background-color 0.25s ease, color 0.25s ease;
}
/* active tab (radio checked) */
#hcServTab1:checked ~ .hcServices__layout label[for="hcServTab1"],
#hcServTab2:checked ~ .hcServices__layout label[for="hcServTab2"],
#hcServTab3:checked ~ .hcServices__layout label[for="hcServTab3"],
#hcServTab4:checked ~ .hcServices__layout label[for="hcServTab4"],
#hcServTab5:checked ~ .hcServices__layout label[for="hcServTab5"],
#hcServTab6:checked ~ .hcServices__layout label[for="hcServTab6"],
#hcServTab7:checked ~ .hcServices__layout label[for="hcServTab7"],
#hcServTab8:checked ~ .hcServices__layout label[for="hcServTab8"],
#hcServTab9:checked ~ .hcServices__layout label[for="hcServTab9"] {
  background: #FFFFFF;
  color: #1D6FE0;
  border-left-color: #1D6FE0;
  box-shadow: 0 8px 20px rgba(10, 20, 40, 0.08);
}
#hcServTab1:checked ~ .hcServices__layout label[for="hcServTab1"] .hcServices__tabIcon,
#hcServTab2:checked ~ .hcServices__layout label[for="hcServTab2"] .hcServices__tabIcon,
#hcServTab3:checked ~ .hcServices__layout label[for="hcServTab3"] .hcServices__tabIcon,
#hcServTab4:checked ~ .hcServices__layout label[for="hcServTab4"] .hcServices__tabIcon,
#hcServTab5:checked ~ .hcServices__layout label[for="hcServTab5"] .hcServices__tabIcon,
#hcServTab6:checked ~ .hcServices__layout label[for="hcServTab6"] .hcServices__tabIcon,
#hcServTab7:checked ~ .hcServices__layout label[for="hcServTab7"] .hcServices__tabIcon,
#hcServTab8:checked ~ .hcServices__layout label[for="hcServTab8"] .hcServices__tabIcon,
#hcServTab9:checked ~ .hcServices__layout label[for="hcServTab9"] .hcServices__tabIcon {
  background: #1D6FE0;
  color: #FFFFFF;
}
/* keyboard focus ring on the visible label */
#hcServTab1:focus-visible ~ .hcServices__layout label[for="hcServTab1"],
#hcServTab2:focus-visible ~ .hcServices__layout label[for="hcServTab2"],
#hcServTab3:focus-visible ~ .hcServices__layout label[for="hcServTab3"],
#hcServTab4:focus-visible ~ .hcServices__layout label[for="hcServTab4"],
#hcServTab5:focus-visible ~ .hcServices__layout label[for="hcServTab5"],
#hcServTab6:focus-visible ~ .hcServices__layout label[for="hcServTab6"],
#hcServTab7:focus-visible ~ .hcServices__layout label[for="hcServTab7"],
#hcServTab8:focus-visible ~ .hcServices__layout label[for="hcServTab8"],
#hcServTab9:focus-visible ~ .hcServices__layout label[for="hcServTab9"] {
  outline: 3px solid #4D94F5;
  outline-offset: 2px;
}
/* panels: only the checked one is visible — pure CSS, works without JS */
.hcServices__panel {
  display: none;
  background: #FFFFFF;
  border: 1px solid #E1EAF7;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 12px 32px rgba(10, 20, 40, 0.06);
}
#hcServTab1:checked ~ .hcServices__layout #hcServPanel1 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab2:checked ~ .hcServices__layout #hcServPanel2 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab3:checked ~ .hcServices__layout #hcServPanel3 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab4:checked ~ .hcServices__layout #hcServPanel4 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab5:checked ~ .hcServices__layout #hcServPanel5 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab6:checked ~ .hcServices__layout #hcServPanel6 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab7:checked ~ .hcServices__layout #hcServPanel7 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab8:checked ~ .hcServices__layout #hcServPanel8 { display: block; animation: hcPanelIn 0.35s ease; }
#hcServTab9:checked ~ .hcServices__layout #hcServPanel9 { display: block; animation: hcPanelIn 0.35s ease; }
@keyframes hcPanelIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
.hcServices__media {
  margin: 0 0 24px;
  overflow: hidden;
  border-radius: 10px;
}
.hcServices__img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.hcServices__panel:hover .hcServices__img {
  transform: scale(1.04);
}
.hcServices__panelTitle {
  font-size: 1.35rem;
  font-weight: 700;
  color: #0A1428;
  margin-bottom: 14px;
}
.hcServices__panel p {
  color: #4A5B78;
  font-size: 0.97rem;
}
.hcServiceCard__label {
  font-weight: 600;
  color: #0A1428 !important;
  margin-bottom: 8px;
}
.hcServiceCard__list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 16px;
}
.hcServiceCard__list li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 10px;
  color: #4A5B78;
  font-size: 0.95rem;
}
.hcServiceCard__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1D6FE0;
}
.hcServiceCard__list strong {
  color: #0A1428;
}
.hcServiceCard__outcome {
  margin-bottom: 0;
  border-top: 1px solid #EAF1FA;
  padding-top: 14px;
}

/* ---------- Sign-up CTA (phone pops out of the card) ---------- */
.hcSignupCta {
  background: #F4F8FD;
  padding: 110px 0 72px;
}
.hcSignupCta__card {
  background: #0A1428;
  border-radius: 20px;
  padding: 0 44px;
}
.hcSignupCta__mediaCol {
  align-self: stretch;
}
.hcSignupCta__figure {
  margin: -48px 0;
  text-align: center;
}
.hcSignupCta__img {
  width: 100%;
  max-width: 340px;
  height: auto;
  border-radius: 24px;
  border: 6px solid #10203E;
  box-shadow: 0 28px 60px rgba(4, 12, 28, 0.45);
  display: inline-block;
}
.hcSignupCta__content {
  padding: 56px 12px 56px 32px;
}
.hcSignupCta__title {
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  color: #FFFFFF;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  margin-bottom: 28px;
}
.hcSignupCta__stat {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 18px;
}
.hcSignupCta__num {
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1;
  color: #FFFFFF;
  min-width: 118px;
}
.hcSignupCta__statLabel {
  font-weight: 600;
  font-size: 0.92rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #A9BBD6;
}
.hcSignupCta__btn {
  margin-top: 14px;
}

/* ---------- Types slider (dark) ---------- */
.hcTypesSlider {
  position: relative;
}
.hcTypesSlider__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 4px 4px 20px;
  scrollbar-width: none;
}
.hcTypesSlider__track::-webkit-scrollbar {
  display: none;
}
.hcTypesSlider__track {
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
}
.hcTypesSlider__track.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}
.hcTypesSlider__track.is-dragging .hcTypeCard {
  pointer-events: none;
}
.hcTypesSlider__slide {
  flex: 0 0 calc((100% - 48px) / 3);
  scroll-snap-align: start;
}
.hcTypeCard {
  position: relative;
  background: #10203E;
  border: 1px solid #22355C;
  border-radius: 12px;
  padding: 28px 26px;
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.hcTypeCard:hover {
  transform: translateY(-6px);
  border-color: #4D94F5;
}
.hcTypeCard__num {
  position: absolute;
  top: 24px;
  right: 24px;
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-weight: 600;
  font-size: 0.85rem;
  color: #3D5385;
}
.hcTypeCard__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: #1D6FE0;
  color: #FFFFFF;
  margin-bottom: 18px;
}
.hcTypeCard__title {
  font-size: 1.08rem;
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 12px;
}
.hcTypeCard p {
  color: #A9BBD6;
  font-size: 0.93rem;
  margin-bottom: 0;
}
.hcTypesSlider__controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
}
.hcTypesSlider__counter {
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-weight: 600;
  font-size: 0.95rem;
  color: #A9BBD6;
}
.hcTypesSlider__nav {
  display: flex;
  gap: 10px;
}
.hcTypesSlider__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #2A3F6B;
  background: #10203E;
  color: #FFFFFF;
  cursor: pointer;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}
.hcTypesSlider__arrow:hover {
  background: #1D6FE0;
  border-color: #1D6FE0;
}
.hcTypesSlider__arrow[disabled] {
  opacity: 0.4;
  cursor: default;
}
.hcTypesSlider__arrow[disabled]:hover {
  background: #10203E;
  border-color: #2A3F6B;
}

/* ---------- Advanced technology cards (light) ---------- */
.hcTechCard {
  background: #FFFFFF;
  border: 1px solid #E1EAF7;
  border-radius: 10px;
  padding: 28px 26px;
  margin-bottom: 30px;
  width: 100%;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hcTechCard:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 36px rgba(10, 20, 40, 0.10);
}
.hcTechCard__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: #E9F2FE;
  color: #1D6FE0;
  margin-bottom: 16px;
}
.hcTechCard__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0A1428;
  margin-bottom: 12px;
}
.hcTechCard p {
  color: #4A5B78;
  font-size: 0.94rem;
  margin-bottom: 0;
}

/* ---------- Ecosystem panels ---------- */
.hcPanel {
  background: #FFFFFF;
  border: 1px solid #E1EAF7;
  border-radius: 12px;
  padding: 34px 30px;
  margin-bottom: 30px;
  width: 100%;
}
.hcPanel--accent {
  background: #0A1428;
  border-color: #0A1428;
}
.hcPanel__name {
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0A1428;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 2px solid #1D6FE0;
}
.hcPanel--accent .hcPanel__name {
  color: #FFFFFF;
  border-bottom-color: #4D94F5;
}
.hcPanel__list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}
.hcPanel__list li {
  position: relative;
  padding: 10px 0 10px 30px;
  color: #4A5B78;
  border-bottom: 1px solid #EFF4FB;
}
.hcPanel__list li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.hcPanel__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 16px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #E9F2FE url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D6FE0' stroke-width='3'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center / 10px no-repeat;
}
.hcPanel--accent .hcPanel__list li {
  color: #C4D3EA;
  border-bottom-color: #1C2E52;
}

/* ---------- Compliance ---------- */
.hcCompliance__header {
  margin-bottom: 40px;
}
.hcCompliance__list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}
.hcCompliance__list li {
  position: relative;
  background: #10203E;
  border: 1px solid #22355C;
  border-left: 3px solid #4D94F5;
  border-radius: 8px;
  padding: 16px 20px 16px 48px;
  margin-bottom: 12px;
  color: #DCE6F6;
}
.hcCompliance__list li:last-child {
  margin-bottom: 0;
}
.hcCompliance__list li::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 20px;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234D94F5' stroke-width='2.4'%3E%3Cpath d='M12 2l8 4v5c0 5-3.5 9.5-8 11-4.5-1.5-8-6-8-11V6l8-4z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Process timeline ---------- */
.hcProcess__timeline {
  list-style: none;
  padding-left: 0;
  margin: 0;
  position: relative;
}
.hcProcess__step {
  position: relative;
  padding-left: 56px;
  padding-bottom: 40px;
}
.hcProcess__step::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 8px;
  bottom: -8px;
  width: 2px;
  background: #D6E4F8;
}
.hcProcess__step:last-child {
  padding-bottom: 0;
}
.hcProcess__step:last-child::before {
  display: none;
}
.hcProcess__step::after {
  content: "";
  position: absolute;
  left: 8px;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #1D6FE0;
  box-shadow: 0 0 0 5px #E9F2FE;
}
.hcProcess__card {
  background: #FFFFFF;
  border: 1px solid #E1EAF7;
  border-radius: 10px;
  padding: 30px 28px;
  box-shadow: 0 8px 24px rgba(10, 20, 40, 0.05);
}
.hcProcess__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0A1428;
  margin-bottom: 14px;
}
.hcProcess__card p {
  color: #4A5B78;
}
.hcProcess__label {
  font-weight: 600;
  color: #0A1428 !important;
  margin-bottom: 8px;
}
.hcProcess__list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  display: flex;
  flex-wrap: wrap;
}
.hcProcess__list li {
  position: relative;
  flex: 0 0 50%;
  max-width: 50%;
  padding: 4px 12px 4px 24px;
  color: #4A5B78;
  font-size: 0.94rem;
}
.hcProcess__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  width: 10px;
  height: 10px;
  border: 2px solid #1D6FE0;
  border-radius: 50%;
}

/* ---------- Technology stack (dark, with logo image slots) ---------- */
.hcStackGroup {
  background: #10203E;
  border: 1px solid #22355C;
  border-radius: 10px;
  padding: 26px 24px;
  margin-bottom: 30px;
  width: 100%;
}
.hcStackGroup__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #22355C;
}
.hcStackGroup__tags {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  display: flex;
  flex-wrap: wrap;
}
.hcStackGroup__tags li {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #0A1428;
  border: 1px solid #2A3F6B;
  color: #A9BBD6;
  border-radius: 100px;
  font-size: 0.84rem;
  padding: 5px 14px 5px 8px;
  margin: 0 8px 8px 0;
  transition: color 0.25s ease, border-color 0.25s ease;
}
.hcStackGroup__tags li:hover {
  color: #FFFFFF;
  border-color: #4D94F5;
}
.hcStackGroup__logo {
  width: 20px;
  height: 20px;
  object-fit: contain;
  border-radius: 4px;
  flex: 0 0 auto;
}

/* ---------- Benefits CTA ---------- */
.hcBenefits {
  background: #F4F8FD;
}
.hcBenefits .hcSection__title {
  margin-bottom: 30px;
}
.hcBenefits__cta {
  min-width: 240px;
}

/* ---------- Challenges ---------- */
.hcChallengeCard {
  background: #10203E;
  border: 1px solid #22355C;
  border-radius: 10px;
  padding: 30px 28px;
  margin-bottom: 30px;
  width: 100%;
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.hcChallengeCard:hover {
  transform: translateY(-5px);
  border-color: #4D94F5;
}
.hcChallengeCard__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: rgba(77, 148, 245, 0.14);
  color: #7FB3F7;
  margin-bottom: 16px;
}
.hcChallengeCard__title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 14px;
}
.hcChallengeCard p {
  color: #A9BBD6;
  font-size: 0.95rem;
}
.hcChallengeCard p:last-child {
  margin-bottom: 0;
}
.hcChallengeCard__label {
  font-weight: 600;
  color: #7FB3F7 !important;
  margin-bottom: 6px;
}
.hcDemoBox {
  background: #10203E;
  border: 1px solid #4D94F5;
  border-radius: 12px;
  padding: 40px 36px;
  margin-top: 20px;
  text-align: center;
}
.hcDemoBox__title {
  font-size: 1.35rem;
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 18px;
}
.hcDemoBox p {
  color: #C4D3EA;
}
.hcDemoBox p:last-child {
  margin-bottom: 0;
}

/* ---------- UAE locations ---------- */
.hcLocationCard {
  background: #FFFFFF;
  border: 1px solid #E1EAF7;
  border-radius: 10px;
  padding: 28px 26px;
  margin-bottom: 30px;
  width: 100%;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hcLocationCard:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px rgba(10, 20, 40, 0.10);
}
.hcLocationCard__title {
  position: relative;
  font-size: 1.1rem;
  font-weight: 700;
  color: #0A1428;
  margin-bottom: 12px;
  padding-left: 28px;
}
.hcLocationCard__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D6FE0' stroke-width='2.2'%3E%3Cpath d='M12 21s7-5.5 7-11a7 7 0 10-14 0c0 5.5 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.hcLocationCard p {
  color: #4A5B78;
  font-size: 0.95rem;
  margin-bottom: 0;
}

/* ---------- Invest CTA (doctor pops out of the card) ---------- */
.hcInvestCta {
  background: #FFFFFF;
  padding: 130px 0 72px;
}
.hcInvestCta__card {
  background: #0A1428;
  border-radius: 20px;
  padding: 0 44px;
}
.hcInvestCta__mediaCol {
  align-self: flex-end;
}
.hcInvestCta__figure {
  margin: -80px 0 0;
  text-align: center;
}
.hcInvestCta__img {
  width: 100%;
  max-width: 380px;
  height: auto;
  display: inline-block;
  border-radius: 16px 16px 0 0;
  filter: drop-shadow(0 18px 40px rgba(4, 12, 28, 0.35));
}
.hcInvestCta__content {
  padding: 56px 12px 56px 32px;
}
.hcInvestCta__title {
  font-family: "Sora", "Segoe UI", Arial, sans-serif;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.45;
  color: #FFFFFF;
  margin-bottom: 30px;
}
.hcInvestCta__highlight {
  color: #4D94F5;
}
.hcInvestCta__btn {
  min-width: 220px;
  text-align: center;
}

/* ---------- FAQ (native details/summary — works without JS) ---------- */
.hcFaq__item {
  background: #FFFFFF;
  border: 1px solid #E1EAF7;
  border-radius: 10px;
  margin-bottom: 14px;
  overflow: hidden;
}
.hcFaq__item[open] {
  border-color: #1D6FE0;
}
.hcFaq__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  list-style: none;
  cursor: pointer;
  padding: 20px 24px;
  transition: color 0.25s ease;
}
.hcFaq__summary::-webkit-details-marker {
  display: none;
}
.hcFaq__summary::marker {
  content: "";
}
.hcFaq__question {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: #0A1428;
  transition: color 0.25s ease;
}
.hcFaq__summary:hover .hcFaq__question,
.hcFaq__item[open] .hcFaq__question {
  color: #1D6FE0;
}
.hcFaq__icon {
  flex: 0 0 auto;
  position: relative;
  width: 14px;
  height: 14px;
  color: #0A1428;
}
.hcFaq__item[open] .hcFaq__icon {
  color: #1D6FE0;
}
.hcFaq__icon::before,
.hcFaq__icon::after {
  content: "";
  position: absolute;
  background: currentColor;
  transition: transform 0.3s ease;
}
.hcFaq__icon::before {
  left: 0;
  top: 6px;
  width: 14px;
  height: 2px;
}
.hcFaq__icon::after {
  left: 6px;
  top: 0;
  width: 2px;
  height: 14px;
}
.hcFaq__item[open] .hcFaq__icon::after {
  transform: scaleY(0);
}
.hcFaq__answer {
  padding: 0 24px 22px;
  border-top: 1px solid #EFF4FB;
}
.hcFaq__answer p {
  color: #4A5B78;
  margin: 16px 0 0;
}

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) {
  .hcTypesSlider__slide {
    flex: 0 0 calc((100% - 24px) / 2);
  }
}

@media (max-width: 991.98px) {
  .hcSection {
    padding: 68px 0;
  }
  .hcHero {
    min-height: 0;
    padding: 110px 0 90px;
  }
  .hcHero__title {
    font-size: 2.3rem;
  }
  .hcSection__title {
    font-size: 1.75rem;
  }
  /* Services tabs become a horizontal scrollable strip */
  .hcServices__tabs {
    flex-direction: row;
    overflow-x: auto;
    margin-bottom: 24px;
    padding: 10px;
    gap: 10px;
    scrollbar-width: none;
  }
  .hcServices__tabs::-webkit-scrollbar {
    display: none;
  }
  #hcServTab1:checked ~ .hcServices__layout label[for="hcServTab1"],
  #hcServTab2:checked ~ .hcServices__layout label[for="hcServTab2"],
  #hcServTab3:checked ~ .hcServices__layout label[for="hcServTab3"],
  #hcServTab4:checked ~ .hcServices__layout label[for="hcServTab4"],
  #hcServTab5:checked ~ .hcServices__layout label[for="hcServTab5"],
  #hcServTab6:checked ~ .hcServices__layout label[for="hcServTab6"],
  #hcServTab7:checked ~ .hcServices__layout label[for="hcServTab7"],
  #hcServTab8:checked ~ .hcServices__layout label[for="hcServTab8"],
  #hcServTab9:checked ~ .hcServices__layout label[for="hcServTab9"] {
    border-left-color: transparent;
    border-bottom-color: #1D6FE0;
  }
  .hcServices__tab {
    flex: 0 0 auto;
    width: auto;
    border-left: 0;
    border-bottom: 3px solid transparent;
    padding: 10px 14px;
    white-space: nowrap;
  }
  .hcServices__img {
    height: 240px;
  }
  /* CTA cards: stack, media pops from the top */
  .hcSignupCta {
    padding: 120px 0 68px;
  }
  .hcSignupCta__card,
  .hcInvestCta__card {
    padding: 0 24px;
  }
  .hcSignupCta__figure {
    margin: -60px 0 0;
  }
  .hcSignupCta__img {
    max-width: 260px;
  }
  .hcSignupCta__content,
  .hcInvestCta__content {
    padding: 32px 8px 44px;
    text-align: center;
  }
  .hcSignupCta__stat {
    justify-content: center;
    text-align: left;
  }
  .hcInvestCta {
    padding: 140px 0 68px;
  }
  .hcInvestCta__mediaCol {
    align-self: auto;
  }
  .hcInvestCta__figure {
    margin: -70px 0 0;
  }
  .hcInvestCta__img {
    max-width: 300px;
  }
  .hcCompliance__header {
    text-align: center;
  }
}

@media (max-width: 767.98px) {
  .hcTypesSlider__slide {
    flex: 0 0 88%;
  }
}

@media (max-width: 575.98px) {
  .hcSection {
    padding: 56px 0;
  }
  .hcHero__title {
    font-size: 1.85rem;
  }
  .hcHero__text {
    font-size: 1.02rem;
  }
  .hcSection__title {
    font-size: 1.5rem;
  }
  .hcBtn {
    padding: 14px 30px;
    width: 100%;
    max-width: 340px;
  }
  .hcServices__panel {
    padding: 22px 18px;
  }
  .hcServices__img {
    height: 190px;
  }
  .hcSignupCta__title {
    font-size: 1.3rem;
  }
  .hcSignupCta__num {
    font-size: 2rem;
    min-width: 88px;
  }
  .hcInvestCta__title {
    font-size: 1.25rem;
  }
  .hcProcess__step {
    padding-left: 42px;
  }
  .hcProcess__step::before {
    left: 10px;
  }
  .hcProcess__step::after {
    left: 3px;
  }
  .hcProcess__list li {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .hcFaq__summary {
    padding: 18px;
  }
  .hcFaq__question {
    font-size: 0.94rem;
  }
  .hcFaq__answer {
    padding: 0 18px 20px;
  }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .hcPage--js .hcReveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .hcBtn,
  .hcServices__tab,
  .hcServices__img,
  .hcTypeCard,
  .hcTechCard,
  .hcChallengeCard,
  .hcLocationCard,
  .hcFaq__icon::before,
  .hcFaq__icon::after {
    transition: none;
  }
  .hcPage--js .hcServices__panel.is-active {
    animation: none;
  }
  .hcTypesSlider__track {
    scroll-behavior: auto;
  }
}
.row{
  justify-content: center;
}

.hc_benefits_sec{
	--hc-navy:#0B1F3A;
	--hc-blue:#1657D8;
	--hc-blue-light:#2E86FF;
	--hc-sky:#EAF3FF;
	--hc-slate:#5B6B7F;
	background:#FFFFFF;
	padding:30px 0;
	overflow:hidden;
	font-family:'Inter',sans-serif;
}
.hc_benefits_sec .container{max-width:1220px;margin:0 auto;padding:0 20px;}
.hc_benefits_grid{
	display:grid;
	grid-template-columns:1.15fr 0.85fr;
	gap:60px;
	align-items:center;
}

/* eyebrow */
.hc_eyebrow{
	display:inline-flex;align-items:center;gap:10px;
	background:var(--hc-sky);
	border:1px solid #D3E6FF;
	color:var(--hc-blue);
	padding:8px 16px;border-radius:30px;
	font-size:13px;font-weight:600;letter-spacing:.2px;
	margin-bottom:20px;
	opacity:0;animation:hcFadeUp .6s ease forwards;
}
.hc_eyebrow img{display:block;}

.hc_heading{
	font-family:'Sora',sans-serif;
	font-weight:700;
	font-size:clamp(28px,3.4vw,40px);
	line-height:1.25;
	color:var(--hc-navy);
	margin:0 0 34px;
	opacity:0;animation:hcFadeUp .6s ease .1s forwards;
}
.hc_heading span{color:var(--hc-blue);}

/* tiles */
.hc_tiles{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:14px;
	margin-bottom:36px;
}
.hc_tile{
	background:#FFFFFF;
	border:1px solid #E7ECF3;
	border-radius:14px;
	padding:18px 14px;
	display:flex;flex-direction:column;align-items:flex-start;gap:10px;
	transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
	opacity:0;transform:translateY(16px);
}
.hc_tile.hc_inview{
	animation:hcTileIn .55s ease forwards;
	animation-delay:var(--d,0s);
}
.hc_tile:hover{
	transform:translateY(-5px);
	border-color:var(--hc-blue-light);
	box-shadow:0 12px 24px rgba(11,31,58,.08);
}
.hc_tile_icon{
	width:44px;height:44px;
	border-radius:10px;
	display:flex;align-items:center;justify-content:center;
	transition:background .3s ease;
}

.hc_tile_icon img{width:50px;height:auto;}
.hc_tile p{margin:0;font-size:13.5px;font-weight:600;color:var(--hc-navy);line-height:1.4;}

/* CTA */
.hc_cta{
	background:var(--hc-navy);
	color:#fff;
	border:none;
	padding:14px 28px;
	border-radius:8px;
	font-size:15px;font-weight:600;
	cursor:pointer;
	display:inline-flex;align-items:center;gap:10px;
	transition:background .3s ease,transform .2s ease;
}
.hc_cta:hover{background:var(--hc-blue);transform:translateY(-2px);}
.hc_cta_arrow{transition:transform .3s ease;}
.hc_cta:hover .hc_cta_arrow{transform:translateX(4px);}

/* right column */
.hc_image_col{
	position:relative;
	display:flex;align-items:center;justify-content:center;
	min-height:420px;
}
.hc_ring{
	position:absolute;
	border-radius:50%;
	border:1px solid #CFE1FF;
}
.hc_ring1{width:340px;height:340px;animation:hcPulse 3.5s ease-in-out infinite;}
.hc_ring2{width:420px;height:420px;animation:hcPulse 3.5s ease-in-out infinite .6s;}

.hc_image_wrap{
	position:relative;
	width:300px;
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 24px 48px rgba(11,31,58,.16);
	background:var(--hc-navy);
}
.hc_image_wrap img{display:block;width:100%;height:auto;}

.hc_float_card{
	position:absolute;
	background:#fff;
	border:1px solid #E7ECF3;
	border-radius:12px;
	padding:10px 14px;
	display:flex;align-items:center;gap:10px;
	box-shadow:0 10px 24px rgba(11,31,58,.12);
	animation:hcFloat 3.2s ease-in-out infinite;
}
.hc_float_card1{top:12%;left:-6%;animation-delay:0s;}
.hc_float_card2{bottom:10%;right:-8%;animation-delay:.5s;}
.hc_dot{width:8px;height:8px;border-radius:50%;background:var(--hc-blue-light);flex:none;}
.hc_float_card strong{display:block;font-family:'Sora',sans-serif;font-size:14px;color:var(--hc-navy);}
.hc_float_card small{display:block;font-size:11px;color:var(--hc-slate);}

/* keyframes */
@keyframes hcFadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
@keyframes hcTileIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
@keyframes hcPulse{0%{transform:scale(.9);opacity:.6;}70%{transform:scale(1.05);opacity:0;}100%{transform:scale(.9);opacity:0;}}
@keyframes hcFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}

/* responsive */
@media(max-width:991px){
	.hc_benefits_grid{grid-template-columns:1fr;gap:50px;}
	.hc_image_col{order:-1;min-height:340px;}
	.hc_float_card1{left:0;}
	.hc_float_card2{right:0;}
}
@media(max-width:575px){
	.hc_tiles{grid-template-columns:repeat(2,1fr);}
	.hc_image_wrap{width:240px;}
	.hc_ring1{width:260px;height:260px;}
	.hc_ring2{width:320px;height:320px;}
}