/* Мир Паркета v2 / карточки товара, сетка листинга, быстрый просмотр, сравнение */

/* ---------- сетка ---------- */
.mp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.75rem,1.2rem + 1.6vw,3rem) clamp(.75rem,.4rem + 1.4vw,2rem)}
@media (min-width:900px){.mp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1200px){.mp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* крупные карточки */
.mp-grid[data-view=large]{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:1200px){.mp-grid[data-view=large]{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1720px){.mp-grid[data-view=large]{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1500px;margin-inline:auto}}
@media (max-width:639px){.mp-grid[data-view=large]{grid-template-columns:minmax(0,1fr)}}

/* вставка помощи на всю ширину сетки */
.mp-gridpromo{grid-column:1/-1;display:grid;gap:1.5rem 2.5rem;padding:clamp(1.5rem,1rem + 2vw,2.5rem) 0;border-top:1px solid var(--mp-ink);border-bottom:1px solid var(--mp-line);margin:.5rem 0}
.mp-gridpromo__h{margin:0 0 .5rem;font:400 clamp(1.2rem,1.1rem + .5vw,1.5rem)/1.2 var(--mp-font-display);color:var(--mp-ink)}
.mp-gridpromo p{margin:0 0 1rem;font-size:.9375rem;line-height:1.6;font-weight:300;color:var(--mp-muted);max-width:26em}
@media (min-width:900px){.mp-gridpromo{grid-template-columns:repeat(3,1fr)}.mp-gridpromo__col+.mp-gridpromo__col{padding-left:2.5rem;border-left:1px solid var(--mp-line)}}

/* ---------- карточка ---------- */
.mp-card{position:relative;display:flex;flex-direction:column;min-width:0}
.mp-card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#efece6;isolation:isolate}
.mp-card__link{position:absolute;inset:0;display:block}
.mp-card__img,.mp-card__img2{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--mp-ease),opacity .5s var(--mp-ease)}
.mp-card__img2{opacity:0}
/* мелкий исходник (часто 253x183): в плотной сетке кадр заполняет рамку без растяжки больше ~1,3x,
   в «крупных карточках» показывается как отпечаток на паспарту, а не как размытая заливка */
.mp-card__media.is-small .mp-card__img{max-width:none}
.mp-grid[data-view=large] .mp-card__media.is-small .mp-card__img,.mp-grid[data-view=large] .mp-card__media.is-small .mp-card__img2{inset:0;margin:auto;width:auto;height:auto;max-width:min(88%,calc(var(--nw) * 1.3px));max-height:88%;object-fit:contain;box-shadow:0 12px 32px rgba(40,30,20,.22)}
.mp-card__ph{position:absolute;inset:0;background:repeating-linear-gradient(90deg,#efece5 0 38px,#f5f3ee 38px 76px)}
@media (hover:hover){
  .mp-card:hover .mp-card__img:not([data-x]){transform:scale(1.035)}
  .mp-card:hover .mp-card__img2.is-ready{opacity:1}
}
.mp-card.is-out .mp-card__media{filter:grayscale(.35)}
.mp-card__badges{position:absolute;left:.6rem;top:.6rem;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;margin:0;padding:0;list-style:none}
.mp-card__badge{padding:.3rem .55rem;background:#fff;color:var(--mp-ink);font:400 .6875rem/1 var(--mp-font-text);letter-spacing:.06em}
.mp-card__badge--muted{background:var(--mp-ink);color:#fff}
.mp-card__tools{position:absolute;right:.5rem;top:.5rem;z-index:3;display:flex;flex-direction:column;gap:.35rem}
.mp-tool{width:2.5rem;height:2.5rem;border:0;border-radius:50%;background:rgba(255,255,255,.94);color:var(--mp-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s,transform .2s;box-shadow:0 2px 10px rgba(0,0,0,.12)}
.mp-tool:hover{transform:scale(1.06)}
.mp-tool[aria-pressed=true]{background:var(--mp-ink);color:#fff}
.mp-tool[data-fav][aria-pressed=true] svg path{fill:currentColor}
@media (hover:hover){.mp-card__tools{opacity:0;transition:opacity .25s}.mp-card:hover .mp-card__tools,.mp-card:focus-within .mp-card__tools,.mp-card__tools:has([aria-pressed=true]){opacity:1}}
.mp-card__quick{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;border:0;background:rgba(17,17,17,.88);color:#fff;font:400 .6875rem/1 var(--mp-font-text);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transform:translateY(101%);transition:transform .35s var(--mp-ease)}
@media (hover:hover){.mp-card:hover .mp-card__quick,.mp-card__quick:focus-visible{transform:none}}
@media (hover:none){.mp-card__quick{position:static;display:none}}
.mp-card__body{display:flex;flex-direction:column;flex:1;padding-top:.9rem}
.mp-card__eyebrow{margin:0 0 .35rem;font:400 .6875rem/1.3 var(--mp-font-text);letter-spacing:.14em;text-transform:uppercase;color:var(--mp-muted);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.mp-card__title{margin:0;font:400 clamp(1.0625rem,1rem + .35vw,1.3125rem)/1.25 var(--mp-font-display);color:var(--mp-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em;text-wrap:balance}
.mp-card__title a:hover{text-decoration:underline;text-decoration-color:var(--mp-accent);text-decoration-thickness:2px;text-underline-offset:.2em}
.mp-card__meta{margin:.4rem 0 0;font-size:.8125rem;line-height:1.45;color:var(--mp-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mp-card__foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.6rem 1rem;margin-top:auto;padding-top:.9rem}
.mp-card__price{margin:0;font:400 1.125rem/1.2 var(--mp-font-text);color:var(--mp-ink);font-variant-numeric:lining-nums}
.mp-card__price--ask{color:var(--mp-muted);font-size:.9375rem}
.mp-card__from,.mp-card__unit{font-size:.8125rem;color:var(--mp-muted)}
.mp-card__pack{margin:.2rem 0 0;font-size:.75rem;color:var(--mp-muted)}
.mp-card__btn{min-height:2.5rem;padding:0 1.1rem;border:1px solid var(--mp-ink);background:transparent;color:var(--mp-ink);font:400 .6875rem/1 var(--mp-font-text);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;border-radius:0;transition:background .25s var(--mp-ease),color .25s var(--mp-ease)}
.mp-card__btn:hover:not([disabled]){background:var(--mp-ink);color:#fff}
.mp-card__btn[disabled]{border-color:var(--mp-line);color:var(--mp-muted);cursor:default}
.mp-card__staff{margin-top:.75rem;display:flex;flex-direction:column;gap:.4rem;align-items:flex-start;color:var(--mp-muted)}
@media (max-width:639px){
  .mp-grid:not([data-view=large]) .mp-card__foot{flex-direction:column;align-items:stretch}
  .mp-grid:not([data-view=large]) .mp-card__btn{width:100%}
  .mp-grid:not([data-view=large]) .mp-card__title{font-size:1rem}
  /* размер одной строкой мелким текстом: иначе соседние позиции отличаются только «Юг / Запад» */
  .mp-grid:not([data-view=large]) .mp-card__meta{margin-top:.3rem;font-size:.75rem;line-height:1.35;-webkit-line-clamp:1;font-variant-numeric:lining-nums}
  .mp-card__tools{opacity:1}
  .mp-tool{width:2.25rem;height:2.25rem}
  /* кнопки избранного и сравнения справа сверху, бейджи слева снизу фото, не под кнопками */
  .mp-card__badges{top:auto;bottom:.5rem;left:.5rem;max-width:calc(100% - 1rem);flex-direction:column-reverse}
  .mp-card__badge{padding:.28rem .45rem;font-size:.625rem;line-height:1.2;letter-spacing:.04em;white-space:normal;max-width:100%}
}

/* ---------- панель избранного и сравнения ---------- */
.mp-cmpbar{position:fixed;left:50%;bottom:1rem;z-index:34;display:flex;align-items:center;gap:.25rem;padding:.35rem;background:var(--mp-night);color:#fff;box-shadow:0 12px 40px rgba(0,0,0,.35);transform:translateX(-50%)}
.mp-cmpbar[hidden]{display:none}
.mp-cmpbar__b{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;padding:0 1rem;border:0;background:transparent;color:#fff;font:400 .75rem/1 var(--mp-font-text);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.mp-cmpbar__b b{display:inline-flex;align-items:center;justify-content:center;min-width:1.4rem;height:1.4rem;border-radius:.7rem;background:var(--mp-accent);color:var(--mp-ink);font-size:.6875rem;letter-spacing:0}
.mp-cmpbar__b:hover{color:var(--mp-accent)}
.mp-cmpbar__x{width:2.75rem;height:2.75rem;border:0;background:transparent;color:#bdbab1;cursor:pointer}
.mp-cmpbar__x:hover{color:#fff}
@media (max-width:767px){.mp-cmpbar{bottom:calc(64px + env(safe-area-inset-bottom));max-width:calc(100vw - 1rem)}}

/* ---------- быстрый просмотр ---------- */
.mp-dialog--wide{width:min(56rem,calc(100vw - 2rem))}
.mp-qv{display:grid;gap:1.5rem}
@media (min-width:760px){.mp-qv{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:2.25rem;align-items:start}}
.mp-qv__media{position:relative;aspect-ratio:4/3;background:#efece6;overflow:hidden}
.mp-qv__media img{position:absolute;inset:0;margin:auto;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:cover}
.mp-qv__media.is-small img{width:auto;height:auto;object-fit:contain;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.mp-qv__price{margin:.5rem 0 1rem;font:400 1.5rem/1.2 var(--mp-font-text);color:var(--mp-ink)}
.mp-qv__specs{margin:0 0 1.5rem}
.mp-qv__specs>div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-top:1px solid var(--mp-line);font-size:.9375rem}
.mp-qv__specs dt{color:var(--mp-muted)}
.mp-qv__specs dd{margin:0;text-align:right;color:var(--mp-ink)}
.mp-qv__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}
.mp-qv__actions .mp-btn{width:auto;min-height:3rem}
.mp-qv__actions [hidden]{display:none}

/* ---------- сравнение и избранное ---------- */
.mp-cmp__body{margin-top:1.25rem;overflow-x:auto}
.mp-cmp{width:100%;border-collapse:collapse;min-width:34rem}
.mp-cmp th,.mp-cmp td{padding:.7rem .9rem;text-align:left;vertical-align:top;border-top:1px solid var(--mp-line);font-size:.9375rem}
.mp-cmp th{width:9rem;font:400 .75rem/1.4 var(--mp-font-text);letter-spacing:.1em;text-transform:uppercase;color:var(--mp-muted)}
.mp-cmp__ph{display:block;width:100%;max-width:11rem;aspect-ratio:4/3;object-fit:cover;background:#efece6;margin-bottom:.5rem}
.mp-cmp__name{display:block;font:400 1.0625rem/1.25 var(--mp-font-display);color:var(--mp-ink)}
.mp-cmp__rm{margin-top:.5rem;border:0;background:none;padding:0;color:var(--mp-muted);font-size:.8125rem;text-decoration:underline;cursor:pointer}
.mp-cmp td.is-diff{background:#faf7ee}
.mp-favlist{list-style:none;margin:0;padding:0;display:grid;gap:.75rem}
.mp-favlist li{display:grid;grid-template-columns:5.5rem minmax(0,1fr) auto;gap:1rem;align-items:center;padding:.75rem 0;border-top:1px solid var(--mp-line)}
.mp-favlist img{width:5.5rem;height:4rem;object-fit:cover;background:#efece6}
.mp-favlist a{font:400 1.0625rem/1.25 var(--mp-font-display);color:var(--mp-ink)}
.mp-favlist small{display:block;margin-top:.2rem;color:var(--mp-muted);font-size:.8125rem}
.mp-cmp__empty{margin:1rem 0 0;color:var(--mp-muted)}

@media (prefers-reduced-motion:reduce){
  .mp-card__img,.mp-card__img2,.mp-card__quick,.mp-tool,.mp-card__tools{transition:none}
}
.mp-qv .mp-h3{font-size:clamp(1.35rem,1.2rem + .6vw,1.75rem);line-height:1.25}
.mp-qv__price{margin-top:.9rem}