/* SEO-текст под контентом страницы.
   Изолированный контейнер .dka-seo: все селекторы с префиксом, конфликтов
   со стилями темы нет. Оформление повторяет язык сайта — радиус 15px,
   тень как у .description/.faq, фирменный красный #ff3333.
   Стили лежат в одном файле, а не инлайном в каждой странице: страницы
   содержат только разметку. */

.dka-seo {
    color: #010101;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.55;
}

.dka-seo *,
.dka-seo *::before,
.dka-seo *::after {
    box-sizing: border-box;
}

/* Сброс маркеров, которые тема добавляет спискам внутри контента */
.dka-seo ul,
.dka-seo ol {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
}

.dka-seo ul > li::before,
.dka-seo ol > li::before,
.dka-seo ul > li::after,
.dka-seo ol > li::after {
    content: none !important;
    display: none !important;
}

.dka-seo p {
    margin: 0 0 14px;
}

.dka-seo a {
    color: #ff3333;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.dka-seo a:hover {
    text-decoration: none;
}

/* Заголовки блока */
.dka-seo h2 {
    margin: 32px 0 14px;
    color: #010101;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.dka-seo h2::after {
    content: "";
    display: block;
    width: 60px;
    height: 3px;
    margin-top: 8px;
    border-radius: 2px;
    background: #ff3333;
}

.dka-seo h2:first-child {
    margin-top: 0;
}

.dka-seo h3 {
    margin: 22px 0 10px;
    color: #010101;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.35;
}

/* Вводный абзац — ответ на интент страницы */
.dka-seo__intro {
    margin-bottom: 24px;
    padding: 16px 18px;
    border-left: 4px solid #ff3333;
    border-radius: 0 10px 10px 0;
    background: #F8F8F8;
}

.dka-seo__intro p:last-child {
    margin-bottom: 0;
}

/* Плитка быстрых ссылок */
.dka-seo__tags {
    margin: 0 0 26px;
    padding: 16px 18px;
    border: 1px solid #ffe0e0;
    border-radius: 15px;
    background: #FFF9F9;
}

.dka-seo__tags-title {
    margin: 0 0 12px;
    color: #010101;
    font-size: 15px;
    font-weight: 600;
}

.dka-seo__tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin: 0 !important;
    padding: 0 !important;
}

.dka-seo__tag {
    display: inline-block;
    padding: 7px 14px;
    border: 1px solid #ff3333;
    border-radius: 20px;
    background: #fff;
    color: #ff3333 !important;
    font-size: 13px;
    line-height: 1.2;
    text-decoration: none !important;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.dka-seo__tag:hover {
    background: #ff3333;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(255, 51, 51, .25);
}

/* Маркированный список точками.
   Селектор намеренно с `ul.` — иначе сброс маркеров выше (он специфичнее
   за счёт ul + li) перебивал бы эти правила и точки не рисовались. */
.dka-seo ul.dka-seo__list > li {
    position: relative;
    margin-bottom: 9px;
    padding-left: 22px;
}

.dka-seo ul.dka-seo__list > li::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 2px;
    top: 8px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ff3333;
}

/* Чек-лист */
.dka-seo ul.dka-seo__check > li {
    position: relative;
    margin-bottom: 9px;
    padding-left: 28px;
}

.dka-seo ul.dka-seo__check > li::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 2px;
    top: 4px;
    width: 16px;
    height: 16px;
    border-radius: 4px;
    background: #ff3333 url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3 3 7-7' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;
}

/* Списки без модификатора (контент из поля text-bottom и старые блоки).
   Сброс выше убирает маркеры и не возвращает их, из-за чего список шёл
   без точек. :not([class]) оставляет модификаторы .dka-seo__list / __check
   в приоритете. */
.dka-seo ul:not([class]) > li {
    position: relative;
    margin-bottom: 9px;
    padding-left: 22px;
}

.dka-seo ul:not([class]) > li::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 2px;
    top: 8px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ff3333;
}

.dka-seo ol:not([class]) {
    counter-reset: dka-ol;
}

.dka-seo ol:not([class]) > li {
    position: relative;
    margin-bottom: 9px;
    padding-left: 26px;
    counter-increment: dka-ol;
}

.dka-seo ol:not([class]) > li::before {
    content: counter(dka-ol) "." !important;
    display: block !important;
    position: absolute;
    left: 0;
    top: 0;
    color: #ff3333;
    font-weight: 600;
}

/* Таблица (на узких экранах — горизонтальная прокрутка) */
.dka-seo__scroll {
    margin: 0 0 20px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.dka-seo__table {
    width: 100%;
    min-width: 520px;
    border-collapse: collapse;
    font-size: 14px;
}

.dka-seo__table caption {
    margin-bottom: 8px;
    color: #7a7a7a;
    font-size: 13px;
    text-align: left;
}

.dka-seo__table th,
.dka-seo__table td {
    padding: 10px 12px;
    border: 1px solid #ececec;
    text-align: left;
    vertical-align: top;
}

.dka-seo__table th {
    background: #F8F8F8;
    font-weight: 600;
}

.dka-seo__table tbody tr:nth-child(even) td {
    background: #fcfcfc;
}

/* Важная плашка */
.dka-seo__note {
    margin: 20px 0;
    padding: 16px 18px;
    border-left: 4px solid #ff3333;
    border-radius: 0 10px 10px 0;
    background: #FFF0F0;
}

.dka-seo__note p:last-child {
    margin-bottom: 0;
}

.dka-seo__note strong {
    color: #ff3333;
}

/* Карточки-ссылки в конце блока */
.dka-seo__cards {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 8px;
}

.dka-seo__card {
    flex: 1 1 220px;
    min-width: 0;
    padding: 14px 16px;
    border-radius: 15px;
    background: #F8F8F8;
    text-decoration: none !important;
}

.dka-seo__card-title {
    display: block;
    margin-bottom: 4px;
    color: #ff3333;
    font-size: 15px;
    font-weight: 600;
}

.dka-seo__card-text {
    color: #4a4a4a;
    font-size: 13px;
    line-height: 1.45;
}

@media (min-width: 768px) {
    .dka-seo {
        font-size: 17px;
    }

    .dka-seo h2 {
        margin-top: 38px;
        font-size: 24px;
    }

    .dka-seo h3 {
        font-size: 19px;
    }

    .dka-seo__intro,
    .dka-seo__note {
        padding: 20px 22px;
    }

    .dka-seo__tag {
        font-size: 14px;
    }

    .dka-seo__table {
        font-size: 15px;
    }
}

@media (min-width: 1276px) {
    .dka-seo {
        font-size: 18px;
    }

    .dka-seo h2 {
        margin-top: 44px;
    }
}