/* Hero mark — fixed-grid Ben-Day / halftone treatment from the supplied references. */
.hero-minimal-stage.trilamp-ready .hero-logo-lockup {
  top: 54% !important;
  width: clamp(620px, 51vw, 900px) !important;
  aspect-ratio: 2.84 / 1 !important;
  transform: translateX(-50%) !important;
  filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .54));
}

.hero-minimal-stage.trilamp-ready .hero-logo-lockup img,
.hero-minimal-stage.trilamp-ready[data-hero-theme="mono-dark"] .hero-logo-lockup img,
.hero-minimal-stage.trilamp-ready[data-hero-theme="chromatic"] .hero-logo-lockup img {
  content: url("/assets/logo-tight-halftone-transparent-v2.png?v=20260827-7") !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1 !important;
  filter: contrast(1.18) brightness(1.08) !important;
  image-rendering: auto;
}

html[data-site-theme="mono-light"] .hero-minimal-stage.trilamp-ready .hero-logo-lockup img,
.hero-minimal-stage.trilamp-ready[data-hero-theme="mono-light"] .hero-logo-lockup img {
  filter: brightness(0) contrast(1.2) !important;
}

html[data-site-theme="mono-light"] .hero-minimal-stage.trilamp-ready .hero-logo-lockup,
.hero-minimal-stage.trilamp-ready[data-hero-theme="mono-light"] .hero-logo-lockup {
  filter: none !important;
}

.hero-minimal-stage.trilamp-ready .hero-logo-lockup::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 23% 5% 20% !important;
  pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, .22) 0 1.2px, transparent 1.5px) 0 0 / 11px 11px;
  opacity: .22;
  filter: blur(.25px);
  -webkit-mask-image: radial-gradient(ellipse, #000 0 28%, transparent 72%);
  mask-image: radial-gradient(ellipse, #000 0 28%, transparent 72%);
}

html[data-site-theme="mono-light"] .hero-minimal-stage.trilamp-ready .hero-logo-lockup::before,
.hero-minimal-stage.trilamp-ready[data-hero-theme="mono-light"] .hero-logo-lockup::before {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  filter: none !important;
}

@media (max-width: 700px) {
  .hero-minimal-stage.trilamp-ready .hero-logo-lockup {
    top: 52% !important;
    width: min(94vw, 560px) !important;
  }

  .hero-minimal-stage.trilamp-ready .hero-logo-lockup::before {
    background-size: 8px 8px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-minimal-stage.trilamp-ready .hero-logo-lockup img {
    animation: heroHalftoneResolve 1.05s cubic-bezier(.16, 1, .3, 1) both !important;
  }
}

@keyframes heroHalftoneResolve {
  from { opacity: 0; transform: scale(.965); filter: contrast(1.05) brightness(.78) blur(7px); }
  to { opacity: 1; transform: scale(1); }
}

/* Jimi arrives as five offset print strips, then resolves into one portrait. */
.hero-minimal-stage.trilamp-ready .hero-jimi-arrival {
  position: absolute;
  z-index: 6;
  left: 50%;
  top: 50%;
  width: min(72vw, 1120px);
  aspect-ratio: 3 / 2;
  transform: translate(-50%, -50%);
  overflow: hidden;
  pointer-events: none;
  opacity: .76;
  mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(90deg, #000 0 62%, transparent 94%);
  mask-image: linear-gradient(90deg, #000 0 62%, transparent 94%);
}

.hero-minimal-stage.trilamp-ready .hero-jimi-arrival__slice {
  --from-x: calc(-112vw - (var(--slice) * 5vw));
  position: absolute;
  inset: 0;
  overflow: hidden;
  clip-path: inset(0 calc((4 - var(--slice)) * 20%) 0 calc(var(--slice) * 20%));
  animation: jimiStripArrival 1.45s cubic-bezier(.16, 1, .3, 1) both;
  animation-delay: calc(.15s + (var(--slice) * .12s));
}

.hero-minimal-stage.trilamp-ready .hero-jimi-arrival__slice img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: contrast(1.14);
}

.hero-minimal-stage.trilamp-ready[data-hero-theme="mono-light"] .hero-jimi-arrival,
html[data-site-theme="mono-light"] .hero-minimal-stage.trilamp-ready .hero-jimi-arrival {
  mix-blend-mode: multiply;
  filter: invert(1);
  opacity: .7;
}

@keyframes jimiStripArrival {
  0% { transform: translate3d(var(--from-x), 0, 0); opacity: 0; }
  34% { opacity: .22; }
  72% { transform: translate3d(calc((4 - var(--slice)) * -7px), 0, 0); opacity: 1; }
  100% { transform: translate3d(0, 0, 0); opacity: 1; }
}

@media (max-width: 700px) {
  .hero-minimal-stage.trilamp-ready .hero-jimi-arrival {
    left: 44%;
    top: 51%;
    width: 112vw;
    opacity: .58;
  }
}

/* Alternating frontal portraits: each print is assembled and removed strip by strip. */
.hero-minimal-stage.trilamp-ready .hero-portrait-sequence {
  inset: 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  transform: none;
  opacity: 1;
  -webkit-mask-image: none;
  mask-image: none;
}

.hero-minimal-stage.trilamp-ready .hero-portrait {
  position: absolute;
  inset: 0;
}

.hero-minimal-stage.trilamp-ready .hero-portrait::before {
  content: none;
  display: none;
}

.hero-minimal-stage.trilamp-ready .hero-portrait--jimi::before {
  background-image: url("/assets/wide/jimi-pink-dots-wide.png?v=20260828-1");
  background-size: 300% 200%;
  background-position: 50% 0;
}

.hero-minimal-stage.trilamp-ready .hero-portrait--amy::before {
  background-image: url("/assets/wide/amy-dots-wide.png?v=20260828-1");
  background-position: center;
}

.hero-minimal-stage.trilamp-ready .hero-portrait .hero-jimi-arrival__slice {
  --from-x: calc(-132vw - (var(--slice) * 5vw));
  clip-path: inset(calc(var(--slice) * 12.5%) 0 calc((7 - var(--slice)) * 12.5%) 0);
  opacity: 0;
  transform: translate3d(var(--from-x), 0, 0);
  animation: none;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero-minimal-stage.trilamp-ready .hero-portrait .hero-jimi-arrival__slice img {
  display: none;
}

.hero-minimal-stage.trilamp-ready .hero-portrait--jimi .hero-jimi-arrival__slice {
  background-image: url("/assets/wide/jimi-pink-dots-wide.png?v=20260828-1");
  background-size: 300% 200%;
  background-position: 50% 0;
}

.hero-minimal-stage.trilamp-ready .hero-portrait--amy .hero-jimi-arrival__slice {
  background-image: url("/assets/wide/amy-dots-wide.png?v=20260828-1");
  background-position: center;
}

.hero-minimal-stage.trilamp-ready .hero-portrait.is-active::before {
  animation: none;
}

.hero-minimal-stage.trilamp-ready .hero-portrait.is-active .hero-jimi-arrival__slice {
  animation: heroPortraitStripCycle 8s cubic-bezier(.16, 1, .3, 1) both;
  animation-delay: calc(var(--slice) * .12s);
}

.hero-minimal-stage.trilamp-ready .hero-portrait img {
  object-fit: cover;
  object-position: left center;
  filter: grayscale(1) contrast(1.12) brightness(1.18);
}

.hero-minimal-stage.trilamp-ready .hero-portrait--jimi img {
  width: 138%;
  height: 138%;
  max-width: none;
  object-fit: cover;
  object-position: 18% center;
  transform: translate(-8%, -30%);
}

.hero-minimal-stage.trilamp-ready .hero-portrait--amy img {
  object-position: center;
}

@keyframes heroPortraitStripCycle {
  0% { transform: translate3d(var(--from-x), calc((var(--slice) - 3.5) * 12px), 0); opacity: 0; filter: blur(8px) brightness(1.8); }
  9% { opacity: 1; }
  25%, 66% { transform: translate3d(0, 0, 0); opacity: 1; filter: blur(0) brightness(1); }
  94% { transform: translate3d(calc(128vw + (var(--slice) * 5vw)), calc((3.5 - var(--slice)) * 12px), 0); opacity: .35; filter: blur(3px) brightness(1.35); }
  100% { transform: translate3d(calc(132vw + (var(--slice) * 5vw)), 0, 0); opacity: 0; filter: blur(8px) brightness(1.8); }
}

@keyframes heroPortraitGhostCycle {
  0%, 82% { opacity: .32; }
  100% { opacity: 0; }
}

@media (max-width: 700px) {
  .hero-minimal-stage.trilamp-ready .hero-portrait-sequence {
    inset: 0;
    width: 100%;
    height: 100%;
  }

  .hero-minimal-stage.trilamp-ready .hero-portrait img {
    object-fit: cover;
    object-position: center;
  }

  .hero-minimal-stage.trilamp-ready .hero-portrait--jimi img {
    width: 145%;
    height: 145%;
    max-width: none;
    object-fit: cover;
    object-position: 18% center;
    transform: translate(-9%, -34%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-minimal-stage.trilamp-ready .hero-portrait--amy { display: none; }
  .hero-minimal-stage.trilamp-ready .hero-portrait .hero-jimi-arrival__slice {
    animation: none;
    transform: none;
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-minimal-stage.trilamp-ready .hero-jimi-arrival__slice {
    animation: none;
  }
}

/* 2026-08-28 hero study: keep the former lamp/logo rig in the DOM, but park it
   outside the active composition so it can be restored without rebuilding it. */
.hero-minimal-stage.trilamp-ready .hero-trilamp,
.hero-minimal-stage.trilamp-ready .hero-logo-lockup,
.hero-minimal-stage.trilamp-ready .hero-master-pull {
  display: none !important;
}

.hero-minimal-stage.trilamp-ready .hero-jimi-arrival {
  z-index: 8;
  left: 50%;
  top: 51%;
  width: min(86vw, 1320px);
  opacity: .92;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 13%, #000 72%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 13%, #000 72%, transparent 100%);
}

@media (max-width: 700px) {
  .hero-minimal-stage.trilamp-ready .hero-jimi-arrival {
    left: 48%;
    top: 52%;
    width: 128vw;
  }
}

/* Final sequence geometry must win over the parked single-portrait study above. */
.hero-minimal-stage.trilamp-ready .hero-jimi-arrival.hero-portrait-sequence {
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transform: none !important;
}

@media (max-width: 700px) {
  .hero-minimal-stage.trilamp-ready .hero-jimi-arrival.hero-portrait-sequence {
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
}
