/* hangar/hangar-detail.css — polish layer for hangar detail pages.
   Builds on /shared/cinematic.css. */

:root { --ease-cine: cubic-bezier(0.16, 1, 0.3, 1); }

/* Hero staggered fade-in */
.hd-hero__badges, .hd-hero__name {
  opacity: 0; transform: translateY(28px);
  transition: opacity 1000ms var(--ease-cine), transform 1000ms var(--ease-cine);
}
.hd-hero.is-loaded .hd-hero__badges { opacity: 1; transform: none; transition-delay: 120ms; }
.hd-hero.is-loaded .hd-hero__name   { opacity: 1; transform: none; transition-delay: 260ms; }

/* "Why this platform" lead — drop-cap on first letter */
.hd-why__lead::first-letter {
  font-family: "Instrument Serif", serif;
  color: var(--gold); float: left;
  font-size: 3.4em; line-height: 0.82;
  padding: 0.06em 0.12em 0 0; margin-bottom: -0.08em;
  font-weight: 400;
}

/* Spec rows — fade in on scroll */
.hd-spec-row {
  opacity: 0; transform: translateY(10px);
  transition: opacity 560ms var(--ease-cine), transform 560ms var(--ease-cine);
}
.hd-spec-row.is-in { opacity: 1; transform: none; }

/* On-set placeholder hover (when real imagery not yet dropped in) */
.hd-onset-ph { transition: border-color 280ms var(--ease-cine), transform 420ms var(--ease-cine); }
.hd-onset-ph:hover { border-color: var(--gold); transform: translateY(-2px); }

@media (prefers-reduced-motion: reduce) {
  .hd-hero__badges, .hd-hero__name,
  .hd-spec-row { opacity: 1 !important; transform: none !important; transition: none !important; }
}