
/* ==========================================================
   KIBWEZI CATHOLIC HEALTH CENTRE — MODERN UI ENHANCEMENT
   Premium healthcare UI layer; works alongside existing CSS.
   ========================================================== */
:root{
  --kc-primary:#0b6b69;
  --kc-primary-dark:#07514f;
  --kc-primary-soft:#e8f6f5;
  --kc-gold:#c58a2a;
  --kc-ink:#12212b;
  --kc-muted:#64748b;
  --kc-surface:#ffffff;
  --kc-bg:#f5f8fa;
  --kc-border:#e5edf0;
  --kc-shadow:0 14px 45px rgba(15,40,50,.10);
  --kc-shadow-lg:0 24px 70px rgba(15,40,50,.16);
  --kc-radius:18px;
}
html{scroll-behavior:smooth}
body{background:var(--kc-bg);color:var(--kc-ink)}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:
    radial-gradient(circle at 10% 10%,rgba(11,107,105,.055),transparent 28%),
    radial-gradient(circle at 90% 30%,rgba(197,138,42,.045),transparent 24%);
}
.header{transition:box-shadow .25s ease,background .25s ease,transform .25s ease}
.scrolled .header{box-shadow:0 10px 35px rgba(8,30,40,.12)}
.branding{min-height:82px}
.logo-img{filter:drop-shadow(0 4px 8px rgba(0,0,0,.08))}
.sitename{letter-spacing:-.025em}
.navmenu>ul>li>a{position:relative}
.navmenu>ul>li>a:after{
  content:"";position:absolute;left:1rem;right:1rem;bottom:.38rem;height:2px;
  background:var(--kc-primary);transform:scaleX(0);transform-origin:center;
  transition:transform .2s ease;border-radius:4px
}
.navmenu>ul>li>a:hover:after,.navmenu>ul>li>a.active:after{transform:scaleX(1)}
.navmenu .btn-donate-nav{background:linear-gradient(135deg,var(--kc-primary),#0e8c88)!important;color:#fff!important;border-radius:999px!important;padding:.65rem 1rem!important;box-shadow:0 8px 20px rgba(11,107,105,.20)}
.navmenu .btn-donate-nav:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(11,107,105,.28)}
.quick-search-btn{
  border:1px solid var(--kc-border);background:#fff;border-radius:12px;
  padding:.55rem .8rem;gap:.5rem;box-shadow:0 5px 18px rgba(20,50,60,.06)
}
.quick-search-btn:hover{border-color:#b9d7d5;transform:translateY(-1px)}
.quick-search-btn kbd{font-size:.68rem;background:#f4f7f8;border:1px solid #dde7ea;border-radius:6px;padding:2px 5px;color:#64748b}

.emergency-topbar{
  background:linear-gradient(100deg,#a71919,#c42d27 55%,#a71919);
  box-shadow:0 3px 12px rgba(120,20,20,.16)
}
.btn-quick-appointment{box-shadow:0 4px 12px rgba(0,0,0,.10)}

.hero{overflow:hidden}
.hero .hero-bg-image{
  transform:scale(1.015);transition:transform 8s ease;
  filter:saturate(.9) contrast(1.02)
}
body.loaded .hero .hero-bg-image{transform:scale(1.05)}
.hero-overlay{background:linear-gradient(90deg,rgba(4,32,37,.82) 0%,rgba(4,32,37,.63) 48%,rgba(4,32,37,.25) 100%)!important}
.hero-content{max-width:850px}
.hero h1{letter-spacing:-.045em;text-wrap:balance}
.hero-description{max-width:720px}
.trust-badges .badge-item{
  backdrop-filter:blur(12px);background:rgba(255,255,255,.11)!important;
  border:1px solid rgba(255,255,255,.18);box-shadow:0 8px 25px rgba(0,0,0,.08)
}
.hero-actions .btn{border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.12)}
.hero-actions .btn:hover{transform:translateY(-2px)}

.section{scroll-margin-top:120px}
.section-title h2{letter-spacing:-.03em}
.section-title p{max-width:760px}

.service-card,.department-card,.doctor-card,.testimonial-card,.health-tip-card,.about-card{
  border:1px solid var(--kc-border)!important;
  border-radius:var(--kc-radius)!important;
  box-shadow:0 7px 28px rgba(20,50,60,.06)!important;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease
}
.service-card:hover,.department-card:hover,.doctor-card:hover,.testimonial-card:hover,.health-tip-card:hover,.about-card:hover{
  transform:translateY(-6px);box-shadow:var(--kc-shadow)!important;border-color:#cfe2e1!important
}
.card,.modal-content{border-radius:var(--kc-radius);border:1px solid var(--kc-border);box-shadow:var(--kc-shadow)}
.btn{transition:all .2s ease}
.btn-primary{background:linear-gradient(135deg,var(--kc-primary),#0e8c88);border:0}
.btn-primary:hover{background:linear-gradient(135deg,var(--kc-primary-dark),var(--kc-primary));transform:translateY(-1px)}

#kc-patient-tools{
  padding:28px 0;background:#fff;border-top:1px solid var(--kc-border);border-bottom:1px solid var(--kc-border)
}
.kc-tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kc-tool{
  display:flex;align-items:center;gap:14px;padding:17px 18px;background:#fff;
  border:1px solid var(--kc-border);border-radius:15px;color:var(--kc-ink);
  box-shadow:0 6px 20px rgba(20,50,60,.045);transition:.2s ease
}
.kc-tool:hover{transform:translateY(-3px);border-color:#b9d7d5;box-shadow:0 12px 28px rgba(20,50,60,.09);color:var(--kc-primary)}
.kc-tool-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;background:var(--kc-primary-soft);color:var(--kc-primary);font-size:1.15rem;flex:0 0 auto}
.kc-tool strong{display:block;font-size:.94rem}.kc-tool small{color:var(--kc-muted)}

.kc-section-panel{
  position:relative;overflow:hidden;background:linear-gradient(135deg,#083f3d,#0b6b69);
  color:#fff;border-radius:24px;padding:38px;box-shadow:var(--kc-shadow-lg)
}
.kc-section-panel:after{
  content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-100px;top:-120px;
  background:rgba(255,255,255,.08)
}
.kc-section-panel h2,.kc-section-panel h3{color:#fff}
.kc-section-panel p{color:rgba(255,255,255,.82)}
.kc-stat{padding:15px 18px;border-left:1px solid rgba(255,255,255,.18)}
.kc-stat strong{display:block;font-size:1.55rem}.kc-stat span{font-size:.8rem;color:rgba(255,255,255,.7)}

.kc-breadcrumb{
  background:#fff;border-bottom:1px solid var(--kc-border);padding:18px 0;margin-top:124px
}
.kc-breadcrumb .container{display:flex;align-items:center;justify-content:space-between;gap:20px}
.kc-breadcrumb h1{font-size:1.65rem;margin:0;letter-spacing:-.03em}
.kc-crumbs{font-size:.86rem;color:var(--kc-muted)}.kc-crumbs a{color:var(--kc-primary)}

.kc-page-hero{
  background:linear-gradient(135deg,#083f3d,#0b6b69);color:#fff;padding:58px 0;position:relative;overflow:hidden
}
.kc-page-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.13),transparent 30%)}
.kc-page-hero h1{color:#fff;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.04em}
.kc-page-hero p{max-width:750px;color:rgba(255,255,255,.82);font-size:1.05rem}

.kc-content-card{background:#fff;border:1px solid var(--kc-border);border-radius:20px;padding:28px;box-shadow:0 8px 30px rgba(20,50,60,.06)}
.kc-icon-box{width:52px;height:52px;border-radius:14px;background:var(--kc-primary-soft);color:var(--kc-primary);display:grid;place-items:center;font-size:1.35rem}
.kc-list{padding:0;margin:0;list-style:none}.kc-list li{display:flex;gap:10px;margin:.75rem 0}.kc-list i{color:#059669;margin-top:4px}
.kc-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid var(--kc-border);border-radius:14px}
.kc-table th{background:#f2f8f8;color:var(--kc-ink);font-weight:700}.kc-table th,.kc-table td{padding:13px 15px;border-bottom:1px solid var(--kc-border);text-align:left}.kc-table tr:last-child td{border-bottom:0}

.kc-fab-stack{position:fixed;right:20px;bottom:20px;z-index:1050;display:flex;flex-direction:column;gap:10px}
.kc-fab{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff!important;box-shadow:0 10px 25px rgba(0,0,0,.16);transition:.2s ease}
.kc-fab:hover{transform:translateY(-3px);color:#fff}.kc-fab.whatsapp{background:#20b95a}.kc-fab.appointment{background:var(--kc-primary)}

.kc-toast{
  position:fixed;right:20px;bottom:82px;z-index:1100;background:#12212b;color:#fff;
  padding:13px 17px;border-radius:12px;box-shadow:var(--kc-shadow-lg);opacity:0;transform:translateY(10px);pointer-events:none;transition:.25s ease
}
.kc-toast.show{opacity:1;transform:translateY(0)}
#kc-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--kc-gold),#13a6a0);z-index:2000}

.footer{background:#081b20!important}
.footer .footer-links a:hover{color:#67d5cf!important}

@media (max-width:1199px){
  .kc-tools-grid{grid-template-columns:repeat(2,1fr)}
  .quick-search-btn{display:none!important}
}
@media (max-width:767px){
  .emergency-topbar{padding:.45rem 0}.emergency-content{justify-content:center}
  .branding{min-height:72px}.logo-img{height:42px}.sitename{font-size:1.02rem}.tagline{font-size:.63rem}
  .hero .row{min-height:82vh!important}.hero h1{font-size:2.35rem}
  .kc-tools-grid{grid-template-columns:1fr}.kc-section-panel{padding:27px 22px;border-radius:18px}
  .kc-breadcrumb{margin-top:112px}.kc-breadcrumb .container{align-items:flex-start;flex-direction:column}
  .kc-page-hero{padding:42px 0}.kc-content-card{padding:21px}
  .kc-fab-stack{right:14px;bottom:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}
}
