html { scrollbar-gutter: stable; }
main p, dialog p { text-wrap: pretty; }
.prose-sentence { display: block; }
.contact-person { display: grid; gap: 7px; }
.contact-person .mono { line-height: 1.7; }
.profile-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; margin-top: 12px; font-size: .85rem; color: var(--muted-light); text-decoration: underline; text-underline-offset: .25em; }
.profile-link:hover { color: var(--ceramic); }
.profile-link .button-icon { color: var(--red); }
.hero {
  --opening-header-center: calc(max(16px, env(safe-area-inset-top)) + 18px);
  background: #000;
}
.opening-language {
  top: var(--opening-header-center);
  transform: translateY(-50%);
}
.hero-frame { background-color: #000; }
.hero-frame:not([data-opening-started]) { background-image: none; }

.opening-blue-plate {
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  mask-image: linear-gradient(to bottom, transparent, #000 15%, #000 88%, transparent);
}

.opening-blue-plate img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.opening-blue-plate .opening-blue-pulse {
  position: absolute;
  inset: 0;
  filter: url(#opening-blue-backlight);
  opacity: 0;
  animation: opening-blue-beat 4.2s infinite;
  clip-path: polygon(54.9% 32.4%, 58.65% 32.4%, 61.1% 50.4%, 62.3% 50.4%, 62.3% 32.4%, 65.9% 32.4%, 65.9% 61%, 59.3% 61%, 58.2% 55.3%, 55.3% 55.3%, 54.3% 61%, 51.6% 61%);
}

.opening-red-pulse { display: none; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.opening-red-pulse img {
  width: 100%; height: 100%; object-fit: contain;
  filter: url(#opening-red-backlight);
  animation: opening-blue-beat 4.2s infinite;
}
.hero-frame:has(.opening-film[data-logo-ready]) .opening-red-pulse { display: block; }
.hero-frame .opening-energy { display: none !important; }
.opening-entry { cursor: pointer; }

.opening-blue-filter { position: absolute; width: 0; height: 0; overflow: hidden; }
.hero-frame:not([data-opening-started]) .opening-film { opacity: 0; }
.hero-frame:not([data-opening-started]) .opening-energy { display: none; }
.hero-frame[data-opening-started] .opening-blue-plate { display: none; }
.opening-start:focus-visible { outline-color: #90cce8; }

.opening-menu {
  position: fixed;
  z-index: 30;
  right: max(24px, env(safe-area-inset-right));
  top: var(--opening-header-center);
  transform: translateY(-50%);
  animation: opening-menu-reveal .5s ease-out;
}

.opening-menu[hidden] { display: none; }
.opening-menu-toggle {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #e5d6ca;
  cursor: pointer;
  transition: filter .2s ease, transform .2s ease;
}
.opening-menu-toggle svg {
  width: 32px;
  height: 32px;
  filter: drop-shadow(0 -1px 0 #fff4e6) drop-shadow(0 2px 1px #1b1411) drop-shadow(0 5px 4px #0009);
}
.opening-menu-toggle .menu-close { display: none; }
.opening-menu-toggle[aria-expanded="true"] .menu-bars { display: none; }
.opening-menu-toggle[aria-expanded="true"] .menu-close { display: block; }
.opening-menu-toggle:hover { filter: brightness(1.18); }
.opening-menu-toggle:active { transform: translateY(1px); }
.opening-menu-toggle:focus-visible, .opening-navigation a:focus-visible, .opening-replay:focus-visible {
  outline: 2px solid #e7dace;
  outline-offset: 6px;
}
.hero[data-site-ready] .opening-controls {
  top: auto;
  bottom: max(24px, env(safe-area-inset-bottom));
  right: max(24px, env(safe-area-inset-right));
}
.hero[data-site-ready] #opening-play { display: none; }
.hero[data-site-ready] .opening-language { position: fixed; z-index: 30; }
.hero[data-site-ready]::after {
  content: "";
  position: fixed;
  z-index: 26;
  top: 0;
  left: 0;
  right: 0;
  height: calc(var(--opening-header-center) + 44px);
  pointer-events: none;
  background: linear-gradient(to bottom, #000b, #0006 55%, transparent);
}
.hero[data-menu-open] .opening-language { visibility: hidden; }
.opening-navigation {
  position: fixed;
  z-index: 28;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  justify-content: safe center;
  gap: 32px;
  padding: 90px max(9%, 24px) 40px;
  overflow-y: auto;
  background: #0d0c0b;
  text-align: left;
  animation: opening-navigation-reveal .25s ease-out;
}
.opening-navigation-links { display: flex; flex-direction: column; align-items: flex-start; flex-shrink: 0; }
.opening-navigation-links a {
  display: block;
  padding: 7px 0;
  color: #e7d9cd;
  font-family: Manrope, Arial, sans-serif;
  font-size: clamp(26px, 4vw, 56px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -.04em;
  text-decoration: none;
  transition: color .15s ease, transform .15s ease;
}
.opening-navigation-links a:hover { color: #fff7ee; transform: translateX(6px); }
.opening-replay {
  flex-shrink: 0;
  min-height: 44px;
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: #b6a89b;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.opening-replay:hover { color: #fff7ee; }
@keyframes opening-navigation-reveal {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: none; }
}

@keyframes opening-menu-reveal {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (max-width: 700px) {
  .hero { --opening-header-center: calc(max(10px, env(safe-area-inset-top)) + 16px); }
}

@media (max-width: 600px) {
  .opening-menu { right: max(18px, env(safe-area-inset-right)); }
  .opening-navigation { padding: 80px 9% 24px; gap: 20px; }
  .opening-navigation-links a { min-height: 44px; font-size: 32px; }
}

@keyframes opening-blue-beat {
  0%, 100% { opacity: 0; animation-timing-function: cubic-bezier(.36, 0, .62, 1); }
  13% { opacity: 1; animation-timing-function: ease-out; }
  24% { opacity: .14; animation-timing-function: ease-in-out; }
  34% { opacity: .76; animation-timing-function: cubic-bezier(.18, .52, .32, 1); }
  74% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .opening-blue-plate .opening-blue-pulse { animation: none; }
  .opening-red-pulse img { animation: none; opacity: .3; }
  .opening-menu, .opening-navigation { animation: none; }
  .opening-menu-toggle, .opening-navigation-links a { transition: none; }
}
