/* Kill theme's red striped bar after logo */
.header__logo::after {
  display: none !important;
}

/* Put menu inline with logo */
.header {
  flex-direction: row !important;
  align-items: center;
}
.header__inner {
  flex: 0 0 auto;
}
.navigation-menu {
  margin: 0 0 0 auto;
}

/* Layered backgrounds — header/footer chrome */
.header {
  background: #021528;
  padding: 20px 40px;
}
.footer {
  background: #021528;
  padding: 30px 40px;
}

/* Logo with SVG image */
.logo {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--accent);
  color: color-mix(in srgb, var(--accent), var(--accent-contrast-color) 90%);
  padding: 5px 10px;
  text-decoration: none;
  overflow: hidden;
  border-radius: 8px;
}

.logo__img {
  height: 2em;
  width: auto;
}

/* Typing animation */
.logo__text {
  white-space: nowrap;
  overflow: hidden;
  width: 0;
  color: white;
  letter-spacing: 0.06em;
  border-right: 2px solid white;
  animation: typing 1.5s steps(13) 0.5s forwards, blink 0.6s step-end infinite;
}

@keyframes typing {
  to { width: calc(13ch + 13 * 0.06em); }
}

@keyframes blink {
  50% { border-color: transparent; }
  0%, 100% { border-color: white; }
}

/* Menu links — white default, red on hover only */
.navigation-menu a,
.menu a {
  color: #e8e8e8 !important;
  text-decoration: none;
}
.navigation-menu a:hover,
.menu a:hover {
  color: #e63946 !important;
}