/* ═══════════════════════════════════════════════════════════
   TIANX STUDIO — Utilities
   ═══════════════════════════════════════════════════════════ */

/* ─── TEXT ALIGNMENT ───────────────────────────────────── */
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

/* ─── SPACING HELPERS ──────────────────────────────────── */
.mt-xs  { margin-top: var(--space-xs); }
.mt-sm  { margin-top: var(--space-sm); }
.mt-md  { margin-top: var(--space-md); }
.mt-lg  { margin-top: var(--space-lg); }
.mb-xs  { margin-bottom: var(--space-xs); }
.mb-sm  { margin-bottom: var(--space-sm); }
.mb-md  { margin-bottom: var(--space-md); }
.mb-lg  { margin-bottom: var(--space-lg); }
.mx-auto { margin-left: auto; margin-right: auto; }

/* ─── DISPLAY ──────────────────────────────────────────── */
.block   { display: block; }
.hidden  { display: none; }

/* ─── ACCESSIBILITY ────────────────────────────────────── */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ─── SCROLL REVEAL ────────────────────────────────────── */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity var(--duration-lg) var(--ease),
    transform var(--duration-lg) var(--ease);
}

.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delays for child elements */
.stagger > .fade-in:nth-child(1) { transition-delay: 0s; }
.stagger > .fade-in:nth-child(2) { transition-delay: 0.1s; }
.stagger > .fade-in:nth-child(3) { transition-delay: 0.2s; }
.stagger > .fade-in:nth-child(4) { transition-delay: 0.3s; }
.stagger > .fade-in:nth-child(5) { transition-delay: 0.4s; }
.stagger > .fade-in:nth-child(6) { transition-delay: 0.5s; }
.stagger > .fade-in:nth-child(7) { transition-delay: 0.6s; }

/* ─── LANGUAGE HELPERS ─────────────────────────────────── */
[lang="en"] .hu-only { display: none !important; }
[lang="hu"] .en-only { display: none !important; }

/* ─── IMAGE PLACEHOLDER ────────────────────────────────── */
.img-placeholder {
  background: linear-gradient(135deg, var(--surface) 0%, var(--surface-warm) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
}

.section--dark .img-placeholder {
  background: linear-gradient(135deg, var(--primary-90) 0%, var(--primary-70) 100%);
  color: rgba(255,255,255,0.2);
}

/* ─── MAX WIDTH HELPERS ────────────────────────────────── */
.max-w-prose { max-width: 52ch; }
.max-w-sm    { max-width: 480px; }
.max-w-md    { max-width: 640px; }
.max-w-lg    { max-width: 800px; }