/* Tron scrollytelling v3 — progressive enhancement.
   Without html.js-anim, everything stays fully solid/readable (SSR).
   Avoid filter/backdrop-filter thrash (TBT): opacity + wire only while assembling. */
.tron-page-shell {
  position: relative;
  z-index: 1;
  isolation: isolate;
  background: transparent;
}
.tron-section {
  --tron-wire: 1;
  --tron-solid: 1;
  --tron-progress: 1;
  position: relative;
}
/* Only the actively assembling section dims slightly — no blur filters on children */
html.js-anim:not(.reduce-motion) .tron-section.tron-assembling > * {
  opacity: calc(0.35 + var(--tron-solid) * 0.65);
  transition: none;
}
html.js-anim:not(.reduce-motion) .tron-section.tron-solid > *,
html.js-anim:not(.reduce-motion) .tron-section:not(.tron-assembling) > * {
  opacity: 1;
}
/* Wireframe outline — blue only; only while assembling */
html.js-anim:not(.reduce-motion) .tron-section.tron-assembling::before {
  content: '';
  position: absolute;
  inset: 4px;
  border: 1.5px solid color-mix(in srgb, var(--neon-cyan, #22d3ee) 75%, #fff 10%);
  border-radius: 1rem;
  pointer-events: none;
  z-index: 5;
  opacity: calc(var(--tron-wire) * (1 - var(--tron-solid) * 0.9));
  box-shadow:
    0 0 18px color-mix(in srgb, var(--neon-cyan, #22d3ee) 35%, transparent),
    inset 0 0 18px color-mix(in srgb, #93c5fd 14%, transparent);
  clip-path: inset(0 0 calc((1 - var(--tron-wire)) * 100%) 0);
}
html.js-anim:not(.reduce-motion) .tron-section.tron-assembling::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
  background:
    linear-gradient(90deg, transparent 49%, color-mix(in srgb, #22d3ee 20%, transparent) 50%, transparent 51%),
    linear-gradient(0deg, transparent 49%, color-mix(in srgb, #93c5fd 14%, transparent) 50%, transparent 51%);
  background-size: 28px 28px;
  opacity: calc(var(--tron-wire) * 0.28 * (1 - var(--tron-solid)));
  mix-blend-mode: screen;
}
.tron-hero-screen {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 6rem 1rem 3rem;
  position: relative;
}
.tron-hero-copy {
  max-width: 72rem;
  margin: 0 auto;
  width: 100%;
  text-shadow: 0 2px 24px rgba(2,6,23,0.85);
}
@media (prefers-reduced-motion: reduce) {
  .tron-section,
  .tron-section > * {
    opacity: 1 !important;
    filter: none !important;
  }
  .tron-section::before,
  .tron-section::after { display: none !important; }
}
html.js-anim:not(.reduce-motion) .tron-section.tron-hero-first,
html.js-anim:not(.reduce-motion) .tron-section.tron-hero-first > * {
  --tron-wire: 1;
  --tron-solid: 1;
  --tron-progress: 1;
  opacity: 1;
}
html.js-anim:not(.reduce-motion) .tron-section.tron-hero-first::before,
html.js-anim:not(.reduce-motion) .tron-section.tron-hero-first::after {
  display: none;
}
/* Glass: fixed cheap blur — no dynamic calc tied to scroll vars (TBT) */
.tron-section .ep-card {
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  background-color: color-mix(in srgb, var(--color-surface, #0f172a) 82%, transparent);
}
.tron-section.tron-solid .ep-card,
.tron-section:not(.tron-assembling) .ep-card {
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
@media (max-width: 768px) {
  .tron-section .ep-card,
  .tron-section.tron-solid .ep-card,
  .tron-section:not(.tron-assembling) .ep-card {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  /* quantum field canvas stays visible on mobile (lite density in JS) */
}
.tron-cat-art {
  image-rendering: auto;
  object-fit: cover;
}

/* TBT: skip rendering work for offscreen sections */
html.js-anim .tron-section:not(.tron-hero-first):not(.tron-assembling) {
  content-visibility: auto;
  contain-intrinsic-size: 1px 720px;
  contain: layout style;
}


/* CLS/TBT pass 2026-11-02 */
.news-ticker-global {
  height: 2.5rem;
  min-height: 2.5rem;
  contain: layout style;
  content-visibility: auto;
  contain-intrinsic-size: 100% 2.5rem;
}
.marquee-cve {
  min-height: 2.25rem;
  contain: layout style;
}
.ssl-countdown-wrap {
  contain: layout style;
  /* fixed; never affect document flow */
}
.tron-hero-screen .tron-hero-copy h1 {
  /* reserve stable line boxes for LCP text */
  content-visibility: visible;
  min-height: 3.5em;
}
.tron-backdrop__media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.tron-backdrop__poster,
.tron-backdrop__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 16 / 9;
}
footer, .bottom-nav, [data-cookie-banner] {
  content-visibility: auto;
  contain-intrinsic-size: 1px 200px;
}
/* Prefer compositor for ticker motion */
.ticker-track, .marquee-track, .animate-marquee {
  will-change: transform;
  backface-visibility: hidden;
}

/* Reserve main shell to cut post-hydration CLS */
main#main-content {
  min-height: 60vh;
  contain: layout;
}
