.ocean-footer {
  --footer-blue: #0738b6;
  --footer-wave-height: 57px;
  --footer-wave-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 78' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 51c176-19 278-13 409 6 152 21 274 16 405-5 167-26 279-18 389 0 96 15 171 17 237 7v19H0Z'/%3E%3C/svg%3E");
  --footer-pointer-x: 50%;
  --footer-pointer-y: 48%;
  position: relative;
  isolation: isolate;
  display: block;
  overflow: hidden;
  width: 100vw;
  max-width: none;
  min-height: 176px;
  flex: 0 0 auto;
  margin: auto 0 -20px calc(50% - 50vw);
  padding: 74px 24px 27px;
  color: #fff;
  background: transparent;
  text-align: center;
}

.ocean-footer::before {
  position: absolute;
  z-index: 0;
  top: calc(var(--footer-wave-height) - 1px);
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--footer-blue);
  content: "";
}

.ocean-footer-waves {
  position: absolute;
  z-index: 2;
  top: -1px;
  left: 0;
  width: 100%;
  height: var(--footer-wave-height);
}

.wave-soft { fill: rgba(66, 106, 200, .42); }
.wave-foam { fill: rgba(238, 248, 255, .9); }
.wave-deep { fill: var(--footer-blue); }

.ocean-footer-pigments,
.ocean-footer-ink {
  position: absolute;
  z-index: 3;
  top: calc(var(--footer-wave-height) - 1px);
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, .42) 24px, #000 66px);
  mask-image: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, .42) 24px, #000 66px);
}

.ocean-footer-pigments {
  overflow: hidden;
  opacity: .42;
  mix-blend-mode: screen;
}

.ocean-footer-pigments i {
  position: absolute;
  top: 52%;
  width: 390px;
  height: 390px;
  border-radius: 50%;
  opacity: .82;
  will-change: transform;
}

.ocean-footer-pigments i:nth-child(1) { left: -5%; margin-top: -195px; background: radial-gradient(circle, rgba(255, 106, 61, .56), transparent 66%); }
.ocean-footer-pigments i:nth-child(2) { left: 27%; margin-top: -180px; background: radial-gradient(circle, rgba(238, 72, 161, .48), transparent 64%); }
.ocean-footer-pigments i:nth-child(3) { right: 18%; margin-top: -200px; background: radial-gradient(circle, rgba(21, 207, 204, .54), transparent 66%); }
.ocean-footer-pigments i:nth-child(4) { right: -6%; margin-top: -175px; background: radial-gradient(circle, rgba(126, 87, 239, .5), transparent 64%); }

.ocean-footer-ink {
  z-index: 3;
  width: 100%;
  height: 100%;
  opacity: .58;
  mix-blend-mode: screen;
}

.ocean-footer-content {
  position: relative;
  z-index: 4;
  display: grid;
  justify-items: center;
  gap: 13px;
  max-width: 1100px;
  margin: auto;
}

.ocean-footer p,
.ocean-footer small { margin: 0; }

.ocean-footer-brand {
  color: rgba(255, 255, 255, .98);
  font-size: clamp(14px, 1.45vw, 20px);
  font-weight: 520;
  letter-spacing: -.22px;
}

.ocean-footer-brand b { color: #fff; font-weight: 840; }

.ocean-footer-quality {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: rgba(226, 236, 255, .82);
  font-size: clamp(11px, 1.05vw, 15px);
}

.ocean-footer-quality > i { color: rgba(168, 216, 255, .64); font-size: 17px; font-style: normal; }

.manaprocess-signature {
  display: inline-flex;
  align-items: baseline;
  margin-left: 3px;
  color: #fff;
  text-decoration: none;
  font-family: Inter, ui-rounded, "SF Pro Rounded", "SF Pro Display", system-ui, sans-serif;
  font-size: 1.22em;
  font-weight: 820;
  letter-spacing: -1.05px;
}

.manaprocess-signature strong { color: #fff; font-weight: 820; }
.manaprocess-signature em { margin: 0 -2px 0 -1px; color: #ff75b6; font-size: 1.14em; font-style: normal; font-weight: 950; letter-spacing: -2px; }
.manaprocess-signature:hover { text-decoration: underline; text-decoration-color: #ff83bd; }

.ocean-footer-photo {
  color: rgba(213, 231, 255, .64);
  font-size: 8px;
}

.ocean-footer-photo a { color: rgba(227, 242, 255, .76); text-decoration: none; }
.ocean-footer-photo a:hover { text-decoration: underline; }

.admin-quality-footer.ocean-footer {
  width: auto;
  min-height: 168px;
  margin: 28px calc(-1 * clamp(24px, 4.5vw, 76px)) calc(-1 * clamp(24px, 4.5vw, 76px));
  border: 0;
  padding: 72px 25px 27px;
  line-height: normal;
}

@media (max-width: 720px) {
  .ocean-footer { min-height: 194px; padding: 70px 19px 25px; }
  .ocean-footer-pigments { opacity: .35; }
  .ocean-footer-ink { opacity: .5; }
  .ocean-footer-content { gap: 11px; }
  .ocean-footer-brand { max-width: 520px; line-height: 1.35; }
  .ocean-footer-quality { flex-direction: column; gap: 5px; line-height: 1.4; }
  .ocean-footer-quality > i { display: none; }
  .admin-quality-footer.ocean-footer { margin-right: -20px; margin-bottom: -30px; margin-left: -20px; padding-inline: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .ocean-footer-ink { display: none; }
  .ocean-footer-pigments i { transform: none !important; }
}