/* HIVE Legal — micro-interacties (progressive enhancement) */

/* 1. blokken faden in bij scrollen — alleen actief als JS de class zet */
.om-anim [data-reveal] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}
.om-anim [data-reveal].is-in { opacity: 1; transform: none; }

/* 4. pijltjes schuiven mee bij hover */
a:hover span[style*="color:#FF8734"],
a:hover span[style*="color: #FF8734"] { transform: translateX(4px); }
span[style*="color:#FF8734"], span[style*="color: #FF8734"] {
  display: inline-block;
  transition: transform .25s cubic-bezier(.22,.61,.36,1);
}
summary:hover span[style*="color:#FF8734"] { transform: translateX(4px); }

/* 6. de bij zweeft zachtjes */
@keyframes hiveBeeFloat {
  0%, 100% { transform: rotate(14deg) translateY(0); }
  50%      { transform: rotate(14deg) translateY(-5px); }
}
svg[style*="rotate(14deg)"] { animation: hiveBeeFloat 4.5s ease-in-out infinite; }

/* 2. kaarten reageren op hover */
a[href][style*="border-radius:18px"],
a[href][style*="border-radius: 18px"],
a[href][style*="border-radius:22px"],
a[href][style*="aspect-ratio:3/4"] {
  transition: transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s cubic-bezier(.22,.61,.36,1);
}
a[href][style*="border-radius:18px"]:hover,
a[href][style*="border-radius: 18px"]:hover,
a[href][style*="border-radius:22px"]:hover,
a[href][style*="aspect-ratio:3/4"]:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 44px -18px rgba(23,21,31,0.4);
}
.exp-grid label { transition: transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s cubic-bezier(.22,.61,.36,1); }
.exp-grid label:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -18px rgba(23,21,31,0.35); }



/* 5. stappen verschijnen na elkaar */
.om-anim [data-reveal].is-in > div > div[style*="grid-template-columns:44px 1fr"],
.om-anim [data-reveal].is-in div[style*="repeat(5,1fr)"] > div { animation: hiveStepIn .55s cubic-bezier(.22,.61,.36,1) both; }
.om-anim [data-reveal].is-in div[style*="repeat(5,1fr)"] > div:nth-child(2) { animation-delay: .08s; }
.om-anim [data-reveal].is-in div[style*="repeat(5,1fr)"] > div:nth-child(3) { animation-delay: .16s; }
.om-anim [data-reveal].is-in div[style*="repeat(5,1fr)"] > div:nth-child(4) { animation-delay: .24s; }
.om-anim [data-reveal].is-in div[style*="repeat(5,1fr)"] > div:nth-child(5) { animation-delay: .32s; }
.om-anim [data-reveal].is-in div[style*="repeat(5,1fr)"] > div:nth-child(6) { animation-delay: .40s; }
@keyframes hiveStepIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .om-anim [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
  svg[style*="rotate(14deg)"] { animation: none !important; }
  * { animation-duration: .001s !important; }
}
