

/* Start:/bitrix/templates/aspro_tires2/css/sk-catalog-landing.css?178222347017180*/
:root{--skcl-black:#111;--skcl-text:#24272c;--skcl-muted:#6f7378;--skcl-orange:#ff6a00;--skcl-orange-hover:#e85f00;--skcl-orange-soft:#fff3e8;--skcl-border:#e4e6ea;--skcl-shadow:0 18px 46px rgba(17,17,17,.09);--skcl-container:1320px}.page-top-wrapper.grey{display:none!important}.sk-catalog-landing{margin:32px 0 34px;padding:0}.sk-catalog-landing *{box-sizing:border-box}.sk-catalog-landing__container{width:min(var(--skcl-container),calc(100% - 40px));margin:0 auto}.sk-catalog-landing__hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:stretch;padding:28px;border-radius:28px;background:radial-gradient(circle at 12% 14%,rgba(255,106,0,.10),transparent 28%),radial-gradient(circle at 88% 20%,rgba(255,210,0,.15),transparent 30%),linear-gradient(135deg,#fff 0%,#f7f8fa 100%);border:1px solid var(--skcl-border);box-shadow:var(--skcl-shadow);overflow:hidden}.sk-catalog-landing__hero:before{content:"";position:absolute;right:315px;top:-90px;width:260px;height:260px;border-radius:50%;border:34px solid rgba(255,106,0,.08);pointer-events:none}.sk-catalog-landing__hero-content,.sk-catalog-landing__help{position:relative;z-index:1}.sk-catalog-landing__eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--skcl-orange);font-size:14px;line-height:1.2;font-weight:950;text-transform:uppercase;letter-spacing:.045em}.sk-catalog-landing__eyebrow:before{content:"";width:34px;height:3px;border-radius:999px;background:var(--skcl-orange)}.sk-catalog-landing__title{max-width:720px;margin:12px 0 0;color:var(--skcl-black);font-size:42px;line-height:1.08;font-weight:950;letter-spacing:-.03em}.sk-catalog-landing__text{max-width:650px;margin-top:14px;color:var(--skcl-muted);font-size:17px;line-height:1.5}.sk-catalog-landing__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.sk-catalog-landing__btn{min-height:48px;padding:0 20px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-weight:950;font-size:15px;line-height:1;text-decoration:none!important;cursor:pointer;transition:.18s ease}.sk-catalog-landing__btn--primary{background:var(--skcl-orange);border:1px solid var(--skcl-orange);color:#fff!important;box-shadow:0 12px 24px rgba(255,106,0,.22)}.sk-catalog-landing__btn--primary:hover{background:var(--skcl-orange-hover);border-color:var(--skcl-orange-hover);transform:translateY(-1px)}.sk-catalog-landing__btn--secondary{background:#fff;border:1px solid #ffc49b;color:var(--skcl-orange)!important}.sk-catalog-landing__btn--secondary:hover,.sk-catalog-landing__btn--ghost:hover{background:var(--skcl-orange-soft);color:var(--skcl-orange-hover)!important}.sk-catalog-landing__btn--ghost{background:#f7f8fa;border:1px solid var(--skcl-border);color:var(--skcl-text)!important}.sk-catalog-landing__help{padding:22px;border-radius:22px;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.9);box-shadow:0 12px 30px rgba(17,17,17,.06)}.sk-catalog-landing__help-title{color:var(--skcl-black);font-size:21px;line-height:1.2;font-weight:950}.sk-catalog-landing__help-text{margin-top:8px;color:var(--skcl-muted);font-size:15px;line-height:1.45}.sk-catalog-landing__formula{display:inline-flex;align-items:center;gap:7px;margin-top:18px;padding:10px 14px;border-radius:16px;background:#151515;color:#fff;font-size:24px;line-height:1;font-weight:950}.sk-catalog-landing__formula i{color:var(--skcl-orange);font-style:normal}.sk-catalog-landing__formula-caption{margin-top:8px;color:var(--skcl-muted);font-size:13px;font-weight:800}.sk-catalog-landing__sections{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:20px}.sk-catalog-landing__section{min-height:150px;grid-column:span 2;position:relative;display:flex;gap:14px;padding:20px;border-radius:22px;background:#fff;border:1px solid var(--skcl-border);color:var(--skcl-text)!important;text-decoration:none!important;box-shadow:0 10px 28px rgba(17,17,17,.05);overflow:hidden;transition:.18s ease}.sk-catalog-landing__section--large{min-height:178px;grid-column:span 3}.sk-catalog-landing__section:hover{transform:translateY(-2px);border-color:#ffc49b;box-shadow:0 18px 40px rgba(17,17,17,.08)}.sk-catalog-landing__section:hover .sk-catalog-landing__section-arrow{background:var(--skcl-orange);color:#fff}.sk-catalog-landing__icon{width:52px;height:52px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 52px;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.9),transparent 45%),linear-gradient(135deg,#fff7ef 0%,#ffe5d2 100%);color:var(--skcl-orange);box-shadow:inset 0 0 0 1px rgba(255,106,0,.10)}.sk-catalog-landing__icon svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}.sk-catalog-landing__section:hover .sk-catalog-landing__icon{background:var(--skcl-orange);color:#fff;box-shadow:0 10px 22px rgba(255,106,0,.20)}.sk-catalog-landing__section-body{display:block;min-width:0;padding-right:34px}.sk-catalog-landing__section-title{display:block;color:var(--skcl-black);font-size:21px;line-height:1.18;font-weight:950}.sk-catalog-landing__section-text{display:block;margin-top:8px;color:var(--skcl-muted);font-size:15px;line-height:1.4}.sk-catalog-landing__section-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.sk-catalog-landing__section-tags span{min-height:28px;padding:0 10px;border-radius:999px;background:#f6f7f9;border:1px solid var(--skcl-border);color:#59606a;display:inline-flex;align-items:center;font-size:13px;font-weight:850}.sk-catalog-landing__section-arrow{position:absolute;right:18px;bottom:18px;width:34px;height:34px;border-radius:999px;background:#f6f7f9;color:var(--skcl-orange);display:inline-flex;align-items:center;justify-content:center;font-size:20px;font-weight:900;transition:.18s ease}.sk-catalog-landing__popular,.sk-catalog-landing__brands,.sk-catalog-landing__faq{margin-top:20px;padding:22px;border-radius:22px;background:#fff;border:1px solid var(--skcl-border);box-shadow:0 10px 28px rgba(17,17,17,.04)}.sk-catalog-landing__popular,.sk-catalog-landing__brands{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px;align-items:start}.sk-catalog-landing__block-title{color:var(--skcl-black);font-size:22px;line-height:1.2;font-weight:950}.sk-catalog-landing__block-text{margin-top:7px;color:var(--skcl-muted);font-size:15px;line-height:1.4}.sk-catalog-landing__chips,.sk-catalog-landing__brand-list{display:flex;flex-wrap:wrap;gap:9px}.sk-catalog-landing__chips a,.sk-catalog-landing__brand-list a{min-height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--skcl-border);background:#f7f8fa;color:var(--skcl-text)!important;display:inline-flex;align-items:center;font-size:14px;line-height:1;font-weight:850;text-decoration:none!important;transition:.18s ease}.sk-catalog-landing__chips a:hover,.sk-catalog-landing__brand-list a:hover{background:var(--skcl-orange);border-color:var(--skcl-orange);color:#fff!important}.sk-catalog-landing__brand-groups{display:grid;grid-template-columns:1fr 1fr;gap:18px}.sk-catalog-landing__brand-group{padding:16px;border-radius:18px;background:#fafbfc;border:1px solid var(--skcl-border)}.sk-catalog-landing__brand-group-title{margin-bottom:12px;color:var(--skcl-black);font-size:16px;line-height:1.2;font-weight:950}.sk-catalog-landing__brand-list a.sk-catalog-landing__brand-more{color:var(--skcl-orange)!important;background:#fff;border-color:#ffc49b}.sk-catalog-landing__brand-list a.sk-catalog-landing__brand-more:hover{color:#fff!important;background:var(--skcl-orange);border-color:var(--skcl-orange)}.sk-catalog-landing__trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}.sk-catalog-landing__trust div{min-height:52px;padding:0 14px;border-radius:16px;background:#fff;border:1px solid var(--skcl-border);color:var(--skcl-text);display:flex;align-items:center;font-size:14px;font-weight:850}.sk-catalog-landing__trust div:before{content:"✓";width:22px;height:22px;margin-right:9px;border-radius:50%;background:var(--skcl-orange-soft);color:var(--skcl-orange);display:inline-flex;align-items:center;justify-content:center;font-weight:950}.sk-catalog-landing__faq{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:start}.sk-catalog-landing__faq-list{display:grid;gap:10px}.sk-catalog-landing__faq details{border:1px solid var(--skcl-border);border-radius:16px;background:#fafbfc;overflow:hidden}.sk-catalog-landing__faq summary{position:relative;padding:16px 48px 16px 18px;color:var(--skcl-black);font-size:15px;line-height:1.3;font-weight:950;cursor:pointer;list-style:none}.sk-catalog-landing__faq summary::-webkit-details-marker{display:none}.sk-catalog-landing__faq summary:after{content:"+";position:absolute;right:18px;top:50%;width:26px;height:26px;transform:translateY(-50%);border-radius:999px;background:var(--skcl-orange-soft);color:var(--skcl-orange);display:inline-flex;align-items:center;justify-content:center;font-size:19px;line-height:1;font-weight:900}.sk-catalog-landing__faq details[open] summary:after{content:"−"}.sk-catalog-landing__faq details div{padding:0 18px 16px;color:var(--skcl-muted);font-size:15px;line-height:1.5}@media (max-width:991px){.sk-catalog-landing__hero,.sk-catalog-landing__popular,.sk-catalog-landing__brands,.sk-catalog-landing__faq{grid-template-columns:1fr}.sk-catalog-landing__title{font-size:34px}.sk-catalog-landing__sections{grid-template-columns:repeat(2,minmax(0,1fr))}.sk-catalog-landing__section,.sk-catalog-landing__section--large{grid-column:span 1}.sk-catalog-landing__trust{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.sk-catalog-landing__container{width:calc(100% - 24px)}.sk-catalog-landing__hero{padding:20px;border-radius:22px}.sk-catalog-landing__title{font-size:28px}.sk-catalog-landing__text{font-size:15px}.sk-catalog-landing__actions{display:grid;grid-template-columns:1fr}.sk-catalog-landing__sections,.sk-catalog-landing__brand-groups,.sk-catalog-landing__trust{grid-template-columns:1fr}.sk-catalog-landing__section{min-height:auto}.sk-catalog-landing__popular,.sk-catalog-landing__brands,.sk-catalog-landing__faq{padding:18px;border-radius:20px}}

/* =========================================================
   Shina-King catalog landing accent v4
   Добавить в самый конец:
   /bitrix/templates/aspro_tires2/css/sk-catalog-landing.css

   Цель:
   - убрать монотонность одинаковых белых карточек;
   - визуально разделить блоки по ролям;
   - не менять HTML и логику страницы.
   ========================================================= */

/* 1. Чуть усиливаем фон всей зоны каталога */
.sk-catalog-landing {
  position: relative;
}

.sk-catalog-landing:before {
  content: "";
  position: absolute;
  inset: -32px 0 auto 0;
  height: 520px;
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 106, 0, 0.055), transparent 32%),
    radial-gradient(circle at 92% 20%, rgba(255, 210, 0, 0.10), transparent 34%);
  pointer-events: none;
  z-index: -1;
}

/* 2. Главные карточки разделов делаем более выразительными */
.sk-catalog-landing__section {
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%) !important;
}

.sk-catalog-landing__section--large {
  background:
    radial-gradient(circle at 94% 12%, rgba(255, 106, 0, 0.08), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%) !important;
}

/* Оранжевая вертикальная метка у карточек */
.sk-catalog-landing__section:before {
  content: "";
  position: absolute;
  left: 0;
  top: 22px;
  bottom: 22px;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: rgba(255, 106, 0, 0.24);
  transition: 0.18s ease;
}

.sk-catalog-landing__section--large:before {
  background: var(--skcl-orange);
}

.sk-catalog-landing__section:hover:before {
  width: 6px;
  background: var(--skcl-orange);
}

/* Разные лёгкие акценты для второстепенных карточек */
.sk-catalog-landing__section[href*="accumulators"] {
  background:
    radial-gradient(circle at 94% 14%, rgba(255, 210, 0, 0.13), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%) !important;
}

.sk-catalog-landing__section[href*="truck"] {
  background:
    radial-gradient(circle at 94% 14%, rgba(255, 106, 0, 0.075), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%) !important;
}

.sk-catalog-landing__section[href*="moto"] {
  background:
    radial-gradient(circle at 94% 14%, rgba(17, 17, 17, 0.055), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%) !important;
}

/* 3. Популярные сценарии — делаем компактным светлым промо-блоком */
.sk-catalog-landing__popular {
  background:
    linear-gradient(135deg, #fff7ef 0%, #ffffff 46%, #f8f9fb 100%) !important;
  border-color: #ffd7bd !important;
}

.sk-catalog-landing__popular-title:before {
  content: "↗";
  width: 30px;
  height: 30px;
  margin-right: 10px;
  border-radius: 10px;
  background: var(--skcl-orange);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  vertical-align: middle;
}

/* 4. Бренды — отдельный спокойный блок, чтобы не сливался со сценариями */
.sk-catalog-landing__brands {
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 106, 0, 0.08), transparent 28%),
    linear-gradient(135deg, #ffffff 0%, #f7f8fa 100%) !important;
}

.sk-catalog-landing__brands-title:before {
  content: "★";
  width: 30px;
  height: 30px;
  margin-right: 10px;
  border-radius: 10px;
  background: #111111;
  color: #ffd200;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  line-height: 1;
  vertical-align: middle;
}

.sk-catalog-landing__brand-group {
  background: #ffffff !important;
  box-shadow: 0 8px 22px rgba(17, 17, 17, 0.035);
}

.sk-catalog-landing__brand-group-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.sk-catalog-landing__brand-group-title:before {
  content: "";
  width: 20px;
  height: 3px;
  border-radius: 999px;
  background: var(--skcl-orange);
}

/* 5. Trust-блок лучше сделать менее карточным, как строку преимуществ */
.sk-catalog-landing__trust {
  padding: 14px;
  border-radius: 20px;
  background: #111111;
  box-shadow: 0 14px 34px rgba(17, 17, 17, 0.12);
}

.sk-catalog-landing__trust div {
  min-height: 48px !important;
  background: rgba(255,255,255,0.075) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #ffffff !important;
}

.sk-catalog-landing__trust div:before {
  background: rgba(255, 106, 0, 0.18) !important;
  color: #ffd200 !important;
}

/* 6. FAQ — отделяем как информационный блок, не как очередную витрину */
.sk-catalog-landing__faq {
  background:
    linear-gradient(135deg, #f8f9fb 0%, #ffffff 100%) !important;
}

.sk-catalog-landing__faq-title:before {
  content: "?";
  width: 30px;
  height: 30px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--skcl-orange-soft);
  color: var(--skcl-orange);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  font-weight: 950;
  vertical-align: middle;
}

.sk-catalog-landing__faq details {
  background: #ffffff !important;
}

.sk-catalog-landing__faq details[open] {
  border-color: #ffc49b !important;
  box-shadow: 0 10px 24px rgba(255, 106, 0, 0.075);
}

/* 7. Чипы: чуть больше контраста для разных блоков */
.sk-catalog-landing__chips a {
  background: #ffffff !important;
}

.sk-catalog-landing__popular .sk-catalog-landing__chips a:nth-child(1),
.sk-catalog-landing__popular .sk-catalog-landing__chips a:nth-child(2),
.sk-catalog-landing__popular .sk-catalog-landing__chips a:nth-child(3) {
  border-color: #ffc49b !important;
  color: var(--skcl-orange) !important;
  background: #ffffff !important;
}

.sk-catalog-landing__popular .sk-catalog-landing__chips a:hover {
  color: #ffffff !important;
}

/* 8. Мелкая полировка hover */
.sk-catalog-landing__section,
.sk-catalog-landing__popular,
.sk-catalog-landing__brands,
.sk-catalog-landing__faq {
  transition: box-shadow 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.sk-catalog-landing__popular:hover,
.sk-catalog-landing__brands:hover,
.sk-catalog-landing__faq:hover {
  border-color: #ffc49b;
  box-shadow: 0 16px 36px rgba(17, 17, 17, 0.07);
}

/* Mobile */
@media (max-width: 640px) {
  .sk-catalog-landing__trust {
    padding: 12px;
  }

  .sk-catalog-landing__popular-title:before,
  .sk-catalog-landing__brands-title:before,
  .sk-catalog-landing__faq-title:before {
    margin-right: 8px;
  }
}

/* End */
/* /bitrix/templates/aspro_tires2/css/sk-catalog-landing.css?178222347017180 */
