/* The still image and explanatory content remain usable before JavaScript loads. */
[data-assembly] { --assembly-red: #d31837; --assembly-red-deep: #8f071f; position: relative; color: #f2f5f7; background: #10171d; }
.assembly-stage { position: relative; min-height: 660px; height: min(900px, 100svh); overflow: hidden; background: #10171d; }
[data-assembly][data-assembly-state="ready"][data-assembly-layout="scroll"] { min-height: 280svh; }
[data-assembly][data-assembly-state="ready"][data-assembly-layout="scroll"] .assembly-stage { position: sticky; top: 0; }
[data-assembly-canvas] { position: absolute; inset: 70px 0 125px; min-height: 300px; }
.assembly-canvas { display: block; width: 100%; height: 100%; opacity: 0; }
[data-assembly-state="ready"] .assembly-canvas { opacity: 1; }
.assembly-poster, [data-assembly] .assembly-stage > img { position: absolute; inset: 70px 0 125px; width: 100%; height: calc(100% - 195px); object-fit: contain; }
[data-assembly-state="ready"] .assembly-poster, [data-assembly-state="ready"] .assembly-stage > img { visibility: hidden; }
.assembly-controls { position: absolute; z-index: 2; bottom: 22px; left: 50%; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px 22px; width: min(640px, calc(100% - 40px)); transform: translateX(-50%); }
.assembly-controls [hidden] { display: none; }
.assembly-load, .assembly-scroll { min-height: 44px; padding: 0 19px; color: #edf3f8; border: 1px solid #8197a7; border-radius: 4px; background: #18232c; font: inherit; cursor: pointer; }
.assembly-load:hover, .assembly-scroll:hover { color: #10171d; background: #e5edf4; border-color: #e5edf4; }
.assembly-load:disabled { opacity: .7; cursor: progress; }
.assembly-scrubber { display: grid; grid-template-columns: auto minmax(120px, 280px); align-items: center; gap: 16px; font-size: .9rem; color: #e4edf3; }
.assembly-scrubber input { width: 100%; height: 44px; margin: 0; accent-color: var(--assembly-red); cursor: pointer; }
.assembly-status { flex-basis: 100%; min-height: 21px; margin: 0; color: #b6c7d3; text-align: center; font-size: .83rem; }
[data-assembly-caption] { position: absolute; z-index: 2; top: 20px; left: 24px; right: 24px; margin: 0; color: #dde8ef; text-align: center; font-size: clamp(1.05rem, 2vw, 1.35rem); }
[data-assembly-progress] { display: block; width: 100%; height: 3px; appearance: none; border: 0; background: #273641; color: var(--assembly-red); }
[data-assembly-progress]::-webkit-progress-bar { background: #273641; }
[data-assembly-progress]::-webkit-progress-value { background: var(--assembly-red); }
[data-assembly-progress]::-moz-progress-bar { background: var(--assembly-red); }
.assembly-attribution { max-width: 78ch; margin: 0 auto; padding: 24px; color: #b6c7d3; text-align: center; font-size: .8rem; }
.assembly-attribution a { color: #c1def0; text-decoration: underline; text-underline-offset: 3px; }

/* The homepage presents the same genuine assembly, without a separate-page gate.
   Its stock bypass stays visible during the natural, non-intercepted scroll. */
.home-assembly .assembly-stage { min-height: 760px; background: radial-gradient(circle at 68% 58%, #202a31 0, #10171d 46%, #0c1217 76%); }
.home-assembly[data-assembly-state="ready"][data-assembly-layout="scroll"] { min-height: 240svh; }
.home-assembly__intro { position: relative; z-index: 3; display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; padding-top: 38px; }
.home-assembly__intro h2 { margin: 0; color: #f2f5f7; font-size: clamp(28px, 3vw, 40px); line-height: 1.22; font-weight: 500; text-transform: none; }
.home-assembly__intro p { max-width: 66ch; margin: 12px 0 0; color: #b6c7d3; font-size: 15px; line-height: 1.6; }
.home-assembly__skip { flex-shrink: 0; min-height: 44px; padding-block: 8px; white-space: nowrap; }
.home-assembly [data-assembly-caption] { top: 202px; left: max(24px, calc((100% - 1280px) / 2)); right: auto; width: 310px; color: #fff; text-align: left; font: 500 clamp(24px, 2.25vw, 34px)/1.18 Sora, sans-serif; letter-spacing: -.03em; }
.home-assembly__detail { position: absolute; z-index: 2; top: 344px; left: max(24px, calc((100% - 1280px) / 2)); width: min(310px, calc(100% - 48px)); padding-top: 18px; border-top: 1px solid rgb(211 24 55 / 65%); }
.home-assembly__detail h3 { margin: 0 0 9px; color: #f5f7f8; font: 500 17px/1.35 Sora, sans-serif; letter-spacing: -.02em; }
.home-assembly__detail p { max-width: 34ch; margin: 0; color: #aebfc9; font-size: 14px; line-height: 1.65; }
.home-assembly [data-assembly-canvas], .home-assembly[data-assembly] .assembly-poster { inset: 176px 0 128px 300px; }
.home-assembly[data-assembly] .assembly-poster { width: calc(100% - 300px); height: calc(100% - 304px); mix-blend-mode: normal; object-position: center; }
.home-assembly[data-assembly-state="ready"] .home-assembly__detail { border-top-color: var(--assembly-red); }
.home-assembly[data-assembly-step="3"] .home-assembly__detail h3 { color: #ffb5bf; }
.home-assembly__noscript { position: absolute; bottom: 40px; left: 24px; right: 24px; margin: 0; color: #b6c7d3; text-align: center; font-size: 14px; }
#vehicles { scroll-margin-top: 24px; }

@media (min-width: 821px) and (max-height: 740px) {
  .home-assembly .assembly-stage { min-height: 0; height: 100svh; }
  .home-assembly__intro { padding-top: 20px; }
  .home-assembly__intro h2 { font-size: 32px; }
  .home-assembly__intro p { margin-top: 8px; }
  .home-assembly [data-assembly-caption] { top: 145px; font-size: 24px; }
  .home-assembly__detail { top: 240px; }
  .home-assembly [data-assembly-canvas], .home-assembly[data-assembly] .assembly-poster { inset: 132px 0 112px 280px; min-height: 0; }
  .home-assembly[data-assembly] .assembly-poster { width: calc(100% - 280px); height: calc(100% - 244px); }
  .home-assembly .assembly-controls { bottom: 14px; }
}

@media (max-width: 820px) {
  .assembly-stage { min-height: 530px; height: 76svh; max-height: 690px; }
  [data-assembly][data-assembly-state="ready"][data-assembly-layout="scroll"] { min-height: 0; }
  [data-assembly][data-assembly-state="ready"][data-assembly-layout="scroll"] .assembly-stage { position: relative; }
  [data-assembly-canvas] { inset: 60px 0 145px; min-height: 240px; }
  .assembly-poster, [data-assembly] .assembly-stage > img { inset: 60px 0 145px; height: calc(100% - 205px); }
  .assembly-controls { bottom: 24px; }
  .assembly-scrubber { width: 100%; grid-template-columns: 1fr; gap: 0; text-align: center; }
  .assembly-scrubber input { max-width: 340px; justify-self: center; }
  .home-assembly .assembly-stage { min-height: 820px; height: 96svh; max-height: 880px; }
  .home-assembly[data-assembly-state="ready"][data-assembly-layout="scroll"] { min-height: 0; }
  .home-assembly__intro { display: block; padding-top: 30px; }
  .home-assembly__intro h2 { max-width: 16ch; font-size: 29px; }
  .home-assembly__intro p { max-width: 48ch; font-size: 14px; }
  .home-assembly__skip { margin-top: 8px; }
  .home-assembly [data-assembly-caption] { top: 252px; left: 20px; right: 20px; width: auto; font-size: 23px; }
  .home-assembly__detail { top: 318px; left: 20px; width: calc(100% - 40px); padding-top: 12px; }
  .home-assembly__detail p { max-width: 46ch; font-size: 13px; line-height: 1.55; }
  .home-assembly [data-assembly-canvas], .home-assembly[data-assembly] .assembly-poster { inset: 400px 0 145px; }
  .home-assembly[data-assembly] .assembly-poster { width: 100%; height: calc(100% - 545px); }
}

@media (max-width: 480px) {
  .home-assembly .assembly-stage { min-height: 850px; }
  .home-assembly [data-assembly-caption] { top: 270px; }
  .home-assembly__detail { top: 336px; }
  .home-assembly [data-assembly-canvas], .home-assembly[data-assembly] .assembly-poster { inset: 430px 0 150px; }
  .home-assembly[data-assembly] .assembly-poster { height: calc(100% - 580px); }
}

@media (prefers-reduced-motion: reduce) {
  [data-assembly][data-assembly-state="ready"][data-assembly-layout="scroll"] { min-height: 0; }
  [data-assembly][data-assembly-state="ready"][data-assembly-layout="scroll"] .assembly-stage { position: relative; }
  .home-assembly[data-assembly-state="ready"][data-assembly-layout="scroll"] { min-height: 0; }
}