@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/cormorant-garamond-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/cormorant-garamond-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/cormorant-garamond-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/cormorant-garamond-latin-500-italic.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/jost-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/jost-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jost-latin-500-normal.woff2) format('woff2')}

:root{--bg:#04080C;color-scheme:dark;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);background:var(--bg)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#04080C}}
:root[data-theme="dark"]{--bg:#04080C}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#010305}
img{max-width:100%}
a{color:#BFE9EE}a:hover{color:#FFFFFF}

.nav-menu{display:none;position:static}.nav-menu summary::-webkit-details-marker{display:none}
@media (max-width:1100px){.nav-wide{display:none!important}.nav-menu{display:block}}
.buybar{display:none}@media (max-width:720px){.buybar{display:flex}body{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}}


html{background:#010305}
.seabg{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#0f5a78 0%,#0b3d57 22%,#072536 45%,#041420 70%,#02080e 100%);transition:filter .3s}
#snow{position:fixed;inset:0;z-index:0;pointer-events:none;width:100%;height:100%}
.rays{position:absolute;inset:-10% -20% 20% -20%;pointer-events:none;background:repeating-linear-gradient(100deg,rgba(170,235,245,0) 0 60px,rgba(170,235,245,.07) 80px,rgba(170,235,245,0) 120px 200px);transform-origin:50% 0;animation:sway 14s ease-in-out infinite alternate;-webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 45%,transparent 80%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 45%,transparent 80%)}
.caustics{position:absolute;left:0;right:0;top:0;height:120px;pointer-events:none;background:radial-gradient(ellipse 60px 14px at 20% 30%,rgba(200,245,250,.10),transparent 70%),radial-gradient(ellipse 90px 18px at 55% 55%,rgba(200,245,250,.08),transparent 70%),radial-gradient(ellipse 70px 12px at 82% 25%,rgba(200,245,250,.09),transparent 70%);animation:shimmer 7s ease-in-out infinite alternate}
@keyframes sway{from{transform:skewX(-4deg) translateX(-2%)}to{transform:skewX(4deg) translateX(2%)}}
@keyframes shimmer{from{transform:translateX(-3%);opacity:.6}to{transform:translateX(3%);opacity:1}}
.depth{position:fixed;z-index:25;right:12px;top:76px;display:flex;flex-direction:column;align-items:flex-end;gap:2px;padding:8px 12px;border:1px solid rgba(143,220,227,.35);background:rgba(2,10,16,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:20px;font-family:Jost,'Helvetica Neue',sans-serif;color:#BFE9EE;pointer-events:none}
.depth b{font-weight:400;font-size:.95rem;letter-spacing:.06em}.depth span{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#8FDCE3}
.wave{display:block;width:100%;height:46px}
@media (max-width:720px){.depth{top:auto;right:auto;left:10px;bottom:calc(80px + env(safe-area-inset-bottom,0px));padding:5px 10px;align-items:flex-start}.depth b{font-size:.85rem}.depth span{font-size:.56rem}}
@media (min-width:721px){.depth{top:50%;transform:translateY(-50%)}}
@media (prefers-reduced-motion:reduce){.rays,.caustics{animation:none}}


.swimmers{position:absolute;left:0;right:0;top:0;bottom:0;z-index:0;pointer-events:none;overflow:hidden}
.sw{position:absolute;height:auto;filter:drop-shadow(0 0 16px rgba(120,230,240,.6));will-change:transform}
.sw-ltr{left:-260px;animation:swimR linear infinite}.sw-rtl{right:-260px;animation:swimL linear infinite}
.sw-up{left:70%;animation:drift ease-in-out infinite alternate}.sw-crawl{left:-220px;animation:swimR linear infinite;filter:blur(.4px) drop-shadow(0 0 10px rgba(120,230,240,.4))}
@keyframes swimR{0%{transform:translate(0,0)}25%{transform:translate(30vw,-30px)}50%{transform:translate(60vw,10px)}75%{transform:translate(90vw,-20px)}100%{transform:translate(calc(100vw + 520px),0)}}
@keyframes swimL{0%{transform:translate(0,0) scaleX(-1)}50%{transform:translate(-55vw,30px) scaleX(-1)}100%{transform:translate(calc(-100vw - 520px),0) scaleX(-1)}}
@keyframes drift{0%{transform:translate(0,40px)}50%{transform:translate(-40vw,-60px)}100%{transform:translate(-62vw,20px)}}
.bubbles{position:absolute;left:0;right:0;bottom:0;height:100%;pointer-events:none;overflow:hidden}
.bubbles i{position:absolute;bottom:-20px;border-radius:50%;border:1px solid rgba(200,245,250,.45);background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.35),rgba(200,245,250,.05) 60%);animation:rise linear infinite}
@keyframes rise{0%{transform:translate(0,0);opacity:0}10%{opacity:.9}50%{transform:translate(8px,-45vh)}100%{transform:translate(-6px,-95vh);opacity:0}}
.dmark{position:absolute;right:clamp(12px,3vw,40px);top:-11px;padding:2px 10px;border:1px solid rgba(143,220,227,.35);border-radius:12px;background:rgba(2,10,16,.85);font-family:Jost,sans-serif;font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:#8FDCE3;pointer-events:none;z-index:2}
#gallery img,#pages img{transition:box-shadow .4s, transform .4s}
#gallery img:hover,#pages img:hover{box-shadow:0 0 28px rgba(120,230,240,.45);transform:translateY(-2px)}
.seafloor{display:block;width:100%;height:auto;margin-bottom:-2px}
@media (max-width:720px){.sw{max-width:120px}}
@media (prefers-reduced-motion:reduce){.sw,.bubbles i{animation:none}.bubbles{display:none}}


.deeplife{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.dl{position:absolute;margin:0;width:var(--w);opacity:0;transition:opacity 1.2s ease;display:flex;flex-direction:column;align-items:center;gap:4px;will-change:transform,opacity}
.dl img{width:100%;height:auto}
.dl figcaption{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:.95rem;line-height:1.2;color:#CFEFF2;text-align:center;text-shadow:0 0 8px #000}
.dl figcaption span{font-family:Jost,sans-serif;font-style:normal;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#8FDCE3}
.dl-ltr{left:calc(-1 * var(--w) - 40px);animation:dlR linear infinite}
.dl-rtl{left:100%;animation:dlL linear infinite}.dl-rtl img{transform:scaleX(-1)}
.dl-up{left:62%;animation:dlU ease-in-out infinite alternate}
.dl-crawl{left:calc(-1 * var(--w) - 40px);animation:dlR linear infinite}
@keyframes dlR{0%{transform:translate(0,0)}25%{transform:translate(30vw,-24px)}50%{transform:translate(60vw,8px)}75%{transform:translate(90vw,-16px)}100%{transform:translate(calc(100vw + var(--w) + 80px),0)}}
@keyframes dlL{0%{transform:translate(0,0)}50%{transform:translate(-55vw,26px)}100%{transform:translate(calc(-100vw - var(--w) - 80px),0)}}
@keyframes dlU{0%{transform:translate(0,30px)}50%{transform:translate(-30vw,-40px)}100%{transform:translate(-52vw,24px)}}
@media (max-width:720px){.dl{--w:120px !important;width:120px}.dl figcaption{display:none}}
@media (prefers-reduced-motion:reduce){.dl{animation:none;left:auto;right:6%}}

.sp-g{background-image:url(/media/i-f0a8e08753.webp)}.sp-s{background-image:url(/media/i-10705f3b40.webp)}.sp-v{background-image:url(/media/i-ee7cc4f06c.webp)}

.shoal{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;transition:opacity 1.2s ease;opacity:1}
.school{position:absolute;width:220px;height:60px;left:-260px;animation:schoolR linear infinite}
.school-l{left:100%;animation-name:schoolL}
.school i{position:absolute;display:block;animation:wiggle ease-in-out infinite alternate}
.school-l i{animation-name:wiggleL}
.school svg{display:block;width:100%;height:auto;filter:drop-shadow(0 0 3px currentColor) drop-shadow(0 0 9px currentColor);animation:fluo 2.4s ease-in-out infinite alternate}
@keyframes fluo{from{opacity:.75}to{opacity:1}}
@keyframes schoolR{0%{transform:translate(0,0)}30%{transform:translate(35vw,-18px)}60%{transform:translate(70vw,10px)}100%{transform:translate(calc(100vw + 520px),-6px)}}
@keyframes schoolL{0%{transform:translate(0,0)}35%{transform:translate(-40vw,16px)}70%{transform:translate(-80vw,-10px)}100%{transform:translate(calc(-100vw - 520px),4px)}}
@keyframes wiggle{from{transform:translateY(-2px) rotate(-3deg)}to{transform:translateY(2px) rotate(3deg)}}
@keyframes wiggleL{from{transform:scaleX(-1) translateY(-2px) rotate(-3deg)}to{transform:scaleX(-1) translateY(2px) rotate(3deg)}}
@media (max-width:720px){.school{scale:.75}}
@media (prefers-reduced-motion:reduce){.school,.school i{animation:none}.school{left:8%}.school-l{left:auto;right:8%}}

.snd{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px 0 10px;border-radius:22px;border:1px solid rgba(143,220,227,.6);background:rgba(2,12,18,.6);color:#BFE9EE;font:400 .6875rem/1 Jost,'Helvetica Neue',sans-serif;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;white-space:nowrap;box-shadow:0 0 14px rgba(110,220,235,.3);animation:sndh 2.6s ease-in-out infinite}
.snd:hover{color:#fff;border-color:#8FDCE3}
.snd[aria-pressed="true"]{animation:none;background:rgba(143,220,227,.18)}
.snd .w1,.snd .w2{opacity:.35}.snd[aria-pressed="true"] .w1,.snd[aria-pressed="true"] .w2{opacity:1;animation:sndw 1.6s ease-in-out infinite}
.snd[aria-pressed="true"] .w2{animation-delay:.3s}
@keyframes sndw{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes sndh{0%,100%{box-shadow:0 0 8px rgba(110,220,235,.2)}50%{box-shadow:0 0 22px rgba(110,220,235,.75)}}
.hdr-right{display:flex;align-items:center;gap:12px}
.sndhero{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 24px;border:1px solid rgba(143,220,227,.6);background:transparent;color:#BFE9EE;font:400 .875rem/1 Jost,'Helvetica Neue',sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.sndhero::before{content:"";width:10px;height:10px;border-radius:50%;background:#8FDCE3;box-shadow:0 0 12px #8FDCE3;animation:sndw 1.6s ease-in-out infinite}
.sndhero[aria-pressed="true"]{background:rgba(143,220,227,.15)}
@media (max-width:600px){.snd span{display:none}.snd{padding:0;width:42px;height:42px;justify-content:center;min-height:42px}.hdr-right{gap:6px}header a[href="#top"],header a[href="/"]{font-size:1.1rem!important;letter-spacing:.14em!important}}
.school i{transition:opacity .35s ease}.school i.dim{opacity:.07!important}.dl img{transition:opacity .45s ease}.dl.dim img{opacity:.12}
.stripc{transition:transform .35s ease,box-shadow .35s ease}.stripc:hover{transform:translateY(-3px);box-shadow:0 0 34px rgba(110,220,235,.45)!important}
img[width][height]{height:auto}
.stripc{transition:transform .35s ease,box-shadow .35s ease}.stripc:hover{transform:translateY(-3px);box-shadow:0 0 34px rgba(110,220,235,.45)!important}

.dl,.bubbles i,.rays,.caustics,.school,.school i,.school svg{animation-play-state:paused}body.ready .dl,body.ready .bubbles i,body.ready .rays,body.ready .caustics,body.ready .school,body.ready .school i,body.ready .school svg{animation-play-state:running}

img[width][height]{height:auto}
