#primary { margin: 1em 0; }
@media (max-width: 921px){ #primary, #secondary { padding: 0; margin: 0; } } .sm-offers-filters{ display:flex; flex-wrap:wrap; gap:14px 12px; margin-bottom:32px; }
.sm-offers-filter{
display:inline-flex; align-items:center; justify-content:center;
padding:12px 24px;
border-radius:999px;
border:1px solid var(--sm-surface-subtle);
background:var(--sm-surface-subtle);
color:var(--sm-text);
cursor:pointer;
transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.sm-offers-filter:hover{
border:1px solid var(--sm-muted);
background:var(--sm-muted);
color:var(--sm-on-brand);
}
.sm-offers-filter.is-active{
border:1px solid var(--sm-brand);
background:var(--sm-brand);
color:var(--sm-on-brand);
}
@media (max-width:544px){ .sm-offers-filter{ padding:8px 24px; } } .sm-offers-filter__count{
display:inline-flex; align-items:center; justify-content:center;
width:18px; height:18px; margin-left:6px; border-radius:999px;
background:var(--sm-brand); color:var(--sm-on-brand);
font-size:10px; line-height:1; vertical-align:middle;
} .sm-offers-filter:hover .sm-offers-filter__count,
.sm-offers-filter.is-active .sm-offers-filter__count,
.sm-offers-filter.is-active:hover .sm-offers-filter__count,
.sm-offers-filter:focus-visible .sm-offers-filter__count,
.sm-offers-filter.is-active:focus-visible .sm-offers-filter__count{
background: var(--sm-on-brand);
color: var(--sm-brand);
transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
} .sm-offers-grid{
display:grid;
grid-template-columns: repeat(3, minmax(0,1fr));
gap:24px;
}
@media (max-width:921px){ .sm-offers-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width:544px){ .sm-offers-grid{ grid-template-columns: 1fr; } } .sm-offer-card{
background: var(--sm-surface);
border-radius: var(--sm-radius-card);
border:1px solid transparent;
overflow:hidden;
box-shadow: 0 8px 24px var(--sm-shadow);
transition: box-shadow .2s ease, border-color .2s ease;
height:100%;
display:flex; flex-direction:column;
}
.sm-offer-card:hover{
border-color: var(--sm-surface-subtle);
box-shadow: 0 10px 30px var(--sm-shadow);
} .sm-offer-card__media{
position:relative; display:block; background: var(--offer-bg);
aspect-ratio: 16/9; transition: background-color .2s ease;
}
.sm-offer-card:hover .sm-offer-card__media{ background: var(--offer-bg-hover); } .sm-offer-card__badges{
position:absolute; top:18px; left:16px; right:16px;
display:flex; align-items:center; justify-content:space-between; gap:12px;
pointer-events:none;
}
.sm-offer-badge{
display:inline-flex; align-items:center; justify-content:center;
border-radius:999px; padding:6px 8px; font-weight:600;
border: 1px solid transparent;
transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
}
.sm-offer-badge--promo{ color: var(--sm-on-brand); background: var(--offer-bg-hover); }
.sm-offer-badge--timer{ background: var(--sm-on-brand); color: var(--sm-brand); box-shadow: 0 2px 8px rgba(0,0,0,.08); } .sm-offer-card:hover .sm-offer-badge--promo{ border-color: var(--sm-on-brand); }
.sm-offer-card__imgwrap{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:12px 12px 0 12px; }
.sm-offer-card__img{ max-width:100%; max-height:100%; object-fit:contain; display:block; }
.sm-offer-card__img--placeholder{ width:60%; height:60%; background:rgba(0,0,0,.08); border-radius:12px; } .sm-offer-card__body{ display:flex; flex-direction:column; flex:1 1 auto; padding: 16px 24px 24px !important; }
@media (max-width:544px){ .sm-offer-card__body{ padding: 16px 24px 24px !important; } }
.sm-offer-card__title{ color: var(--sm-headline) !important; margin:0 0 12px 0; }
.sm-offer-card__offer{ color: var(--sm-muted); margin:0 0 12px 0; } .sm-offer-card__prices{ display:flex; align-items:baseline; gap:12px; flex-wrap:nowrap; white-space:nowrap; margin-top:auto; }
.sm-offer-card__prices .is-striked,
.sm-offers-grid .sm-offer-card__old.is-striked{
text-decoration: line-through;
text-decoration-thickness: 2px;
text-decoration-color: var(--sm-muted);
color: var(--sm-muted);
}
.sm-offers-grid .sm-offer-card__price.h3{
color: var(--sm-headline);
display:inline-flex; margin-right:0 !important;
}
.sm-offers-grid .sm-offer-card__old{ display:inline; color: var(--sm-muted) !important; } .sm-button--signup{
display:inline-block; width:100%; text-align:center;
padding:8px 16px;
border:1px solid var(--sm-brand);
color: var(--sm-brand);
background: var(--sm-surface);
border-radius:999px;
font-size:16px; font-weight:500; line-height:1.3;
transition: background-color .2s ease, color .2s ease, border-color .2s ease;
margin-top: 12px;
}
.sm-button--signup:hover, .sm-button--signup:focus{
background: var(--sm-brand);
border-color: var(--sm-brand);
color: var(--sm-on-brand);
text-decoration:none; outline:none;
} @media (max-width: 921px){
.sm-offers-filters{
flex-wrap: nowrap;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.sm-offers-filters::-webkit-scrollbar{ display:none; }
.sm-offers-filter{ flex: 0 0 auto; }
} .sm-offer-card__imgwrap img{
transition: transform .25s ease;
transform-origin: bottom center;
}
.sm-offer-card:hover .sm-offer-card__imgwrap img{ transform: scale(0.96); } .sm-offer-badge--timer{ color: var(--sm-brand); }
.sm-offer-badge--timer::before{
content:"";
display:inline-block; width:11px; height:18px; margin-right:6px;
background-color: currentColor;
-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='24' fill='none'><path fill='%23000' d='M13.451 0 0 13.7h4.946L1.18 24 15 10.394H9.938L13.451 0Z'/></svg>");
-webkit-mask-repeat:no-repeat; -webkit-mask-size:contain;
mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='24' fill='none'><path fill='%23000' d='M13.451 0 0 13.7h4.946L1.18 24 15 10.394H9.938L13.451 0Z'/></svg>");
mask-repeat:no-repeat; mask-size:contain;
} .sm-offers-grid .sm-offer-card__title{ color: var(--sm-headline); }
.sm-offers-grid .sm-offer-card__title a,
.sm-offers-grid .sm-offer-card__title a:visited{
color: var(--sm-headline);
text-decoration: none;
transition: color .2s ease;
}
.sm-offers-grid .sm-offer-card__title a:hover,
.sm-offers-grid .sm-offer-card__title a:focus{
color: var(--sm-headline);
text-decoration: none;
} .post-type-archive-offers .sm-archive-header .sm-archive-title{
margin: 0 0 36px 0;
font-size: var(--ast-h1-font-size, clamp(28px, 4vw, 42px));
line-height: var(--ast-h1-line-height, 1.2);
font-weight: var(--ast-h1-font-weight, 700);
}