/* ═══════════════ TOKENS ═══════════════ */
    :root {
      --f:  #06200f;
      --fm: #0d3a1e;
      --fl: #1a5c34;
      --fg: #2b8a52;
      --sa: #4db87c;
      --sl: #82d4a8;
      --sp: #d6ede2;
      --mn: #edf7f1;
      --gd: #a8762a;
      --gl: #c99a40;
      --cr: #f8fdf9;
      --wh: #ffffff;

      --display: 'Playfair Display', Georgia, serif;
      --heading: 'Cinzel', serif;
      --body:    'Jost', sans-serif;

      --ease: cubic-bezier(0.22,0.68,0,1.18);
      --nav-h: 76px;
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; font-size: 16px; }

    body {
      font-family: var(--body);
      background: var(--wh);
      color: var(--f);
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }

    a { text-decoration: none; color: inherit; }
    button { cursor: pointer; font-family: var(--body); border: none; background: none; }
    input, select, textarea { font-family: var(--body); }
    img { display: block; max-width: 100%; }

    /* ═══════════════ PAGE ROUTING ═══════════════ */
    .pg { display: none; }
    .pg.active { display: block; animation: pfade .4s ease; }
    @keyframes pfade { from{opacity:0} to{opacity:1} }

    /* ═══════════════ SCROLL REVEAL ═══════════════ */
    .sr {
      opacity: 0;
      transform: translateY(36px);
      transition: opacity .8s var(--ease), transform .8s var(--ease);
    }
    .sr.d1 { transition-delay:.12s }
    .sr.d2 { transition-delay:.24s }
    .sr.d3 { transition-delay:.36s }
    .sr.d4 { transition-delay:.48s }
    .sr.vis { opacity:1; transform:none; }

    /* ═══════════════ NAVIGATION ═══════════════ */
/* ═══════════════ NAVIGATION ═══════════════ */

/* Logo image inside nav-brand */
.nav-brand img {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  object-fit: contain;          /* was: cover — contain keeps full logo visible */
  background: #fff;             /* white backing so transparent PNG/WEBP looks clean */
  padding: 4px;                 /* breathing room inside the rounded square */
}

/* Brand text color — default (transparent nav over hero) */
.nav-brand-txt .top {
  font-family: var(--display);
  font-size: 1.05rem;
  font-weight: 600;
  color: #fff;
  line-height: 1.2;
  transition: color .3s;
}
.nav-brand-txt .sub {
  font-family: var(--heading);
  font-size: .44rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .6);
  transition: color .3s;
}

/* Scrolled state — brand text goes dark */
.nav.scrolled .nav-brand-txt .top { color: var(--fm); }
.nav.scrolled .nav-brand-txt .sub { color: var(--fg); }

/* ── Base nav bar ── */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--nav-h);
  z-index: 1000;
  transition: background .4s, box-shadow .4s;
  background: rgba(6, 32, 15, 0.45);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.nav.scrolled {
  background: rgba(255, 255, 255, .97);
  backdrop-filter: blur(20px);
  box-shadow: 0 2px 24px rgba(6, 32, 15, .08);
  border-bottom: 1px solid rgba(6, 32, 15, .06);
}

.nav-inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 32px;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
}

/* ── Brand ── */
.nav-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  flex-shrink: 0;
  margin-right: auto;
}

/* ── Desktop nav links ── */
.nav-links {
  display: flex;
  align-items: center;
  gap: 2px;
}

.nl {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: .845rem;
  font-weight: 500;
  letter-spacing: .02em;
  color: rgba(255, 255, 255, .8);
  transition: color .2s, background .2s;
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
}
.nav.scrolled .nl           { color: #3a5e48; }
.nl:hover, .nl.act          { color: #fff !important; background: rgba(255,255,255,.12); }
.nav.scrolled .nl:hover,
.nav.scrolled .nl.act       { color: var(--fm) !important; background: var(--mn); }

/* ── CTA button ── */
.nav-cta {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 22px;
  border-radius: 999px;
  font-size: .845rem;
  font-weight: 600;
  letter-spacing: .03em;
  color: #fff;
  background: linear-gradient(135deg, var(--fl), var(--fg));
  box-shadow: 0 6px 20px rgba(43, 138, 82, .35);
  transition: transform .2s, box-shadow .2s;
  white-space: nowrap;
  border: none;
  cursor: pointer;
}
.nav-cta:hover {
  transform: scale(1.04);
  box-shadow: 0 10px 32px rgba(43, 138, 82, .45);
}

/* Phone link — hide on narrow screens */
.hide-phone { transition: color .3s; }
.nav.scrolled #navPhone { color: var(--fg) !important; }

/* ── Hamburger ── */
.hbg {
  display: none;                /* hidden on desktop */
  width: 42px;
  height: 42px;
  border-radius: 12px;
  align-items: center;
  justify-content: center;
  border: 1.5px solid rgba(255, 255, 255, .3);
  color: #fff;
  font-size: 1rem;
  background: none;
  cursor: pointer;
  transition: border-color .2s, color .2s;
}
.nav.scrolled .hbg {
  border-color: rgba(6, 32, 15, .2);
  color: var(--fm);
}

/* ═══════════════ MOBILE MENU ═══════════════ */
.mob-menu {
  display: none;
  position: fixed;
  top: var(--nav-h);
  left: 0; right: 0; bottom: 0;
  background: rgba(6, 32, 15, .97);
  backdrop-filter: blur(28px);
  z-index: 999;
  flex-direction: column;
  padding: 28px 24px;
  gap: 4px;
  overflow-y: auto;
}
.mob-menu.open {
  display: flex;
  animation: mslide .3s ease;
}
@keyframes mslide {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: none; }
}

.mn-item {
  padding: 16px 20px;
  border-radius: 14px;
  font-size: 1.05rem;
  font-weight: 500;
  color: rgba(255, 255, 255, .7);
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  transition: all .2s;
  text-align: left;
  width: 100%;
  background: none;
  cursor: pointer;
}
.mn-item:hover { color: #fff; background: rgba(255, 255, 255, .07); }

.mn-cta {
  margin-top: 16px;
  padding: 16px 24px;
  border-radius: 16px;
  width: 100%;
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(135deg, var(--fl), var(--sa));
  border: none;
  cursor: pointer;
}

/* ═══════════════ RESPONSIVE BREAKPOINTS ═══════════════ */

/* Tablet — hide phone number to save space */
@media (max-width: 900px) {
  .hide-phone { display: none !important; }

  .nav-inner { padding: 0 20px; gap: 10px; }

  .nl { padding: 7px 10px; font-size: .8rem; }

  .nav-cta { padding: 9px 16px; font-size: .8rem; }
}

/* Mobile — hide desktop links, show hamburger */
@media (max-width: 680px) {
  .nav-links  { display: none; }          /* hide desktop nav links */
  .nav-cta    { display: none; }          /* hide desktop CTA (available in mob menu) */
  .hbg        { display: flex; }          /* show hamburger */

  .nav-inner  { padding: 0 16px; gap: 8px; }

  /* Slightly smaller brand on mobile */
  .nav-brand-txt .top { font-size: .92rem; }
  .nav-brand img      { width: 38px; height: 38px; }
}

/* Very small phones */
@media (max-width: 360px) {
  .nav-brand-txt .top { font-size: .82rem; }
  .nav-brand-txt .sub { display: none; }    /* sub-title drop on tiny screens */
}
    /* ═══════════════ HERO ═══════════════ */
.hero {
  position: relative; overflow: hidden;
  min-height: 100vh;
  display: flex; align-items: center;
  background: 
    linear-gradient(
      165deg, 
      rgba(6, 32, 15, 0.92) 0%, 
      rgba(13, 58, 30, 0.85) 40%, 
      rgba(26, 92, 52, 0.75) 100%
    ),
    url('../images/main.png') center center / cover no-repeat;
}

    /* Animated background orbs */
    .hero-orb {
      position:absolute; border-radius:50%; pointer-events:none;
      background: radial-gradient(circle, rgba(77,184,124,.15), transparent);
    }
    .hero-orb-1 { width:800px;height:800px; right:-200px; top:-200px; animation:orbf 8s ease-in-out infinite; }
    .hero-orb-2 { width:500px;height:500px; left:-100px; bottom:0; animation:orbf 10s ease-in-out infinite reverse; }
    .hero-orb-3 { width:300px;height:300px; right:30%;top:20%; animation:orbf 6s ease-in-out infinite 2s; }
    @keyframes orbf { 0%,100%{opacity:.6;transform:scale(1)} 50%{opacity:1;transform:scale(1.15)} }

    /* Leaf pattern overlay */
    .hero-leaf {
      position:absolute; inset:0; pointer-events:none; overflow:hidden;
    }
   

    /* Grid decoration lines */
    .hero-lines {
      position:absolute; inset:0; pointer-events:none;
      background-image:
        linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
      background-size: 80px 80px;
    }

    .hero-in {
      max-width:1320px; margin:0 auto;
      padding: calc(var(--nav-h) + 40px) 32px 80px;
      display: grid;
      grid-template-columns: 1fr 420px;
      gap: 64px; align-items:center;
      position:relative; z-index:10;
      width:100%;
    }

    .hero-eyebrow {
      display:inline-flex; align-items:center; gap:8px;
      font-family: var(--heading);
      font-size:.62rem; letter-spacing:.28em; text-transform:uppercase;
      padding:7px 18px; border-radius:999px;
      color: var(--sl);
      background: rgba(130,212,168,.07);
      border: 1px solid rgba(130,212,168,.18);
      margin-bottom:28px;
    }

    .hero-title {
      font-family: var(--display);
      font-size: clamp(3.2rem, 5.5vw, 5.5rem);
      font-weight:500; line-height:1.06; color:#fff;
      margin-bottom:24px;
    }
    .hero-title em { color: var(--sl); font-style:italic; }

    .hero-sub {
      font-size:1.02rem; font-weight:300; line-height:1.8;
      color:rgba(255,255,255,.58);
      max-width:480px; margin-bottom:40px;
    }

    .hero-btns { display:flex; gap:16px; flex-wrap:wrap; margin-bottom:52px; }

    .btn-solid {
      display:inline-flex; align-items:center; gap:9px;
      padding:14px 28px; border-radius:999px;
      font-size:.875rem; font-weight:600; letter-spacing:.04em;
      color:#fff;
      background: linear-gradient(135deg, var(--fl), var(--sa));
      box-shadow:0 8px 28px rgba(77,184,124,.35);
      transition:transform .25s, box-shadow .25s;
    }
    .btn-solid:hover { transform:scale(1.05); box-shadow:0 14px 40px rgba(77,184,124,.45); }

    .btn-ghost {
      display:inline-flex; align-items:center; gap:9px;
      padding:14px 28px; border-radius:999px;
      font-size:.875rem; font-weight:600; letter-spacing:.04em;
      color:#fff;
      border: 1.5px solid rgba(255,255,255,.3);
      background:transparent;
      transition: background .25s;
    }
    .btn-ghost:hover { background:rgba(255,255,255,.1); }

    .hero-divider { height:1px; background:rgba(255,255,255,.1); margin-bottom:32px; }

    .hero-stats { display:flex; gap:0; }
    .hero-stat { flex:1; padding:0 24px; }
    .hero-stat:first-child { padding-left:0; }
    .hero-stat:not(:first-child) { border-left:1px solid rgba(255,255,255,.1); }

    .hs-num {
      font-family: var(--display);
      font-size:2.8rem; font-weight:500; color:#fff; line-height:1;
    }
    .hs-num b { color: var(--sl); }
    .hs-lbl { font-size:.75rem; color:rgba(255,255,255,.45); margin-top:6px; line-height:1.5; }

    /* Hero card */
    .hero-card {
      background:rgba(255,255,255,.06);
      backdrop-filter:blur(20px);
      border:1px solid rgba(255,255,255,.12);
      border-radius:28px; overflow:hidden;
    }

    .hc-img {
      height:220px;
      background: linear-gradient(145deg, rgba(43,138,82,.25), rgba(6,32,15,.5));
      display:flex; align-items:center; justify-content:center;
      position:relative;
    }

    .hc-img-icon { font-size:5rem; color:rgba(255,255,255,.07); }

    .hc-badge {
      position:absolute; top:16px; left:16px;
      font-family:var(--heading); font-size:.6rem;
      letter-spacing:.2em; text-transform:uppercase;
      padding:6px 14px; border-radius:999px;
      color:var(--sl);
      background:rgba(130,212,168,.1);
      border:1px solid rgba(130,212,168,.2);
    }

    .hc-body { padding:28px; }
    .hc-title {
      font-family:var(--display);
      color:#fff; font-size:1.45rem; margin-bottom:10px;
    }
    .hc-desc { font-size:.84rem; color:rgba(255,255,255,.5); line-height:1.75; }

    .hc-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
    .hc-tag {
      display:inline-flex; align-items:center; gap:6px;
      padding:6px 12px; border-radius:999px;
      font-size:.75rem; font-weight:500;
      background:rgba(255,255,255,.07);
      border:1px solid rgba(255,255,255,.1);
      color:rgba(255,255,255,.65);
    }

    .hero-wave {
      position:absolute; bottom:0; left:0; right:0;
    }
    .hero-wave svg { width:100%; display:block; height:70px; }

    /* ═══════════════ MARQUEE ═══════════════ */
    .marquee-wrap {
      overflow:hidden; background:#f1faf5;
      border-top:1px solid rgba(6,32,15,.06);
      border-bottom:1px solid rgba(6,32,15,.06);
      padding:14px 0;
    }
    .mq-track {
      display:inline-flex; white-space:nowrap;
      animation: mqs 30s linear infinite;
    }
    @keyframes mqs { from{transform:translateX(0)} to{transform:translateX(-50%)} }

    .mq-item {
      display:inline-flex; align-items:center; gap:12px;
      padding:0 36px;
      font-family:var(--heading);
      font-size:.72rem; letter-spacing:.2em; text-transform:uppercase;
      color: var(--fl);
    }
    .mq-dot { width:4px;height:4px; border-radius:50%; background:var(--sa); flex-shrink:0; }

    /* ═══════════════ SECTION COMMONS ═══════════════ */
    .sec { padding:96px 0; }
    .sec-sm { padding:72px 0; }
    .container { max-width:1320px; margin:0 auto; padding:0 32px; }

    .eyebrow {
      display:inline-flex; align-items:center; gap:8px;
      font-family:var(--heading);
      font-size:.62rem; letter-spacing:.26em; text-transform:uppercase;
      padding:7px 18px; border-radius:999px;
    }
    .ey-grn {
      color:var(--fl); background:rgba(43,138,82,.08);
      border:1px solid rgba(43,138,82,.18);
    }
    .ey-wht {
      color:var(--sl); background:rgba(130,212,168,.07);
      border:1px solid rgba(130,212,168,.18);
    }

    .sec-title {
      font-family:var(--display);
      font-size:clamp(2rem,4vw,3.2rem); font-weight:500;
      line-height:1.12; color:var(--f);
    }
    .sec-title em { color:var(--fg); font-style:italic; }

    .sec-sub {
      font-size:.94rem; font-weight:300; line-height:1.8;
      color:#4a7060; margin-top:14px;
    }

    /* ═══════════════ VISION / MISSION ═══════════════ */
    .vm-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }

    .vm-card {
      border-radius:28px; padding:52px;
      position:relative; overflow:hidden;
    }
    .vm-dark {
      background:linear-gradient(145deg, var(--f), var(--fm));
    }
    .vm-light {
      background:linear-gradient(145deg, var(--mn), var(--sp));
    }

    .vm-title {
      font-family:var(--display);
      font-size:clamp(1.5rem,3vw,2.2rem); line-height:1.2;
      margin-bottom:16px;
    }
    .vm-dark .vm-title { color:#fff; }
    .vm-light .vm-title { color:var(--f); }

    .vm-desc { font-size:.92rem; font-weight:300; line-height:1.8; }
    .vm-dark .vm-desc { color:rgba(255,255,255,.56); }
    .vm-light .vm-desc { color:#2c5a40; }

    .vm-quote {
      font-family:var(--display);
      position:absolute; bottom:20px; right:32px;
      font-size:9rem; line-height:1; pointer-events:none; user-select:none;
    }
    .vm-dark .vm-quote { color:rgba(255,255,255,.03); }
    .vm-light .vm-quote { color:rgba(6,32,15,.04); }

    /* ═══════════════ TREATMENTS ═══════════════ */
    .trt-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

    .trt-card {
      background:#fff; border-radius:20px;
      overflow:hidden; border:1px solid rgba(6,32,15,.07);
      transition:transform .4s var(--ease), box-shadow .4s ease;
      cursor:pointer;
    }
    .trt-card:hover { transform:translateY(-10px); box-shadow:0 28px 60px rgba(6,32,15,.12); }

    .trt-vis {
      height:140px;
      display:flex; align-items:center; justify-content:center;
      font-size:3rem; position:relative; overflow:hidden;
    }
    .trt-vis::after {
      content:'';
      position:absolute; inset:0;
      background:inherit; opacity:0;
      transition:opacity .3s;
    }
    .trt-card:hover .trt-vis::after { opacity:.1; }

    .tv-gr  { background:linear-gradient(135deg,#e6f5ed,#c8e8d8); color:var(--fg); }
    .tv-gd  { background:linear-gradient(135deg,#fdf4e3,#f4e4c0); color:var(--gd); }
    .tv-bl  { background:linear-gradient(135deg,#e7eef6,#ccdaea); color:#5a87b0; }
    .tv-pk  { background:linear-gradient(135deg,#f6e7ee,#eaccd8); color:#b05a7a; }
    .tv-lm  { background:linear-gradient(135deg,#eef4e7,#d8eccc); color:#6a9848; }
    .tv-tl  { background:linear-gradient(135deg,#e6f5ed,#c8e4d0); color:var(--fg); }
    .tv-og  { background:linear-gradient(135deg,#f5efde,#e8d8b0); color:#9a6a28; }
    .tv-pu  { background:linear-gradient(135deg,#eeebf5,#d8d0ea); color:#6a5a9a; }

    .trt-body { padding:28px; }
    .trt-tag {
      display:inline-flex; align-items:center; gap:6px;
      font-size:.72rem; font-weight:600;
      padding:4px 12px; border-radius:999px;
      background:rgba(43,138,82,.08); color:var(--fm);
      border:1px solid rgba(43,138,82,.14);
      margin-bottom:14px;
    }
    .trt-title {
      font-family:var(--display);
      font-size:1.25rem; color:var(--f); margin-bottom:10px;
    }
    .trt-desc { font-size:.83rem; color:#4a7060; line-height:1.75; }

    .trt-link {
      display:inline-flex; align-items:center; gap:6px;
      font-size:.82rem; font-weight:600;
      color:var(--fl); margin-top:16px;
      transition:gap .2s;
    }
    .trt-link:hover { gap:10px; }

    /* ═══════════════ PACKAGES ═══════════════ */
    .pkg-section {
      background:linear-gradient(165deg, var(--f) 0%, var(--fm) 60%, #1e6b3c 100%);
      position:relative; overflow:hidden;
    }

    .pkg-bg-ring {
      position:absolute; border-radius:50%; pointer-events:none;
      border:1px solid rgba(77,184,124,.1);
    }
    .pkg-r1 { width:700px;height:700px; right:-200px;top:-200px; }
    .pkg-r2 { width:400px;height:400px; right:50px;bottom:-100px; animation:rotslow 40s linear infinite; }
    @keyframes rotslow { from{transform:rotate(0)} to{transform:rotate(360deg)} }

    .pkg-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }

    .pkg-card {
      background:rgba(255,255,255,.06);
      border:1px solid rgba(255,255,255,.1);
      border-radius:20px; padding:28px 20px;
      text-align:center;
      transition:all .4s var(--ease);
      cursor:pointer;
    }
    .pkg-card:hover, .pkg-card.featured {
      background:rgba(255,255,255,.12);
      border-color:rgba(130,212,168,.4);
      transform:translateY(-8px);
      box-shadow:0 24px 60px rgba(0,0,0,.2);
    }
    .pkg-card.featured { transform:scale(1.04) translateY(-8px); }

    .pkg-ico {
      width:56px;height:56px; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      margin:0 auto 20px;
      background:rgba(130,212,168,.12);
      color:var(--sl); font-size:1.4rem;
    }
    .pkg-card.featured .pkg-ico {
      background:rgba(130,212,168,.25); color:#fff;
    }

    .pkg-days {
      font-family:var(--display);
      font-size:2.4rem; font-weight:500;
      color:#fff; line-height:1;
    }
    .pkg-days span { font-size:.9rem; font-weight:300; color:rgba(255,255,255,.5); }

    .pkg-name {
      font-family:var(--heading);
      font-size:.65rem; letter-spacing:.2em; text-transform:uppercase;
      color:var(--sl); margin:6px 0 14px;
    }

    .pkg-desc { font-size:.8rem; color:rgba(255,255,255,.5); line-height:1.7; }

    .pkg-btn {
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      padding:10px 20px; border-radius:999px;
      font-size:.8rem; font-weight:600;
      color:#fff;
      border:1px solid rgba(255,255,255,.25);
      margin-top:20px;
      transition:background .2s;
    }
    .pkg-btn:hover, .pkg-card.featured .pkg-btn {
      background:rgba(255,255,255,.12);
    }

    /* ═══════════════ ABOUT ═══════════════ */
    .about-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }

    .about-card-wrap {
      border-radius:28px; overflow:hidden;
      background:linear-gradient(145deg, var(--f), var(--fm));
      box-shadow:0 40px 80px rgba(6,32,15,.22);
      position:relative;
    }
    .ac-vis {
      height:260px;
      background:linear-gradient(135deg, var(--fm), var(--fg));
      display:flex; align-items:center; justify-content:center;
      position:relative; overflow:hidden;
    }
    .ac-vis-ico { font-size:6rem; color:rgba(255,255,255,.06); }
    .ac-vis-glow {
      position:absolute; inset:0;
      background:radial-gradient(circle at 40% 60%, rgba(77,184,124,.2), transparent 65%);
    }
    .ac-body { padding:36px; }
    .ac-title { font-family:var(--display); color:#fff; font-size:1.4rem; margin-bottom:10px; }
    .ac-desc { font-size:.84rem; color:rgba(255,255,255,.5); line-height:1.75; }
    .ac-list { display:flex; flex-direction:column; gap:12px; margin-top:24px; }
    .ac-item {
      display:flex; gap:12px; align-items:center;
      font-size:.83rem; color:rgba(255,255,255,.7);
    }
    .ac-check {
      width:24px;height:24px; border-radius:50%; flex-shrink:0;
      display:flex; align-items:center; justify-content:center;
      background:rgba(77,184,124,.2); color:var(--sl); font-size:.72rem;
    }
    .ac-badge {
      position:absolute; bottom:-20px; left:-16px;
      padding:18px 24px; border-radius:16px; text-align:center;
      background:linear-gradient(135deg, var(--fl), var(--sa));
      box-shadow:0 12px 36px rgba(77,184,124,.3);
    }
    .ac-badge-num { font-family:var(--display); color:#fff; font-size:2rem; font-weight:600; line-height:1; }
    .ac-badge-lbl { font-size:.72rem; color:rgba(255,255,255,.8); margin-top:4px; }

    .about-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:32px 0; }
    .astat {
      background:#fff; border-radius:16px;
      padding:20px; text-align:center;
      border:1px solid rgba(6,32,15,.07);
      box-shadow:0 4px 20px rgba(6,32,15,.05);
      transition:transform .3s;
    }
    .astat:hover { transform:translateY(-4px); }
    .astat-num {
      font-family:var(--display);
      font-size:1.8rem; font-weight:500; color:var(--f); line-height:1;
    }
    .astat-num b { color:var(--fg); }
    .astat-lbl { font-size:.75rem; color:#4a7060; margin-top:6px; }

    /* Feature list */
    .feat-list { display:flex; flex-direction:column; gap:16px; }
    .feat-item {
      display:flex; gap:20px; align-items:flex-start;
      background:#fff; border-radius:16px; padding:22px 24px;
      border:1px solid rgba(6,32,15,.07);
      box-shadow:0 4px 16px rgba(6,32,15,.04);
      transition:transform .25s;
    }
    .feat-item:hover { transform:translateX(6px); }
    .feat-ico {
      width:44px;height:44px; border-radius:12px; flex-shrink:0;
      display:flex; align-items:center; justify-content:center;
      background:var(--mn); color:var(--fl);
    }
    .feat-title { font-weight:600; color:var(--f); margin-bottom:4px; font-size:.95rem; }
    .feat-desc { font-size:.83rem; color:#4a7060; line-height:1.7; font-weight:300; }

    /* ═══════════════ TESTIMONIALS ═══════════════ */
    .testi-section {
      background:linear-gradient(170deg, var(--mn) 0%, #fff 60%);
    }

    .testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

    .testi-card {
      background:#fff; border-radius:24px; padding:36px;
      border:1px solid rgba(6,32,15,.07);
      box-shadow:0 8px 32px rgba(6,32,15,.06);
      transition:transform .4s var(--ease);
      position:relative;
    }
    .testi-card:hover { transform:translateY(-8px); }

    .testi-stars { display:flex; gap:4px; margin-bottom:20px; }
    .testi-stars i { color:var(--gd); font-size:.85rem; }

    .testi-quote {
      font-family:var(--display);
      font-size:1rem; font-weight:400; line-height:1.75;
      color:var(--f); margin-bottom:24px; font-style:italic;
    }

    .testi-foot { display:flex; align-items:center; gap:14px; border-top:1px solid rgba(6,32,15,.06); padding-top:20px; }
    .testi-av {
      width:44px;height:44px; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      font-size:1.1rem; flex-shrink:0;
    }
    .ta-gr { background:#e6f5ed; color:var(--fg); }
    .ta-gd { background:#fdf4e3; color:var(--gd); }
    .ta-bl { background:#e7eef6; color:#5a87b0; }

    .testi-name { font-weight:600; font-size:.9rem; color:var(--f); }
    .testi-org  { font-size:.75rem; color:#4a7060; margin-top:2px; }

    .testi-qmark {
      position:absolute; top:28px; right:28px;
      font-family:var(--display);
      font-size:4rem; color:rgba(6,32,15,.04);
      line-height:1;
    }

    /* ═══════════════ DOCTORS ═══════════════ */
    .doc-section { background:linear-gradient(165deg, var(--f) 0%, var(--fm) 55%, #1b5e34 100%); position:relative; overflow:hidden; }

    .doc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

    .doc-card {
      border-radius:24px; overflow:hidden;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(255,255,255,.09);
      transition:transform .4s var(--ease), box-shadow .4s;
    }
    .doc-card:hover { transform:translateY(-10px); box-shadow:0 30px 60px rgba(0,0,0,.2); }

    .doc-vis {
      height:200px; display:flex; align-items:center; justify-content:center;
    }
    .dv-gr  { background:linear-gradient(135deg,rgba(43,138,82,.2),rgba(6,32,15,.4)); }
    .dv-gd  { background:linear-gradient(135deg,rgba(168,118,42,.15),rgba(6,32,15,.4)); }
    .dv-tl  { background:linear-gradient(135deg,rgba(77,184,124,.12),rgba(6,32,15,.4)); }

    .doc-av {
      width:88px;height:88px; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      font-size:2.2rem; color:rgba(255,255,255,.3);
      background:rgba(255,255,255,.06);
      border:3px solid rgba(255,255,255,.12);
    }

    .doc-body { padding:26px; }
    .doc-name { font-family:var(--display); color:#fff; font-size:1.2rem; margin-bottom:4px; }
    .doc-spec { font-size:.75rem; color:var(--sl); margin-bottom:14px; font-weight:500; }
    .doc-desc { font-size:.82rem; color:rgba(255,255,255,.5); line-height:1.7; }

    /* ═══════════════ TIMELINE ═══════════════ */
    .tl-wrap { position:relative; }
    .tl-line {
      position:absolute; left:17px; top:20px; bottom:20px;
      width:1px; background:linear-gradient(to bottom, var(--sa), rgba(77,184,124,.1));
    }
    .tl-list { display:flex; flex-direction:column; gap:32px; }
    .tl-item { display:flex; gap:24px; }

    .tl-dot {
      width:36px;height:36px; border-radius:50%; flex-shrink:0;
      display:flex; align-items:center; justify-content:center;
      position:relative; z-index:1;
    }
    .tl-dot-fill { background:linear-gradient(135deg, var(--fm), var(--fl)); color:#fff; font-size:.75rem; }
    .tl-dot-out  { border:2px solid var(--sa); background:var(--mn); }
    .tl-dot-now  { background:linear-gradient(135deg, var(--fl), var(--sa)); color:#fff; font-size:.75rem; }

    .tl-yr { font-family:var(--heading); font-size:.72rem; letter-spacing:.2em; color:var(--sa); margin-bottom:4px; }
    .tl-evtitle { font-weight:600; font-size:.95rem; color:var(--f); margin-bottom:4px; }
    .tl-evdesc { font-size:.83rem; color:#4a7060; line-height:1.65; font-weight:300; }

    /* ═══════════════ BLOG ═══════════════ */
    .blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }

    .blog-card {
      background:#fff; border-radius:20px; overflow:hidden;
      border:1px solid rgba(6,32,15,.07);
      transition:transform .4s var(--ease), box-shadow .4s;
    }
    .blog-card:hover { transform:translateY(-8px); box-shadow:0 24px 56px rgba(6,32,15,.1); }

    .blog-vis {
      height:200px; display:flex; align-items:center; justify-content:center;
      font-size:3.5rem; position:relative;
    }
    .bv-gr  { background:linear-gradient(135deg,#e6f5ed,#c8e8d8); color:var(--fg); }
    .bv-gd  { background:linear-gradient(135deg,#fdf4e3,#f0ddb8); color:var(--gd); }
    .bv-bl  { background:linear-gradient(135deg,#e7eef6,#cddae8); color:#5a87b0; }

    .blog-date {
      position:absolute; bottom:14px; left:14px;
      font-family:var(--heading); font-size:.6rem;
      letter-spacing:.18em; text-transform:uppercase;
      padding:5px 12px; border-radius:999px;
      color:#fff; background:rgba(6,32,15,.6);
    }

    .blog-body { padding:26px; }
    .blog-cat {
      display:inline-block; font-size:.72rem; font-weight:600;
      color:var(--fg); margin-bottom:10px;
    }
    .blog-title {
      font-family:var(--display);
      font-size:1.15rem; color:var(--f); margin-bottom:10px; line-height:1.4;
    }
    .blog-desc { font-size:.83rem; color:#4a7060; line-height:1.7; font-weight:300; }
    .blog-link {
      display:inline-flex; align-items:center; gap:6px;
      font-size:.82rem; font-weight:600; color:var(--fl);
      margin-top:16px; transition:gap .2s;
    }
    .blog-link:hover { gap:10px; }

    /* ═══════════════ CTA ═══════════════ */
    .cta-section {
      background:linear-gradient(160deg, var(--f) 0%, var(--fm) 50%, #2b8a52 100%);
      position:relative; overflow:hidden; text-align:center;
      padding:100px 0;
    }
    .cta-section::before {
      content:''; position:absolute; inset:0;
      background:
        radial-gradient(circle at 20% 50%, rgba(77,184,124,.14), transparent 50%),
        radial-gradient(circle at 80% 50%, rgba(77,184,124,.1), transparent 45%);
    }
    .cta-in { max-width:720px; margin:0 auto; padding:0 32px; position:relative; z-index:10; }
    .cta-title { font-family:var(--display); color:#fff; font-size:clamp(2.2rem,4.5vw,3.4rem); line-height:1.1; }
    .cta-sub { color:rgba(255,255,255,.6); font-size:1rem; line-height:1.75; margin:16px 0 44px; font-weight:300; }
    .cta-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

    .btn-cta-wh {
      display:inline-flex; align-items:center; gap:8px;
      padding:16px 32px; border-radius:999px;
      font-size:.875rem; font-weight:600; letter-spacing:.04em;
      color:var(--fm); background:#fff;
      box-shadow:0 8px 28px rgba(0,0,0,.15);
      transition:transform .2s;
    }
    .btn-cta-wh:hover { transform:scale(1.05); }

    .btn-cta-gh {
      display:inline-flex; align-items:center; gap:8px;
      padding:16px 32px; border-radius:999px;
      font-size:.875rem; font-weight:600; letter-spacing:.04em;
      color:#fff; border:2px solid rgba(255,255,255,.35); background:transparent;
      transition:background .2s;
    }
    .btn-cta-gh:hover { background:rgba(255,255,255,.1); }

    /* ═══════════════ PAGE HERO (inner pages) ═══════════════ */
    .page-hero {
      background:linear-gradient(155deg, var(--f) 0%, var(--fm) 50%, var(--fl) 100%);
      position:relative; overflow:hidden;
      padding:calc(var(--nav-h) + 56px) 0 100px;
    }
    .ph-orb {
      position:absolute; border-radius:50%; pointer-events:none;
    }
    .ph-orb-1 { width:600px;height:600px;right:-150px;top:-150px; border:1px solid rgba(77,184,124,.1); }
    .ph-orb-2 { width:350px;height:350px;right:50px;top:100px; border:1px dashed rgba(77,184,124,.07); }

    .ph-in { max-width:1320px; margin:0 auto; padding:0 32px; position:relative; z-index:10; }
    .ph-title { font-family:var(--display); font-size:clamp(2.6rem,5vw,4.2rem); color:#fff; line-height:1.06; margin-bottom:16px; }
    .ph-desc { color:rgba(255,255,255,.58); max-width:540px; line-height:1.8; font-size:1rem; font-weight:300; }

    .ph-stats { display:flex; gap:48px; margin-top:44px; flex-wrap:wrap; }
    .ph-sn { font-family:var(--display); font-size:2.4rem; font-weight:500; color:var(--sl); }
    .ph-sl { font-size:.75rem; color:rgba(255,255,255,.42); margin-top:4px; }

    .ph-wave { position:absolute; bottom:0; left:0; right:0; }
    .ph-wave svg { width:100%; display:block; height:64px; }

    /* ═══════════════ CONTACT ═══════════════ */
    .con-grid { display:grid; grid-template-columns:2fr 3fr; gap:32px; }

    .con-panel {
      border-radius:24px; padding:36px;
      background:linear-gradient(145deg, var(--f), var(--fm));
      position:sticky; top:calc(var(--nav-h) + 20px);
    }

    .con-title { font-family:var(--display); color:#fff; font-size:1.8rem; margin-bottom:28px; }

    .con-item {
      display:flex; gap:16px; padding:16px;
      border-radius:16px;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(255,255,255,.08);
    }
    .con-ico {
      width:40px;height:40px; border-radius:12px; flex-shrink:0;
      display:flex; align-items:center; justify-content:center;
      background:rgba(77,184,124,.18); color:var(--sl);
    }
    .con-lbl { font-size:.75rem; font-weight:600; color:#fff; margin-bottom:4px; }
    .con-val { font-size:.82rem; color:rgba(255,255,255,.55); line-height:1.6; }

    .con-hrs { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .con-hr {
      border-radius:12px; padding:12px;
      background:rgba(255,255,255,.05);
    }
    .con-hr-d { font-size:.74rem; color:rgba(255,255,255,.38); margin-bottom:4px; }
    .con-hr-t { font-size:.875rem; font-weight:600; color:#fff; }
    .con-hr-w { grid-column:span 2; }

    .con-form {
      background:#fff; border-radius:24px; padding:44px;
      border:1px solid rgba(6,32,15,.08);
      box-shadow:0 8px 40px rgba(6,32,15,.07);
    }
    .con-form-title { font-family:var(--display); font-size:2rem; color:var(--f); margin-bottom:8px; }
    .con-form-sub { font-size:.88rem; color:#4a7060; line-height:1.7; margin-bottom:36px; font-weight:300; }

    .fg { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
    .f-grp { display:flex; flex-direction:column; gap:8px; }
    .f-grp-full { grid-column:span 2; }
    .f-lbl { font-size:.75rem; font-weight:600; color:var(--f); }
    .f-inp {
      width:100%; padding:12px 16px; border-radius:12px;
      border:1.5px solid rgba(6,32,15,.1); background:#f7fdf9;
      color:var(--f); font-size:.875rem; outline:none;
      transition:border-color .2s, box-shadow .2s;
    }
    .f-inp:focus {
      border-color:var(--sa);
      box-shadow:0 0 0 4px rgba(77,184,124,.1);
    }
    .f-foot { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:24px; }
    .f-note { font-size:.78rem; color:#4a7060; }
    .f-sub {
      display:inline-flex; align-items:center; gap:9px;
      padding:14px 28px; border-radius:999px;
      font-size:.875rem; font-weight:600; color:#fff;
      background:linear-gradient(135deg, var(--fm), var(--fg));
      box-shadow:0 6px 20px rgba(26,92,52,.3);
      transition:transform .2s;
    }
    .f-sub:hover { transform:scale(1.04); }
    .f-sub:disabled { opacity:.7; }

    .f-ok {
      display:none; margin-top:20px; padding:16px;
      border-radius:12px; align-items:center; gap:12px;
      background:#e8f5ec; border:1px solid #c0ddc8;
    }
    .f-ok.show { display:flex; }
    .f-ok-ico { color:var(--fl); }
    .f-ok-txt { font-size:.85rem; color:#1a4f34; }

    /* ═══════════════ SERVICES PAGE ═══════════════ */
    .svc-page-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
    .svc-item {
      background:#fff; border-radius:20px; overflow:hidden;
      border:1px solid rgba(6,32,15,.07);
      transition:transform .4s var(--ease), box-shadow .4s;
    }
    .svc-item:hover { transform:translateY(-8px); box-shadow:0 24px 56px rgba(6,32,15,.1); }
    .svc-vis { height:130px; display:flex; align-items:center; justify-content:center; font-size:2.8rem; }
    .svc-body { padding:28px; }
    .svc-title { font-family:var(--display); font-size:1.25rem; color:var(--f); margin-bottom:10px; }
    .svc-desc { font-size:.83rem; color:#4a7060; line-height:1.75; font-weight:300; }

    .svc-emg {
      border-radius:20px; overflow:hidden;
      background:linear-gradient(145deg, var(--f), var(--fm));
    }
    .svc-emg-vis { height:130px; display:flex; align-items:center; justify-content:center; font-size:2.8rem; color:rgba(255,255,255,.2); }
    .svc-emg-body { padding:28px; }
    .svc-emg-title { font-family:var(--display); color:#fff; font-size:1.25rem; margin-bottom:10px; }
    .svc-emg-desc { font-size:.83rem; color:rgba(255,255,255,.5); line-height:1.75; font-weight:300; }
    .svc-emg-btn {
      display:inline-flex; align-items:center; gap:8px;
      padding:10px 22px; border-radius:999px;
      font-size:.84rem; font-weight:600; color:#fff;
      background:linear-gradient(135deg, var(--fl), var(--sa));
      margin-top:20px;
    }

    /* ═══════════════ DOCTORS PAGE ═══════════════ */
    .dcp-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
    .dcp-card {
      background:#fff; border-radius:24px; overflow:hidden;
      border:1px solid rgba(6,32,15,.07);
      transition:transform .4s var(--ease), box-shadow .4s;
    }
    .dcp-card:hover { transform:translateY(-10px); box-shadow:0 28px 60px rgba(6,32,15,.1); }

    .dcp-vis { height:200px; display:flex; align-items:center; justify-content:center; position:relative; }
    .dv-mn  { background:linear-gradient(135deg,#e6f5ed,#c8e8d8); }
    .dv-gd2 { background:linear-gradient(135deg,#fdf4e3,#f0ddb8); }
    .dv-bl2 { background:linear-gradient(135deg,#e7eef6,#cddae8); }
    .dv-pk2 { background:linear-gradient(135deg,#f6e7ee,#eaccd8); }
    .dv-gn2 { background:linear-gradient(135deg,#eef4e7,#d8eccc); }
    .dv-tl2 { background:linear-gradient(135deg,#e6f5ed,#c8e4d0); }

    .dcp-av {
      width:96px;height:96px; border-radius:50%;
      display:flex; align-items:center; justify-content:center;
      font-size:2.4rem; background:#fff;
      border:4px solid #fff;
      box-shadow:0 8px 28px rgba(6,32,15,.1);
    }
    .da-gr  { color:var(--fg); }
    .da-gd  { color:var(--gd); }
    .da-bl  { color:#5a87b0; }
    .da-pk  { color:#b05a7a; }
    .da-gn  { color:#6a9848; }
    .da-tl  { color:var(--fg); }

    .dcp-badge {
      position:absolute; top:16px; right:16px;
      font-family:var(--heading); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
      padding:5px 12px; border-radius:999px; color:#fff;
    }
    .db-dg { background:var(--fm); }
    .db-gd { background:var(--gd); }
    .db-bl { background:#5a87b0; }
    .db-pk { background:#b05a7a; }
    .db-gn { background:#6a9848; }
    .db-tl { background:var(--fl); }

    .dcp-body { padding:26px; }
    .dcp-name { font-family:var(--display); color:var(--f); font-size:1.25rem; margin-bottom:4px; }
    .dcp-spec { font-size:.75rem; font-weight:600; color:var(--fl); margin-bottom:12px; }
    .dcp-desc { font-size:.83rem; color:#4a7060; line-height:1.7; font-weight:300; }
    .dcp-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
    .dcp-tag {
      display:inline-flex; align-items:center; gap:5px;
      background:rgba(43,138,82,.08); color:var(--fm);
      font-size:.7rem; font-weight:600;
      padding:4px 11px; border-radius:999px;
      border:1px solid rgba(43,138,82,.14);
    }

    .join-box {
      border-radius:28px; padding:52px; max-width:580px; margin:0 auto;
      background:linear-gradient(145deg,var(--mn),var(--sp));
    }
    .join-title { font-family:var(--display); font-size:2.2rem; color:var(--f); margin-bottom:14px; }
    .join-desc { color:#2c5a40; font-size:.9rem; line-height:1.75; font-weight:300; }
    .join-btn {
      display:inline-flex; align-items:center; gap:9px;
      padding:14px 28px; border-radius:999px;
      font-size:.875rem; font-weight:600; color:#fff;
      background:linear-gradient(135deg, var(--fm), var(--fg));
      box-shadow:0 8px 24px rgba(26,92,52,.25);
      margin-top:24px; transition:transform .2s;
    }
    .join-btn:hover { transform:scale(1.04); }

   /* ═══════════════ FOOTER ═══════════════ */
.footer { background: var(--f); }
.ft-in  { max-width: 1320px; margin: 0 auto; padding: 0 32px; }

.ft-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 48px;
  padding: 72px 0 52px;
}

/* ── Brand icon / logo ── */
.ft-brand-ico {
  width: 56px; height: 56px;          /* bigger so logo is clearly visible */
  border-radius: 14px;
  background: #fff;                   /* white backing for transparent logo */
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.ft-brand-ico img {
  width: 48px; height: 48px;
  object-fit: contain;                /* full logo, no crop */
  display: block;
}

.ft-brand-name {
  font-family: var(--display);
  color: #fff;
  font-weight: 500;
  font-size: 1rem;
}
.ft-brand-sub {
  font-family: var(--heading);
  font-size: .42rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(77, 184, 124, .6);
}
.ft-brand-desc {
  font-size: .83rem;
  color: rgba(255, 255, 255, .38);
  line-height: 1.75;
  max-width: 260px;
  margin: 20px 0;
  font-weight: 300;
}

/* ── Social icons ── */
.ft-soc { display: flex; gap: 8px; }
.ft-soc-a {
  width: 36px; height: 36px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: .875rem;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .09);
  color: rgba(255, 255, 255, .45);
  transition: background .2s, color .2s;
}
.ft-soc-a:hover { background: rgba(255, 255, 255, .12); color: #fff; }

/* ── Column headings ── */
.ft-col-hd {
  font-family: var(--heading);
  font-size: .72rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--sa);
  margin-bottom: 24px;
}

/* ── Nav list ── */
.ft-list { display: flex; flex-direction: column; gap: 12px; list-style: none; }
.ft-nb {
  font-size: .875rem;
  color: rgba(255, 255, 255, .45);
  transition: color .2s;
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.ft-nb:hover { color: #fff; }
.ft-a {
  font-size: .875rem;
  color: rgba(255, 255, 255, .45);
  transition: color .2s;
  text-decoration: none;
}
.ft-a:hover { color: #fff; }

/* ── Contact list ── */
.ft-con-list { display: flex; flex-direction: column; gap: 16px; }
.ft-con-item {
  display: flex;
  gap: 12px;
  font-size: .83rem;
  color: rgba(255, 255, 255, .45);
  line-height: 1.65;
  font-weight: 300;
}
.ft-con-ico { color: var(--sa); margin-top: 2px; flex-shrink: 0; }

/* ── Divider & bottom bar ── */
.ft-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(77,184,124,.2), transparent);
}
.ft-bot {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 20px 0;
}
.ft-copy { font-size: .75rem; color: rgba(255, 255, 255, .24); }

/* ═══════════════ RESPONSIVE ═══════════════ */

/* Tablet — 2 column grid */
@media (max-width: 900px) {
  .ft-grid {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    padding: 52px 0 40px;
  }
  .ft-in { padding: 0 24px; }
}

/* Mobile — single column */
@media (max-width: 560px) {
  .ft-grid {
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 40px 0 32px;
  }
  .ft-in { padding: 0 20px; }
  .ft-brand-desc { max-width: 100%; }
  .ft-bot { flex-direction: column; gap: 6px; }
}

    /* ═══════════════ ABOUT IMPACT ═══════════════ */
    .imp-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }

    /* ═══════════════ RESPONSIVE ═══════════════ */
    @media(max-width:1100px) {
      .pkg-grid { grid-template-columns:repeat(3,1fr); }
      .pkg-card:nth-child(4), .pkg-card:nth-child(5) { display:none; }
    }
    @media(max-width:900px) {
      .hbg { display:flex; }
      .nav-links, .nav-cta-wrap { display:none; }
      .hero-in { grid-template-columns:1fr; }
      .hero-card { display:none; }
      .vm-grid { grid-template-columns:1fr; }
      .trt-grid { grid-template-columns:1fr 1fr; }
      .pkg-grid { grid-template-columns:1fr 1fr; }
      .pkg-card.featured { transform:none; }
      .about-grid { grid-template-columns:1fr; }
      .testi-grid { grid-template-columns:1fr; }
      .doc-grid { grid-template-columns:1fr 1fr; }
      .ft-grid { grid-template-columns:1fr 1fr; }
      .imp-grid { grid-template-columns:1fr 1fr; }
      .con-grid { grid-template-columns:1fr; }
      .dcp-grid { grid-template-columns:1fr 1fr; }
      .blog-grid { grid-template-columns:1fr 1fr; }
      .svc-page-grid { grid-template-columns:1fr 1fr; }
    }
    @media(max-width:600px) {
      .trt-grid { grid-template-columns:1fr; }
      .pkg-grid { grid-template-columns:1fr 1fr; }
      .doc-grid { grid-template-columns:1fr; }
      .ft-grid { grid-template-columns:1fr; }
      .dcp-grid { grid-template-columns:1fr; }
      .blog-grid { grid-template-columns:1fr; }
      .svc-page-grid { grid-template-columns:1fr; }
      .fg { grid-template-columns:1fr; }
      .f-grp-full { grid-column:span 1; }
      .about-stats { grid-template-columns:1fr 1fr; }
      .imp-grid { grid-template-columns:1fr 1fr; }
    }