* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
img { max-width: 100%; }
.relative { position: relative; }
.overflow-hidden { overflow: hidden; }
.z-10 { z-index: 10; }
.text-sm { font-size: 0.875rem; }
body { 
  font-family: var(--font-family-sans); 
  color: var(--ink);
  background: linear-gradient(180deg, var(--brand-soft) 0%, var(--bg) 100%);
  position: relative; 
  overflow-x: hidden;
  min-height: 100vh;
  margin: 0;
}
a { text-decoration: none; color: inherit; }

.container { 
  max-width: 1140px; 
  margin: 0 auto; 
  padding: 0 1rem; 
}
@media (min-width: 1024px) { .container { padding: 0 1.5rem; } }

.flex { display: flex; }
.text-center { text-align: center; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }
.space-y-8 > * + * { margin-top: 2rem; }
.space-y-16 > * + * { margin-top: 4rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-20 { margin-top: 5rem; }
.mb-10 { margin-bottom: 2.5rem; }

.lg-hidden { display: block; } 
@media (min-width: 1024px) { .lg-hidden { display: none; } }
.lg-visible { display: none; }
@media (min-width: 1024px) { .lg-visible { display: block; } }

.text-brand-light { color: var(--brand-light); }
.text-ink { color: var(--ink); }
.text-muted { color: var(--muted); }
.brand-color { color: var(--brand); }

/* Scroll Animations Base Classes */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.5, 0, 0, 1), transform 0.8s cubic-bezier(0.5, 0, 0, 1);
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}
.reveal.active {
  opacity: 1;
  transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.2s; }
.reveal-delay-2 { transition-delay: 0.4s; }