/* The brand's sailing scene. No canvas renderer, downloads or animation library. */
.ntb-ocean { position:relative; perspective:1100px; isolation:isolate; --ocean-x:0deg; --ocean-y:0deg; }
.ocean-stage { transform:rotateX(var(--ocean-x)) rotateY(var(--ocean-y)); transition:transform 700ms cubic-bezier(.2,.7,.2,1); }
.ocean-scene { display:block; aspect-ratio:8/5; overflow:hidden; }
.ocean-scene .boat { transform:translate(240px,211px) scale(1.85); }
.ocean-scene .boat-sway { transform-box:view-box; transform-origin:0 6px; translate:none; rotate:none; animation:ocean-sailing 8.5s ease-in-out infinite; }
.ocean-scene .hull { fill:var(--accent); }
.ocean-scene .mast,.ocean-scene .sail { stroke:var(--accent); stroke-width:1.35; }
.ocean-scene .sail--main { transform-origin:-3px -2px; animation:ocean-billow 6s ease-in-out infinite; }
.ocean-scene .sail--jib { fill:color-mix(in oklab,var(--accent) 12%,var(--surface-raised)); }
.ocean-scene .boat-reflection { fill:var(--accent); opacity:.15; transform:translateY(12px) scaleY(-.55); transform-origin:0 0; }
.ocean-hull-light { stroke:#c9ebff; stroke-width:1; fill:none; opacity:.7; }
.ocean-sail-seam { fill:none; stroke:var(--accent); stroke-width:.65; opacity:.22; }
.ocean-pennant { fill:var(--accent); transform-origin:0 -54px; animation:ocean-pennant 3s ease-in-out infinite; }
.ocean-horizon { stroke:var(--accent); stroke-width:.7; opacity:.12; fill:none; }
.ocean-scene .band { animation-name:ocean-drift; }
.ocean-scene .band--4 { animation-duration:38s; opacity:.68; }
.ocean-scene .band--3 { animation-duration:29s; opacity:.88; }
.ocean-scene .band--2 { animation-duration:23s; }
.ocean-scene .band--1 { animation-duration:18s; }
.ocean-edge { fill:none; stroke:#e5f6ff; stroke-width:.65; opacity:.3; }
.ocean-edge--front { stroke-width:1; opacity:.42; }
.ocean-light { opacity:.4; }
.ocean-ripple { fill:none; stroke:#e5f6ff; stroke-width:.65; opacity:0; transform-origin:0 0; animation:ocean-wake 6s ease-out infinite; }
.ocean-sparkles path { fill:none; stroke:#e5f6ff; stroke-linecap:round; stroke-width:1; opacity:.3; animation:ocean-shimmer 7s ease-in-out infinite; }
.ocean-toggle { display:flex; align-items:center; gap:.45rem; margin:.4rem auto 0; padding:.5rem .75rem; border:1px solid transparent; border-radius:2rem; color:var(--muted); background:transparent; font:inherit; font-size:.75rem; cursor:pointer; }
.ocean-toggle[hidden] { display:none; }
.ocean-toggle:hover { color:var(--accent); border-color:var(--border); }
.ocean-toggle:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.ocean-toggle svg { fill:none; stroke:currentColor; stroke-width:1.7; }
.ocean-play-icon { display:none; }
.ocean-toggle[aria-pressed="true"] .ocean-pause-icon { display:none; }
.ocean-toggle[aria-pressed="true"] .ocean-play-icon { display:block; }
.ntb-ocean[data-running="false"] .ocean-stage, .ntb-ocean[data-running="false"] .ocean-scene * { animation-play-state:paused!important; }
@keyframes ocean-drift { to { transform:translateX(-240px); } }
@keyframes ocean-sailing { 0%,100%{transform:translate(-5px,1px) rotate(-2deg);} 22%{transform:translate(0,-2.5px) rotate(.8deg);} 52%{transform:translate(5px,-1px) rotate(2.2deg);} 78%{transform:translate(1px,2.5px) rotate(-.6deg);} }
@keyframes ocean-billow { 0%,100%{transform:scaleX(1);} 50%{transform:scaleX(1.025) skewY(-.8deg);} }
@keyframes ocean-pennant { 0%,100%{transform:scaleY(.86);} 50%{transform:scaleY(1) skewY(5deg);} }
@keyframes ocean-wake { 0%{transform:scale(.7);opacity:0;} 20%{opacity:.34;} 100%{transform:scale(2.5,2);opacity:0;} }
@keyframes ocean-shimmer { 0%,100%{opacity:.16;transform:translateX(-3px);} 50%{opacity:.42;transform:translateX(3px);} }
/* Native scroll depth is an enhancement. Unsupported browsers keep the full scene. */
@supports (animation-timeline:view()) {
  @media (prefers-reduced-motion:no-preference) and (pointer:fine) {
    .ocean-stage { animation:ocean-depth linear both; animation-timeline:view(); animation-range:entry 0% exit 100%; }
    @keyframes ocean-depth { from{translate:0 5px;} to{translate:0 -9px;} }
  }
}
@media (pointer:coarse) { .ocean-stage{transform:none;transition:none;} .ocean-scene .ocean-sparkles path{animation:none;} }
@media (prefers-reduced-motion:reduce) { .ntb-ocean .ocean-scene *, .ntb-ocean .ocean-stage{animation:none!important;} .ocean-stage{transform:none!important;transition:none!important;} .ocean-toggle{display:none;} }