/* ============================================================
   MZ LXRY — shop.css : product grid, product page, gallery
   ============================================================ */

/* --- Product grid + cards --- */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:clamp(1rem,2.5vw,1.8rem)}
.product-grid--shop{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}

.pcard{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:transform .28s var(--ease),box-shadow .28s var(--ease)}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.pcard__media{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:#fff;padding:6% 7%;box-sizing:border-box}
.pcard__media .pcard__img{display:block;width:100%;height:100%}
.pcard__media img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .5s var(--ease)}
.pcard:hover .pcard__media img{transform:scale(1.05)}
.pcard__flag{position:absolute;top:.8rem;left:.8rem;background:var(--sale);color:#fff;font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;font-weight:600;padding:.3em .6em;border-radius:2px;z-index:2}
.pcard__wish{position:absolute;top:.6rem;right:.6rem;width:38px;height:38px;border-radius:50%;background:rgba(12,10,8,.68);backdrop-filter:blur(4px);
  border:1px solid var(--line-2);color:var(--ink);display:grid;place-items:center;opacity:0;transform:translateY(-4px);transition:.25s var(--ease);z-index:2}
.pcard__wish svg{width:18px;height:18px}
.pcard__media:hover .pcard__wish,.pcard__wish.is-active{opacity:1;transform:translateY(0)}
.pcard__wish.is-active{background:var(--gold);color:var(--on-fill);border-color:var(--gold)}
.pcard__wish.is-active svg{fill:var(--on-fill)}
.pcard__body{padding:.9rem 1.05rem 1.15rem;display:flex;flex-direction:column;gap:.3rem}
.pcard__title{font-family:var(--serif);font-size:1.02rem;font-weight:600;line-height:1.3;color:#181410}
.pcard__title a{color:inherit}
.pcard__title a:hover{color:var(--accent)}
.pcard__price{font-size:.98rem;display:flex;align-items:baseline;flex-wrap:wrap;gap:.1rem;color:#181410}
.pcard__price .price-now{color:#181410}
.pcard__price .price-note{color:#8a8175}
.pcard__price .price-was{color:#a79f8f;text-decoration:line-through;margin-right:.2rem}

/* --- Shop layout --- */
.shop-head{padding-top:1.4rem}
.shop-head__title{font-size:clamp(1.8rem,4vw,2.6rem)}
.shop-head__desc{color:var(--ink-soft);max-width:60ch;margin-top:.6rem}
.shop-layout{display:grid;grid-template-columns:220px 1fr;gap:2.5rem;padding-top:1.6rem;padding-bottom:4rem}
.shop-side__block h3{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem;color:var(--ink-soft);font-family:var(--sans)}
.side-cats{display:flex;flex-direction:column;gap:.15rem}
.side-cats a{display:flex;justify-content:space-between;padding:.55rem .7rem;border-radius:var(--radius);font-size:.92rem;transition:.2s}
.side-cats a span{color:var(--ink-soft);font-size:.82rem}
.side-cats a:hover{background:var(--paper)}
.side-cats a.is-active{background:var(--gold);color:var(--on-fill)}
.side-cats a.is-active span{color:rgba(21,17,11,.65)}

.shop-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.6rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.shop-count{font-size:.85rem;color:var(--ink-soft)}
.shop-sort{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:var(--ink-soft)}
.shop-sort select{padding:.5em 2.2em .5em .8em;width:auto;font-size:.85rem}

.pager{display:flex;gap:.4rem;justify-content:center;margin-top:2.5rem}
.pager__link{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line-2);border-radius:var(--radius);font-size:.9rem;transition:.2s}
.pager__link:hover{border-color:var(--ink)}
.pager__link.is-active{background:var(--gold);color:var(--on-fill);border-color:var(--gold)}

/* --- Product page --- */
.product{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);padding-top:1rem;padding-bottom:3rem;align-items:start}
.product__gallery{position:sticky;top:94px;display:flex;flex-direction:column;gap:.8rem}
.gallery__main{position:relative;aspect-ratio:5/6;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:var(--paper)}
.gallery__slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s var(--ease)}
.gallery__slide.is-active{opacity:1;visibility:visible;position:relative}
.gallery__slide img{width:100%;height:100%;object-fit:cover}
.gallery__thumbs{display:flex;gap:.6rem;flex-wrap:wrap}
.gallery__thumb{width:72px;height:86px;border:1px solid var(--line-2);border-radius:var(--radius);overflow:hidden;padding:0;background:var(--paper);transition:.2s;opacity:.7}
.gallery__thumb img{width:100%;height:100%;object-fit:cover}
.gallery__thumb.is-active,.gallery__thumb:hover{opacity:1;border-color:var(--ink)}

.product__cat{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-dark);font-weight:600}
.product__title{font-size:clamp(1.7rem,3.6vw,2.5rem);margin:.5rem 0 .8rem}
.product__price{display:flex;align-items:baseline;gap:.2rem;font-size:1.5rem;font-family:var(--serif);margin-bottom:1.6rem}
.product__price .price-note{font-size:.76rem}
.product__price .price-now{font-weight:600}

.size-select{margin-bottom:1.4rem}
.size-select__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.7rem;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);font-weight:600}
.size-guide{text-decoration:underline;text-underline-offset:3px;color:var(--ink-soft)}
.size-guide:hover{color:var(--accent-dark)}
.size-grid{display:flex;flex-wrap:wrap;gap:.5rem}
.size-btn{min-width:56px;padding:.75rem .6rem;border:1px solid var(--line-2);background:var(--paper);border-radius:var(--radius);
  font-size:.95rem;font-weight:600;color:var(--ink);transition:.18s}
.size-btn:hover:not([disabled]){border-color:var(--ink)}
.size-btn[aria-checked="true"]{background:var(--gold);color:var(--on-fill);border-color:var(--gold)}
.size-btn[disabled]{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.size-error{color:var(--err);font-size:.82rem;margin-top:.6rem}

.product__actions{display:flex;gap:.7rem;margin-bottom:1.6rem}
.product__actions .btn--dark{flex:1}
.btn--icon.is-active{background:var(--gold);color:var(--on-fill)}
.btn--icon.is-active svg{fill:var(--on-fill)}

.product__perks{display:flex;flex-direction:column;gap:.7rem;padding:1.2rem 0;border-block:1px solid var(--line);margin-bottom:1.6rem}
.product__perks li{display:flex;align-items:center;gap:.7rem;font-size:.9rem;color:var(--ink-2)}
.product__perks svg{width:19px;height:19px;color:var(--accent-dark);flex:none}
.product__desc h2{font-size:1.1rem;margin-bottom:.7rem}

/* --- Static pages --- */
.static-page{max-width:760px;padding-block:1rem 4rem}
.static-page__head{margin-bottom:1.6rem;padding-bottom:1.2rem;border-bottom:1px solid var(--line)}
.static-page__head h1{font-size:clamp(1.9rem,4vw,2.8rem)}

/* --- Post --- */
.post{padding-bottom:3rem}
.post__head{max-width:760px;text-align:center;padding-block:2rem 1.4rem}
.post__date{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-dark)}
.post__title{font-size:clamp(2rem,4.5vw,3rem);margin:.6rem 0 .9rem}
.post__lead{font-size:1.2rem;color:var(--ink-soft);font-family:var(--serif)}
.post__hero{margin-block:1.5rem 2.5rem}
.post__hero img{width:100%;max-height:520px;object-fit:cover;border-radius:var(--radius-lg)}
.post__body{max-width:720px}
.post__foot{max-width:720px;margin-top:2.5rem}

/* --- Contact --- */
.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(1.5rem,4vw,4rem);padding-block:1.5rem 4rem;align-items:start}
.contact__intro h1{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:1rem}
.contact__details{margin-top:1.6rem;display:flex;flex-direction:column;gap:.8rem}
.contact__details li{display:flex;flex-direction:column;font-size:.95rem}
.contact__details strong{font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.15rem}
.contact__form{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(1.4rem,3vw,2.2rem)}

/* --- Search --- */
.search-page{padding-block:2rem 4rem}
.search-hero{display:flex;gap:.6rem;max-width:640px;margin:0 auto 2.5rem}
.search-hero input{font-size:1.05rem;padding:.9em 1em}
.search-title{font-size:1.4rem;margin-bottom:1.6rem}
.search-title span{color:var(--ink-soft);font-size:1rem}

/* --- Wishlist --- */
.wishlist-page{padding-block:1.5rem 4rem}

/* --- 404 --- */
.notfound{text-align:center;padding-block:5rem;display:flex;flex-direction:column;align-items:center;gap:1rem}
.notfound__code{font-family:var(--serif);font-size:5rem;color:var(--line-2);line-height:1}
.notfound h1{font-size:2rem}

@media (max-width:900px){
  .product{grid-template-columns:1fr}
  .product__gallery{position:static}
  .contact{grid-template-columns:1fr}
}
@media (max-width:760px){
  .shop-layout{grid-template-columns:1fr;gap:1.2rem}
  .shop-side{order:2}
  .shop-side__block h3{margin-top:1rem}
  .side-cats{flex-direction:row;flex-wrap:wrap}
  .side-cats a{border:1px solid var(--line-2)}
}
@media (max-width:480px){
  .product-grid,.product-grid--shop{grid-template-columns:repeat(2,1fr);gap:.9rem}
  .pcard__title{font-size:.92rem}
  .pcard__price{font-size:.9rem}
}

/* --- About page (editorial) --- */
.about-hero{max-width:var(--wrap);margin-inline:auto;padding:clamp(1rem,3vw,2.2rem) var(--gutter) clamp(2rem,5vw,3.5rem);
  display:grid;grid-template-columns:1fr 1.08fr;gap:clamp(1.6rem,5vw,4.5rem);align-items:center}
.about-hero__eyebrow{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:1rem}
.about-hero__title{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.04;margin-bottom:1.1rem}
.about-hero__lead{font-family:var(--serif);font-size:clamp(1.15rem,2vw,1.5rem);color:var(--ink-2);line-height:1.5;margin-bottom:1.9rem;max-width:32ch}
.about-hero__media{aspect-ratio:3/2;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.about-hero__media picture{display:block;width:100%;height:100%}
.about-hero__media img{width:100%;height:100%;object-fit:cover;display:block}

.about-story{padding-block:clamp(1.4rem,4vw,3rem) clamp(2rem,5vw,3.5rem)}
.about-story__body{max-width:760px;margin-inline:auto}

.about-band{position:relative;min-height:clamp(300px,42vw,460px);display:grid;align-items:center;overflow:hidden;isolation:isolate}
.about-band__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;z-index:0}
.about-band::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(9,8,6,.88) 0%,rgba(9,8,6,.62) 46%,rgba(9,8,6,.22) 100%)}
.about-band__inner{position:relative;z-index:2;max-width:var(--wrap);margin-inline:auto;width:100%}
.about-band__eyebrow{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:.6rem}
.about-band__line{font-family:var(--serif);font-size:clamp(1.6rem,4vw,2.9rem);color:#fff;max-width:16ch;line-height:1.1}

@media (max-width:820px){
  .about-hero{grid-template-columns:1fr;gap:1.6rem;text-align:left}
  .about-hero__media{order:-1;aspect-ratio:16/10}
  .about-hero__lead{max-width:none}
}
