/* Shared product compositions. App/preview source pixels remain unchanged. */
:root{--art-shadow:#0008;--art-contact:#0005}
:root[data-site-theme=light]{--art-shadow:#17263830;--art-contact:#17263826}
@media(prefers-color-scheme:light){:root.site-theme:not([data-site-theme=dark]){--art-shadow:#17263830;--art-contact:#17263826}}
/* Neutral surfaces: the accent is reserved for type, controls and small details. */
:is(.site-theme,.preview-theme) body.theme-home{background:var(--paper)!important}
.theme-home :is(.spot-teaser,.spot-collection){background:var(--surface)!important}
.calculator-composition,.scanner-composition{position:relative;width:100%;max-width:660px;aspect-ratio:6/5;isolation:isolate;--hero-pair-progress:0}
.calculator-composition:after,.scanner-composition:after{content:'';position:absolute;left:15%;right:9%;bottom:0;height:8%;background:radial-gradient(ellipse,var(--art-contact),transparent 68%);z-index:-1;pointer-events:none}
.calculator-composition .calculator-handset{position:absolute;display:flex;align-items:center;justify-content:center;transform-origin:center}
.calculator-composition .product-hero-light{left:7%;top:12%;height:78%;width:47%;z-index:1;transform:translateY(calc(var(--hero-pair-progress)*-26px)) rotate(-9deg)}
.calculator-composition .product-hero-dark{right:6%;top:1%;height:93%;width:53%;z-index:2;transform:translateY(calc(var(--hero-pair-progress)*20px)) rotate(6deg)}
.calculator-composition .calculator-handset img{display:block;width:100%;height:100%;object-fit:contain;transform:none;filter:drop-shadow(0 5px 5px var(--art-contact)) drop-shadow(0 18px 20px var(--art-shadow))}
.scanner-composition .scanner-handset{position:absolute;left:43%;top:2%;height:90%;width:47%;transform:rotate(7deg);z-index:1;filter:drop-shadow(0 5px 5px var(--art-contact)) drop-shadow(0 18px 20px var(--art-shadow))}
.scanner-handset svg{display:block;width:100%;height:100%;overflow:visible}
.scanner-composition .scanner-documents{position:absolute;left:7%;top:28%;height:62%;width:42%;z-index:2;transform:rotate(-9deg);filter:drop-shadow(0 6px 5px var(--art-contact)) drop-shadow(0 16px 17px var(--art-shadow));container-type:inline-size}
.scanner-sheet{position:absolute;inset:0;display:block;background:#f9fafb;border:1px solid #dce2e8;border-radius:8px}
.scanner-sheet-back{transform:rotate(-9deg) translate(-5%,1%);background:#bccddd}
.scanner-sheet-middle{transform:rotate(5deg) translate(4%,-4%);background:#d8e2ec}
.scanner-sheet-front{padding:10%;color:#19232e;box-shadow:inset 0 1px 0 #fff}
.scanner-sample-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#8996a4;font-size:clamp(3px,3cqw,10px)}
.scanner-sample-head b{color:#3f5650;font-size:clamp(4px,5cqw,16px);letter-spacing:-.04em}
.scanner-sample-index{display:block;color:#84909a;letter-spacing:.15em;font:clamp(3px,2.8cqw,9px) ui-monospace,monospace;margin-top:15%}
.scanner-sheet-front strong{display:block;font:700 clamp(10px,13cqw,40px)/1.05 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:-.06em;margin-top:8%}
.scanner-sample-lines{margin-top:11%;display:grid;gap:clamp(2px,2.2cqw,7px)}
.scanner-sample-lines i{display:block;height:clamp(1px,1cqw,3px);background:#d5dfe7;border-radius:3px}.scanner-sample-lines i:last-child{width:65%}
.scanner-pdf{position:absolute;bottom:9%;right:9%;background:#1478ef;color:#fff;border-radius:6px;padding:5% 6%;font:650 clamp(7px,4cqw,13px) ui-monospace,monospace;letter-spacing:.06em}
.scanner-preview-label{position:absolute;left:0;right:0;bottom:-4%;text-align:center;color:var(--muted);font:10px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:.03em}
/* Featured art occupies the same visual stage as the approved laptop. */
.spotlight .spot-feature-calculator,.spotlight .spot-feature-scanner{position:absolute;top:16px;right:22px;width:51%;max-width:660px;height:auto;margin:0;pointer-events:none}
.spotlight .spot-teaser-calculator,.spotlight .spot-teaser-scanner{position:absolute;left:auto;right:0;top:10px;width:44%;max-width:300px;height:230px;margin:0;pointer-events:none}
.spotlight .spot-teaser-scanner .scanner-preview-label{bottom:0;font-size:8px}
/* The product pages use the same large compositions, rather than a reduced illustration. */
.product-page-launcher .product-intro{grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);gap:36px;padding-block:56px;min-height:640px}
.product-page .product-laptop-visual{width:120%;max-width:820px;margin-left:-7%;aspect-ratio:1612/976;filter:drop-shadow(0 7px 7px var(--art-contact)) drop-shadow(0 24px 24px var(--art-shadow))}
.product-page-calculator .product-intro{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:36px;padding-block:56px;min-height:640px}
.product-phone-art .calculator-product-art{width:112%;max-width:660px;margin-left:-4%;aspect-ratio:6/5}
.product-phone-art .product-art-caption{margin-top:8px!important}
.theme-paper .wide{max-width:1200px}
.theme-paper .paper-coming-soon{gap:36px;padding-block:56px;min-height:640px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.theme-paper .paper-coming-copy h1{font-size:clamp(48px,5vw,70px)}
.paper-coming-art{min-width:0}.paper-coming-art .scanner-product-art{width:110%;margin-left:-5%;max-width:660px}
@media(max-width:1100px) and (min-width:761px){
 .spotlight .spot-feature-calculator,.spotlight .spot-feature-scanner{width:49%;right:0;top:20px}
 .product-page .product-laptop-visual{width:108%;margin-left:-4%}
 .product-phone-art .calculator-product-art,.paper-coming-art .scanner-product-art{width:100%;margin:0}
}
@media(max-width:900px){
 .product-page-launcher .product-intro,.product-page-calculator .product-intro,.theme-paper .paper-coming-soon{grid-template-columns:minmax(0,1fr);gap:24px;padding-block:38px;min-height:0}
 .product-page .product-laptop-visual{width:100%;max-width:760px;margin:0 auto}
 .product-phone-art .calculator-product-art,.paper-coming-art .scanner-product-art{width:100%;max-width:580px;margin:0 auto}
 .product-page .product-phone-art{min-height:0}
}
@media(max-width:760px){
 .spotlight .spot-panel>.spot-feature-calculator,.spotlight .spot-panel>.spot-feature-scanner{position:relative;inset:auto!important;grid-column:1/-1;grid-row:3;width:220px;max-width:100%;height:160px;margin:0 auto}
 .spotlight .spot-teaser-calculator,.spotlight .spot-teaser-scanner{position:relative;inset:auto!important;width:100%;height:280px;max-width:360px;margin:4px auto 0}
 .spotlight .spot-teaser-scanner .scanner-preview-label{bottom:-1%;font-size:9px}
 .calculator-composition .product-hero-light{transform:translateY(calc(var(--hero-pair-progress)*-16px)) rotate(-7deg)}
 .calculator-composition .product-hero-dark{transform:translateY(calc(var(--hero-pair-progress)*14px)) rotate(5deg)}
 .scanner-preview-label{font-size:9px;bottom:-2%}
 .theme-paper .paper-coming-copy h1{font-size:clamp(43px,9vw,60px)}
}
@media(max-width:360px){.spotlight .spot-panel>.spot-feature-calculator,.spotlight .spot-panel>.spot-feature-scanner{height:110px;width:160px}}
@media(max-width:760px) and (max-height:650px){.spotlight .spot-panel>.spot-feature-calculator,.spotlight .spot-panel>.spot-feature-scanner{height:80px;width:120px}}
@media(prefers-reduced-motion:reduce){.calculator-composition .product-hero-light{transform:rotate(-7deg)}.calculator-composition .product-hero-dark{transform:rotate(5deg)}}