/* Arrival experiment is mobile-only. Existing desktop composition is retained. */
.arrival-mobile { display: none; }
.arrival-story-boundary { display: contents; }
.arrival-section-eyebrow { display: none; }
@media (max-width: 899px) {
  .arrival-pin-sequence { display: flex; flex-direction: column; }
  .arrival-band { order: 0; margin: 64px 0 0; }
  .arrival-band h2 { font-size: clamp(17px, 4.7vw, 30px); letter-spacing: -.04em; white-space: nowrap; }
  .arrival-section-eyebrow {
    order: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 28px 26px 24px;
    color: #89877d;
    font: 500 11px/1.4 var(--font-mono);
    letter-spacing: .09em;
    text-transform: uppercase;
  }
  .arrival-section-eyebrow::before {
    content: "";
    width: 9px;
    height: 1px;
    background: currentColor;
    flex: none;
  }
  .arrival-pin-sequence > .welcome-film { order: 2; }
  .arrival-pin-sequence > .welcome { order: 3; }
  .arrival-mobile .welcome-film {
    width: calc(100% + 52px);
    margin: 0 -26px 48px;
  }
  .arrival-pin-sequence > .joes-garage { order: 4; }
  .arrival-mobile > .arrival-eyebrow,
  .welcome .arrival-intro { display: none; }
  .welcome > .welcome-copy { display: none; }
  .arrival-mobile {
    display: block;
    padding: 48px 26px 40px;
    background: var(--bg-primary);
    color: var(--text-primary);
  }
  .arrival-eyebrow,
  .arrival-number,
  .arrival-signoff {
    font: 400 10px/1.5 var(--font-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
  }
  .arrival-eyebrow { color: #89877d; }
  .arrival-eyebrow::before { content: "— "; }
  .welcome .arrival-intro {
    margin: 24px 0 60px;
    font: 400 clamp(48px, 13vw, 72px)/1.02 var(--font-serif);
    letter-spacing: -.035em;
  }
  .arrival-intro em { font-weight: 400; }
  .arrival-beat {
    position: relative;
    padding: 22px 0 52px;
  }
  .arrival-beat::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(24,24,24,.25);
    content: "";
    transform-origin: left;
  }
  .arrival-number { display: flex; gap: 20px; color: #89877d; }
  .arrival-beat :is(h2, h3) {
    margin: 20px 0;
    font: 400 clamp(52px, 15vw, 84px)/1.02 var(--font-serif);
    letter-spacing: -.035em;
  }
  .arrival-beat p {
    width: 100%;
    margin: 0;
    font: 400 clamp(23px, 7.2vw, 38px)/1.2 var(--font-serif);
    letter-spacing: -.025em;
  }
  .arrival-homemade { color: var(--bg-inverted); }
  .arrival-beat .arrival-seasonal {
    margin-top: 26px;
    font: 400 14px/1.6 var(--font-sans);
    letter-spacing: 0;
    color: #595b52;
  }
  .arrival-signoff { padding: 8px 0; color: #89877d; }
  .arrival-pin-sequence .welcome-film {
    position: relative;
    top: auto;
    width: 100%;
    margin: 0;
    overflow: hidden;
  }
  .arrival-pin-sequence .welcome-film video { aspect-ratio: 1; object-fit: cover; }
  .arrival-motion-ready .arrival-beat::before {
    transform: scaleX(0);
    transition: transform 1.6s ease;
  }
  .arrival-motion-ready .arrival-beat > * {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 900ms ease, transform 900ms cubic-bezier(.2,.7,.2,1);
  }
  .arrival-motion-ready .arrival-beat.is-arrived::before { transform: scaleX(1); }
  .arrival-motion-ready .arrival-beat.is-arrived > * { opacity: 1; transform: none; }
  .arrival-motion-ready .arrival-beat :is(h2, h3) { transition-delay: 100ms; }
  .arrival-motion-ready .arrival-beat p { transition-delay: 220ms; }
}
@media (prefers-reduced-motion: reduce) {
  .arrival-motion-ready .arrival-beat > * { opacity: 1; transform: none; transition: none; }
  .arrival-motion-ready .arrival-beat::before { transform: none; transition: none; }
}