/* Genereeritud failist assets/src/jalus.css — ära muuda siin, muuda src-faili ja käivita tools/build-css.py */
/* =====================================================================
   HELIX — jalus
   ===================================================================== */

.hx-ft:not(#hx_) {
	--f-accent: var( --hx-accent, var( --helix-plum, #764452 ) );
	--f-dark:   var( --helix-dark, #2B211E );
	--f-ink:    var( --helix-ink, #1C1C1C );
	--f-soft:   rgba( 255, 255, 255, .62 );
	--f-line:   rgba( 255, 255, 255, .1 );
	--f-ease:   cubic-bezier( .2, .8, .2, 1 );
	--f-pad:    clamp( 18px, 4vw, 64px );

	position: relative;
	width: 100%;
	margin: 0;
	padding: 0 0 0;
	overflow: hidden;
	background: var( --f-dark );
	color: #fff;
	font-family: inherit;
	isolation: isolate;
}

.hx-ft:not(#hx_) *,
.hx-ft:not(#hx_) *::before,
.hx-ft:not(#hx_) *::after { box-sizing: border-box; }

.hx-ft:not(#hx_) a { text-decoration: none; }
.hx-ft-ico:not(#hx_) { width: 18px; height: 18px; flex: 0 0 auto; }

.hx-ft:not(#hx_) a:focus-visible,
.hx-ft:not(#hx_) button:focus-visible,
.hx-ft:not(#hx_) summary:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* Pehme valgus taustal */
.hx-ft:not(#hx_)::before {
	content: "";
	position: absolute;
	top: -20%;
	right: -10%;
	z-index: -1;
	width: 60%;
	height: 80%;
	background: radial-gradient( closest-side, rgba( 118, 68, 82, 0.4 ), transparent ); background: radial-gradient( closest-side, color-mix( in srgb, var( --f-accent ) 40%, transparent ), transparent );
	opacity: .55;
	pointer-events: none;
}

/* --- Nupud --- */
.hx-ft:not(#hx_) .hx-ft-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 54px;
	padding: 0 24px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 700;
	white-space: nowrap;
	transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}

.hx-ft:not(#hx_) .hx-ft-btn--light { background: #fff; color: var( --f-ink ); }
.hx-ft:not(#hx_) .hx-ft-btn--light:hover { background: #fff; color: var( --f-accent ); transform: translateY( -2px ); }
.hx-ft-btn--light:not(#hx_) .hx-ft-ico { color: var( --f-accent ); }
.hx-ft:not(#hx_) .hx-ft-btn--ghost { border-color: rgba( 255, 255, 255, .28 ); color: #fff; }
.hx-ft:not(#hx_) .hx-ft-btn--ghost:hover { border-color: #fff; color: #fff; }

/* =====================================================================
   ÜLESKUTSE
   ===================================================================== */

.hx-ft-cta:not(#hx_) { padding: clamp( 40px, 5vw, 72px ) var( --f-pad ) 0; }

.hx-ft-cta__in:not(#hx_) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 22px 40px;
	max-width: 1440px;
	margin: 0 auto;
}

.hx-ft:not(#hx_) .hx-ft-cta h2 { margin: 0 0 10px; color: #fff; font-size: clamp( 28px, 3.4vw, 50px ); font-weight: 700; line-height: 1.05; letter-spacing: -.02em; text-wrap: balance; }
.hx-ft:not(#hx_) .hx-ft-cta p { max-width: 54ch; margin: 0; color: var( --f-soft ); font-size: 16px; line-height: 1.6; }
.hx-ft-cta__btns:not(#hx_) { display: flex; flex-wrap: wrap; gap: 10px; }

/* =====================================================================
   HELIRIBAD: vasakul kaja, paremal vaikus
   ===================================================================== */

.hx-ft-wave:not(#hx_) {
	position: relative;
	height: clamp( 70px, 9vw, 120px );
	margin: clamp( 30px, 4vw, 56px ) 0 0;
	padding: 0 var( --f-pad );
}

.hx-ft-wave__bars:not(#hx_) {
	display: flex;
	align-items: center;
	gap: clamp( 2px, .35vw, 5px );
	height: 100%;
	max-width: 1440px;
	margin: 0 auto;
}

.hx-ft-wave__bars:not(#hx_) i {
	flex: 1 1 0;
	min-width: 2px;
	height: var( --h, 20% );
	border-radius: 4px;
	background: linear-gradient( to top, #9F7C86, rgba( 255, 255, 255, .55 ) ); background: linear-gradient( to top, color-mix( in srgb, var( --f-accent ) 70%, #fff ), rgba( 255, 255, 255, .55 ) );
	opacity: .55;
	transform-origin: center;
}

.hx-ft.is-live:not(#hx_) .hx-ft-wave__bars i { animation: hx-ft-eq 1.6s ease-in-out var( --d, 0s ) infinite alternate; }

@keyframes hx-ft-eq {
	from { transform: scaleY( .55 ); }
	to   { transform: scaleY( 1 ); }
}

.hx-ft-wave__a:not(#hx_),
.hx-ft-wave__b:not(#hx_) {
	position: absolute;
	bottom: -22px;
	color: rgba( 255, 255, 255, .4 );
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
}

.hx-ft-wave__a:not(#hx_) { left: var( --f-pad ); }
.hx-ft-wave__b:not(#hx_) { right: var( --f-pad ); color: rgba( 255, 255, 255, .7 ); }

/* =====================================================================
   PÕHIOSA
   ===================================================================== */

.hx-ft-main:not(#hx_) {
	display: grid;
	grid-template-columns: minmax( 260px, 1fr ) minmax( 0, 2fr );
	gap: clamp( 28px, 5vw, 80px );
	max-width: 1440px;
	margin: 0 auto;
	padding: clamp( 50px, 6vw, 80px ) var( --f-pad ) clamp( 30px, 4vw, 50px );
}

.hx-ft-logo:not(#hx_) { display: inline-block; margin-bottom: 18px; color: #fff; font-size: 28px; font-weight: 700; }
.hx-ft:not(#hx_) .hx-ft-logo img { display: block; width: auto; max-width: 220px; height: 64px; object-fit: contain; object-position: left center; }
.hx-ft:not(#hx_) .hx-ft-brand > p { max-width: 36ch; margin: 0 0 22px; color: var( --f-soft ); font-size: 15px; line-height: 1.6; }

.hx-ft-contact:not(#hx_) { display: grid; gap: 8px; margin-bottom: 18px; }

.hx-ft:not(#hx_) .hx-ft-contact a {
	display: inline-flex;
	align-items: center;
	justify-self: start;
	gap: 12px;
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	transition: color .2s;
}

.hx-ft-contact:not(#hx_) .hx-ft-ico { width: 38px; height: 38px; padding: 10px; border-radius: 12px; background: rgba( 255, 255, 255, .08 ); transition: background-color .2s, color .2s; }
.hx-ft:not(#hx_) .hx-ft-contact a:hover { color: #fff; }
.hx-ft-contact:not(#hx_) a:hover .hx-ft-ico { background: #fff; color: var( --f-accent ); }

.hx-ft-social:not(#hx_) { display: flex; gap: 8px; }

.hx-ft:not(#hx_) .hx-ft-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var( --f-line );
	border-radius: 50%;
	color: #fff;
	transition: background-color .2s, color .2s, transform .2s, border-color .2s;
}

.hx-ft:not(#hx_) .hx-ft-social a:hover { border-color: #fff; background: #fff; color: var( --f-accent ); transform: translateY( -2px ); }
.hx-ft-social:not(#hx_) .hx-ft-ico { width: 19px; height: 19px; }

/* Veerud */
.hx-ft-cols:not(#hx_) { display: grid; grid-template-columns: repeat( auto-fit, minmax( 170px, 1fr ) ); gap: 28px; }

.hx-ft-col:not(#hx_) summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 16px;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	list-style: none;
	cursor: default;
	pointer-events: none;
}

.hx-ft-col:not(#hx_) summary::-webkit-details-marker { display: none; }
.hx-ft-col:not(#hx_) summary i { display: none; }

.hx-ft:not(#hx_) .hx-ft-col ul { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; }
.hx-ft:not(#hx_) .hx-ft-col li { margin: 0; padding: 0; }

.hx-ft:not(#hx_) .hx-ft-col a {
	position: relative;
	display: inline-block;
	color: var( --f-soft );
	font-size: 14.5px;
	line-height: 1.4;
	transition: color .2s, transform .25s var( --f-ease );
}

.hx-ft:not(#hx_) .hx-ft-col a::before {
	content: "";
	position: absolute;
	left: -14px;
	top: 50%;
	width: 6px;
	height: 6px;
	margin-top: -3px;
	border-radius: 50%;
	background: var( --f-accent );
	opacity: 0;
	transform: scale( 0 );
	transition: opacity .2s, transform .25s var( --f-ease );
}

.hx-ft:not(#hx_) .hx-ft-col a:hover { color: #fff; transform: translateX( 4px ); }
.hx-ft:not(#hx_) .hx-ft-col a:hover::before { opacity: 1; transform: none; }

/* =====================================================================
   MAKSE + ALLRIBA
   ===================================================================== */

.hx-ft-pay:not(#hx_) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 24px;
	max-width: calc( 1440px - 2 * var( --f-pad ) );
	margin: 0 auto;
	padding: 18px 0;
	border-top: 1px solid var( --f-line );
	width: calc( 100% - 2 * var( --f-pad ) );
}

.hx-ft-pay:not(#hx_) > span:first-child { display: inline-flex; align-items: center; gap: 8px; color: var( --f-soft ); font-size: 13.5px; }
.hx-ft-pay:not(#hx_) > span:first-child .hx-ft-ico { width: 16px; height: 16px; color: #3DD68C; }
.hx-ft-pay__logos:not(#hx_) { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.hx-ft:not(#hx_) .hx-ft-pay__logos img { width: auto; height: 22px; max-width: 110px; object-fit: contain; opacity: .85; transition: opacity .2s; }
.hx-ft:not(#hx_) .hx-ft-pay__logos img:hover { opacity: 1; }

.hx-ft-bottom:not(#hx_) {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px var( --f-pad ) 22px;
	background: rgba( 0, 0, 0, .18 );
}

.hx-ft:not(#hx_) .hx-ft-bottom p { display: flex; flex-wrap: wrap; gap: 4px 16px; max-width: 1440px; margin: 0; color: rgba( 255, 255, 255, .5 ); font-size: 13px; }
.hx-ft-bottom:not(#hx_) p span::before { content: "·"; margin-right: 16px; }

.hx-ft:not(#hx_) .hx-ft-top {
	position: relative;
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba( 255, 255, 255, .06 );
	box-shadow: none;
	color: #fff;
	cursor: pointer;
	transition: background-color .2s, color .2s;
}

.hx-ft:not(#hx_) .hx-ft-top:hover { background: #fff; color: var( --f-accent ); }
.hx-ft-top:not(#hx_) .hx-ft-ico { transition: transform .25s var( --f-ease ); }
.hx-ft-top:hover:not(#hx_) .hx-ft-ico { transform: translateY( -3px ); }

.hx-ft-top__ring:not(#hx_) { position: absolute; inset: 0; width: 48px; height: 48px; transform: rotate( -90deg ); }
.hx-ft-top__ring:not(#hx_) circle { fill: none; stroke: rgba( 255, 255, 255, .15 ); stroke-width: 2; }
.hx-ft-top__ring:not(#hx_) circle + circle { stroke: #AD8F97; stroke: color-mix( in srgb, var( --f-accent ) 60%, #fff ); stroke-linecap: round; transition: stroke-dashoffset .1s linear; }

/* =====================================================================
   TELEFON
   ===================================================================== */

@media ( max-width: 900px ) {
	.hx-ft-main:not(#hx_) { grid-template-columns: 1fr; }
}

@media ( max-width: 767px ) {

	.hx-ft-cta__btns:not(#hx_),
	.hx-ft-cta__btns:not(#hx_) .hx-ft-btn { width: 100%; justify-content: center; }
	.hx-ft-wave:not(#hx_) { height: 60px; }

	.hx-ft-cols:not(#hx_) { grid-template-columns: 1fr; gap: 0; }
	.hx-ft-col:not(#hx_) { border-bottom: 1px solid var( --f-line ); }
	.hx-ft-col:not(#hx_) summary { margin: 0; padding: 16px 0; cursor: pointer; pointer-events: auto; }
	.hx-ft-col:not(#hx_) summary i { position: relative; display: block; width: 12px; height: 12px; }
	.hx-ft-col:not(#hx_) summary i::before,
	.hx-ft-col:not(#hx_) summary i::after { content: ""; position: absolute; top: 5px; left: 0; width: 12px; height: 2px; border-radius: 2px; background: #fff; transition: transform .3s var( --f-ease ); }
	.hx-ft-col:not(#hx_) summary i::after { transform: rotate( 90deg ); }
	.hx-ft-col[open]:not(#hx_) summary i::after { transform: none; }
	.hx-ft:not(#hx_) .hx-ft-col ul { padding: 0 0 16px; }

	.hx-ft-bottom:not(#hx_) { align-items: flex-end; }
}

@media ( prefers-reduced-motion: reduce ) {
	.hx-ft.is-live:not(#hx_) .hx-ft-wave__bars i { animation: none; }
	.hx-ft:not(#hx_) * { transition-duration: .01ms !important; }
}

/* v2.22: tume režiimi lüliti jaluse all */
.hx-ft-bottom__acts:not(#hx_) { display: flex; flex: 0 0 auto; align-items: center; gap: 10px; }
.hx-ft:not(#hx_) .hx-ft-theme { width: 44px; height: 44px; border: 1px solid rgba( 255, 255, 255, .18 ); }

/* v2.25: kodu vaates üleskutset pole — kast kaob täielikult */
html.hx-view-kodu:not(#hx_) .hx-ft-cta--ari { display: none; }