html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; color: #1e293b; background: #fff; -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4 { font-family: 'Plus Jakarta Sans', Inter, sans-serif; }

.btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  background: #0e7490; color: #fff; font-weight: 600;
  padding: 0.75rem 1.5rem; border-radius: 9999px;
  transition: background 0.2s; box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.btn-primary:hover { background: #0c6580; }

.btn-accent {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  background: #f26522; color: #fff; font-weight: 600;
  padding: 0.75rem 1.5rem; border-radius: 9999px;
  transition: background 0.2s;
}
.btn-accent:hover { background: #d14e15; }

.btn-outline {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  background: #fff; border: 1px solid #e2e8f0; color: #1e293b; font-weight: 600;
  padding: 0.75rem 1.5rem; border-radius: 9999px; transition: background 0.2s;
}
.btn-outline:hover { background: #f8fafc; }

.btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  color: rgba(255,255,255,0.9); font-weight: 500;
  padding: 0.5rem 1rem; border-radius: 9999px; transition: all 0.2s;
}
.btn-ghost:hover { color: #fff; background: rgba(255,255,255,0.1); }

.card { background: #fff; border-radius: 1rem; border: 1px solid #f1f5f9; box-shadow: 0 1px 3px rgba(0,0,0,0.05); overflow: hidden; }

.hero-overlay {
  background: linear-gradient(180deg, rgba(11,30,46,0.55) 0%, rgba(11,30,46,0.65) 55%, rgba(11,30,46,0.78) 100%);
}

.gallery-thumb.active { outline: 2px solid #0e7490; outline-offset: 2px; }

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