/* Hide ornament strokes until draw script measures real path lengths. */
svg.work-hero__ornament:not(.is-drawn) path,
svg.work-hero__ornament:not(.is-drawn) line,
svg.hero__mark-ornament:not(.is-drawn) path,
svg.hero__mark-ornament:not(.is-drawn) line,
svg.adirondacks-hero__ornament:not(.is-drawn) path,
svg.adirondacks-hero__ornament:not(.is-drawn) line,
.adirondacks-hero__ornament svg:not(.is-drawn) path,
.adirondacks-hero__ornament svg:not(.is-drawn) line {
  stroke-dasharray: 800;
  stroke-dashoffset: 800;
}

@media (prefers-reduced-motion: reduce) {
  svg.work-hero__ornament:not(.is-drawn) path,
  svg.work-hero__ornament:not(.is-drawn) line,
  svg.hero__mark-ornament:not(.is-drawn) path,
  svg.hero__mark-ornament:not(.is-drawn) line,
  svg.adirondacks-hero__ornament:not(.is-drawn) path,
  svg.adirondacks-hero__ornament:not(.is-drawn) line,
  .adirondacks-hero__ornament svg:not(.is-drawn) path,
  .adirondacks-hero__ornament svg:not(.is-drawn) line {
    stroke-dasharray: none;
    stroke-dashoffset: 0;
  }
}

/* —— Enzy featured hero: browser frame draw + screenshot reveal —— */
.hero__enzy-media[data-hero-anim] {
  position: relative;
  overflow: clip;
  border-color: transparent;
}

.hero__enzy-media[data-hero-anim] .browser-chrome {
  opacity: 0;
  transform: translateY(-4px);
}

.hero__enzy-media[data-hero-anim] > img {
  opacity: 0;
  filter: blur(18px) brightness(1.2) saturate(0.75);
  transform: scale(1.06);
  clip-path: inset(0 0 100% 0);
  transform-origin: center top;
  will-change: opacity, filter, transform, clip-path;
}

.hero__enzy-media[data-hero-anim] .hero-frame-draw {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  pointer-events: none;
  z-index: 2;
  overflow: visible;
}

.hero__enzy-media[data-hero-anim] .hero-frame-draw path,
.hero__enzy-media[data-hero-anim] .hero-frame-draw line,
.hero__enzy-media[data-hero-anim] .hero-frame-draw rect,
.hero__enzy-media[data-hero-anim] .hero-frame-draw circle {
  fill: none;
  stroke: color-mix(in oklch, var(--text-light-muted, #8fa3b5) 70%, transparent);
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hero__enzy-media.is-chrome-in .browser-chrome {
  opacity: 1;
  transform: none;
  transition:
    opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero__enzy-media.is-frame-solid {
  border-color: color-mix(in oklch, var(--secondary) 72%, transparent);
  transition: border-color 0.35s ease;
}

.hero__enzy-media.is-frame-solid .hero-frame-draw {
  opacity: 0;
  transition: opacity 0.4s ease;
}

.hero__enzy-media.is-shot-in > img {
  opacity: 1;
  filter: blur(0) brightness(1) saturate(1);
  transform: scale(1);
  clip-path: inset(0 0 0 0);
  transition:
    opacity 1s cubic-bezier(0.22, 1, 0.36, 1),
    filter 1.1s cubic-bezier(0.22, 1, 0.36, 1),
    transform 1.1s cubic-bezier(0.22, 1, 0.36, 1),
    clip-path 1s cubic-bezier(0.22, 1, 0.36, 1);
}

.hero .hero__enzy > .hero__enzy-meta,
.hero .hero__enzy > .hero__enzy-title,
.hero .hero__enzy > .hero__enzy-body,
.hero .hero__enzy > .hero__enzy-link,
.hero .hero__enzy > a {
  opacity: 0;
  transform: translateY(0.75rem);
}

.hero .hero__enzy.is-copy-in > .hero__enzy-meta,
.hero .hero__enzy.is-copy-in > .hero__enzy-title,
.hero .hero__enzy.is-copy-in > .hero__enzy-body,
.hero .hero__enzy.is-copy-in > .hero__enzy-link,
.hero .hero__enzy.is-copy-in > a {
  opacity: 1;
  transform: none;
  transition:
    opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.hero .hero__enzy.is-copy-in > .hero__enzy-meta {
  transition-delay: 0ms;
}

.hero .hero__enzy.is-copy-in > .hero__enzy-title {
  transition-delay: 90ms;
}

.hero .hero__enzy.is-copy-in > .hero__enzy-body {
  transition-delay: 160ms;
}

.hero .hero__enzy.is-copy-in > .hero__enzy-link,
.hero .hero__enzy.is-copy-in > a {
  transition-delay: 230ms;
}

@media (prefers-reduced-motion: reduce) {
  .hero__enzy-media[data-hero-anim],
  .hero__enzy-media[data-hero-anim] .browser-chrome,
  .hero__enzy-media[data-hero-anim] > img {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    clip-path: none !important;
    border-color: color-mix(in oklch, var(--secondary) 72%, transparent) !important;
  }

  .hero__enzy-media[data-hero-anim] .hero-frame-draw {
    display: none !important;
  }

  .hero .hero__enzy > .hero__enzy-meta,
  .hero .hero__enzy > .hero__enzy-title,
  .hero .hero__enzy > .hero__enzy-body,
  .hero .hero__enzy > .hero__enzy-link,
  .hero .hero__enzy > a {
    opacity: 1 !important;
    transform: none !important;
  }
}