/* "Copy it. Deploy it. Own it." — the Features16 section's dark look
   (neutral-900 cards, neutral-950 panels, glow-matched accents), on the
   hub's #0a0a0b. Reveal styles apply only once JS arms the section, so the
   content is always visible without JS and under reduced motion. */
.flow-current{
  background:var(--bg,#0a0a0b);color:#fff;padding:80px 16px;
  border-bottom:1px solid var(--line,rgba(212,175,55,.16));
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
.flow-current__inner{max-width:1400px;margin:0 auto}
.flow-current__head{display:grid;gap:20px}
.flow-current__title{
  margin:0;max-width:16ch;font-size:2.25rem;font-weight:500;line-height:1.04;letter-spacing:-.04em;
  text-wrap:balance;color:#fff;
}
.flow-current__sub{margin:0;max-width:44ch;font-size:1rem;line-height:1.625;color:#a3a3a3;text-wrap:pretty}
.flow-current__row{
  position:relative;list-style:none;margin:48px 0 0;padding:0;
  display:grid;grid-template-columns:1fr;gap:16px;
}
.flow-card{display:flex;flex-direction:column;border-radius:28px;background:#171717;padding:8px}
.flow-card__panel{width:100%;aspect-ratio:4/3;border-radius:20px;background:#0a0a0a}
.flow-card__body{display:flex;flex:1;flex-direction:column;padding:20px 16px 16px}
.flow-card__top{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.flow-card__title{margin:0;font-size:1.125rem;font-weight:500;letter-spacing:-.01em;color:#fff}
.flow-card__value{font-size:1.125rem;font-weight:500;font-variant-numeric:tabular-nums}
.flow-card--1 .flow-card__value{color:#ffbe45}
.flow-card--2 .flow-card__value{color:#5eeba6}
.flow-card--3 .flow-card__value{color:#6fb9ff}
.flow-card__detail{margin:8px 0 0;font-size:.875rem;line-height:1.625;color:#a3a3a3;text-wrap:pretty}

@media (min-width:640px){
  .flow-current{padding:80px 24px}
  .flow-current__title{font-size:3rem}
  .flow-current__row{margin-top:64px}
  .flow-card__body{padding:20px 20px 16px}
}
@media (min-width:768px){.flow-current__row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){
  .flow-current{padding:112px 32px}
  .flow-current__head{grid-template-columns:1fr 1fr;align-items:end;gap:64px}
  .flow-current__sub{justify-self:end}
}

/* Reveal (replaces motion's whileInView variants). */
.flow-current--armed [data-reveal-group] [data-reveal]{
  opacity:0;transform:translateY(14px);filter:blur(6px);
  transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1),filter .8s cubic-bezier(.16,1,.3,1);
}
.flow-current--armed [data-reveal-group] [data-reveal]:nth-child(1){transition-delay:.05s}
.flow-current--armed [data-reveal-group] [data-reveal]:nth-child(2){transition-delay:.13s}
.flow-current--armed [data-reveal-group].is-in [data-reveal]{opacity:1;transform:none;filter:none}
.flow-current--armed [data-reveal-card]{
  opacity:0;transition:opacity .9s cubic-bezier(.16,1,.3,1);
  transition-delay:calc(.1s + var(--i,0) * .12s);
}
.flow-current--armed [data-reveal-card].is-in{opacity:1}
@media (prefers-reduced-motion:reduce){
  .flow-current--armed [data-reveal],.flow-current--armed [data-reveal-card]{opacity:1 !important;transform:none !important;filter:none !important;transition:none !important}
}
