/* A single illustrated water plane; the original underwater world remains intact. */
.waterline{--water-band:clamp(180px,22vw,270px);--boat-width:clamp(230px,27vw,390px);height:var(--water-band);top:calc(var(--surface-y) - var(--water-band)*.62);box-shadow:none;isolation:isolate;background:linear-gradient(180deg,#8fb4b1 0%,#75a5a5 9%,#4f8c91 37%,#397c82 65%,#397c8200 100%)}
.waterline::before{inset:0;left:0;width:100%;height:100%;opacity:1;background:radial-gradient(ellipse at 28% 0%,#f0e4bc66,transparent 63%);border-top:1px solid #e1ead34d}
.waterline .surface-ripples{display:none}
.surface-water-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.waterline .boat{position:absolute;left:64%;top:38%;width:var(--boat-width);height:auto;bottom:auto;translate:0 -56%;transform-origin:50% 69%;animation:none;filter:none;z-index:2;will-change:transform}
.surface-boat-reflection{position:absolute;left:64%;top:38%;width:var(--boat-width);aspect-ratio:2;transform:translateY(5%) scaleY(-.42);transform-origin:50% 50%;opacity:.17;filter:blur(2px);mask-image:linear-gradient(0deg,transparent 22%,#0008 80%);pointer-events:none}
.surface-boat-reflection img{width:100%;height:auto;display:block}
.surface-water-foreground{z-index:3}
/* The distant land belongs on the new horizon rather than across the boat. */
.distant-shore{bottom:calc(clamp(180px,22vw,270px)*.62);opacity:.13;height:20px}
@media(max-width:900px){.waterline .boat,.surface-boat-reflection{left:58%}}
@media(max-width:600px){.waterline{--water-band:180px;--boat-width:220px}.waterline .boat,.surface-boat-reflection{left:calc(64% - 110px)}.waterline .boat{top:42%}.surface-boat-reflection{top:42%}}
@media(prefers-reduced-motion:reduce){.waterline .boat{will-change:auto}}
/* Preserve breathing room around the hero at shorter laptop heights. */
@media(min-width:601px) and (max-height:800px){.waterline{top:calc(var(--surface-y) - var(--water-band)*.62 + 14px)}.distant-shore{bottom:calc(clamp(180px,22vw,270px)*.62 - 14px)}}
@media(max-width:600px){.waterline .boat,.surface-boat-reflection{left:calc(64% - 126px)}}
@media(min-width:901px) and (max-height:800px){.sky-intro{top:135px}}