/* ============================================
   HOME — главная страница
   ============================================ */

/* Компенсация фиксированной шапки при якорных переходах */
.home-hero,
.home-advantages,
.home-industries,
.home-products,
.home-certificates,
.faq,
.contact-form {
    scroll-margin-top: 108px;
}

/* ===== HERO-СЛАЙДЕР ===== */
.home-hero {
    position: relative;
    min-height: 780px;
    background: var(--surface-general-primary);
    overflow: hidden;
}

.home-hero__slides {
    position: absolute;
    inset: 0;
}

.home-hero__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 600ms var(--easing-gentle), visibility 600ms var(--easing-gentle);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.home-hero__slide.is-active {
    opacity: 1;
    visibility: visible;
    z-index: 1;
}

.home-hero__background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

/* Фото: чёткое слева, размытое справа (два слоя + маска) */
.home-hero__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.home-hero__image-blur {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    filter: blur(28px);
    -webkit-filter: blur(28px);
    transform: scale(1.08);
    -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 1) 55%);
    mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 1) 55%);
}

/* Градиент: плавный переход фото в цвет фона секции */
.home-hero__gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(57, 74, 90, 0) 40%, rgba(57, 74, 90, 0.6) 48%, #394A5A 55%);
}

.home-hero__backdrop {
    position: absolute;
    inset: 0;
    background: rgb(16, 16, 16, 0.3);
    pointer-events: none;
}

/* Декоративные SVG-линии (позиции в % от баннера) */
.home-hero__decor {
    position: absolute;
    inset: 0;
    color: var(--base-neutral-lightest);
    pointer-events: none;
}

.home-hero__decor-svg {
    position: absolute;
    max-width: none;
}

.home-hero__decor-svg--left {
    left: -76.7%;
    /* -1473 / 1920 */
    top: -47%;
    /* -367 / 780 */
    width: 76.1%;
    /* 1462 / 1920 */
    height: 82%;
    /* 640 / 780 */
}

.home-hero__decor-svg--right {
    left: -43.4%;
    /* -833 / 1920 */
    top: 38.8%;
    /* 303 / 780 */
    width: 100%;
    height: 61.2%;
    /* 477 / 780 */
}

.home-hero__container {
    position: relative;
    z-index: 2;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 240px;
    padding-bottom: 240px;
    /* высота категорий + отступ */
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 120px;
}

.home-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 48px;
    width: 714px;
    max-width: 100%;
    padding-top: 48px;
    padding-bottom: 48px;
}

.home-hero__text-block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    max-width: 714px;
}

.home-hero__chip {
    display: inline-flex;
    align-items: center;
    padding: 8px;
    background: var(--surface-general-accent-secondary);
    border-radius: 4px;
    color: var(--text-content-tertiary);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
}

.home-hero__title-group {
    display: flex;
    flex-direction: column;
    gap: 24px;
    text-shadow: 1px 1px 1px black;
}

.home-hero__title {
    margin: 0;
    color: var(--base-neutral-lightest);
    font-size: 52px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    max-width: 714px;
}

.home-hero__description {
    margin: 0;
    color: #E8E1E1;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    max-width: 714px;
}


/* ===== HERO: ПАГИНАЦИЯ-ТАБЫ ===== */
.home-hero__categories {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
    padding-bottom: 12px;
}

.home-hero__categories-label {
    color: var(--text-title-primary);
    font-size: 28px;
    font-weight: 600;
    line-height: 1.1;
    text-transform: uppercase;
}

.home-hero__tabs {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}

.home-hero__tab {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 4px 12px;
    background: var(--surface-general-accent-secondary);
    border: none;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 600ms var(--easing-gentle);
}

.home-hero__tab .icon {
    color: var(--icon-primary);
    flex-shrink: 0;
}

.home-hero__tab-label {
    color: var(--text-content-secondary);
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.2;
    white-space: nowrap;
}

.home-hero__tab-separator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: var(--surface-general-accent-primary);
    opacity: 0;
    transition: opacity 300ms var(--easing-gentle);
}

.home-hero__tab.is-active {
    background: var(--surface-general-primary);
}

.home-hero__tab.is-active .icon {
    color: var(--icon-secondary);
}

.home-hero__tab.is-active .home-hero__tab-label {
    color: var(--text-title-primary);
}

.home-hero__tab.is-active .home-hero__tab-separator {
    opacity: 1;
}

.home-hero__tab:hover {
    background: var(--surface-general-primary);
}

.home-hero__tab:hover .icon {
    color: var(--icon-secondary);
}

.home-hero__tab:hover .home-hero__tab-label {
    color: var(--text-title-primary);
}

.home-hero__tab:hover .home-hero__tab-separator {
    opacity: 1;
}

/* ===== ПРЕИМУЩЕСТВА ===== */
.home-advantages {
    background: var(--surface-general-primary);
    padding: 80px 0;
    overflow: hidden;
}

.home-advantages__container {
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    gap: 12px;
}

.home-advantages__heading {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: flex-start;
    flex-direction: column;
    width: 50%;
}

.home-advantages__title {
    max-width: 714px;
    min-width: 288px;
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.1;
}

.home-advantages__title-accent {
    color: var(--text-accent);
}

.home-advantages__title-plain {
    color: var(--text-title-primary);
    display: block;
}

.home-advantages__description {
    max-width: 660px;
    min-width: 288px;
    margin: 0;
    color: #E8E1E1;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
}

.home-advantages__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 50%;
}

/* Карточки преимуществ (переиспользуем классы из company.css) */
.home-advantages__grid .card-advantage {
    flex: 1 1 0;
    max-width: 482px;
    min-width: 288px;
}

/* ===== ОТРАСЛИ ===== */
.home-industries {
    background: var(--surface-general-primary);
    padding: 0 0 80px;
    overflow: hidden;
}

.home-industries__container {
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.home-industries__header {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-start;
}

.home-industries__title {
    flex: 1 1 0;
    max-width: 714px;
    min-width: 288px;
    margin: 0;
    color: var(--text-title-primary);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.1;
}

.home-industries__description {
    flex: 1 1 0;
    max-width: 714px;
    min-width: 288px;
    margin: 0;
    color: #E8E1E1;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
}

.home-industries__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.card-industry {
    position: relative;
    flex: 1 1 0;
    height: 528px;
    max-width: 472px;
    min-width: 288px;
    min-height: 388px;
    border-radius: 16px;
    overflow: hidden;
    outline: 3px solid var(--border-secondary);
    outline-offset: -1px;
    text-decoration: none;
    display: block;
}

.card-industry__background {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.card-industry__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 600ms var(--easing-gentle);
}



/* Градиент снизу — под текстовый блок */
.card-industry__gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, #101010 0%, rgba(16, 16, 16, 0) 100%);
}

/* Размытие только в зоне текста (нижняя часть карточки) */
.card-industry__blur {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40%;
    background: rgba(16, 16, 16, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    -webkit-mask-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 100%);
}

.card-industry__overlay {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    background: rgba(16, 16, 16, 0.5);
    -webkit-mask-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 100%);
}

.card-industry__content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.card-industry__icon-container {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.card-industry__title {
    margin: 0;
    color: var(--text-title-primary);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.1;
}

.card-industry__separator {
    width: 100px;
    height: 1px;
    background: var(--surface-general-accent-primary);
}

.card-industry__text {
    margin: 0;
    color: #E8E1E1;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2;
}

/* ===== ЛИДЕРЫ ПРОДАЖ ===== */
.home-products {
    background: var(--surface-general-primary);
    padding: 0 0 80px;
    overflow: hidden;
}

.home-products__container {
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.home-products__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.home-products__title {
    flex: 1 1 0;
    max-width: 714px;
    min-width: 60px;
    margin: 0;
    color: var(--text-title-primary);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.1;
}

.home-products__link {
    flex-shrink: 0;
}

.home-products__carousel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.home-products__swiper {
    overflow: hidden;
    width: 100%;
}

.home-products__slide {
    height: auto;
    display: flex;
}

.home-products__slide .card-product {
    width: 100%;
}

.home-products__controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.home-products__pagination {
    display: flex;
    align-items: center;
    gap: 2px;
    color: var(--base-neutral-lightest);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
}

.home-products__pagination-current,
.home-products__pagination-total {
    min-width: 24px;
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-products__arrows {
    display: flex;
    gap: 12px;
}

.home-products__nav {
    width: 48px;
    height: 48px;
    padding: 12px;
    background: var(--surface-general-accent-secondary);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 300ms var(--easing-gentle);
    color: var(--surface-general-secondary);
}

.home-products__nav:hover {
    background: var(--surface-general-secondary);
    color: var(--base-neutral-lightest);
}

.home-products__nav svg {
    fill: currentColor;
    flex-shrink: 0;
}

.home-products__nav.swiper-button-disabled {
    opacity: 0.4;
    pointer-events: none;
}

/* ===== СЕРТИФИКАТЫ ===== */
.home-certificates {
    background: var(--surface-general-primary);
    padding: 0 0 80px;
    overflow: hidden;
}

.home-certificates__container {
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.home-certificates__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.home-certificates__title {
    flex: 1 1 0;
    max-width: 714px;
    min-width: 60px;
    margin: 0;
    color: var(--text-title-primary);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.1;
}

.home-certificates__link {
    flex-shrink: 0;
}

.home-certificates__carousel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.home-certificates__swiper {
    overflow: hidden;
    width: 100%;
}

.home-certificates__slide {
    height: auto;
}

.home-certificates__slide .card-certificate {
    width: 100%;
}

.home-certificates__controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.home-certificates__pagination {
    display: flex;
    align-items: center;
    gap: 2px;
    color: var(--base-neutral-lightest);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
}

.home-certificates__pagination-current,
.home-certificates__pagination-total {
    min-width: 24px;
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-certificates__arrows {
    display: flex;
    gap: 12px;
}

.home-certificates__nav {
    width: 48px;
    height: 48px;
    padding: 12px;
    background: var(--surface-general-accent-secondary);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 300ms var(--easing-gentle);
    color: var(--surface-general-secondary);
}

.home-certificates__nav:hover {
    background: var(--surface-general-secondary);
    color: var(--base-neutral-lightest);
}

.home-certificates__nav svg {
    fill: currentColor;
    flex-shrink: 0;
}

.home-certificates__nav.swiper-button-disabled {
    opacity: 0.4;
    pointer-events: none;
}

/* Если слайдов не больше, чем видно — контролы не нужны */
.home-certificates--no-controls .home-certificates__controls {
    display: none;
}

/* ===== АДАПТИВ: ОТРАСЛИ ≤920 — первые две в ряд, третья на всю ширину ===== */
@media (max-width: 920px) {
    .card-industry {
        flex: 1 1 calc(50% - 12px);
        max-width: none;
        width: auto;
        min-width: 0;
    }

    .card-industry:last-child:nth-child(odd) {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (max-width: 460px) {
    .card-industry {
        flex: 1 1 calc(100% - 12px);
    }

}

/* ===== АДАПТИВ: ПЛАНШЕТ (835-1440) ===== */
@media (max-width: 1440px) {

    .home-hero__container,
    .home-advantages__container,
    .home-industries__container,
    .home-products__container,
    .home-certificates__container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .home-hero {
        min-height: 640px;
    }

    .home-hero__container {
        gap: 60px;
        align-items: flex-start;
        padding-bottom: 135px;
    }

    .home-hero__title {
        font-size: 40px;
    }

    .home-advantages {
        padding: 48px 0;
    }

    .home-advantages__container {
        gap: 48px;
        flex-direction: column;
    }

    .home-advantages__heading {
        width: 100%;
    }

    .home-advantages__grid {
        width: 100%;
    }

    .home-advantages__grid .card-advantage {
        flex: none;
        max-width: 100%;
    }

    .home-advantages__title {
        font-size: 24px;
    }

    .home-industries,
    .home-products,
    .home-certificates {
        padding-bottom: 48px;
    }

    .home-industries__title,
    .home-products__title,
    .home-certificates__title {
        font-size: 24px;
    }

    .card-industry {
        height: 440px;
    }



    .home-hero__image-blur {
        -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 1) 45%, rgba(0, 0, 0, 0) 62%);
        mask-image: linear-gradient(to top, rgba(0, 0, 0, 1) 45%, rgba(0, 0, 0, 0) 62%);
        filter: blur(32px);
        -webkit-filter: blur(32px);
    }

    /* Усиливаем градиент, чтобы текст читался на фото */
    .home-hero__gradient {
        background: linear-gradient(90deg, rgba(57, 74, 90, 0) 32%, rgba(57, 74, 90, 0.7) 46%, #394A5A 55%);
    }

    /* Дополнительная подложка под текстовый блок */
    

    .home-hero__content {
        padding-bottom: 50px;
    }

    .home-hero__image {
        position: absolute;
        top: 50%;
        left: 0;
        width: 1920px;
        height: auto;
        max-width: none;
        transform: translateY(-50%);
        object-fit: cover;
        object-position: center;
        display: block;
    }

    .card-industry__overlay {
        display: block;
    }

}

@media(max-width:1024px) {
    .home-hero__tab .home-hero__tab-label {
        display: none;
    }
    .home-hero__image {
        position: absolute;
        top: 50%;
        left: 0;
        max-width: none;
        transform: translateY(-50%);
        object-fit: cover;
        object-position: center;
        display: block;
        width: 100%;
        height: 100%;
    }
}

/* ===== АДАПТИВ: МОБИЛЬНЫЙ (≤834) ===== */
@media (max-width: 834px) {
    .home-hero {
        min-height: 560px;
    }

    .home-hero__container {
        gap: 40px;
        padding-top: 24px;
    }

    .home-hero__content {
        gap: 32px;
        padding-top: 24px;
    }

    .home-hero__title {
        font-size: 28px;
    }

    .home-hero__description {
        font-size: 14px;
    }

    .home-hero__categories-label {
        font-size: 20px;
    }



    .home-hero__tab {
        justify-content: flex-start;
    }

    .home-advantages {
        padding: 32px 0;
    }

    .home-advantages__container {
        gap: 32px;
    }

    .home-advantages__title {
        font-size: 20px;
    }

    .home-advantages__description {
        font-size: 14px;
    }

    .home-industries,
    .home-products,
    .home-certificates {
        padding-bottom: 40px;
    }

    .home-industries__title,
    .home-products__title,
    .home-certificates__title {
        font-size: 20px;
    }

    .home-industries__description {
        font-size: 14px;
    }

    .card-industry {
        height: 388px;
    }

    .card-industry__title {
        font-size: 22px;
    }

    .card-industry__text {
        font-size: 16px;
    }

    .home-products__pagination,
    .home-certificates__pagination {
        font-size: 14px;
    }

    .home-hero__categories {
        gap: 8px;
    }


}

/* ===== АДАПТИВ: HERO <480px — фото сверху без обрезки, контент на серой подложке (как у astslon.ru) ===== */
@media (max-width: 479px) {
    .home-hero {
        min-height: 0;
    }

    .home-hero__slides {
        position: relative;
        inset: auto;
    }

    .home-hero__categories {
        position: static;
        padding: 16px 16px 24px;
    }

    .home-hero__slide {
        position: relative;
        inset: auto;
        opacity: 1;
        visibility: hidden;
        display: none;
    }

    .home-hero__slide.is-active {
        display: flex;
        visibility: visible;
        opacity: 1;
    }

    .home-hero__background {
        position: relative;
        inset: auto;
        height: auto;
        overflow: visible;
    }

    .home-hero__image {
        position: static;
        width: 100%;
        height: auto;
        object-fit: contain;
        transform: none;
    }

    .home-hero__backdrop,
    .home-hero__decor {
        display: none;
    }

    .home-hero__container {
        padding: 24px 16px 24px;
        gap: 24px;
        align-items: flex-start;
    }

    .home-hero__content {
        gap: 20px;
        padding-top: 0;
        padding-bottom: 0;
    }
}
