:root {
    --desktop-frame-width: 1168px;
    --timeline-color-decade-base: rgba(130, 86, 99, 0.55);
    --timeline-color-decade-hover: rgba(128, 57, 79, 0.84);
    --timeline-color-decade-active: #2a171d;
    --timeline-color-decade-before: rgba(164, 103, 122, 0.62);
    --timeline-color-decade-after: #ffffff;
    --timeline-color-decade-line: rgba(60, 36, 44, 0.3);
    --timeline-color-media-bg: #e8e1df;
    --card-radius: 28px;
    --timeline-shadow-soft: 0 16px 36px rgba(51, 34, 40, 0.14);
}

.history-timeline {
    position: relative;
    isolation: isolate;
}

.history-timeline__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(260px, 525px) minmax(0, 1fr);
    gap: 56px;
    width: 100%;
    margin: 0px;
    padding: 0 0 120px;
}

.history-timeline__left,
.history-timeline__right {
    opacity: 1;
    transform: translateX(0);
}

.history-timeline.history-timeline--pre-enter .history-timeline__left {
    opacity: 0;
    transform: translateX(-40px);
}

.history-timeline.history-timeline--pre-enter .history-timeline__right {
    opacity: 0;
    transform: translateX(40px);
}

.history-timeline.history-timeline--entered .history-timeline__left,
.history-timeline.history-timeline--entered .history-timeline__right {
    opacity: 1;
    transform: translateX(0);
    transition: opacity 0.75s ease 0.14s, transform 0.75s ease 0.14s;
}

.history-timeline__left-sticky {
    position: sticky;
    top: 225px;
    display: block;
    min-height: 240px;
}

.history-timeline__decades {
    position: relative;
    min-width: 280px;
    padding-right: 0;
    overflow: hidden;
    will-change: height;
}

.history-timeline__decades-track {
    display: flex;
    flex-direction: column;
    gap: 0;
    will-change: transform;
}

.history-timeline__decade-btn {
    position: relative;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 0;
    margin: 0 0 40px 0;
    cursor: pointer;
    font-family: "Creato Display Extra Bold", "Arial", "Helvetica", sans-serif;
    font-weight: 800;
    font-synthesis: none;
    font-size: 6.25rem;
    line-height: 0.95;
    letter-spacing: -0.02em;
    transition: color 0.24s ease, transform 0.24s ease, opacity 0.24s ease;
    color: var(--timeline-color-decade-base);
    opacity: 0.92;
}

.history-timeline__decade-btn:last-child {
    margin-bottom: 0;
}

.history-timeline__decade-btn.big {
    font-size: 6.25rem;
    margin: 0 0 20px 0;
}

.history-timeline__decade-btn.medium {
    font-size: 3.75rem;
}

.history-timeline__decade-btn.is-ghost {
    pointer-events: none;
}

.history-timeline__decade-btn:hover,
.history-timeline__decade-btn:focus-visible {
    color: var(--timeline-color-decade-hover);
    outline: none;
}

.history-timeline__decade-btn.is-active {
    color: var(--timeline-color-decade-active);
    transform: translateX(2px);
    opacity: 1;
}

.history-timeline__decade-btn.is-desktop-fourth {
    opacity: 0.5;
}

.history-timeline__decade-btn.is-after {
    color: var(--timeline-color-decade-after);
}

.history-timeline__decade-btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: auto;
    right: 0;
    width: 210px;
    border-top: 1px solid var(--timeline-color-decade-line);
    transform: translateY(-50%) scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s ease-in-out;
}

.history-timeline__decade-btn.line-reset::after {
    transition: none;
    transform: translateY(-50%) scaleX(0);
}

.history-timeline__decade-btn.is-active::after {
    transform: translateY(-50%) scaleX(1);
}

.history-timeline__decade-btn.medium::after {
    width: 155px;
}

.history-timeline__right {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.history-module {
    min-height: 300px;
    margin-bottom: 100px;
    display: grid;
    align-content: start;
    gap: 10px;
    padding-top: 0;
    scroll-margin-top: 82px;
    opacity: 1;
    transform: none;
    transition: none;
}

.history-module.is-active {
    opacity: 1;
    transform: none;
}

.history-module.active {
    opacity: 1;
    transform: none;
}

.history-module__media {
    margin: 0;
    margin-bottom: 60px;
    width: min(100%, 620px);
    position: relative;
}

.history-timeline--full .history-module__media {
    margin-bottom: 20px;
    border-radius: 30px 0 30px 0;
    overflow: hidden;
    box-shadow: var(--timeline-shadow-soft);
    background: var(--timeline-color-media-bg);
}

.history-module__ivy {
    position: absolute;
    top: 20px;
    z-index: 4;
}

.history-module__ivy--1 {
    width: 230px;
    left: -207px;
}

.history-module__ivy--2 {
    width: 100px;
    left: -69px;
}

.history-module__ivy--3 {
    width: 160px;
    left: -113px;
}

.history-module__media .border-content {
    border-radius: 30px 0 30px 0;
    overflow: hidden;
    box-shadow: var(--timeline-shadow-soft);
}

.history-module__media-image {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    filter: grayscale(35%) saturate(88%) contrast(0.94);
}

/* Extra-images slideshow (Slick, fade). Keeps the single-image layout. */
.history-module__slider {
    width: 100%;
    line-height: 0;
}

/* Before Slick boots, show only the first image so the slides don't stack. */
.history-module__slider .history-module__slide:not(:first-child) {
    display: none;
}

.history-module__slider.slick-initialized .history-module__slide {
    display: block;
}

.history-module__slider,
.history-module__slider .slick-slide {
    cursor: default;
}

.history-module__slider .history-module__slide .history-module__media-image {
    width: 100%;
    pointer-events: none;
}

.history-module__title {
    display: none;
    margin: 0;
    font-family: "Creato Display Extra Bold", "Arial", "Helvetica", sans-serif;
    font-weight: 800;
    font-size: 2rem;
    line-height: 1.1;
    letter-spacing: -0.01em;
}

.history-module__copy {
    width: min(100%, 620px);
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.34;
    margin: 0;
}

.history-timeline--full .history-module__copy {
    font-size: 1.25rem;
    font-weight: 700;
}

.history-module__copy .bold {
    font-weight: 700;
}

.history-module__list li {
    width: 100%;
    font-weight: 800;
    margin: 0 0 20px;
}

.history-module__list li:last-child {
    margin: 0;
}

.history-module__label {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.56;
}

@media (max-width: 1500px) {
}

@media (max-width: 1200px) {
    .history-timeline__grid {
        grid-template-columns: minmax(260px, 425px) minmax(0, 1fr);
    }
    .history-timeline__decade-btn::after{
        width:110px;
    }
}

@media (max-width: 1024px) {
.history-timeline__grid {
        grid-template-columns: minmax(240px, 52fr) minmax(0, 48fr);
        gap: 36px;
        padding: 0 0 96px;
    }

    .history-timeline__left-sticky {
        top: 225px;
        min-height: 200px;
    }

    .history-timeline__decades {
        min-width: 220px;
    }

    .history-timeline__decade-btn.big {
        font-size: 4.5rem;
        margin: 0 0 14px 0;
    }

    .history-timeline__decade-btn.medium {
        font-size: 3rem;
    }

    .history-module {
        min-height: 240px;
        margin-bottom: 72px;
    }

    .history-module__media {
        margin-bottom: 16px;
    }

    .history-module__media,
    .history-module__copy {
        width: min(100%, 560px);
    }

    .history-module__copy {
        font-size: 1.1rem;
        line-height: 1.3;
    }
}

@media (max-width: 850px) {
.history-timeline__decades {
        min-width: 0;
        width: 100%;
        padding-right: 0;
    }

    .history-timeline__grid {
        grid-template-columns: minmax(150px, 40%) minmax(0, 60%);
        gap: 14px;
        width: 100%;
        padding: 0 40px 100px;
    }

    .history-timeline__left-sticky {
        top: 130px;
        padding: 10px 0 8px;
        margin-top: 0;
        min-height: 0;
        gap: 8px;
        backdrop-filter: blur(5px);
    }

    .history-timeline__decade-btn {
        font-size: 2.5rem;
        margin-bottom: 10px;
    }

    .history-timeline__decade-btn::after {
        display: none;
    }

    .history-timeline__decade-btn.is-active::after {
        width: min(36vw, 120px);
    }

    .history-timeline__right {
        gap: 24px;
    }

    .history-module {
        min-height: 62vh;
        margin-bottom: 48px;
        padding-top: 8px;
        scroll-margin-top: 92px;
    }

    .history-module__media,
    .history-module__copy {
        width: 100%;
    }

    .history-module__copy {
        font-size: 1rem;
        line-height: 1.34;
    }

    .history-timeline__decade-btn.medium {
        font-size: 2rem;
    }

    .history-module__ivy {
        display: none;
    }
}

@media (max-width: 800px) {
    .history-timeline--no-mobile-sidebar .history-timeline__left {
        display: none;
    }

    .history-timeline--no-mobile-sidebar .history-timeline__grid {
        grid-template-columns: 1fr;
    }

    .history-timeline--no-mobile-sidebar .history-module__title {
        display: block;
    }
}

@media (max-width: 768px) {
    .history-timeline__grid {
        grid-template-columns: minmax(90px, 1fr) minmax(0, 3fr);
        padding: 0 20px 100px;
    }

    .history-timeline__decade-btn.big {
        font-size: 1.250rem;
    }

    .history-timeline__decade-btn.medium {
        font-size: 1.250rem;
    }

    br.hide_mobile {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .history-timeline.history-timeline--pre-enter .history-timeline__left,
    .history-timeline.history-timeline--pre-enter .history-timeline__right {
        opacity: 1;
        transform: none;
    }

    .history-timeline.history-timeline--entered .history-timeline__left,
    .history-timeline.history-timeline--entered .history-timeline__right {
        transition: none;
    }
}