/* One photographic lagoon, with a continuous descent through quieter water. */
html:has(.ocean-page){overflow-x:hidden}
/* Resizing decorative water must not move the visitor's scroll position. */
.ocean-world,.ocean-page .hero-art{overflow-anchor:none}
.ocean-page{--hero-height:100svh;--lagoon-blue:#366e81;--ink:#edf5ee;--muted:#c0d7d6;--line:#b8e8dd24;--accent:#e5edce;position:relative;isolation:isolate;background:#062b38;color:var(--ink);overflow-x:clip}
.ocean-world{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:linear-gradient(#397f86 0,var(--lagoon-blue) var(--hero-height,820px),#1a4a5b var(--water-height,1900px),#123f52 70%,#062b38 100%)}
.ocean-rays{position:absolute;inset:var(--hero-height,820px) 0 0;background:linear-gradient(105deg,transparent 20%,#d3f5dc08 22%,transparent 35%,#d3f5dc05 44%,transparent 57%);pointer-events:none}
.ocean-bubbles{display:none}
#ocean-water{position:fixed;inset:0;pointer-events:none;opacity:.70;transition:opacity .45s ease}
#ocean-water:empty{display:none}
#ocean-water.behind-copy{opacity:.38}
#ocean-water canvas{display:block;width:100%;height:100%}
.ocean-page main,.ocean-page .footer{position:relative;z-index:1}
.ocean-page .hero{height:clamp(820px,100svh,1060px);min-height:820px;max-height:none;padding:130px 6% 0;isolation:isolate;overflow:visible;background:#163c2b}
.ocean-page .hero-copy{position:relative;z-index:3;width:100%;max-width:960px;margin-inline:auto;text-align:center;pointer-events:none}
.ocean-page .hero-copy a{pointer-events:auto}
.ocean-page h1{font-size:clamp(62px,5.5vw,84px);line-height:1.035;letter-spacing:-4px;font-weight:430;color:#f8f8ec;margin-bottom:24px;text-shadow:0 2px 24px #102e2550}
.ocean-page h1 em{color:#d4e5b9}
.ocean-page .hero .eyebrow{display:flex;justify-content:center;color:#e2e9d7;font-size:8px;letter-spacing:2.5px;margin-bottom:25px}
.ocean-page .status-dot{background:#dcebc4;box-shadow:none}
.ocean-page .hero-description{font-size:14px;line-height:1.85;max-width:520px;margin-inline:auto;color:#ecf0e3;text-shadow:0 1px 10px #0a261b}
.ocean-page .hero-note{display:none}
.ocean-page .hero-actions{justify-content:center;flex-wrap:wrap;gap:18px 24px}
.ocean-page .button{background:#e4edce;color:#203f30;box-shadow:0 8px 24px #0b251922}
.ocean-page .button:hover{background:#f5f8e9;box-shadow:0 8px 24px #0b251944}
.ocean-page .hero .text-link{font-size:11px;color:#edf0e3}
/* Keep the surface framing in the hero, but let its physical water continue
   beneath every process step. Only blend out at the bottom of that descent. */
.ocean-page .hero-art{position:absolute;inset:0 0 auto;height:var(--water-height,100%);z-index:1;pointer-events:none;overflow:hidden;mask-image:linear-gradient(#000 calc(100% - 160px),transparent)}
.ocean-page .hero-art:before{content:'';position:absolute;inset:0 0 auto;height:var(--hero-height,820px);z-index:2;background:radial-gradient(ellipse at 50% 28%,#061b1788,transparent 64%),linear-gradient(#10271722,transparent 65%);mask-image:linear-gradient(#000 65%,transparent);pointer-events:none}
.ocean-page .hero-art:after{content:none}
.ocean-page #dolphin-stage{position:absolute;inset:0;width:100%;height:100%;filter:none;overflow:hidden}
.ocean-page #dolphin-stage:before{content:'';position:absolute;inset:0 0 auto;height:var(--hero-height,820px);background:url('/assets/lagoon-photographic.jpg') center/cover no-repeat}
.ocean-page #dolphin-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.ocean-page .dolphin-fallback{position:absolute;inset:calc(var(--hero-height,820px)*.84) auto auto 50%;width:clamp(185px,23vw,310px);max-width:89%;height:auto;object-fit:contain;mix-blend-mode:normal;opacity:.80;filter:none;animation:none;transform:translate(-50%,-50%)}
.ocean-page .dolphin-fallback[hidden]{display:none}
.dive-cue{position:absolute;left:6%;bottom:35px;font-size:10px;letter-spacing:.1px;z-index:3;color:#e5f2e9;display:grid;grid-template-columns:36px 1fr;align-items:center;gap:6px 12px}
.dive-cue>span{grid-row:1/3;border:1px solid #d5eddf66;border-radius:100%;width:36px;height:43px;display:grid;place-items:center;font-size:20px}
.dive-cue small{font-size:7px;letter-spacing:2px;color:#d2e6df}
.ocean-page .eyebrow,.ocean-page .section-kicker{color:#c9ded7}
.ocean-page .section{position:relative;z-index:1;padding-top:105px;padding-bottom:105px}
.ocean-page .domain-section{border-top:0;background:transparent;max-width:none;gap:60px}
.ocean-page h2{color:#edf5ec}.ocean-page h2 em{color:#c9e1cf}
.ocean-page .domain-section>div>p:not(.eyebrow),.ocean-page .fine-print,.ocean-page .section-heading>p{color:#d0e1dd}
.ocean-page .search-field{background:#f1f6eeef;border-color:#ffffff80;color:#305a59;box-shadow:0 14px 50px #001c3320}
.ocean-page .search-field input#domain-query{color:#244b4d}
.ocean-page .search-field .button{background:#285d55;color:white}
.ocean-page .service-card{background:linear-gradient(150deg,#e4ffff0d,#a4d3ec04);border:1px solid #c2e5e22a;border-radius:22px;box-shadow:0 20px 50px #001f3710}
.ocean-page .service-card>p,.ocean-page .card-number{color:#cfdfdc}
.ocean-page .service-card h3{color:#f0f6ee}
.ocean-page .mini-browser,.ocean-page .service-art{color:#203c50}
.ocean-page .mission{background:transparent;border-block:1px solid var(--line)}
.ocean-page .mission-copy>p:not(.large-copy),.ocean-page .mission-signature{color:#c3dcd8}
.ocean-page .large-copy em,.ocean-page .mission-symbol{color:#d1e3c2}
.ocean-page details p,.ocean-page summary>span{color:#c4ddd8}
.ocean-page .footer{background:transparent;padding-top:36px;padding-bottom:65px;z-index:2;border-top:1px solid #c8e6d522}
.ocean-page .footer p,.ocean-page .footer>a:not(.brand),.ocean-page .footer>span{color:#b9d2d0}
.ocean-page .lx-nav.is-scrolled:before{background:linear-gradient(#11382760,transparent);backdrop-filter:none}
@media(min-width:1560px){.ocean-page .hero{padding-top:150px}}
@media(max-width:1000px){.ocean-page .hero{padding-top:135px}.ocean-page h1{font-size:68px}.ocean-page .hero .text-link{display:none}}
@media(max-width:600px){
  .ocean-page .hero{height:940px;min-height:940px;padding:132px 7% 0}
  .ocean-page h1{font-size:clamp(47px,12.5vw,64px);letter-spacing:-2.8px;line-height:1.07;margin-bottom:22px}
  .ocean-page .hero .eyebrow{font-size:7px;letter-spacing:1.8px;margin-bottom:25px}
  .ocean-page .hero-description{font-size:13px;max-width:310px;line-height:1.85}
  .ocean-page .hero .button{font-size:11px;min-height:48px;padding-inline:23px}
  .ocean-page .hero-art:before{background:linear-gradient(#0a261b40,#0a261b77 35%,transparent 66%)}
  .ocean-page .dolphin-fallback{width:52%}
  .dive-cue{left:7%;bottom:33px;font-size:9px;max-width:205px;gap:5px 9px}
  .dive-cue small{font-size:6px;letter-spacing:1.6px}
  .ocean-page .section{padding:70px 7%}.ocean-page .domain-section{gap:30px}
  .ocean-page .section-heading>p{font-size:13px}
  .ocean-page .footer{padding-bottom:65px}
}