/* ============================================================
   APEX CARE — Multi-Specialty Clinic & Surgical Hospital
   styles.css  |  Deep Emerald & Slate Medical Luxury Theme
   ============================================================ */

/* ---------- IMPORTS ---------- */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500&display=swap');

/* ---------- CSS VARIABLES ---------- */
:root {
  --bg-deep:       #06181a;
  --bg-card:       #0d2629;
  --bg-card-hover: #133338;
  --emerald:       #10b981;
  --emerald-dim:   #059669;
  --emerald-glow:  rgba(16,185,129,.18);
  --sky:           #38bdf8;
  --sky-dim:       #0ea5e9;
  --white:         #ffffff;
  --muted:         #94a3b8;
  --muted-dim:     #64748b;
  --border:        rgba(255,255,255,.06);
  --glass:         rgba(13,38,41,.72);
  --glass-border:  rgba(255,255,255,.08);
  --radius:        14px;
  --radius-sm:     8px;
  --radius-xs:     6px;
  --radius-full:   9999px;
  --shadow:        0 8px 32px rgba(0,0,0,.35);
  --shadow-lg:     0 20px 60px rgba(0,0,0,.5);
  --transition:    .3s cubic-bezier(.4,0,.2,1);
  --font-body:     'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  --font-heading:  'Playfair Display', 'Instrument Serif', Georgia, serif;
}

/* ---------- RESET ---------- */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; font-size:16px; }
body {
  font-family: var(--font-body);
  background: var(--bg-deep);
  color: var(--muted);
  line-height: 1.7;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
button { cursor:pointer; border:none; font-family:inherit; }
ul,ol { list-style:none; }

/* ---------- ANIMATED BACKGROUND ---------- */
#bg-canvas {
  position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.35;
}

/* SVG wave dividers */
.wave-divider {
  width:100%; overflow:hidden; line-height:0; position:relative; z-index:1;
}
.wave-divider svg {
  display:block; width:100%; height:60px;
}
.wave-divider svg path {
  fill: var(--bg-deep);
}
.wave-divider.flip svg { transform:rotate(180deg); }
.wave-divider.alt svg path { fill: var(--bg-card); }

/* ---------- UTILITY ---------- */
.container { max-width:1280px; margin:0 auto; padding:0 24px; }
.section-pad { padding:100px 0; position:relative; z-index:2; }
.section-bg { background: var(--bg-card); }
.section-tag {
  display:inline-flex; align-items:center; gap:6px;
  background: var(--emerald-glow); color:var(--emerald);
  font-size:.75rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:6px 16px; border-radius:var(--radius-full);
  margin-bottom:14px;
}
.section-title {
  font-family:var(--font-heading); font-size:clamp(1.8rem,4vw,2.8rem);
  color:var(--white); font-weight:700; line-height:1.25; margin-bottom:12px;
}
.section-sub { color:var(--muted); font-size:1.05rem; max-width:640px; }
.text-center { text-align:center; }
.mx-auto { margin-left:auto; margin-right:auto; }

/* ---------- NAVBAR ---------- */
.navbar {
  position:fixed; top:16px; left:50%; transform:translateX(-50%);
  width:calc(100% - 32px); max-width:1560px; z-index:1000;
  background:var(--glass); backdrop-filter:blur(24px) saturate(1.6);
  border:1px solid var(--glass-border); border-radius:var(--radius);
  padding:10px 32px 10px 24px; /* pr-8 adequate right padding to prevent overflow */
  display:flex; align-items:center; justify-content:space-between;
  box-shadow: var(--shadow);
  transition: var(--transition);
  box-sizing:border-box;
}
.navbar.scrolled {
  top:8px; padding:8px 28px 8px 20px;
  background:rgba(6,24,26,.94);
}

/* Brand */
.nav-brand { display:flex; align-items:center; gap:14px; margin-right:20px; flex-shrink:0; }
.nav-brand-icon {
  width:48px; height:48px; background:linear-gradient(135deg,var(--emerald),var(--sky));
  border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0;
  box-shadow: 0 4px 14px rgba(16,185,129,.35);
}
.nav-brand-icon svg { width:28px; height:28px; fill:var(--white); }
.nav-brand-text { display:flex; flex-direction:column; justify-content:center; }
.nav-brand-name {
  display:flex; align-items:center; gap:12px;
  font-size:clamp(1.85rem, 2.4vw, 2.25rem); /* text-3xl to text-4xl */
  font-weight:800; /* font-extrabold */
  color:var(--white); letter-spacing:-.03em; line-height:1.15; white-space:nowrap;
}
.nav-brand-badge {
  font-size:.875rem; /* text-sm */
  font-weight:600; color:var(--emerald); background:rgba(16,185,129,.15);
  border:1px solid rgba(16,185,129,.35);
  padding:4px 12px; /* px-3 py-1 */
  border-radius:var(--radius-full); white-space:nowrap; letter-spacing:.02em;
}
.nav-brand-sub {
  font-size:.875rem; /* text-sm to text-base, clearly legible */
  color:var(--muted); font-weight:500; white-space:nowrap; margin-top:3px; letter-spacing:.01em;
}

/* Nav links */
.nav-links { display:flex; align-items:center; gap:4px; flex-shrink:1; }
.nav-links a {
  font-size:.84rem; font-weight:500; color:var(--muted); padding:6px 10px;
  border-radius:var(--radius-xs); transition:var(--transition); white-space:nowrap;
}
.nav-links a:hover, .nav-links a.active {
  color:var(--white); background:rgba(255,255,255,.06);
}

/* Nav right: Dedicated High-Contrast Widget Container */
.nav-right {
  display:flex; align-items:center; flex-shrink:0; margin-left:auto;
}

/* Branch Widget: Dedicated High-Contrast Container with Sky/Cyan Accent */
.branch-widget,
.bg-\[\#03151e\]\/90 {
  background-color: rgba(3, 21, 30, 0.9);
}
.branch-widget {
  border: 1px solid rgba(56, 189, 248, 0.3); /* border-sky-500/30 */
  border-radius: 1rem; /* rounded-2xl */
  padding: 8px 16px; /* px-4 py-2 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06);
  backdrop-filter: blur(12px);
}

/* Branch Switcher Inner Track */
.branch-switcher,
.bg-\[\#061e2b\] {
  background-color: #061e2b;
}
.branch-switcher {
  border-radius: 0.75rem; /* rounded-xl */
  padding: 4px; /* p-1 */
  border: 1px solid rgba(12, 74, 110, 0.6); /* border-sky-900/60 */
  display: flex;
  align-items: center;
  gap: 3px;
}

/* Branch buttons */
.branch-btn {
  font-size: 0.875rem; /* text-sm */
  line-height: 1.25rem;
  padding: 6px 16px; /* py-1.5 px-4 */
  color: #cbd5e1; /* text-slate-300 */
  background: transparent;
  border-radius: 0.5rem; /* rounded-lg */
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  font-weight: 500;
  outline: none;
}
.branch-btn:hover:not(.active) {
  color: #ffffff;
}
.branch-btn.active {
  background: linear-gradient(to right, #06b6d4, #0ea5e9) !important; /* from-cyan-500 to-sky-500 */
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 10px rgba(6, 182, 212, 0.35) !important;
  border-radius: 0.5rem !important; /* rounded-lg */
}

/* Live status badge */
.status-badge {
  display: flex;
  align-items: center;
  gap: 6px; /* gap-1.5 */
  white-space: nowrap;
}

/* Utility classes for styling resilience */
.relative { position: relative; }
.absolute { position: absolute; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.flex-col { flex-direction: column; }
.gap-1 { gap: 0.25rem; }
.gap-1\.5 { gap: 0.375rem; }
.mt-1 { margin-top: 0.25rem; }
.h-2 { height: 0.5rem; }
.w-2 { width: 0.5rem; }
.h-2\.5 { height: 0.625rem; }
.w-2\.5 { width: 0.625rem; }
.h-full { height: 100%; }
.w-full { width: 100%; }
.rounded-md { border-radius: 0.375rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-xl { border-radius: 0.75rem; }
.rounded-2xl { border-radius: 1rem; }
.rounded-full { border-radius: 9999px; }
.p-0\.5 { padding: 0.125rem; }
.p-1 { padding: 0.25rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-\[11px\] { font-size: 11px; line-height: 14px; }
.text-\[10px\] { font-size: 10px; line-height: 13px; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.text-white { color: #ffffff; }
.text-slate-300 { color: #cbd5e1; }
.text-slate-400 { color: #94a3b8; }
.text-emerald-400 { color: #34d399; }
.bg-emerald-400 { background-color: #34d399; }
.bg-emerald-500 { background-color: #10b981; }
.bg-amber-500 { background-color: #f59e0b; }
.text-amber-400 { color: #fbbf24; }
.opacity-75 { opacity: 0.75; }
.shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }
.shadow-md { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1); }
.border-slate-700\/50 { border: 1px solid rgba(51, 65, 85, 0.5); }
.border-emerald-500\/25 { border: 1px solid rgba(16, 185, 129, 0.25); }
.border-emerald-500\/35 { border: 1px solid rgba(16, 185, 129, 0.35); }
.border-sky-500\/30 { border: 1px solid rgba(56, 189, 248, 0.3); }
.border-sky-900\/60 { border: 1px solid rgba(12, 74, 110, 0.6); }
.bg-\[\#041214\] { background-color: #041214; }
.bg-\[\#0b1e22\] { background-color: #0b1e22; }
.bg-\[\#03151e\] { background-color: #03151e; }
.bg-\[\#03151e\]\/90 { background-color: rgba(3, 21, 30, 0.9); }
.bg-\[\#061e2b\] { background-color: #061e2b; }

/* Ping radar animation */
@keyframes ping {
  75%, 100% {
    transform: scale(2.2);
    opacity: 0;
  }
}
.animate-ping {
  animation: ping 1.2s cubic-bezier(0, 0, 0.2, 1) infinite;
}

/* Mobile menu */
.nav-hamburger {
  display:none; background:none; border:none; padding:6px;
  flex-direction:column; gap:5px; cursor:pointer;
}
.nav-hamburger span {
  display:block; width:22px; height:2px; background:var(--white);
  border-radius:2px; transition:var(--transition);
}
.mobile-overlay {
  display:none; position:fixed; inset:0; background:rgba(6,24,26,.95);
  backdrop-filter:blur(20px); z-index:999; flex-direction:column;
  align-items:center; justify-content:center; gap:20px;
}
.mobile-overlay.open { display:flex; }
.mobile-overlay a {
  font-size:1.3rem; color:var(--white); font-weight:600; padding:10px 20px;
}
.mobile-close {
  position:absolute; top:20px; right:24px; background:none; border:none;
  color:var(--white); font-size:2rem; cursor:pointer;
}

/* ---------- HERO SECTION ---------- */
.hero {
  min-height:100vh; display:flex; align-items:center; padding:130px 0 40px;
  position:relative; z-index:2;
}
.hero-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;
}
.hero-badge {
  display:inline-flex; align-items:center; gap:6px;
  background: linear-gradient(135deg, var(--emerald-glow), rgba(56,189,248,.12));
  color:var(--emerald); font-size:.78rem; font-weight:600;
  padding:8px 18px; border-radius:var(--radius-full);
  margin-bottom:20px; border:1px solid rgba(16,185,129,.15);
}
.hero h1 {
  font-family:var(--font-heading); font-size:clamp(2rem,4.5vw,3.4rem);
  color:var(--white); font-weight:700; line-height:1.15; margin-bottom:20px;
}
.hero h1 span { color:var(--emerald); }
.hero-sub {
  font-size:1.08rem; color:var(--muted); line-height:1.8; margin-bottom:32px; max-width:540px;
}
.hero-ctas { display:flex; gap:14px; flex-wrap:wrap; }

/* Buttons */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 28px; border-radius:var(--radius); font-size:.92rem; font-weight:600;
  transition:var(--transition); white-space:nowrap;
}
.btn-primary {
  background:linear-gradient(135deg,var(--emerald),var(--emerald-dim));
  color:var(--white); box-shadow:0 4px 20px rgba(16,185,129,.3);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(16,185,129,.4); }
.btn-glass {
  background:rgba(255,255,255,.04); color:var(--white);
  border:1px solid var(--glass-border); backdrop-filter:blur(10px);
}
.btn-glass:hover { background:rgba(255,255,255,.08); border-color:var(--emerald); }
.btn-sm { padding:10px 20px; font-size:.82rem; border-radius:var(--radius-sm); }
.btn-xs { padding:7px 14px; font-size:.75rem; border-radius:var(--radius-xs); }

/* Hero marquee */
.hero-marquee {
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  height:520px; overflow:hidden; border-radius:var(--radius);
  mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 92%, transparent 100%);
}
.marquee-col {
  display:flex; flex-direction:column; gap:14px;
  animation-timing-function:linear; animation-iteration-count:infinite;
}
.marquee-col-1 { animation:marquee-up 25s linear infinite; }
.marquee-col-2 { animation:marquee-down 28s linear infinite; }
@keyframes marquee-up {
  0% { transform:translateY(0); }
  100% { transform:translateY(-50%); }
}
@keyframes marquee-down {
  0% { transform:translateY(-50%); }
  100% { transform:translateY(0); }
}
.marquee-card {
  border-radius:var(--radius); overflow:hidden; flex-shrink:0;
  border:1px solid var(--border);
}
.marquee-card img {
  width:100%; height:220px; object-fit:cover;
  transition:var(--transition);
}
.marquee-card:hover img { transform:scale(1.05); }

/* Specialty ticker */
.ticker-wrap {
  margin-top:50px; overflow:hidden; position:relative;
  mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%);
  padding:14px 0;
}
.ticker {
  display:flex; gap:12px; width:max-content;
  animation:ticker-scroll 60s linear infinite;
}
@keyframes ticker-scroll {
  0% { transform:translateX(0); }
  100% { transform:translateX(-50%); }
}
.ticker-pill {
  flex-shrink:0; display:inline-flex; align-items:center; gap:6px;
  background:var(--bg-card); border:1px solid var(--border);
  padding:8px 18px; border-radius:var(--radius-full);
  font-size:.78rem; font-weight:500; color:var(--muted); white-space:nowrap;
  transition:var(--transition);
}
.ticker-pill:hover { border-color:var(--emerald); color:var(--emerald); }
.ticker-pill .check { color:var(--emerald); font-weight:700; }

/* ---------- DEPARTMENTS / CENTERS OF EXCELLENCE ---------- */
.dept-tabs {
  display:flex; flex-wrap:wrap; gap:8px; margin-bottom:40px; justify-content:center;
}
.dept-tab {
  padding:10px 22px; border-radius:var(--radius-full);
  font-size:.82rem; font-weight:600; color:var(--muted);
  background:rgba(255,255,255,.04); border:1px solid var(--border);
  transition:var(--transition); cursor:pointer;
}
.dept-tab:hover { border-color:var(--emerald); color:var(--white); }
.dept-tab.active {
  background:var(--emerald); color:var(--white); border-color:var(--emerald);
}
.dept-panel { display:none; animation:fadeUp .4s ease; }
.dept-panel.active { display:block; }
@keyframes fadeUp {
  from { opacity:0; transform:translateY(16px); }
  to { opacity:1; transform:translateY(0); }
}
.dept-grid {
  display:grid; grid-template-columns:340px 1fr; gap:30px; align-items:start;
}
.dept-image {
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--border);
  position:sticky; top:110px;
}
.dept-image img { width:100%; height:360px; object-fit:cover; }
.dept-cards { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.dept-card {
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius);
  padding:24px; transition:var(--transition);
}
.dept-card:hover { border-color:var(--emerald); transform:translateY(-3px); box-shadow:var(--shadow); }
.dept-card-icon {
  width:44px; height:44px; border-radius:12px;
  background:var(--emerald-glow); display:flex; align-items:center; justify-content:center;
  margin-bottom:14px; font-size:1.3rem;
}
.dept-card h4 { color:var(--white); font-size:.95rem; font-weight:700; margin-bottom:6px; }
.dept-card p { font-size:.82rem; color:var(--muted); line-height:1.6; margin-bottom:14px; }
.dept-card .btn-xs { width:100%; justify-content:center; }

/* ---------- INFRASTRUCTURE ---------- */
.infra-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.infra-card {
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius);
  padding:32px 24px; text-align:center; transition:var(--transition);
}
.infra-card:hover { border-color:var(--emerald); transform:translateY(-4px); box-shadow:var(--shadow); }
.infra-icon {
  width:64px; height:64px; border-radius:16px; margin:0 auto 20px;
  background:var(--emerald-glow); display:flex; align-items:center; justify-content:center;
  font-size:1.8rem;
}
.infra-card h4 { color:var(--white); font-size:1rem; font-weight:700; margin-bottom:8px; }
.infra-card p { font-size:.84rem; color:var(--muted); line-height:1.6; }

/* ---------- TRIAGE CALCULATOR ---------- */
.triage-box {
  max-width:720px; margin:0 auto;
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius);
  padding:40px; box-shadow:var(--shadow);
}
.triage-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.triage-row.full { grid-template-columns:1fr; }
.triage-field label {
  display:block; font-size:.78rem; font-weight:600; color:var(--muted);
  margin-bottom:6px; text-transform:uppercase; letter-spacing:.05em;
}
.triage-field select {
  width:100%; padding:12px 16px; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.04); border:1px solid var(--border);
  color:var(--white); font-size:.88rem; font-family:var(--font-body);
  appearance:none; cursor:pointer; transition:var(--transition);
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2394a3b8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
}
.triage-field select:focus { outline:none; border-color:var(--emerald); }
.triage-field select option { background:var(--bg-card); color:var(--white); }
.triage-btn { margin-top:10px; }

/* ---------- SPECIALISTS ---------- */
.spec-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.spec-card {
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius);
  padding:32px; display:flex; gap:24px; align-items:flex-start; transition:var(--transition);
}
.spec-card:hover { border-color:var(--emerald); box-shadow:var(--shadow); }
.spec-avatar {
  width:130px; height:165px; border-radius:var(--radius); flex-shrink:0;
  overflow:hidden; border:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 24px rgba(0,0,0,.35); background:var(--bg-deep);
  position:relative; transition:var(--transition);
}
.spec-avatar img {
  width:100%; height:100%; object-fit:cover; object-position:center top;
  display:block; transition:transform .35s ease;
}
.spec-card:hover .spec-avatar {
  border-color:rgba(16,185,129,.35);
  box-shadow:0 12px 28px rgba(0,0,0,.45), 0 0 20px rgba(16,185,129,.12);
}
.spec-card:hover .spec-avatar img {
  transform:scale(1.03);
}
.spec-info h4 { color:var(--white); font-size:1.05rem; font-weight:700; margin-bottom:4px; }
.spec-title { color:var(--emerald); font-size:.8rem; font-weight:600; margin-bottom:8px; }
.spec-detail { font-size:.82rem; color:var(--muted); line-height:1.6; margin-bottom:12px; }
.spec-badges { display:flex; flex-wrap:wrap; gap:6px; }
.spec-badge-item {
  font-size:.7rem; font-weight:600; padding:4px 10px; border-radius:var(--radius-full);
  background:rgba(255,255,255,.04); border:1px solid var(--border); color:var(--muted);
}

/* ---------- FACILITY GALLERY ---------- */
.gallery-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
.gallery-item {
  border-radius:var(--radius); overflow:hidden; cursor:pointer;
  border:1px solid var(--border); position:relative;
  transition:var(--transition);
}
.gallery-item:hover { border-color:var(--emerald); transform:translateY(-3px); box-shadow:var(--shadow); }
.gallery-item img { width:100%; height:240px; object-fit:cover; transition:var(--transition); }
.gallery-item:hover img { transform:scale(1.05); }
.gallery-overlay {
  position:absolute; inset:0; background:linear-gradient(to top, rgba(6,24,26,.8) 0%, transparent 50%);
  display:flex; align-items:flex-end; padding:16px; opacity:0; transition:var(--transition);
}
.gallery-item:hover .gallery-overlay { opacity:1; }
.gallery-caption { color:var(--white); font-size:.82rem; font-weight:600; }

/* Lightbox */
.lightbox {
  display:none; position:fixed; inset:0; z-index:2000;
  background:rgba(6,24,26,.95); backdrop-filter:blur(20px);
  align-items:center; justify-content:center; padding:40px;
}
.lightbox.open { display:flex; }
.lightbox img {
  max-width:90vw; max-height:85vh; border-radius:var(--radius);
  box-shadow:var(--shadow-lg);
}
.lightbox-close {
  position:absolute; top:24px; right:32px; background:none; border:none;
  color:var(--white); font-size:2.2rem; cursor:pointer; opacity:.7;
  transition:var(--transition);
}
.lightbox-close:hover { opacity:1; }
.lightbox-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,.08); border:1px solid var(--glass-border);
  color:var(--white); width:48px; height:48px; border-radius:50%;
  font-size:1.4rem; display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:var(--transition); backdrop-filter:blur(10px);
}
.lightbox-nav:hover { background:var(--emerald); border-color:var(--emerald); }
.lightbox-prev { left:24px; }
.lightbox-next { right:24px; }

/* ---------- FAQ ---------- */
.faq-list { max-width:780px; margin:0 auto; }
.faq-item {
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius);
  margin-bottom:12px; overflow:hidden; transition:var(--transition);
}
.faq-item:hover { border-color:rgba(255,255,255,.1); }
.faq-q {
  width:100%; padding:20px 24px; display:flex; justify-content:space-between;
  align-items:center; background:none; border:none; color:var(--white);
  font-size:.95rem; font-weight:600; font-family:var(--font-body);
  text-align:left; cursor:pointer; transition:var(--transition);
}
.faq-q:hover { color:var(--emerald); }
.faq-q .faq-icon {
  font-size:1.2rem; transition:var(--transition); flex-shrink:0; margin-left:16px;
}
.faq-item.open .faq-icon { transform:rotate(45deg); color:var(--emerald); }
.faq-a {
  max-height:0; overflow:hidden; transition:max-height .35s ease, padding .35s ease;
  padding:0 24px;
}
.faq-item.open .faq-a {
  max-height:300px; padding:0 24px 20px;
}
.faq-a p { font-size:.88rem; color:var(--muted); line-height:1.7; }

/* ---------- MAP & LOCATION ---------- */
.map-section { display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start; }
.map-info { padding:20px 0; }
.map-address-label {
  font-size:.72rem; font-weight:700; color:var(--emerald);
  text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px;
}
.map-address {
  color:var(--white); font-size:1.05rem; font-weight:600; line-height:1.6; margin-bottom:20px;
}
.map-btns { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.map-timing { font-size:.85rem; color:var(--muted); line-height:1.8; }
.map-timing strong { color:var(--white); }
.map-embed {
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--border);
  height:400px;
}
.map-embed iframe { width:100%; height:100%; border:0; }

/* ---------- FOOTER ---------- */
.footer {
  background:var(--bg-card); border-top:1px solid var(--border);
  padding:50px 0 30px; position:relative; z-index:2;
}
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:30px; margin-bottom:30px; }
.footer-brand h3 { color:var(--white); font-size:1.2rem; font-weight:800; margin-bottom:6px; }
.footer-brand p { font-size:.84rem; color:var(--muted); margin-bottom:16px; max-width:300px; }
.footer-col h4 { color:var(--white); font-size:.85rem; font-weight:700; margin-bottom:12px; text-transform:uppercase; letter-spacing:.05em; }
.footer-col a { display:block; font-size:.84rem; color:var(--muted); padding:3px 0; transition:var(--transition); }
.footer-col a:hover { color:var(--emerald); }
.footer-bottom {
  border-top:1px solid var(--border); padding-top:20px;
  display:flex; justify-content:space-between; align-items:center;
  font-size:.78rem; color:var(--muted-dim);
}

/* ---------- FLOATING ACTION HUB ---------- */
.fab-container { position:fixed; bottom:24px; right:24px; z-index:1500; }
.fab-main {
  width:60px; height:60px; border-radius:50%;
  background:linear-gradient(135deg,var(--emerald),var(--emerald-dim));
  color:var(--white); display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; box-shadow:0 6px 24px rgba(16,185,129,.35);
  transition:var(--transition); position:relative; z-index:10;
}
.fab-main:hover { transform:scale(1.08); box-shadow:0 8px 30px rgba(16,185,129,.5); }
.fab-main.open { border-radius:16px; }
.fab-label {
  position:absolute; bottom:68px; right:0; white-space:nowrap;
  background:var(--bg-card); color:var(--white); font-size:.72rem; font-weight:600;
  padding:6px 14px; border-radius:var(--radius-sm); box-shadow:var(--shadow);
  border:1px solid var(--border); pointer-events:none;
  opacity:1; transition:var(--transition);
}
.fab-container.open .fab-label { opacity:0; }

.fab-menu {
  position:absolute; bottom:70px; right:0;
  background:var(--glass); backdrop-filter:blur(22px);
  border:1px solid var(--glass-border); border-radius:var(--radius);
  padding:10px; width:260px; box-shadow:var(--shadow-lg);
  display:none; animation:fadeUp .25s ease;
}
.fab-container.open .fab-menu { display:block; }
.fab-menu-item {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:var(--radius-sm);
  font-size:.82rem; font-weight:500; color:var(--muted);
  transition:var(--transition); width:100%; background:none; border:none;
  text-align:left; font-family:var(--font-body); cursor:pointer;
}
.fab-menu-item:hover { background:rgba(255,255,255,.06); color:var(--white); }
.fab-menu-item .fab-item-icon {
  width:32px; height:32px; border-radius:8px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem;
}
.fab-menu-item:nth-child(1) .fab-item-icon { background:rgba(16,185,129,.15); color:var(--emerald); }
.fab-menu-item:nth-child(2) .fab-item-icon { background:rgba(37,211,102,.15); color:#25d366; }
.fab-menu-item:nth-child(3) .fab-item-icon { background:rgba(56,189,248,.15); color:var(--sky); }
.fab-menu-item:nth-child(4) .fab-item-icon { background:rgba(251,191,36,.15); color:#fbbf24; }
.fab-menu-item:nth-child(5) .fab-item-icon { background:rgba(167,139,250,.15); color:#a78bfa; }

/* ---------- CHATBOT DRAWER ---------- */
.chatbot-drawer {
  position:fixed; bottom:24px; right:24px; z-index:1600;
  width:380px; max-height:580px; border-radius:var(--radius);
  background:var(--bg-card); border:1px solid var(--border);
  box-shadow:var(--shadow-lg); display:none; flex-direction:column;
  overflow:hidden;
}
.chatbot-drawer.open { display:flex; }
.chatbot-header {
  padding:16px 20px; background:linear-gradient(135deg,var(--emerald),var(--emerald-dim));
  display:flex; justify-content:space-between; align-items:center;
}
.chatbot-header h4 { color:var(--white); font-size:.95rem; font-weight:700; }
.chatbot-close { background:none; border:none; color:rgba(255,255,255,.7); font-size:1.4rem; cursor:pointer; }
.chatbot-close:hover { color:var(--white); }
.chatbot-body {
  flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px;
  max-height:380px;
}
.chat-msg {
  max-width:88%; padding:12px 16px; border-radius:14px; font-size:.82rem; line-height:1.6;
  animation:fadeUp .3s ease;
}
.chat-msg.bot {
  background:rgba(255,255,255,.05); color:var(--muted);
  align-self:flex-start; border-bottom-left-radius:4px;
}
.chat-msg.user {
  background:var(--emerald); color:var(--white);
  align-self:flex-end; border-bottom-right-radius:4px;
}
.chat-chips {
  display:flex; flex-wrap:wrap; gap:6px; padding:4px 0;
}
.chat-chip {
  font-size:.72rem; font-weight:500; padding:7px 12px;
  border-radius:var(--radius-full); background:rgba(255,255,255,.05);
  border:1px solid var(--border); color:var(--muted);
  cursor:pointer; transition:var(--transition); text-align:left;
}
.chat-chip:hover { border-color:var(--emerald); color:var(--emerald); }
.chat-wa-btn {
  display:inline-flex; align-items:center; gap:6px; margin-top:8px;
  padding:8px 14px; border-radius:var(--radius-sm);
  background:#25d366; color:var(--white); font-size:.78rem; font-weight:600;
  transition:var(--transition); border:none; cursor:pointer;
}
.chat-wa-btn:hover { background:#1da851; }
.chatbot-input {
  padding:12px 16px; border-top:1px solid var(--border);
  display:flex; gap:8px;
}
.chatbot-input input {
  flex:1; padding:10px 14px; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.04); border:1px solid var(--border);
  color:var(--white); font-size:.84rem; font-family:var(--font-body);
}
.chatbot-input input:focus { outline:none; border-color:var(--emerald); }
.chatbot-input button {
  padding:10px 16px; border-radius:var(--radius-sm);
  background:var(--emerald); color:var(--white); font-size:.84rem; font-weight:600;
  transition:var(--transition); border:none;
}
.chatbot-input button:hover { background:var(--emerald-dim); }

/* ---------- SCROLL ANIMATIONS ---------- */
.reveal {
  opacity:0; transform:translateY(30px);
  transition: opacity .6s ease, transform .6s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }

/* ---------- RESPONSIVE ---------- */
@media (max-width:1280px) {
  .nav-links a { font-size:.78rem; padding:5px 7px; }
  .nav-brand { margin-right:12px; }
}

@media (max-width:1140px) {
  .nav-links { display:none; }
  .nav-hamburger { display:flex; }
  .nav-brand { margin-right:auto; }
}

@media (max-width:1100px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-marquee { display:none; }
  .dept-grid { grid-template-columns:1fr; }
  .dept-image { position:static; }
  .dept-image img { height:240px; }
  .infra-grid { grid-template-columns:1fr 1fr; }
  .spec-grid { grid-template-columns:1fr; }
  .map-section { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:768px) {
  .navbar { padding:10px 14px; top:8px; width:calc(100% - 20px); }
  .nav-links, .nav-right { display:none; }
  .nav-hamburger { display:flex; }
  .nav-brand { gap:10px; margin-right:auto; }
  .nav-brand-icon { width:38px; height:38px; }
  .nav-brand-icon svg { width:22px; height:22px; }
  .nav-brand-name { font-size:1.35rem; gap:8px; flex-wrap:wrap; }
  .nav-brand-badge { font-size:.72rem; padding:2px 8px; }
  .nav-brand-sub { font-size:.72rem; }
  .hero { padding:110px 0 30px; min-height:auto; }
  .hero h1 { font-size:1.8rem; }
  .hero-ctas { flex-direction:column; }
  .dept-tabs { justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom:8px; }
  .dept-cards { grid-template-columns:1fr; }
  .infra-grid { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:1fr 1fr; }
  .triage-row { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:8px; text-align:center; }
  .chatbot-drawer { width:calc(100vw - 20px); right:10px; bottom:10px; max-height:70vh; }
  .section-pad { padding:60px 0; }
}

@media (max-width:480px) {
  .gallery-grid { grid-template-columns:1fr; }
  .hero h1 { font-size:1.5rem; }
  .triage-box { padding:24px 18px; }
  .spec-card { flex-direction:column; text-align:center; align-items:center; }
  .spec-badges { justify-content:center; }
}

/* ---------- SCROLLBAR ---------- */
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:var(--bg-deep); }
::-webkit-scrollbar-thumb { background:var(--muted-dim); border-radius:10px; }
::-webkit-scrollbar-thumb:hover { background:var(--muted); }

/* ---------- PATIENT STORIES ---------- */
.stories-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.story-card {
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius);
  padding:28px; transition:var(--transition);
}
.story-card:hover { border-color:var(--emerald); transform:translateY(-3px); box-shadow:var(--shadow); }
.story-stars { color:#fbbf24; font-size:.9rem; margin-bottom:10px; letter-spacing:2px; }
.story-text { font-size:.88rem; color:var(--muted); line-height:1.7; margin-bottom:14px; font-style:italic; }
.story-author { color:var(--white); font-size:.85rem; font-weight:600; }
.story-dept { color:var(--emerald); font-size:.72rem; font-weight:500; }

@media (max-width:768px) {
  .stories-grid { grid-template-columns:1fr; }
}