
.arcaone-banner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 4px 24px; min-height: 90px; padding: 8px 24px; border-radius: 16px;
  color: #f0f0f0; text-decoration: none; background: linear-gradient(110deg, #141918, #22312a);
}
.arcaone-banner:focus-visible { outline: 3px solid #507223; outline-offset: 3px; }
.arcaone-logo { display: block; width: 205px; max-width: 100%; height: auto; }
.arcaone-copy { display: grid; gap: 3px; padding-block: 4px; }
.arcaone-slogan { font-size: clamp(16px, 3vw, 20px); font-weight: 700; }
.arcaone-domain { color: #a6da62; font-size: 13px; }
@media (max-width: 540px) {
  .arcaone-banner { padding: 10px 16px 15px; }
  .arcaone-logo { width: 175px; margin-left: -14px; }
  .arcaone-copy { flex-basis: 100%; }
}

.arcaone-banner { position: relative; isolation: isolate; overflow: hidden; }
.arcaone-banner::before {
  content: ""; position: absolute; z-index: -1; inset: -15%;
  background: url("arcaone-mapa-neuronal.png") center / cover no-repeat;
  opacity: .65;
  animation: neural-drift 8s ease-in-out infinite alternate;
}
.arcaone-banner::after {
  content: ""; position: absolute; z-index: -1; inset: 0;
  background: linear-gradient(90deg, #101715e8, #1017158c);
}
@keyframes neural-drift {
  from { transform: translateX(-2%) scale(1); opacity: .55; }
  to { transform: translateX(2%) scale(1.08); opacity: .9; }
}
@media (prefers-reduced-motion: reduce) {
  .arcaone-banner::before { animation: none; }
}

.arcaone-banner { width: 100%; box-sizing: border-box; }
.arcaone-logo-wrap { position: relative; display: block; max-width: 100%; }
.arcaone-logo-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  mask: url("arcaone-logo.png") center / contain no-repeat;
  background: linear-gradient(110deg, transparent 44%, #fff9 50%, transparent 56%) 100% 0 / 300% 100% no-repeat;
  animation: arcaone-shine 6s ease-in-out infinite;
}
@keyframes arcaone-shine {
  0%, 62% { background-position: 100% 0; }
  85%, 100% { background-position: 0% 0; }
}
@media (max-width: 540px) {
  .arcaone-logo-wrap { margin-left: -14px; }
  .arcaone-logo-wrap .arcaone-logo { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .arcaone-logo-wrap::after { animation: none; background: none; }
}
body.public-blog > header .header-advertising:has(> .arcaone-banner) {
  aspect-ratio: auto;
  align-self: center;
  margin-block: 0;
}
.arcaone-banner { padding-block: 10px; align-content: center; }
@media (max-width: 540px) {
  .arcaone-banner { justify-content: center; text-align: center; }
  .arcaone-logo-wrap { margin-inline: 0; }
}
