/* ============================================================
   Work Page Enhanced — work-enhanced.css
   Animated card reveals, enhanced hover states, orb color shift.
   Layered on top of portfolio.css.
   ============================================================ */

/* ── Enhanced card entrance + hover ──────────────────────── */
.browse-card.we-card {
  opacity: 0;
  transform: translateY(40px) scale(0.94);
  transition: opacity 0.7s ease,
              transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--we-delay, 0ms);
}
.browse-card.we-card.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity 0.3s ease,
              transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.browse-card.we-card.is-visible:hover {
  transform: translateY(-4px);
}

/* Enhanced image hover — zoom + clip-path reveal */
.browse-card.we-card .browse-img {
  overflow: hidden;
}
.browse-card.we-card .browse-img img {
  transform: scale(1.0);
  clip-path: inset(6%);
  transition: transform 800ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
              clip-path 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}
.browse-card.we-card:hover .browse-img img {
  transform: scale(1.06);
}

/* Non-hovered cards dim */
.browse-grid:has(.browse-card.we-card:hover) .browse-card.we-card:not(:hover) {
  opacity: 0.45;
}
.browse-card.we-card.is-visible .browse-img img {
  clip-path: inset(0%);
}
.browse-card.we-card:hover .browse-img img {
  clip-path: inset(0%);
}

/* ── Archive card stagger ─────────────────────────────────── */
.archive-card.we-archive {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease,
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--we-delay, 0ms);
}
.archive-card.we-archive.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Section heading fade-up ──────────────────────────────── */
.we-split-title {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.we-split-title.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

/* Label slide-in */
.we-label-slide {
  opacity: 0;
  transform: translateX(-20px);
  transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.we-label-slide.is-revealed {
  opacity: 1;
  transform: translateX(0);
}

/* Subtitle fade-up */
.we-sub-fade {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.6s ease 0.2s, transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.2s;
}
.we-sub-fade.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

/* ── Reduced motion ───────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .browse-card.we-card { opacity: 1 !important; transform: none !important; transition: none !important; }
  .browse-card.we-card .browse-img img { clip-path: none !important; transition: none !important; }
  .archive-card.we-archive { opacity: 1 !important; transform: none !important; transition: none !important; }
  .we-split-title { opacity: 1 !important; transform: none !important; transition: none !important; }
  .we-label-slide { opacity: 1 !important; transform: none !important; transition: none !important; }
  .we-sub-fade { opacity: 1 !important; transform: none !important; transition: none !important; }
}