
:root{
  --fxps-bg:#fff;
  --fxps-text:#171717;
  --fxps-muted:#737373;
  --fxps-line:#ece9e4;
  --fxps-accent:#8c1717;
  --fxps-radius:18px;
  --fxps-gap:18px;
}
.fxps-section{position:relative;width:100%;max-width:100%;margin:34px auto;box-sizing:border-box}
.fxps-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 16px}
.fxps-title{margin:0;color:var(--fxps-text);font-size:clamp(22px,2.2vw,34px);line-height:1.1;font-weight:750;letter-spacing:-.02em}
.fxps-slider{position:relative}
.fxps-viewport{overflow:hidden;width:100%;padding:2px}
.fxps-track{display:flex;width:100%;transition:transform .42s cubic-bezier(.22,.61,.36,1);will-change:transform}
.fxps-page{flex:0 0 100%;min-width:100%}
.fxps-grid{display:grid;grid-template-columns:repeat(var(--fx-cols),minmax(0,1fr));gap:var(--fxps-gap)}
.fxps-card{
  min-width:0;background:var(--fxps-bg);border:1px solid var(--fxps-line);
  border-radius:var(--fxps-radius);overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  box-shadow:0 1px 2px rgba(0,0,0,.03)
}
.fxps-card:hover{
  transform:translateY(-5px) scale(1.012);
  box-shadow:0 16px 38px rgba(17,17,17,.10);
  border-color:#ded8d0
}
.fxps-image-link{display:block;color:inherit;text-decoration:none}
.fxps-image-wrap{position:relative;aspect-ratio:1/1;background:#faf9f7;overflow:hidden}
.fxps-product-image{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  opacity:0;transform:scale(1.01);transition:opacity .45s ease,transform .7s cubic-bezier(.2,.7,.2,1);
  image-rendering:auto
}
.fxps-product-image.is-active{opacity:1}
.fxps-card:hover .fxps-product-image.is-active{transform:scale(1.065)}
.fxps-badge{
  position:absolute;top:12px;left:12px;z-index:3;background:rgba(20,20,20,.9);color:#fff;
  font-size:11px;font-weight:700;line-height:1;padding:7px 9px;border-radius:999px;letter-spacing:.02em
}
.fxps-meta{padding:12px 13px 14px}
.fxps-product-name{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
  min-height:2.65em;color:var(--fxps-text);text-decoration:none;font-size:14px;line-height:1.35;font-weight:650
}
.fxps-rating{display:flex;align-items:center;gap:6px;margin-top:8px;min-height:18px}
.fxps-stars{position:relative;display:inline-block;font-size:13px;line-height:1;letter-spacing:1px}
.fxps-stars-empty{color:#d8d3cd}
.fxps-stars-fill{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap;color:#111}
.fxps-review-count{font-size:12px;color:var(--fxps-muted)}
.fxps-no-reviews .fxps-stars{opacity:.55}
.fxps-price{margin-top:8px;color:var(--fxps-text);font-size:15px;line-height:1.2;font-weight:750}
.fxps-price del{opacity:.48;font-weight:500;margin-left:4px}
.fxps-price ins{text-decoration:none}
.fxps-category-card .fxps-image-wrap{aspect-ratio:1/1}
.fxps-category-name{padding:12px;text-align:center;font-size:14px;font-weight:700;color:var(--fxps-text)}

.fxps-arrow{
  position:absolute;top:42%;z-index:10;width:42px;height:42px;border:1px solid rgba(0,0,0,.08);
  border-radius:50%;background:rgba(255,255,255,.96);color:#1e1e1e;box-shadow:0 8px 24px rgba(0,0,0,.12);
  display:flex;align-items:center;justify-content:center;font-size:28px;line-height:1;cursor:pointer;
  transition:transform .18s ease,background .18s ease,opacity .18s ease
}
.fxps-arrow:hover{transform:scale(1.08);background:#fff}
.fxps-prev{left:10px}.fxps-next{right:10px}
.fxps-arrow:disabled{opacity:.3;cursor:default}
.fxps-dots{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:16px;min-height:10px}
.fxps-dot{
  width:6px;height:6px;padding:0;border:0;border-radius:999px;background:#c9c5bf;cursor:pointer;
  transition:width .2s ease,background .2s ease
}
.fxps-dot.is-active{width:18px;background:#252525}

@media(max-width:1100px){
  .fxps-grid{grid-template-columns:repeat(min(var(--fx-cols),4),minmax(0,1fr))}
}
@media(max-width:820px){
  .fxps-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
}
@media(max-width:640px){
  .fxps-section{margin:24px auto}
  .fxps-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .fxps-title{font-size:22px}
  .fxps-meta{padding:10px}
  .fxps-product-name{font-size:13px}
  .fxps-price{font-size:14px}
  .fxps-arrow{width:36px;height:36px;font-size:23px}
  .fxps-prev{left:6px}.fxps-next{right:6px}
}
