/* Scene 13: 10 Recommendations (spire_mast.jpg).
   State 0: Full-bleed cover.
   State 1 (1-5): Photo docks left (0..440px), 5 rows sit right.
   State 2 (6-10): Photo glides right (1160..1600px), 5 rows sit left. */
#scene-13 .state-layer { position: absolute; inset: 0; }
#scene-13 .s13-cover, #scene-13 .s13-list { position: relative; width: 100%; height: 100%; overflow: hidden; }
#scene-13 .s13-bg { display: none; }
#scene-13 .s13-shade {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(7,9,14,0.35) 0%, rgba(7,9,14,0.18) 45%, rgba(7,9,14,0.88) 100%);
}
#scene-13 .s13-list .s13-shade { display: none; }
#scene-13 .s13-cover-copy {
  position: relative; z-index: 2; height: 100%;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0 84px 76px; max-width: 1180px;
}
#scene-13 .s13-cover-copy .kicker { margin-bottom: 14px; }
#scene-13 .s13-cover-copy .headline { font-size: 68px; line-height: 1.06; margin: 0; }

#scene-13 .state-layer[data-state="1"] .s13-list {
  padding: 44px 64px 40px 500px;
  display: flex; flex-direction: column; justify-content: center; gap: 20px;
}
#scene-13 .state-layer[data-state="2"] .s13-list {
  padding: 44px 500px 40px 64px;
  display: flex; flex-direction: column; justify-content: center; gap: 20px;
}
#scene-13 .s13-head { position: relative; z-index: 2; }
#scene-13 .s13-head .kicker { margin-bottom: 8px; }
#scene-13 .s13-head .headline { font-size: 38px; line-height: 1.1; margin: 0 0 8px; }
#scene-13 .s13-count {
  font-family: var(--mono); font-size: 14px; letter-spacing: 0.08em; color: var(--gold);
}
#scene-13 .s13-rows { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 12px; }
#scene-13 .s13-row {
  display: flex; align-items: center; gap: 18px;
  border: 1px solid rgba(244,240,232,0.14);
  background: rgba(17,24,38,0.95);
  padding: 15px 22px;
  min-height: 0; overflow: hidden;
}
#scene-13 .s13-num {
  font-family: var(--mono); font-size: 15px; letter-spacing: 0.06em;
  color: var(--gold); flex: 0 0 40px;
}
#scene-13 .s13-row p { font-size: 17px; line-height: 1.35; color: #f4f0e8; margin: 0; }