/* Final product chapter: the existing homepage water returns behind real UI. */
.ls-section{position:relative;isolation:isolate;z-index:2;min-height:100svh;display:flex;align-items:center;padding:64px 6.5%;color:#40574e;background:linear-gradient(110deg,#fffdf5c7,#eef8fb70);scroll-margin-top:0}
.ls-section::before{content:'';position:absolute;inset:0;z-index:-1;background:url('public/media/hero-aqua-reference-clean.webp') center/cover no-repeat;opacity:.15;pointer-events:none;mask-image:linear-gradient(180deg,transparent,#000 22%,#000 80%,transparent)}
.ls-layout{width:100%;max-width:1510px;margin:0 auto;display:grid;grid-template-columns:minmax(0,38fr) minmax(0,62fr);align-items:center;gap:4.5%}
.ls-copy{max-width:430px}.ls-index{font-size:12px;letter-spacing:1.6px;color:#947183;margin-bottom:24px}
.ls-copy h2{font-family:var(--serif);font-size:clamp(46px,4vw,67px);font-weight:400;line-height:1.1;letter-spacing:-1.5px;color:#456353}
.ls-subtitle{font-size:23px;line-height:1.4;letter-spacing:2px;margin-top:10px;color:#526c60}
.ls-description{margin-top:25px}.ls-description h3{font-size:17px;font-weight:600;color:#456353;margin:0 0 9px;line-height:1.5}.ls-description p{font-size:16px;line-height:1.85;color:#465950;text-wrap:pretty;margin:0}
.ls-action{margin-top:27px;display:flex;align-items:center;gap:17px;flex-wrap:wrap}.ls-action small{font-size:11px;color:#66776f}
.ls-demo{display:inline-flex;align-items:center;justify-content:center;gap:25px;background:#61786a;color:#fffdf7;font-size:14px;min-height:46px;padding:10px 22px;border:1px solid #61786a;border-radius:4px;transition:background .2s,border-color .2s}.ls-demo span{font-size:16px}.ls-demo:hover{background:#4d6658;border-color:#4d6658}.ls-demo:focus-visible{outline:2px solid #a16e88;outline-offset:5px}
.ls-product{min-width:0;margin:0}.ls-window{overflow:hidden;background:#fffefa;border:1px solid #e3e8e1;border-radius:10px;box-shadow:0 14px 42px #506b5e12,0 2px 5px #51675d0a}
.ls-browserbar{height:34px;display:flex;align-items:center;gap:17px;padding:0 15px;background:#f9faf6;border-bottom:1px solid #e7e9e2}.ls-browserdots{display:flex;gap:5px}.ls-browserdots i{height:5px;width:5px;background:#cbd4c9;border-radius:50%}.ls-browserdots i:first-child{background:#dcc6cc}.ls-browserbar>span{font:10px var(--sans);color:#829087}
.ls-window img{display:block;width:100%;height:auto;object-fit:contain;background:#fcfbf5}.ls-product figcaption{display:flex;justify-content:space-between;gap:15px;margin-top:14px;font-size:11px;color:#748379}
@media(min-width:1001px) and (max-height:800px){.ls-section{padding-top:42px;padding-bottom:42px}.ls-index{margin-bottom:19px}.ls-copy h2{font-size:51px}.ls-description{margin-top:21px}.ls-description p{line-height:1.8}.ls-action{margin-top:23px}}
@media(max-width:1000px){.ls-section{padding:65px 7%}.ls-layout{grid-template-columns:1fr;gap:35px;max-width:780px}.ls-copy{max-width:620px}.ls-copy h2{font-size:49px}.ls-description p{font-size:16px}.ls-product{width:100%}}
@media(max-width:600px){.ls-section{padding:55px 6% 60px}.ls-copy h2{font-size:43px}.ls-subtitle{font-size:21px}.ls-description{margin-top:23px}.ls-description p{font-size:15px}.ls-action{gap:13px}.ls-browserbar{height:28px;padding:0 11px;gap:12px}.ls-browserbar>span{font-size:9px}.ls-window{border-radius:7px}.ls-product figcaption{font-size:10px}}
@media(prefers-reduced-motion:reduce){.ls-demo{transition:none}}