/* The welcome shares the scene's available space with the real header and navigation. */
body[data-current=entrada]:not(.brand-tour) #experience .copy[data-position=entrada]:has(#scene-description:not([hidden])) {
  top: max(var(--opening-header-bottom, 137px), min(20dvh, 170px));
  bottom: var(--opening-navigation-inset, 122px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(10px, 2dvh, 20px);
  width: min(53vw, 560px);
  max-width: none;
}
#scene-description[hidden], #scene-title[hidden] { display: none; }
body:not(.brand-tour) #experience .copy[data-position=entrada] #scene-title {
  flex: none;
  max-width: 100%;
  margin: 0;
  color: #f8f0e3;
  font-size: clamp(35px, 5.45vw, 72px);
  line-height: .98;
  letter-spacing: -.025em;
  text-shadow: 0 2px 12px #100b08;
}
#experience #scene-description {
  flex: 0 1 auto;
  min-block-size: 0;
  width: min(100%, 52ch);
  max-block-size: none;
  margin: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  padding-inline-end: .6rem;
  scrollbar-width: thin;
  scrollbar-color: #b69c70 transparent;
  text-shadow: 0 1px 5px #120d09;
}
body:not(.brand-tour) #experience #scene-description > p {
  max-width: none;
  margin: 0 0 .65rem;
  color: #f8f0e3;
  font-size: clamp(.8125rem, 1.15vw, .9375rem);
  line-height: 1.51;
}
#experience #scene-description > p:last-child { margin-bottom: 0; }
#scene-description:focus-visible { outline: 2px solid #dfc69a; outline-offset: 3px; }
body[data-current=entrada]:not([data-logo-intro]) #experience .shade::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #17110de0, #17110db2 34%, #17110d16 68%, transparent);
}
body[data-logo-intro] #walk-film { object-fit: contain; object-position: center; background: #090704; }
@media(max-width:700px) {
  body[data-current=entrada]:not(.brand-tour) #experience .copy[data-position=entrada]:has(#scene-description:not([hidden])) {
    top: max(var(--opening-header-bottom, 140px), min(20dvh, 163px));
    bottom: var(--opening-navigation-inset, 122px);
    inset-inline: 6%;
    width: auto;
  }
  body:not(.brand-tour) #experience .copy[data-position=entrada] #scene-title { font-size: clamp(31px, 8.8vw, 42px); }
  body[data-current=entrada]:not([data-logo-intro]) #experience .shade::after {
    background: linear-gradient(90deg, #17110de8, #17110dcc 44%, #17110d66 78%, #17110d14);
  }
  body[data-logo-intro] #skip-walk { top: auto; bottom: max(102px, 16dvh); }
}
@media(max-height:500px) and (orientation:landscape) {
  body[data-current=entrada]:not(.brand-tour) #experience .copy[data-position=entrada]:has(#scene-description:not([hidden])) {
    top: var(--opening-header-bottom, 107px);
    bottom: var(--opening-navigation-inset, 69px);
    gap: 8px;
  }
  body:not(.brand-tour) #experience .copy[data-position=entrada] #scene-title { font-size: clamp(28px, 5.8dvh, 35px); }
}