/**
 * OKachi — scroll reveal & hero motion (corporate, subtle)
 */

:root {
  --okachi-motion-duration: 0.6s;
  --okachi-motion-duration-slow: 0.75s;
  --okachi-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --okachi-motion-distance: 20px;
  --okachi-motion-stagger: 60ms;
  --okachi-motion-line-grow: 0.5s;
}

@keyframes okachi-fade-up {
  from {
    opacity: 0;
    transform: translate3d(0, var(--okachi-motion-distance), 0);
    filter: blur(6px);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}

@keyframes okachi-fade-up-soft {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes okachi-scale-in {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0) scale(0.99);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes okachi-line-grow {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@keyframes okachi-reveal-enter {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes okachi-reveal-enter-soft {
  from {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes okachi-reveal-enter-card {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0) scale(0.99);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes okachi-reveal-enter-title {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
    letter-spacing: 0.1em;
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    letter-spacing: var(--okachi-section-title-spacing, 0.06em);
  }
}

@keyframes okachi-reveal-enter-panel {
  from {
    opacity: 0;
    transform: translate3d(0, 16px, 0) scale(0.99);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes okachi-hero-scroll-line {
  from {
    opacity: 0;
    transform: scaleY(0);
  }

  to {
    opacity: 1;
    transform: scaleY(1);
  }
}

@keyframes okachi-reveal-enter-carousel {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* JS 適用前: サブページ見出しの一瞬表示を防ぐ（transform は付けない） */
html.okachi-js:not(.okachi-reveal-booted) body.okachi-news-shell .okachi-news-page__hero > .okachi-section-heading,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-news-shell .okachi-news-page__hero > .okachi-section-sub,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-news-shell .okachi-news-page__hero > .okachi-section-projects__sub,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-projects-shell .okachi-works-page__hero > .okachi-section-heading,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-projects-shell .okachi-works-page__hero > .okachi-section-sub,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-projects-shell .okachi-works-page__hero > .okachi-section-projects__sub,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-projects-shell .okachi-work-single__page-hero > .okachi-section-heading,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-projects-shell .okachi-work-single__page-hero > .okachi-section-sub,
html.okachi-js:not(.okachi-reveal-booted) body.okachi-projects-shell .okachi-work-single__page-hero > .okachi-section-projects__sub {
  opacity: 0;
}

/* --- Scroll reveal: 待機中は opacity のみ 0（位置は動かさない） --- */
html.okachi-js.okachi-motion .okachi-reveal:not(.is-inview) {
  opacity: 0;
  transform: none;
  filter: none;
  transition: none;
  will-change: opacity;
}

html.okachi-js.okachi-motion .okachi-reveal.is-inview {
  animation: okachi-reveal-enter var(--okachi-motion-duration) var(--okachi-motion-ease) var(--reveal-delay, 0ms) both;
  will-change: auto;
}

html.okachi-js.okachi-motion .okachi-reveal--soft.is-inview {
  animation-name: okachi-reveal-enter-soft;
}

html.okachi-js.okachi-motion .okachi-reveal--card.is-inview {
  animation-name: okachi-reveal-enter-card;
}

html.okachi-js.okachi-motion .okachi-reveal--section-title.is-inview {
  animation-name: okachi-reveal-enter-title;
}

html.okachi-js.okachi-motion .okachi-reveal--panel.is-inview {
  animation-name: okachi-reveal-enter-panel;
}

/* カルーセルは内部で transform するため、reveal は opacity のみ（実機でのちらつき防止のため無効化） */
html.okachi-js.okachi-motion .okachi-projects-carousel.okachi-reveal--panel.is-inview {
  animation: none !important;
  opacity: 1 !important;
  transform: none;
  filter: none;
}

html.okachi-js.okachi-motion .okachi-reveal--section-sub::before,
html.okachi-js.okachi-motion #value .okachi-value-sub::before {
  transform: scaleX(0);
  transform-origin: left center;
}

html.okachi-js.okachi-motion .okachi-reveal--section-sub.is-inview::before,
html.okachi-js.okachi-motion #value .okachi-reveal--section-sub.is-inview.okachi-value-sub::before {
  animation: okachi-line-grow var(--okachi-motion-line-grow) var(--okachi-motion-ease) calc(var(--reveal-delay, 0ms) + 80ms) both;
}

html.okachi-js.okachi-motion .okachi-company-about__sub.okachi-reveal--section-sub .okachi-company-about__sub-line {
  transform: scaleX(0);
  transform-origin: left center;
}

html.okachi-js.okachi-motion .okachi-company-about__sub.okachi-reveal--section-sub.is-inview .okachi-company-about__sub-line {
  animation: okachi-line-grow var(--okachi-motion-line-grow) var(--okachi-motion-ease) calc(var(--reveal-delay, 0ms) + 80ms) both;
}

/* --- Hero (first view) --- */
html.okachi-js.okachi-motion .okachi-hero-cover:not(.okachi-hero--motion-ready) .okachi-hero-title__line1,
html.okachi-js.okachi-motion .okachi-hero-cover:not(.okachi-hero--motion-ready) .okachi-hero-title__line2,
html.okachi-js.okachi-motion .okachi-hero-cover:not(.okachi-hero--motion-ready) .okachi-hero-cta-row,
html.okachi-js.okachi-motion .okachi-hero-cover:not(.okachi-hero--motion-ready) .okachi-news-card {
  opacity: 0;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-hero-title__line1 {
  display: inline-block;
  animation: okachi-fade-up var(--okachi-motion-duration-slow) var(--okachi-motion-ease) 0.12s both;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-hero-title__line2 {
  display: inline-block;
  animation: okachi-fade-up var(--okachi-motion-duration-slow) var(--okachi-motion-ease) 0.32s both;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-hero-cta-row {
  animation: okachi-fade-up-soft var(--okachi-motion-duration) var(--okachi-motion-ease) 0.4s both;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-card {
  animation: okachi-scale-in var(--okachi-motion-duration-slow) var(--okachi-motion-ease) 0.52s both;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-row--layout {
  animation: okachi-fade-up-soft var(--okachi-motion-duration) var(--okachi-motion-ease) both;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-row--layout:nth-child(1) {
  animation-delay: 0.62s;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-row--layout:nth-child(2) {
  animation-delay: 0.72s;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-row--layout:nth-child(3) {
  animation-delay: 0.82s;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-row--layout:nth-child(4) {
  animation-delay: 0.92s;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .okachi-news-card__more {
  animation: okachi-fade-up-soft var(--okachi-motion-duration) var(--okachi-motion-ease) 0.95s both;
}

html.okachi-js.okachi-motion .okachi-hero-cover:not(.okachi-hero--motion-ready) .wp-block-cover__inner-container::before,
html.okachi-js.okachi-motion .okachi-hero-cover:not(.okachi-hero--motion-ready) .wp-block-cover__inner-container::after {
  opacity: 0;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .wp-block-cover__inner-container::before {
  animation: okachi-fade-up-soft var(--okachi-motion-duration) var(--okachi-motion-ease) 0.58s both;
}

html.okachi-js.okachi-motion .okachi-hero-cover.okachi-hero--motion-ready .wp-block-cover__inner-container::after {
  transform-origin: top center;
  animation: okachi-hero-scroll-line 1.15s var(--okachi-motion-ease) 0.48s both;
}

/* Subpage heroes (company, contact intro) */
html.okachi-js.okachi-motion .okachi-company-hero:not(.okachi-page-hero--motion-ready) .okachi-company-hero__title,
html.okachi-js.okachi-motion .okachi-contact-page__intro:not(.okachi-page-hero--motion-ready) .okachi-contact-page__title,
html.okachi-js.okachi-motion .okachi-contact-page__intro:not(.okachi-page-hero--motion-ready) .okachi-contact-page__lead {
  opacity: 0;
}

html.okachi-js.okachi-motion .okachi-company-hero.okachi-page-hero--motion-ready .okachi-company-hero__title {
  animation: okachi-fade-up var(--okachi-motion-duration-slow) var(--okachi-motion-ease) 0.15s both;
}

html.okachi-js.okachi-motion .okachi-contact-page__intro.okachi-page-hero--motion-ready .okachi-contact-page__title {
  animation: okachi-fade-up var(--okachi-motion-duration-slow) var(--okachi-motion-ease) 0.15s both;
}

html.okachi-js.okachi-motion .okachi-contact-page__intro.okachi-page-hero--motion-ready .okachi-contact-page__lead {
  animation: okachi-fade-up-soft var(--okachi-motion-duration-slow) var(--okachi-motion-ease) 0.28s both;
}

/* Header: subtle depth on scroll */
body.okachi-landing-shell .site-header {
  transition:
    box-shadow 0.35s var(--okachi-motion-ease),
    background 0.35s var(--okachi-motion-ease),
    border-color 0.35s var(--okachi-motion-ease);
}

body.okachi-landing-shell .site-header.site-header--scrolled {
  box-shadow: 0 14px 40px rgba(11, 14, 24, 0.16);
}

/* SP メニューは reveal 対象外 */
@media (max-width: 782px) {
  html.okachi-js.okachi-motion .okachi-company-hero.okachi-page-hero--motion-ready .okachi-company-hero__title {
    animation-name: okachi-fade-up-soft;
  }

  html.okachi-js.okachi-motion .site-navigation * {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
  }

  html.okachi-js.okachi-motion .site-navigation {
    transition: opacity 0.2s ease, transform 0.25s ease, visibility 0.25s !important;
  }

  html.okachi-js.okachi-motion .site-navigation:not(.is-open) {
    opacity: 0 !important;
  }

  html.okachi-js.okachi-motion .site-navigation.is-open {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  html.okachi-js.okachi-motion .okachi-reveal,
  html.okachi-js.okachi-motion .okachi-hero-cover .okachi-hero-title__line1,
  html.okachi-js.okachi-motion .okachi-hero-cover .okachi-hero-title__line2,
  html.okachi-js.okachi-motion .okachi-hero-cover .okachi-hero-cta-row,
  html.okachi-js.okachi-motion .okachi-hero-cover .okachi-news-card,
  html.okachi-js.okachi-motion .okachi-hero-cover .okachi-news-row--layout,
  html.okachi-js.okachi-motion .okachi-hero-cover .okachi-news-card__more,
  html.okachi-js.okachi-motion .okachi-hero-cover .wp-block-cover__inner-container::before,
  html.okachi-js.okachi-motion .okachi-hero-cover .wp-block-cover__inner-container::after,
  html.okachi-js.okachi-motion .okachi-company-hero .okachi-company-hero__title,
  html.okachi-js.okachi-motion .okachi-contact-page__intro .okachi-contact-page__title,
  html.okachi-js.okachi-motion .okachi-contact-page__intro .okachi-contact-page__lead {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
    transition: none !important;
    letter-spacing: inherit !important;
  }

  html.okachi-js.okachi-motion .okachi-reveal--section-sub::before,
  html.okachi-js.okachi-motion #value .okachi-value-sub::before,
  html.okachi-js.okachi-motion .okachi-company-about__sub .okachi-company-about__sub-line {
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}
