/* Editorial motion: ease-out enters, stagger, no layout-affecting keyframes on critical UI */

.reveal {
  opacity: 0;
  transform: translate3d(0, 1.25rem, 0);
  transition:
    opacity var(--dur-hero) var(--ease-fade),
    transform var(--dur-hero) var(--ease-fade);
}

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

/* Hero copy: cascade after block reveals */
.hero-inner.reveal > * {
  opacity: 0;
  transform: translate3d(0, 0.85rem, 0);
  transition:
    opacity calc(var(--dur-hero) * 0.88) var(--ease-fade),
    transform calc(var(--dur-hero) * 0.88) var(--ease-fade);
}

.hero-inner.reveal.is-visible > * {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.hero-inner.reveal.is-visible > *:nth-child(1) {
  transition-delay: 0.05s;
}
.hero-inner.reveal.is-visible > *:nth-child(2) {
  transition-delay: 0.11s;
}
.hero-inner.reveal.is-visible > *:nth-child(3) {
  transition-delay: 0.17s;
}
.hero-inner.reveal.is-visible > *:nth-child(4) {
  transition-delay: 0.23s;
}
.hero-inner.reveal.is-visible > *:nth-child(5) {
  transition-delay: 0.29s;
}

/* Section labels: subtle fade with parent */
.section-head .section-label {
  transition: opacity var(--dur-mid) var(--ease-out),
    letter-spacing var(--dur-slow) var(--ease-out);
}

.reveal:not(.is-visible) .section-label {
  opacity: 0.35;
  letter-spacing: 0.28em;
}

.reveal.is-visible .section-label {
  opacity: 1;
  letter-spacing: 0.22em;
}

/* Gallery / featured tiles enter */
.gallery-item--enter {
  opacity: 0;
  transform: translate3d(0, 22px, 0) scale(0.965);
  transition:
    opacity var(--dur-entrance) var(--ease-fade),
    transform var(--dur-entrance) var(--ease-fade),
    border-color var(--transition),
    box-shadow var(--dur-mid) var(--ease-fade);
  transition-delay: calc(var(--enter-i, 0) * var(--stagger));
}

.gallery-item--enter.is-shown {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.gallery-item--enter:hover img,
.gallery-item--enter:focus-visible img {
  transform: scale(1.045);
}

.gallery-item--enter img {
  transition: transform 420ms var(--ease-out);
}

/* Review cards */
.review-card--enter {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition:
    opacity var(--dur-entrance) var(--ease-fade),
    transform var(--dur-entrance) var(--ease-fade),
    border-color var(--transition);
  transition-delay: calc(var(--enter-i, 0) * var(--stagger));
}

.review-card--enter.is-shown {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* Section titles: stagger h2/p after label (home — .section.reveal) */
.section.reveal .section-head > h2,
.section.reveal .section-head > p {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity var(--dur-entrance) var(--ease-fade),
    transform var(--dur-entrance) var(--ease-fade);
}

.section.reveal.is-visible .section-head > h2,
.section.reveal.is-visible .section-head > p {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.section.reveal.is-visible .section-head > h2 {
  transition-delay: 0.1s;
}

.section.reveal.is-visible .section-head > p {
  transition-delay: 0.2s;
}

/* Featured intro: title + deck (reveal on header, not whole section — keeps backdrop solid) */
.featured-showcase-intro.reveal .featured-showcase-intro__text > h2,
.featured-showcase-intro.reveal .featured-showcase-intro__text > p {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity var(--dur-entrance) var(--ease-fade),
    transform var(--dur-entrance) var(--ease-fade);
}

.featured-showcase-intro.reveal.is-visible .featured-showcase-intro__text > h2,
.featured-showcase-intro.reveal.is-visible .featured-showcase-intro__text > p {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.featured-showcase-intro.reveal.is-visible .featured-showcase-intro__text > h2 {
  transition-delay: 0.1s;
}

.featured-showcase-intro.reveal.is-visible .featured-showcase-intro__text > p {
  transition-delay: 0.2s;
}

/* Hero wordmark (SVG lockup) */
.hero .hero-wordmark.reveal {
  opacity: 0.96;
  transform: translate3d(0, 10px, 0);
  transition:
    opacity var(--dur-entrance) var(--ease-fade),
    transform var(--dur-entrance) var(--ease-fade);
}

.hero .hero-wordmark.reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition-delay: 0.06s;
}

/* Gallery / contact: .section-head.reveal */
.section-head.reveal > *:not(.section-label) {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity var(--dur-entrance) var(--ease-fade),
    transform var(--dur-entrance) var(--ease-fade);
}

.section-head.reveal.is-visible > *:not(.section-label) {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.section-head.reveal.is-visible > *:nth-child(2) {
  transition-delay: 0.1s;
}

.section-head.reveal.is-visible > *:nth-child(3) {
  transition-delay: 0.2s;
}

/* Filter chips: pop in when toolbar scrolls into view */
.filter-bar.reveal .filter-btn {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition:
    opacity var(--dur-mid) var(--ease-out),
    transform var(--dur-mid) var(--ease-out),
    border-color var(--dur-mid) var(--ease-out),
    color var(--dur-mid) var(--ease-out),
    background var(--dur-mid) var(--ease-out),
    box-shadow var(--dur-mid) var(--ease-out);
}

.filter-bar.reveal.is-visible .filter-btn {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.filter-bar.reveal.is-visible .filter-btn:nth-child(1) {
  transition-delay: 0.03s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(2) {
  transition-delay: 0.07s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(3) {
  transition-delay: 0.11s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(4) {
  transition-delay: 0.15s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(5) {
  transition-delay: 0.19s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(6) {
  transition-delay: 0.23s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(7) {
  transition-delay: 0.27s;
}
.filter-bar.reveal.is-visible .filter-btn:nth-child(8) {
  transition-delay: 0.31s;
}

.filter-bar.reveal.is-visible .filter-btn:hover,
.filter-bar.reveal.is-visible .filter-btn:focus-visible {
  transform: translate3d(0, -2px, 0);
}

/* Sticky header depth */
.site-header {
  transition:
    padding var(--dur-mid) var(--ease-out),
    box-shadow var(--dur-mid) var(--ease-out),
    background-color var(--dur-mid) var(--ease-out);
}

.site-header.is-scrolled {
  padding-top: max(0.45rem, env(safe-area-inset-top, 0px));
  padding-bottom: 0.45rem;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(82, 183, 136, 0.1);
  background: rgba(3, 8, 6, 0.78);
}

/* Brand mark */
.site-logo {
  transition:
    color var(--dur-mid) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring);
}

.site-logo:hover {
  transform: translateY(-2px);
}

.site-logo:active {
  transform: translateY(0);
  transition-duration: 80ms;
}

/* Footer links */
.site-footer a {
  transition:
    color var(--dur-mid) var(--ease-out),
    transform var(--dur-fast) var(--ease-out);
}

.site-footer a:hover {
  transform: translateY(-2px);
}

/* Session cards (home) */
.services-grid li {
  transition:
    border-color var(--dur-mid) var(--ease-out),
    color var(--dur-mid) var(--ease-out),
    transform var(--dur-mid) var(--ease-out),
    box-shadow var(--dur-mid) var(--ease-out);
}

.services-grid li:hover {
  transform: translate3d(0, -5px, 0);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38);
}

/* Contact fields: soft lift on focus */
.contact-form input,
.contact-form textarea {
  transition:
    border-color var(--dur-mid) var(--ease-out),
    box-shadow var(--dur-mid) var(--ease-out);
}

.contact-form input:focus-visible,
.contact-form textarea:focus-visible {
  border-color: var(--color-accent);
  box-shadow:
    0 0 0 1px rgba(64, 145, 108, 0.5),
    0 10px 28px rgba(0, 0, 0, 0.28);
  outline: none;
}

/* Primary nav: underline grows on hover/focus/current */
.site-nav a {
  position: relative;
}

.site-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.2rem;
  width: 100%;
  height: 1px;
  background: currentColor;
  opacity: 0.85;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--dur-mid) var(--ease-out);
}

.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav a[aria-current="page"]::after {
  transform: scaleX(1);
}

/* Buttons: lift + press (transform only; stacks after components.css) */
.btn {
  transition:
    background var(--dur-mid) var(--ease-out),
    border-color var(--dur-mid) var(--ease-out),
    color var(--dur-mid) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring),
    box-shadow var(--dur-mid) var(--ease-out);
}

.btn:hover,
.btn:focus-visible {
  transform: translateY(-2px);
  box-shadow:
    0 12px 32px rgba(5, 8, 7, 0.55),
    0 0 48px -16px rgba(82, 183, 136, 0.4);
}

.btn:active {
  transform: translateY(0);
  box-shadow: 0 4px 14px rgba(5, 8, 7, 0.35);
  transition-duration: 80ms;
}

.btn-ghost:hover,
.btn-ghost:focus-visible {
  box-shadow: none;
}

.btn-ghost:active {
  box-shadow: none;
}

/* Hero background: slow parallax-like drift (decorative) */
@media (prefers-reduced-motion: no-preference) {
  @keyframes hero-photo-drift {
    from {
      transform: scale(1.04);
    }
    to {
      transform: scale(1.08);
    }
  }

  .hero--has-photo::after,
  .section--featured-forest.section--featured-has-photo .featured-forest-photo {
    animation: hero-photo-drift 28s ease-in-out infinite alternate;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero--has-photo::after,
  .section--featured-forest.section--featured-has-photo .featured-forest-photo {
    animation: none !important;
  }

  .hero-inner.reveal > * {
    transition-delay: 0s !important;
  }

  .gallery-item--enter,
  .review-card--enter {
    transition-delay: 0s !important;
    opacity: 1;
    transform: none;
  }

  .section.reveal .section-head > h2,
  .section.reveal .section-head > p,
  .featured-showcase-intro.reveal .featured-showcase-intro__text > h2,
  .featured-showcase-intro.reveal .featured-showcase-intro__text > p,
  .section-head.reveal > *:not(.section-label) {
    opacity: 1 !important;
    transform: none !important;
    transition-delay: 0s !important;
  }

  .hero .hero-wordmark.reveal,
  .hero .hero-wordmark.reveal.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition-delay: 0s !important;
  }

  .featured-showcase-intro.reveal .section-label,
  .featured-showcase-intro.reveal.is-visible .section-label {
    opacity: 1 !important;
    letter-spacing: 0.22em !important;
  }

  .filter-bar.reveal .filter-btn {
    opacity: 1 !important;
    transform: none !important;
    transition-delay: 0s !important;
  }

  .site-header.is-scrolled {
    box-shadow: none;
  }

  .site-logo:hover,
  .site-footer a:hover,
  .services-grid li:hover {
    transform: none;
  }
}
