/* custom.css — Additional site styles loaded after Tailwind.
 * Most styling lives in tailwind.css (compiled from src/app/globals.css).
 * Add project-specific overrides here.
 */

/* Ensure body uses Geist Sans even before Tailwind hydrates. */
body {
  font-family: var(--font-geist-sans, 'Geist', ui-sans-serif, system-ui, -apple-system, sans-serif);
}

/* Ensure the navigation links stay clickable above the hero video. */
nav#site-nav { z-index: 50; }

/* Honor reduced motion preference globally. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Make sure SVG icons render with the right line-height. */
svg { display: inline-block; vertical-align: middle; }

/* Brand color utility classes (some Tailwind v4 builds don't include all variants). */
.text-bright-blue { color: #1E6BFF; }
.bg-bright-blue   { background-color: #1E6BFF; }
.border-bright-blue { border-color: #1E6BFF; }
.text-deep-royal  { color: #0A3D91; }
.bg-deep-royal    { background-color: #0A3D91; }
.text-accent-red  { color: #E10600; }
.bg-accent-red    { background-color: #E10600; }
.from-bright-blue { --tw-gradient-from: #1E6BFF var(--tw-gradient-from-position); --tw-gradient-to: rgba(30,107,255,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-deep-royal    { --tw-gradient-to: #0A3D91 var(--tw-gradient-to-position); }
.to-accent-red    { --tw-gradient-to: #E10600 var(--tw-gradient-to-position); }
.from-accent-red  { --tw-gradient-from: #E10600 var(--tw-gradient-from-position); --tw-gradient-to: rgba(225,6,0,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }

/* Make sure fill-* utility classes work for star ratings. */
.fill-yellow-400 { fill: #facc15; }

/* Tiny utility used by service modal section divider. */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
