:root {
  --oniva-deep: #071f3d;
  --oniva-blue: #0a5ca8;
  --oniva-gold: #ffb000;
  --oniva-contact-text: #f8fbff;
  --oniva-contact-muted: #c7d8eb;
}

.brand-logo {
  width: clamp(52px, 5vw, 70px);
  height: clamp(52px, 5vw, 70px);
  object-fit: contain;
  flex: 0 0 auto;
  filter: drop-shadow(0 9px 20px rgba(4, 24, 49, 0.2));
}

.oniva-contact-bar {
  position: relative;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-height: 42px;
  padding: 7px 18px;
  color: var(--oniva-contact-text);
  background:
    radial-gradient(circle at 15% 0%, rgba(22, 130, 226, 0.36), transparent 38%),
    linear-gradient(105deg, #061a34, var(--oniva-deep));
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 0.875rem;
  line-height: 1.35;
}

.oniva-contact-bar strong {
  color: var(--oniva-gold);
  font-weight: 850;
  letter-spacing: 0.025em;
}

.oniva-contact-bar a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 2px 7px;
  color: var(--oniva-contact-text);
  text-decoration: none;
  font-weight: 750;
  border-radius: 999px;
  transition:
    color 160ms ease,
    background 160ms ease,
    transform 160ms ease;
}

.oniva-contact-bar a:hover,
.oniva-contact-bar a:focus-visible {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.11);
  outline: 2px solid rgba(255, 176, 0, 0.7);
  outline-offset: 2px;
  transform: translateY(-1px);
}

.oniva-contact-separator {
  width: 1px;
  height: 18px;
  background: rgba(255, 255, 255, 0.18);
}

@media (max-width: 720px) {
  .oniva-contact-bar {
    flex-wrap: wrap;
    gap: 3px 12px;
    padding: 8px 10px;
    text-align: center;
  }

  .oniva-contact-bar strong {
    width: 100%;
  }

  .oniva-contact-separator {
    display: none;
  }

  .brand-logo {
    width: 54px;
    height: 54px;
  }
}