.commerce-page{background:#f5f6f4;color:#25332c}
.commerce-main{max-width:1240px;margin:auto;padding:48px 28px 90px}
.commerce-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:30px}
.commerce-heading h1{font-size:44px;letter-spacing:0;margin:0 0 12px}
.commerce-heading p{color:#728075;max-width:640px;line-height:1.65}
.commerce-links{display:flex;flex-wrap:wrap;gap:16px;font-size:14px}
.commerce-links a{color:#8c363b}
.commerce-status{padding:15px 18px;background:#e9ede7;border-radius:12px;margin:20px 0;line-height:1.6}
.commerce-status[data-status=error]{background:#fbecee;color:#9c2832}
.commerce-status:empty{display:none}
.commerce-toolbar{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.commerce-toolbar input{min-width:220px;flex:1}
.commerce-page input,.commerce-page select,.commerce-page textarea{width:100%;padding:11px 14px;border:1px solid #d9dfd8;background:#fff;border-radius:10px;font:inherit;min-width:0}
.commerce-page label{display:grid;gap:7px;color:#68736a;font-size:13px}
.commerce-page button{cursor:pointer}
.commerce-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.commerce-card{border:1px solid #e0e5df;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 5px 25px #25332c05}
.commerce-photo{height:260px;display:grid;place-items:center;background:#ebece7}
.commerce-photo img{height:100%;width:100%;object-fit:contain;max-width:100%}
.commerce-photo span{color:#7c877d;font-size:15px}
.commerce-copy{padding:23px;display:grid;gap:13px}
.commerce-copy h2{font-size:23px;margin:0}
.commerce-meta{color:#77847a;font-size:13px;line-height:1.6}
.commerce-price{color:#9e2632;font-size:23px;font-weight:600}
.commerce-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.commerce-actions .button{padding:11px 18px;font-size:14px;min-width:0}
.commerce-actions a{font-size:14px;color:#8b3039}
.commerce-actions button:disabled{opacity:.5;cursor:not-allowed}
.commerce-card [data-qty]{max-width:95px}
.commerce-two{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px}
.commerce-panel{background:#fff;border:1px solid #e0e5df;border-radius:20px;padding:26px;margin-bottom:18px}
.commerce-panel h2{font-size:22px;margin:0 0 18px}
.commerce-line{display:grid;grid-template-columns:70px minmax(0,1fr) 92px auto;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid #edf0eb}
.commerce-line:last-child{border:0}
.commerce-line img{width:70px;height:70px;object-fit:contain;background:#f3f4ef;border-radius:10px}
.commerce-line strong{display:block;margin-bottom:6px}
.commerce-line input[type=number]{padding:9px;max-width:92px}
.commerce-check{display:flex!important;gap:10px!important;align-items:center;color:#25332c!important}
.commerce-check input{width:18px!important;height:18px}
.commerce-summary{display:flex;justify-content:space-between;gap:15px;padding:10px 0;font-size:15px}
.commerce-summary.is-total{padding-top:20px;border-top:1px solid #e0e5df;font-size:22px;color:#9e2632}
.commerce-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.commerce-form .is-wide{grid-column:1/-1}
.commerce-empty{padding:35px;border:1px dashed #cbd5c8;border-radius:15px;color:#6d7c6e;grid-column:1/-1;line-height:1.7}
.commerce-badge{display:inline-block;padding:5px 10px;border-radius:6px;background:#eef2ec;color:#60755d;font-size:12px}
.commerce-note{color:#788277;font-size:13px;line-height:1.7}
.commerce-small{border:0;background:transparent;color:#a4323f;font:inherit;font-size:13px;padding:6px}
.commerce-order-head{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
.commerce-order-head strong{font-size:20px}
.commerce-order-details{margin-top:18px;padding:18px;background:#f6f7f4;border-radius:12px;font-size:14px;line-height:1.8}
.commerce-filter{border:1px solid #dce3d8;background:#fff;border-radius:10px;padding:10px 16px;color:#62735f}
.commerce-filter[aria-pressed=true]{background:#273e2e;color:white}
.commerce-sticky{position:sticky;top:100px;align-self:start}
.commerce-address{display:flex;justify-content:space-between;gap:18px;align-items:center;border-bottom:1px solid #edf0eb;padding:16px 0}
.commerce-address:last-child{border:0}
.commerce-address p{margin:5px 0}
.commerce-error-id{font-size:12px;overflow-wrap:anywhere;color:#8a6b6b}
.commerce-backdrop{position:fixed;inset:0;background:#1e302b88;z-index:120;display:grid;place-items:center;padding:25px}
.commerce-dialog{background:white;border-radius:20px;padding:30px;width:min(640px,100%);max-height:90vh;overflow:auto}
.commerce-backdrop[hidden]{display:none}
.commerce-hero{border-radius:20px;min-height:170px;margin-bottom:25px;background:linear-gradient(90deg,#253c32ed,#253c3260),url('../assets/product-scenes/half-scene.png?v=web-20261030-vectorcraft-02') center/cover;display:flex;align-items:center;padding:32px;color:#fff}
.commerce-hero{background-image:linear-gradient(90deg,#253c32ed,#253c3260),image-set(url('../assets/optimized/cd1d42a6c02c5344-v1q92-1280.webp?v=web-20261030-vectorcraft-02') type('image/webp') 1x,url('../assets/optimized/cd1d42a6c02c5344-v1q92-1536.webp?v=web-20261030-vectorcraft-02') type('image/webp') 2x,url('../assets/product-scenes/half-scene.png?v=web-20261030-vectorcraft-02') type('image/png') 1x)}
.commerce-hero h2{font-size:29px;margin:0 0 8px}
.commerce-hero p{margin:0;color:#e4eee0}
.commerce-powered{border-top:1px solid #dce2d9;padding-top:18px;color:#788277;font-size:13px;line-height:1.7}

@media(max-width:1000px){.commerce-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.commerce-two{grid-template-columns:minmax(0,1fr)}
.commerce-sticky{position:static}
.commerce-heading{align-items:flex-start;flex-direction:column}
}

@media(max-width:600px){.commerce-heading h1{font-size:28px}
.commerce-main{padding:30px 18px 70px}
.commerce-grid{grid-template-columns:minmax(0,1fr)}
.commerce-photo{height:280px}
.commerce-line{grid-template-columns:54px minmax(0,1fr) 75px}
.commerce-line .commerce-small{grid-column:2/-1;justify-self:end}
.commerce-line img{width:54px;height:54px}
.commerce-form{grid-template-columns:minmax(0,1fr)}
.commerce-form .is-wide{grid-column:auto}
.commerce-panel{padding:20px}
.commerce-hero{padding:24px;min-height:150px}
}