.dhero {
    margin: clamp(40px, 4vw, 102px) 0 clamp(32px, 6vw, 60px);
    overflow-x: clip;
}

.dhero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
    gap: clamp(24px, 5vw, 80px);
}

.dhero__title {
    position: relative;
    margin-bottom: clamp(20px, 2.5vw, 24px);
    font-weight: 700;
    line-height: 1;
    max-width: 750px;
    font-size: clamp(36px, 5vw, 72px);
}

.dhero__typed {
    color: var(--color-accent);
}

.dhero__typed .Typewriter__cursor {
    color: var(--color-accent);
    font-weight: 400;
}

.dhero__title-after {
    position: static;
    display: block;
}

.dhero__title-after span {
    position: relative;
}

.dhero__title-after span:after {
    content: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTk2IiBoZWlnaHQ9IjE5IiB2aWV3Qm94PSIwIDAgMTk2IDE5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMiAxN0MzLjY3MjI2IDE2LjA3MzcgNS4zNDQ1MyAxNS4xNDc1IDkuNzM2NSAxMy4wNDY1QzE0LjEyODUgMTAuOTQ1NSAyMS4xODk1IDcuNjk3ODYgMjUuODE0OCA1Ljc3OTIxQzMyLjMzOCAzLjA3MzI0IDM1LjkxOTYgMi42ODE3OCAzOC4wMDc4IDIuNjMzNjhDNDEuNTM1NiAyLjU1MjQxIDMwLjc2NjYgMTEuNzY5NyAzMC42MDk4IDEzLjE1MzNDMzAuNTIyNSAxMy45MjQyIDMyLjc1NTYgMTMuNzIzMiAzOC42MDg0IDEyLjI3ODRDNDQuNDYxMiAxMC44MzM2IDU0LjQ2MzQgNy44NjcwNCA1OS41OTA2IDYuNjQxOTFDNjQuNzE3OCA1LjQxNjc4IDY0LjY2NyA2LjAyMyA2My40MzI0IDguMTY2MUM2Mi4xOTc5IDEwLjMwOTIgNTkuNzgxMiAxMy45NzA4IDU5Ljg0NjcgMTUuMDQ3N0M1OS45MTIzIDE2LjEyNDYgNjIuNTMzMyAxNC41MDU5IDY1Ljk0NTMgMTMuMDQyMkM2OS4zNTczIDExLjU3ODQgNzMuNDgwOCAxMC4zMTg3IDkzLjk5NTMgOC40MDkxQzExNC41MSA2LjQ5OTQ5IDE1MS4yOSAzLjk3ODE1IDE3MS4wNDggMi44MjE0MUMxOTAuODA1IDEuNjY0NjggMTkyLjQyNiAxLjk0ODk0IDE5NCAyLjM1NDEiIHN0cm9rZT0iI0ZGNjgwOSIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPC9zdmc+');
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translateY(30%) scale(0.9);
}

.dhero__scribble {
    position: absolute;
    bottom: -2px;
    left: 0;
    width: clamp(180px, 28%, 360px);
    height: 12px;
    background: var(--color-accent);
    mask: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzcwIiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgMzcwIDEwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMiA4Qzc3LjA3OTMgNi4yMTIyOCAyMTEuNjg5IDMuODUxODkgMjgzLjk5OSAyLjc2ODk4QzM1Ni4zMDggMS42ODYwOCAzNjIuMjM5IDEuOTUyMiAzNjggMi4zMzE0OSIgc3Ryb2tlPSIjNTYzQ0U5IiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8L3N2Zz4=') no-repeat center/contain;
}

.dhero__snippet {
    max-width: 600px;
    margin-bottom: clamp(30px, 3vw, 40px);
    color: var(--color-text-main);
}

.dhero__snippet p {
    margin: 0;
}

.dhero__news {
    position: relative;
    max-width: 340px;
    margin-left: auto;
    margin-right: 64px;
    margin-top: 12px;
}

.dhero__news-head {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--color-accent);
    top: 12px;
    left: -24px;
    transform: translateX(-100%);
}

.dhero__news-label {
    font-family: var(--font-handwrite);
    font-size: 20px;
    line-height: 1.3;
    max-width: 120px;
    position: relative;
    font-weight: 500;
}

.dhero__news-label span {
    position: relative;
}

.dhero__news-label span:after {
    content: '';
    position: absolute;
    top: 70%;
    left: 54%;
    transform: translate(-50%, -50%) scale(1.3);
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzEiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA3MSA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTExLjYyOCAyOC4yNzk3QzExLjYyOCAyOC41OTQxIDEzLjY2ODkgMjkuNDkwOSAxOS42NjI0IDMwLjYyOUMyMy40OTUzIDMxLjM1NjkgMjkuNDE3NSAzMS4wODE3IDMzLjg4MDMgMzAuOTUzMUMzOC4zNDMyIDMwLjgyNDYgNDEuMjkwNSAzMC41MTY3IDQ0LjUyMDEgMzAuMDMwNUM0Ny43NDk4IDI5LjU0NDQgNTEuMTcyNCAyOC44ODk1IDUzLjk5NTggMjguMTAwOEM1OS4xMzk5IDI2LjY2MzggNjMuMDM0MiAyNC4yODYyIDY2LjI0NDQgMjIuMTgwNUM2OC4zNzY1IDIwLjc4MTkgNjkuMTkyOCAxOS4yNDM0IDY5Ljc0MjYgMTcuNTc0NUM3MC4yOTkgMTUuODg1NSA2OS4yNzI2IDEzLjQ1MTQgNjguMTMzMSAxMC45NjExQzY3LjQ4NjQgOS41NDc2MyA2NC45MjkgNy44MjMyMyA2MS4zNTkxIDUuNjY5NjFDNTkuMzgzOSA0LjQ3ODA0IDUzLjg4NjYgMy4zNzEyIDQ2LjMyNzcgMS45NDgxMUM0My40NjM2IDEuNDA4OSA0Mi41Mjg0IDEuMzM1NjkgMzkuMDY2IDEuMTk2NTdDMzUuNjAzNyAxLjA1NzQ1IDI5LjYzMTMgMC44Nzg4MDQgMjUuODU5MyAwLjkwMDE5MUMyMC42ODE4IDAuOTI5NTQ3IDE3LjUwODcgMS44NTQ1OSAxMy44OTc4IDMuMDIxMzRDOS44NjMxIDQuMzI0OTkgNy40ODU5MyA1Ljk4MTYgNS43NTk2OSA3LjI5NDI1QzMuMDczOCA5LjMzNjY0IDEuNzU3NzIgMTEuMjkwMSAxLjMzOTUyIDEyLjQyODlDMC43ODIzMjkgMTMuOTQ2MyAwLjgxMzg1NiAxNi4wODEgMS4wOTg5OSAxOC43NjA4QzEuNDM2MzUgMjEuOTMxNCAzLjM5ODMxIDI0Ljc4MDkgNS43MjMyOCAyNy4yOTE2QzcuMDI3NDEgMjguNjk5OCA5LjI0Njg2IDMwLjExNzUgMTIuNDU5NSAzMS43NTk0QzE5LjY0NDkgMzUuNDMxNyAyNS4yNjYgMzcuMjA4MSAyNy43MDMyIDM3Ljc3MjRDMjkuMjkyOSAzOC4wOTQ5IDMxLjU5OTMgMzguNDkwNyAzMy4wMjc2IDM4LjY5NDVDMzQuNDU2IDM4Ljg5ODQgMzQuOTM2MyAzOC44OTg0IDM1LjQzMTMgMzguODk4NCIgc3Ryb2tlPSIjRkY2ODA5IiBzdHJva2Utd2lkdGg9IjEuNzk2NzkiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8L3N2Zz4=');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}

.dhero__news-label:before {
    content: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjEiIGhlaWdodD0iNzUiIHZpZXdCb3g9IjAgMCA2MSA3NSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNzM4NTMgMS4zNDg2M0M0LjgxNDQ4IDkuOTE0OTQgNS40MTU3OSAyMC4yNTI5IDkuOTY3MzYgMjcuNzcxNkMxNy4wNTYzIDM5LjQzNjkgMzYuMjY0NSA1MC43MDA5IDQ1LjYxMjYgMzUuMTM5OEM1MS4wOTE1IDI1Ljk3NzQgNDEuOTU0OCAxMS45MDE5IDMyLjEwMDkgMjAuMjkyMkMxNC42NTg3IDM1LjIyNjMgMzYuNzc0NSA2My42NDkzIDU1LjcxNTIgNjQuODYyMSIgc3Ryb2tlPSIjRkY2ODA5IiBzdHJva2Utd2lkdGg9IjEuMzc0NzUiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik00Ni45ODA4IDU0Ljk5NjhDNDkuNDk3NSA1Ny43NjczIDU0Ljk0NjUgNjEuMjU5MyA1Ni42MjQ1IDY0LjQxMzFDNTguMDQ2OSA2Ny4wMDc3IDQ4LjE5MjYgNzEuNDc3NSA0NS45MjcgNzMuMzI0MSIgc3Ryb2tlPSIjRkY2ODA5IiBzdHJva2Utd2lkdGg9IjEuMzc0NzUiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPg==');
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translate(0, 100%);
    
}

.dhero__slider {
    position: relative;
}

.dhero__blob {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 98%;
    background: var(--color-accent);
    opacity: .9;
    border-radius: 28px;
    transform: rotate(8deg);
    z-index: 0;
}

.dhero-swiper {
    position: relative;
    z-index: 1;
    border-radius: 24px;
    overflow: visible;
}

.dhero-swiper:not(.swiper-initialized) .swiper-slide + .swiper-slide {
    display: none;
}

.dnews-card {
    display: block;
    background: #fff;
    border-radius: 27px;
    padding: 17px;
    overflow: hidden;
    color: inherit;
    text-decoration: none !important;
    box-shadow: 1px 1px 10px 3px #4F4F4F0D;
}

.dnews-card__img {
    aspect-ratio: 309 / 165;
    overflow: hidden;
    border-radius: 25px;
}

.dnews-card__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .6s;
}

.dnews-card:hover .dnews-card__img img {
    transform: scale(1.04);
}

.dnews-card__body {
}

.dnews-card__meta {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 8px;
    color: var(--color-dark-80);
    font-size: 12px;
    margin-top: 11px;
}

.dnews-card__views {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.dnews-card__title {
    margin-bottom: 6px;
    ''    transition: .2s;
}

.dnews-card:hover .dnews-card__title {
    color: var(--color-accent);
}

.dnews-card__excerpt {
    margin-bottom: clamp(8px,1vw,12px);
    font-size: 12px;
    line-height: 1.5;
}

.dnews-card__more {
    font-weight: 700;
    font-size: 12px;
    gap: 8px;
}

.dnews-card__more-icon {
    width: 1em;
    height: 1em;
    background: currentColor;
    mask: var(--icon-arrow-right) no-repeat center/contain;
    transition: .3s;
}

.dnews-card:hover .dnews-card__more-icon {
    transform: translateX(2px);
}

.dhero__news-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: clamp(16px, 2vw, 24px);
}

.dhero__news-fraction {
    font-weight: 500;
    font-size: 16px;
    color: var(--color-dark-100);
    min-width: 40px;
    text-align: center;
    width: auto;
}

.dhero__nav-btn {
    background: var(--color-accent);
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 100%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: .3s;
}

.dhero__nav-btn:after {
    content: '';
    width: 12px;
    height: 12px;
    mask: var(--icon-arrow-right) no-repeat center/contain;
    background: #fff;
}

.dhero__nav-btn--prev:after {
    transform: scale(-1, 1);
}

.dhero__nav-btn:hover {
    background: var(--color-accent-hover);
}
.dhero__nav-btn:hover:after {
    background: #fff;
}

.dhero__nav-btn.swiper-button-disabled {
    opacity: .3;
    pointer-events: none;
}

@media (width < 1280px) {
    .dhero__news-head {
        left: 0;
    }

    .dhero__news {
        margin-right: 8px;
    }
}

@media (width < 992px) {
    .dhero__grid {
        grid-template-columns: minmax(0, 1fr);
        text-align: center;
    }

    .dhero__title {
        margin-left: auto;
        margin-right: auto;
    }

    .dhero__title br {
        display: none;
    }

    .dhero__title-after span:after {
        display: none;
    }

    .dhero__snippet {
        margin-left: auto;
        margin-right: auto;
    }

    .dhero__scribble {
        left: 50%;
        transform: translateX(-50%);
    }

    .dhero__slider {
        margin-left: auto;
        margin-right: auto;
    }

    .dhero__news-head {
        position: relative;
        transform: unset;
        margin-bottom: 24px;
        min-height: 58px;
        margin-left: 40px;
    }

    .dhero__news-label {
        max-width: 100%;
    }

    .dhero__news {
        margin-right: auto;
        text-align: left;
    }

    .dhero__news-label:before {
        transform: scale(1, -1) rotate(-64deg) translate(67px, 69px);
        left: auto;
        right: 0;
        bottom: 0;
        transform-origin: center;
    }
}

@media (width < 576px) {
    .dhero__action .btn {
        width: 100%;
    }
}
