.site-header {
  background: var(--navy-900) url("../img/hero/fundo-ondas.jpg") center / cover no-repeat;
  position: relative;
}
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 6px 12px; }
.brand { flex: 0 0 auto; display: block; width: clamp(240px, 34vw, 520px); }
.brand img {
  width: 100%;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent), linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent);
  -webkit-mask-composite: source-in;
          mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent), linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent);
          mask-composite: intersect;
}
.search {
  flex: 0 1 520px; display: flex; align-items: center;
  background: var(--white); border-radius: 999px; padding: 4px;
  box-shadow: 0 0 0 2px rgba(25, 155, 255, .55), 0 0 24px rgba(10, 132, 255, .55);
}
.search input { flex: 1; min-width: 0; width: 100%; border: 0; background: transparent; padding: 14px 20px; font: 500 17px var(--font); color: var(--ink); outline: none; }
.search input::placeholder { color: #6b7790; }
.search button { flex: 0 0 auto; border: 0; cursor: pointer; width: 84px; height: 46px; border-radius: 999px; color: var(--white); background: linear-gradient(180deg, #1b9bff, #0a6cf0); display: grid; place-items: center; }
.search:focus-within { box-shadow: 0 0 0 3px var(--cyan-300), 0 0 28px rgba(25, 230, 230, .5); }
.social { display: flex; align-items: center; gap: 18px; flex: 0 0 auto; }
.social a, .social-off { display: block; transition: transform .15s ease; }
.social a:hover { transform: translateY(-2px); }
.social-off { opacity: .85; cursor: default; }
