/* The studio scene fills the opening screen. Text stays above the vehicle. */
body[data-page="public"] .site-header { position: relative; height: 100px; padding-inline: clamp(24px,4vw,76px); }
body[data-page="public"]:has(#search-view:not([hidden])) .site-header {
  position: absolute; inset: 0 0 auto; z-index: 3; width: 100%; max-width: none;
  background: linear-gradient(#06100ddd, #06100d18); border-bottom-color: #d5e9dc1c;
}
body[data-page="public"]:has(#search-view:not([hidden])) .public-shell { max-width: none; min-height: 0; padding: 0; }
.cinematic-hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: max(720px,min(100svh,calc((100vw - 480px) * .89))); max-width: none; margin: 0;
  padding: 126px clamp(24px,4vw,76px) 48px;
  grid-template-columns: minmax(0,1fr) 360px; gap: 40px; align-items: center;
  background: #091611;
}
.cinematic-hero .intro { position: absolute; top: 126px; left: clamp(24px,4vw,76px); max-width: calc(100% - 490px); z-index: 1; }
.cinematic-hero .intro h1 {
  font-family: Montserrat, Arial, sans-serif; font-size: clamp(42px,3.7vw,64px);
  font-weight: 600; line-height: 1.1; letter-spacing: -.025em; margin: 0 0 14px;
  text-shadow: 0 2px 22px #0005;
}
.hero-description { font-family: Montserrat, Arial, sans-serif; font-size: 16px; font-weight: 500; line-height: 1.65; color: #bbcabf; margin: 0; }
body[data-page="public"] .header-label { font-family: Montserrat, Arial, sans-serif; font-weight: 600; font-size: 12px; letter-spacing: .04em; }
.hero-backdrop { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.hero-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: left center; }
.hero-backdrop::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, #07100d70, #07100d15 34%, transparent 64%, #091611bb),
    linear-gradient(90deg, transparent 54%, #07100d28 73%, #07100d80);
}
.cinematic-hero > .search-card {
  grid-column: 2; width: 100%; margin: 0; padding: 30px;
  border-radius: 14px; border-color: #c7debd38;
  background: linear-gradient(145deg, #14231deb, #0a1711ed);
  box-shadow: 0 22px 70px #0003; backdrop-filter: blur(12px);
}
.cinematic-hero .search-card h2 { font-family: Spectral, Georgia, serif; font-weight: 400; font-size: 32px; letter-spacing: -.015em; }
.cinematic-hero .search-card .secondary { color: #aabeb0; font-size: 15px; line-height: 1.7; }
.cinematic-hero .plate-input-wrap input { background: #0b1710c9; }
@media (min-width: 1600px) { .cinematic-hero { grid-template-columns: minmax(0,1fr) 400px; } .cinematic-hero .intro { top: 154px; } }
@media (max-width: 1279px) {
  .cinematic-hero {
    --hero-gutter: 32px; display: flex; flex-direction: column; align-items: stretch;
    min-height: 0; padding: 108px var(--hero-gutter) 40px; gap: 0;
  }
  .cinematic-hero .intro { top: 136px; left: var(--hero-gutter); right: var(--hero-gutter); max-width: none; }
  .cinematic-hero .intro h1 { font-size: clamp(36px,5vw,52px); }
  .hero-backdrop {
    position: relative; inset: auto; z-index: 0;
    width: calc(100% + 2 * var(--hero-gutter)); aspect-ratio: 4 / 3; max-height: 820px;
    margin: 0 calc(-1 * var(--hero-gutter));
  }
  .hero-backdrop::after { background: linear-gradient(180deg, #091611, #09161160 16%, transparent 34%, transparent 82%, #091611); }
  .cinematic-hero > .search-card { width: 100%; max-width: 520px; align-self: center; margin-top: 12px; padding: 28px; backdrop-filter: none; }
}
@media (max-width: 600px) {
  body[data-page="public"] .site-header { height: 84px; padding-inline: 24px; }
  .cinematic-hero { --hero-gutter: 24px; padding-top: 192px; }
  .cinematic-hero .intro { top: 112px; }
  .cinematic-hero .intro h1 { font-size: clamp(29px,7.6vw,42px); margin-bottom: 12px; }
  .hero-description { font-size: 14px; max-width: 360px; }
  body[data-page="public"] .header-label { font-size: 10px; max-width: 115px; }
  .cinematic-hero > .search-card { margin-top: 8px; padding: 26px; }
}
@media (max-width: 360px) {
  body[data-page="public"] .site-header { padding-inline: 16px; }
  .cinematic-hero { --hero-gutter: 16px; }
  .cinematic-hero .intro h1 { font-size: 28px; }
  .cinematic-hero > .search-card { padding: 22px; }
}