html{scroll-behavior:smooth}
.demo-strip{font-family:Avenir,Arial,sans-serif;color:#171717;background:#f4f4f4;padding:56px 28px 24px;scroll-margin-top:0}
.demo-strip-heading{text-align:center;margin:0 auto 28px}
.demo-strip h2{font-family:'Helvetica Now Display',Arial,sans-serif;font-size:32px;line-height:1.15;letter-spacing:-1.1px;margin:0 0 10px}
.demo-strip-heading p{font-size:15px;line-height:1.5;color:#737373;margin:0}
.demo-strip-heading strong{font-weight:500;color:#222}
.demo-touch-hint{display:none}
.demo-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1030px;margin:auto}
.demo-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 3px 14px #00000007;display:flex;flex-direction:column;min-width:0}
.demo-photo{position:relative;aspect-ratio:1.3;background:#fff;overflow:hidden}
.demo-photo img.catalog-photo{width:100%;height:100%;object-fit:contain;padding:22px}
.demo-photo img.reference-photo{position:absolute;max-width:none;object-fit:fill}
.demo-card-body{padding:9px 15px 0;display:flex;flex:1;flex-direction:column}
.demo-catalog{background:linear-gradient(#fff5a2,#ffe600);border-radius:10px;text-align:center;padding:6px;font-size:15px;font-weight:700}
.demo-card h3{font-size:15px;line-height:1.4;font-weight:400;letter-spacing:-.2px;min-height:42px;margin:7px 0 3px}
.demo-store{color:#999;font-size:11px;line-height:1.5}
.demo-rating{font-size:13px;margin:5px 0 12px;white-space:nowrap}
.demo-rating>span:first-child{color:#1683ff}.demo-sold{color:#9597a2}
.demo-offer{margin-bottom:16px}.demo-offer s{font-size:12px;color:#9295a2}
.demo-price{font-size:29px;line-height:1.3;letter-spacing:-.8px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.demo-price span{background:#00b85c;color:#fff;font-size:12px;letter-spacing:-.3px;padding:3px 4px;border-radius:3px;white-space:nowrap}
.demo-installment{font-size:12px;color:#00a650;margin-top:2px}.demo-shipping{color:#00a650;font-size:12px;margin-top:10px}.demo-shipping b{margin-left:8px;font-style:italic}
.demo-extension{border:1px solid #eff0f2;border-radius:16px 16px 8px 8px;padding:6px 5px 0;margin:auto -8px 0}
.demo-metrics{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:5px;text-align:center}
.demo-metrics>div{border-radius:11px;padding:11px 2px;background:#f0f3f5}
.demo-metrics span{display:block;font-size:12px;color:#333;margin-bottom:4px;line-height:1.2}
.demo-metrics strong{display:block;font-size:19px;line-height:1.2;letter-spacing:-.6px;white-space:nowrap}
.demo-metrics .demo-yellow{background:linear-gradient(#fff5a2,#ffe600)}
.demo-analysis{font:14px Avenir,Arial,sans-serif;text-align:left;display:flex;align-items:center;gap:10px;border:0;background:#fff;width:100%;min-height:40px;padding:8px 10px;border-radius:0 0 8px 8px;cursor:pointer;color:#171717;touch-action:manipulation}
.demo-analysis>span{font-size:21px;line-height:1;transition:transform .15s}.demo-analysis:hover>span{transform:translateX(3px)}
.demo-analysis:focus-visible,.demo-preview-close:focus-visible{outline:2px solid #171717;outline-offset:-3px}
.demo-data-note{font-size:11px;text-align:center;color:#898989;line-height:1.5;margin:14px 0 0}
.demo-preview{position:fixed;z-index:100;width:360px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;background:#fff;border:1px solid #e8e8e8;border-radius:17px;box-shadow:0 12px 45px #00000024;padding:23px 20px 17px;font-family:Avenir,Arial,sans-serif;color:#171717}
.demo-preview[hidden]{display:none}
.demo-preview-kicker{display:block;padding-right:22px;font-size:10px;font-weight:600;color:#7d7460;line-height:1.5}
.demo-preview h3{font-size:18px;letter-spacing:-.5px;margin:7px 0 15px;line-height:1.3}
.demo-preview-close{position:absolute;right:10px;top:10px;width:32px;height:32px;border:0;border-radius:50%;background:#f5f5f5;font:23px Arial,sans-serif;color:#555;cursor:pointer}
.demo-preview .chart{display:block;width:100%;height:auto}.demo-preview .chart text{font:9px Arial,sans-serif;fill:#8b8d84}
.demo-chart-key{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:10px;color:#666}
.demo-chart-key span{display:flex;gap:5px;align-items:center}.demo-chart-key i{display:block;width:14px;border-top:2px solid #20241a}.demo-chart-key i.future{border-top:2px dashed #a18c00}
.demo-preview p{margin:15px 0 0;font-size:10px;line-height:1.6;color:#888}
@media(max-width:760px){.demo-strip{padding:34px 0 20px}.demo-strip-heading{padding:0 22px;margin-bottom:22px}.demo-strip h2{font-size:26px}.demo-strip-heading p{font-size:13px}.demo-cards{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:0 22px 12px;gap:14px;scrollbar-width:thin;scrollbar-color:#d5d5d5 transparent}.demo-card{flex:0 0 min(82vw,320px);scroll-snap-align:center}.demo-photo{aspect-ratio:1.4}.demo-preview{width:350px}}
@media(hover:none){.demo-desktop-hint{display:none}.demo-touch-hint{display:inline}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.demo-analysis>span{transition:none}}
