/* Santmary School — Base Styles (production-ready, no build step) */

:root {
  --brand-600: #1e5ed7;
  --brand-500: #2b78ff;
}

html { overflow-x: hidden; }
body { overflow-x: hidden; }
img { max-width: 100%; height: auto; }

.font-sniglet { font-family: 'Sniglet', cursive; }

/* Subtle animations — lightweight, CSS only */
@keyframes floatIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; } to { opacity: 1; }
}
.animate-floatIn { animation: floatIn .45s cubic-bezier(.16,1,.3,1) both; }
.animate-fadeIn  { animation: fadeIn .3s ease both; }

/* Focus ring — accessibility */
*:focus-visible {
  outline: 2px solid var(--brand-500);
  outline-offset: 2px;
  border-radius: 4px;
}
.focus-ring:focus-visible {
  outline: 2px solid var(--brand-500);
  outline-offset: 2px;
}

/* Card hover lift */
.card-hover { transition: transform .2s ease, box-shadow .2s ease; }
.card-hover:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(15,23,42,.08); }

/* Scroll reveal */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s cubic-bezier(.16,1,.3,1); }
.reveal.in-view { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto !important; }
}

/* Line clamp fallback */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Tables responsive */
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Prevent long words breaking layout */
.prose, p, h1, h2, h3 { overflow-wrap: break-word; word-break: break-word; }
