@font-face{font-family:Italiana;src:url('/vendor/fonts/italiana/files/italiana-latin-400-normal.woff2') format('woff2');font-display:swap}
@font-face{font-family:Manrope;src:url('/vendor/fonts/manrope/files/manrope-latin-400-normal.woff2') format('woff2');font-display:swap}
.ocean-preview{margin:0;background:#f3efe6;color:#262b26;font-family:Manrope,Arial,sans-serif}
.mi-ocean,.mi-ocean *,.ocean-preview *{box-sizing:border-box}
.ocean-preview-header{position:absolute;top:0;left:0;width:100%;padding:24px clamp(24px,5vw,80px);display:flex;justify-content:space-between;align-items:center;gap:24px;z-index:4}
.ocean-preview-header a{color:inherit;text-decoration:none;min-height:44px;display:flex;align-items:center;font:28px Italiana,Georgia,serif}
.ocean-preview-header span{font-size:10px;letter-spacing:.15em;text-transform:uppercase;text-align:right;max-width:180px}
.mi-ocean{position:relative;height:100svh;background:#f3efe6;color:#262b26;font-family:Manrope,Arial,sans-serif}
.mi-ocean--motion{height:460svh}
.mi-ocean__stage{position:relative;top:0;height:100svh;overflow:hidden;isolation:isolate}
.mi-ocean--motion .mi-ocean__stage{position:sticky}
.mi-ocean__heading{position:absolute;inset:17% 24px auto;z-index:0;text-align:center}
.mi-ocean__heading p{font-size:10px;letter-spacing:.22em;text-transform:uppercase;margin:0 0 18px;color:#776f62}
.mi-ocean__heading :is(h1,h2){font:clamp(38px,4.5vw,78px)/1.05 Italiana,Georgia,serif;letter-spacing:-.03em;margin:0;font-weight:400}
.mi-ocean__media{position:absolute;inset:0;background:#0f5b75;z-index:1;pointer-events:none}
.mi-ocean--motion .mi-ocean__media{clip-path:circle(7.75vw at 50% 50%)}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__heading{z-index:2;color:#263d49}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__heading p{color:#263d49}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__hint{color:white;z-index:2}
.mi-ocean__media img,.mi-ocean__media video,.mi-ocean__media canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mi-ocean__media video,.mi-ocean__media canvas{opacity:0}
.mi-ocean__artwork{position:absolute;inset:0;z-index:2;margin:0;background:#eee8dd;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0;visibility:hidden}
.mi-ocean__artwork picture{display:block;width:min(94%,1600px);height:78%;margin-bottom:4svh}
.mi-ocean__artwork img{display:block;width:100%;height:100%;object-fit:contain}
.mi-ocean__artwork figcaption{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:24px;right:24px;text-align:center;font:clamp(24px,2.3vw,38px)/1.2 Italiana,Georgia,serif;text-transform:none;letter-spacing:normal;color:#262b26;mix-blend-mode:normal}
/* Without animation, both the sea and artwork remain accessible, stacked. */
.mi-ocean:not(.mi-ocean--motion){height:auto}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__stage{height:auto;overflow:visible}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__media{position:relative;height:100svh}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__artwork{position:relative;min-height:80svh;opacity:1;visibility:visible}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__artwork picture{height:auto;padding:48px 0 100px}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__artwork img{height:auto}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__heading{top:17svh}
.mi-ocean:not(.mi-ocean--motion) .mi-ocean__hint{top:85svh;bottom:auto}
@media(max-width:900px){
  .mi-ocean--motion .mi-ocean__artwork{flex-direction:column;gap:24px;padding:24px 0}
  .mi-ocean--motion .mi-ocean__artwork picture{width:94%;height:auto;margin:0}
  .mi-ocean--motion .mi-ocean__artwork img{height:auto;max-height:62svh;object-fit:contain}
  .mi-ocean--motion .mi-ocean__artwork figcaption{position:static;margin:0 24px}
}
.mi-ocean__hint{position:absolute;bottom:max(48px,env(safe-area-inset-bottom));left:24px;right:24px;text-align:center;font-size:11px;letter-spacing:.13em;color:#706959}
.mi-ocean__hint::after{content:'↓';display:block;font-size:23px;margin-top:12px}
.ocean-preview-outro{min-height:80svh;padding:clamp(80px,12vw,180px) clamp(24px,10vw,160px);background:#252a25;color:#f3efe6;display:flex;flex-direction:column;justify-content:center}
.ocean-preview-outro h2{font:clamp(42px,6vw,88px)/1.05 Italiana,Georgia,serif;max-width:900px;font-weight:400;margin:0 0 32px}
.ocean-preview-outro p{max-width:600px;color:#c8c1b4;line-height:1.8;font-size:14px;margin:0}
.ocean-preview-outro a{color:#e19b79;min-height:44px;padding:16px 0;margin-top:24px;width:fit-content}
@media(max-width:900px){.mi-ocean--motion{height:360svh}.mi-ocean--motion .mi-ocean__media{clip-path:circle(22vw at 50% 50%)}.ocean-preview-header a{font-size:24px}.ocean-preview-header span{font-size:9px;max-width:120px}.mi-ocean__heading{top:20%}.mi-ocean__heading p{font-size:9px}.mi-ocean__hint{bottom:60px}}
@media(max-height:500px){.mi-ocean__heading{top:18%}.mi-ocean__heading :is(h1,h2){font-size:32px}.mi-ocean__heading p{margin-bottom:8px}.mi-ocean__hint{bottom:20px}.mi-ocean__hint::after{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.mi-ocean{height:100svh}.mi-ocean__stage{position:relative}.mi-ocean__media{clip-path:none}.mi-ocean__heading{z-index:2;color:#263d49}.mi-ocean__heading p{color:#263d49}.mi-ocean__hint{color:white;z-index:2}.mi-ocean__hint::after{display:none}}