/* Custom CSS (Tailwind is via CDN) */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; font-family: 'Inter', sans-serif; }

.bg-cool-blue { background-color: #f0f8ff; }
.bg-dark-blue { background-color: #0c4a6e; }
.text-light-blue { color: #dbeafe; }

.cta-btn {
  padding: 0.75rem 2rem;
  border-radius: 9999px;
  color: #fff;
  font-weight: 600;
  transition: all 0.3s ease;
  background-color: #2563eb;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.cta-btn:hover { background-color: #1e40af; transform: translateY(-2px); box-shadow: 0 6px 8px rgba(0,0,0,0.15); }

.hero-bg-1 { background-image: linear-gradient(to right, rgba(255,255,255,0.95), rgba(255,255,255,0.85)), url('../images/hero-1.jpg'); background-size: cover; background-position: center; }
.hero-bg-2 { background-image: linear-gradient(to right, rgba(255,255,255,0.95), rgba(255,255,255,0.85)), url('../images/hero-2.jpg'); background-size: cover; background-position: center; }
.hero-bg-3 { background-image: linear-gradient(to right, rgba(255,255,255,0.95), rgba(255,255,255,0.85)), url('../images/hero-3.jpg'); background-size: cover; background-position: center; }

.slider-dot { width: 10px; height: 10px; background-color: #93c5fd; border-radius: 9999px; cursor: pointer; transition: background-color .3s; }
.slider-dot.active { background-color: #1e40af; }

.animate-fadeIn { animation: fadeIn 1s ease-in-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(20px);} to { opacity: 1; transform: translateY(0);} }

#specialty-detail-view { display: none; }


/* Cleaner banner */
.hero-banner {
  background-image: linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0.75)), url('../images/hero-banner.jpg');
  background-size: cover; background-position: center;
}
.section {
  padding-top: 5rem; padding-bottom: 5rem;
}
.section-title { font-weight: 800; color: #0f172a; } /* slate-900 */
.section-sub { color: #475569; } /* slate-600 */
.wave-bottom { position: relative; }
.wave-bottom:after {
  content: ""; position: absolute; left:0; right:0; bottom:-1px; height:60px;
  background: radial-gradient(120% 100% at 50% 100%, rgba(12,74,110,0.15), rgba(255,255,255,0) 70%);
}
.card {
  background:white; border-radius:1rem; box-shadow:0 8px 20px rgba(2,6,23,0.06); padding:1.25rem;
}
a.blog-link:hover { text-decoration: underline; }


/* Multi-slide hero */
.hero-slide-1 { background-image: linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0.75)), url('../images/hero-slide-1.jpg'); background-size: cover; background-position: center; }
.hero-slide-2 { background-image: linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0.75)), url('../images/hero-slide-2.jpg'); background-size: cover; background-position: center; }
.hero-slide-3 { background-image: linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0.75)), url('../images/hero-slide-3.jpg'); background-size: cover; background-position: center; }

.hero-dots { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); display:flex; gap:8px; }
.hero-dot { width: 10px; height: 10px; background:#93c5fd; border-radius:999px; cursor:pointer; transition:background .3s; }
.hero-dot.active { background:#1e40af; }

/* Footer social row (monochrome) */
.footer-social { display:flex; gap:10px; align-items:center; }
.footer-icon { width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:#0b2950; }
.footer-icon svg { width:18px; height:18px; fill:#dbeafe; }
.footer-social a:hover .footer-icon { background:#1e3a8a; }