/* Original product screens and fragments exported from the supplied Figma file. */
.art-stage{
 position:relative;isolation:isolate;overflow:hidden;
 background:radial-gradient(ellipse at 60% 65%,#e5eeec 0,transparent 58%),linear-gradient(135deg,#f4f3ef,#f1f3f3);
 border:1px solid #00000008;border-radius:28px;
}
.art-phone,.art-browser,.art-fragment{
 position:absolute;overflow:hidden;background:#fff;
 box-shadow:0 1px 2px #00000006,0 12px 28px -12px #00000025,0 32px 64px -28px #00000026;
 outline:1px solid #00000009;
}
.art-phone{padding:7px;border-radius:31px}
.art-phone>img{border-radius:24px}
.art-phone>img,.art-browser>img,.art-fragment>img{display:block;width:100%;height:auto;max-width:none}
.art-browser{padding:0;border-radius:14px}
.art-browser-bar{height:25px;display:flex;align-items:center;gap:5px;padding:0 12px;border-bottom:1px solid #00000006;background:#fff}
.art-browser-bar>span{width:5px;height:5px;background:#d8dcdb;border-radius:50%}
.art-fragment{border-radius:18px}
.art-status{aspect-ratio:390/150;background:#f5f7f9}
.art-status>img{transform:translateY(-16.11374%)}

/* One connected composition: desktop storefront, app and live order status. */
.hero-canvas.hero-art{height:570px;border-radius:28px}
.hero-art-browser{width:76%;left:25%;top:64px}
.hero-art-phone{width:236px;left:8%;top:28px;z-index:2}
.hero-art-status{width:300px;right:8%;bottom:31px;z-index:3}

/* Product benefits: each card pairs an existing claim with the original UI. */
.product .section-heading>.section-description{max-width:700px}
.product-feature-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px}
.product-feature{
 position:relative;grid-column:span 4;display:flex;flex-direction:column;min-width:0;height:410px;
 overflow:hidden;isolation:isolate;border-radius:24px;border:1px solid #00000006;background:#f1f3f2;
}
.product-feature-app{grid-column:span 7;height:450px;background:#f0f3f0}
.product-feature-site{grid-column:span 5;height:450px;background:#f2f2f0}
.product-feature-visual{position:relative;flex:1;min-height:0;overflow:hidden}
.product-feature-copy{position:relative;z-index:2;padding:26px 30px 30px;background:inherit}
.product-feature-copy h3{font-size:25px;line-height:1.22;letter-spacing:-.04em;text-wrap:pretty}
.product-feature-app h3,.product-feature-site h3{font-size:29px;max-width:430px}
.product-feature-copy p{margin-top:11px;color:var(--muted);font-size:14px;line-height:1.6;max-width:440px}
.product-feature .art-fragment{border-radius:17px}
.feature-catalog{width:220px;top:25px;left:52%}
.feature-menu-card{width:159px;left:23%;top:41px;padding:10px;z-index:1}
.feature-website{width:112%;top:28px;left:8%}
.feature-order-items{width:calc(100% - 56px);max-width:325px;top:22px;left:26px;aspect-ratio:390/228}
.feature-order-items>img{transform:translateY(-13.15166%)}
.feature-checkout-action{width:calc(100% - 70px);max-width:310px;right:23px;bottom:0;aspect-ratio:390/88}
.feature-checkout-action>img{transform:translateY(-86.49289%)}
.feature-bonus-card{width:calc(100% - 48px);max-width:340px;top:30px;left:24px;aspect-ratio:390/180}
.feature-bonus-card>img{transform:translateY(-13.50711%)}
.feature-promo-code{width:calc(100% - 60px);max-width:330px;right:23px;bottom:7px;aspect-ratio:390/64}
.feature-promo-code>img{transform:translateY(-84.83412%)}
.feature-order-status{width:calc(100% - 48px);max-width:350px;top:32px;left:24px;aspect-ratio:390/236;background:#f5f7f9}
.feature-order-status>img{transform:translateY(-5.92417%)}
.product-feature-cta{display:flex;justify-content:center;margin-top:32px}

/* Detail views support the two existing growth controls. */
.growth-scene.growth-art{display:block;padding:0;min-height:520px}
.growth-art-panel{position:absolute;inset:0}
.growth-art-phone{width:224px;top:28px;left:13%}
.growth-art-dish{width:178px;padding:10px;top:134px;right:7%}
.growth-art-total{width:286px;right:5%;bottom:55px;padding:7px}

/* Menu, photos and the finished application, assembled from original UI. */
.price-card-visual>.price-visual.price-art{grid-column:1;min-height:530px;border-radius:28px}
.price-art-phone{width:226px;left:13%;top:39px}
.price-art-dish{width:169px;padding:9px;right:9%;top:73px}
.price-art-status{width:264px;right:7%;bottom:40px}

@media(min-width:1500px){
 .hero-canvas.hero-art{height:610px}
 .hero-art-phone{width:252px;left:10%}
 .hero-art-browser{width:74%;left:26%}
}
@media(max-width:1100px){
 .hero-canvas.hero-art{height:510px}
 .hero-art-phone{width:211px;left:6%}
 .hero-art-browser{left:27%;width:79%;top:79px}
 .hero-art-status{width:260px;right:6%;bottom:30px}
 .product-feature-grid{gap:16px}
 .product-feature-copy{padding:22px 24px 26px}
 .product-feature-copy h3{font-size:23px}
 .product-feature-app h3,.product-feature-site h3{font-size:27px}
 .feature-catalog{width:200px;left:49%}
 .feature-menu-card{width:139px;left:16%;top:52px}
 .feature-order-items{left:18px;width:calc(100% - 36px);top:30px}
 .feature-checkout-action{width:calc(100% - 44px);right:17px;bottom:8px}
 .feature-bonus-card{width:calc(100% - 36px);left:18px;top:44px}
 .feature-promo-code{width:calc(100% - 40px);right:17px;bottom:13px}
 .feature-order-status{width:calc(100% - 36px);left:18px;top:45px}
 .growth-art-phone{width:199px;left:7%;top:30px}
 .growth-art-dish{width:151px;right:5%;top:171px}
 .growth-art-total{width:245px;right:5%;bottom:66px}
 .price-art-phone{width:210px;left:6%;top:45px}
 .price-art-dish{width:143px;right:5%;top:90px}
 .price-art-status{width:237px;right:6%;bottom:48px}
}
@media(min-width:700px) and (max-width:959px){
 .product-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .product-feature{grid-column:span 1;height:390px}
 .product-feature-app{grid-column:span 2;height:430px}
 .product-feature-app h3{max-width:510px}
 .feature-catalog{left:57%;width:210px;top:25px}
 .feature-menu-card{left:25%;top:25px;width:136px}
 .feature-website{top:24px}
}
@media(max-width:699px){
 .art-stage{border-radius:20px}
 .art-phone{padding:5px;border-radius:22px}
 .art-phone>img{border-radius:17px}
 .art-browser{border-radius:9px}
 .art-browser-bar{height:17px;padding:0 8px;gap:3px}
 .art-browser-bar>span{width:3px;height:3px}
 .art-fragment{border-radius:13px}
 .hero-canvas.hero-art{height:342px;border-radius:20px}
 .hero-art-phone{width:143px;left:6%;top:21px}
 .hero-art-browser{width:111%;left:29%;top:65px}
 .hero-art-status{width:170px;right:5%;bottom:22px}
 .product-feature-grid{grid-template-columns:minmax(0,1fr);gap:16px}
 .product-feature{grid-column:1;height:365px;border-radius:20px}
 .product-feature-app,.product-feature-site{height:415px}
 .product-feature-copy{padding:22px 24px 26px}
 .product-feature-copy h3,.product-feature-app h3,.product-feature-site h3{font-size:25px}
 .product-feature-copy p{font-size:13px;margin-top:10px}
 .product-feature .art-fragment{border-radius:15px}
 .feature-catalog{width:178px;left:49%;top:22px}
 .feature-menu-card{width:135px;left:9%;top:37px;padding:8px}
 .feature-website{width:145%;left:7%;top:24px}
 .feature-order-items{width:calc(100% - 48px);max-width:none;left:24px;top:24px}
 .feature-checkout-action{width:calc(100% - 64px);max-width:none;right:24px;bottom:2px}
 .feature-bonus-card{width:calc(100% - 48px);max-width:none;left:24px;top:28px}
 .feature-promo-code{width:calc(100% - 56px);max-width:none;right:22px;bottom:10px}
 .feature-order-status{width:calc(100% - 48px);max-width:none;left:24px;top:28px}
 .product-feature-cta{margin-top:24px}
 .product-feature-cta .button{width:100%}
 .growth-scene.growth-art{min-height:436px;border-radius:20px}
 .growth-art-phone{width:183px;left:9%;top:28px}
 .growth-art-dish{width:143px;right:6%;top:124px;padding:8px}
 .growth-art-total{width:236px;right:5%;bottom:39px;padding:5px}
 .price-card-visual>.price-visual.price-art{grid-column:1;min-height:428px;border-radius:20px}
 .price-art-phone{width:184px;left:8%;top:29px}
 .price-art-dish{width:139px;right:8%;top:58px;padding:8px}
 .price-art-status{width:223px;right:7%;bottom:25px}
}
@media(prefers-reduced-motion:reduce){
 .art-stage *{animation:none!important}
}
