/* 029 Experience Rebaseline: classic entrance + dedicated 3D-world mode. */

.hero-shell[data-experience="classic"] #hero-canvas,
.hero-shell[data-experience="classic"] .hero-aura,
.hero-shell[data-experience="classic"] .hero-inspection,
.hero-shell[data-experience="classic"] .spatial-parts,
.hero-shell[data-experience="classic"] .seat-stack,
.hero-shell[data-experience="classic"] .hero-controls,
.hero-shell[data-experience="classic"] .hero-note,
.hero-shell[data-experience="classic"] .hero-auth-panel,
.hero-shell[data-experience="classic"] .world-navigation,
.hero-shell[data-experience="classic"] .hero-copy {
  display: none !important;
}

/* .far-environment is a sibling AFTER .hero-shell (outside the machine).
   Classic entrance already owns About/Contact/Terms/Privacy, so hide the
   duplicate far footer on classic first paint. World mode keeps it. */
.hero-shell[data-experience="classic"] ~ .far-environment {
  display: none !important;
}

.hero-shell[data-experience="classic"] {
  min-height: 100svh;
  height: 100svh;
  background:
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.98), transparent 34%),
    linear-gradient(180deg, #f7f4ee 0%, #eeeae2 100%);
}

.classic-entrance {
  position: relative;
  z-index: 10;
  display: grid;
  min-height: 100svh;
  grid-template-rows: auto 1fr auto;
  padding: clamp(18px, 4vw, 44px);
}

.classic-entrance__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.classic-entrance__brand {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  color: #252622;
  font-weight: 760;
  letter-spacing: -.02em;
}

.classic-entrance__brand img {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  object-fit: contain;
  box-shadow: 0 8px 22px rgba(40,38,32,.11);
}

.classic-entrance__menu {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px;
  border: 1px solid rgba(42,44,40,.09);
  border-radius: 16px;
  background: rgba(255,255,255,.64);
  box-shadow: 0 10px 28px rgba(67,63,56,.09);
  backdrop-filter: blur(14px) saturate(110%);
}

.classic-entrance__menu a,
.classic-entrance__menu button {
  padding: 9px 11px;
  border-radius: 11px;
  text-decoration: none;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(42,44,40,.76);
  font-size: 12px;
}

.classic-entrance__content {
  align-self: center;
  width: min(720px, 100%);
  padding: clamp(34px, 8vw, 96px) 0;
}

.classic-entrance__eyebrow {
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  color: rgba(42,44,40,.5);
}

.classic-entrance__title {
  margin: 0;
  max-width: 780px;
  font-size: clamp(44px, 8vw, 92px);
  line-height: .92;
  letter-spacing: -.065em;
  font-weight: 790;
  text-wrap: balance;
}

.classic-entrance__lede {
  width: min(560px, 100%);
  margin: 24px 0 0;
  font-size: clamp(15px, 2vw, 20px);
  line-height: 1.55;
  color: rgba(42,44,40,.67);
}

.classic-entrance__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.classic-entrance__primary {
  background: #272a26 !important;
  color: #f8f5ef !important;
}

.classic-entrance__footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px 18px;
  color: rgba(42,44,40,.48);
  font-size: 11px;
}

.classic-entrance__footer a {
  color: inherit;
  text-decoration: none;
}

.hero-shell[data-experience="world"] .classic-entrance {
  display: none;
}

.world-navigation {
  position: absolute;
  top: 18px;
  left: 50%;
  z-index: 8;
  width: min(720px, calc(100vw - 36px));
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px;
  border: 1px solid rgba(42,44,40,.09);
  border-radius: 18px;
  background: rgba(255,255,255,.7);
  box-shadow: 0 12px 32px rgba(67,63,56,.10);
  backdrop-filter: blur(18px) saturate(112%);
}

.world-navigation__group {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}

.world-navigation button {
  padding: 8px 10px;
  font-size: 11px;
}

.world-navigation__menu {
  position: relative;
}

.world-navigation__popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 190px;
  display: none;
  padding: 8px;
  border: 1px solid rgba(42,44,40,.1);
  border-radius: 14px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 20px 50px rgba(20,18,14,.16);
}

.world-navigation__popover.is-open { display: grid; gap: 4px; }

.world-navigation__popover button {
  text-align: left;
  border: 0;
  box-shadow: none;
  background: transparent;
}

.world-navigation__status {
  font-size: 11px;
  color: rgba(42,44,40,.55);
  white-space: nowrap;
}

/* C5/D (#278): Wide/Team/Workspace/Map/Seat/Detail were removed from
   public/index.html outright -- .world-navigation is the single coherent
   world nav now. Soft-hide (display:none) was explicitly rejected by the
   owner ("soft-hide is not removal"), so there is no hide-rule here to
   maintain; this comment is the only trace of the old camera wall. */

.hero-shell[data-experience="world"] .hero-controls {
  width: min(620px, calc(100vw - 28px));
}

.hero-shell[data-experience="world"] .hero-controls__cameras {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex-wrap: wrap;
}

.hero-shell[data-experience="world"] .hero-controls__status {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 7px;
}

.hero-shell[data-experience="world"] .hero-copy {
  opacity: 0;
  visibility: hidden;
}

html[data-spatial-responsive="compact"] .classic-entrance {
  padding: 16px;
}

html[data-spatial-responsive="compact"] .classic-entrance__content {
  padding-top: 50px;
  padding-bottom: 50px;
}

html[data-spatial-responsive="compact"] .classic-entrance__title {
  font-size: clamp(42px, 11vw, 66px);
}

html[data-spatial-responsive="compact"] .world-navigation {
  top: calc(12px + env(safe-area-inset-top, 0px));
  width: calc(100vw - 24px);
  max-height: calc(100dvh - 24px);
}

html[data-spatial-responsive="compact"] .world-navigation__group {
  min-width: 0;
}

html[data-spatial-responsive="compact"] .world-navigation__status {
  white-space: normal;
}

html[data-spatial-responsive="phone"] .classic-entrance {
  padding: 16px;
}

html[data-spatial-responsive="phone"] .classic-entrance__menu a:nth-child(n+3) {
  display: none;
}

html[data-spatial-responsive="phone"] .classic-entrance__content {
  padding-top: 50px;
  padding-bottom: 50px;
}

html[data-spatial-responsive="phone"] .classic-entrance__title {
  font-size: clamp(42px, 13vw, 66px);
}

html[data-spatial-responsive="phone"] .classic-entrance__actions button {
  width: 100%;
}

html[data-spatial-responsive="phone"] .world-navigation {
  top: calc(8px + env(safe-area-inset-top, 0px));
  width: calc(100vw - 16px);
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 6px;
  max-height: calc(100dvh - 16px);
}

html[data-spatial-responsive="phone"] .world-navigation__group {
  width: 100%;
  justify-content: space-between;
}

html[data-spatial-responsive="phone"] .world-navigation__menu {
  width: 100%;
}

html[data-spatial-responsive="phone"] .world-navigation__menu > button {
  width: 100%;
}

html[data-spatial-responsive="phone"] .world-navigation__popover {
  position: static;
  min-width: 0;
  width: 100%;
  max-height: calc(100dvh - 96px);
  overflow: auto;
  box-sizing: border-box;
}

html[data-spatial-responsive="phone"] .world-navigation__status {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .world-navigation,
  .classic-entrance__menu { backdrop-filter: none; }
}
