/* Real product views keep their native proportions; only the surrounding cards
   share a rhythm. The scene above remains the interactive demonstration. */
.arrival-flow.arrival-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:18px;
  width:100%;
  margin:34px auto 0;
}
.arrival-cards .arrival-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:24px;
  border:0;
  border-radius:14px;
  background:#223442;
  color:#f5f0e7;
}
.arrival-cards .arrival-card--reception{background:#1c2e3c}
.arrival-cards .arrival-card--welcome{background:#293b46}
.arrival-cards .arrival-node{align-items:flex-start;gap:12px;min-height:54px}
.arrival-cards .arrival-step-number{padding-top:5px;color:#a6b8c3;font-size:12px;font-weight:500;line-height:1.5;letter-spacing:0}
.arrival-cards .arrival-node-label{
  margin:0;
  color:#f5f0e7;
  font-size:20px;
  font-weight:500;
  line-height:1.35;
  letter-spacing:-.4px;
  overflow-wrap:normal;
}
.arrival-cards .arrival-card-copy{
  min-height:44px;
  margin:8px 0 22px;
  color:#c3cfd6;
  font-size:14px;
  font-weight:400;
  line-height:1.6;
  letter-spacing:0;
}
.arrival-cards .arrival-card-media{min-width:0;margin:0 0 22px}
.arrival-cards .arrival-card-media img{display:block;max-width:100%;height:auto;object-fit:contain}
.arrival-cards .arrival-card-media figcaption{
  margin:10px 0 0;
  color:#b6c5ce;
  font-size:12px;
  font-weight:400;
  line-height:1.6;
  text-align:center;
}
.arrival-cards .arrival-card-tickets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:12px;min-height:306px}
.arrival-cards .arrival-card-tickets figure{min-width:0;margin:0}
.arrival-cards .arrival-card-preview{display:block;width:100%;margin:0;padding:0;border:0;background:none;cursor:zoom-in}
.arrival-cards .arrival-card-tickets img{width:100%;aspect-ratio:3/5;box-shadow:0 12px 25px #0b152533}
.arrival-cards .arrival-card-tickets figure:last-child{transform:translateY(10px)}
.arrival-cards .arrival-card-reception{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:306px}
.arrival-cards .arrival-card-reception img{width:155px;aspect-ratio:9/16;border-radius:4px;box-shadow:0 12px 25px #0b152533}
.arrival-cards .arrival-card-scene{padding-top:9px;margin-bottom:20px}
.arrival-cards .arrival-card-scene img{width:100%;aspect-ratio:8/5;border-radius:6px}
.arrival-cards .arrival-card-scene figcaption{text-align:left}
.arrival-cards .arrival-reactions{gap:10px 15px;margin:0 0 24px}
.arrival-cards .arrival-reaction{color:#bccbd4;font-size:12px;line-height:1.6}
.arrival-cards .arrival-card-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  min-width:0;
  min-height:48px;
  margin-top:auto;
  padding:13px 16px;
  border:0;
  border-radius:6px;
  background:#eef2f3;
  color:#15232e;
  font-family:var(--font-ui,Inter,sans-serif);
  font-size:14px;
  font-weight:550;
  line-height:1.5;
  text-align:left;
  transition:background .2s,color .2s;
}
.arrival-cards .arrival-card-cta:hover{background:#fff}
.arrival-cards .arrival-card-cta--play{background:#ef775c;color:#15212b}
.arrival-cards .arrival-card-cta--play:hover{background:#ffa489}
.arrival-cards .arrival-card-arrow{display:block;width:18px;height:18px;flex:0 0 18px;background:currentColor;-webkit-mask:url('icons/arrow-up-right.svg') center/contain no-repeat;mask:url('icons/arrow-up-right.svg') center/contain no-repeat}
.arrival-cards .arrival-card-cta--play .arrival-card-arrow{-webkit-mask-image:url('icons/arrow-right.svg');mask-image:url('icons/arrow-right.svg')}
@media(min-width:701px) and (max-width:1000px){
  .arrival-flow.arrival-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .arrival-cards .arrival-card--welcome{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);column-gap:32px;align-items:start}
  .arrival-cards .arrival-card--welcome .arrival-node{grid-column:1;grid-row:1;min-height:0}
  .arrival-cards .arrival-card--welcome .arrival-card-copy{grid-column:1;grid-row:2;margin-bottom:18px}
  .arrival-cards .arrival-card-scene{grid-column:2;grid-row:1/5;padding-top:0;margin:0}
  .arrival-cards .arrival-card--welcome .arrival-reactions{grid-column:1;grid-row:3}
  .arrival-cards .arrival-card--welcome .arrival-card-cta{grid-column:1;grid-row:4;align-self:end}
}
@media(max-width:700px){
  .arrival-flow.arrival-cards{grid-template-columns:minmax(0,1fr);gap:18px;width:100%;margin-top:28px}
  .arrival-cards .arrival-card{grid-column:auto;padding:24px}
  .arrival-cards .arrival-node{min-height:0;gap:12px}
  .arrival-cards .arrival-node-label{font-size:20px}
  .arrival-cards .arrival-card-copy{min-height:0;margin:10px 0 22px}
  .arrival-cards .arrival-card-tickets{width:min(290px,100%);min-height:0;gap:14px;margin:0 auto 30px}
  .arrival-cards .arrival-card-reception{min-height:0;margin-bottom:24px}
  .arrival-cards .arrival-card-reception img{width:180px}
  .arrival-cards .arrival-card-scene{padding-top:0;margin-bottom:18px}
  .arrival-cards .arrival-reactions{margin:0 0 24px;gap:10px 15px}
}
@media(max-width:360px){
  .arrival-cards .arrival-card{padding:20px}
  .arrival-cards .arrival-node-label{font-size:18px}
  .arrival-cards .arrival-card-tickets{gap:10px}
}