/* Komoda Bright — smooth fade-in motion */

:root {
  --motion-dur: 1.1s;
  --motion-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

[data-motion] {
  opacity: 0;
}

/* opacity は animation forwards で制御（即時 opacity:1 は点滅の原因） */
[data-motion].motion-visible {
  animation: mFadeIn var(--motion-dur) var(--motion-ease) forwards;
  animation-delay: var(--motion-delay, 0ms);
}

[data-motion="line-grow"].motion-visible {
  animation: mFadeIn 0.9s var(--motion-ease) forwards;
  animation-delay: var(--motion-delay, 0ms);
}

/* Stagger container */
[data-motion-stagger] > * {
  opacity: 0;
}

[data-motion-stagger].motion-visible > * {
  animation: mFadeIn 1s var(--motion-ease) forwards;
}

[data-motion-stagger].motion-visible > *:nth-child(1) { animation-delay: 0ms; }
[data-motion-stagger].motion-visible > *:nth-child(2) { animation-delay: 80ms; }
[data-motion-stagger].motion-visible > *:nth-child(3) { animation-delay: 160ms; }
[data-motion-stagger].motion-visible > *:nth-child(4) { animation-delay: 240ms; }
[data-motion-stagger].motion-visible > *:nth-child(5) { animation-delay: 320ms; }
[data-motion-stagger].motion-visible > *:nth-child(6) { animation-delay: 400ms; }
[data-motion-stagger].motion-visible > *:nth-child(7) { animation-delay: 480ms; }
[data-motion-stagger].motion-visible > *:nth-child(8) { animation-delay: 560ms; }

/* Hero entrance (page load) — staggered fade */
.hero .hero-text-panel[data-motion],
.hero .hero-text-panel [data-motion] {
  opacity: 0;
}

.hero.is-loaded .hero-text-panel[data-motion="hero-in"] {
  animation: mFadeIn 1.2s var(--motion-ease) 0.1s forwards;
}

.hero.is-loaded .hero-text-panel > [data-motion]:nth-child(1) {
  animation: mFadeIn 1.2s var(--motion-ease) 0.3s forwards;
}

.hero.is-loaded .hero-text-panel > [data-motion]:nth-child(2) {
  animation: mFadeIn 1.2s var(--motion-ease) 0.5s forwards;
}

/* EC flow — animate board only; keep inner layout stable */
.ec-flow-board .ec-flow,
.ec-flow-board .ec-flow-node,
.ec-flow-board .ec-flow-arrow {
  opacity: 1 !important;
  animation: none !important;
}

.ec-flow-board[data-motion] {
  transform: none;
}
.komoda-bright-theme .reveal:not([data-motion]) {
  opacity: 0;
  transition: opacity var(--motion-dur) var(--motion-ease);
}

.komoda-bright-theme .reveal.visible:not([data-motion]) {
  opacity: 1;
}

@keyframes mFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Subtle hover on visible cards */
.komoda-bright-theme .service-card.motion-visible:hover,
.komoda-bright-theme .creed-card.motion-visible:hover {
  transform: translateY(-4px);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  box-shadow: 0 16px 40px rgba(30, 74, 122, 0.12);
}

@media (prefers-reduced-motion: reduce) {
  [data-motion],
  [data-motion-stagger] > * {
    opacity: 1 !important;
    animation: none !important;
    transform: none !important;
    filter: none !important;
  }
}

/* Motion disabled — show content immediately */
.komoda-motion-off [data-motion],
.komoda-motion-off [data-motion-stagger] > *,
.komoda-motion-off .reveal,
.komoda-motion-off .reveal-hero,
.komoda-motion-off .hero [data-motion="hero-in"] {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  filter: none !important;
  transition: none !important;
}
