.rt-brand-lockup {
  position: relative;
  display: inline-flex;
  max-width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1vw, 16px);
  line-height: 0;
  isolation: isolate;
}

.rt-brand-lockup img {
  display: block;
  flex: 0 0 auto;
  max-width: none;
  height: auto;
  margin: 0;
  object-fit: contain;
}

.rt-nav__brand {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  line-height: 0;
}

.rt-nav__brand .rt-brand-lockup--nav {
  justify-content: flex-start;
  gap: clamp(7px, .75vw, 11px);
}

.rt-nav__brand .rt-brand-lockup--nav .rt-brand-lockup__mark {
  position: static;
  width: clamp(31px, 2.65vw, 38px);
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, .72)) drop-shadow(0 5px 10px rgba(0, 0, 0, .3));
}

.rt-nav__brand .rt-brand-lockup--nav .rt-brand-lockup__wordmark {
  position: static;
  /* Der sichtbare „RAIL TIME“-Schriftzug liegt damit bei rund 75 % der Markenhöhe. */
  width: clamp(219px, 18.7vw, 269px);
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .22));
}

.rt-hero .rt-intro-logo .rt-brand-lockup--hero {
  flex-direction: row;
  gap: clamp(13px, 1.8vw, 26px);
  padding: clamp(10px, 1.5vw, 18px);
}

body .rt-hero .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__mark {
  position: relative;
  width: clamp(92px, 11vw, 146px);
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, .8)) drop-shadow(0 22px 38px rgba(0, 0, 0, .62));
}

body .rt-hero .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__wordmark {
  position: relative;
  width: clamp(180px, 22vw, 300px);
  filter: drop-shadow(0 16px 30px rgba(0, 0, 0, .65));
}

.theme-1 .rt-intro-section__brand {
  margin-bottom: clamp(20px, 2.6vw, 34px);
}

.theme-1 .rt-intro-section__brand .rt-brand-lockup--content {
  justify-content: flex-start;
  gap: clamp(10px, 1.2vw, 16px);
}

.theme-1 .rt-intro-section__brand .rt-brand-lockup__mark {
  width: clamp(42px, 4vw, 58px);
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, .72)) drop-shadow(0 12px 20px rgba(0, 0, 0, .4));
}

.theme-1 .rt-intro-section__brand .rt-brand-lockup__wordmark {
  width: clamp(148px, 15vw, 205px);
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .35));
}

.rt-footer__brand .rt-brand-lockup--footer {
  justify-content: flex-start;
  gap: clamp(11px, 1.2vw, 17px);
  margin-bottom: 22px;
}

.rt-footer__brand .rt-brand-lockup--footer .rt-brand-lockup__mark {
  width: clamp(52px, 5vw, 70px);
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, .74)) drop-shadow(0 12px 22px rgba(0, 0, 0, .42));
}

.rt-footer__brand .rt-brand-lockup--footer .rt-brand-lockup__wordmark {
  width: clamp(168px, 16vw, 228px);
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, .4));
}

.theme-3 .rt-hero:is(.is-video-finishing, .is-video-complete) .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__mark,
.theme-5 .rt-hero:is(.is-video-finishing, .is-video-complete) .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__mark {
  width: clamp(72px, 7.5vw, 96px);
  transition: width 1s cubic-bezier(.16, 1, .3, 1);
}

.theme-3 .rt-hero:is(.is-video-finishing, .is-video-complete) .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__wordmark,
.theme-5 .rt-hero:is(.is-video-finishing, .is-video-complete) .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__wordmark {
  width: clamp(145px, 15vw, 205px);
  transition: width 1s cubic-bezier(.16, 1, .3, 1);
}

@media (max-width: 620px) {
  .rt-nav__brand .rt-brand-lockup--nav .rt-brand-lockup__mark { width: 28px; }
  .rt-nav__brand .rt-brand-lockup--nav .rt-brand-lockup__wordmark { width: 198px; }

  .rt-hero .rt-intro-logo .rt-brand-lockup--hero { gap: 11px; padding-inline: 12px; }
  body .rt-hero .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__mark { width: 80px; }
  body .rt-hero .rt-intro-logo .rt-brand-lockup--hero .rt-brand-lockup__wordmark { width: min(178px, 55vw); }

  .rt-footer__brand .rt-brand-lockup--footer .rt-brand-lockup__mark { width: 46px; }
  .rt-footer__brand .rt-brand-lockup--footer .rt-brand-lockup__wordmark { width: min(168px, 58vw); }
}

@media (max-width: 380px) {
  .rt-nav__brand .rt-brand-lockup--nav .rt-brand-lockup__mark { width: 25px; }
  .rt-nav__brand .rt-brand-lockup--nav .rt-brand-lockup__wordmark { width: 177px; }
}

@media (prefers-reduced-motion: reduce) {
  .rt-brand-lockup img { transition: none !important; }
}