/* ============================================================
   PRESS SCENE — homepage-only Three.js schematic artifact.
   Loaded only by index.html, never touches shell.html.
   ============================================================ */

.press-scene {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-block: var(--space-11);
}

.press-scene__canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  filter: drop-shadow(0 0 40px rgba(176, 141, 87, 0.12));
}

.press-scene__content {
  position: relative;
  z-index: 2;
  max-width: 30rem;
  pointer-events: none;
}

.press-scene__content .eyebrow { pointer-events: auto; }

.press-scene__content h2 {
  margin-top: var(--space-3);
  font-size: var(--fs-3xl);
}

.press-scene__content p {
  margin-top: var(--space-5);
  max-width: 42ch;
}

.press-scene__meta {
  margin-top: var(--space-8);
  display: flex;
  gap: var(--space-7);
  pointer-events: auto;
}

.press-scene__meta div {
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: rgba(251, 248, 242, 0.5);
  border-top: 1px solid var(--line-on-dark);
  padding-top: var(--space-3);
}

.press-scene__meta strong {
  display: block;
  margin-top: var(--space-1);
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-base);
  color: var(--color-gold);
}

/* Static single-frame fallback: prefers-reduced-motion or low-power devices.
   press-scene.js adds this class instead of running the scrub/idle rAF loop. */
.press-scene.is-static .press-scene__canvas { opacity: 0.9; }
.press-scene.is-static::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}

@media (min-width: 1600px) {
  .press-scene { min-height: 80vh; }
  .press-scene__canvas { max-height: 900px; top: 50%; transform: translateY(-50%); }
}

@media (max-width: 980px) {
  .press-scene { min-height: 70vh; padding-block: var(--space-9); }
}

@media (max-width: 780px) {
  .press-scene { min-height: 60vh; align-items: flex-end; }
  .press-scene__content { max-width: none; }
  .press-scene__meta { gap: var(--space-5); flex-wrap: wrap; }
}
