.discount5per {
border-radius: 2px;
background: -webkit-linear-gradient(270deg,#21645a 30%,#00ff88 85%) #21645a;
background: -o-linear-gradient(270deg,#21645a 30%,#00ff88 85%) #21645a;
background: -moz-linear-gradient(270deg,#21645a 30%,#00ff88 85%) #21645a;
background: linear-gradient(270deg,#21645a 30%,#00ff88 85%) #21645a;
}
.discount5per a {
display:block; width:100%; text-align:center;
}
.discount5per a img { width:35%; margin:10px auto; }
@media (max-width: 991px) { .discount5per a img { width:50%; } }
@media (max-width: 767px) { .discount5per a img { width:80%; } }


.weekdeal_0{background:repeating-linear-gradient(135deg,#f2f2f2 0,#f2f2f2 10px,#fed4e7 10px,#fed4e7 20px);}
.weekdeal_1{background:repeating-linear-gradient(135deg,#f2f2f2 0,#f2f2f2 10px,#d1ffea 10px,#d1ffea 20px);}
.weekdeal_2{background:repeating-radial-gradient(circle,#b9ecfe 0,#b9ecfe 10px,#82ddff 10px,#82ddff 20px);}
.weekdeal_3{background:repeating-radial-gradient(circle,#f9edb0 0,#f9edb0 15px,#fbcd01 15px,#fbcd01 30px);}
.weekdeal_4{background:repeating-radial-gradient(135deg,#f2f2f2 0,#f2f2f2 10px,#aa64db 10px,#aa64db 20px);}

.weekdeal {
margin:0;
display:block;
text-align:center;
height:100%;
position:relative;
}
.weekdeal a.add2cart {
position:absolute; right:0; bottom:3px; z-index:3;
border-bottom-left-radius:2px;
}
.weekdeal .prices {
position:absolute; left:5px; bottom:11px; z-index:3;
}
.weekdeal .prices .priceold {
font-size:14px;
}
.weekdeal .prices .price {
font-weight:bold;
font-size:22px;
}
.weekdeal a.caption {
text-decoration:none;
font-size:20px;
font-weight:bold;
padding:1%;
height:auto;
width:auto;
max-width: 98%;
position:absolute; left:1%; bottom:43px; z-index:3;
background:rgba(255,255,255,0.65);
border-radius: 2px;
}
.weekdeal img {
transform:rotate(-1deg);
height:80%;
box-shadow: 0 2px 3.5px rgba(0,0,0,0.2);
margin:5px 0 5px 10%;
position:relative;
}
.weekdeal span.week{
position:absolute;
top: 6.25px;
left: calc(10% - 3px);
z-index:4;
display:block;
margin:0;
font-size:15px;
padding:3px 6px;
color:#ffffff;
opacity:0.85;
color:#37003c;
background-color:#00ff88;
transform:rotate(-1deg);
transform-origin:left top;
}

.weekdeal .discount, .weekdeal .howlong {
  width: 4.5rem;
  height: 4.5rem;
  position: absolute; z-index:3;
  top: 0.5rem;
  right: 1.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border-radius: 50%;
  background: #37003c;
  color: #00ff88;
}
.weekdeal .howlong {
z-index:2;
right: 1.05rem;
  top: 4.75rem;
  background: #fc2985;
color: #37003c;
}
.weekdeal .discount-value, .weekdeal .howlong-value {
  font-weight: bold;
  font-style: normal;
  font-size: 1.8rem;
  line-height: 1.8rem;
  margin: 0;
}
.weekdeal .discount-text, .weekdeal .howlong-text {
  font-weight: bold;
  font-style: normal;
  font-size: 0.9rem;
  line-height: 0.9rem;
  margin: 0;
}

@media (max-width:1200px){
.weekdeal .discount { top: 1.75rem; right: 1.0rem; } .weekdeal .howlong { top: 6.0rem; right: 0.55rem; }
}
@media (max-width:991px){
.weekdeal .discount { top: 1.0rem; right: 0.5rem; } .weekdeal .howlong { top: 5.25rem; right: 0.05rem; }
}
@media (max-width:767px){
.weekdeal .discount { top: 0.5rem; } .weekdeal .howlong { top: 4.75rem; } .weekdeal img { margin-left:5%; } .weekdeal .prices .priceold { display:none; } .weekdeal .prices .price { font-size: 18px; } .weekdeal a.caption { font-size: 18px; }   .weekdeal span.week{ left: calc(5% - 1.5px); top: 5.75px; font-size: 12px; }
}
@media (max-width:570px){
.weekdeal .discount { top: 0.5rem; } .weekdeal .howlong { top: 4.75rem; } .weekdeal a.add2cart { display:none; } .weekdeal .prices { display:none; } .weekdeal a.caption { bottom:3px; }
}

.top-swiper-fluid{
background:#f2f2f2;
overflow:hidden;
padding-top: 15px;
padding-bottom: 15px;
}

.top-swiper-outer{
position:relative;
}

/* сам swiper-контейнер */
#top-swiper{
--gap:15px;
position:relative;
width:100%;
box-sizing:border-box;
overflow:visible;
height:400px; /* базовая высота области под слайды */
}

/* адаптивная высота враппера */
@media (max-width:991px){
#top-swiper{height:300px;}
}
@media (max-width:767px){
#top-swiper{height:250px;}
}
@media (max-width:570px){
#top-swiper{height:200px;}
}

/* скроллбар: не увеличивает высоту, лежит поверх снизу */
#top-swiper .swiper-scrollbar{
position:absolute;
left:0;
right:0;
bottom:0;
height:4px;
box-sizing:border-box;
background:rgba(0,0,0,.05);
}
#top-swiper .swiper-scrollbar-horizontal{
bottom: -15px;
}
#top-swiper .swiper-scrollbar-drag{
background:#00ff88;
}

/* ПЕРЕЗАТИРАЕМ общие .tag-swiper правила только для #top-swiper */
#top-swiper.tag-swiper .swiper-wrapper{
display:flex;
box-sizing:border-box;
margin-top:0;
align-items:stretch;
}

#top-swiper.tag-swiper .swiper-slide, .card-top, #top-swiper .card-top picture, #top-swiper .cat-img, .weekdeal {
border-radius:6px;
}

#top-swiper.tag-swiper .swiper-slide{
flex:0 0 auto;      /* ширина по содержимому */
width:auto;
height:100%;
box-sizing:border-box;
}

/* отдельный слайд (обёртка) */
.top-slide{
position:relative;
height:100%;
display:flex;
align-items:stretch;
}

/* базовая карточка (одинарная или внутренняя двойного блока) */
.card-top{
position:relative;
display:block;
height:100%; /* для одиночных — на всю высоту слайда */
text-decoration:none;
color:#333;
background:#f5f5f5;
overflow:hidden;
transition:
  transform .15s ease-in-out,
  box-shadow .15s ease-in-out,
  color .15s linear,
  opacity .15s linear;
will-change:transform;
}

/* соотношения сторон (одинарные слайды) */
.card-11  { aspect-ratio:1/1; }
.card-45  { aspect-ratio:4/5; }
.card-169 { aspect-ratio:16/9; }
.card-916 { aspect-ratio:9/16; }

/* фолбэк для старых браузеров без aspect-ratio */
@supports not (aspect-ratio:1){
.card-11::before,
.card-45::before,
.card-169::before,
.card-916::before{
  content:"";
  display:block;
}
.card-11::before{ padding-top:100%; }
.card-45::before{ padding-top:125%; }
.card-169::before{ padding-top:56.25%; }
.card-916::before{ padding-top:177.7778%; }

#top-swiper{
  height:auto;
}
#top-swiper.tag-swiper .swiper-slide{
  height:auto;
}
.card-top{
  height:auto;
}
}

/* картинка в карточке; для top-swiper — cover */
#top-swiper .card-top picture{
position:relative;
display:block;
width:100%;
height:100%;
}

#top-swiper .cat-img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center;
display:block;
}


#top-swiper .card-top .choose-btn{
font-family:'ALS Granate',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
position:absolute;
cursor: pointer;
bottom:7%;
left:7%;
background:var(--top-btn-bg,#ebebeb);
color:var(--top-btn-cl,#333333);
text-decoration:none;
font-weight:400;
border-radius:2px;
line-height:1;
white-space:nowrap;
padding:clamp(6px,1vw,10px) clamp(12px,1.6vw,16px);
font-size:clamp(13px,1.4vw,16px);
box-shadow:0 1px 1.75px rgba(0,0,0,0.2);
transition:
background .15s ease,
box-shadow .15s ease,
transform .15s ease;
}
#top-swiper .card-top.card-169 .choose-btn{ left:3.9375%; } /* 16:9 */
#top-swiper .card-top.card-45  .choose-btn{ left:8.75%;   } /* 4:5  */
#top-swiper .card-top.card-916 .choose-btn{ left:12.44%;  } /* 9:16 */
#top-swiper .top-slide--double .card-top .choose-btn{ bottom:14.5%; }

#top-swiper .card-top .choose-btn:hover,
#top-swiper .card-top .choose-btn:focus{
background:var(--top-btn-bg-hover,#fc2985);
color:var(--top-btn-cl-hover,#ebebeb);
}

#top-swiper .card-top .choose-btn:active{
  transform:translateY(1px);
}

/* ===== ДВОЙНОЙ СЛАЙД (2 баннера 16:9 один под другим) ===== */

.top-slide--double{
display:flex;
}

/* колонка из двух баннеров */
.top-slide--double .top-slide-grid{
display:flex;
flex-direction:column;
gap:var(--gap,15px);
width:100%;
height:100%; /* на всю высоту слайда */
}

.top-slide--double .card-top{
flex:0 0 auto;
height:calc((100% - var(--gap,15px)) / 2);
aspect-ratio:16/9;
}

.top-slide--double .card-top picture,
.top-slide--double .card-top img{
height:100%;
}

/* стрелки по центру высоты top-swiper */
#top-swiper.tag-swiper .tg-nav{
top:50%;
transform:translateY(-50%);
background:rgba(0,255,136,.66)
}
#top-swiper.tag-swiper .tg-nav:hover{background:rgba(0,255,136,.77)}

.tag-swiper{--gap:0px;--bar:#2684ff;position:relative;width:100%;box-sizing:border-box;}
.tag-swiper .swiper-wrapper{display:flex;box-sizing:border-box;margin-top:5px;}
.tag-swiper .swiper-slide{flex:0 0 200px;width:200px;box-sizing:border-box}
.tag-swiper .item{width:200px;box-sizing:border-box;margin:2px}
.tag-swiper .item .itemimage{width:100%;height:auto;display:block}
.tag-swiper .swiper-scrollbar{position:relative;height:4px;width:100%;box-sizing:border-box;background:rgba(0,0,0,.05)}
.tag-swiper .swiper-scrollbar-horizontal{bottom:auto}
.tag-swiper .swiper-scrollbar-drag{background:var(--bar)}
.tag-swiper .tg-nav{position:absolute;top:170px;transform:translateY(-50%);width:40px;height:40px;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;z-index:5;background:rgba(55,0,60,.55);color:#fff}
.tag-swiper .tg-prev{left:10px}.tag-swiper .tg-next{right:10px}
.tag-swiper .tg-nav::before{content:"";width:10px;height:10px;display:block;border:2px solid currentColor;border-top:0;border-left:0;position: relative;}
.tag-swiper .tg-prev::before{transform:rotate(135deg);left:2px;}.tag-swiper .tg-next::before{transform:rotate(-45deg);left:-2px;}
.tag-swiper .tg-nav:hover{background:rgba(55,0,60,.75)}
.tag-swiper .swiper-button-disabled,.tag-swiper .swiper-button-lock{opacity:0;visibility:hidden;pointer-events:none}
@media (max-width:991px){.tag-swiper .tg-nav{display:none}}
/* индивидуальные цвета бегунка */
#hit-swiper    {--bar:#37003c}
#new-swiper    {--bar:#fc2985}
#sale-swiper   {--bar:#f32c17}
#offer-swiper  {--bar:#9a09a7}
#bigdeal-swiper{--bar:#e0bb4c}
#category-swiper{--bar:#333333}

#category-swiper{--gap:15px}
#category-swiper.tag-swiper .swiper-scrollbar{margin-bottom:10px}
#category-swiper.tag-swiper .tg-nav{top:67px;}

.cat-slide{
width:220px;flex:0 0 220px;box-sizing:border-box;
overflow:visible;transition:transform .15s ease,box-shadow .15s ease
}
.swiper-slide-visible.cat-slide{transform:translateZ(0);box-shadow: 0 2px 3.5px rgba(0,0,0,0.25);}

.cat-card{
position:relative;display:block;text-decoration:none;color:#333;
background:#f5f5f5;border-radius:2px;overflow:hidden;
aspect-ratio:11/6;
transition:transform .15s ease-in-out,box-shadow .15s ease-in-out,color .15s linear,opacity .15s linear;
will-change:transform
}
@supports not (aspect-ratio:1){
.cat-card::before{content:"";display:block;padding-top:54.545%} /* 120/220 */
}

.cat-img{
position:absolute;inset:0;width:100%;height:100%;
object-fit:contain;object-position:center;display:block
}

.cat-label{
position:absolute;top:10px;left:10px;max-width:calc(100% - 20px);
font-size:16px;line-height:1.25;color:#333;
overflow-wrap:break-word;word-break:break-word
}

.cat-card:focus-visible{outline:2px solid #2684ff;outline-offset:2px}
.cat-card:is(:hover,:focus,:focus-visible,:active){
transform:translateY(-3px);
box-shadow: 0 1px 1.75px rgba(0,0,0,0.25);
}

.indexinfo {
display: block;
aspect-ratio:16/9;
border-radius:2px;
position:relative;
}
.indexinfo img {
display:block;
aspect-ratio:16/9;
width:100%;
border-radius:2px;
}
.indexinfo .choose-btn{
font-family:'ALS Granate',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
position:absolute;left:5.625%;bottom:10%;
cursor: pointer;
background:var(--top-btn-bg,#ebebeb);
color:#333;text-decoration:none;font-weight:400;
border-radius:2px;line-height:1;white-space:nowrap;
padding:clamp(6px,1vw,10px) clamp(12px,1.6vw,16px);
font-size:clamp(13px,1.4vw,16px);
box-shadow: 0 1px 1.75px rgba(0,0,0,0.2);
transition:background .15s ease,box-shadow .15s ease,transform .15s ease
}
.indexinfo .choose-btn:hover,.indexinfo .choose-btn:focus{
background:var(--top-btn-bg-hover,#fc2985);
color:#ebebeb;
}
.indexinfo .choose-btn:active{transform:translateY(1px)}
.indexhead-more{
font-size:40%;
color:#8c8c8c;
text-decoration:none;
white-space:nowrap;
}
.indexhead-more:hover,
.indexhead-more:focus{
text-decoration:underline;
}
.indexhead-more:focus-visible{
outline:0;
text-decoration:underline;
}


.top-clock{
position:absolute;
right:3.9375%;;
top:7%;
z-index:5;
font-family:'ALS Granate',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

.top-clock #clock_bg{
padding:5px 10px;
border-radius:6px;
display:inline-block;
}

.top-clock #clockdiv{
display:flex;
align-items:flex-end;
gap:5px;
}

.top-clock #clockdiv>div{
display:flex;
flex-direction:column;
align-items:center;
}

.top-clock #clockdiv div span{
font-size:24px;
line-height: 24px;
height: 32px;
padding:2px 6px;
min-width:2.5ch;
text-align:center;
}

/* подпись под цифрами */
.top-clock #clockdiv .smalltext{
margin-bottom:2px;
font-size:10px;
line-height:1;
padding:0 4px;
}

/* двоеточия между цифрами */
.top-clock #clockdiv>div span::after{
content:":";
padding-left:2px;
}
.top-clock #clockdiv>div:last-child span::after{
content:"";
}

@media (max-width:767px){
.top-clock #clock_bg{
  padding:4px 8px;              /* было 5px 10px */
}

.top-clock #clockdiv{
  gap:4px;                      /* было 5px */
}

.top-clock #clockdiv div span{
  font-size:18px;               /* было 24px */
  line-height:18px;             /* было 24px */
  height:24px;                  /* было 32px */
  padding:2px 5px;              /* было 2px 6px */
  /* min-width и letter-spacing оставляем как есть */
}

.top-clock #clockdiv .smalltext{
  margin-bottom:2px;            /* оставим 2px, нормально смотрится */
  font-size:8px;                /* было 10px */
  padding:0 3px;                /* было 0 4px */
}
}