/* =========================================================
   Nidhalo Styles — Animations
   ========================================================= */

/* ---------- Keyframes ---------- */
@keyframes spin-angle { to { --angle: 360deg; } }
@keyframes shimmer-text { to { background-position: 200% center; } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes drift-1 { to { transform: translate(14vw, 10vh) scale(1.15); } }
@keyframes drift-2 { to { transform: translate(-12vw, -12vh) scale(.9); } }
@keyframes drift-3 { to { transform: translate(-10vw, -18vh) scale(1.2); } }
@keyframes cue { to { top: 110%; } }
@keyframes ring { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.6); opacity: 0; } }
@keyframes pulse-glow { 0%,100% { box-shadow: 0 0 0 0 rgba(243,220,147,.0); } 50% { box-shadow: 0 0 18px 2px rgba(243,220,147,.55); } }
@keyframes float-y { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes float-y2 { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(12px) rotate(2deg); } }
@keyframes twinkle { 0%,100% { opacity: .2; transform: scale(.6); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes slow-rotate { to { transform: rotate(360deg); } }
@keyframes fade-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }

/* Page-load */
@keyframes logo-in { 0% { opacity: 0; transform: scale(.7); filter: blur(8px); } 60% { opacity: 1; filter: blur(0); box-shadow: 0 0 0 1px rgba(212,175,55,.6), 0 0 70px rgba(212,175,55,.6); } 100% { opacity: 1; transform: none; } }
@keyframes nav-in { from { opacity: 0; transform: translateY(-16px); } to { opacity: 1; transform: none; } }
@keyframes line-up { from { transform: translateY(110%) rotate(3deg); } to { transform: none; } }
@keyframes blur-in { from { opacity: 0; filter: blur(12px); transform: translateY(16px); } to { opacity: 1; filter: blur(0); transform: none; } }
@keyframes arch-reveal { from { clip-path: inset(100% 0 0 0 round 999px 999px 28px 28px); } to { clip-path: inset(0 0 0 0 round 999px 999px 28px 28px); } }
@keyframes img-settle { from { transform: scale(1.35); } to { transform: scale(1.12); } }
@keyframes chip-in { from { opacity: 0; transform: translateY(40px) scale(.85); } to { opacity: 1; transform: none; } }
@keyframes ring-draw { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: none; } }

/* ---------- Load sequence ---------- */
.site-header .brand-logo { animation: logo-in 1.2s var(--ease) both .1s; }
.site-header .brand-name { animation: nav-in .9s var(--ease) both .35s; }
.main-nav li { animation: nav-in .8s var(--ease) both; }
.main-nav li:nth-child(1) { animation-delay: .40s; }
.main-nav li:nth-child(2) { animation-delay: .46s; }
.main-nav li:nth-child(3) { animation-delay: .52s; }
.main-nav li:nth-child(4) { animation-delay: .58s; }
.main-nav li:nth-child(5) { animation-delay: .64s; }
.main-nav li:nth-child(6) { animation-delay: .70s; }
.main-nav li:nth-child(7) { animation-delay: .76s; }
.main-nav li:nth-child(8) { animation-delay: .82s; }
.main-nav li:nth-child(9) { animation-delay: .88s; }
.header-actions { animation: nav-in .8s var(--ease) both .9s; }

.hero-emblem { animation: logo-in 1.3s var(--ease) both .3s; }
.hero .eyebrow { animation: blur-in 1s var(--ease) both .5s; }
.hero h1 .line > span { animation: line-up 1.2s var(--ease) both; }
.hero h1 .line:nth-child(1) > span { animation-delay: .6s; }
.hero h1 .line:nth-child(2) > span { animation-delay: .75s; }
.hero .tagline { animation: blur-in 1s var(--ease) both 1s; }
.hero .lede { animation: blur-in 1s var(--ease) both 1.15s; }
.hero-ctas { animation: blur-in 1s var(--ease) both 1.3s; }
.hero-meta { animation: blur-in 1s var(--ease) both 1.45s; }
.hero-arch { animation: arch-reveal 1.6s var(--ease-in-out) both .4s; }
.hero-arch img { animation: img-settle 2.4s var(--ease) both .4s; }
.hero-ring { animation: ring-draw 1.4s var(--ease) both 1s; }
.hero-chip.c1 .float { animation: chip-in 1.1s var(--ease) both 1.3s, float-y 7s ease-in-out 2.4s infinite; }
.hero-chip.c2 .float { animation: chip-in 1.1s var(--ease) both 1.5s, float-y2 8s ease-in-out 2.6s infinite; }
.hero-badge { animation: chip-in 1s var(--ease) both 1.7s; }
.mandala svg { animation: slow-rotate 120s linear infinite; }
.sparkle { animation: twinkle 3.2s ease-in-out infinite; }
.sparkle.s2 { animation-delay: 1s; }
.sparkle.s3 { animation-delay: 2s; }

.page-hero h1, .page-hero .eyebrow, .page-hero p, .page-hero .crumbs, .page-hero .subnav { animation: blur-in 1.1s var(--ease) both; }
.page-hero .eyebrow { animation-delay: .2s; }
.page-hero h1 { animation-delay: .35s; }
.page-hero p { animation-delay: .5s; }
.page-hero .subnav { animation-delay: .65s; }
.page-hero .crumbs { animation-delay: .8s; }

/* ---------- Scroll reveal ---------- */
[data-reveal] { opacity: 0; transition: opacity 1s var(--ease), transform 1.1s var(--ease), filter 1s var(--ease), clip-path 1.3s var(--ease-in-out); transition-delay: var(--d, 0s); }
[data-reveal="up"] { transform: translateY(46px); }
[data-reveal="left"] { transform: translateX(-60px); }
[data-reveal="right"] { transform: translateX(60px); }
[data-reveal="scale"] { transform: scale(.9); }
[data-reveal="blur"] { filter: blur(14px); transform: translateY(20px); }
[data-reveal="clip"] { opacity: 1; clip-path: inset(0 0 100% 0 round var(--radius)); }
[data-reveal].revealed { opacity: 1; transform: none; filter: none; }
[data-reveal="clip"].revealed { clip-path: inset(0 0 0 0 round var(--radius)); }

/* Staggered children */
[data-stagger] > * { opacity: 0; transform: translateY(40px) scale(.98); transition: opacity .9s var(--ease), transform 1s var(--ease); }
[data-stagger].revealed > * { opacity: 1; transform: none; }
[data-stagger].revealed > *:nth-child(1) { transition-delay: .00s; }
[data-stagger].revealed > *:nth-child(2) { transition-delay: .08s; }
[data-stagger].revealed > *:nth-child(3) { transition-delay: .16s; }
[data-stagger].revealed > *:nth-child(4) { transition-delay: .24s; }
[data-stagger].revealed > *:nth-child(5) { transition-delay: .32s; }
[data-stagger].revealed > *:nth-child(6) { transition-delay: .40s; }
[data-stagger].revealed > *:nth-child(7) { transition-delay: .48s; }
[data-stagger].revealed > *:nth-child(8) { transition-delay: .56s; }
[data-stagger].revealed > *:nth-child(n+9) { transition-delay: .62s; }
/* hover transform should win after reveal */
[data-stagger].revealed > .gb:hover { transform: translateY(-8px); transition-delay: 0s; }

/* filtering should not inherit reveal stagger delays */
[data-stagger].revealed > .g-item { transition-property: opacity, transform, filter; }
[data-stagger].revealed > .g-item.is-hiding { transition-delay: 0s; }

/* parallax helper */
[data-parallax] { will-change: transform; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  [data-reveal], [data-stagger] > * { opacity: 1 !important; transform: none !important; filter: none !important; clip-path: none !important; }
  .marquee-track { animation: none !important; }
}

@keyframes kenburns { from { transform: scale(1.18) translate(1.5%, 1%); } to { transform: scale(1.04) translate(0, 0); } }
@keyframes hs-shine { 0%, 70% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
@keyframes hg-pulse { 0%,100% { opacity: .75; transform: translate(-50%,-50%) scale(.94); } 50% { opacity: 1; transform: translate(-50%,-50%) scale(1.06); } }
@keyframes hg-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes hg-float { 0% { opacity: 0; transform: translateY(20px) scale(.6); } 25% { opacity: .9; } 60% { opacity: .6; } 100% { opacity: 0; transform: translateY(-60px) scale(1.1); } }
@keyframes ch-in { to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes ch-out { to { opacity: 0; transform: translateY(-60%) rotateX(80deg); filter: blur(6px); } }
@keyframes underline-grow { 0% { transform: scaleX(0); } 30%, 75% { transform: scaleX(1); } 100% { transform: scaleX(0); transform-origin: right; } }
.hero-title .line:nth-child(2) > span { animation-delay: .6s; }
.hero-title .line:nth-child(3) > span { animation-delay: .75s; }
.hero-title .rot-line > span { animation: blur-in 1s var(--ease) both .95s; }
@keyframes bw-in { to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes line-draw { to { width: 34px; } }
@keyframes hl-drift { from { transform: translate(0,0); opacity: .85; } to { transform: translate(4%, 3%); opacity: 1; } }
.hero-light .bk { animation: hg-float 10s ease-in-out infinite; }
.hero-light .bk { background: radial-gradient(circle, rgba(255,240,200,.8), transparent 70%); position: absolute; border-radius: 50%; }
.hero-light .b1 { width: 8px; height: 8px; left: 20%; top: 30%; }
.hero-light .b3 { width: 6px; height: 6px; left: 78%; top: 62%; animation-delay: 3s; }
.hero-light .b6 { width: 10px; height: 10px; left: 86%; top: 24%; animation-delay: 5s; filter: blur(2px); }
.hero-light .b9 { width: 6px; height: 6px; left: 12%; top: 76%; animation-delay: 7s; }
@keyframes petal-fall { 0% { opacity: 0; transform: translate(0,0) rotate(0); } 10% { opacity: .9; } 85% { opacity: .7; } 100% { opacity: 0; transform: translate(-60px, 110vh) rotate(540deg); } }
[data-stagger].revealed > *:nth-child(n+7) { transition-delay: .3s; }
