/* flourish.css — restrained motion. Warmth comes from still light, not movement.
   Rules: nothing loops forever; things move once (on first load) or in response
   to the reader (hover, tap). No scroll-triggered reveals — content is simply
   there, like a printed page. Everything dies under prefers-reduced-motion. */

/* ---- the hearth: a still pool of warm light on the paper (no animation) ---- */
.hearth {
  position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(60% 45% at 50% 10%, color-mix(in srgb, var(--honey) 22%, transparent), transparent 70%),
    radial-gradient(35% 30% at 15% 85%, color-mix(in srgb, var(--amber) 10%, transparent), transparent 70%);
}

/* ---- hero: title and copy settle in once on load ---- */
.hero h1 .line { display: inline-block; opacity: 0; transform: translateY(0.4em); animation: rise 0.8s cubic-bezier(.2,.7,.2,1) forwards; }
.hero h1 .l2 { animation-delay: 0.18s; }
.hero .vol, .hero .lead, .hero .support, .hero .hero-cta { opacity: 0; animation: rise 0.8s cubic-bezier(.2,.7,.2,1) forwards; }
.hero .vol { animation-delay: 0.35s; }
.hero .lead { animation-delay: 0.45s; }
.hero .support { animation-delay: 0.55s; }
.hero .hero-cta { animation-delay: 0.65s; }
@keyframes rise { to { opacity: 1; transform: translateY(0); } }

/* cover: sits on the paper like a tipped-in plate */
.cover { box-shadow: 0 3px 18px rgb(var(--shadow) / 0.18); }

/* ---- chips: a small pop when toggled (response to the reader) ---- */
.chip.pop { animation: pop 0.3s cubic-bezier(.3,1.5,.4,1); }
@keyframes pop { 0% { transform: scale(0.94); } 55% { transform: scale(1.05); } 100% { transform: scale(1); } }

/* ---- quality diamonds fill when a swap appears ---- */
.dia { display: inline-block; transition: color 0.35s ease; }
.dia.fill { color: var(--line); }
.dia.fill.lit { color: var(--link); }

/* ---- the kill switch ---- */
@media (prefers-reduced-motion: reduce) {
  .hero h1 .line, .hero .vol, .hero .lead, .hero .support, .hero .hero-cta {
    animation: none !important; opacity: 1; transform: none;
  }
  .chip.pop { animation: none !important; }
  .card, .dia { transition: none !important; }
}
