@import"https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap";.timeline-marquee{--tlm-bg: #ffffff;--tlm-heading-color: #3B626B;--tlm-text-color: #3B626B;--tlm-line-color: rgba(59, 98, 107, .22);--tlm-accent-color: #3B626B;--tlm-font-body: "Avenir Next", "Avenir", "Helvetica Neue", system-ui, -apple-system, sans-serif;--tlm-font-display: "Tenor Sans", "Avenir Next", serif;--tlm-item-w: 320px;--tlm-heading-size: 28px;--tlm-active-year: 46px;--tlm-inactive-year: 24px;--tlm-active-opacity: 1;--tlm-inactive-opacity: .45;--tlm-desc-inactive-opacity: .22;--tlm-glide: 1.2s;position:relative;width:100%;background:var(--tlm-bg);overflow:hidden;font-family:var(--tlm-font-body);box-sizing:border-box}.timeline-marquee *,.timeline-marquee *:before,.timeline-marquee *:after{box-sizing:border-box}.timeline-marquee__header{text-align:center;padding:0 56px 48px;max-width:860px;margin:0 auto}.timeline-marquee__heading{margin:0;font-family:var(--tlm-font-display);font-weight:400;font-size:var(--tlm-heading-size);letter-spacing:.08em;line-height:1.18;text-transform:uppercase;color:var(--tlm-heading-color)}.timeline-marquee__description{margin:8px auto 0;font-family:var(--tlm-font-body);font-size:16px;line-height:1.6;color:var(--tlm-text-color);opacity:.78;max-width:720px}.timeline-marquee__description p{margin:0}.timeline-marquee__track-region{position:relative;height:200px;padding-top:30px;display:flex;flex-direction:column;justify-content:center}.timeline-marquee__line{position:absolute;left:0;right:0;top:50%;height:1px;background:var(--tlm-line-color)}.timeline-marquee__viewport{position:relative;width:100%;height:200px}.timeline-marquee__track{position:absolute;top:50%;left:0;display:flex;transform:translateY(-50%);transition:transform var(--tlm-glide) cubic-bezier(.7,.2,.3,1);will-change:transform}.timeline-marquee__item{width:var(--tlm-item-w);flex:0 0 auto;position:relative;display:flex;flex-direction:column;align-items:center;cursor:pointer}.timeline-marquee__item-desc{height:90px;width:100%;padding:0 18px;display:flex;align-items:flex-end;justify-content:center;text-align:center;font-family:var(--tlm-font-body);font-size:14px;line-height:1.5;color:var(--tlm-text-color);opacity:var(--tlm-desc-inactive-opacity);transition:opacity .5s}.timeline-marquee__item.is-active .timeline-marquee__item-desc{opacity:var(--tlm-active-opacity)}.timeline-marquee__tick{width:1px;height:10px;margin-top:8px;background:var(--tlm-accent-color);opacity:var(--tlm-inactive-opacity);transition:height .35s,opacity .35s}.timeline-marquee__item.is-active .timeline-marquee__tick{height:22px;opacity:var(--tlm-active-opacity)}.timeline-marquee__year{margin-top:12px;font-family:var(--tlm-font-display);font-weight:400;font-size:var(--tlm-inactive-year);letter-spacing:.04em;color:var(--tlm-text-color);opacity:var(--tlm-inactive-opacity);transition:font-size .35s,opacity .35s}.timeline-marquee__item.is-active .timeline-marquee__year{font-size:var(--tlm-active-year);opacity:var(--tlm-active-opacity)}.timeline-marquee__controls{display:flex;justify-content:space-between;align-items:center;padding:20px 56px 36px}.timeline-marquee__btn{width:36px;height:36px;padding:0;border:1px solid var(--tlm-accent-color);border-radius:50%;background:transparent;color:var(--tlm-accent-color);font-family:var(--tlm-font-display);font-size:16px;line-height:1;cursor:pointer;transition:background .2s,color .2s}.timeline-marquee__btn:hover{background:var(--tlm-accent-color);color:var(--tlm-bg)}.timeline-marquee__btn:focus-visible{outline:2px solid var(--tlm-accent-color);outline-offset:2px}.timeline-marquee__counter{font-family:var(--tlm-font-display);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--tlm-text-color);opacity:.6}.timeline-marquee__controls--center{justify-content:center;gap:24px}.timeline-marquee__progress{position:relative;left:0;right:0;height:2px;background:var(--tlm-line-color)}.timeline-marquee__progress-fill{display:block;height:100%;width:0;background:var(--tlm-accent-color);transition:width .6s}@media screen and (max-width:767px){.timeline-marquee__header{padding:0 24px 36px}.timeline-marquee__controls{padding:16px 24px 28px}.timeline-marquee__item-desc{height:120px}}
/*# sourceMappingURL=/cdn/shop/t/86/assets/timeline-marquee.css.map */