/* =====================================================================
   PrimeHarbor — animations.css
   Reveal-on-scroll, keyframes, floating motion, parallax, hover.
   ===================================================================== */
[data-reveal]{ opacity:0; transform: translateY(30px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal="left"]{ transform: translateX(-34px); }
[data-reveal="right"]{ transform: translateX(34px); }
[data-reveal="scale"]{ transform: scale(.93); }
[data-reveal="left"].in,[data-reveal="right"].in,[data-reveal="scale"].in{ transform:none; }
[data-delay="1"]{ transition-delay:.08s; } [data-delay="2"]{ transition-delay:.16s; }
[data-delay="3"]{ transition-delay:.24s; } [data-delay="4"]{ transition-delay:.32s; }
[data-delay="5"]{ transition-delay:.40s; } [data-delay="6"]{ transition-delay:.48s; }

@keyframes fade-up { from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:none;} }
@keyframes float-y { 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-16px);} }
@keyframes float-soft { 0%,100%{ transform:translateY(0) rotate(0);} 50%{ transform:translateY(-10px) rotate(2deg);} }
@keyframes drift { 0%{transform:translate(0,0);} 50%{transform:translate(14px,-10px);} 100%{transform:translate(0,0);} }
@keyframes sway { 0%,100%{ transform:translateX(0);} 50%{ transform:translateX(14px);} }
@keyframes spin-slow { to{ transform:rotate(360deg);} }
@keyframes pulse-dot { 0%{ box-shadow:0 0 0 0 rgba(34,211,238,.6);} 70%{ box-shadow:0 0 0 14px rgba(34,211,238,0);} 100%{ box-shadow:0 0 0 0 rgba(34,211,238,0);} }
@keyframes wave-move { from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

.float-y { animation: float-y 7s ease-in-out infinite; }
.float-soft { animation: float-soft 9s ease-in-out infinite; }
.drift { animation: drift 12s ease-in-out infinite; }
.sway { animation: sway 10s ease-in-out infinite; }
.spin-slow { animation: spin-slow 50s linear infinite; }
.pulse-dot { animation: pulse-dot 2.4s ease-out infinite; }

/* decorative blobs */
.blob { position:absolute; border-radius:50%; filter: blur(60px); opacity:.5; z-index:0; pointer-events:none; }
.blob--ocean { background: var(--ocean); }
.blob--cyan { background: var(--cyan); }
.blob--navy { background: var(--navy); }

/* hover utilities */
.hover-lift { transition: transform var(--t), box-shadow var(--t); }
.hover-lift:hover { transform: translateY(-6px); box-shadow: var(--sh-2); }
.hover-glow { transition: box-shadow var(--t); }
.hover-glow:hover { box-shadow: var(--sh-blue); }
.u-grow { background-image: linear-gradient(var(--cyan),var(--cyan)); background-size:0% 2px; background-repeat:no-repeat; background-position:0 100%; transition: background-size var(--t); padding-bottom:2px; }
.u-grow:hover { background-size:100% 2px; }

/* lazy fade */
img.lazy { opacity:0; transition: opacity .6s ease; }
img.lazy.loaded { opacity:1; }
[data-count]{ font-variant-numeric: tabular-nums; }

/* hero scroll cue */
.scroll-cue { display:inline-flex; flex-direction:column; align-items:center; gap:.5rem; font-family: var(--ff-display); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color: rgba(255,255,255,.8); }
.scroll-cue__line { width:2px; height:44px; background: linear-gradient(rgba(255,255,255,.6), transparent); position:relative; overflow:hidden; border-radius:2px; }
.scroll-cue__line::after { content:""; position:absolute; top:-50%; left:0; width:100%; height:50%; background: var(--cyan); animation: cue 1.8s ease-in-out infinite; }
@keyframes cue { 0%{ top:-50%;} 100%{ top:120%;} }

/* animated wavy underline band */
.wave-band { position:absolute; bottom:0; left:0; width:200%; height:100%; }

@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1!important; transform:none!important; }
  .float-y,.float-soft,.drift,.sway,.spin-slow,.pulse-dot,.scroll-cue__line::after{ animation:none!important; }
}