/* =====================
   B2B PAGE
   ===================== */

.b2b-hero {
    padding: 80px 0;
    background-color: var(--color-vanilla);
    position: relative;
    overflow: hidden;

    @media (max-width: 1024px) {
        padding: 60px 0;
    }

    @media (max-width: 768px) {
        padding: 48px 0;
    }

    @media (max-width: 568px) {
        padding: 32px 0;
    }
}

.b2b-hero__button {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font: 700 16px/1.2 "Jost";
    color: white;
    background-color: var(--color-olive);
    padding: 10px 16px;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid var(--color-olive);


    > img {
        height: 20px;
        display: block;
    }
}

.b2b-hero__button--outline {
    background-color: white;
    color: var(--color-olive);
}


.b2b-hero__inner {
    display: flex;
    gap: 80px;
    align-items: center;

    @media (max-width: 1024px) {
        gap: 48px;
    }

    @media (max-width: 768px) {
        flex-direction: column-reverse;
        gap: 40px;
    }
}

.b2b-hero__content {
    display: flex;
    flex-direction: column;
    gap: 32px;
    flex: 1;

    @media (max-width: 768px) {
        width: 100%;
    }
}

.b2b-hero__text-group {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.b2b-hero__title {
    font: 700 40px/1.2 "Crimson Pro";
    color: var(--color-text-primary);

    @media (max-width: 768px) {
        font-size: 32px;
    }

    @media (max-width: 568px) {
        font-size: 28px;
    }
}

.b2b-hero__description {
    font: 400 15px/1.2 "Jost";
    color: var(--color-text-primary);
}

.b2b-hero__certifications {
    display: flex;
    gap: 32px;
    align-items: center;
    list-style: none;
}

.b2b-hero__cert-item {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;

    @media (max-width: 568px) {
        width: 100%;
    }
}

.b2b-hero__cert-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.b2b-hero__actions {
    display: flex;
    gap: 16px;
    align-items: center;

    @media (max-width: 568px) {
        flex-direction: column;
        align-items: stretch;

        .b2b-hero__button {
            justify-content: center;
        }
    }
}

.b2b-hero__image-wrap {
    height: 420px;
    border-radius: 8px;
    flex-shrink: 0;
    position: relative;

    &::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 300%;
        height: 54%;
        background-color: var(--color-olive);
        border-top-left-radius: 38px;
        border-bottom-left-radius: 38px;
    }

    @media (max-width: 1024px) {
        width: 400px;
        height: 340px;
    }

    @media (max-width: 768px) {
        height: 300px;
    }

    @media (max-width: 568px) {
        height: 240px;
    }

    @media (max-width: 400px) {
        &::after {
            width: 98%;
            right: 0;
            left: unset;
        }
    }
}

.b2b-hero__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 8px;
    position: relative;
    z-index: 2;
}

/* =====================
   ADVANTAGES SECTION
   ===================== */
.b2b-advantages {
    padding: 40px 0;
    background-color: var(--color-background);
    max-width: 100vw;
    overflow: hidden;

    .tns-ovh {
        overflow: visible;
    }

    @media (max-width: 768px) {
        padding: 60px 0;

        .tns-ovh {
            overflow: auto;
            scrollbar-width: none;
            -ms-overflow-style: none;
            &::-webkit-scrollbar { display: none; }
        }
    }

    @media (max-width: 568px) {
        padding: 40px 0;
    }
}

.b2b-advantages__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;

    @media (max-width: 768px) {
        margin-bottom: 24px;
    }
}

.b2b-advantages__heading {
    font: 700 40px/1.2 "Crimson Pro";
    color: var(--color-text-primary);

    @media (max-width: 768px) {
        font-size: 24px;
    }
}

.b2b-advantages__nav {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;

    @media (max-width: 768px) {
        display: none;
    }
}

.b2b-advantages__arrow {
    width: 32px;
    height: 32px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;

    > img {
        width: 100%;
        height: 100%;
    }
}

.b2b-advantages__arrow--left {
    transform: rotate(180deg);
}

.b2b-advantages__row {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    scrollbar-width: none;

    &::-webkit-scrollbar {
        display: none;
    }
}

.b2b-advantages__card {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.b2b-advantages__card-image {
    aspect-ratio: 1 / 1;
    width: 100%;
    background-color: var(--color-vanilla);
    border-radius: 8px;
    object-fit: cover;
    display: block;
}

.b2b-advantages__card-body {
    background-color: var(--color-light-vanilla);
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 0;
}

.b2b-advantages__card-title {
    font: 700 24px/1.2 "Crimson Pro";
    color: var(--color-text-primary);

    @media (max-width: 768px) {
        font-size: 20px;
    }
}

.b2b-advantages__card-text {
    font: 400 15px/1.2 "Jost";
    color: var(--color-text-primary);
}

/* =====================
   PARTNERS SECTION
   ===================== */
.b2b-partners {
    padding: 40px 0;

    @media (max-width: 768px) {
        padding: 60px 0;
    }

    @media (max-width: 568px) {
        padding: 40px 0;
    }
}

.b2b-partners__heading {
    font: 700 40px/1.2 "Crimson Pro";
    color: var(--color-text-primary);
    text-align: center;
    margin-bottom: 32px;

    @media (max-width: 768px) {
        font-size: 32px;
        margin-bottom: 24px;
    }

    @media (max-width: 568px) {
        font-size: 28px;
    }
}

.b2b-partners__scroll {
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.b2b-partners__logo-list {
    display: flex;
    gap: 32px;
    align-items: center;
    list-style: none;
    width: max-content;
    animation: b2b-marquee 25s linear infinite;
}

@keyframes b2b-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
    .b2b-partners__logo-list {
        animation: none;
        overflow-x: auto;
        width: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
        &::-webkit-scrollbar { display: none; }
    }
    .b2b-partners__scroll {
        mask-image: none;
        -webkit-mask-image: none;
    }
}

.b2b-partners__logo-item {
    width: 240px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;

    @media (max-width: 768px) {
        width: 140px;
        height: 80px;
    }
}

.b2b-partners__logo-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* =====================
   CTA SECTION
   ===================== */
.b2b-cta {
    padding: 40px 0 210px;

    @media (max-width: 768px) {
        padding: 60px 0 150px;
    }

    @media (max-width: 568px) {
        padding: 40px 0 150px;
    }
}

.b2b-cta__inner {
    display: grid;
    grid-template-columns: minmax(520px, 50vw) 1fr;
    align-items: center;
    gap: 40px;
    max-width: 1600px;
    padding-right: 20px;
    margin: 0 auto;

    @media (max-width: 768px) {
        display: grid;
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 0 20px;
    }
}

.b2b-cta__gallery {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1 0 0;
    min-width: 0;
}

.b2b-cta__gallery-row {
    display: flex;
    gap: 16px;
}

.b2b-cta__gallery-row > .b2b-cta__gallery-item {
    flex: 1 0 0;
    min-width: 0;
}

.b2b-cta__gallery-item {
    aspect-ratio: 340 / 252;
    border-radius: 8px;
    overflow: hidden;
}

.b2b-cta__gallery-item--wide {
    aspect-ratio: 720 / 252;
}

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

.b2b-cta__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    flex: 0 1 480px;
    min-width: 0;

    @media (max-width: 768px) {
        gap: 24px;
        align-items: stretch;
    }
}

.b2b-cta__heading {
    font: 700 40px/1.2 "Crimson Pro";
    color: var(--color-text-primary);
    text-align: left;

    @media (max-width: 1024px) {
        font-size: 32px;
    }

    @media (max-width: 568px) {
        font-size: 24px;
    }
}

.b2b-cta__buttons {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.b2b-cta-card {
    background-color: var(--color-olive);
    border-radius: 8px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    box-shadow: var(--shadow-default);
    text-decoration: none;

    &:hover {
        opacity: 0.9;
    }
}

.b2b-cta-card__label {
    font: 400 16px/1.5 "Jost";
    color: white;
}

.b2b-cta-card__value {
    display: flex;
    gap: 4px;
    align-items: center;
}

.b2b-cta-card__icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.b2b-cta-card__text {
    font: 600 20px/1.2 "Jost";
    color: white;
}

.download-catalog-card {
    background-color: white;
    padding: 24px 32px 40px;
    display: flex;
    flex-direction: column;
    gap: 16px;

    .errorlist {
        margin-top: 5px;
        padding: 0;
        list-style: none;
        color: var(--color-error);
        font: 400 12px/1.5 'Jost';
    }
}

.download-catalog-card__title {
    font: 700 24px/1.2 "Crimson Pro";
    color: var(--color-black-bean);
}

.download-catalog-card__form {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.download-catalog-card__inputs {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.download-catalog-card .form-field--with-icon .form-field__input {
    padding: 12px 12px 12px 48px;
    font-size: 15px;
    line-height: 20px;
}

.download-catalog-card .form-field--with-icon .form-field__icon {
    left: 16px;
}

.download-catalog-card .form-field--with-icon .form-field__icon img {
    width: 20px;
    height: 20px;
}

.download-catalog-card__phone-input {
    display: flex;
    gap: 8px;
    align-items: center;
    height: 44px;
    padding: 12px 16px;
    background-color: white;
    border: 1px solid var(--color-ice);
    border-radius: 8px;
    box-shadow: var(--shadow-default);
}

.download-catalog-card__phone-prefix {
    font: 600 15px/20px "Jost";
    color: var(--color-black-bean);
    white-space: nowrap;
    flex-shrink: 0;
}

.download-catalog-card__phone-field {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font: 400 15px/20px "Jost";
    color: var(--color-black-bean);
    min-width: 0;

    &::placeholder {
        color: var(--color-dark-grey);
    }
}

.download-catalog-card__submit {
    background-color: var(--color-olive);
    color: var(--color-ice);
    padding: 10px 16px;
    width: 100%;
    font: 700 16px/1.2 "Jost";
    text-align: center;
    border-radius: 8px;
    transition: background-color 0.3s ease;
    border: none;
    cursor: pointer;

    &:disabled {
        background-color: var(--color-smoke);
    }
}
