.product-page{--px-burgundy:#622338;--px-stone:#f1eeea;--px-rose:#e9dce0;--px-ink:#171816;--scene-progress:0;color:var(--ink)}
.product-page :is(h1,h2,h3,p){margin-top:0}
.product-page p{color:var(--muted);line-height:1.65;max-width:65ch}
.product-page h1{font-size:clamp(46px,6.8vw,94px);line-height:1.02;letter-spacing:-.045em;max-width:15ch;margin-bottom:24px}
.product-page h2{font-size:clamp(34px,4vw,58px);line-height:1.09;letter-spacing:-.035em;margin-bottom:24px}
.product-page h3{font-size:25px;line-height:1.2;letter-spacing:-.015em;margin-bottom:14px}
.product-page .px-kicker{font-size:14px;color:var(--ink);font-weight:500;margin-bottom:22px}
.px-hero{padding-block:72px 48px;display:grid;grid-template-columns:1.35fr 1fr;gap:72px;align-items:end}
.px-hero .px-lede{font-size:20px;max-width:47ch}
.px-hero-aside{padding:30px;border:1px solid var(--line);border-radius:20px;background:var(--soft);margin-bottom:10px}
.px-hero-aside p:last-child{margin-bottom:0}
.px-hero-aside strong{display:block;font:500 42px/1.1 Aventa,Arial,sans-serif;letter-spacing:-.035em;margin-block:14px}
.product-page .actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-block:28px}
.product-page .px-small{font-size:13px;line-height:1.6;color:var(--muted);max-width:100ch}
.px-crosslink{border-block:1px solid var(--line);padding-block:20px;font-size:15px}
.px-crosslink a{color:var(--ink);text-underline-offset:4px}
.px-section{padding-block:82px}
.px-heading{max-width:840px;margin-bottom:36px}
.px-heading>p:not(.px-kicker){font-size:18px}
.px-value-band,.px-soft{background:var(--soft)}
.px-scene{position:relative;padding-block:40px 60px;background:var(--soft)}
.px-scene-sticky{position:relative}
.px-scene-heading{text-align:center}
.px-scene-heading p{margin-inline:auto}
.px-scene-heading h2{font-size:clamp(30px,3.5vw,48px);margin-bottom:24px}
.px-stage{position:relative;max-width:1100px;perspective:1600px;min-height:360px;display:grid;place-items:center;padding-block:15px 25px}
.px-scene-panel{position:relative;width:100%;max-width:850px;transform:translateY(calc(12px - var(--scene-progress)*20px)) rotateX(calc(5deg - var(--scene-progress)*5deg));transform-origin:center;}
.px-scene-panel[hidden],[data-scene-caption][hidden]{display:none!important}
.px-laptop{border:8px solid var(--px-ink);border-radius:18px;overflow:hidden;background:var(--px-stone);box-shadow:0 28px 65px #17181622}
.px-browser-bar{height:28px;display:flex;align-items:center;gap:10px;padding-inline:15px;background:var(--px-ink);color:var(--px-stone);font-size:11px}
.px-browser-bar i{width:6px;height:6px;border-radius:50%;background:var(--px-stone);opacity:.6}
.px-laptop img{display:block;width:100%;height:auto;max-height:450px;object-fit:cover;object-position:top}
.px-phone{position:absolute;width:25%;right:-6%;bottom:-5%;border:7px solid var(--px-ink);border-radius:28px;overflow:hidden;background:white;box-shadow:0 20px 40px #17181633;transform:translateY(calc(15px - var(--scene-progress)*30px)) rotate(calc(5deg - var(--scene-progress)*5deg))}
.px-phone img{display:block;width:100%;height:auto}
.px-scene-bottom{text-align:center;max-width:1000px;margin-top:24px}
.px-scene-bottom p{margin-inline:auto}
.px-scene-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.px-scene-controls button{padding:11px 16px;border:1px solid var(--line);border-radius:30px;background:var(--paper);color:var(--ink);font:500 13px Inter,Arial,sans-serif;cursor:pointer;min-height:44px}
.px-scene-controls button[aria-pressed=true]:not(.px-motion){background:var(--px-burgundy);border-color:var(--px-burgundy);color:white}
.px-scene-controls .px-motion{background:transparent;border-color:transparent;text-decoration:underline;text-underline-offset:4px}
.px-scene-captions h3{font-size:22px;margin-bottom:8px}
.px-scene-captions p{font-size:15px;max-width:68ch;margin-bottom:14px}
.px-report{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:30px 40px;box-shadow:0 25px 60px #17181612;max-width:720px;margin:auto}
.px-report-head{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted);margin-bottom:26px}
.px-report h3{font-size:32px}
.px-finding{display:grid;grid-template-columns:140px 1fr;gap:20px;padding:18px 0;border-top:1px solid var(--line)}
.px-finding span{font-size:13px;color:var(--muted)}
.px-finding strong{font-size:15px;font-weight:500}
.px-report>p{font-size:12px;margin:16px 0 0}
.px-benefits,.px-offers,.px-core-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.px-benefits article,.px-core-grid article{border-top:1px solid var(--line);padding-top:25px}
.px-benefits h3{font-size:26px}
.px-benefits p,.px-core-grid p{font-size:15px}
.px-core-grid{grid-template-columns:repeat(2,1fr);gap:30px 60px}
.px-offer{padding:30px;border:1px solid var(--line);border-radius:18px;background:var(--paper);display:flex;flex-direction:column;align-items:start}
.px-offer .px-offer-price{font:500 40px/1.2 Aventa,Arial,sans-serif;color:var(--ink);margin-bottom:8px}
.px-offer .px-small{margin-bottom:20px}
.px-offer ul{padding-left:19px;line-height:1.8;font-size:15px}
.px-offer .button{margin-top:auto}
.px-offer p{font-size:15px}
.px-module{display:grid;grid-template-columns:1fr 1.35fr;gap:70px;border-top:1px solid var(--line);padding-block:30px}
.px-module p{margin-bottom:12px}
.px-module .px-module-price{color:var(--ink);font-size:20px}
.px-status{font-size:12px;color:var(--muted);display:block;margin-bottom:10px}
.px-details{border-block:1px solid var(--line);padding-block:18px;margin-top:26px}
.px-details summary{font-size:17px;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.px-details summary:after{content:'+'}
.px-details[open] summary:after{content:'−'}
.px-details>div{padding-top:18px}
.px-details p{font-size:15px}
.px-calculator{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.px-fields{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.px-fields label{display:flex;flex-direction:column;justify-content:end;font-size:14px;gap:10px;line-height:1.45;color:var(--ink)}
.px-fields :is(input,select){min-width:0;width:100%;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);font:400 16px Inter,Arial,sans-serif;padding:13px 12px;min-height:48px}
.px-estimate{background:var(--paper);padding:30px;border:1px solid var(--line);border-radius:16px;position:sticky;top:95px}
.px-estimate>strong{font:500 clamp(36px,4vw,56px)/1.1 Aventa,Arial,sans-serif;letter-spacing:-.03em;display:block;margin-block:12px 18px;overflow-wrap:anywhere}
.px-estimate dl{margin-block:25px}
.px-estimate dl>div{display:flex;justify-content:space-between;gap:15px;font-size:14px;border-top:1px solid var(--line);padding-block:12px}
.px-estimate dd{margin:0;text-align:right;white-space:nowrap}
.px-estimate dt{color:var(--muted)}
.px-estimate [role=alert]{color:var(--ink);font-weight:500}
.px-cost-notes{columns:2;column-gap:50px}
.px-cost-notes p{break-inside:avoid}
.px-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding-left:22px}
.px-steps p{font-size:15px}
.px-proof{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.px-proof pre{padding:25px;background:var(--paper);border:1px solid var(--line);border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.8;color:var(--ink)}
.px-final{display:flex;align-items:center;justify-content:space-between;gap:40px}
.product-page :focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.product-page .button:active,.px-scene-controls button:active{transform:scale(.98)}
.px-scene.motion-off .px-scene-panel,.px-scene.motion-off .px-phone{transform:none}
@media(min-width:900px) and (min-height:840px) and (prefers-reduced-motion:no-preference){.px-scene.scene-ready:not(.motion-off){height:230vh;min-height:1750px}.px-scene.scene-ready:not(.motion-off) .px-scene-sticky{position:sticky;top:70px;padding-top:8px}.px-stage{min-height:330px}.px-laptop img{max-height:360px}.px-scene-heading h2{font-size:40px}.px-scene-heading .px-kicker{margin-bottom:12px}.px-scene-bottom{margin-top:18px}.px-scene-controls{margin-bottom:14px}}
@media(max-width:1000px){.px-hero{gap:35px}.px-offers{gap:18px}.px-offer{padding:24px}.px-offer h3{font-size:22px}.px-calculator{gap:28px}.px-stage{width:83%}.px-hero-aside strong{font-size:34px}}
@media(max-width:700px){.px-hero{display:block;padding-block:44px 24px}.product-page h1{font-size:clamp(44px,11vw,65px);max-width:14ch}.px-hero-aside{margin-top:28px;padding:22px}.px-hero-aside strong{font-size:32px}.px-hero .px-lede{font-size:18px}.px-section{padding-block:46px}.px-heading>p:not(.px-kicker){font-size:16px}.px-benefits,.px-offers,.px-core-grid,.px-proof,.px-module,.px-calculator,.px-steps{grid-template-columns:1fr;gap:22px}.px-benefits article{padding-top:18px}.px-module{gap:6px;padding-block:24px}.px-module h3{margin-bottom:8px}.px-fields{gap:18px 14px}.px-fields label{font-size:13px}.px-estimate{position:static;padding:24px}.px-estimate>strong{font-size:42px}.px-cost-notes{columns:1}.px-final{display:block}.px-final .button{margin-top:15px}.px-stage{width:100%;min-height:330px;padding-inline:22px}.px-scene{padding-block:35px}.px-scene-heading h2{font-size:32px;margin-bottom:16px}.px-scene-heading .px-kicker{font-size:12px;margin-bottom:14px}.px-scene-panel{max-width:500px;transform:translateY(calc(8px - var(--scene-progress)*15px))}.px-laptop{border-width:5px;border-radius:12px}.px-browser-bar{font-size:9px;height:24px;padding-inline:8px}.px-phone{position:relative;width:170px;right:auto;bottom:auto;margin:auto;border-width:6px;border-radius:26px}.px-scene[data-stage="0"][data-kind="os"] .px-laptop{display:none}.px-scene[data-stage="0"][data-kind="os"] .px-stage{min-height:375px}.px-laptop img{max-height:300px;object-fit:contain}.px-scene-controls{gap:6px}.px-scene-controls button{font-size:12px;padding-inline:11px;min-height:44px}.px-scene-controls .px-motion{width:100%;min-height:32px}.px-scene-captions h3{font-size:22px}.px-scene-captions p{font-size:14px}.px-report{padding:22px 18px}.px-report-head{font-size:10px;gap:8px}.px-report h3{font-size:27px}.px-finding{grid-template-columns:1fr;gap:7px;padding-block:15px}.px-finding strong{font-size:14px}.px-report>p{font-size:11px}.px-offer{padding:25px}.px-offer .button{margin-top:16px}.px-offer ul{margin-top:0}.px-heading{margin-bottom:26px}.px-steps{gap:15px}.px-steps h3{font-size:22px}.px-crosslink{font-size:14px}}
@media(max-width:380px){.px-fields{grid-template-columns:1fr}.px-estimate dl>div{display:block}.px-estimate dd{text-align:left;margin-top:6px}}
@media(prefers-reduced-motion:reduce){.px-scene,.px-scene.scene-ready{height:auto!important;min-height:0!important}.px-scene-sticky{position:relative!important}.px-scene-panel,.px-phone{transform:none!important}.product-page *{scroll-behavior:auto!important;transition:none!important}}
/* Manual controls require script; the first real screen remains readable without it. */
.px-scene:not(.scene-ready) .px-scene-controls{display:none}
@media(max-width:700px){.px-scene[data-kind="os"] .px-laptop{display:none}.px-scene[data-kind="os"] .px-stage{min-height:375px}}
@media(max-width:700px) and (min-height:800px) and (prefers-reduced-motion:no-preference){
.px-scene.scene-ready:not(.motion-off){height:250vh;min-height:1900px}
.px-scene.scene-ready:not(.motion-off) .px-scene-sticky{position:sticky;top:65px;padding-top:8px}
.px-scene.scene-ready:not(.motion-off) .px-scene-heading .px-kicker{display:none}
.px-scene.scene-ready:not(.motion-off) .px-scene-heading h2{font-size:28px;margin-bottom:10px}
.px-scene.scene-ready:not(.motion-off) .px-stage{min-height:295px;padding-block:8px}
.px-scene.scene-ready:not(.motion-off) .px-phone{width:132px;border-width:5px;border-radius:22px}
.px-scene.scene-ready:not(.motion-off) .px-scene-bottom{margin-top:12px}
.px-scene.scene-ready:not(.motion-off) .px-scene-controls{margin-bottom:10px;gap:4px}
.px-scene.scene-ready:not(.motion-off) .px-scene-captions h3{font-size:20px}
.px-scene.scene-ready:not(.motion-off) .px-scene-captions p{font-size:13px;line-height:1.5;margin-bottom:10px}
.px-scene.scene-ready:not(.motion-off) .px-scene-bottom>.px-small{font-size:11px;line-height:1.4}
}
