.company-history .section-heading {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.company-history .section-title {
    margin-bottom: 0.1em;
}

.company-history .heading-paragraph {
    text-align: center;
    max-width: 600px;
}

.company-history .toggle-paragraph .toggle-text {
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.company-history .toggle-paragraph .toggle-button {
    margin-top: 12px;
}

.company-history .toggle-paragraph .toggle-button::after {
    content: '';
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.6633 0.831023C11.45 0.619005 11.1615 0.5 10.8607 0.5C10.56 0.5 10.2715 0.619005 10.0582 0.831023L5.97154 4.86077L1.94179 0.831023C1.72851 0.619005 1.43999 0.5 1.13926 0.5C0.838521 0.5 0.550005 0.619005 0.336721 0.831023C0.230026 0.936847 0.145339 1.06275 0.0875465 1.20147C0.0297541 1.34019 0 1.48897 0 1.63925C0 1.78953 0.0297541 1.93831 0.0875465 2.07703C0.145339 2.21575 0.230026 2.34165 0.336721 2.44748L5.16331 7.27407C5.26914 7.38076 5.39504 7.46545 5.53376 7.52324C5.67248 7.58104 5.82127 7.61079 5.97154 7.61079C6.12182 7.61079 6.2706 7.58104 6.40932 7.52324C6.54804 7.46545 6.67394 7.38076 6.77977 7.27407L11.6633 2.44748C11.77 2.34165 11.8547 2.21575 11.9125 2.07703C11.9702 1.93831 12 1.78953 12 1.63925C12 1.48897 11.9702 1.34019 11.9125 1.20147C11.8547 1.06275 11.77 0.936847 11.6633 0.831023Z' fill='%23282828'/%3E%3C/svg%3E%0A");
    background-size: 12px 12px;
    height: 12px;
    width: 12px;
    margin-left: 8px;
    transform: rotate(0deg);
}

.company-history .toggle-paragraph .toggle-button.rotated::after {
    transform: rotate(180deg);
}

.company-history .paragraph-box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.company-history .single-slide {
    text-align: center;
    margin: auto 10px !important;
}

.company-history .single-slide img {
    margin-inline: auto;
}

.company-history .single-slide h3 {
    margin-top: 0;
    margin-bottom: 50px;
    font-size: 20px;
    font-weight: 700;
}

.company-history .history-content {
    position: relative;
    width: 100%;
    padding-top: 50px;
}

.company-history .history-content {
    --swiper-navigation-size: 30px; 
    --swiper-navigation-color: black; 
}

.company-history .history-slider,
.company-history .history-slider--after {
    position: relative;
    width: 90%;
    margin: 0 auto !important;
    overflow: hidden;
}

@media(max-width: 500px) {
    .company-history .history-slider .button-wrapper {
        justify-content: center;
    }

    .company-history .swiper-slide .cta .button {
        padding: 16px 20px;
    }

    .company-history .history-slider{
        overflow: visible;
    }

    .company-history .swiper-button-prev,
    .company-history .swiper-button-next {
        display: none !important;
    }
}

.history-content {
    position: relative;
    overflow: hidden;
}

.history-content {
    position: relative;
    overflow: hidden;
}

.history-content::before,
.history-content::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 20%; /* Adjust as needed */
    pointer-events: none; /* To make sure it's non-interactive */
    z-index: 2;
    background: linear-gradient(to right, white, transparent);
    transition: opacity 0.3s ease; /* Smooth fade in/out */
}

.history-content::before {
    left: 0;
}

.history-content::after {
    right: 0;
    background: linear-gradient(to left, white, transparent);
}

/* Hide the left gradient when the class is added */
.history-content.hide-left-gradient::before {
    opacity: 0;
}

/* Hide the right gradient when the class is added */
.history-content.hide-right-gradient::after {
    opacity: 0;
}

/* Ensure the gradients are visible by default */
.history-content::before,
.history-content::after {
    opacity: 1;
}

.company-history .year {
    position: relative;
    z-index: 1; 
    padding: 2px;
    background-color: var(--wp--preset--color--red);
    color: white;
    margin: -4px 22px 36px;
}

.year::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml,%3Csvg width='3' height='50' viewBox='0 0 3 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='1.5' y1='6.55682e-08' x2='1.5' y2='50' stroke='%23E62038' stroke-width='3'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    width: 3px;
    height: 50px;
    z-index: -1;
}
