/* ==========================================================
   NISSI — product page  ·  "Night boutique"
   (reuses .products / .product cards from collection.css)
   ========================================================== */
.pdp-crumbs{padding-top:24px;align-items:center}
.pdp-crumbs .back{display:inline-flex;align-items:center;gap:.2rem;min-height:44px;margin-left:-.2rem;color:var(--ink)}
.pdp-crumbs .back:hover{color:var(--gold-hi)}
.pdp-crumbs{margin-bottom:.4rem;flex-wrap:wrap;gap:.2rem .6rem}

.pdp,.pdp-crumbs{max-width:1300px;margin-inline:auto}
.pdp{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,520px);gap:clamp(32px,5vw,88px);padding:16px 0 clamp(56px,8vw,104px);align-items:start}

/* gallery */
.gallery{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;gap:14px;width:100%;max-width:1000px;justify-self:start}
.gallery__main{position:relative;display:block;width:100%;aspect-ratio:1/1;background:var(--case);overflow:hidden;cursor:zoom-in}
.gallery__main img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}
.gallery__zoom{position:absolute;z-index:2;pointer-events:none;left:12px;bottom:12px;display:inline-flex;align-items:center;gap:.5rem;min-height:36px;padding:0 .8rem;background:rgba(238,235,226,.92);color:#0a352b;font-size:.875rem;font-weight:500;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s var(--ease)}
.gallery__stage:hover .gallery__zoom{opacity:1;transform:none}
@media (hover:none){.gallery__zoom{opacity:1;transform:none}}
/* carousel */
.gallery__stage{position:relative;outline:1px solid var(--line);outline-offset:4px}
.gallery__swiper{overflow:hidden}
.gallery__swiper .swiper-slide{height:auto}
.gallery__main img{user-select:none;-webkit-user-drag:none}
.gallery__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(250,250,247,.92);color:var(--accent);box-shadow:0 2px 10px rgba(11,63,51,.18);opacity:0;transition:opacity .25s,background-color .2s}
.gallery__nav--prev{left:12px}.gallery__nav--next{right:12px}
.gallery__stage:hover .gallery__nav,.gallery__nav:focus-visible{opacity:1}
.gallery__nav:hover{background:#fff}
.gallery__nav.is-disabled{opacity:0!important}
@media (hover:none){.gallery__nav{opacity:1}}
.gallery__count{position:absolute;right:12px;bottom:12px;z-index:2;margin:0;padding:.3rem .65rem;background:rgba(238,235,226,.92);color:#0a352b;font-size:.8125rem;font-variant-numeric:tabular-nums;pointer-events:none}
.gallery__thumbs{display:flex;gap:10px;overflow-x:auto;padding:4px;margin:-4px;scrollbar-width:thin;scroll-snap-type:x proximity}
.gallery__thumbs li{flex:none;scroll-snap-align:start}
.gallery__thumbs button{display:block;width:76px;height:76px;background:var(--case);outline:1px solid var(--line-soft);outline-offset:2px;opacity:.7;transition:opacity .25s,outline-color .25s}
.gallery__thumbs button[aria-current=true],.gallery__thumbs button:hover{opacity:1;outline-color:var(--gold)}
.gallery__thumbs img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}

/* info */
.info{position:sticky;top:calc(var(--header-h) + 24px)}
.info__type{font-size:1.0625rem;color:var(--muted)}
.info h1{font-size:clamp(2.4rem,4.2vw,3.75rem);margin:.5rem 0 1rem}
.info__price{font-size:1.5rem;font-weight:400;color:var(--ink);font-variant-numeric:tabular-nums;margin-bottom:1.5rem}
.info__desc{margin-bottom:1.5rem}
.info__desc>:last-child{margin-bottom:0}

/* colour swatches */
.swatches{border:0;padding:0;margin:0 0 1.5rem;min-width:0}
.swatches legend{padding:0;margin-bottom:.7rem;font-size:1rem;color:var(--muted)}
.swatches legend b{font-weight:500;color:var(--ink)}
.swatch{display:inline-flex;align-items:center;gap:.55rem;margin:0 .5rem .5rem 0;padding:.45rem .95rem .45rem .5rem;border:1px solid var(--line-soft);background:transparent;color:var(--ink);font-size:.9375rem;cursor:pointer;transition:border-color .2s,background-color .2s}
.swatch:hover{border-color:var(--gold)}
.swatch[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.swatch__dot{width:22px;height:22px;border-radius:50%;background:var(--sw);box-shadow:inset 0 0 0 1px rgba(16,32,27,.22)}
.swatch.is-out{color:var(--muted)}
.swatch.is-out .swatch__dot{opacity:.45}
.swatch.is-out .swatch__txt{text-decoration:line-through;text-decoration-thickness:1px}
.swatch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.buy{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:stretch;gap:.7rem;margin-bottom:2rem}
.buy .qty{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;width:132px;border:1px solid var(--line);min-height:56px}
.buy .qty button{display:grid;place-items:center;height:54px;color:var(--accent);transition:color .2s,background-color .2s}
.buy .qty button:hover:not(:disabled){background:var(--bg-deep)}
.buy .qty button:disabled{opacity:.3;cursor:default}
.buy .qty output{text-align:center;font-size:1.0625rem;font-weight:500;font-variant-numeric:tabular-nums}
.buy .btn{min-height:56px}
.buy__add{width:100%}
/* phones: quantity + favourite on one row, "Add to bag" full width under them (squeezed between the two it wrapped to three lines) */
@media (max-width:520px){
  .buy{grid-template-columns:minmax(0,1fr) auto}
  .buy .qty{width:auto;order:1}
  .buy__wish{order:2}
  .buy__add{order:3;grid-column:1/-1}
}
.buy__wish{width:56px;min-width:56px;padding:0}
.buy__wish span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.buy__wish[aria-pressed=true] svg{fill:currentColor}
.btn:disabled{opacity:.45;cursor:not-allowed;background:transparent;color:var(--muted);border-color:var(--line)}

.acc{border-top:1px solid var(--line-soft)}
.acc details{border-bottom:1px solid var(--line-soft)}
.acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:60px;font-size:1.0625rem;font-weight:500}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";width:9px;height:9px;border-right:1.2px solid var(--ink);border-bottom:1.2px solid var(--ink);transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s var(--ease)}
.acc details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.acc p,.acc dl{padding:0 0 22px;color:var(--muted);font-size:1rem;max-width:52ch}
.specs{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.6rem}
.specs dt{color:var(--ink)}
.specs dd{margin:0}

.notfound{text-align:center;padding:clamp(64px,10vw,140px) 0}
.notfound h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:.8rem}
.notfound p{color:var(--muted);margin-bottom:2rem}

.related{padding:clamp(48px,7vw,96px) 0;background:var(--bg-deep);border-block:1px solid var(--line)}

/* mobile buy bar */
.buybar{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-sticky);display:none;align-items:center;justify-content:space-between;gap:1rem;padding:10px var(--gutter);background:#fff;border-top:1px solid var(--line-soft);transform:translateY(100%);transition:transform .35s var(--ease)}
.buybar b{display:block;font-weight:500;font-size:1rem;line-height:1.3}
.buybar span{color:var(--muted);font-size:.9375rem}
.buybar .btn{min-height:48px;padding:0 1.4rem;flex:none}
.buybar.is-on{transform:none}

/* lightbox (the zoom dialog): a Swiper gallery with pinch / double-tap zoom */
.zoom{--ink:#f3efe4;--gold:#d3ad55;--gold-hi:#e8c978;--line:rgba(211,173,85,.32);--bg-deep:#0b3f33;border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%;color:var(--ink)}
.zoom::backdrop{background:rgba(5,31,25,.95)}
.zoom[open]{display:block}
.zoom__swiper{width:100%;height:100%}
.zoom__swiper .swiper-slide{display:grid;place-items:center}
.zoom__swiper .swiper-zoom-container{width:100%;height:100%;cursor:zoom-in}
.zoom__swiper img{max-width:min(94vw,1100px);max-height:92vh;width:auto;height:auto;object-fit:contain;background:var(--case)}
.zoom__close,.zoom__nav{position:absolute;z-index:3;display:grid;place-items:center;width:48px;height:48px;color:var(--gold);border:1px solid var(--line);background:var(--bg-deep);transition:color .2s,border-color .2s,opacity .2s}
.zoom__close{top:12px;right:12px}
.zoom__nav{top:50%;transform:translateY(-50%)}
.zoom__nav--prev{left:16px}.zoom__nav--next{right:16px}
.zoom__close:hover,.zoom__nav:hover{color:var(--gold-hi);border-color:var(--gold)}
.zoom__nav.is-disabled{opacity:.3;pointer-events:none}
.zoom__count{position:absolute;z-index:3;left:50%;bottom:16px;transform:translateX(-50%);margin:0;padding:.3rem .8rem;color:var(--gold);background:var(--bg-deep);border:1px solid var(--line);font-size:.875rem;font-variant-numeric:tabular-nums}
@media (max-width:640px){.zoom__nav{display:none}}

@media (max-width:1000px){
  .pdp{grid-template-columns:1fr;gap:28px}
  .info{position:static}
  .buybar{display:flex}
  .footer{padding-bottom:96px}
}
@media (max-width:640px){
  .gallery__thumbs button{width:64px;height:64px}
}