/* Tiny overrides and focus visible styles */
:root {
  --focus-ring: 3px;
}

/* Ensure keyboard focus outlines are visible and match theme */
:focus {
  outline: none;
}

:focus-visible {
  box-shadow: 0 0 0 var(--focus-ring) rgba(99,102,241,0.25);
  border-radius: 0.375rem; /* match rounded-md */
}

/* Utility for visually-hidden text */
.sr-only {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* Smooth hover/interaction helpers for non-Tailwind environments */
.transition-smooth {
  transition: transform 200ms ease, box-shadow 200ms ease, background-color 150ms ease;
}

/* Better summary styling for mobile details element */
details summary {
  list-style: none;
}
details summary::-webkit-details-marker { display:none; }

/* Subtle animation for details content when opened (height cannot be transitioned easily) */
details[open] .details-content {
  animation: fadeIn 180ms ease-out;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Responsive tweak: ensure large headings don't overflow */
@media (min-width: 1024px) {
  h1 { word-break: keep-all; }
}

/* Hero background helper: ensure good coverage and a dark overlay fallback */
.hero-bg {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

/* Provide a subtle parallax effect on large screens (pure CSS, limited) */
@media (min-width: 1024px) {
  .hero-bg { background-attachment: fixed; }
}

/* Navbar link helpers */
.nav-link {
  padding: 0.45rem 0.75rem;
  border-radius: 0.375rem;
  transition: background-color 180ms ease, transform 180ms ease;
}
.nav-link:focus, .nav-link:hover {
  transform: translateY(-1px);
}
.nav-cta {
  padding: 0.45rem 0.9rem;
  border-radius: 0.5rem;
  box-shadow: 0 6px 18px rgba(79,70,229,0.08);
}

/* Message banner for form feedback */
.form-status {
  border-left: 4px solid #4F46E5; /* indigo */
  background: rgba(79,70,229,0.04);
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
}