/* Aluna "How we work" header animation. */

.ast-aw {
	--aw-navy: #1b1491;
	--aw-blue: #2b5fd8;
	--aw-light: #eaf0ff;
	--aw-orange: #ff5a1f;
	--aw-green: #17a864;
	--ast-aw-max-h: 92px;
	position: absolute;
	z-index: 5;
	display: none;
	pointer-events: auto;
}

.ast-aw.is-placed,
.ast-aw--preview {
	display: block;
}

.ast-aw--preview {
	position: relative;
	width: 100%;
	max-width: calc(var(--ast-aw-max-h) * 3);
	margin: 0 auto;
}

/* Below the desktop header layout there is no free space. */
@media (max-width: 1024px) {
	.ast-aw:not(.ast-aw--preview) { display: none !important; }
}

.ast-aw-btn {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 12px;
	background: none;
	box-shadow: none;
	cursor: pointer;
	line-height: 0;
	-webkit-tap-highlight-color: transparent;
}

.ast-aw-btn:hover,
.ast-aw-btn:focus {
	background: none;
}

.ast-aw-btn:focus-visible {
	outline: 2px solid var(--aw-blue);
	outline-offset: 2px;
}

.ast-aw-svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
	font-family: inherit;
}

/* palette */
.ast-aw .aw-fill-l { fill: var(--aw-light); }
.ast-aw .aw-fill-d { fill: var(--aw-navy); }
.ast-aw .aw-stroke { stroke: var(--aw-navy); stroke-width: 1.4; }
.ast-aw .aw-win { fill: #c7d5ff; transition: fill 0.25s; }
.ast-aw .aw-win.is-lit { fill: #ffd25a; }
.ast-aw .aw-flask { fill: var(--aw-orange); }
.ast-aw .aw-flag { fill: var(--aw-orange); }
.ast-aw .aw-logo-a { fill: #fff; font-size: 5.5px; font-weight: 700; letter-spacing: 0.02em; }
.ast-aw .aw-runway { stroke: var(--aw-navy); stroke-width: 1.4; stroke-dasharray: 5 4; opacity: 0.45; fill: none; }
.ast-aw .aw-lines { stroke: #9aaee6; stroke-width: 1.6; stroke-linecap: round; fill: none; }
.ast-aw .aw-screen { fill: #0f1d5c; }
.ast-aw .aw-screen-w { fill: #fff; }
.ast-aw .aw-dna { transform-box: fill-box; transform-origin: center; }
.ast-aw .aw-dna path { stroke: #6ee7ff; stroke-width: 1.3; fill: none; stroke-linecap: round; }
.ast-aw .aw-led { fill: #9aaee6; transition: fill 0.12s; }
.ast-aw .aw-led.is-on { fill: var(--aw-green); }
.ast-aw .aw-bar { fill: var(--aw-blue); }
.ast-aw .aw-bar:nth-of-type(odd) { fill: var(--aw-orange); }

.ast-aw .aw-mag circle { fill: rgba(255, 255, 255, 0.55); stroke: var(--aw-orange); stroke-width: 2; }
.ast-aw .aw-mag path { stroke: var(--aw-orange); stroke-width: 2.6; stroke-linecap: round; }

.ast-aw .aw-pop { transform: scale(0); transform-box: fill-box; transform-origin: center; transition: transform 0.35s cubic-bezier(0.34, 1.8, 0.64, 1); }
.ast-aw .aw-pop.is-on { transform: scale(1); }
.ast-aw .aw-pop circle { fill: var(--aw-green); }
.ast-aw .aw-pop path { stroke: #fff; stroke-width: 1.8; fill: none; stroke-linecap: round; stroke-linejoin: round; }

.ast-aw .aw-van-body { fill: var(--aw-blue); }
.ast-aw .aw-van-cab { fill: var(--aw-navy); }
.ast-aw .aw-wheel circle { fill: #222a4a; }
.ast-aw .aw-wheel path { stroke: #c7d5ff; stroke-width: 1; }
.ast-aw .aw-plane-body { fill: #fff; stroke: var(--aw-navy); stroke-width: 1.3; }
.ast-aw .aw-plane-wing { fill: var(--aw-blue); }
.ast-aw .aw-plane .aw-win { fill: var(--aw-navy); }
.ast-aw .aw-box-body { fill: var(--aw-orange); }
.ast-aw .aw-box-lid { fill: #c43d0c; }
.ast-aw .aw-snow { stroke: #fff; stroke-width: 1.1; stroke-linecap: round; }
.ast-aw .aw-doc-body { fill: #fff; stroke: var(--aw-navy); stroke-width: 1.3; }
.ast-aw .aw-doc-lines { stroke: var(--aw-orange); stroke-width: 1.4; stroke-linecap: round; }

/* route + progress */
.ast-aw .aw-route { stroke: #c9d4f5; stroke-width: 2; stroke-dasharray: 3 5; stroke-linecap: round; fill: none; }
.ast-aw .aw-route-done { stroke: var(--aw-orange); stroke-width: 2.4; stroke-linecap: round; fill: none; stroke-dasharray: 515; stroke-dashoffset: 515; }

/* stations: visibility is driven by the script (one stage at a time); the active one lifts */
.ast-aw .aw-st { opacity: 0; }
.ast-aw .aw-st > * { transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1); }
.ast-aw .aw-st.is-active > *:not(.aw-mag):not(.aw-pop) { transform: translateY(-3px); }

/* caption */
.ast-aw .aw-title { fill: var(--aw-navy); font-size: 11px; font-weight: 700; letter-spacing: 0.02em; }
.ast-aw .aw-caption { fill: #3a4370; font-size: 11px; transition: opacity 0.16s; }
.ast-aw .aw-caption.is-fading { opacity: 0; }
.ast-aw .aw-num { fill: var(--aw-orange); font-weight: 700; }

/* end of loop */
.ast-aw .aw-world { transition: opacity 0.45s; }
.ast-aw.is-fadeout .aw-world { opacity: 0; }

.ast-aw.is-paused .ast-aw-svg { opacity: 0.85; }

/* admin preview frame */
.ast-aw-preview-stage { padding: 16px; background: #f0f0f1; border-radius: 4px; }
.ast-aw-preview-header { display: flex; align-items: center; gap: 24px; min-height: 112px; padding: 0 24px; background: #fff; border: 1px solid #dcdcde; }
.ast-aw-fake-logo { color: #1b1491; font-size: 18px; font-weight: 700; line-height: 0.95; }
.ast-aw-preview-slot { flex: 1 1 auto; min-width: 0; }
.ast-aw-fake-menu { color: #1d2327; font-size: 13px; font-weight: 600; white-space: nowrap; opacity: 0.6; }