/* Lighthouse — hero resolve visual (right column) */
/* --flag is defined once in base.css :root (duplicate removed) */

/* periwinkle eyebrow */
.iie-eyebrow { display: block; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--periwinkle); margin-bottom: 22px; opacity: 0; transform: translateY(10px); }
.iie.loaded .iie-eyebrow { opacity: 1; transform: none; transition: opacity 760ms var(--ease-out-quint) 120ms, transform 760ms var(--ease-out-quint) 120ms; }
body.frozen .iie-eyebrow { opacity: 1 !important; transform: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) { .iie-eyebrow { opacity: 1; transform: none; } }

/* atmospheric light beam — positioned by JS to pass straight through the fragment */
.iie-beam-v { position: absolute; top: 0; bottom: 0; width: 2px; z-index: 1; pointer-events: none; transform: translateX(-50%);
  background: linear-gradient(to bottom, transparent, rgba(255,243,200,0.45) 28%, rgba(202,169,11,0.6) 50%, rgba(255,243,200,0.45) 72%, transparent);
  box-shadow: 0 0 26px 5px rgba(202,169,11,0.13); }
.iie-beam-glow { position: absolute; top: 0; bottom: 0; width: 320px; z-index: 0; pointer-events: none; transform: translateX(-50%);
  background: radial-gradient(46% 54% at 50% 50%, rgba(202,169,11,0.07), transparent 68%); }
/* beam unchanged — full section height */

/* M3 SIGNATURE first light: the beam DESCENDS from the top edge to the
   fragment over 0.15-0.75s (clip-path, never scaleY - scaling would stretch
   the gradient stops and clobber the load-bearing translateX(-50%)); the
   atmosphere canvas fades up alongside; beacon.js ignites at the strike
   (setTimeout 700ms). Plays once; no-JS renders the full beam. */
html.js .iie:not(.loaded) .iie-beam-v,
html.js .iie:not(.loaded) .iie-beam-glow { clip-path: inset(0 0 100% 0); }
html.js .iie:not(.loaded) .iie-beam { opacity: 0; }
.iie.loaded .iie-beam-v, .iie.loaded .iie-beam-glow { animation: iieBeamDescend 600ms var(--ease-out-quint) 150ms both; }
.iie.loaded .iie-beam { animation: iieBeamFade 800ms var(--ease-out-quint) both; }
@keyframes iieBeamDescend { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes iieBeamFade { from { opacity: 0; } }
body.frozen .iie-beam-v, body.frozen .iie-beam-glow { clip-path: none !important; opacity: 1 !important; animation: none !important; }
body.frozen .iie-beam { opacity: 1 !important; animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  .iie-beam-v, .iie-beam-glow { clip-path: none !important; opacity: 1 !important; animation: none !important; }
  .iie-beam { opacity: 1 !important; animation: none !important; }
}

.hresolve { width: 100%; display: flex; flex-direction: column; gap: 20px; }

/* M2 kicker enrolment: enters after the lead (0.95s), its 18px marigold dash
   drawing left to right over 300ms as it arrives */
html.js .iie:not(.loaded) .iie-kicker { opacity: 0; }
.iie.loaded .iie-kicker { animation: iieUp 0.8s var(--ease-out-quint) 0.95s both; }
html.js .iie-kicker::before { transform: scaleX(0); transform-origin: left; }
.iie.loaded .iie-kicker::before { transform: scaleX(1); transition: transform 300ms var(--ease-out-quint) 0.95s; }
body.frozen .iie-kicker { opacity: 1 !important; animation: none !important; transform: none !important; }
body.frozen .iie-kicker::before { transform: scaleX(1) !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  .iie-kicker { opacity: 1 !important; animation: none !important; transform: none !important; }
  .iie-kicker::before { transform: scaleX(1) !important; transition: none !important; }
}

/* hero CTA - lands last (M2 reading order) */
.iie-cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; opacity: 0; transform: translateY(10px); }
.iie.loaded .iie-cta { opacity: 1; transform: none; transition: opacity 760ms var(--ease-out-quint) 1150ms, transform 760ms var(--ease-out-quint) 1150ms; }
body.frozen .iie-cta { opacity: 1 !important; transform: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) { .iie-cta { opacity: 1; transform: none; } }
.hr-stage { position: relative; width: 100%; height: 348px; }
.hr-stage canvas { display: block; width: 100%; height: 100%; }

/* audit: the retired .hr-report / .hr-verdict / .hr-flags "report card" suite
   (superseded by the beacon web) had zero consumers — removed. .hr-stage stays. */

@media (max-width: 1080px) { .hr-stage { height: 300px; } }
@media (max-width: 560px) { .hr-stage { height: 250px; } }