.shop { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: var(--sp-5); }
.prod { display: flex; flex-direction: column; gap: var(--sp-3); }
.prod .vis { position: relative; aspect-ratio: 1; border-radius: var(--r-lg); display: grid; place-items: center; overflow: hidden; background: var(--surface-2); }
.prod .vis .badge { position: absolute; top: var(--sp-3); left: var(--sp-3); }
.prod h3 { margin: 0; font-size: var(--fs-lg); }
.prod .preco { font-family: var(--font-heading); font-weight: 800; font-size: var(--fs-xl); }
.prod .preco s { font-family: var(--font-body); font-weight: 400; font-size: var(--fs-sm); color: var(--ink-3); margin-left: 6px; }
.prod .acts { display: flex; gap: var(--sp-2); align-items: center; margin-top: auto; flex-wrap: wrap; }
.prod .select { width: auto; min-height: 34px; padding: 4px 10px; font-size: var(--fs-sm); }
/* Capas e mockups desenhados em CSS */
.book { width: 52%; aspect-ratio: 2 / 3; background: #161614; color: #f2f2ee; border-radius: 3px 8px 8px 3px; box-shadow: 6px 8px 0 rgba(0,0,0,.18); padding: 14% 10%; display: flex; flex-direction: column; justify-content: space-between; font-family: var(--font-heading); }
.book b { font-size: clamp(14px, 2vw, 20px); line-height: 1.05; letter-spacing: -.02em; }
.book i { font-style: normal; font-family: var(--font-mono); font-size: 9px; opacity: .7; }
.book .fr { aspect-ratio: 3/2; border: 1.5px solid #f2f2ee; position: relative; }
.book .fr::after { content: ""; position: absolute; right: -4px; bottom: -4px; width: 8px; height: 8px; border: solid #e39a14; border-width: 0 2px 2px 0; }
.book.ebook { background: #e39a14; color: #141413; }
.book.ebook .fr { border-color: #141413; }
.phone { width: 38%; aspect-ratio: 9 / 19; border-radius: 18px; background: #141413; padding: 6px; }
.phone div { height: 100%; border-radius: 13px; background: linear-gradient(160deg, #4b5f88, #18233a); display: grid; place-items: end start; padding: 10px; color: #fff; font: 700 11px var(--font-body); }
.tee { width: 70%; }
.cart-fab { position: fixed; right: var(--gutter); bottom: calc(var(--sp-6) + env(safe-area-inset-bottom, 0px)); z-index: 26; box-shadow: var(--shadow-float); }
@media (max-width: 800px) { .cart-fab { bottom: calc(var(--tabbar-h) + var(--sp-3) + env(safe-area-inset-bottom, 0px)); } }
.cart { position: fixed; top: 0; right: 0; bottom: 0; width: min(400px, 100%); z-index: 60; background: var(--surface); box-shadow: var(--shadow-float); padding: calc(var(--sp-5) + env(safe-area-inset-top, 0px)) var(--sp-5) var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-4); animation: rise var(--dur) var(--ease); }
.cart ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); overflow-y: auto; flex: 1; }
.cart li { display: flex; gap: var(--sp-3); align-items: center; font-size: var(--fs-sm); }
.cart li .grow { flex: 1; }