/* App-specific styles — most layout uses Tailwind utilities, this adds polish. */

/* Custom gradient used in hero */
.bg-gradient-radial {
  background: radial-gradient(ellipse at center, var(--tw-gradient-stops));
}

/* Smoother line-clamp on small screens */
.line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* iOS-style "spring" easing for micro-interactions */
button, a, [role="button"] {
  -webkit-tap-highlight-color: transparent;
}

/* Hide scrollbar for nav, but keep scrollable */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Subtle focus ring that matches brand */
*:focus-visible {
  outline: 2px solid rgba(124, 58, 237, 0.4);
  outline-offset: 2px;
  border-radius: 6px;
}

/* Form inputs: iOS-style rounded */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="number"], input[type="search"], select, textarea {
  -webkit-appearance: none;
  appearance: none;
  background-color: white;
  border: 1px solid rgb(226, 232, 240);
  border-radius: 12px;
  padding: 0.625rem 0.875rem;
  font-size: 0.875rem;
  width: 100%;
  transition: border-color 0.15s, box-shadow 0.15s;
}
input:focus, select:focus, textarea:focus {
  border-color: rgb(124, 58, 237);
  box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.1);
  outline: none;
}

/* Print cleanup (optional) */
@media print {
  nav, footer { display: none !important; }
}