/* ============================================================
   Animations enhancements — appended layer.
   ============================================================ */

/* logo size hard-lock */
.work-cover .belugga-logo {
  width: 200px !important;
  max-width: 60%;
  height: auto;
  display: block;
  filter: drop-shadow(0 0 40px rgba(245, 241, 234, 0.08));
  transition: transform 0.8s var(--ease-out), filter 0.8s var(--ease-out);
}
.work-cover:hover .belugga-logo {
  transform: scale(1.04);
  filter: drop-shadow(0 0 60px rgba(245, 241, 234, 0.18));
}
.work-cover .brand-mark {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 120px 24px 24px;
}
.work-cover .brand-mark > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
}

/* (custom cursor removed) */

/* upgraded reveal: blur + scale */
.reveal {
  filter: blur(8px);
  transform: translateY(40px) scale(0.985);
  transition:
    opacity 1.1s var(--ease-out),
    transform 1.1s var(--ease-out),
    filter 1.1s var(--ease-out);
}
.reveal.in {
  filter: blur(0);
  transform: translateY(0) scale(1);
}

/* hero portrait ken-burns */
.hero-portrait { transition: transform 0.8s var(--ease-out); }
.hero-portrait:hover { transform: translateY(-4px); }
.hero-portrait img {
  animation: portrait-in 1.6s var(--ease-out) 1.2s both, ken-burns 18s ease-in-out 3s infinite alternate;
}
@keyframes ken-burns {
  from { transform: scale(1.08) translateY(0); }
  to   { transform: scale(1.14) translateY(-8px); }
}

/* brand cards spotlight */
.brand-card {
  transition: background 0.5s var(--ease-out), transform 0.5s var(--ease-out);
}
.brand-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(200,164,92,0.10), transparent 60%);
  opacity: 0;
  transition: opacity 0.5s var(--ease-out);
  pointer-events: none;
}
.brand-card:hover::before { opacity: 1; }
.brand-card:hover { transform: translateY(-4px); }

/* fw-step hover bar */
.fw-step { transition: background 0.5s var(--ease-out); }
.fw-step::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0; width: 0;
  background: var(--gold);
  transition: width 0.6s var(--ease-out);
}
.fw-step:hover::before { width: 3px; }
.fw-step:hover { background: var(--bg-2); }
.fw-step .n { transition: transform 0.5s var(--ease-out), color 0.5s var(--ease-out); }
.fw-step:hover .n { transform: translateX(8px); color: var(--fg); }

/* impact cells: gold border sweep + scale */
.impact-cell { transition: background 0.5s var(--ease-out); }
.impact-cell::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 0; height: 1px;
  background: var(--gold);
  transition: width 0.7s var(--ease-out);
}
.impact-cell:hover::after { width: 100%; }
.impact-cell .big { transition: transform 0.6s var(--ease-out); transform-origin: left bottom; }
.impact-cell:hover .big { transform: scale(1.04); }

/* hero stats stagger entrance */
.hero-stat .num,
.hero-stat .lab {
  opacity: 0;
  transform: translateY(20px);
  animation: stat-in 1s var(--ease-out) forwards;
}
.hero-stat:nth-child(1) .num { animation-delay: 2.0s; }
.hero-stat:nth-child(2) .num { animation-delay: 2.1s; }
.hero-stat:nth-child(3) .num { animation-delay: 2.2s; }
.hero-stat:nth-child(4) .num { animation-delay: 2.3s; }
.hero-stat:nth-child(1) .lab { animation-delay: 2.15s; }
.hero-stat:nth-child(2) .lab { animation-delay: 2.25s; }
.hero-stat:nth-child(3) .lab { animation-delay: 2.35s; }
.hero-stat:nth-child(4) .lab { animation-delay: 2.45s; }
@keyframes stat-in {
  to { opacity: 1; transform: translateY(0); }
}

/* button shine */
.btn { transition: transform 0.4s var(--ease-out), background 0.4s var(--ease-out), border-color 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out), color 0.4s var(--ease-out); }
.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at var(--bx, 50%) var(--by, 50%), rgba(255,255,255,0.20), transparent 50%);
  opacity: 0;
  transition: opacity 0.4s var(--ease-out);
  pointer-events: none;
  border-radius: inherit;
}
.btn:hover::after { opacity: 1; }

/* portrait label fade */
.hero-portrait-label {
  opacity: 0;
  animation: fade-in 1s ease 2.5s forwards;
}
