/*
Theme Name: Blocksy Child
Template: blocksy
Description: Havarijná služba Voda – Vortech s.r.o. (havarijnasluzba24.sk)
Version: 1.0.1
*/

/* =========================================================================
   VORTECH – dizajnový systém (prefix vt-)
   - Iba vlastné triedy, žiadne triedy Elementoru ani Blocksy; !important iba pri
     vypnutí animácií (prefers-reduced-motion).
   - Nezávislé od kontajnera (Elementor v3 aj atomic): sekcia si rieši pozadie
     na celú šírku, odsadenia aj šírku obsahu sama.
   - Písmo a veľkosti H1–H3 určuje téma. Komponenty používajú iba relatívne em.
   - Tmavá sekcia/box = trieda .vt-dark (iba prepne tokeny).
   ========================================================================= */

/* ---------- 1. TOKENY ---------- */
:root {
	--vt-blue: #0082CD;      /* farba loga – ikony, značky, markery */
	--vt-blue-d: #0074B8;    /* odkazy, modrý text (AA kontrast) */
	--vt-blue-dd: #005C93;
	--vt-ink: #071E30;       /* tmavá – nadpisy, tmavé plochy */
	--vt-ink-2: #0E2D45;
	--vt-orange: #FF8A3D;    /* akcent na tmavom */
	--vt-cta: #C8470F;       /* tlačidlá (biely text 4,8 : 1) */
	--vt-cta-h: #A63A0A;
	--vt-ice: #F4F8FB;       /* svetlé pozadie sekcií */
	--vt-tint: #E3F2FB;
	--vt-tint-2: #EEF5FA;
	--vt-line: #E2EBF2;
	--vt-green: #1FB971;
	--vt-star: #FBBC04;
	--vt-r-sm: 8px;
	--vt-r: 10px;
	--vt-r-md: 14px;
	--vt-r-lg: 20px;
	--vt-r-xl: 24px;
	--vt-shadow: 0 30px 60px -36px rgba(7, 30, 48, .45);
	--vt-gap: clamp(16px, 2vw, 24px);
	--vt-pad: clamp(64px, 8vw, 112px);
	--vt-max: 1240px;
	--vt-ease: cubic-bezier(.3, 1.4, .5, 1);
	/* grafika (jediný výskyt) */
	--vt-vortex: url("data:image/svg+xml,%3Csvg fill='%23fff' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 213 168'%3E%3Cpath d='M0 30.6l0 3.6c0.7,1.5 0.1,2.2 2.6,6.2 2.2,3.5 5.5,6.4 9.3,8.6 2.1,1.2 3.7,1.9 5.9,3.0 8.4,3.8 17.4,6.7 27.0,9.2 19.1,4.8 45.0,7.1 65.7,6.5 18.2,-0.5 32.4,-0.2 50.3,-3.7 5.1,-1.0 10.4,-1.6 15.6,-2.6 4.8,-0.9 9.6,-2.4 14.3,-3.6 2.4,-0.6 4.4,-1.5 6.8,-2.1 2.5,-0.5 4.6,-1.2 7.0,-2 4.5,-1.5 8.5,-3.5 11.9,-6.0 7.7,-5.4 6.1,-6.7 8.1,-10.1l0 -3.8c-0.8,-1.5 -0.8,-2.7 -2.0,-4.4 -8.1,-11.7 -36.6,-18.7 -49.3,-20.8 -3.7,-0.6 -7.4,-1.1 -11.1,-1.5 -1.9,-0.2 -3.9,-0.3 -5.9,-0.5 -2.3,-0.1 -4.1,-0.7 -5.3,0.7 0.9,0.8 0.4,0.8 2.1,1.1 7.1,1.2 12.6,1.8 19.9,3.8 9.3,2.5 31.7,10.3 33.4,21.0 0.6,4.2 -1.6,7.6 -3.4,9.7 -1.3,1.5 -5.2,4.6 -8.1,5.3 -1.7,-3.3 1.1,-10.7 -14.3,-17.8 -8.4,-3.9 -16.0,-5.3 -26.5,-5.2 -0.3,1.2 1.6,1.6 2.6,2.1 7.2,3.5 26.7,10.3 24.3,18.7 -1.5,5.3 -13.3,10.8 -17.9,10.9 0.2,-2.9 3.3,-4.8 0.9,-9.1 -3.3,-6.0 -18.3,-9.1 -24.9,-9.4 6.1,4.2 19.5,5.3 16.9,13.9 -2.9,9.6 -30.7,11.6 -40.1,11.6 -12.2,0.0 -25.7,-1.2 -36.5,-5.1 -2.6,-0.9 -4.6,-2.3 -6.7,-3.7 -1.8,-1.2 -4.0,-2.8 -4.1,-6.0 -0.1,-4.4 3.9,-6.9 6.6,-9 0.9,-0.7 2.1,-1.4 2.7,-2.2 -5.5,-0.5 -10.7,1.5 -13.9,4.0 -3.8,2.9 -4.8,6.8 -4.2,13.0 -1.7,-0.5 -5.1,-2.4 -6.5,-3.3 -3.3,-2.0 -8.3,-6.4 -8.5,-10.7 -0.2,-5.5 11.0,-11.5 15.1,-13.6 1.9,-0.9 11.3,-5.5 11.5,-7.3 -3.5,0.0 -10.8,1.7 -14.3,2.6 -4.5,1.1 -8.5,2.5 -12.4,4.5 -4.1,2.0 -7.2,4.3 -9.6,7.3 -4.3,5.1 -3.7,9.9 -4.7,11.8 -1.6,-0.9 -5.7,-4.8 -6.8,-6.3 -1.7,-2.2 -3.8,-5.1 -3.9,-9.0 -0.5,-12.1 19.3,-20.5 28.6,-23.5 3.4,-1.1 6.4,-2.0 9.9,-3.0 1.7,-0.4 3.6,-0.7 5.2,-1.2 1.7,-0.5 3.0,-1.4 4.7,-1.8l-0.0 -0.9 -1.0 0c-1.0,0.4 -8.7,1.2 -10.6,1.5 -15.5,2.4 -46.4,10.4 -54.3,24.8 -0.8,1.5 -1.0,3.1 -1.6,4.3z'/%3E%3Cpath d='M101.2 84.9c-15.1,0 -26.4,-0.3 -41.5,-3.3 -5.1,-1.0 -10.2,-2.4 -15.0,-3.9 -2.0,-0.6 -13.1,-5.0 -13.7,-4.9l3.3 6.0c5.5,6.5 11.1,8.0 20.1,9.8 37.0,7.3 72.9,4.3 109.1,-6.5 13.6,-4.0 35.4,-9.8 44.1,-21.8 1.4,-1.9 1.5,-2.5 2.5,-4.4 0.4,-0.8 0.7,-1 0.4,-1.6l-0.4 -0.0c-1.0,0.2 -9.8,5.3 -10.8,5.8 -13.1,7.5 -22.2,10.9 -37.4,15.2 -9.1,2.6 -18.9,5.0 -28.7,6.5 -9.9,1.5 -21.8,3.1 -32.1,3.1z'/%3E%3Cpath d='M86.2 106.5c22.4,0 47.6,-0.7 68.4,-5.9 9.3,-2.3 19.7,-5.6 27.2,-10.0 6.7,-3.8 16.3,-10.3 19.8,-17.2 -3.2,0.7 -8.9,3.0 -11.8,4.4 -3.8,1.7 -7.1,3.5 -10.9,5.3 -7.3,3.4 -15.7,5.8 -24,8.2 -25.9,7.7 -58.5,13.0 -86.1,6.4 -9.9,-2.3 -13.5,-5.1 -19.8,-7.0 0.7,7.3 6.2,11.0 12.3,13.3 7.2,2.7 16.7,2.4 24.9,2.4z'/%3E%3Cpath d='M76.7 75.4c23.1,0 34.7,-0.7 58.3,-3.8 -11.1,-3.7 -22.4,0.2 -34.1,0.2 -8.7,0 -18.1,-0.9 -26.7,-1.5 -8.4,-0.5 -16.9,-1.6 -25.0,-3.2 -18.2,-3.6 -31.5,-8.9 -45.7,-17.7 -2.9,-1.8 -2.1,-0.6 -1.1,1.6 1.1,2.5 2.2,4.5 3.9,6.6 4.8,6.1 13.5,9.2 20.7,11.2 16.5,4.4 31.6,6.7 49.7,6.7z'/%3E%3Cpath d='M110.7 122.6c14.0,0 33.7,-5.1 45.1,-13.6l3.5 -2.7c0.8,-0.6 0.7,-0.2 0.8,-1.1 -0.5,-0.2 -0.1,-0.2 -1.0,-0.2 -14.4,0 -29.5,9.5 -44.7,9.5 -8.6,0 -19.7,-0.3 -28.4,-0.7 -2.6,-0.1 -6.1,-0.5 -8.6,-0.4 0.4,0.3 0.7,0.8 1.3,1.2 8.2,6.7 21.7,8.1 32.0,8.1z'/%3E%3Cpath d='M137.9 51.1c-5.2,-2.9 -21.2,-4.3 -28.4,-4.1 -4.4,0.1 -28.4,1.2 -23.2,7.6 3.9,4.8 32.6,6.7 42.5,3.6 3.9,-1.2 8.2,-3.6 9.1,-7.1z'/%3E%3Cpath d='M89.4 126.6c1,1.5 4.4,3.8 6.8,4.9 14.3,6.4 33.7,4.9 46.6,-3.1 3.9,-2.4 10.5,-7.1 10.8,-12.1 -0.7,0.1 -5.1,2.4 -6.3,2.9 -19.2,8.6 -37.3,6.9 -58.0,7.3z'/%3E%3Cpath d='M101.9 139.1c0.1,1.0 0.1,0.5 0.9,1.2 7.5,6.0 15.4,8.1 25.5,6.0 4.9,-1.0 8.7,-2.9 12.1,-5.3 3.9,-2.8 7.2,-5.3 7.2,-10.2 -1.6,0.5 -3.1,1.5 -4.7,2.3 -1.5,0.7 -3.0,1.3 -4.7,1.9 -11.0,4.0 -33.5,2.3 -36.4,4.0z'/%3E%3Cpath d='M121.7 167.4l0.2 0c0.5,-0.6 1.9,-1.4 2.6,-2.0l5.0 -4.2c3.2,-2.9 8.5,-9.5 9.5,-13.6 -13.1,3.3 -14.8,4.0 -29.1,3.7 0.6,1.3 2.3,3.1 3.2,3.9 3.7,3.6 7.2,6.0 8.3,12.1z'/%3E%3C/svg%3E");
	--vt-kg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='16' viewBox='0 0 180 16'%3E %3Cdefs%3E %3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E %3Cstop offset='0' stop-color='%23FFC08F'/%3E%3Cstop offset='.22' stop-color='%23FF9A52'/%3E%3Cstop offset='.55' stop-color='%23F07A2E'/%3E%3Cstop offset='.85' stop-color='%23C85A18'/%3E%3Cstop offset='1' stop-color='%239E4410'/%3E %3C/linearGradient%3E %3ClinearGradient id='r' x1='0' y1='0' x2='0' y2='1'%3E %3Cstop offset='0' stop-color='%23FFD2AE'/%3E%3Cstop offset='.5' stop-color='%23F58A44'/%3E%3Cstop offset='1' stop-color='%23B9500F'/%3E %3C/linearGradient%3E %3C/defs%3E %3Crect x='20' y='3' width='155' height='10' fill='url(%23g)'/%3E %3Crect x='20' y='4.6' width='155' height='1.2' fill='%23fff' opacity='.45'/%3E %3Crect x='1' y='0.5' width='23' height='15' rx='2' fill='url(%23g)'/%3E %3Crect x='1' y='2.4' width='23' height='1.4' fill='%23fff' opacity='.5'/%3E %3Crect x='23' y='1.5' width='1.4' height='13' fill='%23A9480F' opacity='.55'/%3E %3Cellipse cx='1.6' cy='8' rx='1.6' ry='7.5' fill='%23E8742A'/%3E %3Cellipse cx='175' cy='8' rx='2.6' ry='5' fill='url(%23r)'/%3E %3Cellipse cx='175.2' cy='8' rx='1.7' ry='3.9' fill='%232B1307'/%3E %3C/svg%3E");
	--vt-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='10' viewBox='0 0 60 10'%3E%3Cpath fill='%233E9FDA' d='M0 5 Q15 0 30 5 T60 5 V10 H0Z'/%3E%3C/svg%3E");
	--vt-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
	--vt-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E");
}

/* kontextové tokeny – menia sa v .vt-dark */
.vt-sec, .vt-dark {
	--vt-bg: #fff;
	--vt-fg: #475D6F;
	--vt-h: var(--vt-ink);
	--vt-muted: #546B7E;
	--vt-link: var(--vt-blue-d);
	--vt-eyebrow: var(--vt-blue-dd);
	--vt-chip: var(--vt-tint-2);
	--vt-chip-t: #2F4557;
	--vt-sline: var(--vt-line);
}
.vt-sec--light { --vt-bg: var(--vt-ice); }
.vt-dark {
	--vt-bg: var(--vt-ink);
	--vt-fg: #A3B8C8;
	--vt-h: #fff;
	--vt-muted: #7F9AAE;
	--vt-link: #9FD3F2;
	--vt-eyebrow: #9FD3F2;
	--vt-chip: #123049;
	--vt-chip-t: #D6ECF8;
	--vt-sline: #1B3A52;
	background: var(--vt-bg);
	color: var(--vt-fg);
}

/* ---------- 2. ZÁKLAD SEKCIE ---------- */
/* pozadie na celú šírku bez 100vw (žiadny vodorovný scroll) */
.vt-sec {
	position: relative;
	padding-block: var(--vt-pad);
	color: var(--vt-fg);
	border-image: conic-gradient(var(--vt-bg) 0 0) fill 0 // 0 100vw;
}
.vt-in {
	max-width: var(--vt-max);
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 40px);
}
.vt-sec :where(h1, h2, h3, h4) { margin: 0; color: var(--vt-h); }
.vt-sec :where(p, ul, ol, dl, dd, figure, blockquote, fieldset) { margin: 0; }
.vt-sec :where(img) { display: block; max-width: 100%; height: auto; }
.vt-sec :where(figcaption) { margin: 0; font-size: inherit; text-align: inherit; color: inherit; }
.vt-sec :where(a) { color: var(--vt-link); }
/* odkaz v texte nesmie byť rozlíšený iba farbou (WCAG 1.4.1, Lighthouse) */
/* vyššia špecificita zámerne – prebije štýl odkazov z Blocksy (Customizer → typ odkazu) */
.vt-sec .vt-in :is(p, dd, blockquote, .vt-faq__a li) a:not([class]) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.vt-sec .vt-in :is(p, dd, blockquote, .vt-faq__a li) a:not([class]):hover { text-decoration-thickness: 2px; }
.vt-flow > * + * { margin-top: 1.1em; }
.vt-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* hlavička sekcie */
.vt-head {
	display: grid;
	justify-items: center;
	gap: 16px;
	max-width: 820px;
	margin: 0 auto clamp(36px, 5vw, 56px);
	text-align: center;
}

/* štítok sekcie: vír z loga + 3D KG rúra s tečúcou vodou */
.vt-eyebrow {
	display: inline-grid;
	grid-template-columns: auto auto;
	column-gap: 12px;
	row-gap: 7px;
	align-items: center;
	justify-items: start;
	margin-bottom: 4px;
	font-size: .8em;
	font-weight: 800;
	letter-spacing: .12em;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--vt-eyebrow);
}
.vt-eyebrow::before {
	content: "";
	grid-row: 1 / 3;
	width: 36px;
	height: 29px;
	background: var(--vt-blue);
	-webkit-mask: var(--vt-vortex) center / contain no-repeat;
	mask: var(--vt-vortex) center / contain no-repeat;
}
.vt-eyebrow::after {
	content: "";
	grid-column: 2;
	grid-row: 2;
	width: 180px;
	height: 16px;
	background:
		linear-gradient(90deg, transparent, rgba(255, 255, 255, .75), transparent) 24px 50% / 36px 6px no-repeat,
		var(--vt-kg) 0 0 / 180px 16px no-repeat;
	animation: vt-flow 2.6s linear infinite;
}

/* drobnosti */
.vt-accent { color: var(--vt-blue-d); }
.vt-dark .vt-accent { color: #9FD3F2; }
.vt-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--vt-green); box-shadow: 0 0 0 3px rgba(31, 185, 113, .3); }
.vt-stars { color: var(--vt-star); letter-spacing: 2px; }
.vt-kick {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
	border-radius: var(--vt-r-sm);
	background: var(--vt-tint-2);
	font-size: .875em;
	font-weight: 700;
	color: #2F4557;
}
.vt-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.vt-chips li { padding: 8px 16px; border-radius: var(--vt-r-sm); background: var(--vt-chip); color: var(--vt-chip-t); font-weight: 700; }
.vt-tag { display: inline-block; padding: 10px 20px; border: 1px solid var(--vt-sline); border-radius: var(--vt-r); font-weight: 700; color: var(--vt-eyebrow); }

/* ---------- 3. IKONY (mask, farba = currentColor) ---------- */
.vt-ic {
	display: inline-block;
	flex: none;
	width: 26px;
	height: 26px;
	background: currentColor;
	-webkit-mask: var(--i) center / contain no-repeat;
	mask: var(--i) center / contain no-repeat;
}
.vt-ibox {
	display: grid;
	place-items: center;
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: var(--vt-r-md);
	background: var(--vt-tint);
	color: var(--vt-blue);
}
.vt-ic--clock{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
.vt-ic--car{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17h2a2 2 0 1 0 4 0h2a2 2 0 1 0 4 0h2v-5l-3-5H5Z'/%3E%3C/svg%3E")}
.vt-ic--drop{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.7 6.3 9.4a7 7 0 1 0 11.4 0Z'/%3E%3C/svg%3E")}
.vt-ic--nodiy{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94Z'/%3E%3Cpath d='M3 3l18 18'/%3E%3C/svg%3E")}
.vt-ic--shield{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E")}
.vt-ic--pin{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E")}
.vt-ic--timer{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='8'/%3E%3Cpath d='M12 9v4l2 2M10 2h4'/%3E%3C/svg%3E")}
.vt-ic--krtko{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0 5 5L22 14l-8 8-2.3-2.3a4 4 0 0 0-5-5L4 12l8-8Z'/%3E%3C/svg%3E")}
.vt-ic--jet{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h10M13 8v8M17 9l4-2M17 12h4M17 15l4 2'/%3E%3C/svg%3E")}
.vt-ic--kan{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 8h8v8h12'/%3E%3Cpath d='M6 8V4M18 16v4'/%3E%3C/svg%3E")}
.vt-ic--plumb{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10h6V4h10'/%3E%3Ccircle cx='20' cy='4' r='1'/%3E%3C/svg%3E")}
.vt-ic--camera{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='6' width='14' height='12' rx='2'/%3E%3Cpath d='m16 10 6-3v10l-6-3'/%3E%3C/svg%3E")}
.vt-ic--leak{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 8c2-2 4-2 6 0s4 2 6 0 4-2 6 0M2 14c2-2 4-2 6 0s4 2 6 0 4-2 6 0'/%3E%3C/svg%3E")}
.vt-ic--vodovod{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12h20M6 8v8M18 8v8'/%3E%3C/svg%3E")}
.vt-ic--award{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='6'/%3E%3Cpath d='m8.5 14 -1.5 8 5-3 5 3-1.5-8'/%3E%3C/svg%3E")}

/* ---------- 4. TLAČIDLÁ ---------- */
.vt-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; margin-top: 40px; }
.vt-btn {
	display: inline-flex;
	align-items: center;
	min-height: 54px;
	padding: 0 26px;
	border: 2px solid var(--vt-blue-dd);
	border-radius: var(--vt-r);
	background: var(--vt-tint);
	color: var(--vt-blue-dd);
	font-weight: 800;
	text-decoration: none;
	transition: background .2s;
}
.vt-btn:hover { background: var(--vt-blue-dd); color: #fff; }
.vt-dark .vt-btn { border-color: #9FD3F2; background: transparent; color: #fff; }
.vt-dark .vt-btn:hover { background: #fff; color: var(--vt-ink); }
.vt-btn--ext::after { content: "↗"; margin-left: 10px; font-weight: 700; }

/* telefónne tlačidlo [vt_volat] – sonar + zaplavenie pri hoveri */
.vt-call {
	position: relative;
	z-index: 1;
	isolation: isolate;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	gap: 16px;
	min-height: 64px;
	padding: 7px 22px 7px 7px;
	border-radius: var(--vt-r-md);
	background: var(--vt-ink);
	color: #fff;
	text-decoration: none;
	box-shadow: 0 16px 32px -18px rgba(7, 30, 48, .9);
	transition: transform .35s var(--vt-ease);
}
.vt-call:hover { color: #fff; }
.vt-dark .vt-call { background: var(--vt-ink-2); box-shadow: inset 0 0 0 1px #2A4A63; }
.vt-call__fill {
	position: absolute;
	z-index: -1;
	left: 7px;
	top: 50%;
	width: 50px;
	height: 50px;
	margin-top: -25px;
	border-radius: 50%;
	background: var(--vt-cta);
	transition: transform .65s cubic-bezier(.6, .05, .25, 1);
}
.vt-call:hover .vt-call__fill { transform: scale(9); }
.vt-call__ic { position: relative; flex: none; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; }
.vt-call__ic::before,
.vt-call__ic::after {
	content: "";
	position: absolute;
	inset: 0;
	border: 2px solid var(--vt-orange);
	border-radius: 50%;
	animation: vt-sonar 2.2s cubic-bezier(.2, .6, .3, 1) infinite;
}
.vt-call__ic::after { animation-delay: 1.1s; }
.vt-call:hover .vt-call__ic::before,
.vt-call:hover .vt-call__ic::after { border-color: #fff; }
.vt-call:hover .vt-call__ic svg { animation: vt-ring .7s ease-in-out; }
.vt-call__tx { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.vt-call__tx small {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: .65em;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #9FD3F2;
	transition: color .3s;
}
.vt-call:hover .vt-call__tx small { color: #fff; }
.vt-call__tx b { font-size: 1.25em; font-weight: 800; letter-spacing: -.01em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.vt-call__dot { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--vt-green); }
.vt-call__dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--vt-green); animation: vt-pulse 1.8s ease-out infinite; }
.vt-call__arr { margin-left: 6px; font-weight: 700; opacity: .5; transition: transform .35s, opacity .35s; }
.vt-call:hover .vt-call__arr { transform: translateX(5px); opacity: 1; }
.vt-call--sm { min-height: 54px; padding: 5px 18px 5px 5px; gap: 12px; }
.vt-call--sm .vt-call__ic, .vt-call--sm .vt-call__fill { width: 44px; height: 44px; }
.vt-call--sm .vt-call__fill { left: 5px; margin-top: -22px; }
.vt-call--sm .vt-call__tx b { font-size: 1.1em; }
.vt-call--sm .vt-call__arr { display: none; }
.vt-call--lg { min-height: 80px; padding: 9px 30px 9px 9px; gap: 18px; }
.vt-call--lg .vt-call__ic, .vt-call--lg .vt-call__fill { width: 62px; height: 62px; }
.vt-call--lg .vt-call__fill { left: 9px; margin-top: -31px; }
.vt-call--lg .vt-call__tx b { font-size: 1.65em; }

/* zásuvky [vt_volat stitky="1"] – štítky hore/dole + rohy „hľadáčika“ */
.vt-cta { --vt-br: var(--vt-blue); position: relative; display: inline-flex; isolation: isolate; }
.vt-cta::before {
	content: "";
	position: absolute;
	inset: -16px;
	pointer-events: none;
	opacity: 0;
	transform: scale(1.1);
	transition: opacity .35s, transform .45s var(--vt-ease);
	background:
		linear-gradient(var(--vt-br) 0 0) 0 0 / 20px 2px no-repeat, linear-gradient(var(--vt-br) 0 0) 0 0 / 2px 20px no-repeat,
		linear-gradient(var(--vt-br) 0 0) 100% 0 / 20px 2px no-repeat, linear-gradient(var(--vt-br) 0 0) 100% 0 / 2px 20px no-repeat,
		linear-gradient(var(--vt-br) 0 0) 0 100% / 20px 2px no-repeat, linear-gradient(var(--vt-br) 0 0) 0 100% / 2px 20px no-repeat,
		linear-gradient(var(--vt-br) 0 0) 100% 100% / 20px 2px no-repeat, linear-gradient(var(--vt-br) 0 0) 100% 100% / 2px 20px no-repeat;
}
.vt-cta:hover::before { opacity: 1; transform: none; }
.vt-cta:hover .vt-call { transform: scale(1.04); }
.vt-cta__tag {
	position: absolute;
	z-index: -1;
	padding: 5px 12px;
	border-radius: 7px;
	font-size: .7em;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	white-space: nowrap;
	pointer-events: none;
	transition: transform .45s cubic-bezier(.3, 1.5, .5, 1);
}
.vt-cta__tag--t { top: 4px; left: 18px; background: var(--vt-ink); color: #fff; transform: rotate(-3deg); }
.vt-cta__tag--b { bottom: 4px; right: 18px; background: var(--vt-tint); color: var(--vt-blue-dd); box-shadow: inset 0 0 0 1px #CFE0EC; transform: rotate(2deg); }
.vt-cta:hover .vt-cta__tag--t { transform: translateY(-27px) rotate(-3deg); }
.vt-cta:hover .vt-cta__tag--b { transform: translateY(27px) rotate(2deg); }

/* ---------- 5. GOOGLE HODNOTENIE [vt_google] ---------- */
.vt-google { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; color: inherit; text-decoration: none; font-weight: 700; }
.vt-google__val { font-size: 1.3em; color: var(--vt-h, var(--vt-ink)); }
.vt-google__stars { color: var(--vt-star); letter-spacing: 1px; }
.vt-google__lbl { font-size: .8em; color: var(--vt-muted, #546B7E); }
.vt-google__sep { align-self: stretch; width: 1px; margin: 0 6px; background: var(--vt-line); }
.vt-google__exp { font-size: .8em; color: var(--vt-muted, #546B7E); }
.vt-google__exp b { margin-right: 2px; font-size: 1.6em; line-height: 1; color: var(--vt-h, var(--vt-ink)); }
.vt-google--exp { gap: 10px; }
.vt-google--exp::before { content: ""; flex: none; width: 26px; height: 26px; background: var(--vt-cta); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.vt-google--ikona { display: grid; place-items: center; flex: none; width: 40px; height: 40px; margin-left: auto; border-radius: var(--vt-r); background: var(--vt-ice); }

/* ---------- 6. HERO ---------- */
/* jemné unikátne pozadie: „sonarové“ kruhy z miesta zásahu + modrá a oranžová žiara */
.vt-hero { --vt-bg: #F7FAFD; --vt-hpad: clamp(56px, 8vh, 96px); isolation: isolate; }
.vt-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(26% 30% at 94% 96%, rgba(255, 138, 61, .18), transparent 70%),
		radial-gradient(55% 65% at 82% 38%, rgba(0, 130, 205, .15), transparent 70%),
		radial-gradient(38% 55% at 0 0, rgba(0, 130, 205, .08), transparent 70%),
		radial-gradient(circle at 76% 52%, rgba(247, 250, 253, 0) 16%, #F7FAFD 56%),
		repeating-radial-gradient(circle at 76% 52%, transparent 0 55px, rgba(0, 130, 205, .1) 55px 56px);
}
.vt-hero__g { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.vt-hero h1 { margin: 24px 0; }
.vt-hero .vt-lead strong { color: var(--vt-h); }
.vt-hero__vis { position: relative; height: clamp(420px, 46vw, 640px); }
.vt-hero__vis > img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--vt-r-xl); }
.vt-float {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	border-radius: var(--vt-r-md);
	background: #fff;
	box-shadow: 0 20px 50px -18px rgba(7, 30, 48, .35);
	font-weight: 700;
	line-height: 1.2;
	color: var(--vt-ink);
}
.vt-float b { display: block; font-size: 1.3em; }
.vt-float small { display: block; font-size: .8em; font-weight: 600; color: #546B7E; }
.vt-float .vt-ibox { width: 46px; height: 46px; }
.vt-float--1 { left: -32px; top: 72px; }
.vt-float--2 { right: -24px; top: 40%; }
.vt-float--2 .vt-ibox { background: #DDF7EA; color: #0E7A4A; }
.vt-float--3 { left: -32px; bottom: 120px; z-index: 3; }
.vt-float--3 .vt-google { flex-wrap: nowrap; white-space: nowrap; }
.vt-float .vt-google__exp b { display: inline; }

/* rotujúca pečať [vt_pecat] */
.vt-seal {
	position: absolute;
	z-index: 2;
	right: -56px;
	bottom: -56px;
	display: grid;
	place-items: center;
	width: 184px;
	height: 184px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 25%, #D6551A 0%, var(--vt-cta) 45%, var(--vt-cta-h) 100%);
	box-shadow: 0 0 0 8px #fff, 0 30px 50px -24px rgba(200, 71, 15, .8);
	text-decoration: none;
	transition: transform .45s var(--vt-ease);
}
.vt-seal__t { position: absolute; inset: 0; width: 100%; height: 100%; animation: vt-spin 24s linear infinite; }
.vt-seal__t text { font-size: 13.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; fill: #fff; }
.vt-seal__c { position: relative; display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: #fff; color: var(--vt-cta); transition: background .35s, color .35s; }
.vt-seal__c::before,
.vt-seal__c::after { content: ""; position: absolute; inset: 0; border: 2px solid #fff; border-radius: 50%; animation: vt-sonar 2.2s cubic-bezier(.2, .6, .3, 1) infinite; }
.vt-seal__c::after { animation-delay: 1.1s; }
.vt-seal:hover { transform: scale(1.07) rotate(-6deg); }
.vt-seal:hover .vt-seal__c { background: var(--vt-ink); color: #fff; }
.vt-seal:hover .vt-seal__c svg { animation: vt-ring .7s ease-in-out; }
.vt-seal:hover .vt-seal__t { animation-duration: 6s; }

/* ---------- 7. DIAGNOSTIKA [vt_diagnostika] – čisté CSS (:has + radio) ---------- */
.vt-dg__tiles { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 14px; min-width: 0; padding: 0; border: 0; }
.vt-dg__t {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: 26px 14px 22px;
	border: 1.5px solid var(--vt-line);
	border-radius: 18px;
	background: var(--vt-ice);
	color: var(--vt-ink);
	font-weight: 700;
	line-height: 1.35;
	text-align: center;
	cursor: pointer;
	transition: transform .25s, border-color .25s, background .25s, color .25s;
}
.vt-dg__t input { position: absolute; opacity: 0; pointer-events: none; }
.vt-dg__ic { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: #fff; color: var(--vt-blue); box-shadow: 0 0 0 1px var(--vt-line); transition: background .25s, color .25s; }
.vt-dg__t:hover { border-color: var(--vt-blue); transform: translateY(-3px); }
.vt-dg__t:has(input:checked) { border-color: var(--vt-ink); background: var(--vt-ink); color: #fff; transform: translateY(-3px); }
.vt-dg__t:has(input:checked) .vt-dg__ic { background: var(--vt-cta); color: #fff; box-shadow: none; }
.vt-dg__t:has(input:checked)::after { content: ""; position: absolute; left: 50%; bottom: -11px; margin-left: -10px; border: 10px solid transparent; border-top-color: var(--vt-ink); border-bottom: 0; }
.vt-dg__t:has(input:focus-visible) { outline: 3px solid var(--vt-blue); outline-offset: 3px; }
.vt-dg__panels { margin-top: 28px; }
.vt-dg__p0 { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 26px; border: 1.5px dashed #CFE0EC; border-radius: var(--vt-r-lg); color: #546B7E; font-weight: 600; }
.vt-dg__p { display: none; grid-template-columns: 1.1fr 1.3fr 1fr; overflow: hidden; border: 1px solid var(--vt-line); border-radius: var(--vt-r-xl); background: #fff; box-shadow: 0 40px 80px -50px rgba(7, 30, 48, .5); animation: vt-pop .45s var(--vt-ease); }
.vt-dg:has(input:checked) .vt-dg__p0 { display: none; }
.vt-dg:has(input[value="1"]:checked) .vt-dg__p--1,
.vt-dg:has(input[value="2"]:checked) .vt-dg__p--2,
.vt-dg:has(input[value="3"]:checked) .vt-dg__p--3,
.vt-dg:has(input[value="4"]:checked) .vt-dg__p--4,
.vt-dg:has(input[value="5"]:checked) .vt-dg__p--5,
.vt-dg:has(input[value="6"]:checked) .vt-dg__p--6,
.vt-dg:has(input[value="7"]:checked) .vt-dg__p--7 { display: grid; }
.vt-dg__p > div { padding: clamp(24px, 3vw, 36px); }
.vt-dg__a { background: var(--vt-ink) radial-gradient(120% 80% at 0 0, #0B4468 0, transparent 60%); color: #A3B8C8; }
.vt-dg__a h3 { color: #fff; }
.vt-dg__a p:last-child { margin-top: 14px; }
.vt-dg__b { border-right: 1px solid var(--vt-line); }
.vt-dg__b h4, .vt-dg__c h4 { margin: 0 0 18px; font-size: .8em; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--vt-blue-dd); }
.vt-dg__b ol { display: grid; gap: 14px; padding: 0; list-style: none; counter-reset: vt-dg; }
.vt-dg__b li { display: grid; grid-template-columns: 30px 1fr; gap: 12px; color: #2F4557; counter-increment: vt-dg; }
.vt-dg__b li::before { content: counter(vt-dg); display: grid; place-items: center; width: 30px; height: 30px; border-radius: var(--vt-r-sm); background: var(--vt-tint); color: var(--vt-blue-d); font-weight: 800; }
.vt-dg__c { display: flex; flex-direction: column; gap: 18px; }
.vt-dg__c ul { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.vt-dg__c ul a { display: inline-block; padding: 8px 12px; border-radius: var(--vt-r-sm); background: var(--vt-tint-2); color: var(--vt-blue-dd); font-weight: 700; line-height: 1.3; text-decoration: none; }
.vt-dg__c ul a:hover { background: var(--vt-blue-d); color: #fff; }
.vt-dg__c .vt-call { align-self: flex-start; margin-top: auto; }
.vt-dg__lv { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 7px 14px 7px 8px; border-radius: var(--vt-r); background: var(--vt-ink-2); font-size: .8em; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #fff; }
.vt-dg__sem { display: inline-flex; gap: 5px; padding: 5px 7px; border-radius: var(--vt-r-sm); background: #04121D; }
.vt-dg__sem i { width: 10px; height: 10px; border-radius: 50%; background: #22384A; }
.vt-dg__lv--3 .vt-dg__sem i:nth-child(1) { background: #FF4D4F; box-shadow: 0 0 10px #FF4D4F; animation: vt-blink 1.2s ease-in-out infinite; }
.vt-dg__lv--2 .vt-dg__sem i:nth-child(2) { background: var(--vt-orange); box-shadow: 0 0 10px var(--vt-orange); }
.vt-dg__lv--1 .vt-dg__sem i:nth-child(3) { background: var(--vt-green); box-shadow: 0 0 10px var(--vt-green); }

/* ---------- 8. BLOKY: citát, dva boxy, fotka + text, fajky ---------- */
.vt-quote { max-width: 30ch; font-size: 1.6em; font-weight: 700; line-height: 1.45; letter-spacing: -.02em; color: var(--vt-h); }
.vt-quote::before { content: "„"; color: var(--vt-blue-d); }
.vt-quote::after { content: "“"; color: var(--vt-blue-d); }
.vt-two { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--vt-gap); }
.vt-box { padding: clamp(28px, 3vw, 40px); border: 1px solid var(--vt-line); border-radius: var(--vt-r-lg); background: #fff; }
.vt-box.vt-dark { display: flex; flex-direction: column; justify-content: space-between; gap: 28px; border: 0; background: var(--vt-bg); }
.vt-strong { font-size: 1.2em; font-weight: 700; line-height: 1.5; color: var(--vt-h); }

.vt-media { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 72px); align-items: center; }
.vt-fig img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--vt-r-xl); }

.vt-checks { display: grid; gap: 12px; margin: 28px 0 0; padding: 0; list-style: none; }
.vt-checks li { display: flex; gap: 14px; padding: 16px 18px; border: 1px solid var(--vt-line); border-radius: var(--vt-r-md); background: #fff; font-weight: 600; line-height: 1.5; color: var(--vt-ink); }
.vt-checks li::before { content: ""; flex: none; width: 24px; height: 24px; margin-top: 1px; border-radius: 50%; background: var(--vt-blue-d) var(--vt-check) center / 12px no-repeat; }

/* ---------- 8b. SANÁCIA – text + rez potrubím, metódy, postup ---------- */
.vt-san { display: grid; grid-template-columns: 1.35fr .85fr; gap: clamp(40px, 6vw, 88px); align-items: center; }
.vt-san .vt-chips { margin-top: 28px; }
.vt-san .vt-actions { gap: 16px; }
/* rez potrubím: tmavý prietok, oranžová vložka, spoj živicou, pôvodná rúra s prasklinami */
.vt-liner {
	position: relative;
	width: min(100%, 400px);
	aspect-ratio: 1;
	margin-inline: auto;
	border-radius: 50%;
	background:
		radial-gradient(circle closest-side, #0B3A5C 0, #061827 61.5%, transparent 62%),
		radial-gradient(circle closest-side, transparent 61.5%, #9E4410 62%, #F07A2E 66%, #FFB27A 71%, #F07A2E 76%, #C85A18 80%, transparent 80.5%),
		radial-gradient(circle closest-side, transparent 80%, #FFE2C7 80.5% 82%, transparent 82.5%),
		conic-gradient(transparent 0 38deg, #22323D 38deg 39.5deg, transparent 39.5deg 152deg, #22323D 152deg 153deg, transparent 153deg 236deg, #22323D 236deg 237.5deg, transparent 237.5deg 318deg, #22323D 318deg 319deg, transparent 0),
		radial-gradient(circle closest-side, #8A99A4 82%, #6C7C88 91%, #4E5D68 100%);
	box-shadow: 0 0 0 6px rgba(255, 255, 255, .06), 0 50px 80px -40px #000;
}
/* voda v potrubí */
.vt-liner::before { content: ""; position: absolute; inset: 19%; border-radius: 50%; background: linear-gradient(180deg, transparent 58%, rgba(0, 130, 205, .55) 58%, rgba(0, 92, 147, .8)); }
.vt-liner::after { content: ""; position: absolute; inset: 24% 30% 66%; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.vt-liner__l { position: absolute; z-index: 1; padding: 8px 14px; border-radius: var(--vt-r); background: #fff; box-shadow: 0 16px 32px -16px #000; font-size: .8em; font-style: normal; font-weight: 800; white-space: nowrap; color: var(--vt-ink); }
.vt-liner__l::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 50%; background: #6C7C88; }
.vt-liner__l--1 { top: 4%; right: -6%; }
.vt-liner__l--2 { bottom: 8%; left: -8%; }
.vt-liner__l--2::before { background: var(--vt-orange); }
.vt-san__g { display: grid; gap: clamp(48px, 6vw, 72px); margin-top: clamp(56px, 7vw, 88px); padding-top: clamp(40px, 5vw, 56px); border-top: 1px solid var(--vt-sline); }
.vt-san__g h3 { margin-bottom: 24px; }
.vt-met { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0; list-style: none; counter-reset: vt-met; }
.vt-met li { position: relative; padding: 18px 20px 18px 62px; border: 1px solid var(--vt-sline); border-radius: var(--vt-r-md); background: var(--vt-ink-2); line-height: 1.5; counter-increment: vt-met; }
.vt-met li::before { content: counter(vt-met, decimal-leading-zero); position: absolute; left: 20px; top: 18px; font-weight: 800; color: var(--vt-orange); }
.vt-met strong { display: block; margin-bottom: 2px; color: #fff; }
.vt-steps { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; padding: 0; list-style: none; counter-reset: vt-st; }
/* oranžová rúra cez stredy krúžkov */
.vt-steps::before { content: ""; position: absolute; left: 10%; right: 10%; top: 21px; height: 4px; border-radius: 2px; background: linear-gradient(180deg, #FFB27A, #F07A2E 50%, #C85A18); }
.vt-steps li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 14px; font-weight: 700; line-height: 1.35; text-align: center; color: #fff; counter-increment: vt-st; }
.vt-steps li::before { content: counter(vt-st); flex: none; display: grid; place-items: center; width: 46px; height: 46px; border: 2px solid var(--vt-orange); border-radius: 50%; background: var(--vt-ink); font-weight: 800; color: var(--vt-orange); }

/* ---------- 9. MAPA POKRYTIA [vt_mapa] ---------- */
.vt-area { display: grid; grid-template-columns: 320px 1fr; gap: 40px; margin-top: clamp(48px, 6vw, 72px); padding: clamp(24px, 3.5vw, 44px); border: 1px solid var(--vt-line); border-radius: var(--vt-r-xl); background: #fff; }
.vt-area__l { display: flex; flex-direction: column; gap: 20px; }
/* mini mapa */
.vt-mm { padding: 14px; border: 1px solid var(--vt-line); border-radius: 16px; background: var(--vt-ice); }
.vt-mm svg { display: block; width: 100%; height: auto; overflow: visible; }
.vt-mm__dunaj { fill: none; stroke: #BFE0F4; stroke-width: 12; stroke-linecap: round; }
.vt-mm__dunaj-t { font-size: 10px; font-style: italic; font-weight: 700; fill: var(--vt-blue-d); }
.vt-mm__d circle { fill: var(--vt-blue); stroke: #fff; stroke-width: 2; transition: r .2s, fill .2s; }
.vt-mm__d text { font-size: 10px; font-weight: 700; text-anchor: middle; fill: var(--vt-ink); opacity: 0; paint-order: stroke; stroke: var(--vt-ice); stroke-width: 3px; transition: opacity .2s; }
.vt-mm__b { fill: var(--vt-cta); stroke: #fff; stroke-width: 3; }
.vt-mm__r { fill: none; stroke: var(--vt-orange); stroke-width: 2; transform-box: fill-box; transform-origin: center; animation: vt-sonar 2.4s cubic-bezier(.2, .6, .3, 1) infinite; }
.vt-mm__r--2 { animation-delay: 1.2s; }
.vt-mm__base text { font-size: 10.5px; font-weight: 800; fill: var(--vt-cta); paint-order: stroke; stroke: var(--vt-ice); stroke-width: 3px; }
.vt-mm figcaption { margin-top: 8px; font-size: .75em; font-weight: 600; text-align: center; color: #546B7E; }
.vt-mm__d:hover circle,
.vt-area:has(.is-city:hover) .vt-mm__d circle,
.vt-area:has(.k-lozorno:hover) .vt-mm .k-lozorno circle,
.vt-area:has(.k-borinka:hover) .vt-mm .k-borinka circle,
.vt-area:has(.k-stupava:hover) .vt-mm .k-stupava circle,
.vt-area:has(.k-marianka:hover) .vt-mm .k-marianka circle,
.vt-area:has(.k-zahorska-bystrica:hover) .vt-mm .k-zahorska-bystrica circle,
.vt-area:has(.k-devinska-nova-ves:hover) .vt-mm .k-devinska-nova-ves circle,
.vt-area:has(.k-dubravka:hover) .vt-mm .k-dubravka circle,
.vt-area:has(.k-lamac:hover) .vt-mm .k-lamac circle,
.vt-area:has(.k-nove-mesto:hover) .vt-mm .k-nove-mesto circle,
.vt-area:has(.k-raca:hover) .vt-mm .k-raca circle,
.vt-area:has(.k-vajnory:hover) .vt-mm .k-vajnory circle,
.vt-area:has(.k-devin:hover) .vt-mm .k-devin circle,
.vt-area:has(.k-dlhe-diely:hover) .vt-mm .k-dlhe-diely circle,
.vt-area:has(.k-karlova-ves:hover) .vt-mm .k-karlova-ves circle,
.vt-area:has(.k-stare-mesto:hover) .vt-mm .k-stare-mesto circle,
.vt-area:has(.k-ruzinov:hover) .vt-mm .k-ruzinov circle,
.vt-area:has(.k-vrakuna:hover) .vt-mm .k-vrakuna circle,
.vt-area:has(.k-podunajske-biskupice:hover) .vt-mm .k-podunajske-biskupice circle,
.vt-area:has(.k-hainburg:hover) .vt-mm .k-hainburg circle,
.vt-area:has(.k-berg:hover) .vt-mm .k-berg circle,
.vt-area:has(.k-kittsee:hover) .vt-mm .k-kittsee circle,
.vt-area:has(.k-petrzalka:hover) .vt-mm .k-petrzalka circle,
.vt-area:has(.k-jarovce:hover) .vt-mm .k-jarovce circle,
.vt-area:has(.k-rusovce:hover) .vt-mm .k-rusovce circle,
.vt-area:has(.k-cunovo:hover) .vt-mm .k-cunovo circle,
.vt-area:has(.k-rajka:hover) .vt-mm .k-rajka circle,
.vt-area:has(.k-dunakiliti:hover) .vt-mm .k-dunakiliti circle { r: 7px; fill: var(--vt-cta); }
.vt-mm__d:hover text,
.vt-area:has(.k-lozorno:hover) .vt-mm .k-lozorno text,
.vt-area:has(.k-borinka:hover) .vt-mm .k-borinka text,
.vt-area:has(.k-stupava:hover) .vt-mm .k-stupava text,
.vt-area:has(.k-marianka:hover) .vt-mm .k-marianka text,
.vt-area:has(.k-zahorska-bystrica:hover) .vt-mm .k-zahorska-bystrica text,
.vt-area:has(.k-devinska-nova-ves:hover) .vt-mm .k-devinska-nova-ves text,
.vt-area:has(.k-dubravka:hover) .vt-mm .k-dubravka text,
.vt-area:has(.k-lamac:hover) .vt-mm .k-lamac text,
.vt-area:has(.k-nove-mesto:hover) .vt-mm .k-nove-mesto text,
.vt-area:has(.k-raca:hover) .vt-mm .k-raca text,
.vt-area:has(.k-vajnory:hover) .vt-mm .k-vajnory text,
.vt-area:has(.k-devin:hover) .vt-mm .k-devin text,
.vt-area:has(.k-dlhe-diely:hover) .vt-mm .k-dlhe-diely text,
.vt-area:has(.k-karlova-ves:hover) .vt-mm .k-karlova-ves text,
.vt-area:has(.k-stare-mesto:hover) .vt-mm .k-stare-mesto text,
.vt-area:has(.k-ruzinov:hover) .vt-mm .k-ruzinov text,
.vt-area:has(.k-vrakuna:hover) .vt-mm .k-vrakuna text,
.vt-area:has(.k-podunajske-biskupice:hover) .vt-mm .k-podunajske-biskupice text,
.vt-area:has(.k-hainburg:hover) .vt-mm .k-hainburg text,
.vt-area:has(.k-berg:hover) .vt-mm .k-berg text,
.vt-area:has(.k-kittsee:hover) .vt-mm .k-kittsee text,
.vt-area:has(.k-petrzalka:hover) .vt-mm .k-petrzalka text,
.vt-area:has(.k-jarovce:hover) .vt-mm .k-jarovce text,
.vt-area:has(.k-rusovce:hover) .vt-mm .k-rusovce text,
.vt-area:has(.k-cunovo:hover) .vt-mm .k-cunovo text,
.vt-area:has(.k-rajka:hover) .vt-mm .k-rajka text,
.vt-area:has(.k-dunakiliti:hover) .vt-mm .k-dunakiliti text { opacity: 1; }
/* dlaždicová mapa: riadok 5 = Dunaj */
.vt-map { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-template-rows: repeat(4, auto) 36px repeat(3, auto); gap: 8px; padding: 0; list-style: none; }
.vt-map::before {
	content: "Dunaj";
	grid-row: 5;
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding-right: 16px;
	border-radius: var(--vt-r-sm);
	background: var(--vt-wave) 0 50% / 60px 10px repeat-x, #D6ECF8;
	font-size: .8em;
	font-style: italic;
	font-weight: 700;
	color: var(--vt-blue-dd);
	animation: vt-wave 3s linear infinite;
}
.vt-map-w { container: vt-map / inline-size; }
/* pin nad názvom – názov sa zmestí aj do úzkej dlaždice */
.vt-map li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 60px;
	padding: 8px 6px;
	text-align: center;
	border-radius: var(--vt-r-sm);
	background: var(--vt-tint-2);
	font-size: .8em;
	font-weight: 600;
	line-height: 1.25;
	color: #2F4557;
	transition: transform .2s, background .2s, color .2s, opacity .2s, box-shadow .2s;
}
.vt-map li::before { content: ""; flex: none; width: 14px; height: 14px; background: var(--vt-blue); -webkit-mask: var(--vt-pin) center / contain no-repeat; mask: var(--vt-pin) center / contain no-repeat; }
.vt-map li small { position: absolute; top: 4px; right: 4px; padding: 1px 4px; border-radius: 4px; background: var(--vt-tint-2); font-size: .7em; font-weight: 800; letter-spacing: .06em; line-height: 1.4; }
.vt-map .is-hl { background: var(--vt-blue-d); color: #fff; }
.vt-map .is-ab { border: 1px dashed #CFE0EC; background: #fff; color: #546B7E; }
.vt-map .is-city { flex-direction: row; gap: 8px; background: var(--vt-ink); color: #fff; font-size: 1em; font-weight: 800; }
.vt-map .is-hl::before, .vt-map .is-city::before { background: var(--vt-orange); }
.vt-map li:hover { transform: translateY(-2px); background: var(--vt-blue-d); color: #fff; box-shadow: 0 12px 24px -12px rgba(0, 116, 184, .6); }
.vt-map li:hover::before { background: #fff; }
.vt-map:has(li:hover) li:not(:hover) { opacity: .45; }
.vt-r1 { grid-row: 1; } .vt-r2 { grid-row: 2; } .vt-r3 { grid-row: 3; } .vt-r4 { grid-row: 4; }
.vt-r6 { grid-row: 6; } .vt-r7 { grid-row: 7; } .vt-r8 { grid-row: 8; }
.vt-c1 { grid-column: 1; } .vt-c2 { grid-column: 2; } .vt-c3 { grid-column: 3; } .vt-c4 { grid-column: 4; }
.vt-c5 { grid-column: 5; } .vt-c6 { grid-column: 6; } .vt-c7 { grid-column: 7; }
.vt-map .is-city { grid-column: 5 / 8; }
/* úzky priestor (tablet, menší notebook) – dlaždice v riadkoch podľa dĺžky názvu */
@container vt-map (max-width: 700px) {
	.vt-map { display: flex; flex-wrap: wrap; }
	.vt-map::before { display: none; }
	.vt-map li { flex-direction: row; gap: 6px; min-height: 44px; padding: 8px 12px; text-align: left; }
	.vt-map li small { position: static; margin-left: 2px; }
}
.vt-map__note { margin-top: 14px; font-size: .85em; font-weight: 600; color: #546B7E; }

/* ---------- 10. VIDEO [vt_video] ---------- */
.vt-vid { display: grid; grid-template-columns: 1fr 1.6fr; gap: 48px; align-items: center; padding: 28px 28px 28px clamp(28px, 4vw, 56px); border-radius: var(--vt-r-xl); }
.vt-vid__t { font-size: 1.6em; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: #fff; }
.vt-video { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--vt-r-lg); background: #000; }
.vt-video img { width: 100%; height: 100%; object-fit: cover; opacity: .85; transition: opacity .3s; }
.vt-video:hover img { opacity: 1; }
.vt-video__play { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%; background: #fff; transition: transform .3s var(--vt-ease); }
.vt-video__play::before { content: ""; position: absolute; left: 34px; top: 27px; border-style: solid; border-width: 15px 0 15px 24px; border-color: transparent transparent transparent var(--vt-blue-d); }
.vt-video:hover .vt-video__play { transform: scale(1.1); }
.vt-video__frame { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--vt-r-lg); }

/* ---------- 11. O NÁS – karty napojené na potrubie ---------- */
.vt-h-sub { display: block; margin-top: 22px; font-size: .45em; font-weight: 600; line-height: 1.5; letter-spacing: -.01em; color: #9FD3F2; }
.vt-pipe { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; counter-reset: vt-pipe; }
.vt-pipe::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 21px;
	height: 14px;
	border-radius: 7px;
	background:
		linear-gradient(90deg, transparent, rgba(255, 255, 255, .75), transparent) -160px 50% / 160px 5px no-repeat,
		linear-gradient(180deg, #FFC08F 0, #FF9A52 22%, #F07A2E 55%, #C85A18 85%, #9E4410 100%);
	animation: vt-pipe 3.2s linear infinite;
}
.vt-pipe > * { position: relative; margin-top: 70px; padding: 84px 36px 36px; border-radius: var(--vt-r-lg); background: #fff; color: #2F4557; box-shadow: 0 30px 60px -36px rgba(0, 0, 0, .7); counter-increment: vt-pipe; }
.vt-pipe > *::before { content: ""; position: absolute; top: -16px; left: 50%; width: 14px; height: 24px; margin-left: -7px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, #9E4410, #F07A2E 35%, #FFC08F 55%, #C85A18 85%); }
.vt-pipe > *::after { content: counter(vt-pipe, decimal-leading-zero); position: absolute; top: 22px; right: 28px; font-size: 2.6em; font-weight: 800; line-height: 1; letter-spacing: -.04em; color: var(--vt-line); }
.vt-pipe a { color: var(--vt-blue-d); }
.vt-pipe strong { color: var(--vt-ink); }
.vt-valve { position: absolute; z-index: 1; top: -70px; left: 50%; display: grid; place-items: center; width: 56px; height: 56px; margin-left: -28px; border-radius: 50%; background: var(--vt-ink); color: #fff; box-shadow: 0 0 0 4px var(--vt-orange), 0 0 0 9px var(--vt-ink); }
.vt-valve .vt-ic--nodiy { color: #fff; }
.vt-pipe > *:hover .vt-valve { animation: vt-ring .7s ease-in-out; }

/* modrý CTA pás */
.vt-band { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: clamp(64px, 8vw, 96px); padding: clamp(32px, 4vw, 56px) clamp(28px, 5vw, 64px); border-radius: var(--vt-r-xl); background: var(--vt-blue-d); color: #D6ECF8; }
.vt-band::after { content: ""; position: absolute; right: -40px; top: 50%; width: 440px; height: 348px; transform: translateY(-50%); background: #fff; opacity: .12; pointer-events: none; -webkit-mask: var(--vt-vortex) center / contain no-repeat; mask: var(--vt-vortex) center / contain no-repeat; }
.vt-band h3 { color: #fff; }
.vt-band p { margin-top: 10px; font-weight: 600; }
.vt-band .vt-cta { --vt-br: #fff; z-index: 1; }
.vt-band .vt-cta__tag--t { background: #fff; color: var(--vt-ink); }

/* ---------- 12. SLUŽBY ---------- */
.vt-svc { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding: 0; list-style: none; }
/* obiehajúci modro-oranžový rámik (@property) + vrstvený tieň */
@property --vt-ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.vt-svc li {
	display: flex;
	flex-direction: column;
	gap: 22px;
	min-height: 200px;
	padding: 32px 28px;
	border: 2px solid transparent;
	border-radius: var(--vt-r-lg);
	background:
		linear-gradient(#fff, #fff) padding-box,
		conic-gradient(from var(--vt-ang), transparent 0 55%, var(--vt-blue) 72%, var(--vt-orange) 88%, transparent 100%) border-box,
		linear-gradient(var(--vt-line), var(--vt-line)) border-box;
	box-shadow: 0 1px 2px rgba(7, 30, 48, .05), 0 18px 36px -22px rgba(7, 30, 48, .28);
	animation: vt-orbit 6s linear infinite;
	transition: transform .3s var(--vt-ease), box-shadow .3s;
}
.vt-svc li:nth-child(even) { animation-delay: -3s; }
.vt-svc li:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(7, 30, 48, .06), 0 30px 50px -24px rgba(0, 116, 184, .55); animation-duration: 2s; }
.vt-svc h3 { margin-top: auto; font-size: 20px; line-height: 1.3; hyphens: manual; }

/* ---------- 13. GALÉRIA – bento mozaika, popis sa vysunie pri hoveri (v DOM ostáva pre SEO) ---------- */
.vt-gal { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(160px, 16vw, 220px); grid-auto-flow: dense; gap: 16px; counter-reset: vt-gal; }
.vt-gal figure { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--vt-r-lg); background: var(--vt-ink); counter-increment: vt-gal; }
.vt-gal figure:nth-child(1), .vt-gal figure:nth-child(9) { grid-column: span 2; grid-row: span 2; }
.vt-gal figure:nth-child(4) { grid-row: span 2; }
.vt-gal figure:nth-child(7) { grid-column: span 2; }
.vt-gal img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1), filter .5s; }
/* tmavý prechod zdola */
.vt-gal figure::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, transparent 40%, rgba(7, 30, 48, .9) 100%); opacity: 0; transition: opacity .4s; pointer-events: none; }
/* rohy „hľadáčika“ ako pri tlačidle */
.vt-gal figure::before {
	content: "";
	position: absolute;
	inset: 14px;
	z-index: 2;
	opacity: 0;
	transform: scale(1.06);
	transition: opacity .35s, transform .45s var(--vt-ease);
	pointer-events: none;
	background:
		linear-gradient(#fff 0 0) 0 0 / 18px 2px no-repeat, linear-gradient(#fff 0 0) 0 0 / 2px 18px no-repeat,
		linear-gradient(#fff 0 0) 100% 0 / 18px 2px no-repeat, linear-gradient(#fff 0 0) 100% 0 / 2px 18px no-repeat,
		linear-gradient(#fff 0 0) 0 100% / 18px 2px no-repeat, linear-gradient(#fff 0 0) 0 100% / 2px 18px no-repeat,
		linear-gradient(#fff 0 0) 100% 100% / 18px 2px no-repeat, linear-gradient(#fff 0 0) 100% 100% / 2px 18px no-repeat;
}
.vt-gal figcaption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	display: flex;
	align-items: flex-end;
	gap: 12px;
	padding: 26px 28px;
	font-weight: 700;
	line-height: 1.35;
	color: #fff;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .35s, transform .45s var(--vt-ease);
}
.vt-gal figcaption::before { content: counter(vt-gal, decimal-leading-zero); flex: none; padding: 3px 8px; border-radius: 6px; background: var(--vt-cta); font-size: .75em; font-weight: 800; letter-spacing: .06em; }
.vt-gal figure:hover img { transform: scale(1.08); filter: saturate(1.15); }
.vt-gal figure:hover::after, .vt-gal figure:hover::before, .vt-gal figure:hover figcaption { opacity: 1; transform: none; }
.vt-gal:has(figure:hover) figure:not(:hover) img { filter: grayscale(.6) brightness(.85); }
/* dotykové zariadenia – popis vidno stále */
@media (hover: none) {
	.vt-gal figure::after, .vt-gal figcaption { opacity: 1; transform: none; }
	.vt-gal figcaption { padding: 16px 18px; font-size: .85em; }
}

/* ---------- 14. RECENZIE – hodnotenie v hlavičke + masonry stĺpce ---------- */
.vt-score .vt-google { gap: 6px 12px; padding: 12px 22px 12px 14px; border: 1px solid var(--vt-line); border-radius: var(--vt-r-md); background: #fff; box-shadow: var(--vt-shadow); }
.vt-score .vt-google__val { font-size: 2em; line-height: 1; letter-spacing: -.03em; }
.vt-score .vt-g { width: 30px; height: 30px; }
.vt-revs { columns: 3; column-gap: 20px; }
.vt-rev { position: relative; display: flex; flex-direction: column; gap: 16px; margin: 0 0 20px; padding: 30px; border: 1px solid var(--vt-line); border-radius: var(--vt-r-lg); background: #fff; break-inside: avoid; transition: border-color .25s, box-shadow .25s; }
.vt-rev:hover { border-color: var(--vt-blue-d); box-shadow: 0 18px 40px -22px rgba(0, 116, 184, .45); }
.vt-rev::before { content: "“"; position: absolute; top: 6px; right: 24px; font-size: 5em; font-weight: 800; line-height: 1; color: var(--vt-tint); pointer-events: none; }
.vt-rev blockquote { position: relative; margin: 0; padding: 0; border: 0; color: #2F4557; font-style: normal; }
.vt-rev figcaption { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--vt-line); text-align: left; }
.vt-rev figcaption b { display: block; line-height: 1.3; color: var(--vt-ink); }
.vt-rev figcaption small { display: block; font-weight: 600; color: #546B7E; }
.vt-rev__av { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--vt-tint); color: var(--vt-blue-d); font-weight: 800; }

/* ---------- 15. KONTAKT ---------- */
.vt-kt { display: grid; grid-template-columns: 1fr 1.2fr; overflow: hidden; border: 1px solid var(--vt-line); border-radius: var(--vt-r-xl); background: #fff; }
.vt-kt__tx { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; padding: clamp(32px, 5vw, 64px); }
.vt-kt__tx > p { font-size: 1.1em; }
.vt-kt__img img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- 16. FAQ [vt_faq_panel] + .vt-faq__item ---------- */
.vt-faq { display: grid; grid-template-columns: 420px 1fr; overflow: hidden; border: 1px solid var(--vt-line); border-radius: var(--vt-r-xl); background: #fff; box-shadow: 0 40px 80px -48px rgba(7, 30, 48, .45); interpolate-size: allow-keywords; }
.vt-faq__side { display: flex; flex-direction: column; gap: 28px; padding: clamp(32px, 4vw, 56px) clamp(28px, 3.5vw, 48px); background: var(--vt-ink) radial-gradient(120% 70% at 0 0, #0B4468 0, transparent 60%); }
.vt-faq-panel { display: flex; flex-direction: column; gap: 28px; flex: 1; }
.vt-faq-panel__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 20px; padding: 24px 0 0; border-top: 1px solid var(--vt-sline); list-style: none; text-align: center; }
.vt-faq-panel__stats li + li { border-left: 1px solid var(--vt-sline); }
/* 4 údaje (keď sa zapne hodnotenie) = mriežka 2 × 2 */
.vt-faq-panel__stats:has(> li:nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vt-faq-panel__stats:has(> li:nth-child(4)) li:nth-child(3) { border-left: 0; }
.vt-faq-panel__stats b { display: block; font-size: 1.4em; line-height: 1.2; letter-spacing: -.02em; color: #fff; }
.vt-faq-panel__stats i { font-style: normal; color: var(--vt-orange); }
.vt-faq-panel__stats span { display: block; margin-top: 4px; font-size: .75em; font-weight: 600; line-height: 1.35; }
.vt-faq-panel__links { padding: 0; border-top: 1px solid var(--vt-sline); list-style: none; }
.vt-faq-panel__links li { border-bottom: 1px solid var(--vt-sline); }
.vt-faq-panel__links a { display: flex; align-items: center; gap: 16px; padding: 18px 0; font-weight: 700; color: #fff; text-decoration: none; }
.vt-faq-panel__links a:hover { color: var(--vt-orange); }
.vt-faq-panel__links small { display: block; font-size: .7em; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--vt-muted); }
.vt-faq-panel__ic { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border: 1px solid #2A4A63; border-radius: var(--vt-r); color: #9FD3F2; }
.vt-faq-panel__links address { font-style: normal; }
.vt-faq-panel__firma { display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; gap: 14px 16px; font-size: .8em; }
.vt-faq-panel__firma dt { font-size: .82em; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--vt-muted); }
.vt-faq-panel__firma dd { font-weight: 700; color: #D6ECF8; font-variant-numeric: tabular-nums; }
.vt-faq-panel__firma .vt-wide { grid-column: 1 / -1; }
.vt-faq-panel__firma .vt-wide dd { font-weight: 600; color: var(--vt-fg); }
.vt-faq-panel .vt-call { margin-top: auto; background: var(--vt-ink-2); box-shadow: inset 0 0 0 1px #2A4A63; }
.vt-faq__list { padding: clamp(24px, 3.5vw, 40px) clamp(20px, 3.5vw, 48px); counter-reset: vt-faq; }
.vt-faq__item { border-bottom: 1px solid var(--vt-line); counter-increment: vt-faq; transition: border-radius .3s, box-shadow .3s, margin .3s; }
.vt-faq__item summary { display: grid; grid-template-columns: 48px 1fr 44px; align-items: center; gap: 12px; padding: 26px 0; list-style: none; cursor: pointer; transition: background .3s, padding .3s; }
.vt-faq__item summary::-webkit-details-marker { display: none; }
.vt-faq__item summary::before { content: counter(vt-faq, decimal-leading-zero); font-weight: 800; letter-spacing: .04em; color: var(--vt-blue-d); }
.vt-faq__item summary::after { content: "+"; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #CFE0EC; border-radius: var(--vt-r); font-size: 1.4em; font-weight: 500; color: var(--vt-blue-d); transition: transform .35s, background .3s, border-color .3s, color .3s; }
.vt-faq__item summary:hover::after { border-color: var(--vt-blue-d); }
.vt-faq__item summary h3 { font-size: 20px; font-weight: 400; line-height: 1.35; transition: color .3s; }
.vt-faq__item::details-content { block-size: 0; overflow: clip; transition: block-size .4s ease, content-visibility .4s allow-discrete; }
.vt-faq__item[open]::details-content { block-size: auto; }
.vt-faq__item[open] { overflow: hidden; margin: 12px 0; border: 1px solid var(--vt-blue); border-radius: 16px; box-shadow: 0 18px 40px -24px rgba(0, 116, 184, .5); }
.vt-faq__item[open] summary { padding: 22px 24px 22px 20px; background: var(--vt-ink); }
.vt-faq__item[open] summary h3 { color: #fff; }
.vt-faq__item[open] summary::before { color: var(--vt-orange); }
.vt-faq__item[open] summary::after { transform: rotate(45deg); border-color: var(--vt-orange); background: var(--vt-orange); color: var(--vt-ink); }
.vt-faq__a { padding: 24px 28px 28px 80px; background: linear-gradient(180deg, var(--vt-tint) 0, var(--vt-ice) 55%, #fff 100%); color: #2F4557; }
.vt-faq__a > * + * { margin-top: .8em; }
.vt-faq__a :is(ul, ol) { padding-left: 20px; }
.vt-faq__a li::marker { color: var(--vt-blue); }

/* ---------- 17. ANIMÁCIE ---------- */
@keyframes vt-flow { to { background-position: 140px 50%, 0 0; } }
@keyframes vt-pipe { to { background-position: calc(100% + 160px) 50%, 0 0; } }
@keyframes vt-wave { to { background-position-x: 60px; } }
@keyframes vt-sonar { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(2.1); opacity: 0; } }
@keyframes vt-pulse { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(2.8); opacity: 0; } }
@keyframes vt-ring { 0%, 100% { transform: rotate(0); } 20% { transform: rotate(-14deg); } 40% { transform: rotate(12deg); } 60% { transform: rotate(-8deg); } 80% { transform: rotate(5deg); } }
@keyframes vt-spin { to { transform: rotate(360deg); } }
@keyframes vt-orbit { to { --vt-ang: 360deg; } }
@keyframes vt-blink { 50% { opacity: .35; } }
@keyframes vt-pop { from { opacity: 0; transform: translateY(12px); } }

@media (prefers-reduced-motion: reduce) {
	.vt-sec *, .vt-sec *::before, .vt-sec *::after, .vt-call *, .vt-call *::before, .vt-call *::after {
		animation: none !important; /* jediná výnimka: rešpektovanie systémového nastavenia */
		transition: none !important;
	}
}

/* ---------- 18. DESKTOP, TABLET A MOBIL ---------- */
/* hero presne na výšku obrazovky pod hlavičkou Blocksy (--header-height), s admin lištou */
@media (min-width: 1025px) {
	.vt-hero { display: flex; align-items: center; min-height: calc(100svh - var(--header-height, 84px) - var(--wp-admin--admin-bar--height, 0px)); padding-block: var(--vt-hpad); }
	.vt-hero__g { width: 100%; }
	.vt-hero__vis { height: clamp(420px, calc(100svh - var(--header-height, 84px) - var(--wp-admin--admin-bar--height, 0px) - 2 * var(--vt-hpad)), 640px); }
	/* dlhé FAQ: tmavý panel zostane pri čítaní viditeľný */
	.vt-faq { background: linear-gradient(90deg, var(--vt-ink) 420px, #fff 420px); }
	.vt-faq__side { position: sticky; top: 24px; align-self: start; }
}
@media (max-width: 1024px) {
	.vt-hero__g, .vt-two, .vt-media, .vt-area, .vt-vid, .vt-kt, .vt-faq, .vt-san, .vt-san__g { grid-template-columns: 1fr; }
	.vt-revs { columns: 2; }
	.vt-dg__tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.vt-met { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vt-dg__p { grid-template-columns: 1fr; }
	.vt-dg__b { border-right: 0; border-bottom: 1px solid var(--vt-line); }
	.vt-svc, .vt-gal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vt-gal figure:nth-child(4), .vt-gal figure:nth-child(7) { grid-row: auto; grid-column: auto; }
	.vt-pipe { grid-template-columns: 1fr; }
	.vt-hero::before { background-position: 50% 0; }
	.vt-pipe::before { display: none; }
	.vt-band { flex-direction: column; align-items: flex-start; }
	.vt-float--1 { left: 12px; }
	.vt-float--2 { right: 12px; }
	.vt-seal { right: 12px; bottom: -40px; width: 140px; height: 140px; }
	.vt-seal__c { width: 58px; height: 58px; }
}
@media (max-width: 767px) {
	.vt-dg__tiles, .vt-gal { grid-template-columns: 1fr 1fr; }
	.vt-svc, .vt-met { grid-template-columns: 1fr; }
	.vt-steps { grid-template-columns: 1fr; gap: 14px; }
	.vt-steps::before { left: 21px; right: auto; top: 23px; bottom: 23px; width: 4px; height: auto; background: linear-gradient(90deg, #FFB27A, #F07A2E 50%, #C85A18); }
	.vt-steps li { flex-direction: row; text-align: left; }
	.vt-dg__t:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
	.vt-liner { width: min(100%, 300px); }
	.vt-liner__l { font-size: .7em; }
	.vt-liner__l--1 { right: -4px; }
	.vt-liner__l--2 { left: -4px; }
	.vt-revs { columns: 1; }
	.vt-float--2 { display: none; }
	.vt-faq__a { padding-left: 24px; }
	:root { --vt-pad: 70px; }
	.vt-hero h1 { line-height: 1.2; }
	.vt-hero .vt-kick { display: flex; width: fit-content; max-width: 100%; margin-inline: auto; text-align: center; }
	/* tlačidlá na celú šírku (iba v sekciách, nie v hlavičke) */
	.vt-actions { flex-direction: column; align-items: stretch; gap: 16px; }
	.vt-sec :is(.vt-cta, .vt-call, .vt-btn) { box-sizing: border-box; display: flex; width: 100%; }
	.vt-sec .vt-btn { justify-content: center; }
	.vt-sec .vt-call__tx { flex: 1; align-items: center; }
	.vt-sec .vt-call:hover .vt-call__fill { transform: scale(16); }
	.vt-cta::before, .vt-cta__tag { display: none; }
	.vt-band { align-items: stretch; }
	/* mapa: najprv lokality, potom mapka */
	.vt-area { gap: 24px; }
	.vt-area__l { display: contents; }
	.vt-mm { order: 1; }
	.vt-kt__img img { aspect-ratio: 3 / 2; }
}