/* Nur der zusätzliche Einstieg; alle bisherigen Ebenen behalten ihre Regeln. */
#symmle-modern-start.has-sm-intro {
  --sm-intro-header-height: 76px;
  --sm-intro-travel: 1.5;
  --sm-intro-height: max(360px, calc(100svh - var(--sm-intro-inset, 0px)));
}

#symmle-modern-start #symmle-start-intro {
  position: relative;
  margin: calc(-1 * var(--sm-intro-header-height)) 0 0;
  padding: 0;
  background: #020a10;
}

#symmle-modern-start.is-intro-ready #symmle-start-intro {
  /* Gemeinsamer Weg für alle drei Phasen, zusätzlich zur sichtbaren Szene. */
  height: calc(var(--sm-intro-height) * (1 + var(--sm-intro-travel)));
}

/* Auch ein Tablet mit angeschlossener Maus behält den kurzen Touch-Weg. */
@media (any-pointer: coarse) {
  #symmle-modern-start.has-sm-intro { --sm-intro-travel: 0.75; }
}

#symmle-modern-start #symmle-start-intro-scene {
  position: sticky;
  top: var(--sm-intro-inset, 0px);
  height: var(--sm-intro-height);
  min-height: var(--sm-intro-height);
}

#symmle-start-intro-title span {
  opacity: var(--sm-intro-opacity, 1);
  transform: translate3d(0, var(--sm-intro-y, 0px), 0) scale(var(--sm-intro-scale, 1));
  transform-origin: center;
}

/* Der alte Claim-/Canvasblock entfällt. Sein Textabschnitt behält Darstellung
   und Scrollsteuerung; nur der bisherige Überstand in den alten Hero entfällt. */
#symmle-modern-start .sm-hero.sm-hero-after-intro {
  padding-top: 0 !important;
  min-height: 0 !important;
}

#symmle-modern-start .sm-hero-after-intro .sm-current-teaser {
  margin-top: 0 !important;
}

#symmle-modern-start.has-sm-intro .sm-intro-header-links {
  display: flex;
  align-items: center;
  gap: clamp(18px, 3vw, 50px);
  margin-left: auto;
  margin-right: clamp(24px, 3vw, 50px);
}

#symmle-modern-start.has-sm-intro .sm-intro-header-links a {
  display: flex;
  align-items: center;
  min-height: 44px;
  white-space: nowrap;
  font-size: 15px;
  font-weight: 450;
  line-height: 1.4;
}

/* Ein vorhandener Sticky-Header, nur seine Farbgebung folgt dem Szenenende. */
#symmle-modern-start.has-sm-intro.is-intro-active .sm-nav {
  top: var(--sm-intro-inset, 0px);
}

#symmle-modern-start.has-sm-intro.is-intro-active:not(.is-menu-open) .sm-nav {
  border-bottom-color: transparent;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

#symmle-modern-start.has-sm-intro.is-intro-active .sm-brand img {
  filter: brightness(0) invert(1);
}

#symmle-modern-start.has-sm-intro.is-intro-active .sm-nav-menu-link,
#symmle-modern-start.has-sm-intro:is(.is-intro-active, .is-menu-open) .sm-intro-header-links a {
  color: #e3eeeb;
}

#symmle-modern-start.has-sm-intro .sm-intro-header-links a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

/* Die vorhandene Fokusfalle bedient den Menüschalter und die Menüeinträge. */
#symmle-modern-start.has-sm-intro.is-menu-open .sm-intro-header-links {
  visibility: hidden;
}

@media (max-width: 600px) {
  #symmle-modern-start.has-sm-intro .sm-intro-header-links {
    gap: 12px;
    margin-right: 12px;
  }
  #symmle-modern-start.has-sm-intro .sm-intro-header-links a { font-size: 12px; }
  #symmle-modern-start.has-sm-intro .sm-brand img { max-width: 88px; height: auto; }
}

@media (prefers-reduced-motion: reduce) {
  #symmle-modern-start.is-intro-ready #symmle-start-intro { height: auto; }
  #symmle-modern-start #symmle-start-intro-scene { position: relative; top: 0; }
  #symmle-start-intro-title span { opacity: 1; transform: none; }
}
