/* A single continuous water surface replaces the earlier stacked ribbon renderers. */
#hero.ocean-surface {
  background: radial-gradient(ellipse at 80% 20%,#fff9e652,transparent 33%),linear-gradient(180deg,#f8fcfd 0%,#f1f9fc 35%,#e5f4f5 53%,#afd6dc 65%,#397f9b 100%);
  isolation: isolate;
}
#hero.ocean-surface #ocean-canvas {
  display:block !important;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  opacity:1 !important;
  mix-blend-mode:normal !important;
  filter:none !important;
  pointer-events:none;
}
#hero.ocean-surface #hero-canvas,
#hero.ocean-surface .hero-wave,
#hero.ocean-surface .sea-horizon,
#hero.ocean-surface .ripple-layer,
#hero.ocean-surface::after { display:none !important; }
#hero.ocean-surface .sun-disc {
  z-index:3;
  top:7%;
  right:8%;
  width:clamp(160px,23vw,300px);
  height:clamp(160px,23vw,300px);
  opacity:.79;
  background:radial-gradient(circle at 50% 50%,rgba(255,253,232,.96) 0 8%,rgba(255,242,199,.57) 21%,rgba(255,232,180,.23) 38%,rgba(255,230,175,.08) 53%,transparent 71%);
  box-shadow:0 0 110px rgba(255,228,165,.10);
  filter:blur(6px);
  mix-blend-mode:normal;
  animation:none;
  transition:transform 1.1s cubic-bezier(.2,.7,.2,1),opacity .8s,filter .8s;
}
#hero.ocean-surface .sun-disc::before {
  inset:10%;
  opacity:.45;
  background:radial-gradient(circle,rgba(255,255,247,.9),rgba(255,239,179,.16) 40%,transparent 68%);
}
#hero.ocean-surface .sun-disc::after {
  inset:-25%;
  width:auto;
  height:auto;
  border-radius:50%;
  background:radial-gradient(circle,transparent 36%,rgba(255,231,174,.20) 51%,transparent 67%);
  opacity:0;
  filter:blur(11px);
  transform:scale(.76);
  animation:none;
  transition:opacity .7s,transform 1.5s;
}
#hero.ocean-surface .sun-disc.sun-active {
  opacity:.95;
  filter:blur(8px) brightness(1.07);
  transform:scale(1.08);
}
#hero.ocean-surface .sun-disc.sun-active::after {
  opacity:.8;
  transform:scale(1.36);
  animation:none;
}
#hero.ocean-fallback #ocean-canvas { display:none !important; }
#hero.ocean-fallback {
  background:
    radial-gradient(ellipse at 77% 77%,rgba(236,238,203,.30),transparent 32%),
    radial-gradient(ellipse at 19% 83%,rgba(10,83,115,.45),transparent 48%),
    linear-gradient(180deg,#f8fcfc 0%,#edf8f9 48%,#abd7db 59%,#488fa5 76%,#0d587c 100%);
}
@media(max-width:760px) {
  #hero.ocean-surface .sun-disc { top:9%;right:-5%;width:180px;height:180px;opacity:.66; }
}
@media(prefers-reduced-motion:reduce) {
  #hero.ocean-surface .sun-disc,
  #hero.ocean-surface .sun-disc::after { transition:none; }
}