/* shop page */
.shop-page .main a[aria-current="page"]{color:var(--brand);font-weight:700}
.cart-btn{padding:9px 20px;font-size:.92rem}
.cart-n{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:var(--on-photo);color:var(--brand);font-size:.8rem;font-weight:800}
.cart-btn.bump{animation:bump .45s var(--ease)}
@keyframes bump{40%{transform:scale(1.12)}}

.shop-hero{padding:clamp(110px,16vh,150px) 0 clamp(28px,5vh,44px);background:radial-gradient(900px 380px at 15% 0%,rgba(176,122,79,.14),transparent 70%),radial-gradient(700px 300px at 90% 10%,rgba(27,67,50,.10),transparent 70%)}
.shop-hero h1{margin-top:14px;font-size:clamp(2.4rem,min(6vw,10vh),4.6rem)}
.shop-hero .lead{color:var(--muted);max-width:62ch;margin-top:14px;font-size:1.08rem}
.perks{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px;max-width:880px}
.perks li{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 18px}
.perks b{display:block;color:var(--brand)}
.perks span{font-size:.88rem;color:var(--muted)}

.shop-body{padding:10px 0 clamp(56px,9vh,90px)}
.filters{display:grid;gap:12px;margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font:inherit;font-weight:600;font-size:.92rem;padding:8px 16px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--text);cursor:pointer;transition:background .2s,border-color .2s}
.chip:hover{border-color:var(--brand)}
.chip[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:#fff}
.frow{display:flex;flex-wrap:wrap;gap:10px}
.frow input,.frow select{font:inherit;font-size:16px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--text)}
.frow input:focus,.frow select:focus{outline:0;border-color:var(--brand)}
.srch{flex:1;min-width:220px}.srch input{width:100%}
.count{font-size:.9rem;color:var(--muted);margin:4px 0 14px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.sk{height:340px;border-radius:18px;background:linear-gradient(90deg,var(--bg-2),#fff,var(--bg-2));background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{to{background-position:-200% 0}}
.card{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.card:hover{transform:translateY(-4px);box-shadow:0 24px 44px -30px rgba(27,67,50,.5)}
.card-open{position:relative;display:block;padding:0;border:0;background:none;cursor:pointer;width:100%}
.card-img{aspect-ratio:1/1;background:#fff;display:grid;place-items:center;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:contain;transition:transform .6s var(--ease)}
.card:hover .card-img img{transform:scale(1.05)}
.noimg{background:linear-gradient(135deg,var(--bg-2),#fff)}.noimg span{font-size:2.6rem;opacity:.5}
.badge{position:absolute;top:12px;inset-inline-start:12px;font-size:.78rem;font-weight:800;padding:4px 10px;border-radius:99px}
.badge.sale{background:var(--gold-2);color:#fff}
.badge.out{background:rgba(22,36,29,.78);color:#fff;inset-inline-start:auto;inset-inline-end:12px}
.card.out .card-img{filter:grayscale(.6) opacity(.75)}
.card-body{display:flex;flex-direction:column;gap:4px;padding:14px 16px 16px;flex:1}
.card-brand{font-size:.78rem;font-weight:700;letter-spacing:.06em;color:var(--gold-2)}
.card-body h3{font-size:1.05rem;line-height:1.3}
.card-meta{font-size:.84rem;color:var(--muted)}
.card-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px}
.price-tag b{font-size:1.2rem;font-weight:800;color:var(--brand)}
.price-tag s{font-size:.86rem;color:var(--muted);margin-inline-start:8px}
.btn.sm{padding:9px 16px;font-size:.88rem}
.empty{grid-column:1/-1;color:var(--muted);text-align:center;padding:40px 10px}

.soon{display:grid;place-items:center;padding:20px 0}
.soon-in{max-width:640px;text-align:center;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:clamp(28px,5vw,48px);box-shadow:0 30px 60px -44px rgba(27,67,50,.45)}
.soon-in .label{justify-content:center}
.soon-in h2{margin-top:12px}
.soon-in p{color:var(--muted);margin-top:12px}
.soon-in .cta{justify-content:center}

.shop-info{padding:clamp(48px,8vh,80px) 0;background:var(--bg-2);border-top:1px solid var(--line)}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,70px)}
.info-grid h2{font-size:clamp(1.5rem,3vw,2rem)}
.how{padding-inline-start:22px;margin-top:14px;display:grid;gap:6px}
.info-grid .small{margin-top:12px;line-height:1.7}
.info-grid a{color:var(--brand)}

/* dialogs */
dialog{border:0;padding:0;color:var(--text);background:var(--card);border-radius:22px;box-shadow:0 40px 90px -30px rgba(12,22,17,.55)}
dialog::backdrop{background:rgba(12,22,17,.5);backdrop-filter:blur(3px)}
.x{position:absolute;top:10px;inset-inline-end:10px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--card);font-size:1.5rem;line-height:1;cursor:pointer;color:var(--text);z-index:2}
.pd{width:min(920px,94vw);max-height:90vh}
.pd-in{display:grid;grid-template-columns:1fr 1.1fr}
.pd-img{background:#fff;display:grid;place-items:center;min-height:320px}
.pd-img-in{width:100%;height:100%;display:grid;place-items:center}
.pd-img img{width:100%;max-height:70vh;object-fit:contain}
.pd-txt{padding:30px 28px 26px;overflow:auto;max-height:90vh}
.pd-brand{font-size:.82rem;font-weight:700;color:var(--gold-2);letter-spacing:.06em}
.pd-txt h2{font-size:1.7rem;margin-top:4px}
.pd-price{display:flex;align-items:baseline;gap:10px;margin-top:10px}.pd-price b{font-size:1.6rem}.pd-price small{color:var(--muted)}
.pd-txt>p{color:var(--muted);margin-top:12px}
.pd-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin:16px 0 0;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.pd-meta dt{font-size:.78rem;color:var(--muted)}.pd-meta dd{margin:0;font-weight:600;font-size:.95rem}
.pd-details{margin-top:16px}.pd-details h3{font-size:1rem}.pd-details p{color:var(--muted);white-space:pre-line;font-size:.95rem;margin-top:6px}
.pd-buy{display:flex;gap:12px;align-items:center;margin-top:20px;flex-wrap:wrap}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:99px;overflow:hidden;background:var(--bg)}
.qty button{width:40px;height:40px;border:0;background:none;font-size:1.2rem;cursor:pointer;color:var(--text)}
.qty output{min-width:28px;text-align:center;font-weight:700}

.cart{position:fixed;margin:0 0 0 auto;inset:0 auto 0 0;height:100%;max-height:100%;width:min(420px,100vw);border-radius:0;display:none;flex-direction:column}
.cart[open]{display:flex}
html[dir="rtl"] .cart{inset:0 auto 0 0}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line);position:relative}
.cart-head h2{font-size:1.4rem}.cart-head .x{position:static}
.cart-list{flex:1;overflow:auto;padding:8px 22px}
.ci{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.ci-img{width:56px;height:56px;border-radius:12px;overflow:hidden;flex:none;background:#fff;display:grid;place-items:center}.ci-img img{width:100%;height:100%;object-fit:cover}.ci-img span{font-size:1.2rem}
.ci-t{flex:1;min-width:0}.ci-t b{display:block;font-size:.95rem}.ci-t span{font-size:.84rem;color:var(--muted)}
.cart-foot{padding:16px 22px 22px;border-top:1px solid var(--line);display:grid;gap:10px}
.cart-sum{display:flex;justify-content:space-between;align-items:baseline}.cart-sum b{font-size:1.4rem;color:var(--brand)}
.cart-foot .f{display:grid;gap:4px;font-size:.88rem;font-weight:600}
.cart-foot input,.cart-foot select{font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text)}
.btn.wide{width:100%;justify-content:center}

@media (max-width:900px){
  .perks{grid-template-columns:1fr}
  .grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .card-body{padding:10px 12px 12px}.card-body h3{font-size:.95rem}
  .card-row{flex-direction:column;align-items:stretch}.card-row .btn{justify-content:center}
  .info-grid{grid-template-columns:1fr}
  .pd-in{grid-template-columns:1fr}.pd-img{min-height:220px}.pd-img img{max-height:40vh}.pd-txt{padding:20px 18px}
  .pd-meta{grid-template-columns:1fr 1fr}
}
[hidden]{display:none!important}
.logo{white-space:nowrap}
@media (max-width:900px){
  .perks{grid-template-columns:repeat(3,1fr);gap:8px}
  .perks li{padding:10px 10px;text-align:center}
  .perks b{font-size:.85rem;line-height:1.3}
  .perks span{display:none}
  .shop-page .logo{font-size:1rem;gap:8px}.shop-page .logo img{height:34px}
  .shop-page .main a{padding:8px 10px}
}
.pickup{font-size:.92rem;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.del{border:1px solid var(--line);border-radius:12px;padding:8px 12px 10px;margin:0;display:grid;gap:6px;background:var(--bg)}.del legend{font-size:.88rem;font-weight:600;padding:0 4px}.del label{display:flex;gap:8px;align-items:center;font-size:.93rem;cursor:pointer}.del input{accent-color:var(--brand);width:18px;height:18px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#checkout{display:grid;gap:10px}
.cart-foot .msg a{color:inherit;font-weight:700}
.cart-done{padding:40px 26px;text-align:center;display:grid;gap:10px;justify-items:center}
.done-ic{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff;font-size:2rem;font-weight:800}
.cart-done p{color:var(--muted)}
.btn[disabled]{opacity:.6}

.terms{display:flex;gap:8px;align-items:flex-start;font-size:.88rem;line-height:1.5}.terms input{width:18px;height:18px;margin-top:2px;accent-color:var(--brand);flex:none}.terms a{color:var(--brand);font-weight:700}
.paybanner{position:relative;z-index:5;margin:84px auto 0;max-width:min(760px,92vw);padding:14px 18px;border-radius:16px;font-weight:600;text-align:center}
.paybanner.ok{background:#e4f3e8;color:#1b4332;border:1px solid #b9dfc4}.paybanner.warn{background:#fff4e0;color:#7a4b00;border:1px solid #f0d49b}