/* ---------------------------------------------------------------------
   assets/css/style.css
   Small hand-written styles that complement the Tailwind CDN utility
   classes: custom scrollbars, a slower pulse for the emergency button,
   and a few micro-interactions that are awkward to express purely with
   utilities.
--------------------------------------------------------------------- */

html {
  scrollbar-gutter: stable;
}

/* Slimmer, brand-colored scrollbar */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #f2f9f3;
}
::-webkit-scrollbar-thumb {
  background: #98cfa6;
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #6cb680;
}

/* Gentle, slower pulse for the emergency button (Tailwind's default
   animate-pulse is too fast/subtle for a "call to attention" CTA). */
@keyframes pulse-slow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(230, 73, 63, 0.45); }
  50%      { box-shadow: 0 0 0 8px rgba(230, 73, 63, 0); }
}
.animate-pulse-slow {
  animation: pulse-slow 2.4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Navbar gains a soft shadow once the page is scrolled (toggled via JS) */
#site-navbar.is-scrolled {
  box-shadow: 0 4px 24px -8px rgba(39, 83, 54, 0.12);
}

/* Nice focus ring across the app, softer than the browser default */
a, button, input, textarea, select {
  outline-color: #4a9d61;
}

/* Utility: line-clamp fallback isn't needed (Tailwind CDN ships it),
   this is just for card excerpt text on older engines. */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}