/* ============================================================
   SITE ANIMATIONS — shared polish layer (all pages)
   Loaded via <link> on every page; chrome injected by
   assets/site-animations.js. Enhances, never replaces, the
   existing .reveal scroll system.
   ============================================================ */

/* ---------- page load ---------- */
@keyframes siteFadeIn { from { opacity: 0; } to { opacity: 1; } }
body { animation: siteFadeIn .6s ease both; }

/* ---------- header entrance + already-present .scrolled shadow ---------- */
@keyframes siteHeaderDrop { from { opacity: 0; transform: translateY(-100%); } to { opacity: 1; transform: translateY(0); } }
header { animation: siteHeaderDrop .75s cubic-bezier(.22,1,.36,1) both; }
header.scrolled { backdrop-filter: blur(16px); }

/* ---------- logo ---------- */
.logo { position: relative; overflow: hidden; }
.logo img { animation: siteLogoPop .85s cubic-bezier(.34,1.56,.64,1) both; transition: filter .35s ease; will-change: transform; }
@keyframes siteLogoPop { 0% { opacity: 0; transform: scale(.55) rotate(-14deg); } 60% { opacity: 1; } 100% { opacity: 1; transform: scale(1) rotate(0); } }
/* gentle continuous bob */
.logo { animation: siteLogoBob 5s ease-in-out 1.1s infinite; }
@keyframes siteLogoBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2.5px); } }
/* periodic shine sweep (clipped to the logo box) */
.logo::after {
  content: ''; position: absolute; top: 0; left: -75%; width: 48%; height: 100%;
  background: linear-gradient(100deg, transparent 0%, rgba(111,195,235,.4) 50%, transparent 100%);
  transform: skewX(-20deg); pointer-events: none; animation: siteLogoShine 6s ease-in-out 2s infinite;
}
@keyframes siteLogoShine { 0% { left: -75%; } 14% { left: 155%; } 100% { left: 155%; } }
/* hover */
.logo:hover img { filter: drop-shadow(0 3px 9px rgba(58,159,214,.5)) brightness(1.05); }
.logo-text span { transition: color .3s ease; }
.logo:hover .logo-text span { color: var(--blue-deep); }

/* ---------- desktop nav underline ---------- */
header nav a:not(.nav-cta) { position: relative; }
header nav a:not(.nav-cta)::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -5px; height: 2px; border-radius: 2px;
  background: linear-gradient(to right, var(--blue-deep), var(--blue-light));
  transform: scaleX(0); transform-origin: left; transition: transform .3s ease;
}
header nav a:not(.nav-cta):hover::after,
header nav a.active:not(.nav-cta)::after { transform: scaleX(1); }
.nav-cta { transition: transform .25s ease, background .25s ease !important; }
.nav-cta:hover { transform: translateY(-2px); }

/* ---------- buttons: lift + shine ---------- */
.btn-solid, .btn-outline, .cta-email-btn, .apply-email {
  transition: transform .25s ease, box-shadow .28s ease, background .25s ease, color .25s ease, filter .25s ease;
}
.btn-solid:hover, .btn-outline:hover, .cta-email-btn:hover, .apply-email:hover { transform: translateY(-3px); }
.cta-email-btn, .apply-email { position: relative; overflow: hidden; }
.cta-email-btn::after, .apply-email::after {
  content: ''; position: absolute; top: 0; left: -130%; width: 55%; height: 100%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(58,159,214,.35), transparent);
  transform: skewX(-20deg); transition: left .6s ease;
}
.cta-email-btn:hover::after, .apply-email:hover::after { left: 150%; }

/* ---------- scroll progress bar ---------- */
.site-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 100%; z-index: 300; pointer-events: none;
  transform: scaleX(0); transform-origin: left;
  background: linear-gradient(to right, var(--blue-deep), var(--blue), var(--blue-light));
  box-shadow: 0 0 10px rgba(58,159,214,.5);
}

/* ---------- back to top ---------- */
.site-totop {
  position: fixed; left: 22px; bottom: 24px; width: 46px; height: 46px; border-radius: 50%;
  border: none; cursor: pointer; z-index: 400; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--blue-deep), var(--navy)); color: #fff;
  box-shadow: 0 8px 24px rgba(13,43,69,.32);
  opacity: 0; transform: translateY(16px) scale(.8); pointer-events: none;
  transition: opacity .3s ease, transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease;
}
.site-totop.show { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.site-totop:hover { transform: translateY(-3px) scale(1.06); box-shadow: 0 12px 30px rgba(13,43,69,.4); }
.site-totop svg { width: 20px; height: 20px; }
@media (max-width: 559px) { .site-totop { left: 16px; bottom: 16px; width: 42px; height: 42px; } }

/* ---------- richer reveal easing (enhances existing .reveal) ---------- */
.reveal { transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }

/* ---------- respect reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  body, header, .logo, .logo img, .logo::after { animation: none !important; }
  .site-progress, .site-totop { display: none !important; }
  .logo::after { display: none !important; }
}