/* Product covers are presentation frames around the real catalog preview. */
.product-cover {
  --cover-bg:#dce9ff; --cover-ink:#183675; --cover-accent:#4976d5; --cover-soft:#bdd4ff;
  position:relative; isolation:isolate; display:block; overflow:hidden;
  width:100%; height:100%; min-height:250px; color:var(--cover-ink);
  background:var(--cover-bg); text-align:start; padding:22px;
}
.cover--creator{--cover-bg:#e9e2ff;--cover-ink:#3f236f;--cover-accent:#8b62d0;--cover-soft:#d5c4f9}
.cover--finance{--cover-bg:#d7efe3;--cover-ink:#104f3a;--cover-accent:#4e9f7d;--cover-soft:#b0d9c3}
.cover--marketing{--cover-bg:#ffe1cf;--cover-ink:#873c24;--cover-accent:#d98660;--cover-soft:#f5bc99}
.cover--business{--cover-bg:#ddeaff;--cover-ink:#173d78;--cover-accent:#5b83c0;--cover-soft:#bbd2f3}
.cover--website{--cover-bg:#efe8d8;--cover-ink:#4a4834;--cover-accent:#96936c;--cover-soft:#ddd3b7}
.cover--shopify{--cover-bg:#e0edc6;--cover-ink:#314b1c;--cover-accent:#91ac54;--cover-soft:#bcd38f}
.cover--react{--cover-bg:#d0edf3;--cover-ink:#174453;--cover-accent:#6aa9bd;--cover-soft:#abdae7}
.cover--webgl{--cover-bg:#e1dffa;--cover-ink:#363065;--cover-accent:#8e86cf;--cover-soft:#bcb8e7}
.cover--app{--cover-bg:#ffdce2;--cover-ink:#722c44;--cover-accent:#c8748d;--cover-soft:#f0b1c1}
.product-cover::after{content:"";position:absolute;z-index:-1;width:210px;height:210px;border:42px solid var(--cover-soft);border-radius:50%;inset-inline-end:-95px;top:-48px;opacity:.7}
.cover--variant-1::after{border-radius:24px;transform:rotate(24deg);inset-inline-end:-75px;top:70px}
.cover--variant-2::after{width:180px;height:300px;border-radius:100px;inset-inline-end:-60px;top:-90px;transform:rotate(42deg)}
.cover__heading{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;z-index:2;font:600 10px/1.25 system-ui,sans-serif;min-height:24px}
.cover__category{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.85}
.cover__format{padding:5px 8px;border:1px solid currentColor;border-radius:5px;white-space:nowrap;font-size:9px;letter-spacing:.025em}
.cover__title{position:relative;display:block;z-index:2;font:720 24px/1.07 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-.045em;max-width:87%;margin-top:12px;overflow-wrap:anywhere;text-wrap:balance}
.cover--long .cover__title{font-size:22px}
.cover__sample{position:absolute;inset-inline-end:21px;bottom:-26px;width:75%;height:50%;border:1px solid #ffffff;box-shadow:0 12px 26px #17243d25;transform:rotate(-5deg);background:#fff;border-radius:3px}
.cover__sample::before{content:"";position:absolute;inset:0;background:#ffffffa8;border:1px solid #ffffffc9;transform:translate(-10px,4px) rotate(-4deg);z-index:-1;border-radius:3px}
.cover__sample .product__screen{display:block;width:100%;height:100%;overflow:hidden;aspect-ratio:auto;background:#fff;border-radius:3px}
.card__media .cover__sample img,.product__preview--cover .cover__sample img{width:100%;height:100%;object-fit:contain;object-position:top center;border-radius:0;transform:none}
.cover__sample-bar{display:none}
.cover__publisher{position:absolute;inset-inline-start:18px;bottom:14px;font:650 9px/1 system-ui,sans-serif;letter-spacing:-.025em;writing-mode:vertical-rl;transform:rotate(180deg);opacity:.8}
.cover--screen .cover__sample{width:86%;height:49%;inset-inline-end:12px;bottom:-8px;transform:rotate(-4deg);border-radius:6px;overflow:hidden;box-shadow:0 12px 30px #18243b30}
.cover--screen .cover__sample::before{display:none}
.cover--screen .cover__sample .product__screen{height:calc(100% - 15px)}
.cover--screen .cover__sample-bar{display:flex;gap:3px;align-items:center;background:#fff;height:15px;padding:0 7px;border-bottom:1px solid #e7e9ee;color:#83909d;font:500 5px/1 system-ui}
.cover__sample-bar i{width:3px;height:3px;border-radius:50%;background:#ced4dc}.cover__sample-bar span{margin-inline-start:auto}
.card__media{padding:0;aspect-ratio:1.15;background:transparent;display:block;border-bottom:0}
.card__media .product-cover{min-height:0}
.card__media .cover__sample{transition:transform .2s ease}
.card:hover .cover__sample{transform:translateY(-5px) rotate(-3deg)}
.card__body{min-height:260px}.card__body h2{font-size:17px}.card__meta{margin-bottom:10px}
.product__preview--cover{background:transparent;border:0;border-radius:14px;box-shadow:0 14px 35px #20385b15;overflow:hidden;margin:0}
.product__preview--cover .product-cover{min-height:480px;padding:32px 36px}
.cover--detail .cover__heading{font-size:14px;min-height:28px}.cover--detail .cover__format{font-size:12px;padding:7px 11px}
.cover--detail .cover__title{font-size:42px;max-width:90%;margin-top:23px;letter-spacing:-.05em}
.cover--detail.cover--long .cover__title{font-size:36px}
.cover--detail .cover__sample{height:47%;width:78%;bottom:-20px;inset-inline-end:30px}
.cover--detail.cover--screen .cover__sample{width:88%;height:51%;bottom:-15px;inset-inline-end:20px}
.cover--detail.cover--screen .cover__sample-bar{height:23px;padding-inline:10px;font-size:8px;gap:5px}
.cover--detail .cover__sample-bar i{width:5px;height:5px}.cover--detail.cover--screen .cover__sample .product__screen{height:calc(100% - 23px)}
.cover--detail .cover__publisher{font-size:12px;bottom:24px;inset-inline-start:25px}
.product__preview--cover figcaption{margin:0;background:#fff;padding:12px 18px;color:#52627a;border-top:0;font:400 12px/1.5 system-ui}
.image-preview{background:#eef2f8}.image-preview figure{max-height:none;padding:22px;background:#fff;box-shadow:0 12px 40px #213c6410}
.image-preview figure img{display:block;width:min(100%,1200px);height:auto;max-height:none}
@media(min-width:1400px){.card__media{aspect-ratio:1.18}}
@media(max-width:1100px){.product__preview--cover .product-cover{min-height:420px;padding:27px}.cover--detail .cover__title{font-size:36px}.cover--detail.cover--long .cover__title{font-size:32px}}
@media(max-width:800px){.product__preview--cover{width:100%}.product__preview--cover .product-cover{min-height:450px}.cover--detail .cover__title{font-size:40px}.cover--detail.cover--long .cover__title{font-size:35px}.card__media{aspect-ratio:1.16}.product-cover{padding:18px}.cover__title{font-size:23px}.cover--long .cover__title{font-size:21px}}
@media(max-width:480px){.grid{grid-template-columns:1fr;gap:22px}.card__media{aspect-ratio:1.23}.product-cover{padding:24px}.cover__heading{font-size:12px}.cover__format{font-size:10px}.cover__title{font-size:30px;max-width:85%}.cover--long .cover__title{font-size:26px}.cover__sample{height:49%;bottom:-20px}.cover--screen .cover__sample{height:48%}.card__body{min-height:0;padding:22px}.card__body h2{font-size:19px}.card__meta{font-size:11px}.card__body p{font-size:13px;line-height:1.65}.card__bottom{flex-wrap:nowrap}.card__bottom .button{width:auto;min-height:44px;padding:10px 16px;font-size:12px}.card__bottom .price{font-size:20px}.product__preview--cover .product-cover{min-height:360px;padding:23px}.cover--detail .cover__title{font-size:31px;margin-top:20px}.cover--detail.cover--long .cover__title{font-size:28px}.cover--detail .cover__heading{font-size:12px}.cover--detail .cover__format{font-size:10px}.cover--detail .cover__sample{height:46%;width:78%;inset-inline-end:23px}.cover--detail.cover--screen .cover__sample{height:47%;inset-inline-end:16px}.image-preview figure{padding:7px}.cover--detail .cover__publisher{font-size:10px;inset-inline-start:16px}}
@media(prefers-reduced-motion:reduce){.card__media .cover__sample{transition:none}}
.shop-stage__item{container-type:inline-size}
.shop-stage__item .product-cover{min-height:0;height:auto;aspect-ratio:1.4;padding:18px}
.shop-stage__item .cover__heading{font-size:clamp(7px,2.5cqw,11px);min-height:19px;gap:5px}
.shop-stage__item .cover__format{font-size:clamp(6px,2.2cqw,10px);padding:4px 6px}
.shop-stage__item .cover__title,.shop-stage__item .cover--long .cover__title{font-size:clamp(13px,6cqw,28px);margin-top:9px}
.shop-stage__item .cover__sample{bottom:-15px;inset-inline-end:15px}
.shop-stage__item .cover__sample img{aspect-ratio:auto;object-fit:contain;height:100%;border-radius:0}
.shop-stage__item .cover--screen .cover__sample{bottom:-8px;inset-inline-end:10px}
.shop-stage__item .cover__publisher{font-size:7px;inset-inline-start:11px;bottom:12px}
@media(max-width:480px){.shop-stage__item .product-cover{padding:12px}.shop-stage__item .cover__title{margin-top:5px}.shop-stage__item .cover__heading{min-height:14px}.shop-stage__item .cover__sample{inset-inline-end:10px;bottom:-8px}.shop-stage__item .cover__publisher{display:none}}

.cover__live-screen{display:block;position:relative;aspect-ratio:3/2;overflow:hidden;width:100%;background:#fff}.cover__live-screen iframe{position:absolute;left:0;top:0;width:1200px!important;height:800px!important;max-width:none!important;border:0;transform-origin:0 0;pointer-events:none}.cover--detail .cover__live-screen iframe{pointer-events:none}
