/* RETACH SKLIKIVANIE - consolidated current visual */



/* Только H1 первого экрана страницы скликивания */
@media (min-width: 901px) {

  #sklikivanie-shared-hero h1 {
    white-space: nowrap !important;
    width: max-content !important;
    max-width: none !important;

    font-size: clamp(48px, 4vw, 60px) !important;
    line-height: 0.96 !important;
    letter-spacing: -0.045em !important;
  }

}

/* На мобильном nowrap не используем */
@media (max-width: 900px) {

  #sklikivanie-shared-hero h1 {
    white-space: normal !important;
    width: auto !important;
    max-width: 100% !important;
  }

}





/*
  Только два текста под H1.
  Сам H1 не изменяем вообще.
*/
@media (min-width: 901px) {

  #sklikivanie-shared-hero h1 + p,
  #sklikivanie-shared-hero h1 + p + p {
    max-width: 455px !important;
    width: 100% !important;
  }

}

@media (max-width: 900px) {

  #sklikivanie-shared-hero h1 + p,
  #sklikivanie-shared-hero h1 + p + p {
    max-width: none !important;
    width: auto !important;
  }

}





/*
 * Только оформление левой части hero.
 * H1 НЕ МЕНЯЕМ.
 * Тексты НЕ МЕНЯЕМ.
 */
@media (min-width: 901px) {

    /* Верхняя плашка как в референсе */
    #sklikivanie-shared-hero [class*="eyebrow"],
    #sklikivanie-shared-hero [class*="kicker"],
    #sklikivanie-shared-hero [class*="overline"] {
        display: inline-flex !important;
        align-items: center !important;
        width: max-content !important;

        margin: 0 0 14px !important;
        padding: 6px 11px !important;

        border: 1px solid rgba(111, 78, 255, .26) !important;
        border-radius: 999px !important;

        background: rgba(255,255,255,.60) !important;

        color: #6d5ac7 !important;
        font-size: 11px !important;
        line-height: 1 !important;
        font-weight: 700 !important;
        letter-spacing: .045em !important;

        box-shadow:
            0 3px 12px rgba(92, 67, 190, .05) !important;
    }

    #sklikivanie-shared-hero [class*="eyebrow"]::before,
    #sklikivanie-shared-hero [class*="kicker"]::before,
    #sklikivanie-shared-hero [class*="overline"]::before {
        content: "✦";
        margin-right: 6px;
        color: #7157ff;
        font-size: 11px;
    }


    /* Первый абзац под H1 — как обычный lead в референсе */
    #sklikivanie-shared-hero h1 + p {
        max-width: 465px !important;

        margin-top: 18px !important;
        margin-bottom: 14px !important;

        padding: 0 !important;

        color: #505469 !important;
        font-size: 15.5px !important;
        line-height: 1.48 !important;
        font-weight: 500 !important;
    }


    /*
     * Второй СУЩЕСТВУЮЩИЙ абзац.
     * Не добавляем новый текст — только оформляем как карточку,
     * как в референсе.
     */
    #sklikivanie-shared-hero h1 + p + p {
        position: relative !important;

        box-sizing: border-box !important;
        max-width: 465px !important;

        margin: 0 0 18px !important;
        padding: 13px 16px 13px 60px !important;

        border: 1px solid rgba(112, 82, 245, .20) !important;
        border-radius: 15px !important;

        background: rgba(255,255,255,.70) !important;

        color: #35394e !important;
        font-size: 13.5px !important;
        line-height: 1.42 !important;
        font-weight: 600 !important;

        box-shadow:
            0 8px 24px rgba(78, 57, 160, .05) !important;
    }

    #sklikivanie-shared-hero h1 + p + p::before {
        content: "✦";

        position: absolute;
        left: 14px;
        top: 50%;
        transform: translateY(-50%);

        display: flex;
        align-items: center;
        justify-content: center;

        width: 32px;
        height: 32px;

        border: 1px solid rgba(108, 78, 255, .16);
        border-radius: 9px;

        background: #f1edff;
        color: #6c50ff;

        font-size: 16px;
        line-height: 1;
    }


    /* Главная кнопка — как в референсе */
    #sklikivanie-shared-hero [data-cb-open] {
        min-height: 52px !important;

        padding: 0 27px !important;

        border: 0 !important;
        border-radius: 14px !important;

        background:
            linear-gradient(
                100deg,
                #6554ff 0%,
                #7954ff 58%,
                #ca43ef 100%
            ) !important;

        color: #fff !important;

        font-size: 14px !important;
        font-weight: 700 !important;

        box-shadow:
            0 9px 22px rgba(100, 73, 235, .24) !important;
    }


    /* Вторая кнопка */
    #sklikivanie-shared-hero a {
        min-height: 50px !important;

        padding: 0 24px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 9px !important;

        border: 1px solid rgba(78, 80, 109, .15) !important;
        border-radius: 14px !important;

        background: rgba(255,255,255,.76) !important;

        color: #303346 !important;

        font-size: 14px !important;
        font-weight: 650 !important;

        box-shadow:
            0 5px 18px rgba(54, 48, 91, .04) !important;
    }

    #sklikivanie-shared-hero a::before {
        content: "▶";

        display: inline-flex;
        align-items: center;
        justify-content: center;

        width: 20px;
        height: 20px;

        border-radius: 50%;

        background: #191b2b;
        color: #fff;

        font-size: 8px;
        line-height: 1;
    }

}


/* Мобильную версию не ломаем */
@media (max-width: 900px) {

    #sklikivanie-shared-hero h1 + p + p {
        position: relative !important;
        box-sizing: border-box !important;

        padding: 13px 14px 13px 54px !important;

        border: 1px solid rgba(112, 82, 245, .20) !important;
        border-radius: 14px !important;

        background: rgba(255,255,255,.74) !important;
    }

    #sklikivanie-shared-hero h1 + p + p::before {
        content: "✦";

        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);

        display: flex;
        align-items: center;
        justify-content: center;

        width: 30px;
        height: 30px;

        border-radius: 9px;

        background: #f1edff;
        color: #6c50ff;
    }

}





/* Только зона кнопок первого экрана */
@media (min-width: 901px) {

  #sklikivanie-shared-hero [class*="actions"],
  #sklikivanie-shared-hero [class*="buttons"],
  #sklikivanie-shared-hero [class*="cta"] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    margin-bottom: 16px !important;
  }

  #sklikivanie-shared-hero [data-cb-open],
  #sklikivanie-shared-hero a[href*="/shield/technology/"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

}

/* На мобильном пусть могут переноситься */
@media (max-width: 900px) {

  #sklikivanie-shared-hero [class*="actions"],
  #sklikivanie-shared-hero [class*="buttons"],
  #sklikivanie-shared-hero [class*="cta"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

}


/* Убираем черные точки / иконки у кнопок */
#sklikivanie-shared-hero [data-cb-open]::before,
#sklikivanie-shared-hero [data-cb-open]::after,
#sklikivanie-shared-hero a[href*="/shield/technology/"]::before,
#sklikivanie-shared-hero a[href*="/shield/technology/"]::after {
  content: none !important;
  display: none !important;
}

/* Элементы под кнопками остаются ниже */
#sklikivanie-shared-hero [class*="stats"],
#sklikivanie-shared-hero [class*="badges"],
#sklikivanie-shared-hero [class*="benefits"] {
  margin-top: 10px !important;
  clear: both !important;
}





/* =========================================================
   SECOND BLOCK ONLY — ПО РЕФЕРЕНСУ
   ========================================================= */

.skl-problem-ref-live {
    position: relative !important;
    overflow: hidden !important;

    box-sizing: border-box !important;

    padding: 46px 22px 54px !important;

    text-align: left !important;

    background:
        radial-gradient(
            circle at 92% 0%,
            rgba(117, 86, 255, .09),
            transparent 29%
        ),
        #faf9fe !important;
}


/* -------------------------
   ПЛАШКА ПРОБЛЕМА
   ------------------------- */

.skl-problem-ref-live .skl-problem-eyebrow-ref {
    display: flex !important;
    align-items: center !important;

    width: max-content !important;

    margin:
        0
        0
        10px
        0 !important;

    padding:
        4px
        9px !important;

    border:
        1px solid
        rgba(108, 79, 237, .18) !important;

    border-radius:
        999px !important;

    background:
        rgba(255,255,255,.74) !important;

    color:
        #765ee1 !important;

    font-size:
        10px !important;

    line-height:
        1 !important;

    font-weight:
        800 !important;

    letter-spacing:
        .055em !important;

    text-align:
        left !important;
}


.skl-problem-ref-live
.skl-problem-eyebrow-ref::before {
    content: "✦";

    margin-right:
        5px;

    color:
        #7357ff;

    font-size:
        9px;
}


/* -------------------------
   ЗАГОЛОВОК
   как в референсе:
   компактный и в одну строку
   ------------------------- */

.skl-problem-ref-live h2 {
    width:
        auto !important;

    max-width:
        900px !important;

    margin:
        0
        0
        8px
        0 !important;

    padding:
        0 !important;

    color:
        #171820 !important;

    font-size:
        clamp(30px, 2.55vw, 38px) !important;

    line-height:
        1.02 !important;

    font-weight:
        760 !important;

    letter-spacing:
        -.04em !important;

    text-align:
        left !important;

    white-space:
        nowrap !important;
}


/* -------------------------
   ТЕКСТ ПОД H2
   ------------------------- */

.skl-problem-ref-live
.skl-problem-lead-ref {
    max-width:
        790px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    color:
        #666b7d !important;

    font-size:
        13px !important;

    line-height:
        1.42 !important;

    font-weight:
        500 !important;

    text-align:
        left !important;
}


/* -------------------------
   РУКОПИСНАЯ ПОМЕТКА
   ------------------------- */

.skl-problem-ref-live
.skl-problem-note-ref {
    position:
        absolute !important;

    top:
        48px !important;

    right:
        4.8% !important;

    width:
        190px !important;

    max-width:
        190px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;

    background:
        transparent !important;

    color:
        #302b45 !important;

    font-family:
        "Segoe Print",
        "Comic Sans MS",
        cursive !important;

    font-size:
        13px !important;

    line-height:
        1.23 !important;

    font-weight:
        700 !important;

    text-align:
        center !important;

    transform:
        rotate(-5deg) !important;
}


.skl-problem-ref-live
.skl-problem-note-ref::after {
    content:
        "↘";

    display:
        block;

    margin:
        -1px
        0
        0
        20px;

    font-size:
        22px;

    line-height:
        1;
}


/* =========================================================
   CARDS — КОМПАКТНЫЕ КАК В РЕФЕРЕНСЕ
   ========================================================= */

.skl-problem-ref-live
.skl-problem-cards-ref {
    width:
        100% !important;

    max-width:
        1180px !important;

    margin:
        26px
        auto
        0 !important;

    display:
        grid !important;

    grid-template-columns:
        repeat(4, minmax(0,1fr)) !important;

    gap:
        10px !important;

    align-items:
        stretch !important;
}


/* сама карточка */

.skl-problem-ref-live
.skl-problem-card-ref {
    position:
        relative !important;

    box-sizing:
        border-box !important;

    min-width:
        0 !important;

    min-height:
        160px !important;

    height:
        auto !important;

    margin:
        0 !important;

    padding:
        16px
        15px
        17px !important;

    border:
        1px solid
        rgba(84, 70, 145, .08) !important;

    border-radius:
        10px !important;

    background:
        rgba(255,255,255,.90) !important;

    box-shadow:
        0
        7px
        20px
        rgba(52, 41, 92, .045) !important;

    text-align:
        left !important;
}


/* номера 01/02/03/04 в референсе не нужны */

.skl-problem-ref-live
.skl-problem-num-ref {
    display:
        none !important;
}


/* -------------------------
   ИКОНКА
   ------------------------- */

.skl-problem-ref-live
.skl-problem-icon-ref {
    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    width:
        34px !important;

    height:
        34px !important;

    margin:
        0
        0
        12px
        0 !important;

    border:
        1px solid
        rgba(112, 81, 244, .10) !important;

    border-radius:
        8px !important;

    background:
        linear-gradient(
            145deg,
            #eeeaff,
            #f9f7ff
        ) !important;

    color:
        #7257ff !important;

    font-size:
        16px !important;

    box-shadow:
        none !important;
}


/* -------------------------
   НАЗВАНИЯ
   ------------------------- */

.skl-problem-ref-live
.skl-problem-card-ref h3 {
    margin:
        0
        0
        6px !important;

    padding:
        0 !important;

    color:
        #1c1d27 !important;

    font-size:
        14px !important;

    line-height:
        1.18 !important;

    font-weight:
        760 !important;

    letter-spacing:
        -.02em !important;

    text-align:
        left !important;
}


/* -------------------------
   ОПИСАНИЯ
   ------------------------- */

.skl-problem-ref-live
.skl-problem-card-ref p {
    margin:
        0 !important;

    padding:
        0 !important;

    color:
        #777b8c !important;

    font-size:
        11.5px !important;

    line-height:
        1.4 !important;

    font-weight:
        400 !important;

    text-align:
        left !important;
}




/* SHIELD CARD — reference geometry */




/* Настоящий силуэт щита находится ЗА содержимым.
   Поэтому стрелки между карточками больше не обрезаются. */







/* В референсе у ЩИТа нет обычного квадратного бокса
   вокруг пиктограммы — сама иконка крупнее и светится. */







/* ЩИТ чуть заметнее остальных */









/* =========================================================
   REAL REFERENCE SHIELD
   THIS IS THE CARD ITSELF — NO RECTANGLE UNDER IT
   ========================================================= */

.skl-postclick-final__flow {
  grid-column: 2;
  grid-row: 1;

  align-self: start;

  display: grid;

  grid-template-columns:
    repeat(5, minmax(0, 1fr));

  gap: 10px;

  width: 100%;
  max-width: none;

  margin: 42px 0 12px;
  padding: 0;

  align-items: center;
}


.skl-postclick-final__shield-card {
  position: relative;
  z-index: 6;

  box-sizing: border-box;

  min-width: 0;
  height: 152px;

  margin:
    -14px
    0
    -12px;

  display: flex;

  align-items: center;
  justify-content: center;

  background: transparent;

  border: 0;

  box-shadow: none;

  text-align: center;

  overflow: visible;
}


/* arrow AFTER shield */

.skl-postclick-final__shield-card::after {
  content: "→";

  position: absolute;
  z-index: 20;

  right: -8px;
  top: 50%;

  transform:
    translate(50%, -50%);

  color: #9b7cff;

  font-size: 12px;
  line-height: 1;

  font-weight: 800;
}


/* actual SVG occupies the whole card */

.skl-postclick-final__shield-shape {
  position: absolute;

  z-index: 0;

  inset:
    -4px
    -6px;

  width:
    calc(100% + 12px);

  height:
    calc(100% + 8px);

  overflow: visible;

  pointer-events: none;
}


.skl-postclick-final__shield-glow {
  fill: none;

  stroke: #895eff;

  stroke-width: 5;

  opacity: .42;

  filter:
    url(#sklShieldGlow);
}


.skl-postclick-final__shield-body {
  fill:
    url(#sklShieldFill);

  stroke:
    url(#sklShieldStroke);

  stroke-width: 2;
}


.skl-postclick-final__shield-inner {
  fill: none;

  stroke:
    rgba(255,255,255,.15);

  stroke-width: 1;
}


/* actual content */

.skl-postclick-final__shield-content {
  position: relative;

  z-index: 4;

  width: 100%;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  gap: 6px;

  padding-top: 4px;
}


.skl-postclick-final__shield-icon {
  width: 33px;
  height: 33px;

  display: flex;

  align-items: center;
  justify-content: center;

  margin-bottom: 1px;

  filter:
    drop-shadow(0 0 6px rgba(161,126,255,.78));
}


.skl-postclick-final__shield-icon svg {
  width: 31px;
  height: 31px;

  fill: none;

  stroke: #d4c6ff;

  stroke-width: 1.8;

  stroke-linecap: round;
  stroke-linejoin: round;
}


.skl-postclick-final__shield-content strong {
  display: block;

  margin: 0;

  color: #fff;

  font-size: 12.5px;
  line-height: 1.05;

  font-weight: 760;
}


.skl-postclick-final__shield-content span {
  display: block;

  margin: 0;

  color: rgba(232,225,255,.73);

  font-size: 8.7px;
  line-height: 1.18;
}


/* Previous normal card's arrow before the shield */
.skl-postclick-final__card:first-child::after {
  z-index: 20;
}


/* responsive */


@media (max-width: 950px) {

  .skl-postclick-final__inner {
    display: block;
  }

  .skl-postclick-final__head {
    display: block;
  }

  .skl-postclick-final__copy {
    max-width: 620px;
  }

  .skl-postclick-final h2 {
    max-width: 620px;
    font-size: 32px;
  }

  .skl-postclick-final__note {
    display: none;
  }

  .skl-postclick-final__flow {
    grid-template-columns: repeat(2,minmax(0,1fr));
    margin-top: 22px;
  }

  .skl-postclick-final__results {
    grid-template-columns: 1fr 1fr;
  }

  .skl-postclick-final__results::before,
  .skl-postclick-final__results::after {
    display: none;
  }

  .skl-postclick-final__card::after,
  .skl-postclick-final__shield-card::after {
    display: none;
  }

  .skl-postclick-final__shield-card {
    height: 132px;
    margin: 0;
  }
}


  .skl-postclick-final__shield-card::after {
    display: none;
  }

}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

    .skl-problem-ref-live {
        padding:
            50px
            18px
            58px !important;
    }

    .skl-problem-ref-live h2 {
        white-space:
            normal !important;

        font-size:
            34px !important;
    }

    .skl-problem-ref-live
    .skl-problem-note-ref {
        display:
            none !important;
    }

    .skl-problem-ref-live
    .skl-problem-cards-ref {
        grid-template-columns:
            repeat(2, minmax(0,1fr)) !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */


@media (max-width: 600px) {

  .skl-postclick-final {
    padding: 34px 14px 38px;
  }

  .skl-postclick-final h2 {
    font-size: 30px;
  }

  .skl-postclick-final__flow {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .skl-postclick-final__card {
    height: auto;
    min-height: 96px;
  }

  .skl-postclick-final__shield-card {
    height: 132px;
    margin: 0;
  }

  .skl-postclick-final__results {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .skl-postclick-final__results::before,
  .skl-postclick-final__results::after {
    display: none;
  }
}


    .skl-problem-ref-live h2 {
        font-size:
            30px !important;
    }

    .skl-problem-ref-live
    .skl-problem-cards-ref {
        grid-template-columns:
            1fr !important;

        gap:
            8px !important;
    }

    .skl-problem-ref-live
    .skl-problem-card-ref {
        min-height:
            0 !important;

        padding:
            15px !important;
    }

}



/*
  RETACH
  /shield/sklikivanie-yandex-direct/
  SECOND BLOCK ONLY
*/

/* =========================================================
   SECTION
   ========================================================= */

.skl-problem-ref-live {
    position: relative !important;
    display: block !important;
    overflow: hidden !important;

    box-sizing: border-box !important;

    padding: 28px 0 34px !important;

    background:
        radial-gradient(
            circle at 91% 0%,
            rgba(116, 86, 255, .075),
            transparent 30%
        ),
        #faf9fe !important;

    text-align: left !important;
}


/* =========================================================
   HEADER AREA
   same left edge as cards
   ========================================================= */

.skl-problem-headcopy-ref {
    box-sizing: border-box !important;

    width: min(1180px, calc(100% - 88px)) !important;
    max-width: none !important;

    margin: 0 auto !important;
    padding: 0 !important;

    text-align: left !important;
}


/* small badge */

.skl-problem-eyebrow-ref {
    display: inline-flex !important;
    align-items: center !important;

    width: max-content !important;

    margin: 0 0 7px !important;
    padding: 4px 8px !important;

    border: 1px solid rgba(108, 79, 238, .18) !important;
    border-radius: 999px !important;

    background: rgba(255, 255, 255, .82) !important;

    color: #725bdd !important;

    font-size: 9px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: .045em !important;

    text-align: left !important;
}

.skl-problem-eyebrow-ref::before {
    content: "✦";

    margin-right: 5px;

    color: #7357ff;

    font-size: 8px;
}


/* heading */

.skl-problem-ref-live h2 {
    display: block !important;

    width: auto !important;
    max-width: 880px !important;

    margin: 0 0 6px !important;
    padding: 0 !important;

    color: #171820 !important;

    font-size: 30px !important;
    line-height: 1.04 !important;

    font-weight: 760 !important;
    letter-spacing: -.04em !important;

    text-align: left !important;

    white-space: nowrap !important;
}


/* subtitle */

.skl-problem-lead-ref {
    display: block !important;

    max-width: 790px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #6b6f80 !important;

    font-size: 11.5px !important;
    line-height: 1.38 !important;
    font-weight: 500 !important;

    text-align: left !important;
}


/* =========================================================
   HANDWRITTEN NOTE
   ========================================================= */

.skl-problem-note-ref {
    position: absolute !important;

    top: 29px !important;
    right: 54px !important;

    width: 165px !important;
    max-width: 165px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #312c47 !important;

    font-family:
        "Segoe Print",
        "Comic Sans MS",
        cursive !important;

    font-size: 10.5px !important;
    line-height: 1.23 !important;
    font-weight: 700 !important;

    text-align: center !important;

    transform: rotate(-5deg) !important;
}

.skl-problem-note-ref::after {
    content: "↘";

    display: block;

    margin: -1px 0 0 64px;

    color: #312c47;

    font-size: 18px;
    line-height: 1;

    transform: rotate(8deg);
}


/* =========================================================
   CARDS ROW
   ========================================================= */

.skl-problem-cards-ref {
    box-sizing: border-box !important;

    width: min(1180px, calc(100% - 88px)) !important;
    max-width: none !important;

    margin: 18px auto 0 !important;
    padding: 0 !important;

    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 12px !important;

    align-items: stretch !important;
}


/* CARD */

.skl-problem-card-ref {
    position: relative !important;

    box-sizing: border-box !important;

    min-width: 0 !important;
    min-height: 150px !important;
    height: auto !important;

    margin: 0 !important;

    padding: 14px 14px 15px !important;

    border: 1px solid rgba(84, 70, 145, .075) !important;
    border-radius: 11px !important;

    background: rgba(255, 255, 255, .92) !important;

    box-shadow:
        0 5px 17px rgba(51, 42, 92, .04) !important;

    text-align: left !important;
}


/* remove 01 / 02 / 03 / 04 */

.skl-problem-num-ref {
    display: none !important;
}


/* =========================================================
   ICONS
   ========================================================= */

.skl-problem-icon-ref {
    display: block !important;

    box-sizing: border-box !important;

    width: 34px !important;
    height: 34px !important;

    margin: 0 0 11px !important;
    padding: 0 !important;

    border: 1px solid rgba(112, 82, 245, .10) !important;
    border-radius: 8px !important;

    background-color: #f3efff !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 21px 21px !important;

    color: transparent !important;

    font-size: 0 !important;
    line-height: 0 !important;

    box-shadow: none !important;
}


/* correct icon per card */

.skl-problem-card-ref:nth-child(1)
.skl-problem-icon-ref {
    background-image:
        url("/assets/shield/sklikivanie-yandex-direct/problem-bot.svg") !important;
}

.skl-problem-card-ref:nth-child(2)
.skl-problem-icon-ref {
    background-image:
        url("/assets/shield/sklikivanie-yandex-direct/problem-incognito.svg") !important;
}

.skl-problem-card-ref:nth-child(3)
.skl-problem-icon-ref {
    background-image:
        url("/assets/shield/sklikivanie-yandex-direct/problem-click.svg") !important;
}

.skl-problem-card-ref:nth-child(4)
.skl-problem-icon-ref {
    background-image:
        url("/assets/shield/sklikivanie-yandex-direct/problem-user.svg") !important;
}


/* hide anything old inside icon */

.skl-problem-icon-ref svg {
    display: none !important;
}


/* =========================================================
   CARD TYPOGRAPHY
   ========================================================= */

.skl-problem-card-ref h3 {
    margin: 0 0 5px !important;
    padding: 0 !important;

    color: #1b1c27 !important;

    font-size: 13px !important;
    line-height: 1.16 !important;

    font-weight: 760 !important;
    letter-spacing: -.018em !important;

    text-align: left !important;
}


.skl-problem-card-ref p {
    margin: 0 !important;
    padding: 0 !important;

    color: #7a7e8e !important;

    font-size: 10.5px !important;
    line-height: 1.38 !important;

    font-weight: 400 !important;

    text-align: left !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

    .skl-problem-headcopy-ref,
    .skl-problem-cards-ref {
        width: calc(100% - 36px) !important;
    }

    .skl-problem-ref-live h2 {
        white-space: normal !important;
    }

    .skl-problem-note-ref {
        display: none !important;
    }

    .skl-problem-cards-ref {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .skl-problem-ref-live {
        padding: 30px 0 38px !important;
    }

    .skl-problem-headcopy-ref,
    .skl-problem-cards-ref {
        width: calc(100% - 28px) !important;
    }

    .skl-problem-ref-live h2 {
        font-size: 28px !important;
    }

    .skl-problem-cards-ref {
        grid-template-columns: 1fr !important;

        gap: 8px !important;
    }

    .skl-problem-card-ref {
        min-height: 0 !important;
    }

}


/* =========================================================
   GEOMETRY FIX ONLY
   ========================================================= */

@media (min-width: 951px) {

  /* сам блок — сильно компактнее */
  .skl-problem-ref-live {
    padding-top: 22px !important;
    padding-bottom: 26px !important;
  }


  /*
   * Верхняя часть и карточки должны жить
   * в одной и той же ширине относительно viewport,
   * независимо от внутренних контейнеров старой секции.
   */
  .skl-problem-headcopy-ref,
  .skl-problem-cards-ref {
    box-sizing: border-box !important;

    width: min(1180px, calc(100vw - 88px)) !important;
    max-width: none !important;

    margin-left: 50% !important;
    margin-right: 0 !important;

    transform: translateX(-50%) !important;
  }


  /* верх секции */
  .skl-problem-headcopy-ref {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }


  /* карточки ближе к заголовку */
  .skl-problem-cards-ref {
    margin-top: 14px !important;
    margin-bottom: 0 !important;

    gap: 10px !important;
  }


  /* сами карточки ниже и плотнее */
  .skl-problem-card-ref {
    min-height: 136px !important;
    height: auto !important;

    padding-top: 12px !important;
    padding-right: 13px !important;
    padding-bottom: 13px !important;
    padding-left: 13px !important;
  }


  /* заметка — только в правом верхнем углу, выше карточек */
  .skl-problem-note-ref {
    top: 24px !important;
    right: max(48px, calc((100vw - 1180px) / 2 + 4px)) !important;

    width: 155px !important;
    max-width: 155px !important;

    z-index: 2 !important;
  }

}


/* планшет */
@media (min-width: 601px) and (max-width: 950px) {

  .skl-problem-ref-live {
    padding-top: 28px !important;
    padding-bottom: 34px !important;
  }

  .skl-problem-headcopy-ref,
  .skl-problem-cards-ref {
    width: calc(100vw - 36px) !important;

    margin-left: 50% !important;
    margin-right: 0 !important;

    transform: translateX(-50%) !important;
  }

  .skl-problem-cards-ref {
    margin-top: 16px !important;
    gap: 10px !important;
  }

  .skl-problem-card-ref {
    min-height: 135px !important;
  }

}


/* телефон */
@media (max-width: 600px) {

  .skl-problem-ref-live {
    padding-top: 26px !important;
    padding-bottom: 30px !important;
  }

  .skl-problem-headcopy-ref,
  .skl-problem-cards-ref {
    width: calc(100vw - 28px) !important;

    margin-left: 50% !important;
    margin-right: 0 !important;

    transform: translateX(-50%) !important;
  }

  .skl-problem-cards-ref {
    margin-top: 14px !important;
  }

  .skl-problem-card-ref {
    min-height: 0 !important;
  }

}





/* ТОЛЬКО геометрия второго блока */

@media (min-width: 951px) {

  .skl-problem-ref-live {
    padding-top: 18px !important;
    padding-bottom: 20px !important;
  }

  /* единая левая линия: плашка / H2 / текст / карточки */
  .skl-problem-headcopy-ref,
  .skl-problem-cards-ref {
    width: calc(100% - 88px) !important;
    max-width: 1180px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    transform: none !important;
  }

  .skl-problem-headcopy-ref {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* карточки гораздо ближе к тексту */
  .skl-problem-cards-ref {
    margin-top: 12px !important;
    margin-bottom: 0 !important;

    gap: 10px !important;
  }

  /* ниже сами карточки */
  .skl-problem-card-ref {
    min-height: 128px !important;
    height: 128px !important;

    padding: 11px 13px 12px !important;
  }

  /* подпись выше и не над карточкой */
  .skl-problem-note-ref {
    top: 20px !important;
    right: 48px !important;

    width: 150px !important;
    max-width: 150px !important;
  }

}


/* планшет */

@media (min-width: 601px) and (max-width: 950px) {

  .skl-problem-ref-live {
    padding-top: 24px !important;
    padding-bottom: 28px !important;
  }

  .skl-problem-headcopy-ref,
  .skl-problem-cards-ref {
    width: calc(100% - 36px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
  }

  .skl-problem-cards-ref {
    margin-top: 14px !important;
  }

}


/* mobile */

@media (max-width: 600px) {

  .skl-problem-ref-live {
    padding-top: 22px !important;
    padding-bottom: 26px !important;
  }

  .skl-problem-headcopy-ref,
  .skl-problem-cards-ref {
    width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
  }

  .skl-problem-cards-ref {
    margin-top: 12px !important;
  }

}





/* =========================================================
   ТОЛЬКО 3 ВЕЩИ:
   1. левый край шапки
   2. короткая заметка
   3. нормальные иконки
   ========================================================= */


/* ---------------------------------------------------------
   1. ПЛАШКА + H2 + ОПИСАНИЕ
   СТАВИМ НА ТУ ЖЕ ЛЕВУЮ ЛИНИЮ, ЧТО И КАРТОЧКИ
   --------------------------------------------------------- */

@media (min-width: 951px) {

  .skl-problem-headcopy-ref {
    position: relative !important;

    width: min(1180px, calc(100vw - 88px)) !important;
    max-width: none !important;

    /*
      Родитель этого блока уже центрирован и уже,
      поэтому выносим шапку на сетку viewport.
    */
    margin-left:
      calc((100% - 100vw) / 2 + 44px) !important;

    margin-right: 0 !important;

    transform: none !important;

    text-align: left !important;
  }

}


/* ---------------------------------------------------------
   2. УБИРАЕМ ДЛИННУЮ РУКОПИСНУЮ ПРОСТЫНЮ
   ОСТАВЛЯЕМ КОРОТКУЮ КАК В РЕФЕРЕНСЕ
   --------------------------------------------------------- */

.skl-problem-note-ref {
  top: 28px !important;
  right: 54px !important;

  width: 155px !important;
  max-width: 155px !important;

  font-size: 0 !important;
  line-height: 0 !important;

  text-align: center !important;

  pointer-events: none !important;
}

.skl-problem-note-ref::before {
  content:
    "Разные причины —\Aразный результат";

  display: block;

  white-space: pre-line;

  color: #302b46;

  font-family:
    "Segoe Print",
    "Comic Sans MS",
    cursive;

  font-size: 11px;
  line-height: 1.25;
  font-weight: 700;

  transform: rotate(-5deg);
}

.skl-problem-note-ref::after {
  content: "↘" !important;

  display: block !important;

  margin: 1px 0 0 66px !important;

  color: #302b46 !important;

  font-size: 18px !important;
  line-height: 1 !important;

  transform: rotate(5deg) !important;
}


/* ---------------------------------------------------------
   3. НОРМАЛЬНЫЕ ИКОНКИ
   --------------------------------------------------------- */

.skl-problem-icon-ref {
  width: 34px !important;
  height: 34px !important;

  display: block !important;

  border-radius: 8px !important;

  background-color: #f3efff !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 22px 22px !important;

  color: transparent !important;

  font-size: 0 !important;
  line-height: 0 !important;
}


/* скрываем мои старые внутренние значки */
.skl-problem-icon-ref svg,
.skl-problem-icon-ref img {
  display: none !important;
}


/* 01 — бот */

.skl-problem-card-ref:nth-child(1)
.skl-problem-icon-ref {
  background-image:
    url("/assets/shield/sklikivanie-yandex-direct/problem-bot-v3.svg?v=3") !important;
}


/* 02 — подозрительный пользователь */

.skl-problem-card-ref:nth-child(2)
.skl-problem-icon-ref {
  background-image:
    url("/assets/shield/sklikivanie-yandex-direct/problem-risk-v3.svg?v=3") !important;
}


/* 03 — пустой клик */

.skl-problem-card-ref:nth-child(3)
.skl-problem-icon-ref {
  background-image:
    url("/assets/shield/sklikivanie-yandex-direct/problem-click-v3.svg?v=3") !important;
}


/* 04 — реальный пользователь */

.skl-problem-card-ref:nth-child(4)
.skl-problem-icon-ref {
  background-image:
    url("/assets/shield/sklikivanie-yandex-direct/problem-user-v3.svg?v=3") !important;
}


/* планшет */

@media (max-width: 950px) {

  .skl-problem-note-ref {
    display: none !important;
  }

}




@media (min-width: 951px) {

  /* ШАГ 1: только плашка + заголовок + описание */

  .skl-problem-ref-live .skl-problem-eyebrow-ref,
  .skl-problem-ref-live h2,
  .skl-problem-ref-live .skl-problem-lead-ref {
    position: relative !important;
    left: -168px !important;
  }

}




.skl-problem-note-ref::before {
    font-size: 16px !important;
    line-height: 1.18 !important;
}

.skl-problem-note-ref::after {
    font-size: 26px !important;
}





/* В каждом контейнере иконки не должно быть старого background */
.skl-problem-ref-live
.skl-problem-card-ref
.skl-problem-icon-ref.skl-problem-icon-final {
    background-image: none !important;
}

/* никаких псевдо-иконок */
.skl-problem-icon-final::before,
.skl-problem-icon-final::after {
    content: none !important;
    display: none !important;
}





/* Сам длинный текст полностью прячем */
.skl-problem-note-ref {
    font-size: 0 !important;
    line-height: 0 !important;
}

/* Оставляем только короткую надпись */
.skl-problem-note-ref::before {
    content: "Разные причины —\Aразный результат" !important;

    display: block !important;
    white-space: pre-line !important;

    color: #302b46 !important;

    font-family:
        "Segoe Print",
        "Comic Sans MS",
        cursive !important;

    font-size: 16px !important;
    line-height: 1.18 !important;
    font-weight: 700 !important;

    text-align: center !important;
}

/* стрелка */
.skl-problem-note-ref::after {
    content: "↘" !important;

    display: block !important;

    margin: 2px 0 0 60px !important;

    color: #302b46 !important;

    font-size: 25px !important;
    line-height: 1 !important;
}



/* SKL_POSTCLICK_FINAL START */

.skl-postclick-final {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  padding: 31px 24px 29px;

  background:
    radial-gradient(circle at 72% 26%, rgba(108,76,230,.13), transparent 31%),
    linear-gradient(120deg,#090a11 0%,#11121d 48%,#090a11 100%);

  color:#fff;
}


/* фон строго от общего AI-блока */

.skl-postclick-final::before {
  content:"";

  position:absolute;
  z-index:-3;
  inset:auto 0 0;

  height:100%;

  background:
    url("/assets/shared/ai-results/mountains.webp")
    center bottom / cover no-repeat;

  opacity:.86;
  pointer-events:none;
}

.skl-postclick-final::after {
  content:"";

  position:absolute;
  z-index:-2;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(7,8,14,.96) 0%,
      rgba(8,9,15,.88) 32%,
      rgba(8,9,15,.43) 61%,
      rgba(8,9,15,.21) 100%
    );

  pointer-events:none;
}


/* основная сетка */

.skl-postclick-final__inner {
  position:relative;
  z-index:2;

  width:min(100%,1220px);
  margin:0 auto;

  display:grid;

  grid-template-columns:
    minmax(0,32%)
    minmax(0,68%);

  grid-template-rows:auto auto;

  column-gap:30px;
  align-items:start;
}

.skl-postclick-final__head {
  display:contents;
}


/* =========================
   ЛЕВАЯ ЧАСТЬ
   ========================= */

.skl-postclick-final__copy {
  grid-column:1;
  grid-row:1 / span 2;

  max-width:385px;
}

.skl-postclick-final__eyebrow {
  display:inline-flex;
  align-items:center;
  gap:5px;

  margin:0 0 7px;
  padding:4px 9px;

  border:1px solid rgba(159,137,255,.26);
  border-radius:999px;

  background:rgba(12,12,22,.48);

  color:#c6b8ff;

  font-size:9px;
  line-height:1;
  font-weight:700;
  letter-spacing:.055em;
}

.skl-postclick-final__eyebrow::before {
  content:"✦";
  color:#977eff;
}

.skl-postclick-final h2 {
  max-width:375px;

  margin:0 0 8px;

  color:#fff;

  font-size:31px;
  line-height:1.015;
  font-weight:750;
  letter-spacing:-.04em;
}

.skl-postclick-final__copy > p {
  max-width:365px;

  margin:0;

  color:rgba(255,255,255,.67);

  font-size:10.5px;
  line-height:1.42;
}


/* рукописная заметка */

.skl-postclick-final__note {
  position:absolute;

  top:-3px;
  right:4px;

  width:205px;

  margin:0;

  color:rgba(255,255,255,.88);

  font-family:
    "Segoe Print",
    "Comic Sans MS",
    cursive;

  font-size:9.5px;
  line-height:1.24;
  font-weight:700;

  text-align:center;

  transform:rotate(-4deg);
}

.skl-postclick-final__note::after {
  content:"↘";

  display:block;

  margin:0 0 0 82px;

  font-size:17px;
  line-height:1;
}


/* =========================
   РЯД ИЗ 5 ЭЛЕМЕНТОВ
   ========================= */

.skl-postclick-final__flow {
  grid-column:2;
  grid-row:1;

  display:grid;

  grid-template-columns:
    repeat(5,minmax(0,1fr));

  gap:8px;

  width:100%;

  margin:38px 0 11px;

  align-items:center;
}


/* обычные карточки */

.skl-postclick-final__card {
  position:relative;

  box-sizing:border-box;

  min-width:0;
  height:104px;

  display:flex;
  flex-direction:column;

  align-items:center;
  justify-content:center;

  gap:5px;

  padding:9px 7px;

  border:
    1px solid rgba(157,137,255,.18);

  border-radius:11px;

  background:
    linear-gradient(
      180deg,
      rgba(31,23,50,.62),
      rgba(16,13,27,.72)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 20px rgba(0,0,0,.10);

  backdrop-filter:blur(5px);

  text-align:center;
}


/* стрелочки между карточками */

.skl-postclick-final__card:not(:last-child)::after {
  content:"→";

  position:absolute;
  z-index:8;

  right:-8px;
  top:50%;

  transform:translate(50%,-50%);

  color:rgba(151,122,255,.86);

  font-size:11px;
  line-height:1;
}


/* красный клик */

.skl-postclick-final__card--click {
  border-color:rgba(255,94,111,.29);

  background:
    linear-gradient(
      180deg,
      rgba(102,33,48,.62),
      rgba(50,20,31,.70)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 0 16px rgba(236,75,100,.06);
}


/* =========================
   НАСТОЯЩИЙ ЩИТ
   ========================= */

.skl-postclick-final__shield-card {
  position:relative;
  z-index:6;

  height:132px;

  margin:-14px 0;

  display:flex;
  align-items:center;
  justify-content:center;

  background:transparent;
  border:0;

  overflow:visible;
}

.skl-postclick-final__shield-card::after {
  content:"→";

  position:absolute;
  z-index:20;

  right:-8px;
  top:50%;

  transform:translate(50%,-50%);

  color:#9c7fff;

  font-size:11px;
}


/* SVG щита */

.skl-postclick-final__shield-shape {
  position:absolute;

  z-index:0;

  inset:-2px -4px;

  width:calc(100% + 8px);
  height:calc(100% + 4px);

  overflow:visible;

  pointer-events:none;
}

.skl-postclick-final__shield-glow {
  fill:none;

  stroke:#865fff;

  stroke-width:3.2;

  opacity:.32;

  filter:url(#sklShieldGlow);
}

.skl-postclick-final__shield-body {
  fill:url(#sklShieldFill);
  stroke:url(#sklShieldStroke);

  stroke-width:1.6;
}

.skl-postclick-final__shield-inner {
  fill:none;

  stroke:rgba(255,255,255,.13);

  stroke-width:.8;
}


/* содержимое щита */

.skl-postclick-final__shield-content {
  position:relative;
  z-index:4;

  display:flex;
  flex-direction:column;

  align-items:center;
  justify-content:center;

  gap:4px;

  width:100%;
}

.skl-postclick-final__shield-icon {
  width:29px;
  height:29px;

  display:flex;
  align-items:center;
  justify-content:center;

  filter:
    drop-shadow(
      0 0 5px
      rgba(158,122,255,.60)
    );
}

.skl-postclick-final__shield-icon svg {
  width:27px;
  height:27px;

  fill:none;

  stroke:#d2c4ff;

  stroke-width:1.7;

  stroke-linecap:round;
  stroke-linejoin:round;
}

.skl-postclick-final__shield-content strong {
  margin:0;

  color:#fff;

  font-size:11.5px;
  line-height:1.05;
  font-weight:750;
}

.skl-postclick-final__shield-content span {
  margin:0;

  color:rgba(234,228,255,.69);

  font-size:7.8px;
  line-height:1.15;
}


/* =========================
   ИКОНКИ ОБЫЧНЫХ КАРТОЧЕК
   ========================= */

.skl-postclick-final__icon {
  width:31px;
  height:31px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:
    1px solid rgba(176,155,255,.16);

  border-radius:8px;

  background:
    rgba(151,118,255,.055);

  color:#b29cff;
}

.skl-postclick-final__icon svg {
  width:18px;
  height:18px;

  fill:none;

  stroke:#b29cff;

  stroke-width:1.65;

  stroke-linecap:round;
  stroke-linejoin:round;
}

.skl-postclick-final__icon--ya {
  color:#ff6675;

  font-size:16px;
  font-weight:800;
}


/* текст */

.skl-postclick-final__card > div:last-child {
  width:100%;
  text-align:center;
}

.skl-postclick-final__card strong {
  display:block;

  margin:0 0 2px;

  color:#fff;

  font-size:10.5px;
  line-height:1.1;
  font-weight:710;
}

.skl-postclick-final__card span {
  display:block;

  margin:0;

  color:rgba(255,255,255,.52);

  font-size:7.6px;
  line-height:1.16;
}


/* =========================
   НИЖНИЕ ПЛАШКИ
   ========================= */

.skl-postclick-final__results {
  grid-column:2;
  grid-row:2;

  position:relative;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:9px;

  width:100%;

  margin:0;
}

.skl-postclick-final__result {
  position:relative;
  z-index:2;

  box-sizing:border-box;

  min-height:40px;

  display:flex;

  align-items:center;

  gap:8px;

  padding:7px 10px;

  border-radius:9px;
}

.skl-postclick-final__result--bad {
  border:
    1px solid rgba(255,91,110,.17);

  background:
    linear-gradient(
      180deg,
      rgba(102,31,47,.34),
      rgba(55,21,32,.38)
    );
}

.skl-postclick-final__result--good {
  border:
    1px solid rgba(66,220,158,.17);

  background:
    linear-gradient(
      180deg,
      rgba(27,103,73,.34),
      rgba(17,57,45,.38)
    );
}

.skl-postclick-final__result-icon {
  flex:0 0 auto;

  width:20px;
  height:20px;

  display:flex;

  align-items:center;
  justify-content:center;

  border-radius:999px;

  font-size:11px;
  font-weight:800;
}

.skl-postclick-final__result--bad
.skl-postclick-final__result-icon {
  color:#ff6675;

  background:
    rgba(255,75,94,.15);
}

.skl-postclick-final__result--good
.skl-postclick-final__result-icon {
  color:#47dca3;

  background:
    rgba(58,220,157,.15);
}

.skl-postclick-final__result strong {
  display:block;

  margin:0 0 1px;

  color:#fff;

  font-size:9.5px;
  line-height:1.1;
}

.skl-postclick-final__result span {
  display:block;

  color:rgba(255,255,255,.54);

  font-size:7.4px;
  line-height:1.14;
}


/* =========================
   ТОНКИЕ СВЕТОВЫЕ ЛИНИИ
   ОТ ЩИТА К ДВУМ РЕЗУЛЬТАТАМ
   ========================= */

.skl-postclick-final__results::before,
.skl-postclick-final__results::after {
  content:"";

  position:absolute;
  z-index:1;

  top:-10px;

  height:1.5px;

  border-radius:999px;

  transform-origin:left center;

  pointer-events:none;
}


/* к красному исходу */

.skl-postclick-final__results::before {
  left:29%;

  width:18%;

  transform:rotate(11deg);

  background:
    linear-gradient(
      90deg,
      rgba(139,102,255,.92),
      rgba(255,80,105,.86)
    );

  box-shadow:
    0 0 7px
    rgba(229,83,137,.24);
}


/* к зелёному исходу */

.skl-postclick-final__results::after {
  left:31%;

  width:38%;

  transform:rotate(-7deg);

  background:
    linear-gradient(
      90deg,
      rgba(139,102,255,.92),
      rgba(54,218,159,.86)
    );

  box-shadow:
    0 0 7px
    rgba(65,219,161,.22);
}


/* TABLET */

@media (max-width:950px) {

  .skl-postclick-final__inner {
    display:block;
  }

  .skl-postclick-final__head {
    display:block;
  }

  .skl-postclick-final__copy {
    max-width:620px;
  }

  .skl-postclick-final h2 {
    max-width:620px;
  }

  .skl-postclick-final__note {
    display:none;
  }

  .skl-postclick-final__flow {
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    margin-top:22px;
  }

  .skl-postclick-final__shield-card {
    height:118px;

    margin:0;
  }

  .skl-postclick-final__card::after,
  .skl-postclick-final__shield-card::after,
  .skl-postclick-final__results::before,
  .skl-postclick-final__results::after {
    display:none;
  }
}


/* MOBILE */

@media (max-width:600px) {

  .skl-postclick-final {
    padding:30px 14px 34px;
  }

  .skl-postclick-final h2 {
    font-size:29px;
  }

  .skl-postclick-final__flow {
    grid-template-columns:1fr;

    gap:8px;
  }

  .skl-postclick-final__card {
    height:auto;

    min-height:88px;
  }

  .skl-postclick-final__shield-card {
    height:122px;
  }

  .skl-postclick-final__results {
    grid-template-columns:1fr;

    gap:8px;
  }
}

/* SKL_POSTCLICK_FINAL END */