.shop-page { background:#f5f5f2; color:#111; }
.shop-head { background:rgba(255,255,255,.92); border-bottom-color:rgba(0,0,0,.09); }
.shop-brand { display:flex; align-items:center; gap:.7rem; color:#111; }
.shop-brand img { filter:none; }
.shop-brand b { border-left:1px solid rgba(0,0,0,.2); padding-left:.7rem; font-size:.76rem; letter-spacing:.16em; }
.shop-cart-button { position:fixed; right:max(1rem,env(safe-area-inset-right)); bottom:max(1rem,env(safe-area-inset-bottom)); z-index:69; min-width:6.4rem; height:3.35rem; display:grid; grid-template-columns:auto auto auto; place-items:center; gap:.5rem; border:1px solid rgba(255,255,255,.16); border-radius:.85rem; padding:0 .9rem; background:rgba(10,10,10,.9); color:#fff; box-shadow:0 15px 38px rgba(0,0,0,.24); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); cursor:pointer; transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.shop-cart-button:hover { transform:translateY(-2px); background:#000; box-shadow:0 18px 44px rgba(0,0,0,.3); }
.shop-cart-button svg { width:1.35rem; height:1.35rem; stroke-width:1.8; }
.shop-cart-button > span { font-size:.78rem; font-weight:900; }
.shop-cart-button > b { min-width:1.4rem; height:1.4rem; display:grid; place-items:center; border:1px solid rgba(255,255,255,.28); border-radius:50%; padding:0 .2rem; background:#fff; color:#111; font-size:.63rem; box-shadow:0 5px 14px rgba(0,0,0,.2); }
.shop-intro { padding:clamp(4rem,9vw,7rem) 0; background:#fff; }
.shop-intro-grid { display:grid; grid-template-columns:1.15fr .85fr; align-items:end; gap:3rem; }
.shop-kicker,.shop-section-head span { color:#6b6d68; font-size:.7rem; font-weight:950; letter-spacing:.14em; text-transform:uppercase; }
.shop-intro h1,.shop-confirmation h1 { max-width:none; margin:.8rem 0 0; font-size:clamp(4.5rem,13vw,10rem); line-height:.78; }
.shop-intro p { max-width:34rem; margin:0 0 .65rem; color:#60635f; font-size:clamp(1rem,2vw,1.25rem); line-height:1.7; }
.shop-catalog { padding:clamp(3.5rem,8vw,6rem) 0 7rem; }
.shop-section-head { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:2rem; }
.shop-section-head h2 { margin:.4rem 0 0; font-size:clamp(2rem,5vw,4rem); line-height:1; }
.shop-section-head > b { color:#73756f; font-size:.8rem; }
.shop-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.shop-card { overflow:hidden; border:1px solid rgba(0,0,0,.09); border-radius:.7rem; background:#fff; box-shadow:0 12px 32px rgba(0,0,0,.055); }
.shop-card-image { aspect-ratio:4/5; display:grid; place-items:center; overflow:hidden; background:#e9e9e5; }
.shop-card-image img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .55s cubic-bezier(.2,.8,.2,1); }
.shop-card:hover .shop-card-image img { transform:scale(1.035); }
.shop-card-image > span { font-size:3.5rem; font-weight:950; }
.shop-card-copy { display:grid; gap:1rem; padding:1rem; }
.shop-card-copy h3 { margin:0 0 .35rem; font-size:1.15rem; }
.shop-card-copy p { min-height:2.7rem; margin:0; color:#686b66; font-size:.86rem; line-height:1.55; }
.shop-card-copy > div { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.shop-card-copy button,.product-add,.shop-checkout-submit { min-height:2.8rem; border:1px solid #111; border-radius:.55rem; padding:0 1rem; background:#111; color:#fff; font-weight:900; cursor:pointer; transition:transform .18s ease,background .18s ease,color .18s ease; }
.shop-card-copy button:hover,.product-add:hover { transform:translateY(-2px); background:#fff; color:#111; }
.shop-card-copy button:disabled,.product-add:disabled,.shop-checkout-submit:disabled { cursor:not-allowed; opacity:.38; }
.shop-card-copy button.is-added { background:#17613b; border-color:#17613b; color:#fff; }
.shop-empty,.shop-alert { border:1px solid rgba(0,0,0,.1); border-radius:.7rem; padding:1.2rem; background:#fff; }
.shop-alert.error { border-color:rgba(180,35,24,.22); color:#9c2017; }
.shop-cart-backdrop { position:fixed; inset:0; z-index:70; background:rgba(0,0,0,.46); opacity:0; visibility:hidden; transition:.25s ease; }
.shop-cart-backdrop.is-open { opacity:1; visibility:visible; }
.shop-cart { position:fixed; z-index:71; top:0; right:0; width:min(33rem,100%); height:100dvh; display:flex; flex-direction:column; border-left:1px solid rgba(0,0,0,.12); padding:1rem; background:#f7f7f4; color:#111; box-shadow:-24px 0 70px rgba(0,0,0,.18); transform:translateX(102%); transition:transform .34s cubic-bezier(.2,.8,.2,1); overflow:auto; }
.shop-cart.is-open { transform:translateX(0); }
body.shop-cart-open { overflow:hidden; }
.shop-cart > header { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid rgba(0,0,0,.1); padding:.5rem 0 1rem; }
.shop-cart > header span { color:#6d706b; font-size:.68rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.shop-cart > header h2 { margin:.2rem 0 0; font-size:2rem; }
.shop-cart > header button { width:2.6rem; height:2.6rem; border:1px solid rgba(0,0,0,.12); border-radius:50%; background:#fff; font-size:1.6rem; cursor:pointer; }
.shop-cart-progress { display:grid; grid-template-columns:auto 1fr auto 1fr auto; align-items:center; gap:.4rem; border-bottom:1px solid rgba(0,0,0,.1); padding:.8rem 0; }
.shop-cart-progress span { display:flex; align-items:center; gap:.35rem; color:#9a9c97; font-size:.67rem; font-weight:900; white-space:nowrap; }
.shop-cart-progress span b { width:1.35rem; height:1.35rem; display:grid; place-items:center; border:1px solid rgba(0,0,0,.13); border-radius:50%; background:#fff; font-size:.62rem; }
.shop-cart-progress span.is-active { color:#111; }.shop-cart-progress span.is-active b { background:#111; color:#fff; }
.shop-cart-progress i { height:1px; background:rgba(0,0,0,.12); }
.shop-cart-step { display:none; }.shop-cart-step.is-active { display:grid; animation:shopStepIn .28s ease both; }
.shop-cart-items { display:grid; gap:.7rem; padding:1rem 0; }
.shop-cart-empty { min-height:9rem; display:grid; place-content:center; gap:.35rem; text-align:center; color:#6d706b; }
.shop-cart-empty strong { color:#111; }
.shop-cart-item { display:grid; grid-template-columns:5.2rem 1fr; gap:.85rem; padding:.65rem; border:1px solid rgba(0,0,0,.09); border-radius:.65rem; background:#fff; }
.shop-cart-item-image { aspect-ratio:1; display:grid; place-items:center; overflow:hidden; border-radius:.45rem; background:#ededE9; font-weight:950; }
.shop-cart-item-image img { width:100%; height:100%; object-fit:cover; }
.shop-cart-item > div:last-child { min-width:0; display:grid; gap:.3rem; }
.shop-cart-item strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shop-cart-item span { color:#676a65; font-size:.82rem; }
.shop-quantity { display:flex; align-items:center; gap:.35rem; margin-top:.25rem; }
.shop-quantity button { min-width:1.9rem; height:1.9rem; border:1px solid rgba(0,0,0,.12); border-radius:.4rem; background:#f7f7f4; cursor:pointer; }
.shop-quantity button:last-child { width:auto; margin-left:auto; padding:0 .55rem; color:#a02118; }
.shop-cart-total { display:flex; justify-content:space-between; border-top:1px solid rgba(0,0,0,.1); padding:1rem 0; font-size:1.15rem; }
.shop-checkout { display:grid; gap:.8rem; border-top:1px solid rgba(0,0,0,.1); padding-top:1.2rem; }
.shop-checkout-title span { color:#777a74; font-size:.67rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.shop-checkout-title h3 { margin:.25rem 0; font-size:1.45rem; }.shop-checkout-title p { margin:.2rem 0 0; color:#696c67; font-size:.82rem; }
.shop-checkout label { display:grid; gap:.35rem; font-size:.8rem; font-weight:850; }
.shop-checkout label small { color:#777a74; font-weight:600; }
.shop-checkout input,.shop-checkout textarea { width:100%; border:1px solid rgba(0,0,0,.12); border-radius:.55rem; padding:.8rem; background:#fff; font:inherit; }
.shop-checkout textarea { min-height:5.5rem; resize:vertical; }
.shop-form-row { display:grid; grid-template-columns:1fr 1fr; gap:.65rem; }
.shop-checkout-info { display:grid; gap:.2rem; border:1px solid rgba(0,0,0,.1); border-radius:.55rem; padding:.8rem; background:#fff; }
.shop-checkout-info span { color:#666963; font-size:.8rem; line-height:1.5; }
.shop-checkout-submit { width:100%; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.shop-checkout-actions { display:grid; grid-template-columns:auto 1fr; gap:.55rem; }
.shop-checkout-actions > button:first-child { min-height:2.8rem; border:1px solid rgba(0,0,0,.13); border-radius:.55rem; padding:0 .8rem; background:#fff; font-weight:850; cursor:pointer; }
@keyframes shopStepIn { from { opacity:0; transform:translateX(1rem); } to { opacity:1; transform:none; } }
.shop-confirmation { padding:clamp(3rem,7vw,5rem) 0; background:#0a0a0a; color:#fff; }
.shop-confirmation-inner { text-align:center; }
.shop-confirmation h1 { font-size:clamp(3.4rem,10vw,7rem); line-height:.88; }
.shop-confirmation p { max-width:43rem; margin:1.4rem auto; color:#c9c9c3; line-height:1.65; }
.shop-payment-code { width:min(28rem,100%); display:grid; justify-items:center; gap:.25rem; margin:2rem auto; border:1px solid rgba(255,255,255,.15); border-radius:.75rem; padding:1.3rem; background:#151515; }
.shop-payment-code span,.shop-payment-code small { color:#aeadA7; font-size:.7rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.shop-payment-code strong { font-size:clamp(3rem,10vw,5.5rem); letter-spacing:.08em; }
.shop-mia-button { width:min(28rem,100%); min-height:4.4rem; display:flex; align-items:center; justify-content:center; gap:1rem; margin:0 auto; border-radius:.65rem; padding:.6rem 1rem; background:#fff; color:#111; font-weight:950; }
.shop-mia-button img { width:3rem; height:3rem; object-fit:contain; border-radius:.4rem; background:#111; }
.shop-payment-note { font-size:.82rem; }
.product-main { padding:2rem 0 7rem; background:#f5f5f2; }
.product-back { display:inline-flex; margin-bottom:1.5rem; color:#5f625d; font-weight:850; }
.product-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(20rem,.85fr); gap:clamp(2rem,6vw,5rem); align-items:start; }
.product-gallery { min-width:0; }
.product-main-image { position:relative; aspect-ratio:4/5; display:grid; place-items:center; overflow:hidden; border-radius:.75rem; background:#e7e7e3; font-size:5rem; font-weight:950; }
.product-main-image img { width:100%; height:100%; object-fit:contain; }
.product-gallery-prev,.product-gallery-next { position:absolute; top:50%; width:2.9rem; height:2.9rem; display:grid; place-items:center; border:1px solid rgba(0,0,0,.12); border-radius:50%; background:rgba(255,255,255,.88); color:#111; font-size:1.8rem; transform:translateY(-50%); cursor:pointer; backdrop-filter:blur(12px); }
.product-gallery-prev { left:.8rem; }.product-gallery-next { right:.8rem; }
.product-thumbs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:.5rem; margin-top:.6rem; }
.product-thumbs button { aspect-ratio:1; overflow:hidden; border:1px solid transparent; border-radius:.45rem; padding:0; background:#e7e7e3; cursor:pointer; }
.product-thumbs button.is-active { border-color:#111; }
.product-thumbs img { width:100%; height:100%; display:block; object-fit:cover; }
.product-copy { position:sticky; top:6rem; }
.product-copy h1 { max-width:12ch; margin:.65rem 0; font-size:clamp(2.7rem,6vw,5.2rem); line-height:.92; }
.product-short { color:#60635e; line-height:1.6; }
.product-price { display:block; margin:1.5rem 0; font-size:1.65rem; }
.product-description { border-top:1px solid rgba(0,0,0,.1); padding-top:1.2rem; color:#555853; line-height:1.75; }
.product-add { width:100%; min-height:3.6rem; margin-top:1.5rem; }
.product-service { display:grid; gap:.6rem; margin-top:1.2rem; color:#666964; font-size:.8rem; }
.product-service span { border-top:1px solid rgba(0,0,0,.09); padding-top:.6rem; }
@media (max-width:760px) {
  .shop-cart-button { right:max(.75rem,env(safe-area-inset-right)); bottom:max(.75rem,env(safe-area-inset-bottom)); min-width:0; width:3.2rem; height:3.2rem; grid-template-columns:1fr; gap:0; border-radius:.78rem; padding:0; }
  .shop-cart-button > span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .shop-cart-button > b { position:absolute; top:-.38rem; right:-.38rem; border:2px solid #fff; background:#111; color:#fff; }
  .shop-intro-grid,.product-layout { grid-template-columns:1fr; gap:1.5rem; }
  .shop-intro h1 { font-size:clamp(4.4rem,27vw,7rem); }
  .shop-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
  .shop-card-copy { gap:.7rem; padding:.75rem; }
  .shop-card-copy p { display:none; }
  .shop-card-copy > div { align-items:flex-start; flex-direction:column; }
  .shop-card-copy button { width:100%; }
  .shop-form-row { grid-template-columns:1fr; }
  .product-copy { position:static; }
  .product-thumbs { grid-template-columns:repeat(5,minmax(0,1fr)); }
}

@media (max-width:420px) {
  .shop-cart { overflow-x:hidden; padding:.75rem; }
  .shop-cart-progress { gap:.2rem; }
  .shop-cart-progress span { gap:.22rem; font-size:.58rem; }
  .shop-cart-progress span b { width:1.2rem; height:1.2rem; }
  .shop-cart-item { grid-template-columns:4.35rem minmax(0,1fr); gap:.65rem; }
  .shop-checkout-actions { grid-template-columns:1fr; }
  .shop-checkout-actions > button:first-child { order:2; }
}

@media (max-width:350px) {
  .shop-grid { grid-template-columns:1fr; }
}
