/* ==========================================================================
   Reigrow Solutions — utilities.css
   Single-purpose helpers: spacing, flex, text, reveal-animation states.
   ========================================================================== */

/* Reveal animation (driven by assets/js/reveal.js) ------------------------ */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s var(--ease), transform .7s var(--ease); will-change: opacity, transform; }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal[data-reveal-delay="1"] { transition-delay: .08s; }
.reveal[data-reveal-delay="2"] { transition-delay: .16s; }
.reveal[data-reveal-delay="3"] { transition-delay: .24s; }
.reveal[data-reveal-delay="4"] { transition-delay: .32s; }
.reveal[data-reveal-delay="5"] { transition-delay: .40s; }
.reveal[data-reveal-delay="6"] { transition-delay: .48s; }

@media (prefers-reduced-motion: reduce) {
	.reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* Floating micro-animations */
.js-float-a { animation: floatA 6s ease-in-out infinite; }
.js-float-b { animation: floatB 7s ease-in-out infinite; }

/* Display & flex ---------------------------------------------------------- */
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.flex-wrap { flex-wrap: wrap; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.flex-1 { flex: 1; }
.grid { display: grid; }

/* Gap --------------------------------------------------------------------- */
.gap-6 { gap: 6px; } .gap-8 { gap: 8px; } .gap-10 { gap: 10px; } .gap-12 { gap: 12px; }
.gap-14 { gap: 14px; } .gap-16 { gap: 16px; } .gap-18 { gap: 18px; } .gap-20 { gap: 20px; }
.gap-24 { gap: 24px; } .gap-28 { gap: 28px; } .gap-32 { gap: 32px; }

/* Margin ------------------------------------------------------------------ */
.mt-0 { margin-top: 0; } .mt-8 { margin-top: 8px; } .mt-12 { margin-top: 12px; }
.mt-16 { margin-top: 16px; } .mt-20 { margin-top: 20px; } .mt-24 { margin-top: 24px; }
.mt-28 { margin-top: 28px; } .mt-32 { margin-top: 32px; } .mt-40 { margin-top: 40px; }
.mt-48 { margin-top: 48px; } .mt-56 { margin-top: 56px; }
.mb-0 { margin-bottom: 0; } .mb-8 { margin-bottom: 8px; } .mb-12 { margin-bottom: 12px; }
.mb-16 { margin-bottom: 16px; } .mb-20 { margin-bottom: 20px; } .mb-24 { margin-bottom: 24px; }
.mb-28 { margin-bottom: 28px; } .mb-32 { margin-bottom: 32px; } .mb-40 { margin-bottom: 40px; }
.mx-auto { margin-inline: auto; }

/* Text -------------------------------------------------------------------- */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-muted { color: var(--muted); }
.text-soft { color: var(--text); }
.text-white { color: #fff; }
.fw-500 { font-weight: 500; } .fw-600 { font-weight: 600; } .fw-700 { font-weight: 700; }
.maxw-560 { max-width: 560px; } .maxw-620 { max-width: 620px; } .maxw-680 { max-width: 680px; }

/* Actions row ------------------------------------------------------------- */
.actions { display: flex; flex-wrap: wrap; gap: 14px; }
.actions--center { justify-content: center; }
.stack { display: flex; flex-direction: column; }
.stack--gap-sm { gap: 14px; }
.stack--gap { gap: 20px; }
.stack--gap-lg { gap: 28px; }

/* Trust row --------------------------------------------------------------- */
.trust-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.trust-avatars { display: flex; }
.trust-avatars span { width: 38px; height: 38px; border-radius: 50%; border: 2.5px solid #fff; background: var(--brand-grad); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 13px; margin-left: -10px; box-shadow: 0 4px 10px -3px rgba(11, 30, 56, .3); }
.trust-avatars span:first-child { margin-left: 0; }
.trust-text { font-size: 13.5px; color: var(--muted); line-height: 1.4; }
.trust-text strong { color: var(--ink); }

/* Dividers ---------------------------------------------------------------- */
.rule { height: 1px; background: var(--border); border: 0; margin: 0; }
.rule--soft { background: var(--border-soft); }

/* Aspect helpers ---------------------------------------------------------- */
.ratio-16-10 { aspect-ratio: 16 / 10; }
.round-full { border-radius: 999px; }
.relative { position: relative; }
.of-hidden { overflow: hidden; }