/* Perly Consulting — Effects: shadows, texture, motion
   Practitioner-authentic, a little hand-made. Warm-tinted shadows, paper grain,
   and the one required signature: the perpetual gentle waft of falling bills. */

:root {
  /* ---- Shadows (warm-tinted, soft; never a hard fintech drop) ---- */
  --shadow-sm: 0 1px 2px rgba(76, 52, 32, 0.10);
  --shadow-card: 0 2px 4px rgba(76, 52, 32, 0.08), 0 8px 24px rgba(76, 52, 32, 0.10);
  --shadow-lift: 0 6px 12px rgba(76, 52, 32, 0.12), 0 18px 40px rgba(76, 52, 32, 0.16);
  --shadow-note: 0 1px 0 rgba(255,255,255,0.4) inset, 0 10px 30px rgba(76, 52, 32, 0.22);
  --shadow-inset: inset 0 1px 3px rgba(76, 52, 32, 0.16);

  /* ---- Engraved edges (banknote hairline) ---- */
  --ring-engraved: 0 0 0 1px var(--border-hairline), 0 0 0 4px rgba(199,154,58,0.14);

  /* ---- Warm paper grain (hand-made texture; layer under sections) ---- */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");

  /* ---- Guilloché-ish diagonal engraving (subtle band texture) ---- */
  --engraving: repeating-linear-gradient(45deg, rgba(11,58,43,0.04) 0 2px, transparent 2px 7px);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur-med: 260ms;
  --dur-slow: 520ms;

  /* falling-bill drift: long, calm, continuous — never a burst */
  --waft-duration: 14s;
}

/* The signature: one bill wafting down. Gentle sway + slow rotate, continuous.
   Use on a stylized bill element; stagger delay/duration per bill so it trickles. */
@keyframes perly-waft {
  0%   { transform: translate3d(0, -12vh, 0) rotate(-8deg); opacity: 0; }
  8%   { opacity: 1; }
  25%  { transform: translate3d(24px, 18vh, 0) rotate(10deg); }
  50%  { transform: translate3d(-18px, 46vh, 0) rotate(-6deg); }
  75%  { transform: translate3d(22px, 72vh, 0) rotate(12deg); }
  92%  { opacity: 1; }
  100% { transform: translate3d(-10px, 104vh, 0) rotate(-4deg); opacity: 0; }
}

/* gentle idle flutter for a bill pinned in place (e.g. margin follower) */
@keyframes perly-flutter {
  0%, 100% { transform: rotate(-3deg) translateY(0); }
  50%      { transform: rotate(3deg) translateY(-6px); }
}

@media (prefers-reduced-motion: reduce) {
  :root { --waft-duration: 0s; }
}
