/* Cabecera del faro de Cabo de Palos. */
.brand { width: clamp(158px, 12.2vw, 192px); }

.ocean {
  --air-surface-x: 79.8%;
  --air-surface-y: min(calc(var(--horizon) - 13px), calc(var(--horizon) * .5 + 8vw));
  --air-surface-mask: linear-gradient(to bottom,
    transparent var(--air-surface-y), #000 calc(var(--air-surface-y) + 88px));
}

.air-entry {
  left: var(--air-surface-x);
  top: var(--air-surface-y);
  background: #f3d481;
}

.air-guide {
  -webkit-mask-image: var(--air-surface-mask);
  mask-image: var(--air-surface-mask);
}

@media (min-width: 2000px) {
  :root { --horizon: 19vw; }
  .surface .air-stop { top: calc(var(--horizon) + 62px); }
}

@media (max-width: 640px) {
  .brand { width: clamp(110px, 32vw, 126px); }
  .ocean {
    --air-surface-x: max(79.8%, calc(70% + 33.8px));
    --air-surface-y: calc(var(--horizon) * .56 + 4vw);
  }
}

/* El fondo acompaña el pie y queda detrás de sus enlaces. */
.footer { z-index: 1; }
.ocean-floor {
  position: relative;
  height: clamp(69px, 16vw, 260px);
  margin-top: clamp(-54px, -3vw, -14px);
  overflow: hidden;
  pointer-events: none;
}
.ocean-floor img {
  position: absolute;
  left: 50%;
  bottom: -8px;
  width: min(100%, 1920px);
  height: auto;
  transform: translateX(-50%);
  opacity: .7;
}
.artist-card .portrait-dahia { object-position: center 28%; }
.artist-card .portrait-bigbud { object-position: center 24%; }