/* =====================================================
   СТРАНИЦА БЛОГА ДЕТАЛЬНАЯ
   ===================================================== */
.blog-detail-page,
.blog-detail-page * {
    box-sizing: border-box;
}

.blog-detail-page {
    color: #252238;
    background: #fff;
}

.blog-detail-shell {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 110px 0 80px;
}

.blog-detail-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 22px;
    color: #9691a4;
    font-size: 13px;
    line-height: 1.5;
}

.blog-detail-breadcrumbs a {
    color: #805deb;
    text-decoration: none;
}

.blog-detail-breadcrumbs a:hover {
    color: #6844d1;
}

.blog-detail-breadcrumbs__separator {
    color: #c5c1cf;
}

.blog-detail-hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 28px;
    padding: 44px 48px;
    border: 1px solid #e7f3f8;
    border-radius: 28px;
    background:
        radial-gradient(circle at 88% 12%, rgba(79, 201, 227, .19), transparent 27%),
        linear-gradient(135deg, #effcff 0%, #f7f5ff 100%);
}

.blog-detail-hero::after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -110px;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: rgba(128, 93, 235, .08);
}

.blog-detail-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 930px;
}

.article__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 16px;
}

.article__blog-section {
    display: inline-flex;
    align-items: center;
    padding: 7px 13px;
    border-radius: 999px;
    background: rgba(128, 93, 235, .1);
    color: #805deb !important;
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
}

.share {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.bd-share {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.bd-share__label {
    color: #9691a4;
    font-size: 12px;
    font-weight: 650;
}

.bd-share__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border: 0;
    border-radius: 12px;
    color: #fff !important;
    font-family: inherit;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
    text-decoration: none !important;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}

.bd-share__button:hover {
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(44, 37, 74, .16);
}

.bd-share__button--vk {
    background: #2787f5;
}

.bd-share__button--tg {
    background: #2aabee;
}

.bd-share__button--max {
    background: linear-gradient(135deg, #8257ef, #a66cf2);
}

.bd-share__button.is-copied {
    min-width: 112px;
    background: #35a66f;
}

.article__title {
    max-width: 980px;
    margin: 0 0 18px;
    color: #252238;
    font-size: clamp(34px, 4.5vw, 58px);
    font-weight: 850;
    line-height: 1.08;
    letter-spacing: -.035em;
    overflow-wrap: anywhere;
}

.blog-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 16px;
    color: #9691a4;
    font-size: 13px;
}

.blog-detail-meta__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.article-blog__description {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    margin-bottom: 30px;
}

.article-blog__description-text {
    color: #625e70;
    font-size: 19px;
    line-height: 1.72;
}

.article-blog__figure {
    margin: 0;
}

.article-blog__img-wrapper {
    overflow: hidden;
    border-radius: 28px;
    background: #f5f3f8;
}

.article-blog__img-wrapper img {
    display: block;
    width: 100%;
    max-height: 620px;
    object-fit: cover;
}

.article-blog__figure-caption {
    margin-top: 8px;
    color: #9691a4;
    font-size: 12px;
    line-height: 1.5;
}

.article-blog__figure-caption:empty {
    display: none;
}

.blog-detail-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 28px;
    align-items: start;
}

.blog-detail-content-main {
    min-width: 0;
}

.table-of-contents {
    position: relative;
    grid-column: 2;
    grid-row: 1;
    align-self: stretch;
    min-width: 0;
    margin: 0;
}

.table-of-contents__sticky {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 17px;
    width: 100%;
    height: fit-content;
    overflow: visible;
    padding: 0;
    will-change: transform;
}

.table-of-contents__sticky.is-fixed {
    position: fixed;
    z-index: 3;
}

.table-of-contents__sticky.is-bottom {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
}

.blog-detail-content-grid,
.article-blog,
.article--item,
.article-blog .row {
    overflow: visible !important;
}

.bd-side-card {
    padding: 22px;
    border: 1px solid #ebe9f1;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(45, 38, 74, .05);
}

.table-of-contents__title {
    margin-bottom: 12px;
    color: #252238;
    font-size: 18px;
    font-weight: 820;
}

.table-of-contents__list {
    margin: 0;
    padding: 0 8px 0 0;
    max-height: 320px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(128, 93, 235, .45) rgba(128, 93, 235, .08);
    list-style: none;
}

.table-of-contents__list::-webkit-scrollbar {
    width: 7px;
}

.table-of-contents__list::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(128, 93, 235, .08);
}

.table-of-contents__list::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(128, 93, 235, .42);
}

.table-of-contents__list::-webkit-scrollbar-thumb:hover {
    background: rgba(128, 93, 235, .62);
}

.bd-side-card--toc {
    overflow: hidden;
}

.table-of-contents__item {
    margin: 0;
    border-bottom: 1px solid #ebe9f1;
}

.table-of-contents__item:last-child {
    border-bottom: 0;
}

.table-of-contents__item a {
    display: block;
    padding: 10px 0;
    color: #625e70;
    font-size: 13px;
    line-height: 1.45;
    text-decoration: none;
}

.table-of-contents__item a:hover {
    color: #805deb;
}

.table-of-contents__content-section-wrapper {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
}

.article-blog__section {
    margin: 0 0 34px;
}

.article-blog__h3-title {
    margin: 0 0 15px;
    color: #252238;
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 820;
    line-height: 1.22;
    letter-spacing: -.018em;
    scroll-margin-top: 110px;
}

.article-blog__text {
    color: #625e70;
    font-size: 18px;
    line-height: 1.78;
    overflow-wrap: anywhere;
}

.article-blog__text p {
    margin: 0 0 17px;
}

.article-blog__text ul,
.article-blog__text ol {
    margin: 0 0 20px;
    padding-left: 24px;
}

.article-blog__text li {
    margin-bottom: 8px;
}

.article-blog__text a {
    color: #805deb;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.article-blog__text blockquote {
    margin: 24px 0;
    padding: 20px 24px;
    border-left: 4px solid #4fc9e3;
    border-radius: 0 20px 20px 0;
    background: #eefaff;
    color: #252238;
}

.article-blog__text img {
    max-width: 100%;
    height: auto;
    border-radius: 16px;
}

.article-blog__text table {
    width: 100%;
    margin: 24px 0;
    border-collapse: collapse;
    font-size: 15px;
}

.article-blog__text th,
.article-blog__text td {
    padding: 13px 14px;
    border: 1px solid #ebe9f1;
    text-align: left;
    vertical-align: top;
}

.article-blog__text th {
    background: #f7f5ff;
    color: #252238;
}

.article-blog__cta-bottom,
.article-blog__section .contact-form,
.article-blog__section .blog-article-form {
    margin: 36px 0;
    overflow: hidden;
    border-radius: 28px;
}

.article-blog__faq {
    margin: 38px 0;
    padding: 32px 36px;
    border: 1px solid #ebe9f1;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 40px rgba(52, 43, 87, .08);
}

.article-blog__faq-title {
    margin: 0 0 18px;
    color: #252238;
    font-size: 30px;
    font-weight: 820;
}

.article-blog__faq-item {
    border-bottom: 1px solid #ebe9f1;
}

.article-blog__faq-item:last-child {
    border-bottom: 0;
}

.article-blog__faq-question {
    margin: 0;
    padding: 17px 0 8px;
    color: #252238;
    font-size: 19px;
    font-weight: 760;
    line-height: 1.45;
}

.article-blog__faq-answer {
    padding: 0 0 17px;
    color: #625e70;
    font-size: 16px;
    line-height: 1.7;
}

.article-blog__faq-answer p {
    margin: 0;
}

.article-blog__stats,
.article-blog__comments {
    margin-top: 34px;
    padding: 28px 32px;
    border: 1px solid #ebe9f1;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(45, 38, 74, .05);
}

.post-stats {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 24px;
}

.post-stats__author,
.post-stats__viewed {
    color: #9691a4;
    font-size: 14px;
}

.post-stats__author span {
    color: #252238;
    font-weight: 700;
}

.post-stats__viewed {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.post-stats__viewed svg {
    width: 18px;
    height: 18px;
}

.blog-recommendations {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto 38px;
}

.blog-recommendations__section-title {
    margin-bottom: 18px;
    color: #252238;
    font-size: 30px;
    font-weight: 820;
}

.blog-recommendations__wrapper {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.blog-recommendations__post {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid #ebe9f1;
    border-radius: 20px;
    background: #fff;
    color: #252238;
    text-decoration: none;
    box-shadow: 0 6px 22px rgba(45, 38, 74, .05);
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

.blog-recommendations__post:hover {
    color: #252238;
    border-color: rgba(128, 93, 235, .35);
    box-shadow: 0 14px 40px rgba(52, 43, 87, .08);
    transform: translateY(-4px);
}

.blog-recommendations__img {
    overflow: hidden;
    aspect-ratio: 4/3;
    background: #f5f3f8;
}

.blog-recommendations__img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-recommendations__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 17px 18px 18px;
}

.blog-recommendations__title {
    color: #252238;
    font-size: 16px;
    font-weight: 760;
    line-height: 1.42;
}

.blog-recommendations__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    margin-top: auto;
    padding-top: 15px;
    color: #9691a4;
    font-size: 12px;
    line-height: 1;
}

.blog-recommendations__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.blog-recommendations__placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(79, 201, 227, .20), rgba(128, 93, 235, .15));
    font-size: 38px;
}

.subscription {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto 80px;
    overflow: hidden;
    border-radius: 28px;
}

.article-blog .row {
    display: block !important;
    margin: 0 !important;
}

.article-blog [class*="offset-"],
.article-blog [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    flex: none !important;
}

.article,
.article-blog {
    margin: 0;
}

.video-block_blog {
    overflow: hidden;
    border-radius: 20px;
}


/* Лидогенерирующие блоки и расширенное оформление текста */
.article-blog__text>p:first-child {
    font-size: 20px;
    line-height: 1.72;
    color: #252238;
}

.article-blog__text strong {
    color: #252238;
    font-weight: 800;
}

.article-blog__text ul,
.article-blog__text ol {
    padding: 20px 24px 20px 48px;
    border: 1px solid #ebe9f1;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(79, 201, 227, .07), rgba(128, 93, 235, .05));
}

.article-blog__text li::marker {
    color: #805deb;
    font-weight: 800;
}

.article-blog__text h3,
.article-blog__text h4 {
    color: #252238;
    line-height: 1.3;
}

.article-blog__text code {
    padding: 2px 7px;
    border-radius: 7px;
    background: #f5f2ff;
    color: #6844d1;
}

.bd-side-offer {
    margin-top: 18px;
    padding: 20px;
    border-radius: 18px;
    color: #fff;
}

.bd-side-offer--purple {
    background: linear-gradient(145deg, #8f68ee, #6f4be2);
}

.bd-side-offer--coral {
    background: linear-gradient(145deg, #ff706b, #f34e5c);
}

.bd-side-offer__badge {
    display: inline-block;
    margin-bottom: 9px;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .17);
    font-size: 10px;
    font-weight: 800;
}

.bd-side-offer__title {
    margin: 0 0 8px;
    color: #fff;
    font-size: 20px;
    line-height: 1.2;
}

.bd-side-offer__text {
    margin: 0 0 14px;
    color: rgba(255, 255, 255, .88);
    font-size: 12px;
    line-height: 1.55;
}

.bd-side-offer__button {
    width: 100%;
    padding: 11px 13px;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: #805deb;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.bl-side-card__title {
    margin: 0 0 6px;
    color: #252238;
    font-size: 18px;
    font-weight: 820;
    line-height: 1.25;
}

.bl-side-card__subtitle {
    margin: 0 0 14px;
    color: #9691a4;
    font-size: 12px;
    line-height: 1.5;
}

.bl-start-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.bl-start-list li+li {
    border-top: 1px solid #ebe9f1;
}

.bl-start-list a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 0;
    color: #252238;
    text-decoration: none;
    transition: color .2s, transform .2s;
}

.bl-start-list a:hover {
    color: #805deb;
    transform: translateX(2px);
}

.bl-start-list__icon {
    display: grid;
    place-items: center;
    width: 31px;
    height: 31px;
    flex: 0 0 auto;
    border-radius: 10px;
    background: rgba(128, 93, 235, .09);
    font-size: 16px;
}

.bl-start-list__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.bl-start-list__name {
    color: inherit;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.35;
}

.bl-start-list__desc {
    color: #9691a4;
    font-size: 10px;
    line-height: 1.4;
}

.bd-mini-quiz {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 22px;
    margin: 46px 0 52px;
    padding: 34px;
    border: 1px solid rgba(128, 93, 235, .20);
    border-radius: 28px;
    background: linear-gradient(135deg, #eefcff 0%, #f7f3ff 100%);
    box-shadow: 0 16px 42px rgba(45, 38, 74, .08);
}

.bd-mini-quiz__icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(45, 38, 74, .08);
    font-size: 28px;
}

.bd-mini-quiz__eyebrow {
    color: #805deb;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .065em;
    text-transform: uppercase;
}

.bd-mini-quiz__title {
    margin: 9px 0 10px;
    color: #252238;
    font-size: 27px;
    line-height: 1.24;
}

.bd-mini-quiz__intro {
    margin: 0 0 22px;
    color: #625e70;
    font-size: 14px;
    line-height: 1.65;
}

.bd-mini-quiz__progress {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.bd-mini-quiz__progress-track {
    overflow: hidden;
    height: 7px;
    flex: 1;
    border-radius: 999px;
    background: rgba(128, 93, 235, .12);
}

.bd-mini-quiz__progress-bar {
    display: block;
    width: 20%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #805deb, #9b7bf0);
    transition: width .25s ease;
}

.bd-mini-quiz__progress-text {
    flex: 0 0 auto;
    color: #9691a4;
    font-size: 12px;
    font-weight: 750;
}

.bd-mini-quiz__question {
    display: none;
}

.bd-mini-quiz__question.is-active {
    display: block;
}

.bd-mini-quiz__question-title {
    margin: 0 0 14px;
    color: #252238;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.45;
}

.bd-mini-quiz__answers {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.bd-mini-quiz__answers button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #ebe9f1;
    border-radius: 15px;
    background: #fff;
    color: #252238;
    text-align: left;
    font-size: 14px;
    line-height: 1.45;
    cursor: pointer;
    transition: border-color .2s, transform .2s, box-shadow .2s;
}

.bd-mini-quiz__answers button::after {
    content: '→';
    color: #805deb;
    font-weight: 900;
}

.bd-mini-quiz__answers button:hover {
    border-color: #805deb;
    box-shadow: 0 8px 20px rgba(45, 38, 74, .07);
    transform: translateY(-2px);
}

.bd-mini-quiz__answers small {
    display: block;
    margin-top: 2px;
    color: #9691a4;
    font-size: 11px;
}

.bd-mini-quiz__result {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px;
    border: 1px solid rgba(128, 93, 235, .12);
    border-radius: 18px;
    background: #fff;
    color: #625e70;
    font-size: 14px;
    line-height: 1.65;
}

.bd-mini-quiz__result-badge {
    align-self: flex-start;
    padding: 6px 11px;
    border-radius: 999px;
    background: #f5f2ff;
    color: #805deb;
    font-size: 11px;
    font-weight: 850;
}

.bd-mini-quiz__result strong {
    color: #252238;
    font-size: 20px;
    line-height: 1.35;
}

.bd-mini-quiz__result button {
    align-self: flex-start;
    margin-top: 6px;
    padding: 13px 21px;
    border: 0;
    border-radius: 999px;
    background: #805deb;
    color: #fff;
    font-weight: 850;
    cursor: pointer;
}

.bd-final-cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    align-items: center;
    gap: 24px;
    padding: 36px 38px;
    background: linear-gradient(135deg, #805deb, #9b7bf0);
    color: #fff;
}

.bd-final-cta__eyebrow {
    color: rgba(255, 255, 255, .75);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.bd-final-cta__title {
    margin: 8px 0 10px;
    color: #fff;
    font-size: 30px;
    line-height: 1.2;
}

.bd-final-cta__text {
    margin: 0 0 15px;
    color: rgba(255, 255, 255, .88);
    line-height: 1.65;
}

.bd-final-cta__list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
    font-size: 13px;
}

.bd-final-cta__list li::before {
    content: '✓';
    margin-right: 7px;
    font-weight: 900;
}

.bd-final-cta__button {
    padding: 13px 21px;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: #805deb;
    font-weight: 850;
    cursor: pointer;
}

.bd-final-cta__visual {
    display: grid;
    place-items: center;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .13);
    font-size: 58px;
}

.post-stats__cta {
    margin-left: auto;
    padding: 11px 18px;
    border: 0;
    border-radius: 999px;
    background: #805deb;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.bd-subscribe-lead {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    padding: 34px 38px;
    border: 1px solid #ebe9f1;
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(79, 201, 227, .10), rgba(128, 93, 235, .07));
}

.bd-subscribe-lead__eyebrow {
    color: #805deb;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.bd-subscribe-lead h2 {
    margin: 7px 0 8px;
    color: #252238;
    font-size: 28px;
}

.bd-subscribe-lead p {
    margin: 0;
    color: #625e70;
    line-height: 1.6;
}

.bd-subscribe-lead__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    flex: 0 0 auto;
}

.bd-subscribe-lead__actions a,
.bd-subscribe-lead__actions button {
    padding: 12px 18px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.bd-subscribe-lead__actions a {
    border: 1px solid #ebe9f1;
    background: #fff;
    color: #252238;
}

.bd-subscribe-lead__actions button {
    border: 0;
    background: #805deb;
    color: #fff;
}

@media(max-width:920px) {
    .table-of-contents {
        position: static;
    }

    .table-of-contents__sticky {
        position: static;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: auto;
    }

    .article__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .share {
        width: 100%;
        justify-content: flex-start;
    }

    .bd-side-offer,
    .table-of-contents__sticky>.bd-side-card:not(:first-child) {
        display: none;
    }

    .table-of-contents__list {
        max-height: none;
        overflow-y: visible;
        padding-right: 0;
    }
}

@media(max-width:640px) {
    .bd-mini-quiz {
        grid-template-columns: 1fr;
        padding: 22px;
    }

    .bd-mini-quiz__answers {
        grid-template-columns: 1fr;
    }

    .bd-final-cta {
        grid-template-columns: 1fr;
        padding: 28px 23px;
    }

    .bd-final-cta__visual {
        display: none;
    }

    .bd-subscribe-lead {
        width: calc(100% - 30px);
        padding: 26px 22px;
        align-items: flex-start;
        flex-direction: column;
    }

    .post-stats__cta {
        margin-left: 0;
        width: 100%;
    }
}

@media (max-width: 920px) {
    .blog-detail-content-grid {
        grid-template-columns: 1fr;
    }

    .table-of-contents {
        position: static;
        grid-column: 1;
        grid-row: auto;
        order: -1;
    }

    .table-of-contents__content-section-wrapper {
        grid-column: 1;
        grid-row: auto;
    }

    .blog-recommendations__wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .blog-detail-shell {
        width: min(100% - 30px, 1180px);
        padding-top: 84px;
    }

    .blog-detail-hero {
        padding: 30px 24px;
    }

    .article__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .article__title {
        font-size: 34px;
    }

    .article-blog__description-text,
    .article-blog__text {
        font-size: 16px;
        line-height: 1.7;
    }

    .article-blog__faq,
    .article-blog__stats,
    .article-blog__comments {
        padding: 24px 20px;
    }

    .blog-recommendations,
    .subscription {
        width: min(100% - 30px, 1180px);
    }

    .blog-recommendations__wrapper {
        grid-template-columns: 1fr;
    }
}

/* Блок после статьи вместо старой формы комментариев */
.bd-after-article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 22px;
    margin: 34px 0 0;
    padding: 28px 30px;
    border: 1px solid #ebe9f1;
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(79, 201, 227, .11), rgba(128, 93, 235, .08));
    box-shadow: 0 10px 32px rgba(45, 38, 74, .055);
}

.bd-after-article__icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: #fff;
    font-size: 28px;
    box-shadow: 0 8px 24px rgba(45, 38, 74, .08);
}

.bd-after-article__eyebrow,
.bd-bottom-choice__eyebrow {
    display: block;
    margin-bottom: 6px;
    color: #805deb;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.bd-after-article h2 {
    margin: 0 0 8px;
    color: #252238;
    font-size: 24px;
    line-height: 1.2;
}

.bd-after-article p {
    margin: 0;
    color: #625e70;
    font-size: 14px;
    line-height: 1.6;
}

.bd-after-article__benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 14px;
    margin-top: 12px;
    color: #625e70;
    font-size: 12px;
    font-weight: 700;
}

.bd-after-article__actions {
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-width: 205px;
}

.bd-after-article__primary,
.bd-after-article__secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 11px 17px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.bd-after-article__primary {
    border: 0;
    background: #805deb;
    color: #fff;
}

.bd-after-article__secondary {
    border: 1px solid #ebe9f1;
    background: #fff;
    color: #252238;
}

/* Финальный выбор вместо широкого повторяющего CTA */
.bd-bottom-choice {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto 80px;
    padding: 34px 38px;
    border: 1px solid #ebe9f1;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 12px 38px rgba(45, 38, 74, .06);
}

.bd-bottom-choice__head {
    max-width: 760px;
    margin-bottom: 20px;
}

.bd-bottom-choice__head h2 {
    margin: 0 0 8px;
    color: #252238;
    font-size: 30px;
    line-height: 1.2;
}

.bd-bottom-choice__head p {
    margin: 0;
    color: #625e70;
    font-size: 15px;
    line-height: 1.6;
}

.bd-bottom-choice__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.bd-bottom-choice__card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-height: 110px;
    padding: 20px 22px;
    border: 1px solid #ebe9f1;
    border-radius: 20px;
    background: #fff;
    color: #252238;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

.bd-bottom-choice__card:hover {
    color: #252238;
    border-color: rgba(128, 93, 235, .32);
    box-shadow: 0 12px 30px rgba(45, 38, 74, .08);
    transform: translateY(-3px);
}

.bd-bottom-choice__card--accent {
    border: 0;
    background: linear-gradient(135deg, #805deb, #9b7bf0);
    color: #fff;
}

.bd-bottom-choice__card--accent:hover {
    color: #fff;
}

.bd-bottom-choice__icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    background: rgba(128, 93, 235, .09);
    font-size: 23px;
}

.bd-bottom-choice__card--accent .bd-bottom-choice__icon {
    background: rgba(255, 255, 255, .17);
}

.bd-bottom-choice__content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bd-bottom-choice__content strong {
    font-size: 16px;
    line-height: 1.3;
}

.bd-bottom-choice__content small {
    color: #625e70;
    font-size: 12px;
    line-height: 1.45;
}

.bd-bottom-choice__card--accent .bd-bottom-choice__content small {
    color: rgba(255, 255, 255, .82);
}

.bd-bottom-choice__arrow {
    font-size: 22px;
    font-weight: 800;
}

@media (max-width: 760px) {
    .bd-after-article {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 24px 22px;
    }

    .bd-after-article__actions {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
        flex-direction: row;
    }

    .bd-after-article__actions>* {
        flex: 1;
    }

    .bd-bottom-choice {
        width: calc(100% - 30px);
        padding: 28px 22px;
    }

    .bd-bottom-choice__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .bd-after-article {
        grid-template-columns: 1fr;
    }

    .bd-after-article__icon {
        width: 50px;
        height: 50px;
    }

    .bd-after-article__actions {
        flex-direction: column;
    }

    .bd-bottom-choice__head h2 {
        font-size: 25px;
    }
}


/* Компактный финальный лид-блок */
.bd-bottom-choice {
    width: min(1180px, calc(100% - 48px));
    margin: 42px auto 70px;
    padding: 34px 38px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    border: 1px solid rgba(128, 93, 235, .16);
    border-radius: 28px;
    background: linear-gradient(135deg, #eefcff 0%, #f7f3ff 100%);
    box-shadow: 0 14px 38px rgba(45, 38, 74, .06);
}

.bd-bottom-choice__main {
    max-width: 760px;
}

.bd-bottom-choice__eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #805deb;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.bd-bottom-choice h2 {
    margin: 0 0 9px;
    color: #252238;
    font-size: 28px;
    line-height: 1.22;
}

.bd-bottom-choice p {
    margin: 0;
    color: #625e70;
    font-size: 14px;
    line-height: 1.65;
}

.bd-bottom-choice__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.bd-bottom-choice__link,
.bd-bottom-choice__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 20px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
    cursor: pointer;
}

.bd-bottom-choice__link {
    border: 1px solid #ebe9f1;
    background: #fff;
    color: #252238;
}

.bd-bottom-choice__button {
    border: 0;
    background: #805deb;
    color: #fff;
}

@media(max-width:920px) {
    .bd-bottom-choice {
        grid-template-columns: 1fr;
        width: calc(100% - 30px);
        padding: 28px 24px;
    }

    .bd-bottom-choice__actions {
        justify-content: flex-start;
    }
}

@media(max-width:560px) {
    .bd-bottom-choice__actions {
        flex-direction: column;
    }

    .bd-bottom-choice__link,
    .bd-bottom-choice__button {
        width: 100%;
    }

    .bd-mini-quiz {
        grid-template-columns: 1fr;
        margin: 36px 0 42px;
        padding: 24px 20px;
    }

    .bd-mini-quiz__title {
        font-size: 23px;
    }
}


/* Статистика статьи: автор слева, просмотры и реальная отметка справа */
.post-stats {
    justify-content: space-between;
}

.post-stats__metrics {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 12px 18px;
    margin-left: auto;
}

.post-stats__like {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    max-width: 220px;
    min-height: 42px;
    overflow: hidden;
}

.post-stats__like>div,
.post-stats__like form {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.post-stats__like button,
.post-stats__like a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    max-height: 42px !important;
    margin: 0 !important;
    padding: 8px 14px !important;
    border: 1px solid rgba(128, 93, 235, .18) !important;
    border-radius: 999px !important;
    background: #f5f2ff !important;
    color: #252238 !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.post-stats__like button:hover,
.post-stats__like a:hover {
    border-color: rgba(128, 93, 235, .42) !important;
    background: #fff !important;
}

.post-stats__like svg,
.post-stats__like img {
    display: block !important;
    width: 19px !important;
    min-width: 19px !important;
    max-width: 19px !important;
    height: 19px !important;
    min-height: 19px !important;
    max-height: 19px !important;
    margin: 0 !important;
    object-fit: contain !important;
}

.post-stats__like span,
.post-stats__like div {
    font-size: 14px !important;
    line-height: 1.2 !important;
}

/* На детальной странице не оставляем серую техническую полосу перед футером */
.main.blog-detail-page,
.blog-detail-page,
.blog-detail-page+footer,
.blog-detail-page+.footer {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    background: #fff !important;
}

.main.blog-detail-page::after,
.blog-detail-page::after,
.blog-detail-page+footer::before,
.blog-detail-page+.footer::before {
    display: none !important;
    content: none !important;
}

.bd-bottom-choice {
    margin-bottom: 36px !important;
}

@media (max-width: 760px) {
    .post-stats {
        align-items: flex-start;
        flex-direction: column;
    }

    .post-stats__metrics {
        justify-content: flex-start;
        margin-left: 0;
    }
}


/* Реальный счётчик лайков статьи */
.post-stats__like {
    max-width: none;
    min-height: 42px;
    overflow: visible;
}

.article-like {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 14px;
    border: 1px solid rgba(250, 92, 92, .22);
    border-radius: 999px;
    background: #fff7f7;
    color: #252238;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
    line-height: 1;
    cursor: pointer;
    transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.article-like:hover {
    border-color: rgba(250, 92, 92, .48);
    background: #fff;
    box-shadow: 0 7px 18px rgba(250, 92, 92, .10);
    transform: translateY(-1px);
}

.article-like:focus-visible {
    outline: 2px solid #fa5c5c;
    outline-offset: 3px;
}

.article-like:disabled {
    opacity: .65;
    cursor: wait;
    transform: none;
}

.article-like__icon {
    display: inline-block;
    font-size: 19px;
    line-height: 1;
    transform-origin: center;
}

.article-like.is-liked {
    border-color: rgba(250, 92, 92, .34);
    background: #fff0f0;
}

.article-like.is-liked .article-like__icon {
    animation: articleLikeHeart .38s ease;
}

.article-like__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    padding: 0 7px;
    border-radius: 999px;
    background: rgba(250, 92, 92, .11);
    color: #d83f49;
    font-size: 12px;
    font-weight: 850;
}

@keyframes articleLikeHeart {
    0% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.34) rotate(-8deg);
    }

    100% {
        transform: scale(1);
    }
}

@media (max-width: 520px) {
    .article-like__label {
        display: none;
    }
}

/* =====================================================
   СТРАНИЦА БЛОГ ЛИСТИНГ
   ===================================================== */

.bl-page,
.bl-page * {
    box-sizing: border-box;
}

.bl-page {
    width: 100%;
    color: #252238;
    background: #fff !important;
}

.bl-page a {
    text-decoration: none;
}

.bl-shell {
    max-width: 1460px;
    margin: 0 auto;
    padding: 110px 34px 84px;
}

.bl-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    align-items: start;
}

.bl-main {
    min-width: 0;
    background: #fff !important;
}

.bl-shell,
.bl-layout,
#blArticles {
    background: #fff !important;
    overflow: visible !important;
}

/* Первый экран */
.bl-hero {
    position: relative;
    overflow: hidden;
    min-height: 370px;
    padding: 42px 48px 34px;
    border: 1px solid #e7f3f8;
    border-radius: 28px;
    background:
        radial-gradient(circle at 87% 18%, rgba(79, 201, 227, .18), transparent 26%),
        linear-gradient(135deg, #effcff 0%, #f7f5ff 100%);
}

.bl-hero::before {
    content: "";
    position: absolute;
    top: 45px;
    right: 90px;
    width: 80px;
    height: 54px;
    border-top: 3px dashed rgba(128, 93, 235, .35);
    border-radius: 50%;
    transform: rotate(-14deg);
}

.bl-hero::after {
    content: "✈";
    position: absolute;
    top: 22px;
    right: 42px;
    color: #fa5c5c;
    font-size: 45px;
    line-height: 1;
    transform: rotate(14deg);
}

.bl-hero__content {
    position: relative;
    z-index: 1;
    max-width: 900px;
}

.bl-hero__label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
    color: #805deb;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.bl-hero__label::before {
    content: "▣";
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border: 2px solid #4fc9e3;
    border-radius: 8px;
    color: #4fc9e3;
    font-size: 14px;
}

.bl-hero__title {
    max-width: 850px;
    margin: 0 0 17px;
    color: #252238;
    font-size: clamp(36px, 4vw, 56px);
    font-weight: 850;
    line-height: 1.08;
    letter-spacing: -.035em;
}

.bl-hero__sub {
    max-width: 920px;
    margin: 0 0 24px;
    color: #625e70;
    font-size: 16px;
    line-height: 1.72;
}

.bl-hero__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 25px;
}

.bl-hero__fact {
    padding: 7px 12px;
    border: 1px solid rgba(128, 93, 235, .13);
    border-radius: 999px;
    background: rgba(255, 255, 255, .7);
    color: #625e70;
    font-size: 12px;
    font-weight: 650;
}

.bl-search {
    display: flex;
    align-items: center;
    max-width: 820px;
    padding: 6px;
    border: 1px solid rgba(128, 93, 235, .16);
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(56, 48, 92, .08);
}

.bl-search__icon {
    width: 23px;
    height: 23px;
    margin-left: 15px;
    color: #8e89a1;
    flex: 0 0 auto;
}

.bl-search__input {
    min-width: 0;
    flex: 1;
    padding: 12px 13px;
    border: 0;
    outline: 0;
    color: #252238;
    background: transparent;
    font-size: 15px;
}

.bl-search__input::placeholder {
    color: #aaa6b5;
}

.bl-search__button {
    flex: 0 0 auto;
    padding: 12px 25px;
    border: 0;
    border-radius: 999px;
    background: #805deb;
    color: #fff;
    font-size: 14px;
    font-weight: 750;
    cursor: pointer;
    transition: background .2s, transform .2s;
}

.bl-search__button:hover {
    background: #6844d1;
    transform: translateY(-1px);
}

/* Рубрики */
.bl-categories {
    padding: 20px 0 36px;
    background: #fff;
}

.bl-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}

.bl-category {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 84px;
    padding: 14px;
    color: #252238;
    border: 1px solid #ebe9f1;
    border-radius: 15px;
    background: #fff;
    transition: transform .2s, border-color .2s, box-shadow .2s;
}

.bl-category:hover {
    color: #252238;
    border-color: rgba(128, 93, 235, .32);
    box-shadow: 0 14px 40px rgba(52, 43, 87, .08);
    transform: translateY(-3px);
}

.bl-category__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(79, 201, 227, .16), rgba(128, 93, 235, .12));
    font-size: 21px;
}

.bl-category__title {
    display: block;
    margin-bottom: 3px;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.28;
}

.bl-category__count {
    color: #9691a4;
    font-size: 10px;
}

/* SEO-блок */
.bl-intro {
    margin: 0 0 42px;
    padding: 30px 34px;
    border: 1px solid #eaf2f6;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(79, 201, 227, .10), rgba(128, 93, 235, .06));
}

.bl-kicker {
    margin: 0 0 7px;
    color: #805deb;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .065em;
    text-transform: uppercase;
}

.bl-intro h2 {
    margin: 0 0 10px;
    color: #252238;
    font-size: 28px;
    line-height: 1.25;
}

.bl-intro p:last-child {
    margin: 0;
    color: #625e70;
    font-size: 15px;
    line-height: 1.75;
}

/* Разделы статей */
.bl-results {
    display: none;
    margin: 0 0 26px;
    padding: 15px 18px;
    border-radius: 13px;
    background: rgba(128, 93, 235, .08);
    color: #252238;
    font-size: 14px;
}

.bl-results.is-visible {
    display: block;
}

.bl-section {
    margin: 0 0 54px;
    padding: 0 !important;
    border: 0 !important;
    background: #fff !important;
    scroll-margin-top: 100px;
}

.bl-section__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
    padding: 0;
    background: #fff !important;
}

.bl-section__title-wrap {
    min-width: 0;
}

.bl-section__eyebrow {
    display: inline-block;
    margin-bottom: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #f5f2ff;
    color: #9691a4;
    font-size: 11px;
}

.bl-section__title {
    margin: 0;
    color: #252238;
    font-size: 30px;
    font-weight: 820;
    line-height: 1.15;
}

.bl-section__all {
    flex: 0 0 auto;
    color: #805deb;
    font-size: 13px;
    font-weight: 750;
}

.bl-section__all:hover {
    color: #6844d1;
}

.bl-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    padding: 0;
    background: #fff !important;
}

.bl-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: inherit;
    border: 1px solid #ebe9f1;
    border-radius: 20px;
    background: #fff !important;
    box-shadow: 0 6px 22px rgba(45, 38, 74, .05);
    transition: transform .22s, box-shadow .22s, border-color .22s;
}

.bl-card:hover {
    color: inherit;
    border-color: rgba(128, 93, 235, .34);
    box-shadow: 0 14px 40px rgba(52, 43, 87, .08);
    transform: translateY(-5px);
}

.bl-card__img {
    overflow: hidden;
    aspect-ratio: 4/3;
    background: #f5f3f8;
}

.bl-card__img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .4s;
}

.bl-card:hover .bl-card__img img {
    transform: scale(1.045);
}

.bl-card__placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(79, 201, 227, .23), rgba(128, 93, 235, .17));
    font-size: 36px;
}

.bl-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 17px 18px 18px;
}

.bl-card__date {
    margin-bottom: 7px;
    color: #9691a4;
    font-size: 11px;
}

.bl-card__title {
    color: #252238;
    font-size: 16px;
    font-weight: 760;
    line-height: 1.42;
    transition: color .2s;
}

.bl-card:hover .bl-card__title {
    color: #805deb;
}

.bl-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.bl-card__meta {
    margin-top: auto;
    padding-top: 14px;
}

.bl-meta__item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #9691a4;
    font-size: 11px;
}

.bl-meta__item svg {
    width: 13px;
    height: 13px;
}

.bl-empty {
    display: none;
    padding: 44px 26px;
    text-align: center;
    border: 1px dashed #d9d5e4;
    border-radius: 20px;
    background: #fff;
}

.bl-empty.is-visible {
    display: block;
}

.bl-empty__title {
    margin-bottom: 8px;
    font-size: 20px;
    font-weight: 750;
}

.bl-empty__text {
    color: #625e70;
    font-size: 14px;
}

/* Финальный лид-блок */
.bl-lead {
    position: relative;
    overflow: hidden;
    margin-top: 10px;
    padding: 38px;
    border-radius: 28px;
    background: linear-gradient(135deg, #805deb, #9b7bf0);
    color: #fff;
}

.bl-lead::after {
    content: "";
    position: absolute;
    right: -85px;
    bottom: -125px;
    width: 230px;
    height: 230px;
    border-radius: 50%;
    background: rgba(79, 201, 227, .28);
}

.bl-lead__content {
    position: relative;
    z-index: 1;
    max-width: 670px;
}

.bl-lead__label {
    margin-bottom: 9px;
    color: rgba(255, 255, 255, .75);
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.bl-lead__title {
    margin: 0 0 10px;
    color: #fff;
    font-size: 30px;
    line-height: 1.18;
}

.bl-lead__text {
    margin: 0 0 20px;
    color: rgba(255, 255, 255, .87);
    font-size: 15px;
    line-height: 1.62;
}

.bl-lead__checks {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 16px;
    margin: 0 0 23px;
    padding: 0;
    list-style: none;
}

.bl-lead__checks li {
    font-size: 13px;
}

.bl-lead__checks li::before {
    content: "✓";
    margin-right: 7px;
    color: #fff;
    font-weight: 800;
}

.bl-btn-white {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 13px 24px;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: #805deb !important;
    font-size: 14px;
    font-weight: 750;
    cursor: pointer;
    transition: transform .2s, box-shadow .2s;
}

.bl-btn-white:hover {
    box-shadow: 0 12px 26px rgba(30, 22, 60, .18);
    transform: translateY(-2px);
}

/* Правая колонка: плавное сопровождение прокрутки без внутреннего скролла. */
.bl-sidebar {
    position: relative;
    align-self: stretch;
    min-width: 0;
}

.bl-sidebar__sticky {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 17px;
    width: 100%;
    height: fit-content;
    overflow: visible;
    will-change: transform;
}

.bl-sidebar__sticky.is-fixed {
    position: fixed;
    z-index: 1;
}

.bl-sidebar__sticky.is-bottom {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
}

.bl-side-card {
    padding: 22px;
    border: 1px solid #ebe9f1;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(45, 38, 74, .05);
}

.bl-side-card__title {
    margin: 0 0 14px;
    color: #252238;
    font-size: 18.5px;
    font-weight: 820;
}

.bl-side-card__subtitle {
    margin: -7px 0 15px;
    color: #9691a4;
    font-size: 12px;
    line-height: 1.5;
}

/* Демо-урок */
.bl-demo {
    padding: 27px 24px;
    border: 0;
    background: linear-gradient(145deg, #8f68ee, #6f4be2);
    color: #fff;
}

.bl-demo__badge {
    display: inline-block;
    margin-bottom: 12px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .17);
    color: #fff;
    font-size: 11px;
    font-weight: 750;
}

.bl-demo__title {
    margin: 0 0 10px;
    color: #fff;
    font-size: 27px;
    font-weight: 850;
    line-height: 1.1;
}

.bl-demo__text {
    margin: 0 0 16px;
    color: rgba(255, 255, 255, .86);
    font-size: 13px;
    line-height: 1.55;
}

.bl-demo__list {
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}

.bl-demo__list li {
    margin-bottom: 8px;
    font-size: 12px;
}

.bl-demo__list li::before {
    content: "✓";
    margin-right: 7px;
    font-weight: 900;
}

.bl-demo__button {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: 12px 17px;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: #805deb;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

/* Приведи друга */
.bl-promo {
    position: relative;
    overflow: hidden;
    min-height: 245px;
    padding: 25px 23px;
    border: 0;
    background: linear-gradient(145deg, #ff655f, #fb4f57);
    color: #fff;
}

.bl-promo::after {
    content: "👥";
    position: absolute;
    right: 13px;
    bottom: 9px;
    font-size: 48px;
    opacity: .9;
}

.bl-promo__badge {
    display: inline-block;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, .78);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.bl-promo__title {
    position: relative;
    z-index: 1;
    max-width: 230px;
    margin: 0 0 9px;
    color: #fff;
    font-size: 24px;
    line-height: 1.15;
}

.bl-promo__text {
    position: relative;
    z-index: 2;
    max-width: 210px;
    margin: 0 0 17px;
    color: rgba(255, 255, 255, .88);
    font-size: 12px;
    line-height: 1.55;
}

.bl-promo__link {
    position: relative;
    border: 0;
    cursor: pointer;
    z-index: 2;
    display: inline-flex;
    padding: 10px 16px;
    border-radius: 999px;
    background: #fff;
    color: #e54848 !important;
    font-size: 12px;
    font-weight: 800;
}

/* Популярное */
.bl-popular {
    display: flex;
    flex-direction: column;
}

.bl-popular__item {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 11px;
    padding: 12px 0;
    color: #252238;
    border-bottom: 1px solid #ebe9f1;
}

.bl-popular__item:first-of-type {
    padding-top: 0;
}

.bl-popular__item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.bl-popular__img {
    overflow: hidden;
    width: 58px;
    height: 58px;
    border-radius: 11px;
    background: #f6f4f9;
}

.bl-popular__img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.bl-popular__img-placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    background: rgba(79, 201, 227, .18);
}

.bl-popular__title {
    display: -webkit-box;
    overflow: hidden;
    color: #252238;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.38;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.bl-popular__item:hover .bl-popular__title {
    color: #805deb;
}

.bl-popular__views {
    display: block;
    margin-top: 4px;
    color: #9691a4;
    font-size: 10px;
}

.bl-start-list,
.bl-course-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.bl-start-list a,
.bl-course-list a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 0;
    color: #252238;
    font-size: 13px;
    border-bottom: 1px solid #ebe9f1;
}

.bl-start-list li:last-child a,
.bl-course-list li:last-child a {
    padding-bottom: 0;
    border-bottom: 0;
}

.bl-start-list a:hover,
.bl-course-list a:hover {
    color: #805deb;
}

.bl-start-list__icon {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    flex: 0 0 auto;
    border-radius: 9px;
    background: rgba(128, 93, 235, .09);
}

.bl-start-list__content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.bl-start-list__name {
    font-size: 16px;
    font-weight: 700;
    color: #2b2942;
    line-height: 1.35;
}

.bl-start-list__desc {
    font-size: 13px;
    color: #8b8ca3;
    line-height: 1.45;
}

.bl-sidebar .bl-popular__item:nth-child(n+4) {
    display: none;
}

/* FAQ в основной части страницы */
.bl-main-faq {
    margin: 8px 0 34px;
    padding: 34px 38px;
    border: 1px solid #ebe9f1;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 10px 34px rgba(45, 38, 74, .055);
}

.bl-main-faq__head {
    max-width: 760px;
    margin-bottom: 20px;
}

.bl-main-faq__title {
    margin: 0 0 9px;
    color: #252238;
    font-size: 30px;
    font-weight: 820;
    line-height: 1.18;
}

.bl-main-faq__subtitle {
    margin: 0;
    color: #9691a4;
    font-size: 17px;
    line-height: 1.6;
}

.bl-faq {
    display: flex;
    flex-direction: column;
}

.bl-faq--main {
    display: flex;
    flex-direction: column;
}

.bl-faq__item {
    border-bottom: 1px solid #ebe9f1;
}

.bl-faq__question {
    position: relative;
    width: 100%;
    padding: 16px 34px 16px 0;
    border: 0;
    background: transparent;
    color: #252238;
    text-align: left;
    font-size: 20px !important;
    font-weight: 760 !important;
    line-height: 1.45;
    cursor: pointer;
}

.bl-main-faq .bl-faq__question {
    font-size: 20px !important;
    font-weight: 760 !important;
}

.bl-faq__question::after {
    content: "+";
    position: absolute;
    top: 15px;
    right: 2px;
    color: #805deb;
    font-size: 28px;
    font-weight: 500;
    line-height: 1;
    transition: transform .2s;
}

.bl-faq__item.is-open .bl-faq__question::after {
    transform: rotate(45deg);
}

.bl-faq__answer {
    display: none;
    padding: 0 28px 16px 0;
    color: #625e70;
    font-size: 18px;
    line-height: 1.7;
}

.bl-faq__item.is-open .bl-faq__answer {
    display: block;
}

/* Адаптив */
@media (max-width: 1180px) {
    .bl-layout {
        grid-template-columns: minmax(0, 1fr) 290px;
    }

    .bl-category-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 980px) {
    .bl-shell {
        padding-top: 92px;
    }

    .bl-layout {
        grid-template-columns: 1fr;
    }

    .bl-sidebar {
        position: static;
        align-self: auto;
    }

    .bl-sidebar__sticky {
        position: static;
        top: auto;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        height: auto;
        overflow: visible;
    }

}

@media (max-width: 760px) {
    .bl-shell {
        padding: 80px 20px 65px;
    }

    .bl-hero {
        padding: 32px 25px;
    }

    .bl-hero::before,
    .bl-hero::after {
        display: none;
    }

    .bl-search {
        border-radius: 18px;
        flex-wrap: wrap;
    }

    .bl-search__input {
        min-width: calc(100% - 48px);
    }

    .bl-search__button {
        width: 100%;
    }

    .bl-category-grid,
    .bl-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bl-sidebar__sticky {
        grid-template-columns: 1fr;
    }

    .bl-lead {
        padding: 30px 25px;
    }
}


@media (max-width: 520px) {
    .bl-shell {
        padding-right: 15px;
        padding-left: 15px;
    }

    .bl-hero__title {
        font-size: 34px;
    }

    .bl-category-grid,
    .bl-grid {
        grid-template-columns: 1fr;
    }

    .bl-section__head {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .bl-intro {
        padding: 24px 20px;
    }

    .bl-main-faq {
        padding: 26px 20px;
    }

    .bl-main-faq__title {
        font-size: 25px;
    }

    .bl-faq__question {
        padding-top: 15px;
        padding-bottom: 15px;
        font-size: 17px !important;
    }

    .bl-faq__question::after {
        top: 14px;
        font-size: 24px;
    }

    .bl-faq__answer {
        padding-bottom: 15px;
        font-size: 16px;
        line-height: 1.65;
    }

    .bl-lead__title {
        font-size: 25px;
    }
}


/* =====================================================
   СТРАНИЦА НОВОСТИ ЛИСТИНГ
   ===================================================== */
.nw-page,
.nd-page {
    --nw-cyan: #4fc9e3;
    --nw-red: #fa5c5c;

    --nw-purple: #805deb;
    --nw-purple-dark: #6844d1;

    --nw-ink: #252238;
    --nw-text: #625e70;
    --nw-muted: #9691a4;

    --nw-border: #ebe9f1;

    --nw-soft-blue: #eefaff;
    --nw-soft-purple: #f5f2ff;

    --nw-radius-lg: 28px;
    --nw-radius: 20px;
    --nw-radius-sm: 15px;

    --nw-pill: 999px;

    --nw-shadow:
        0 14px 40px rgba(52, 43, 87, .08);
}


/* =====================================================
   БАЗОВЫЕ СТИЛИ
   ===================================================== */

.nw-page,
.nw-page * {
    box-sizing: border-box;
}

.nw-page {
    width: 100%;

    color: var(--nw-ink);

    background: #fff !important;
}

.nw-page a {
    text-decoration: none;
}

.nw-shell {
    max-width: 1460px;

    margin: 0 auto;

    padding:
        110px 34px 84px;
}

.nw-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr) 320px;

    gap: 24px;

    align-items: start;
}

.nw-main {
    min-width: 0;

    background: #fff !important;
}

.nw-shell,
.nw-layout,
.nw-main {
    background: #fff !important;

    overflow: visible !important;
}


/* =====================================================
   HERO
   ===================================================== */

.nw-hero {
    position: relative;

    overflow: hidden;

    min-height: 340px;

    margin-bottom: 28px;

    padding:
        42px 48px 38px;

    border:
        1px solid #e7f3f8;

    border-radius:
        var(--nw-radius-lg);

    background:
        radial-gradient(circle at 87% 18%,
            rgba(79, 201, 227, .18),
            transparent 26%),
        linear-gradient(135deg,
            #effcff 0%,
            #f7f5ff 100%);
}

.nw-hero::before {
    content: "";

    position: absolute;

    top: 52px;
    right: 92px;

    width: 84px;
    height: 56px;

    border-top:
        3px dashed rgba(128, 93, 235, .32);

    border-radius: 50%;

    transform:
        rotate(-14deg);
}

.nw-hero::after {
    content: "✦";

    position: absolute;

    top: 25px;
    right: 44px;

    color:
        var(--nw-red);

    font-size: 42px;

    line-height: 1;

    transform:
        rotate(12deg);
}

.nw-hero__content {
    position: relative;

    z-index: 1;

    max-width: 900px;
}

.nw-hero__label {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 14px;

    color:
        var(--nw-purple);

    font-size: 13px;

    font-weight: 800;

    letter-spacing:
        .055em;

    text-transform:
        uppercase;
}

.nw-hero__label::before {
    content: "▣";

    display: grid;

    width: 27px;
    height: 27px;

    place-items: center;

    border:
        2px solid var(--nw-cyan);

    border-radius: 8px;

    color:
        var(--nw-cyan);

    font-size: 14px;
}

.nw-hero__title {
    max-width: 850px;

    margin:
        0 0 17px;

    color:
        var(--nw-ink);

    font-size:
        clamp(38px,
            4vw,
            56px);

    font-weight: 850;

    line-height: 1.08;

    letter-spacing:
        -.035em;
}

.nw-hero__sub {
    max-width: 890px;

    margin:
        0 0 23px;

    color:
        var(--nw-text);

    font-size: 16px;

    line-height: 1.72;
}

.nw-hero__facts {
    display: flex;

    flex-wrap: wrap;

    gap: 9px;
}

.nw-hero__fact {
    padding:
        7px 12px;

    border:
        1px solid rgba(128, 93, 235, .13);

    border-radius:
        var(--nw-pill);

    background:
        rgba(255, 255, 255, .72);

    color:
        var(--nw-text);

    font-size: 12px;

    font-weight: 650;
}


/* =====================================================
   SEO-ТЕКСТ
   ===================================================== */

.nw-intro {
    margin:
        0 0 42px;

    padding:
        30px 34px;

    border:
        1px solid #eaf2f6;

    border-radius:
        var(--nw-radius);

    background:
        linear-gradient(135deg,
            rgba(79, 201, 227, .10),
            rgba(128, 93, 235, .06));
}

.nw-kicker {
    margin:
        0 0 7px;

    color:
        var(--nw-purple);

    font-size: 12px;

    font-weight: 800;

    letter-spacing:
        .065em;

    text-transform:
        uppercase;
}

.nw-intro h2 {
    margin:
        0 0 10px;

    color:
        var(--nw-ink);

    font-size: 28px;

    line-height: 1.25;
}

.nw-intro p:last-child {
    margin: 0;

    color:
        var(--nw-text);

    font-size: 15px;

    line-height: 1.75;
}


/* =====================================================
   ГЛАВНАЯ НОВОСТЬ
   ===================================================== */

.nw-featured {
    margin-bottom: 50px;
}

.nw-featured__head {
    display: flex;

    align-items: center;

    justify-content:
        space-between;

    gap: 20px;

    margin-bottom: 15px;
}

.nw-featured__eyebrow {
    display: inline-block;

    padding:
        5px 10px;

    border-radius:
        var(--nw-pill);

    background:
        var(--nw-soft-purple);

    color:
        var(--nw-purple);

    font-size: 11px;

    font-weight: 800;
}

.nw-featured__card {
    overflow: hidden;

    display: grid;

    grid-template-columns:
        minmax(0, 1.12fr) minmax(320px, .88fr);

    min-height: 400px;

    color: inherit;

    border:
        1px solid var(--nw-border);

    border-radius:
        var(--nw-radius-lg);

    background: #fff;

    box-shadow:
        0 7px 26px rgba(45, 38, 74, .05);

    transition:
        transform .22s,
        box-shadow .22s,
        border-color .22s;
}

.nw-featured__card:hover {
    color: inherit;

    border-color:
        rgba(128, 93, 235, .32);

    box-shadow:
        var(--nw-shadow);

    transform:
        translateY(-4px);
}

.nw-featured__image {
    overflow: hidden;

    min-height: 400px;

    background:
        #f5f3f8;
}

.nw-featured__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .45s;
}

.nw-featured__card:hover .nw-featured__image img {
    transform:
        scale(1.035);
}

.nw-featured__placeholder {
    display: grid;

    width: 100%;
    height: 100%;

    min-height: 400px;

    place-items: center;

    background:
        linear-gradient(135deg,
            rgba(79, 201, 227, .24),
            rgba(128, 93, 235, .18));

    font-size: 58px;
}

.nw-featured__body {
    display: flex;

    flex-direction: column;

    justify-content: center;

    padding:
        40px 38px;
}

.nw-date {
    display: block;

    margin-bottom: 9px;

    color:
        var(--nw-muted);

    font-size: 11px;
}

.nw-featured__title {
    margin:
        0 0 15px;

    color:
        var(--nw-ink);

    font-size:
        clamp(27px,
            2.8vw,
            37px);

    font-weight: 830;

    line-height: 1.18;
}

.nw-featured__text {
    margin:
        0 0 21px;

    color:
        var(--nw-text);

    font-size: 14px;

    line-height: 1.7;
}

.nw-more {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    width: fit-content;

    color:
        var(--nw-purple);

    font-size: 13px;

    font-weight: 800;
}

.nw-more::after {
    content: "→";

    transition:
        transform .2s;
}

.nw-featured__card:hover .nw-more::after {
    transform:
        translateX(4px);
}


/* =====================================================
   НОВОСТИ
   ===================================================== */

.nw-section {
    margin:
        0 0 54px;

    padding: 0 !important;

    border: 0 !important;

    background:
        #fff !important;
}

.nw-section__head {
    display: flex;

    align-items: flex-end;

    justify-content:
        space-between;

    gap: 20px;

    margin-bottom: 18px;
}

.nw-section__eyebrow {
    display: inline-block;

    margin-bottom: 5px;

    padding:
        5px 10px;

    border-radius:
        var(--nw-pill);

    background:
        var(--nw-soft-purple);

    color:
        var(--nw-muted);

    font-size: 11px;
}

.nw-section__title {
    margin: 0;

    color:
        var(--nw-ink);

    font-size: 30px;

    font-weight: 820;

    line-height: 1.15;
}

.nw-grid {
    display: grid;

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

    gap: 22px;
}

.nw-card {
    overflow: hidden;

    display: flex;

    flex-direction: column;

    min-width: 0;

    color: inherit;

    border:
        1px solid var(--nw-border);

    border-radius:
        var(--nw-radius);

    background:
        #fff !important;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .05);

    transition:
        transform .22s,
        box-shadow .22s,
        border-color .22s;
}

.nw-card:hover {
    color: inherit;

    border-color:
        rgba(128, 93, 235, .34);

    box-shadow:
        var(--nw-shadow);

    transform:
        translateY(-5px);
}

.nw-card__img {
    overflow: hidden;

    aspect-ratio:
        16 / 10;

    background:
        #f5f3f8;
}

.nw-card__img img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .4s;
}

.nw-card:hover .nw-card__img img {
    transform:
        scale(1.045);
}

.nw-card__placeholder {
    display: grid;

    width: 100%;
    height: 100%;

    place-items: center;

    background:
        linear-gradient(135deg,
            rgba(79, 201, 227, .23),
            rgba(128, 93, 235, .17));

    font-size: 36px;
}

.nw-card__body {
    display: flex;

    flex: 1;

    flex-direction: column;

    padding:
        20px 21px 22px;
}

.nw-card__title {
    margin:
        0 0 10px;

    color:
        var(--nw-ink);

    font-size: 18px;

    font-weight: 760;

    line-height: 1.42;

    transition:
        color .2s;
}

.nw-card:hover .nw-card__title {
    color:
        var(--nw-purple);
}

.nw-card__text {
    margin:
        0 0 15px;

    color:
        var(--nw-text);

    font-size: 14px;

    line-height: 1.65;
}

.nw-card__footer {
    margin-top: auto;

    padding-top: 4px;
}

.nw-card__more {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    color:
        var(--nw-purple);

    font-size: 12px;

    font-weight: 800;
}

.nw-card__more::after {
    content: "→";
}


/* =====================================================
   ПУСТО
   ===================================================== */

.nw-empty {
    padding:
        44px 26px;

    text-align: center;

    border:
        1px dashed #d9d5e4;

    border-radius:
        var(--nw-radius);

    background: #fff;
}

.nw-empty__title {
    margin:
        0 0 8px;

    font-size: 20px;

    font-weight: 750;
}

.nw-empty__text {
    margin: 0;

    color:
        var(--nw-text);

    font-size: 14px;
}


/* =====================================================
   ПАГИНАЦИЯ
   ===================================================== */

.nw-pagination {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    margin-top: 34px;

    padding:
        17px 19px;

    border:
        1px solid var(--nw-border);

    border-radius:
        var(--nw-radius);

    background: #fff;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .04);
}

.nw-pagination__info {
    color:
        var(--nw-muted);

    font-size: 12px;

    font-weight: 650;

    white-space: nowrap;
}

.nw-pagination__controls,
.nw-pagination__pages {
    display: flex;

    align-items: center;

    gap: 7px;
}

.nw-pagination__page,
.nw-pagination__arrow {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-width: 40px;
    height: 40px;

    padding:
        0 12px;

    border:
        1px solid var(--nw-border);

    border-radius: 12px;

    background: #fff;

    color:
        var(--nw-ink) !important;

    font-size: 13px;

    font-weight: 750;

    transition:
        transform .2s,
        border-color .2s,
        background .2s,
        color .2s,
        box-shadow .2s;
}

.nw-pagination__page:hover,
.nw-pagination__arrow:hover {
    border-color:
        rgba(128, 93, 235, .35);

    color:
        var(--nw-purple) !important;

    box-shadow:
        0 7px 18px rgba(45, 38, 74, .06);

    transform:
        translateY(-2px);
}

.nw-pagination__page.is-active {
    border-color:
        var(--nw-purple);

    background:
        var(--nw-purple);

    color: #fff !important;

    box-shadow:
        0 8px 18px rgba(128, 93, 235, .22);
}

.nw-pagination__arrow {
    gap: 7px;

    min-width: auto;
}

.nw-pagination__dots {
    padding:
        0 3px;

    color:
        var(--nw-muted);
}


/* =====================================================
   МЯГКИЙ CTA ВНУТРИ ЛЕНТЫ
   ===================================================== */

.nw-inline-cta {
    position: relative;

    overflow: hidden;

    display: grid;

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

    align-items: center;

    gap: 28px;

    margin:
        26px 0;

    padding:
        28px 30px;

    border:
        1px solid rgba(128, 93, 235, .14);

    border-radius:
        var(--nw-radius-lg);

    background:
        linear-gradient(135deg,
            rgba(79, 201, 227, .11),
            rgba(128, 93, 235, .08));
}

.nw-inline-cta::after {
    content: "";

    position: absolute;

    right: -60px;
    bottom: -85px;

    width: 170px;
    height: 170px;

    border-radius: 50%;

    background:
        rgba(128, 93, 235, .08);
}

.nw-inline-cta__content,
.nw-inline-cta__action {
    position: relative;

    z-index: 1;
}

.nw-inline-cta__label {
    display: inline-block;

    margin-bottom: 7px;

    color:
        var(--nw-purple);

    font-size: 11px;

    font-weight: 800;

    letter-spacing:
        .06em;

    text-transform: uppercase;
}

.nw-inline-cta__title {
    margin:
        0 0 8px;

    color:
        var(--nw-ink);

    font-size: 24px;

    font-weight: 820;

    line-height: 1.22;
}

.nw-inline-cta__text {
    max-width: 660px;

    margin: 0;

    color:
        var(--nw-text);

    font-size: 14px;

    line-height: 1.65;
}

.nw-inline-cta__button {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-height: 46px;

    padding:
        0 21px;

    border: 0;

    border-radius:
        var(--nw-pill);

    background:
        var(--nw-purple);

    color: #fff;

    font-size: 13px;

    font-weight: 800;

    cursor: pointer;

    white-space: nowrap;

    transition:
        transform .2s,
        box-shadow .2s,
        background .2s;
}

.nw-inline-cta__button:hover {
    background:
        var(--nw-purple-dark);

    box-shadow:
        0 10px 22px rgba(128, 93, 235, .24);

    transform:
        translateY(-2px);
}


/* =====================================================
   ФИНАЛЬНЫЙ CTA
   ===================================================== */

.nw-lead {
    position: relative;

    overflow: hidden;

    margin-top: 10px;

    padding: 38px;

    border-radius:
        var(--nw-radius-lg);

    background:
        linear-gradient(135deg,
            var(--nw-purple),
            #9b7bf0);

    color: #fff;
}

.nw-lead::after {
    content: "";

    position: absolute;

    right: -85px;
    bottom: -125px;

    width: 230px;
    height: 230px;

    border-radius: 50%;

    background:
        rgba(79, 201, 227, .28);
}

.nw-lead__content {
    position: relative;

    z-index: 1;

    max-width: 670px;
}

.nw-lead__label {
    margin-bottom: 9px;

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

    font-size: 12px;

    font-weight: 750;

    letter-spacing: .07em;

    text-transform:
        uppercase;
}

.nw-lead__title {
    margin:
        0 0 10px;

    color: #fff;

    font-size: 30px;

    line-height: 1.18;
}

.nw-lead__text {
    margin:
        0 0 20px;

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

    font-size: 15px;

    line-height: 1.62;
}

.nw-lead__checks {
    display: flex;

    flex-wrap: wrap;

    gap:
        9px 16px;

    margin:
        0 0 23px;

    padding: 0;

    list-style: none;
}

.nw-lead__checks li {
    font-size: 13px;
}

.nw-lead__checks li::before {
    content: "✓";

    margin-right: 7px;

    color: #fff;

    font-weight: 800;
}

.nw-btn-white {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding:
        13px 24px;

    border: 0;

    border-radius:
        var(--nw-pill);

    background: #fff;

    color:
        var(--nw-purple) !important;

    font-size: 14px;

    font-weight: 750;

    cursor: pointer;

    transition:
        transform .2s,
        box-shadow .2s;
}

.nw-btn-white:hover {
    box-shadow:
        0 12px 26px rgba(30, 22, 60, .18);

    transform:
        translateY(-2px);
}


/* =====================================================
   SIDEBAR
   ===================================================== */

.nw-sidebar {
    position: relative;

    align-self: stretch;

    min-width: 0;
}

.nw-sidebar__sticky {
    position: relative;

    display: flex;

    flex-direction: column;

    gap: 17px;

    width: 100%;

    height: fit-content;

    overflow: visible;

    will-change:
        transform;
}

.nw-sidebar__sticky.is-fixed {
    position: fixed;

    z-index: 1;
}

.nw-sidebar__sticky.is-bottom {
    position: absolute;

    right: 0;
    bottom: 0;
    left: 0;
}

.nw-side-card {
    padding: 22px;

    border:
        1px solid var(--nw-border);

    border-radius:
        var(--nw-radius);

    background: #fff;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .05);
}

.nw-side-card__title {
    margin:
        0 0 14px;

    color:
        var(--nw-ink);

    font-size: 18.5px;

    font-weight: 820;
}

.nw-side-card__subtitle {
    margin:
        -7px 0 15px;

    color:
        var(--nw-muted);

    font-size: 12px;

    line-height: 1.5;
}


/* =====================================================
   SIDEBAR — ДЕМО-УРОК
   ===================================================== */

.nw-demo {
    padding:
        27px 24px;

    border: 0;

    background:
        linear-gradient(145deg,
            #8f68ee,
            #6f4be2);

    color: #fff;
}

.nw-demo__badge {
    display: inline-block;

    margin-bottom: 12px;

    padding:
        5px 10px;

    border-radius:
        var(--nw-pill);

    background:
        rgba(255, 255, 255, .17);

    color: #fff;

    font-size: 11px;

    font-weight: 750;
}

.nw-demo__title {
    margin:
        0 0 10px;

    color: #fff;

    font-size: 27px;

    font-weight: 850;

    line-height: 1.1;
}

.nw-demo__text {
    margin:
        0 0 16px;

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

    font-size: 13px;

    line-height: 1.55;
}

.nw-demo__list {
    margin:
        0 0 20px;

    padding: 0;

    list-style: none;
}

.nw-demo__list li {
    margin-bottom: 8px;

    font-size: 12px;
}

.nw-demo__list li::before {
    content: "✓";

    margin-right: 7px;

    font-weight: 900;
}

.nw-demo__button {
    display: flex;

    width: 100%;

    align-items: center;

    justify-content: center;

    padding:
        12px 17px;

    border: 0;

    border-radius:
        var(--nw-pill);

    background: #fff;

    color:
        var(--nw-purple);

    font-size: 13px;

    font-weight: 800;

    cursor: pointer;
}


/* =====================================================
   SIDEBAR — АКТУАЛЬНОЕ
   ===================================================== */

.nw-latest {
    display: flex;

    flex-direction: column;
}

.nw-latest__item {
    display: grid;

    grid-template-columns:
        58px minmax(0, 1fr);

    gap: 11px;

    padding:
        12px 0;

    color:
        var(--nw-ink);

    border-bottom:
        1px solid var(--nw-border);
}

.nw-latest__item:first-child {
    padding-top: 0;
}

.nw-latest__item:last-child {
    padding-bottom: 0;

    border-bottom: 0;
}

.nw-latest__img {
    overflow: hidden;

    width: 58px;
    height: 58px;

    border-radius: 11px;

    background:
        #f6f4f9;
}

.nw-latest__img img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.nw-latest__img-placeholder {
    display: grid;

    width: 100%;
    height: 100%;

    place-items: center;

    background:
        rgba(79, 201, 227, .18);
}

.nw-latest__date {
    display: block;

    margin-bottom: 3px;

    color:
        var(--nw-muted);

    font-size: 10px;
}

.nw-latest__title {
    display: -webkit-box;

    overflow: hidden;

    color:
        var(--nw-ink);

    font-size: 12px;

    font-weight: 700;

    line-height: 1.38;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        3;
}

.nw-latest__item:hover .nw-latest__title {
    color:
        var(--nw-purple);
}


/* =====================================================
   SIDEBAR — ССЫЛКИ
   ===================================================== */

.nw-start-list {
    margin: 0;

    padding: 0;

    list-style: none;
}

.nw-start-list a {
    display: flex;

    align-items: center;

    gap: 9px;

    padding:
        10px 0;

    color:
        var(--nw-ink);

    border-bottom:
        1px solid var(--nw-border);
}

.nw-start-list li:last-child a {
    padding-bottom: 0;

    border-bottom: 0;
}

.nw-start-list a:hover {
    color:
        var(--nw-purple);
}

.nw-start-list__icon {
    display: grid;

    width: 34px;
    height: 34px;

    flex: 0 0 auto;

    place-items: center;

    border-radius: 10px;

    background:
        rgba(128, 93, 235, .09);

    font-size: 17px;
}

.nw-start-list__content {
    display: flex;

    min-width: 0;

    flex-direction: column;

    gap: 2px;
}

.nw-start-list__name {
    color:
        #2b2942;

    font-size: 14px;

    font-weight: 700;

    line-height: 1.35;
}

.nw-start-list__desc {
    color:
        #8b8ca3;

    font-size: 11px;

    line-height: 1.45;
}


/* =====================================================
   БЛОГ В SIDEBAR
   ===================================================== */

.nw-blog-link {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    color:
        var(--nw-purple);

    font-size: 13px;

    font-weight: 800;
}

.nw-blog-link:hover {
    color:
        var(--nw-purple-dark);
}


/* =====================================================
   АДАПТИВ
   ===================================================== */

@media (max-width: 1180px) {

    .nw-layout {
        grid-template-columns:
            minmax(0, 1fr) 290px;
    }

    .nw-grid {
        grid-template-columns:
            repeat(2,
                minmax(0, 1fr));
    }

}


@media (max-width: 980px) {

    .nw-shell {
        padding-top: 92px;
    }

    .nw-layout {
        grid-template-columns:
            1fr;
    }

    .nw-sidebar {
        position: static;

        align-self: auto;
    }

    .nw-sidebar__sticky {
        position: static;

        top: auto;

        display: grid;

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

        height: auto;

        overflow: visible;
    }

}


@media (max-width: 760px) {

    .nw-pagination {
        align-items: stretch;

        flex-direction: column;
    }

    .nw-pagination__info {
        text-align: center;
    }

    .nw-pagination__controls {
        justify-content: center;
    }

    .nw-inline-cta {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .nw-inline-cta__action {
        justify-self: start;
    }

    .nw-shell {
        padding:
            80px 20px 65px;
    }

    .nw-hero {
        min-height: 0;

        padding:
            32px 25px;
    }

    .nw-hero::before,
    .nw-hero::after {
        display: none;
    }

    .nw-featured__card {
        grid-template-columns:
            1fr;

        min-height: 0;
    }

    .nw-featured__image {
        min-height: 280px;

        aspect-ratio:
            16 / 10;
    }

    .nw-featured__placeholder {
        min-height: 280px;
    }

    .nw-featured__body {
        padding:
            29px 26px;
    }

    .nw-grid {
        grid-template-columns:
            repeat(2,
                minmax(0, 1fr));
    }

    .nw-sidebar__sticky {
        grid-template-columns:
            1fr;
    }

    .nw-lead {
        padding:
            30px 25px;
    }

}


@media (max-width: 520px) {

    .nw-pagination {
        padding:
            16px 14px;
    }

    .nw-pagination__page {
        min-width: 36px;
        height: 36px;

        padding:
            0 9px;
    }

    .nw-pagination__arrow {
        min-width: 36px;
        height: 36px;

        padding:
            0 10px;
    }

    .nw-pagination__arrow span {
        display: none;
    }

    .nw-inline-cta {
        padding:
            24px 21px;
    }

    .nw-inline-cta__title {
        font-size: 21px;
    }

    .nw-inline-cta__button {
        width: 100%;
    }

    .nw-shell {
        padding-right: 15px;

        padding-left: 15px;
    }

    .nw-hero__title {
        font-size: 34px;
    }

    .nw-grid {
        grid-template-columns:
            1fr;
    }

    .nw-section__head {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap: 8px;
    }

    .nw-section__title {
        font-size: 27px;
    }

    .nw-intro {
        padding:
            24px 20px;
    }

    .nw-intro h2 {
        font-size: 25px;
    }

    .nw-featured__title {
        font-size: 26px;
    }

    .nw-lead__title {
        font-size: 25px;
    }

}

/* =====================================================
   СТРАНИЦА НОВОСТИ ДЕТАЛЬНАЯ
   ===================================================== */

/* =====================================================
   БАЗА
   ===================================================== */

.nd-page,
.nd-page * {
    box-sizing: border-box;
}

.nd-page {
    position: relative;

    isolation: isolate;

    width: 100%;

    min-height: 100vh;

    color:
        #252238;

    background:
        #fff !important;
}

/**
 * Белая подложка на всю ширину окна.
 * Она перекрывает серый фон внешнего контейнера старого шаблона,
 * не затрагивая остальные страницы сайта.
 */
.nd-page::before {
    content: "";

    position: absolute;

    z-index: -1;

    top: 0;
    bottom: 0;

    left: 50%;

    width: 100vw;

    transform:
        translateX(-50%);

    background:
        #fff;
}

.nd-shell,
.nd-layout,
.nd-main,
.nd-sidebar {
    background:
        #fff !important;
}

.nd-page a {
    text-decoration: none;
}

/**
 * Если компонент всё ещё находится внутри старого .main,
 * убираем его серую подложку на детальной странице.
 */
.main:has(.nd-page) {
    background:
        #fff !important;
}

.nd-shell {
    width: 100%;

    max-width: 1240px;

    margin: 0 auto;

    padding:
        105px 34px 84px;
}


/* =====================================================
   ХЛЕБНЫЕ КРОШКИ
   ===================================================== */

.nd-breadcrumbs {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 7px;

    margin-bottom: 24px;

    color:
        #9691a4;

    font-size: 12px;
}

.nd-breadcrumbs a {
    color:
        #805deb;

    transition:
        color .2s;
}

.nd-breadcrumbs a:hover {
    color:
        #6844d1;
}

.nd-breadcrumbs__separator {
    color:
        #c7c4cf;
}


/* =====================================================
   HERO НОВОСТИ
   ===================================================== */

.nd-hero {
    position: relative;

    overflow: hidden;

    margin-bottom: 24px;

    padding:
        44px 50px;

    border:
        1px solid #e7f3f8;

    border-radius:
        28px;

    background:
        radial-gradient(circle at 88% 12%,
            rgba(79, 201, 227, .19),
            transparent 27%),
        linear-gradient(135deg,
            #effcff 0%,
            #f7f5ff 100%);
}

.nd-hero::after {
    content: "";

    position: absolute;

    right: -85px;
    bottom: -115px;

    width: 250px;
    height: 250px;

    border-radius: 50%;

    background:
        rgba(128, 93, 235, .08);
}

.nd-hero__inner {
    position: relative;

    z-index: 1;

    max-width: 930px;
}

.nd-hero__meta {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 10px;

    margin-bottom: 17px;
}

.nd-hero__label {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    padding:
        6px 11px;

    border-radius:
        999px;

    background:
        rgba(128, 93, 235, .1);

    color:
        #805deb;

    font-size: 11px;

    font-weight: 800;
}

.nd-hero__label::before {
    content: "●";

    color:
        #4fc9e3;

    font-size: 8px;
}

.nd-hero__date {
    color:
        #9691a4;

    font-size: 12px;
}

.nd-hero__title {
    max-width: 950px;

    margin:
        0 0 16px;

    color:
        #252238;

    font-size:
        clamp(34px,
            4vw,
            54px);

    font-weight: 850;

    line-height: 1.08;

    letter-spacing:
        -.035em;
}



/* =====================================================
   ОСНОВНАЯ СЕТКА
   ===================================================== */

.nd-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr) 300px;

    gap: 28px;

    align-items: start;
}

.nd-main {
    min-width: 0;
}


/* =====================================================
   ТЕКСТ НОВОСТИ
   ===================================================== */

.nd-content {
    padding:
        34px 38px;

    border:
        1px solid #ebe9f1;

    border-radius:
        28px;

    background: #fff;

    box-shadow:
        0 8px 30px rgba(45, 38, 74, .045);

    color:
        #625e70;

    font-size: 17px;

    line-height: 1.8;
}

.nd-content>*:first-child {
    margin-top: 0;
}

.nd-content>*:last-child {
    margin-bottom: 0;
}

.nd-content p {
    margin:
        0 0 19px;
}

.nd-content h2 {
    margin:
        34px 0 14px;

    color:
        #252238;

    font-size: 28px;

    line-height: 1.25;
}

.nd-content h3 {
    margin:
        27px 0 12px;

    color:
        #252238;

    font-size: 23px;

    line-height: 1.3;
}

.nd-content ul,
.nd-content ol {
    margin:
        18px 0;

    padding-left: 24px;
}

.nd-content li {
    margin-bottom: 8px;
}

.nd-content a {
    color:
        #805deb;

    text-decoration: underline;

    text-underline-offset: 3px;
}

.nd-content img {
    max-width: 100%;

    height: auto;

    border-radius:
        15px;
}

.nd-content blockquote {
    margin:
        25px 0;

    padding:
        18px 22px;

    border-left:
        4px solid #805deb;

    border-radius:
        0 14px 14px 0;

    background:
        #f5f2ff;

    color:
        #252238;
}


/* =====================================================
   МИНИ-ИНТЕРАКТИВ — ПОДБОР ЦЕЛИ
   ===================================================== */

.nd-choice {
    position: relative;

    overflow: hidden;

    margin-top: 30px;

    padding:
        28px 30px;

    border:
        1px solid rgba(128, 93, 235, .14);

    border-radius:
        28px;

    background:
        linear-gradient(135deg,
            rgba(79, 201, 227, .10),
            rgba(128, 93, 235, .07));
}

.nd-choice::after {
    content: "";

    position: absolute;

    right: -70px;
    bottom: -95px;

    width: 190px;
    height: 190px;

    border-radius: 50%;

    background:
        rgba(128, 93, 235, .07);

    pointer-events: none;
}

.nd-choice__head,
.nd-choice__options,
.nd-choice__result {
    position: relative;

    z-index: 1;
}

.nd-choice__eyebrow {
    display: inline-block;

    margin-bottom: 7px;

    color:
        #805deb;

    font-size: 11px;

    font-weight: 800;

    letter-spacing:
        .06em;

    text-transform: uppercase;
}

.nd-choice__title {
    margin:
        0 0 8px;

    color:
        #252238;

    font-size: 25px;

    font-weight: 820;

    line-height: 1.24;
}

.nd-choice__text {
    max-width: 700px;

    margin:
        0 0 19px;

    color:
        #625e70;

    font-size: 14px;

    line-height: 1.62;
}

.nd-choice__options {
    display: grid;

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

    gap: 12px;
}

.nd-choice__option {
    display: flex;

    min-width: 0;

    align-items: flex-start;

    gap: 11px;

    padding:
        15px;

    border:
        1px solid #ebe9f1;

    border-radius:
        16px;

    background:
        rgba(255, 255, 255, .9);

    color:
        #252238;

    text-align: left;

    cursor: pointer;

    transition:
        transform .2s,
        border-color .2s,
        box-shadow .2s,
        background .2s;
}

.nd-choice__option:hover {
    border-color:
        rgba(128, 93, 235, .30);

    box-shadow:
        0 8px 20px rgba(45, 38, 74, .06);

    transform:
        translateY(-2px);
}

.nd-choice__option.is-active {
    border-color:
        #805deb;

    background:
        #fff;

    box-shadow:
        0 10px 24px rgba(128, 93, 235, .12);
}

.nd-choice__icon {
    display: grid;

    width: 38px;
    height: 38px;

    flex: 0 0 auto;

    place-items: center;

    border-radius: 12px;

    background:
        #f5f2ff;

    font-size: 18px;
}

.nd-choice__option strong,
.nd-choice__option small {
    display: block;
}

.nd-choice__option strong {
    margin-bottom: 4px;

    color:
        #252238;

    font-size: 13px;

    font-weight: 760;

    line-height: 1.35;
}

.nd-choice__option small {
    color:
        #9691a4;

    font-size: 11px;

    line-height: 1.45;
}

.nd-choice__result {
    display: grid;

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

    align-items: center;

    gap: 20px;

    margin-top: 16px;

    padding:
        18px 20px;

    border:
        1px solid rgba(128, 93, 235, .14);

    border-radius: 16px;

    background: #fff;
}

.nd-choice__result[hidden] {
    display: none;
}

.nd-choice__result-label {
    display: inline-block;

    margin-bottom: 5px;

    color:
        #805deb;

    font-size: 10px;

    font-weight: 800;

    letter-spacing:
        .06em;

    text-transform: uppercase;
}

.nd-choice__result h3 {
    margin:
        0 0 5px;

    color:
        #252238;

    font-size: 18px;

    line-height: 1.3;
}

.nd-choice__result p {
    margin: 0;

    color:
        #625e70;

    font-size: 12px;

    line-height: 1.55;
}

.nd-choice__button {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-height: 44px;

    padding:
        0 20px;

    border: 0;

    border-radius:
        999px;

    background:
        #805deb;

    color: #fff;

    font-size: 12px;

    font-weight: 800;

    white-space: nowrap;

    cursor: pointer;

    transition:
        transform .2s,
        box-shadow .2s,
        background .2s;
}

.nd-choice__button:hover {
    background:
        #6844d1;

    box-shadow:
        0 10px 22px rgba(128, 93, 235, .23);

    transform:
        translateY(-2px);
}


/* =====================================================
   ПОДЕЛИТЬСЯ
   ===================================================== */

.nd-share {
    margin-top: 28px;

    padding:
        22px 24px;

    border:
        1px solid #ebe9f1;

    border-radius:
        20px;

    background: #fff;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .035);
}

.nd-share__head {
    margin-bottom: 16px;
}

.nd-share__title {
    margin:
        0 0 4px;

    color:
        #252238;

    font-size: 17px;

    font-weight: 800;

    line-height: 1.35;
}

.nd-share__text {
    margin: 0;

    color:
        #9691a4;

    font-size: 12px;

    line-height: 1.5;
}

.nd-share__buttons {
    display: flex;

    flex-wrap: wrap;

    gap: 12px;
}

.nd-share-button {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    min-height: 50px;

    padding:
        7px 15px 7px 7px;

    border:
        1px solid #ebe9f1;

    border-radius: 15px;

    background: #fff;

    color:
        #252238 !important;

    transition:
        transform .2s,
        border-color .2s,
        box-shadow .2s;
}

.nd-share-button:hover {
    border-color:
        rgba(128, 93, 235, .28);

    box-shadow:
        0 8px 20px rgba(45, 38, 74, .07);

    transform:
        translateY(-2px);
}

.nd-share-button__mark {
    display: grid;

    width: 38px;
    height: 38px;

    flex: 0 0 auto;

    place-items: center;

    border-radius: 12px;

    color: #fff;

    font-size: 12px;

    font-weight: 900;

    letter-spacing:
        -.02em;
}

.nd-share-button--vk .nd-share-button__mark {
    background:
        linear-gradient(135deg,
            #2787f5,
            #3995f7);
}

.nd-share-button--telegram .nd-share-button__mark {
    background:
        linear-gradient(135deg,
            #229ed9,
            #36b8ef);
}

.nd-share-button--max .nd-share-button__mark {
    background:
        linear-gradient(135deg,
            #7658ee,
            #9a59ef);
}

.nd-share-button__name {
    font-size: 13px;

    font-weight: 750;

    white-space: nowrap;
}


/* =====================================================
   ДОПОЛНИТЕЛЬНЫЕ ФОТО
   ===================================================== */

.nd-gallery {
    margin-top: 28px;
}

.nd-gallery__grid {
    display: grid;

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

    gap: 17px;
}

.nd-gallery__grid--single {
    grid-template-columns:
        minmax(0, 280px);
}

.nd-gallery__item {
    overflow: hidden;

    margin: 0;

    border:
        1px solid #ebe9f1;

    border-radius:
        20px;

    background: #fff;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .035);
}

.nd-gallery__image {
    overflow: hidden;

    aspect-ratio:
        4 / 3;

    background:
        #f5f3f8;
}

.nd-gallery__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .35s;
}

.nd-gallery__item:hover .nd-gallery__image img {
    transform:
        scale(1.035);
}

.nd-gallery__caption {
    padding:
        11px 13px;

    color:
        #625e70;

    font-size: 11px;

    line-height: 1.45;
}


/* =====================================================
   SIDEBAR
   ===================================================== */

.nd-sidebar {
    position: relative;

    min-width: 0;
}

.nd-sidebar__sticky {
    position: sticky;

    top: 95px;

    display: flex;

    flex-direction: column;

    gap: 17px;
}

.nd-side-card {
    padding: 22px;

    border:
        1px solid #ebe9f1;

    border-radius:
        20px;

    background: #fff;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .05);
}

.nd-side-card__title {
    margin:
        0 0 8px;

    color:
        #252238;

    font-size: 19px;

    font-weight: 820;
}

.nd-side-card__text {
    margin:
        0 0 16px;

    color:
        #625e70;

    font-size: 13px;

    line-height: 1.6;
}


/* =====================================================
   SIDEBAR CTA
   ===================================================== */

.nd-demo {
    border: 0;

    background:
        linear-gradient(145deg,
            #8f68ee,
            #6f4be2);

    color: #fff;
}

.nd-demo__badge {
    display: inline-block;

    margin-bottom: 11px;

    padding:
        5px 10px;

    border-radius:
        999px;

    background:
        rgba(255, 255, 255, .16);

    color: #fff;

    font-size: 11px;

    font-weight: 750;
}

.nd-demo__title {
    margin:
        0 0 10px;

    color: #fff;

    font-size: 25px;

    line-height: 1.13;
}

.nd-demo__text {
    margin:
        0 0 17px;

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

    font-size: 13px;

    line-height: 1.58;
}

.nd-demo__button {
    display: flex;

    width: 100%;

    align-items: center;

    justify-content: center;

    padding:
        12px 17px;

    border: 0;

    border-radius:
        999px;

    background: #fff;

    color:
        #805deb;

    font-size: 13px;

    font-weight: 800;

    cursor: pointer;
}


/* =====================================================
   SIDEBAR LINKS
   ===================================================== */

.nd-side-links {
    margin: 0;

    padding: 0;

    list-style: none;
}

.nd-side-links a {
    display: block;

    padding:
        10px 0;

    border-bottom:
        1px solid #ebe9f1;

    color:
        #252238;

    font-size: 13px;

    font-weight: 690;

    line-height: 1.4;
}

.nd-side-links li:last-child a {
    border-bottom: 0;

    padding-bottom: 0;
}

.nd-side-links a:hover {
    color:
        #805deb;
}


/* =====================================================
   ДРУГИЕ НОВОСТИ
   ===================================================== */

.nd-related {
    margin-top: 55px;
}

.nd-related__head {
    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 18px;
}

.nd-related__eyebrow {
    display: inline-block;

    margin-bottom: 5px;

    color:
        #805deb;

    font-size: 12px;

    font-weight: 800;

    text-transform: uppercase;
}

.nd-related__title {
    margin: 0;

    color:
        #252238;

    font-size: 30px;

    line-height: 1.18;
}

.nd-related__all {
    color:
        #805deb;

    font-size: 13px;

    font-weight: 800;
}

.nd-related__grid {
    display: grid;

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

    gap: 22px;
}

.nd-related-card {
    overflow: hidden;

    display: flex;

    flex-direction: column;

    min-width: 0;

    border:
        1px solid #ebe9f1;

    border-radius:
        20px;

    background: #fff;

    color: inherit;

    box-shadow:
        0 6px 22px rgba(45, 38, 74, .05);

    transition:
        transform .22s,
        box-shadow .22s,
        border-color .22s;
}

.nd-related-card:hover {
    color: inherit;

    border-color:
        rgba(128, 93, 235, .32);

    box-shadow:
        0 14px 40px rgba(52, 43, 87, .08);

    transform:
        translateY(-4px);
}

.nd-related-card__image {
    overflow: hidden;

    aspect-ratio:
        16 / 10;

    background:
        #f5f3f8;
}

.nd-related-card__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.nd-related-card__placeholder {
    display: grid;

    width: 100%;
    height: 100%;

    place-items: center;

    background:
        linear-gradient(135deg,
            rgba(79, 201, 227, .22),
            rgba(128, 93, 235, .16));

    font-size: 34px;
}

.nd-related-card__body {
    display: flex;

    flex: 1;

    flex-direction: column;

    padding:
        17px 18px;
}

.nd-related-card__date {
    margin-bottom: 7px;

    color:
        #9691a4;

    font-size: 10px;
}

.nd-related-card__title {
    margin:
        0 0 9px;

    color:
        #252238;

    font-size: 16px;

    font-weight: 760;

    line-height: 1.4;
}

.nd-related-card__text {
    margin: 0;

    color:
        #625e70;

    font-size: 12px;

    line-height: 1.55;
}


/* =====================================================
   НИЖНЯЯ НАВИГАЦИЯ
   ===================================================== */

.nd-back {
    display: flex;

    justify-content: center;

    margin-top: 40px;
}

.nd-back__link {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding:
        13px 23px;

    border:
        1px solid #ebe9f1;

    border-radius:
        999px;

    color:
        #805deb;

    background: #fff;

    font-size: 13px;

    font-weight: 800;

    transition:
        transform .2s,
        border-color .2s,
        box-shadow .2s;
}

.nd-back__link:hover {
    border-color:
        rgba(128, 93, 235, .3);

    box-shadow:
        0 14px 40px rgba(52, 43, 87, .08);

    transform:
        translateY(-2px);
}


/* =====================================================
   АДАПТИВ
   ===================================================== */

@media (max-width: 980px) {

    .nd-shell {
        padding-top: 90px;
    }

    .nd-layout {
        grid-template-columns:
            1fr;
    }

    .nd-sidebar__sticky {
        position: static;

        display: grid;

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

}


@media (max-width: 760px) {

    .nd-choice__options {
        grid-template-columns:
            1fr;
    }

    .nd-choice__result {
        grid-template-columns:
            1fr;
    }

    .nd-choice__button {
        justify-self: start;
    }



    .nd-shell {
        padding:
            80px 20px 65px;
    }

    .nd-hero {
        padding:
            33px 26px;
    }

    .nd-content {
        padding:
            28px 25px;

        font-size: 16px;
    }

    .nd-gallery__grid {
        grid-template-columns:
            repeat(2,
                minmax(0, 1fr));
    }

    .nd-gallery__grid--single {
        grid-template-columns:
            minmax(0, 260px);
    }

    .nd-related__grid {
        grid-template-columns:
            repeat(2,
                minmax(0, 1fr));
    }

    .nd-sidebar__sticky {
        grid-template-columns:
            1fr;
    }

}


@media (max-width: 520px) {

    .nd-choice {
        padding:
            24px 20px;
    }

    .nd-choice__title {
        font-size: 22px;
    }

    .nd-choice__button {
        width: 100%;
    }



    .nd-share {
        padding:
            20px 18px;
    }

    .nd-share__buttons {
        display: grid;

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

        gap: 9px;
    }

    .nd-share-button {
        justify-content: center;

        min-width: 0;

        padding: 7px;
    }

    .nd-share-button__name {
        display: none;
    }

    .nd-share-button__mark {
        width: 42px;
        height: 42px;
    }


    .nd-shell {
        padding-right: 15px;

        padding-left: 15px;
    }

    .nd-hero__title {
        font-size: 33px;
    }

    .nd-related__grid {
        grid-template-columns:
            1fr;
    }

    .nd-gallery__grid,
    .nd-gallery__grid--single {
        grid-template-columns:
            1fr;
    }

    .nd-related__head {
        align-items: flex-start;

        flex-direction: column;

        gap: 8px;
    }

    .nd-related__title {
        font-size: 26px;
    }
}