*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family: "Zen Maru Gothic", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

body{
  min-height:100vh;
  background:#f3f6ff;
}

/* HEADER */
.main-header{
  position: sticky;
  top: 0;
  z-index: 999;
  width: 100%;
  background: linear-gradient(90deg, #0a3dff, #00b7ff);
  box-shadow: 0 10px 30px rgba(0,0,0,0.12);
}

.nav-container{
  max-width: 1200px;
  margin: auto;
  padding: 14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
}

.logo{
  display:flex;
  align-items:center;
  text-decoration:none;
  /* padding: 6px; */
  border-radius: 14px;
  transition: 0.35s ease;
}

.logo-img{
  width: 85px;
  height: 85px;
  object-fit: contain;
  border-radius: 14px;
  transition: 0.35s ease;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,0.22));
}

/* Hover effect */
.logo:hover .logo-img{
  transform: scale(1.08) rotate(-2deg);
  filter: drop-shadow(0 12px 24px rgba(0,0,0,0.28)) 
          drop-shadow(0 0 16px rgba(255,255,255,0.35));
}

/* Click effect */
.logo:active .logo-img{
  transform: scale(0.98);
}


/* NAV */
.nav{
  position: relative;
  display:flex;
  align-items:center;
  gap: 6px;
  padding: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  backdrop-filter: blur(10px);
  overflow: hidden;
}

/* Moving Highlight */
.nav-highlight{
  position:absolute;
  top: 6px;
  left: 6px;
  height: calc(100% - 12px);
  width: 80px;
  border-radius: 999px;
  background: rgba(255,255,255,0.22);
  border: 1px solid rgba(255,255,255,0.25);
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
  transition: all 0.35s ease;
  transform: translateX(0px);
  pointer-events: none;
}

/* LINKS */
.nav-link{
  position: relative;
  z-index: 2;
  text-decoration:none;
  color: rgba(255,255,255,0.92);
  font-weight: 600;
  font-size: 15px;
  padding: 10px 16px;
  border-radius: 999px;
  transition: 0.25s ease;
  user-select: none;
  white-space: nowrap;
}

.nav-link:hover{
  color: #fff;
}

.nav-link.active{
  color: #ffffff;
}

/* TOGGLE */
.nav-toggle{
  display:none;
  width: 44px;
  height: 40px;
  border: none;
  background: rgba(255,255,255,0.15);
  border-radius: 12px;
  cursor:pointer;
  padding: 8px;
  backdrop-filter: blur(10px);
}

.nav-toggle span{
  display:block;
  height: 2px;
  width: 100%;
  background:#fff;
  margin: 6px 0;
  border-radius: 999px;
  transition: 0.25s ease;
}

/* Mobile */
@media (max-width: 900px){
  .nav-toggle{ display:block; }

  .nav{
    position: fixed;
    top: 70px;
    right: 18px;
    left: 18px;
    display:flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 12px;
    border-radius: 18px;
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: 0.3s ease;
    background: linear-gradient(90deg, #0a3dff, #00b7ff);
  }

  .nav.open{
    transform: translateY(0px);
    opacity: 1;
    pointer-events: auto;
  }

  .nav-link{
    padding: 14px 14px;
    text-align: left;
    border-radius: 14px;
  }

  /* mobile me highlight ko hide kar dena (clean look) */
  .nav-highlight{
    display:none;
  }
}


/* ///////////////////////////////////////////// home page hero section ///////////////////////////////////////// */
   .mh-hero{
      position:relative;
      padding: clamp(18px, 3.5vw, 44px) 18px;
      min-height: 92vh;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
      isolation:isolate;
    }
    .mh-hero::before{
      content:"";
      position:absolute; inset:-20%;
      background:
        radial-gradient(900px 520px at 22% 35%, rgba(0,183,255,0.22), transparent 62%),
        radial-gradient(860px 540px at 78% 55%, rgba(10,61,255,0.18), transparent 64%),
        radial-gradient(600px 420px at 50% 92%, rgba(255,180,0,0.10), transparent 60%),
        linear-gradient(135deg, #f6fbff, #ffffff 40%, #f4f7ff);
      z-index:-2;
    }
    .mh-hero::after{
      content:"";
      position:absolute; inset:0;
      background:
        radial-gradient(900px 520px at 50% 40%, rgba(255,255,255,0.85), transparent 70%);
      z-index:-1;
      pointer-events:none;
    }

    .mh-shell{
      width:min(1200px, 100%);
      display:grid;
      grid-template-columns: 1.05fr 0.95fr;
      gap: clamp(18px, 3vw, 40px);
      align-items:center;
    }

    /* LEFT: clean text (no card) */
    .mh-left{
      padding: 6px 0;
    }

    .mh-kicker{
      display:inline-flex;
      align-items:center;
      gap:10px;
      font-weight:800;
      font-size: 13px;
      color:#0a3dff;
      letter-spacing:0.2px;
      margin-bottom: 10px;
    }
    .mh-kicker i{
      width:10px;height:10px;border-radius:99px;
      background: linear-gradient(90deg,#00b7ff,#0a3dff);
      display:inline-block;
      box-shadow: 0 10px 18px rgba(10,61,255,0.18);
    }

    .mh-title{
      font-size: clamp(30px, 3.4vw, 52px);
      line-height: 1.06;
      letter-spacing: -0.9px;
      margin-bottom: 12px;
      color:#07112a;
    }
    .mh-title span{
      background: linear-gradient(90deg, #0a3dff, #00b7ff);
      -webkit-background-clip:text;
      background-clip:text;
      color: transparent;
    }

    .mh-desc{
      font-size: clamp(14px, 1.25vw, 17px);
      line-height: 1.75;
      color: rgba(7,17,42,0.74);
      max-width: 60ch;
      margin-bottom: 18px;
    }

    .mh-specs{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-bottom: 18px;
    }
    .mh-chip{
      padding: 10px 12px;
      border-radius: 999px;
      background: rgba(10,61,255,0.06);
      border: 1px solid rgba(10,61,255,0.10);
      font-weight: 750;
      font-size: 13px;
      color:#0b1a3a;
      display:flex;
      align-items:center;
      gap:8px;
    }
    .mh-chip small{opacity:0.65;font-weight:800}

    .mh-actions{
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-top: 4px;
    }
    .mh-btn{
      border:none;
      cursor:pointer;
      padding: 12px 16px;
      border-radius: 14px;
      font-weight: 850;
      letter-spacing: 0.2px;
      transition: 0.22s ease;
      display:inline-flex;
      align-items:center;
      gap:10px;
      user-select:none;
    }
    .mh-btn-primary{
      background: linear-gradient(90deg, #0a3dff, #00b7ff);
      color:#fff;
      box-shadow: 0 18px 30px rgba(10,61,255,0.18);
    }
    .mh-btn-primary:hover{transform: translateY(-2px)}
    .mh-btn-ghost{
      background: transparent;
      color:#0a3dff;
      border: 1px solid rgba(10,61,255,0.18);
    }
    .mh-btn-ghost:hover{transform: translateY(-2px); background: rgba(10,61,255,0.05)}

    /* Text swap animation (clean) */
    .mh-text-swap{ animation: mhTextIn 360ms ease both; }
    @keyframes mhTextIn{
      from{opacity:0; transform: translateY(10px)}
      to{opacity:1; transform: translateY(0)}
    }

    /* RIGHT: image stage (no card) */
    .mh-right{
      position:relative;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:14px;
    }

    .mh-stage{
      position:relative;
      width: 100%;
      height: clamp(320px, 46vh, 460px);
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
    }

    /* soft “product spotlight” */
    .mh-spot{
      position:absolute;
      width:min(520px, 85%);
      height: min(420px, 80%);
      border-radius: 999px;
      background:
        radial-gradient(circle at 50% 45%, rgba(0,183,255,0.22), transparent 60%),
        radial-gradient(circle at 45% 60%, rgba(10,61,255,0.14), transparent 62%);
      filter: blur(10px);
      opacity: 0.85;
      pointer-events:none;
    }

    /* base shadow to sell 3D */
    .mh-shadow{
      position:absolute;
      bottom: 34px;
      left:50%;
      transform: translateX(-50%);
      width: min(340px, 70%);
      height: 34px;
      background: radial-gradient(circle, rgba(0,0,0,0.22), transparent 70%);
      filter: blur(8px);
      opacity: 0.55;
      pointer-events:none;
    }

    /* Image slider layers */
    .mh-layer{
      position:absolute;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      padding: 16px;
      pointer-events:none;
    }
    .mh-img{
      width: min(440px, 90%);
      max-height: 95%;
      height:auto;
      object-fit:contain;
      filter: drop-shadow(0 28px 38px rgba(0,0,0,0.18));
      transform: translateY(-4px);
    }

    /* Slide animations */
    .slide-in-right{ animation: slideInRight 520ms cubic-bezier(.2,.9,.2,1) both; }
    .slide-out-left{ animation: slideOutLeft 420ms cubic-bezier(.2,.9,.2,1) both; }
    .slide-in-left{ animation: slideInLeft 520ms cubic-bezier(.2,.9,.2,1) both; }
    .slide-out-right{ animation: slideOutRight 420ms cubic-bezier(.2,.9,.2,1) both; }

    @keyframes slideInRight{
      from{opacity:0; transform: translateX(70px) scale(0.98);}
      to{opacity:1; transform: translateX(0) scale(1);}
    }
    @keyframes slideOutLeft{
      from{opacity:1; transform: translateX(0) scale(1);}
      to{opacity:0; transform: translateX(-70px) scale(0.98);}
    }
    @keyframes slideInLeft{
      from{opacity:0; transform: translateX(-70px) scale(0.98);}
      to{opacity:1; transform: translateX(0) scale(1);}
    }
    @keyframes slideOutRight{
      from{opacity:1; transform: translateX(0) scale(1);}
      to{opacity:0; transform: translateX(70px) scale(0.98);}
    }

    /* Bottom selector (no cards, clean pills) */
    .mh-selector{
      width:100%;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      justify-content:center;
    }
    .mh-pill{
      border:none;
      cursor:pointer;
      padding: 10px 14px;
      border-radius: 999px;
      background: rgba(7,17,42,0.04);
      border: 1px solid rgba(7,17,42,0.08);
      color:#07112a;
      font-weight: 850;
      transition: 0.22s ease;
      display:flex;
      align-items:center;
      gap:10px;
      user-select:none;
    }
    .mh-pill:hover{transform: translateY(-2px); background: rgba(10,61,255,0.06); border-color: rgba(10,61,255,0.14)}
    .mh-pill.active{
      background: linear-gradient(90deg, rgba(10,61,255,0.12), rgba(0,183,255,0.10));
      border-color: rgba(10,61,255,0.20);
      box-shadow: 0 16px 28px rgba(10,61,255,0.10);
    }
    .mh-dot{
      width:10px;height:10px;border-radius:99px;
      background: rgba(10,61,255,0.35);
      box-shadow: 0 10px 16px rgba(10,61,255,0.12);
    }
    .mh-pill.active .mh-dot{
      background: linear-gradient(90deg, #0a3dff, #00b7ff);
    }
    .mh-pill span{
      font-size: 12px;
      opacity:0.7;
      font-weight: 800;
      margin-left: 4px;
    }

    /* Responsive */
    @media (max-width: 980px){
      .mh-shell{grid-template-columns: 1fr;}
      .mh-right{order:-1;}
      .mh-left{ text-align:center; }
      .mh-desc{margin-left:auto;margin-right:auto;}
      .mh-specs{justify-content:center;}
      .mh-actions{justify-content:center;}
    }
    @media (max-width: 520px){
      .mh-btn{width:100%; justify-content:center}
      .mh-pill{width:100%; justify-content:center}
    }

/* ///////////////////////////////////////// section 2 /////////////////////////////////////////////// */
.slant-strip{
  width: 100%;
  overflow: hidden;
  margin: 0;
}

/* ✅ fixed height strip */
.slant-strip__inner{
  height: 120px; /* change height here */
  background: linear-gradient(90deg, #0a3dff, #00b7ff);
  display: flex;
  align-items: center;
  overflow: hidden;

  /* ✅ slant: left kam, right zyada */
  clip-path: polygon(
    0% 10%,   /* left top (little cut) */
    100% 0%,  /* right top (more up) */
    100% 90%, /* right bottom (more down) */
    0% 100%   /* left bottom (little down) */
  );
}

/* marquee track */
.slant-strip__track{
  display: flex;
  width: max-content;
  align-items: center;
  gap: 70px;
  padding: 0 28px;
  animation: slantMarquee 18s linear infinite;
}

/* group */
.slant-strip__group{
  display: flex;
  align-items: center;
  gap: 110px;
}

/* item */
.slant-strip__item{
  min-width: 240px;
  text-align: center;
  color: #fff;
  line-height: 1.1;
}

.slant-strip__item h3{
  font-size: 44px;
  font-weight: 900;
  margin: 0 0 8px 0;
}

.slant-strip__item p{
  font-size: 14px;
  font-weight: 700;
  margin: 0;
  opacity: 0.95;
}

/* animation */
@keyframes slantMarquee{
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* mobile */
@media (max-width: 600px){
  .slant-strip__inner{ height: 95px; }
  .slant-strip__item{ min-width: 180px; }
  .slant-strip__item h3{ font-size: 30px; }
  .slant-strip__group{ gap: 60px; }
}


/* ///////////////////////////// section 3 //////////////////////////////////////////////// */
/* ====== Exceptional Features (Unique Tab Panels) ====== */
.featX{
  padding: 70px 18px;
  background:
    radial-gradient(700px 360px at 20% 10%, rgba(0,183,255,.12), transparent 60%),
    radial-gradient(700px 360px at 80% 20%, rgba(10,61,255,.10), transparent 60%),
    linear-gradient(180deg, #ffffff, #f7fbff);
}

.featX__wrap{
  max-width: 1200px;
  margin: 0 auto;
}

.featX__head{
  text-align: center;
  margin-bottom: 36px;
}

.featX__pill{
  display: inline-block;
  padding: 10px 18px;
  border-radius: 999px;
  background: #12a354;
  color: #fff;
  font-weight: 800;
  letter-spacing: .2px;
  font-size: 13px;
  box-shadow: 0 14px 24px rgba(18,163,84,.18);
  margin-bottom: 14px;
}

.featX__title{
  font-size: clamp(28px, 3.2vw, 46px);
  font-weight: 900;
  color: #07112a;
  margin: 0 0 10px;
}

.featX__sub{
  max-width: 72ch;
  margin: 0 auto;
  color: rgba(7,17,42,.68);
  line-height: 1.7;
  font-weight: 600;
}

/* grid */
.featX__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  align-items: stretch;
}

/* panel: NOT a heavy card, more like clean outlined slab */
.featX__panel{
  position: relative;
  padding-top: 34px; /* tab space */
  border-radius: 18px;
  background: transparent;
}

/* outline slab */
.featX__panel::before{
  content:"";
  position:absolute;
  inset: 18px 0 0 0;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid rgba(10,61,255,.12);
  box-shadow: 0 18px 40px rgba(7,17,42,.08);
}

/* top tab like screenshot-2 */
.featX__tab{
  position: absolute;
  left: 18px;
  right: 18px;
  top: 0;
  height: 56px;
  border-radius: 16px;
  background: linear-gradient(135deg, #0a3dff, #00b7ff);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  box-shadow: 0 18px 28px rgba(10,61,255,.18);
  z-index: 2;
}

/* little “hooks” at both ends (unique detail) */
.featX__tab::before,
.featX__tab::after{
  content:"";
  position:absolute;
  top: 12px;
  width: 14px;
  height: 14px;
  background: rgba(7,17,42,.18);
  border-radius: 4px;
  filter: blur(.2px);
  opacity: .25;
}
.featX__tab::before{ left: -8px; transform: rotate(12deg); }
.featX__tab::after{ right: -8px; transform: rotate(-12deg); }

.featX__tabIcon{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(255,255,255,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(255,255,255,.28);
  flex: 0 0 auto;
}

/* ✅ FontAwesome icon style */
.featX__tabIcon i{
  font-size: 18px;
  color: #ffffff;
  filter: drop-shadow(0 10px 16px rgba(0,0,0,.18));
}


.featX__tabTitle{
  margin: 0;
  color: #fff;
  font-weight: 900;
  letter-spacing: .2px;
  font-size: 18px;
}

/* body text */
.featX__body{
  position: relative;
  z-index: 1;
  padding: 22px 20px 18px;
  margin-top: 18px;
  border-radius: 18px;
}

.featX__body p{
  margin: 12px 0 14px;
  color: rgba(7,17,42,.72);
  line-height: 1.75;
  font-weight: 600;
}

/* meta chips */
.featX__meta{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}
.featX__meta span{
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(10,61,255,.06);
  border: 1px solid rgba(10,61,255,.10);
  color: #0b1a3a;
  font-weight: 800;
  font-size: 12px;
}

/* hover: clean lift + subtle shine */
.featX__panel:hover::before{
  box-shadow: 0 22px 55px rgba(7,17,42,.12);
  transform: translateY(-4px);
  transition: .25s ease;
}
.featX__panel::before{
  transition: .25s ease;
}

/* responsive */
@media (max-width: 980px){
  .featX__grid{ grid-template-columns: 1fr; }
  .featX__tabTitle{ font-size: 17px; }
}


/* /////////////////////////////////////////////// section 4 //////////////////////////////////////////////////// */
.adv-sec{
  padding: 80px 18px;
  background: linear-gradient(180deg, #ffffff, #f7fbff);
}

.adv-wrap{
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 38px;
  align-items: center;
}

/* LEFT GALLERY */
.adv-gallery{
  display: grid;
  grid-template-columns: 1fr 90px;
  gap: 16px;
  align-items: start;
}

.adv-big{
  border-radius: 26px;
  overflow: hidden;
  background: #eaf6ff;
  box-shadow: 0 18px 60px rgba(7,17,42,0.10);
  /* min-height: 460px; */
  height: 430px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.adv-big img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform .45s ease, opacity .25s ease;
}

.adv-big img.swap{
  opacity: 0;
  transform: scale(1.04);
}

/* thumbs */
.adv-thumbs{
  display:flex;
  flex-direction: column;
  gap: 12px;
}

.adv-thumb{
  border: none;
  background: transparent;
  padding: 0;
  border-radius: 16px;
  overflow: hidden;
  cursor: pointer;
  outline: none;
  box-shadow: 0 10px 30px rgba(7,17,42,0.10);
  border: 2px solid transparent;
  transition: transform .2s ease, border-color .2s ease;
}

.adv-thumb img{
  width: 100%;
  height: 74px;
  object-fit: cover;
  display:block;
}

.adv-thumb:hover{ transform: translateY(-2px); }
.adv-thumb.active{
  border-color: rgba(10,61,255,0.65);
}

/* RIGHT CONTENT */
.adv-title{
  font-size: clamp(28px, 3.2vw, 46px);
  font-weight: 900;
  color: #07112a;
  margin: 0 0 18px;
}

.adv-list{
  display:flex;
  flex-direction: column;
  gap: 16px;
}

.adv-item{
  display:flex;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(7,17,42,0.10);
}

.adv-item:last-child{ border-bottom:none; }

.adv-dot{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #12a354;
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  flex: 0 0 auto;
  box-shadow: 0 14px 24px rgba(18,163,84,0.18);
}

.adv-item h4{
  margin: 0 0 6px;
  color:#07112a;
  font-weight: 900;
  font-size: 16px;
}

.adv-item p{
  margin: 0;
  color: rgba(7,17,42,0.70);
  line-height: 1.65;
  font-weight: 600;
  font-size: 14px;
}

/* RESPONSIVE */
@media (max-width: 980px){
  .adv-wrap{ grid-template-columns: 1fr; }
  .adv-gallery{ grid-template-columns: 1fr; }
  .adv-thumbs{
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
  .adv-thumb img{ height: 70px; width: 90px; }
  .adv-big{ min-height: 360px; }
}


/* /////////////////////////////// home page section 5 ////////////////////////////////// */
/* SECTION WRAPPER */
.health-section {
  max-width: 1120px;
  margin: 60px auto 70px;
  padding: 0 20px;
  text-align: center;
}

/* TITLE + BUTTON */
.health-header h2 {
  font-size: 32px;
  letter-spacing: 2px;
  margin-bottom: 10px;
}

.health-header p {
  font-size: 15px;
  color: #555;
  margin-bottom: 20px;
}

.health-btn {
  display: inline-block;
  margin-bottom: 35px;
  padding: 12px 32px;
  background: linear-gradient(135deg, #0a3dff, #00b7ff);
  color: #fff;
  border-radius: 4px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

.health-btn:hover {
  background: linear-gradient(135deg, #02145e, #3dacd8);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

/* GALLERY LAYOUT */
.health-gallery {
  width: 100%;
}

/* BIG IMAGE AREA */

/* BIG IMAGE AREA */
.health-main {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.3);
  aspect-ratio: 16 / 9;     /* fixed ratio */
  max-height: 500px;        /* height kam kar di */
}

.health-main-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  transform: scale(1);
}

/* animation when image changes */
.health-main-img.health-animate {
  animation: healthFadeZoom 0.4s ease-out forwards;
}

@keyframes healthFadeZoom {
  0%   { opacity: 0; transform: scale(1.02); }
  100% { opacity: 1; transform: scale(1); }
}


/* THUMBNAIL ROW */
.health-thumbs {
  display: flex;
  gap: 6px;
  margin-top: 8px;
  overflow-x: auto;
  padding: 4px 0;
}

/* hide ugly scrollbar in some browsers */
.health-thumbs::-webkit-scrollbar {
  height: 6px;
}
.health-thumbs::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.25);
  border-radius: 4px;
}

/* SINGLE THUMB */
.health-thumb {
  height: 80px;
  min-width: 120px;
  object-fit: cover;
  border-radius: 2px;
  cursor: pointer;
  border: 2px solid transparent;
  transition: transform 0.25s ease, border-color 0.25s ease, opacity 0.25s ease;
  opacity: 0.75;
}

.health-thumb:hover {
  transform: translateY(-3px) scale(1.03);
  border-color: #1909f8;
  opacity: 1;
}

/* active selected thumb */
.health-thumb.active {
  border-color: #0919fa;
  opacity: 1;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .health-header h2 {
    font-size: 26px;
  }
  .health-main-img {
    max-height: 320px;
    object-fit: cover;
  }
  .health-thumb {
    height: 70px;
    min-width: 100px;
  }
}

@media (max-width: 480px) {
  .health-section {
    margin: 40px auto 50px;
  }
  .health-header p {
    font-size: 14px;
  }
  .health-thumb {
    height: 60px;
    min-width: 90px;
  }
}
/* Thumbnail se upar jaane wala clone */
/* Thumbnail se upar jaane wala clone */
.health-clone-img {
    position: fixed;
    z-index: 9999;
    object-fit: cover;
    border-radius: 4px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.4);
    pointer-events: none;

    /* smoother + GPU-friendly */
    transition:
      top 0.4s ease-out,
      left 0.4s ease-out,
      width 0.4s ease-out,
      height 0.4s ease-out,
      transform 0.4s ease-out,
      opacity 0.4s ease-out;
    will-change: top, left, width, height, transform;
}


/* ////////////////////////////////// whatsapp sticky button /////////////////////////// */
/* Sticky WhatsApp Icon */
.wa-float {
  position: fixed;
  bottom: 20px;
  right: 22px;
  z-index: 9999;
  cursor: pointer;
  display: inline-block;
  animation: waFloat 2.2s ease-in-out infinite;
}

.wa-float img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  filter: drop-shadow(0 0 6px rgba(0, 255, 0, 0.5));
  transition: transform 0.3s ease;
}

/* Hover effect */
.wa-float:hover img {
  transform: scale(1.18) rotate(3deg);
  filter: drop-shadow(0 0 12px rgba(0, 255, 0, 0.7));
}

/* Infinite Floating Animation */
@keyframes waFloat {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

/* Sticky Button */
.enq-btn{
  position: fixed;
  right: -40px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  background: linear-gradient(90deg, #0a3dff, #00b7ff);
  color: #fff;
  border: none;
  padding: 12px 26px;
  font-weight: 900;
  letter-spacing: 0.5px;
  border-radius: 12px 12px 0 0;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 18px 40px rgba(10,61,255,0.35);
}

/* Panel */
.enq-panel{
  position: fixed;
  top: 0;
  right: -420px;
  width: 380px;
  height: 100vh;
  background: #ffffff;
  box-shadow: -20px 0 60px rgba(0,0,0,0.18);
  transition: 0.45s ease;
  z-index: 1100;
  display: flex;
  flex-direction: column;
}

/* Open State */
.enq-panel.active{
  right: 0;
}

/* Header */
.enq-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.enq-header img{
  height: 80px;
  object-fit: contain;
}

.enq-close{
  background: none;
  border: none;
  font-size: 32px;
  cursor: pointer;
  color: #0a3dff;
}

/* Form */
.enq-form{
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.enq-form h3{
  margin-bottom: 8px;
  font-size: 22px;
  font-weight: 900;
  color: #07112a;
}

.enq-form input,
.enq-form select,
.enq-form textarea{
  width: 100%;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.14);
  font-weight: 600;
  outline: none;
}

.enq-form textarea{
  resize: none;
  height: 90px;
}

.enq-form input:focus,
.enq-form select:focus,
.enq-form textarea:focus{
  border-color: #0a3dff;
}

/* Submit */
.enq-form button{
  margin-top: 10px;
  padding: 14px;
  border-radius: 14px;
  border: none;
  background: linear-gradient(90deg, #0a3dff, #00b7ff);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 16px 30px rgba(10,61,255,0.28);
}

.enq-form button:hover{
  transform: translateY(-2px);
}

/* Mobile */
@media (max-width: 600px){
  .enq-panel{
    width: 100%;
  }
  .enq-btn{
    right: -25px;
  }
}


/* ///////////////////////////////////////////////////////// footer ///////////////////////////////////////////// */
.ft{
  color:#eaf2ff;
  background: linear-gradient(180deg, #071a33, #041126);
}

/* top area */
.ft__top{
  padding: 60px 18px 28px;
}

.ft__wrap{
  max-width: 1200px;
  margin: 0 auto;
  display:grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 26px;
}

/* brand */
.ft__logo{
  display:inline-flex;
  width: 74px;
  height: 74px;
  border-radius: 18px;
  overflow:hidden;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 18px 40px rgba(0,0,0,0.28);
  transition: .25s ease;
}
.ft__logo img{
  width:100%;
  height:100%;
  object-fit: contain;
  padding: 10px;
}
.ft__logo:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 60px rgba(0,0,0,0.35);
}

.ft__about{
  margin: 14px 0 16px;
  color: rgba(234,242,255,0.78);
  line-height: 1.7;
  font-weight: 600;
  max-width: 46ch;
}

.ft__contact{
  display:flex;
  flex-direction: column;
  gap: 10px;
}
.ft__contact a{
  display:flex;
  gap: 10px;
  align-items:center;
  color: rgba(234,242,255,0.88);
  text-decoration:none;
  font-weight: 650;
  transition: .2s ease;
}
.ft__contact a i{
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.12);
}
.ft__contact a:hover{ color:#fff; transform: translateX(2px); }

.ft__title{
  margin: 6px 0 14px;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .2px;
  color:#fff;
}

.ft__links{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction: column;
  gap: 10px;
}
.ft__links a{
  color: rgba(234,242,255,0.78);
  text-decoration:none;
  font-weight: 650;
  transition: .2s ease;
}
.ft__links a:hover{
  color:#ffffff;
  transform: translateX(2px);
}

/* newsletter */
.ft__muted{
  color: rgba(234,242,255,0.74);
  line-height: 1.6;
  font-weight: 600;
  margin: 0 0 14px;
}

.ft__form{
  display:flex;
  gap: 10px;
  align-items:center;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  padding: 10px;
  border-radius: 16px;
}

.ft__form input{
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  color: #fff;
  font-weight: 650;
  padding: 10px 10px;
  min-width: 0;
}
.ft__form input::placeholder{ color: rgba(234,242,255,0.65); }

.ft__form button{
  border: none;
  cursor: pointer;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 850;
  color: #fff;
  background: linear-gradient(90deg, #0a3dff, #00b7ff);
  box-shadow: 0 14px 26px rgba(10,61,255,0.22);
  transition: .2s ease;
}
.ft__form button:hover{ transform: translateY(-2px); }

/* social with tooltip */
.ft__social{
  margin-top: 16px;
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
}

.ft__icon{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color: #fff;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
  position: relative;
  transition: .2s ease;
}

.ft__icon i{ font-size: 18px; }

.ft__icon:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,0.16);
}

/* tooltip */
.ft__icon::after{
  content: attr(data-tip);
  position:absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  background: rgba(0,0,0,0.75);
  color:#fff;
  font-weight: 800;
  font-size: 12px;
  padding: 8px 10px;
  border-radius: 10px;
  opacity: 0;
  pointer-events: none;
  transition: .18s ease;
  white-space: nowrap;
}

.ft__icon::before{
  content:"";
  position:absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  border: 7px solid transparent;
  border-top-color: rgba(0,0,0,0.75);
  opacity: 0;
  transition: .18s ease;
}

.ft__icon:hover::after{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.ft__icon:hover::before{ opacity: 1; }

/* bottom bar */
.ft__bottom{
  border-top: 1px solid rgba(255,255,255,0.10);
  padding: 14px 18px;
}
.ft__bottomWrap{
  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 12px;
  font-weight: 650;
  color: rgba(234,242,255,0.78);
}
.ft__dev strong{ color:#fff; }

/* responsive */
@media (max-width: 980px){
  .ft__wrap{
    grid-template-columns: 1fr 1fr;
  }
  .ft__bottomWrap{
    flex-direction: column;
    text-align:center;
  }
}
@media (max-width: 560px){
  .ft__wrap{
    grid-template-columns: 1fr;
  }
  .ft__form{
    flex-direction: column;
    align-items: stretch;
  }
  .ft__form button{ width:100%; }
}


/* Footer center only on mobile */
@media (max-width: 425px) {
  .ft,
  .ft__col,
  .ft__brand,
  .ft__news,
  .ft__contact,
  .ft__links,
  .ft__bottomWrap {
    text-align: center;
  }

  .ft__contact a {
    justify-content: center;
  }

  .ft__social {
    justify-content: center;
  }

  .ft__form {
    margin-left: auto;
    margin-right: auto;
  }
}


/* ////////////////////////////////////////// translator ////////////////////////////////////////////// */
.site-translate{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 10px;
}

/* translate widget styling */
#google_translate_element{
  display:flex;
  align-items:center;
}

.goog-te-gadget{
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif !important;
  font-weight: 800 !important;
  color: transparent !important; /* Google ka extra text hide */
}

.goog-te-gadget span{ display:none !important; } /* "Select Language" text hide */
.goog-te-gadget a{ display:none !important; }    /* powered by link hide (optional) */

.goog-te-combo{
  padding: 8px 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  background: rgba(255,255,255,0.14) !important;
  color: #fff !important;
  outline: none !important;
  font-weight: 850 !important;
}

/* If your header bg is light, set combo text dark */