/* DS Interactions v1.0.2 (see main.php) */

/* Tabs: progress bar replaces the static active line while auto-advance runs */
.ds-tabs-auto .ds-tab.e--selected { box-shadow: none !important; }
.ds-tab-prog { display: none; grid-column: 1 / -1; height: 2px; margin-top: 14px; background: rgba(255, 255, 255, 0.1); overflow: hidden; }
.ds-tab-prog i { display: block; width: 0; height: 100%; background: var(--color-brand, #14AA3C); }
.ds-tab.e--selected .ds-tab-prog { display: block; }
.ds-tab-light { position: relative; }
.ds-tab-light .ds-tab-prog { position: absolute; left: 0; right: 0; top: -1px; margin: 0; background: transparent; }

/* Timeline: green rail fill up to the active step, passed steps outlined in green */
.ds-tl-live .ds-steps-menu {
	background-image: linear-gradient(var(--color-brand, #14AA3C), var(--color-brand, #14AA3C)), linear-gradient(#DCE3DA, #DCE3DA) !important;
	background-size: 2px var(--ds-tl-fill, 0px), 2px 100% !important;
	background-position: 19px 0, 19px 0 !important;
	background-repeat: no-repeat !important;
	transition: background-size 0.5s cubic-bezier(0.65, 0, 0.35, 1);
}
.ds-tl-live .ds-step-done .ds-step-num { border-color: var(--color-brand, #14AA3C) !important; color: var(--color-green, #0E7F2C) !important; }

/* Case study carousel: cards stacked in one grid cell, crossfade between them */
.ds-case-carousel.ds-carousel-live > * { opacity: 0 !important; visibility: hidden !important; transition: opacity 0.6s ease, visibility 0s linear 0.6s; }
.ds-case-carousel.ds-carousel-live > .is-on { opacity: 1 !important; visibility: visible !important; transition: opacity 0.6s ease, visibility 0s; }

/* Logo wall: the linked logo whose story is showing in the card */
.ds-logo-wall .ds-wall-link.ds-story-on { background-color: #F1F6F1; }
.ds-logo-wall .ds-wall-link.ds-story-on .ds-wall-ext { color: var(--color-green, #0E7F2C); }

@media (prefers-reduced-motion: reduce) {
	.ds-tl-live .ds-steps-menu, .ds-case-carousel.ds-carousel-live > * { transition: none; }
}