/* ============================
   APPLE-STYLE ANIMATIONS
   Premium scroll reveals, fades,
   and loading transitions
============================ */

/* ---- Page Load Overlay ---- */
.page-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #1B1B1B;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.page-loader.loaded {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.page-loader__logo {
  opacity: 0;
  transform: scale(0.92);
  animation: loaderFadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s forwards;
}

.page-loader__logo img {
  max-width: 160px;
  height: auto;
}

@keyframes loaderFadeIn {
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* ---- Base Reveal States ---- */

/* Fade up (default) */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Fade in (no movement) */
.reveal-fade {
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity;
}

.reveal-fade.is-visible {
  opacity: 1;
}

/* Scale up (Apple product reveals) */
.reveal-scale {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.reveal-scale.is-visible {
  opacity: 1;
  transform: scale(1);
}

/* Slide from left */
.reveal-left {
  opacity: 0;
  transform: translateX(-60px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.reveal-left.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* Slide from right */
.reveal-right {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.reveal-right.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* ---- Staggered Children ---- */
.stagger-children .reveal {
  transition-delay: 0s;
}

.stagger-children.is-visible .reveal:nth-child(1) { transition-delay: 0s; }
.stagger-children.is-visible .reveal:nth-child(2) { transition-delay: 0.1s; }
.stagger-children.is-visible .reveal:nth-child(3) { transition-delay: 0.12s; }
.stagger-children.is-visible .reveal:nth-child(4) { transition-delay: 0.18s; }
.stagger-children.is-visible .reveal:nth-child(5) { transition-delay: 0.24s; }
.stagger-children.is-visible .reveal:nth-child(6) { transition-delay: 0.3s; }
.stagger-children.is-visible .reveal:nth-child(7) { transition-delay: 0.36s; }
.stagger-children.is-visible .reveal:nth-child(8) { transition-delay: 0.42s; }

/* When parent is visible, children should also become visible */
.stagger-children.is-visible .reveal {
  opacity: 1;
  transform: translateY(0);
}

/* ---- Delay Utilities ---- */
.reveal-delay-1 { transition-delay: 0.1s !important; }
.reveal-delay-2 { transition-delay: 0.2s !important; }
.reveal-delay-3 { transition-delay: 0.3s !important; }
.reveal-delay-4 { transition-delay: 0.4s !important; }

/* ---- Banner Hero Specific ---- */
.banner-home .banner-heading {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1) 0.3s,
              transform 1s cubic-bezier(0.16, 1, 0.3, 1) 0.3s;
}

.banner-home .banner-content {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.6s,
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.6s;
}

.banner-home.hero-loaded .banner-heading,
.banner-home.hero-loaded .banner-content {
  opacity: 1;
  transform: translateY(0);
}

/* ---- Section Heading Reveals ---- */
.investment-framework__heading,
.selected-investments__heading,
.section-leadership__heading {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

.investment-framework__heading.is-visible,
.selected-investments__heading.is-visible,
.section-leadership__heading.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---- Investment Framework Items ---- */
.investment-framework__item {
  opacity: 0;
  transform: translateY(25px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.investment-framework__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---- Investment Focus / Accordion Section ---- */
.investment-focus__image {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.investment-focus__image.is-visible {
  opacity: 1;
  transform: translateX(0);
}

.investment-focus__content {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1) 0.15s,
              transform 1s cubic-bezier(0.16, 1, 0.3, 1) 0.15s;
}

.investment-focus__content.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* ---- Accordion Image Crossfade ---- */
.accordion-img {
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  transform: scale(1.03);
}

.accordion-img.active {
  transform: scale(1);
}

/* ---- Portfolio Items ---- */
.portfolio-item {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.portfolio-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Portfolio image hover zoom */
.portfolio-item__image {
  overflow: hidden;
}

.portfolio-item__image img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.portfolio-item:hover .portfolio-item__image img {
  transform: scale(1.04);
}

/* ---- Leadership Members ---- */
.item-member {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.item-member.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Member image hover */
.item-member__avt {
  overflow: hidden;
}

.item-member__avt img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.item-member:hover .item-member__avt img {
  transform: scale(1.03);
}

/* ---- CTA Section ---- */
.section-cta__image {
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.section-cta__image.is-visible {
  opacity: 1;
  transform: scale(1);
}

.section-cta__content {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.2s,
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.2s;
}

.section-cta__content.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---- Smooth Link Hover Transitions ---- */
.btn-box-text-s1,
.menu-main a,
.item-member__link a {
  transition: opacity 0.3s ease;
}

.btn-box-text-s1:hover,
.menu-main a:hover,
.item-member__link a:hover {
  opacity: 0.7;
}

/* ---- Filter Button Transitions ---- */
.portfolio-filter {
  transition: color 0.3s ease, border-color 0.3s ease;
}

/* ---- Reduce Motion for Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-fade,
  .reveal-scale,
  .reveal-left,
  .reveal-right,
  .investment-framework__heading,
  .investment-framework__item,
  .investment-focus__image,
  .investment-focus__content,
  .selected-investments__heading,
  .section-leadership__heading,
  .portfolio-item,
  .item-member,
  .section-cta__image,
  .section-cta__content,
  .banner-home .banner-heading,
  .banner-home .banner-content {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .page-loader {
    display: none !important;
  }
}