#home{isolation:isolate}
/* Limit the enhancement to the sea in the photo; keep the original hero design. */
#hero-ocean{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:layout paint;opacity:0;transition:opacity 800ms ease;mask-image:linear-gradient(90deg,transparent 42%,#000 82%),linear-gradient(transparent 18%,#000 28%,#000 44%,transparent 58%);mask-composite:intersect}
#hero-ocean.is-ready{opacity:1}
#hero-ocean canvas{display:block;width:100%;height:100%;pointer-events:none}
.hero-fx-toggle{position:absolute;z-index:2;right:max(24px,calc((100vw - 1200px)/2));bottom:10px;display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border:1px solid #ffffff55;border-radius:99px;background:#0b2d2699;color:#f3e8cf;font:500 10px 'DM Sans',sans-serif;line-height:1.5;backdrop-filter:blur(5px)}
.hero-fx-toggle::before{content:'';width:5px;height:5px;background:#b2bdb7;border-radius:50%}
.hero-fx-toggle[aria-pressed="true"]::before{background:#e9bd6a;box-shadow:0 0 7px #e9bd6a88}
.hero-fx-toggle:hover{background:#12372de6}
.hero-fx-toggle:disabled{opacity:.6;cursor:default}
.hero-fx-toggle[hidden]{display:none}
.hero-fx-toggle span{color:#fff;font-weight:700}
.hero-fx-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:680px){#hero-ocean{mask-image:linear-gradient(transparent 22%,#000 32%,#000 43%,transparent 52%);mask-composite:add}.hero-fx-toggle{top:100px;bottom:auto;right:16px;padding:5px 10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){#hero-ocean{transition:none}}