/* ── PRODUCT MODAL ─────────────────────────────────────────────────────────── */
.wgd-modal{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:16px}
.wgd-modal[hidden]{display:none}
.wgd-modal.is-open .wgd-modal__panel{transform:translateY(0) scale(1);opacity:1}
.wgd-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);cursor:pointer}
.wgd-modal__panel{position:relative;background:#fff;border-radius:16px;width:100%;max-width:900px;max-height:92vh;overflow-y:auto;transform:translateY(24px) scale(.97);opacity:0;transition:transform .28s cubic-bezier(.34,1.2,.64,1),opacity .22s ease;box-shadow:0 32px 80px rgba(0,0,0,.22)}
.wgd-modal__close{position:sticky;top:16px;left:calc(100% - 48px);z-index:10;width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,.9);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.12);transition:background .18s;margin:16px 16px -52px auto}
.wgd-modal__close:hover{background:var(--gray-100)}

/* Layout */
.wgd-modal__content{display:grid;grid-template-columns:42% 1fr;min-height:400px}
.wgd-modal__skeleton{display:grid;grid-template-columns:42% 1fr;gap:0;min-height:400px}

/* Image */
.wgd-modal__img-col{background:var(--gray-100);border-radius:16px 0 0 16px;overflow:hidden;position:relative}
.wgd-modal__img-wrap{position:sticky;top:0;height:100%;min-height:320px;max-height:92vh}
.wgd-modal__img-wrap img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .3s;background:var(--gray-100)}

/* Info panel */
.wgd-modal__info{padding:32px 32px 32px 28px;display:flex;flex-direction:column;gap:0}
.wgd-modal__badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.wgd-badge{padding:3px 11px;border-radius:20px;font-size:.68rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.wgd-badge--cat{background:var(--brand-pale);color:var(--brand)}
.wgd-badge--style{background:var(--gray-100);color:var(--ink-light)}
.wgd-modal__name{font-family:var(--font-serif);font-size:1.6rem;font-weight:600;line-height:1.25;color:var(--ink);margin-bottom:14px}
.wgd-modal__price-wrap{margin-bottom:6px}
.wgd-modal__price{font-size:1.1rem;font-weight:800;color:var(--brand)}
.wgd-modal__price-disc{display:block;font-size:.62rem;color:var(--ink-light);font-style:italic;margin-top:2px}
.wgd-modal__desc{font-size:.9rem;line-height:1.7;color:var(--ink-light);margin:14px 0 16px}
.wgd-modal__bullets{margin:0 0 18px;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.wgd-modal__bullets li{font-size:.87rem;color:var(--ink-light);line-height:1.5}

/* Retailers inside modal */
.wgd-modal__retailers{margin-top:4px}
.wgd-modal__retailers .rw-label{font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-light);margin-bottom:8px}
.wgd-modal__retailers .rw-buttons{display:flex;flex-direction:column;gap:8px}
.wgd-modal__retailers .rw-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;border-radius:10px;font-size:.87rem;font-weight:700;text-decoration:none;border:1.5px solid var(--gray-200);background:#fff;color:var(--ink);transition:all .18s}
.wgd-modal__retailers .rw-btn:hover{border-color:var(--brand);color:var(--brand);transform:translateX(2px)}
.wgd-modal__retailers .rw-btn--primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.wgd-modal__retailers .rw-btn--primary:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff;transform:translateX(2px)}
.wgd-modal__retailers .rw-btn-left{display:flex;align-items:center;gap:7px}
.wgd-modal__retailers .rw-badge{font-size:.6rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:20px;background:rgba(255,255,255,.25);color:#fff}
.wgd-modal__retailers .rw-btn:not(.rw-btn--primary) .rw-badge{background:var(--brand-pale);color:var(--brand)}
.wgd-modal__retailers .rw-more-btn{background:none;border:none;color:var(--brand);font-size:.78rem;font-weight:700;cursor:pointer;padding:6px 0;font-family:inherit}
.wgd-modal__retailers .rw-more-items.hidden{display:none}
.wgd-modal__retailers .rw-more-items{display:flex;flex-direction:column;gap:8px;margin-top:8px}

/* Hub link */
.wgd-modal__hub{margin-top:20px;padding-top:16px;border-top:1px solid var(--gray-200)}
.wgd-modal__hub-link{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;font-weight:700;color:var(--ink-light);text-decoration:none;transition:color .18s}
.wgd-modal__hub-link:hover{color:var(--brand)}

/* Skeleton */
.wgd-sk{background:linear-gradient(90deg,var(--gray-100) 25%,var(--gray-200) 50%,var(--gray-100) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:6px}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.wgd-sk--img{border-radius:16px 0 0 16px;height:100%;min-height:400px}
.wgd-sk--badge{height:22px;width:90px;margin:32px 0 14px 28px;border-radius:20px}
.wgd-sk--title{height:28px;width:80%;margin:0 0 10px 28px}
.wgd-sk--short{width:55%}
.wgd-sk--line{height:14px;width:90%;margin:0 0 8px 28px}
.wgd-sk--price{height:22px;width:100px;margin:12px 0 18px 28px}
.wgd-sk--btn{height:48px;width:calc(100% - 56px);margin:0 0 10px 28px;border-radius:10px}

/* Error */
.wgd-modal__error{padding:60px 32px;text-align:center;color:var(--ink-light)}
.wgd-modal__err-btn{display:inline-block;margin-top:16px;padding:10px 20px;background:var(--brand);color:#fff;border-radius:var(--radius);font-weight:700;text-decoration:none;font-size:.88rem}

/* Mobile */
@media(max-width:640px){
  .wgd-modal{padding:0;align-items:flex-end}
  .wgd-modal__panel{border-radius:20px 20px 0 0;max-height:92vh;transform:translateY(100%);opacity:1}
  .wgd-modal.is-open .wgd-modal__panel{transform:translateY(0)}
  .wgd-modal__content,.wgd-modal__skeleton{grid-template-columns:1fr}
  .wgd-modal__img-col{border-radius:20px 20px 0 0;max-height:280px}
  .wgd-modal__img-wrap{min-height:200px;max-height:280px;position:relative}
  .wgd-modal__info{padding:20px}
  .wgd-modal__name{font-size:1.3rem}
  .wgd-sk--img{min-height:200px;border-radius:20px 20px 0 0}
  .wgd-sk--badge,.wgd-sk--title,.wgd-sk--line,.wgd-sk--price,.wgd-sk--btn{margin-left:20px;width:calc(100% - 40px)}
  .wgd-modal__close{top:12px;left:calc(100% - 44px);margin:-44px 12px 8px auto}
}