.home-intro { position: relative; height: 185svh; }
.home-intro__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; background: var(--color-surface); }
.home-intro__art { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.home-intro__landscape { width: 100%; height: 100%; object-fit: cover; }
.home-intro__scooter { visibility: hidden; position: absolute; left: 17%; bottom: 3%; width: 18%; height: auto; }
.home-intro__art[data-renderer="fallback"] .home-intro__scooter { visibility: visible; }
.home-intro__art[data-renderer="three"] .home-intro__scooter { display: none; }
.home-intro__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-intro__credit { position: absolute; bottom: var(--space-2); right: var(--space-4); display: inline-flex; align-items: center; min-height: var(--space-11); color: var(--color-text-secondary); font-size: 10px; text-decoration: none; }
.home-intro__header { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: var(--space-6); padding: var(--space-6) 5%; }
.home-intro__header .curation-brand { color: var(--color-text-primary); font-size: var(--text-3xl); font-weight: 800; }
.home-intro__header nav { display: flex; align-items: center; gap: var(--space-8); }
.home-intro__header nav a { display: inline-flex; align-items: center; min-height: var(--space-11); color: var(--color-text-primary); font-size: var(--text-sm); font-weight: 700; text-decoration: none; }
.home-intro__header nav a:hover { color: var(--color-primary); }
.home-intro__copy { position: absolute; top: 25%; left: 5%; width: 42%; }
.home-intro__eyebrow { color: var(--color-primary); font-size: var(--text-sm); font-weight: 750; letter-spacing: 0.04em; }
.home-intro__copy h1 { margin: var(--space-4) 0 var(--space-6); color: var(--color-text-primary); font-size: clamp(var(--text-4xl), 4.4vw, var(--text-display)); font-weight: 850; letter-spacing: -0.045em; line-height: 1.2; }
.home-intro__copy p { margin: 0 0 var(--space-8); color: var(--color-text-secondary); font-size: var(--text-lg); line-height: 1.7; }
.home-intro__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.home-intro__start { min-height: var(--space-14); padding-inline: var(--space-8); border-radius: var(--radius-full); font-size: var(--text-base); font-weight: 700; text-decoration: none; }
.home-intro__scroll { position: absolute; bottom: var(--space-6); left: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: var(--space-11); gap: var(--space-2); transform: translateX(-50%); color: var(--color-text-primary); font-size: var(--text-xs); font-weight: 650; text-decoration: none; white-space: nowrap; }
.home-intro__scroll span { font-size: var(--text-xl); }
@media (max-width: 760px), (max-width: 1024px) and (max-height: 500px) {
  .home-intro { height: 160svh; }
  .home-intro__stage { display: grid; grid-template-rows: auto auto auto minmax(0, 1fr); }
  .home-intro__art { position: relative; inset: auto; grid-row: 4; align-self: end; min-height: 0; height: 100%; max-height: 85vw; }
  .home-intro__landscape { object-position: 50% 100%; }
  .home-intro__scooter { width: 40%; }
  .home-intro__header { grid-row: 1; padding: var(--space-4); gap: var(--space-3); }
  .home-intro__header .curation-brand { min-height: var(--space-11); gap: var(--space-2); font-size: var(--text-xl); }
  .home-intro__header .curation-brand img { width: var(--space-9); height: var(--space-9); }
  .home-intro__header nav { gap: var(--space-4); }
  .home-intro__header nav a { font-size: var(--text-xs); white-space: nowrap; }
  .home-intro__copy { position: relative; top: auto; left: auto; grid-row: 2; width: auto; padding: var(--space-4) var(--space-6); }
  .home-intro__copy h1 { font-size: clamp(var(--text-3xl), 5svh, var(--text-4xl)); margin-block: var(--space-3) var(--space-4); }
  .home-intro__copy p { font-size: var(--text-base); margin-bottom: var(--space-4); }
  .home-intro__start { min-height: var(--space-11); padding-inline: var(--space-5); font-size: var(--text-sm); }
  .home-intro__scroll { position: relative; inset: auto; grid-row: 3; justify-self: center; flex-direction: row; transform: none; }
}
@media (max-width: 360px) {
  .home-intro__header, .home-intro__header nav { gap: var(--space-2); }
}
@media (orientation: landscape) and (max-width: 1024px) and (max-height: 500px) {
  .home-intro__stage { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; }
  .home-intro__header { grid-column: 1 / -1; padding-block: var(--space-2); }
  .home-intro__copy { align-self: center; padding-block: 0; }
  .home-intro__copy h1 { font-size: var(--text-3xl); margin-block: var(--space-2); }
  .home-intro__copy p { margin-bottom: var(--space-2); }
  .home-intro__art { grid-column: 2; grid-row: 2 / 4; }
  .home-intro__header nav { width: auto; }
}
@media (orientation: landscape) and (max-width: 1024px) and (max-height: 360px) {
  .home-intro__stage { grid-template-rows: auto minmax(0, 1fr); }
  .home-intro__scroll { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .home-intro { height: auto; }
  .home-intro__stage { position: relative; }
}
