/* ============================================================
   GLISS — Smooth Animation Module (No-Jump Edition)
   Premium · Subtle · Mobile-friendly · Conflict-resistant
   ============================================================ */

:root {
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.25, 1, 0.5, 1);
  --dur: 0.75s;
  --dur-slow: 1.1s;
}

/* ------------------------------------------------------------
   Base state — very gentle
   ------------------------------------------------------------ */
.reveal,
.reveal-x,
.reveal-xr,
.enter-up,
.enter-up-lg,
.enter-fade,
.service-item,
.outcome,
.role,
.founder-text {
  opacity: 0.01;
  will-change: transform, opacity;
}

.reveal,
.enter-up,
.service-item,
.outcome,
.role,
.founder-text {
  transform: translateY(18px);
}

.enter-up-lg {
  transform: translateY(28px);
}

.reveal-x {
  transform: translateX(-16px);
}

.reveal-xr {
  transform: translateX(16px);
}

.enter-fade {
  transform: none;
}

/* ------------------------------------------------------------
   Visible state
   ------------------------------------------------------------ */
.reveal.in-view,
.enter-up.in-view,
.enter-up-lg.in-view,
.enter-fade.in-view,
.reveal-x.in-view,
.reveal-xr.in-view,
.service-item.in-view,
.outcome.in-view,
.role.in-view,
.founder-text.in-view,
.section.in-view .reveal,
.section.in-view .enter-up,
.section.in-view .enter-up-lg,
.section.in-view .enter-fade,
.section.in-view .reveal-x,
.section.in-view .reveal-xr,
.home-sec.in-view .reveal,
.home-sec.in-view .enter-up,
.home-sec.in-view .enter-up-lg,
.home-sec.in-view .enter-fade,
.services-list.in-view .service-item,
.space-y-5.in-view .outcome,
.roles-grid.in-view .role,
.founder-grid.in-view .founder-text {
  opacity: 1;
  transform: none;
}

.reveal,
.reveal-x,
.reveal-xr,
.enter-up,
.enter-up-lg,
.enter-fade,
.service-item,
.outcome,
.role,
.founder-text {
  transition: opacity var(--dur) var(--ease-out),
              transform var(--dur) var(--ease-out);
}

.enter-up-lg {
  transition-duration: var(--dur-slow);
}

/* ------------------------------------------------------------
   Stagger delays (gentle)
   ------------------------------------------------------------ */
[data-delay="0"]   { transition-delay: 0s; }
[data-delay=".08"] { transition-delay: 0.06s; }
[data-delay=".1"]  { transition-delay: 0.08s; }
[data-delay=".15"] { transition-delay: 0.12s; }
[data-delay=".2"]  { transition-delay: 0.16s; }
[data-delay=".25"] { transition-delay: 0.2s; }
[data-delay=".3"]  { transition-delay: 0.24s; }
[data-delay=".4"]  { transition-delay: 0.3s; }
[data-delay=".5"]  { transition-delay: 0.36s; }
[data-delay=".6"]  { transition-delay: 0.42s; }
[data-delay=".7"]  { transition-delay: 0.48s; }
[data-delay=".8"]  { transition-delay: 0.54s; }
[data-delay="1"]   { transition-delay: 0.65s; }

.services-list .service-item:nth-child(1) { transition-delay: 0.05s; }
.services-list .service-item:nth-child(2) { transition-delay: 0.12s; }
.services-list .service-item:nth-child(3) { transition-delay: 0.19s; }
.services-list .service-item:nth-child(4) { transition-delay: 0.26s; }
.services-list .service-item:nth-child(5) { transition-delay: 0.33s; }
.services-list .service-item:nth-child(6) { transition-delay: 0.40s; }

/* ------------------------------------------------------------
   Hero entrance (one-time, soft)
   ------------------------------------------------------------ */
.hero-content .elabel {
  opacity: 0;
  animation: soft-fade 1s var(--ease-out) 0.25s forwards;
}

.hero-content .h1 {
  opacity: 0;
  transform: translateY(22px);
  animation: soft-rise 1.15s var(--ease-out) 0.4s forwards;
}

.hero-content .hero-sub {
  opacity: 0;
  animation: soft-fade 1s var(--ease-out) forwards;
}

.hero-content .hero-sub:nth-of-type(1) { animation-delay: 0.85s; }
.hero-content .hero-sub:nth-of-type(2) { animation-delay: 1.1s; }

@keyframes soft-fade {
  to { opacity: 1; }
}

@keyframes soft-rise {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.scroll-hint {
  animation: hint-pulse 3s ease-in-out infinite;
}

@keyframes hint-pulse {
  0%, 100% { opacity: 0.4; }
  50%      { opacity: 0.75; }
}

/* ------------------------------------------------------------
   CTA hover — refined, no jump
   ------------------------------------------------------------ */
.cta-btn,
.nav-cta,
.link-arrow,
.f-submit {
  transition: transform 0.35s var(--ease-out),
              opacity 0.35s var(--ease-out);
}

.cta-btn:hover,
.nav-cta:hover {
  transform: translateY(-2px);
}

.cta-btn:active,
.nav-cta:active {
  transform: translateY(0);
  transition-duration: 0.12s;
}

.link-arrow svg {
  transition: transform 0.35s var(--ease-out);
}

.link-arrow:hover svg {
  transform: translate(2px, -2px);
}

/* ------------------------------------------------------------
   Image scale — extremely subtle
   ------------------------------------------------------------ */
.cinema-inner img {
  transform: scale(1.03);
  transition: transform 1.6s var(--ease-out);
}

.section.in-view .cinema-inner img,
.home-sec.in-view .cinema-inner img,
.hero.in-view .cinema-inner img {
  transform: scale(1);
}

/* ------------------------------------------------------------
   Reduced motion
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal,
  .reveal-x,
  .reveal-xr,
  .enter-up,
  .enter-up-lg,
  .enter-fade,
  .service-item,
  .outcome,
  .role,
  .founder-text,
  .hero-content .elabel,
  .hero-content .h1,
  .hero-content .hero-sub {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* ------------------------------------------------------------
   Mobile safety — even smaller movement
   ------------------------------------------------------------ */
@media (max-width: 768px) {
  .reveal,
  .enter-up,
  .service-item,
  .outcome,
  .role,
  .founder-text {
    transform: translateY(12px);
  }

  .enter-up-lg {
    transform: translateY(18px);
  }

  .reveal-x,
  .reveal-xr {
    transform: translateX(0);
  }
}




/* ============================================================
   FOUNDER SECTION — force visibility & contrast
   This section intentionally breaks the dark cinematic rhythm
   ============================================================ */
.founder-section {
  background: #1c1b19 !important;
  color: #e8e4dc !important;
}

.founder-section .elabel {
  color: #9a958c !important;
  opacity: 1 !important;
  transform: none !important;
}

.founder-section h2,
.founder-section .h2 {
  color: #f0ebe3 !important;
  opacity: 1 !important;
  transform: none !important;
}

.founder-section .founder-text,
.founder-section p {
  color: #d4cfc6 !important;
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

.founder-section .no-animate {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}
