@charset "utf-8";
/*
 * modern.css – vzhled "vodacky plakat" pro sablonu voddog (www + otava, stejny soubor)
 * Tucne kondenzovane nadpisy, zlute pasky, silne navy ramecky a ostre posunute stiny.
 * Nacita se az po main.css a jen prepisuje vzhled; tridy a ID, na ktere je
 * navazany JavaScript poptavky, zustavaji beze zmeny.
 * Navrat k puvodnimu vzhledu = odebrat <link> na tento soubor v site.php.
 */

:root {
	--vd-blue: #298fd2;
	--vd-blue-600: #1f7bbd;
	--vd-blue-50: #eaf4fb;
	--vd-blue-100: #cfe5f5;
	--vd-blue-dark: #1e5579;
	--vd-navy: #0d3e5f;
	--vd-yellow: #eabb38;
	--vd-yellow-300: #f4cf5c;
	--vd-yellow-50: #fdf5dc;
	--vd-red: #ca0002;
	--vd-red-700: #a50002;
	--vd-green: #1aa91f;
	--vd-orange: #e9a933;

	--vd-ink: #0d3e5f;
	--vd-text: #24384a;
	--vd-muted: #5b6f80;
	--vd-line: #c8d6e2;
	--vd-bg: #eef3f7;

	--vd-bw: 3px;
	--vd-border: var(--vd-bw) solid var(--vd-navy);
	--vd-hard: 6px 6px 0 var(--vd-navy);
	--vd-hard-lg: 10px 10px 0 var(--vd-navy);
	--vd-hard-sm: 4px 4px 0 var(--vd-navy);
	--vd-radius: 4px;

	--vd-font-display: 'Roboto Condensed', 'Arial Narrow', sans-serif;
	--vd-font-head: 'Oswald', 'Roboto Condensed', sans-serif;
	/* texty: Roboto (normalni sirka), nadpisy a popisky: Roboto Condensed */
	--vd-font-body: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--vd-gutter: clamp(16px, 4vw, 32px);
}

/* ---------------------------------------------------------------- zaklad */

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: 90px;
}

html, body {
	overflow-x: hidden;
}

@supports (overflow-x: clip) {
	html, body { overflow-x: clip; }
}

body {
	font-family: var(--vd-font-body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--vd-text);
	background: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

*, *::before, *::after {
	box-sizing: border-box;
}

::selection {
	background: var(--vd-yellow);
	color: var(--vd-navy);
}

a {
	color: var(--vd-blue-600);
	font-weight: 500;
	text-decoration: none;
	transition: color .15s ease;
}

a:hover {
	color: var(--vd-navy);
}

img {
	max-width: 100%;
	height: auto;
}

:focus-visible {
	outline: 3px solid var(--vd-yellow);
	outline-offset: 3px;
}

.content {
	width: auto;
	min-width: 0;
	max-width: 1200px;
	padding-left: var(--vd-gutter);
	padding-right: var(--vd-gutter);
	font-family: var(--vd-font-body);
}

@media only screen and (min-width: 1280px) {
	.content {
		width: auto;
		min-width: 0;
	}
}

.content .content {
	padding-left: 0;
	padding-right: 0;
	max-width: none;
}

section div.content {
	font-size: 17px;
}

.content h1, .content h2, .content h3, .content h4, .content h5 {
	font-family: var(--vd-font-display);
	font-weight: 900;
	color: var(--vd-ink);
	line-height: 1.1;
	text-transform: uppercase;
	letter-spacing: -.005em;
}

/* velky plakatovy nadpis se zlutym zvyraznenim */
.contenth2,
.content h1.contenth2,
.content h2.contenth2 {
	display: block;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(2.4rem, 1.4rem + 4vw, 4.75rem);
	line-height: .95;
	letter-spacing: -.02em;
	text-transform: uppercase;
	text-align: left;
	color: var(--vd-navy);
	margin: 0 0 .7em;
	padding: 0;
}

.contenth2::after {
	content: "";
	display: block;
	width: 120px;
	height: 12px;
	margin-top: .22em;
	background: var(--vd-yellow);
	transform: rotate(-2deg);
	transform-origin: left;
	box-shadow: 4px 4px 0 var(--vd-navy);
}

.contenth3,
.content h3.contenth3 {
	display: inline-block;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2rem);
	color: var(--vd-navy);
	text-transform: uppercase;
	margin: 1.4em 0 .8em;
	padding: 4px 14px;
	background: var(--vd-yellow);
	transform: rotate(-1.5deg);
	box-shadow: var(--vd-hard-sm);
}

.contenth4 {
	font-size: 1.3rem;
	color: var(--vd-navy);
	margin: 1.4em 0 .6em;
}

.h2ico {
	opacity: 1;
	padding-right: .3em;
	color: var(--vd-blue);
	font-size: .75em;
	font-style: normal;
}

.h2ico:not([class*="fa-"]) {
	display: none;
}

/* plakatove tlacitko */
.bluemore,
a.more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	float: none;
	padding: 12px 20px;
	border: var(--vd-border);
	border-radius: 0;
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 16px;
	line-height: 1.1;
	letter-spacing: .03em;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: var(--vd-hard-sm);
	transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}

.bluemore::after,
a.more::after {
	content: "\2192";
	font-size: 1.15em;
}

.bluemore:hover,
a.more:hover {
	background: var(--vd-yellow-300);
	color: var(--vd-navy);
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard);
}

.bluemore:active,
a.more:active {
	transform: translate(3px, 3px);
	box-shadow: 1px 1px 0 var(--vd-navy);
}

/* ------------------------------------------------------------- navigace */

nav {
	height: 80px;
	background: var(--vd-navy);
	background: rgba(13, 62, 95, .92);
	border-bottom: 4px solid var(--vd-yellow);
}

nav > .content {
	position: relative;
	height: 76px;
}

#logo {
	z-index: 2;
	filter: drop-shadow(5px 5px 0 rgba(13, 62, 95, .55));
	transition: transform .25s ease;
}

#logo:hover {
	transform: rotate(-6deg) scale(1.04);
}

#top-content-menu-button {
	position: absolute;
	top: 14px;
	right: var(--vd-gutter);
	width: 48px;
	height: 48px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 3px solid var(--vd-navy);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	box-shadow: 3px 3px 0 rgba(0, 0, 0, .35);
	font-size: 22px;
	cursor: pointer;
}

/* mobilni menu: panel pod listou */
@media only screen and (max-width: 899px) {
	#top-content-menu-button {
		display: flex !important;
	}

	.topmenu {
		display: none;
		position: absolute;
		top: 84px;
		left: 12px;
		right: 12px;
		margin: 0 !important;
		padding: 6px !important;
		border: var(--vd-border);
		background: var(--vd-yellow) !important;
		box-shadow: var(--vd-hard);
	}

	.topmenu a,
	.topmenu a:hover {
		display: block !important;
		float: none;
		padding: 14px 16px;
		color: var(--vd-navy);
		font-family: var(--vd-font-display);
		font-weight: 900;
		font-size: 22px;
		letter-spacing: 0;
	}

	.topmenu a + a {
		border-top: 2px solid rgba(13, 62, 95, .2);
	}

	.topmenu a.active,
	.topmenu a:hover {
		background: var(--vd-navy);
		color: var(--vd-yellow);
	}
}

@media only screen and (min-width: 900px) {
	#top-content-menu-button {
		display: none !important;
	}

	nav > .content {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	.topmenu {
		display: flex !important;
		align-items: center;
		gap: 2px;
		margin: 0 0 0 auto !important;
		padding: 0 !important;
		position: relative;
		background: transparent !important;
	}

	.topmenu a,
	.topmenu a:hover {
		float: none;
		padding: 8px 12px;
		font-family: var(--vd-font-display);
		font-weight: 900;
		font-size: 17px;
		letter-spacing: .02em;
		color: #fff;
		transition: background-color .12s ease, color .12s ease, transform .12s ease;
	}

	.topmenu a:hover,
	.topmenu a.active {
		background: var(--vd-yellow);
		color: var(--vd-navy);
		transform: rotate(-2deg);
	}

	#logo {
		margin: 18px 0 0 0;
		left: var(--vd-gutter);
		top: 0;
		width: 140px;
		height: 140px;
	}

	.logosmall {
		margin: 16px 0 0 0 !important;
		width: 120px !important;
		height: 120px !important;
	}
}

@media only screen and (min-width: 1200px) {
	#logo {
		width: 175px;
		height: 175px;
	}

	.logosmall {
		width: 140px !important;
		height: 140px !important;
	}
}

/* ------------------------------------------------------- hero (zahlavi) */

header {
	position: relative;
}

.slidertext h1, .slidertext .h1,
.slidertext3 h1, .slidertext3 .h1 {
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	line-height: 1.02;
	letter-spacing: -.01em;
	padding: 12px 18px;
	border: var(--vd-border);
	box-shadow: var(--vd-hard);
	max-width: calc(100vw - 24px);
}

.slidertext2 h2 {
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	line-height: 1.05;
	padding: 10px 16px;
	border: var(--vd-border);
	box-shadow: var(--vd-hard);
}

.slidertext2 h2 span {
	color: var(--vd-red);
}

.slidertext h1 span, .slidertext .h1 span,
.slidertext3 h1 span, .slidertext3 .h1 span {
	font-weight: 900;
}

.slidertext h1 a, .slidertext .h1 a,
.slidertext3 h1 a, .slidertext3 .h1 a {
	color: var(--vd-navy);
	white-space: nowrap;
	text-decoration: none;
}

.slidertext h1 a:hover, .slidertext .h1 a:hover,
.slidertext3 h1 a:hover, .slidertext3 .h1 a:hover {
	color: var(--vd-red);
}

/* nalepka "od 2003" */
.vd-sticker {
	position: absolute;
	z-index: 15001;
	left: 6%;
	bottom: 120px;
	width: 112px;
	height: 112px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: var(--vd-border);
	border-radius: 50%;
	background: var(--vd-red);
	color: #fff;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 34px;
	line-height: .9;
	text-transform: uppercase;
	transform: rotate(12deg);
	box-shadow: var(--vd-hard);
	pointer-events: none;
}

.vd-sticker span {
	font-size: 15px;
	letter-spacing: .1em;
}

@media only screen and (max-width: 799px) {
	.slidertext { right: 8px; left: 8px; top: 108px; }
	.slidertext2 { left: 14px; top: 232px; }
	.slidertext3 { right: 8px; top: 100px; }

	.slidertext h1, .slidertext .h1,
	.slidertext3 h1, .slidertext3 .h1 {
		font-size: 20px;
		margin-left: auto;
	}

	.slidertext h1 span, .slidertext .h1 span,
	.slidertext3 h1 span, .slidertext3 .h1 span {
		display: block;
		padding-left: 0;
		font-size: 26px;
	}

	.slidertext2 h2 {
		font-size: 17px;
	}

	/* na mobilu neni vedle banneru misto */
	.vd-sticker {
		display: none;
	}
}

@media only screen and (min-width: 800px) {
	.slidertext h1, .slidertext .h1 {
		font-size: clamp(34px, 4vw, 58px);
		padding: 16px 24px;
	}

	.slidertext3 h1, .slidertext3 .h1 {
		font-size: clamp(22px, 2.3vw, 30px);
	}

	.slidertext2 h2 {
		font-size: clamp(22px, 2.4vw, 32px);
		padding: 12px 20px;
	}

	.vd-sticker {
		bottom: 90px;
	}
}

/* levy dolni roh fotky: pod hlavnim bannerem, vlevo od "dobra volba" */
@media only screen and (min-width: 900px) {
	.vd-sticker {
		bottom: 150px;
		width: 132px;
		height: 132px;
		font-size: 40px;
	}

	.vd-sticker span {
		font-size: 17px;
	}
}

#jssor_1 {
	max-width: 100%;
}

#jssor_1:after,
section.blue,
section.lode:before {
	background: var(--vd-blue);
}

/* --------------------------------------------- uvod: modre karty sluzeb */

section.blue {
	padding-bottom: 56px;
}

section.blue > .content {
	padding-top: 8px;
}

/* Facebook a jazykove verze: kulate nalepky */
#fb, #en, #de {
	position: absolute;
	top: -70px;
	left: auto;
	margin: 0 !important;
	width: 52px !important;
	height: 52px !important;
	border: var(--vd-border);
	border-radius: 50%;
	opacity: 1;
	background-color: #fff;
	background-size: cover;
	box-shadow: var(--vd-hard-sm);
	transition: transform .12s ease, box-shadow .12s ease;
	z-index: 3;
}

#de { right: var(--vd-gutter); }
#en { right: calc(var(--vd-gutter) + 64px); }
#fb { right: calc(var(--vd-gutter) + 128px); }

#fb:hover, #en:hover, #de:hover {
	transform: translate(-2px, -2px) rotate(-6deg);
	box-shadow: var(--vd-hard);
}

section.blue #cathegorycontent-title {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 28px;
}

section.blue #cathegorycontent-title > .clr {
	display: none;
}

section.blue div.col-1,
section.blue div.col-1:nth-child(n) {
	float: none;
	width: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 26px 24px 24px;
	border: var(--vd-border);
	background: #fff;
	color: var(--vd-text);
	box-shadow: var(--vd-hard-lg);
	transition: transform .15s ease, box-shadow .15s ease;
}

section.blue div.col-1:nth-child(odd) { transform: rotate(-1deg); }
section.blue div.col-1:nth-child(even) { transform: rotate(1deg); }

section.blue div.col-1:hover {
	transform: rotate(0) translate(-3px, -3px);
	box-shadow: 13px 13px 0 var(--vd-navy);
}

section.blue div.col-1 h2 {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 14px;
	padding: 0;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 28px;
	line-height: 1;
	color: var(--vd-navy);
}

section.blue div.col-1 h2 span {
	position: static;
	margin: 0;
	flex: 0 0 54px;
	width: 54px;
	height: 54px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: var(--vd-border);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-size: 22px;
	transform: rotate(-4deg);
}

section.blue div.col-1 p,
section.blue div.col-1:nth-child(n) p {
	min-height: 0;
	margin: 0 0 22px;
	color: var(--vd-text);
	line-height: 1.6;
}

section.blue div.col-1 .bluemore {
	margin-top: auto;
}

/* --------------------------------------------- uvod: o nas, kontakt */

section.lode > .content,
section.white > .content {
	background: #fff;
	border: var(--vd-border);
	box-shadow: var(--vd-hard-lg);
	padding: clamp(22px, 4vw, 52px);
}

section.lode {
	background-color: var(--vd-bg);
	background-position: center;
	padding-left: 16px;
	padding-right: 22px;
}

section.white {
	background: var(--vd-yellow-50);
	padding: 70px 16px 140px 16px;
}

section.white:before {
	background: var(--vd-yellow-50);
}

main.grey:before {
	background: var(--vd-bg);
}

main section.white .content {
	min-height: 0;
}

#kontakt-top-info {
	padding: 0;
	margin-bottom: 24px;
}

#kontakt-top-info h2 {
	display: inline-block;
	margin: 0 0 12px;
	padding: 4px 12px;
	font-size: 22px;
	color: var(--vd-navy);
	background: var(--vd-yellow);
	transform: rotate(-1.5deg);
}

#kontakt-top-info p {
	font-size: 18px;
	padding: 3px 0;
}

.kontakt-icon-effekt {
	color: var(--vd-blue) !important;
}

#noborder {
	border: var(--vd-border) !important;
	box-shadow: var(--vd-hard);
}

section.partneri {
	padding: 64px 16px 110px;
}

section.partneri .contenth2 {
	font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
}

section.partneri img {
	border: var(--vd-border);
	box-shadow: var(--vd-hard-sm);
	transition: transform .12s ease, box-shadow .12s ease;
}

section.partneri a:hover img {
	transform: translate(-2px, -2px) rotate(-1deg);
	box-shadow: var(--vd-hard);
}

/* ------------------------------------------------------- tabulky (cenik) */

.content table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 12px 0 30px;
	border: var(--vd-border);
	box-shadow: var(--vd-hard);
	background: #fff;
	font-size: 16px;
}

.content table th,
.table th {
	background: var(--vd-navy);
	color: #fff;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 15px;
	letter-spacing: .02em;
	text-transform: uppercase;
	text-align: left;
	padding: 14px 16px;
}

.content table td,
.table td {
	padding: 12px 16px;
	border-top: 2px solid var(--vd-blue-100);
	color: var(--vd-text);
	vertical-align: top;
}

.table tr:nth-child(odd),
.table tr:nth-child(even) {
	background: #fff;
	color: var(--vd-text);
}

.content table tbody tr:nth-child(even),
.table tr:nth-child(even) {
	background: var(--vd-blue-50);
}

.content table tr:hover td {
	background: var(--vd-yellow-50);
}

.content table td:first-child {
	font-weight: 700;
	color: var(--vd-navy);
}

/* mobil: tabulka se posouva vodorovne, stranka ne */
@media only screen and (max-width: 799px) {
	.content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		white-space: nowrap;
		box-shadow: var(--vd-hard-sm);
	}
}

/* ------------------------------------------- podstranky: clanky (prose) */

#toppics {
	background-position: center 60%;
}

main.grey {
	background: var(--vd-bg);
	padding: 44px 16px 110px;
}

main.grey > section > .content {
	max-width: 1200px;
}

/* clanek / textova stranka jako plakatovy list */
main.vd-prose > section > .content {
	max-width: 960px;
	background: #fff;
	border: var(--vd-border);
	box-shadow: var(--vd-hard-lg);
	padding: clamp(22px, 5vw, 60px);
}

main.vd-prose.page-cenik > section > .content {
	max-width: 1200px;
}

main.vd-prose > section > .content > :not(table):not(h1):not(.contenth2):not(.contenth3):not(.content),
main.vd-prose > section > .content > .content > * {
	max-width: 72ch;
}

main.vd-prose.page-cenik > section > .content > * {
	max-width: none;
}

main.vd-prose p,
main.vd-prose li {
	font-size: 17px;
	line-height: 1.7;
	color: var(--vd-text);
}

main.vd-prose p {
	margin: 0 0 1.1em;
}

main.vd-prose h2 {
	font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem);
	margin: 1.5em 0 .5em;
}

main.vd-prose h3 {
	font-size: clamp(1.35rem, 1.15rem + .8vw, 1.7rem);
	margin: 1.5em 0 .5em;
}

main.vd-prose h4 {
	font-size: 1.3rem;
	color: var(--vd-blue-dark);
	margin: 1.4em 0 .4em;
}

main.vd-prose ul,
main.vd-prose ol {
	padding-left: 1.3em;
	margin: 0 0 1.2em;
}

main.vd-prose li {
	margin: .3em 0;
}

main.vd-prose ul > li::marker {
	content: "\25A0  ";
	color: var(--vd-yellow);
}

main.vd-prose img {
	border: var(--vd-border);
	box-shadow: var(--vd-hard-sm);
}

main.vd-prose strong {
	color: var(--vd-navy);
	font-weight: 700;
}

/* uklid formatovani z editoru: inline pozadi, pismo a velikost ignorovat,
   aby text z CMS vypadal jednotne */
main.vd-prose .content [style*="background"],
section.lode .content [style*="background"],
section.white .content [style*="background"] {
	background: none !important;
}

main.vd-prose .content [style*="font-family"],
section.lode .content [style*="font-family"],
section.white .content [style*="font-family"] {
	font-family: inherit !important;
}

main.vd-prose .content [style*="font-size"],
section.lode .content [style*="font-size"],
section.white .content [style*="font-size"] {
	font-size: inherit !important;
}

/* text na uvodni strance (o nas, kontakt) stejne jako v clancich */
section.lode .content p,
section.lode .content li {
	font-size: 17px;
	line-height: 1.7;
	color: var(--vd-text);
}

section.lode .content ul {
	padding-left: 1.3em;
}

section.lode .content ul > li::marker {
	content: "\25A0  ";
	color: var(--vd-yellow);
}

section.lode .content strong {
	color: var(--vd-navy);
	font-weight: 700;
}

/* uklid formatovani z editoru (podtrzeni, cerna a cervena barva) */
main.vd-prose span[style*="underline"],
section.lode span[style*="underline"] {
	text-decoration: none !important;
}

main.vd-prose [style*="color: #000000"],
main.vd-prose [style*="color: #000"] {
	color: inherit !important;
}

/* cervene nadpisy z editoru -> zluta paska */
main.vd-prose h3 [style*="color: #ff0000"],
main.vd-prose h3 [style*="color: #FF0000"] {
	display: inline-block;
	padding: 4px 14px;
	background: var(--vd-yellow);
	color: var(--vd-navy) !important;
	transform: rotate(-1.5deg);
	box-shadow: var(--vd-hard-sm);
}

main.vd-prose [style*="color: #ff0000"],
main.vd-prose [style*="color: #FF0000"],
main.vd-prose [style*="color: red"] {
	color: var(--vd-red) !important;
}

/* odstavce jen s &nbsp; (oznaci JS) */
.vd-empty {
	display: none !important;
}

/* caste otazky: otazka jako nadpis s velkou uvozovkou */
main.page-caste-otazky h2 {
	position: relative;
	margin-top: 2em;
	padding-left: 52px;
	font-size: clamp(1.4rem, 1.15rem + 1vw, 1.9rem);
}

main.page-caste-otazky h2::before {
	content: "?";
	position: absolute;
	left: 0;
	top: -4px;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: var(--vd-border);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-size: 24px;
	transform: rotate(-6deg);
	box-shadow: 3px 3px 0 var(--vd-navy);
}

/* doporucene trasy: kazda trasa jako karta (sklada JS) */
.vd-route {
	position: relative;
	margin: 0 0 22px;
	padding: 22px 24px;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard);
	transition: transform .12s ease, box-shadow .12s ease;
}

.vd-route:hover {
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard-lg);
}

.vd-route p {
	margin: 0 0 .5em;
}

.vd-route p:last-child {
	margin-bottom: 0;
}

.vd-route > p:first-child {
	font-size: 17px;
	line-height: 1.45;
}

.vd-route > p:first-child strong {
	font-weight: 400;
	color: var(--vd-muted);
}

.vd-route > p:first-child strong > span:first-child {
	display: block;
	margin-bottom: 6px;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(20px, 1.2rem + .8vw, 26px);
	line-height: 1.05;
	text-transform: uppercase;
	color: var(--vd-navy);
}

/* vypis clanku (modules-articles) jako mrizka plakatu */
.vd-article-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 28px;
	margin: 24px 0;
}

.vd-article-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: var(--vd-border);
	box-shadow: var(--vd-hard);
	transition: transform .12s ease, box-shadow .12s ease;
}

.vd-article-card:hover {
	transform: translate(-3px, -3px);
	box-shadow: var(--vd-hard-lg);
}

.vd-article-card__img {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	border-bottom: var(--vd-border);
	background: var(--vd-blue-50);
}

.vd-article-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border: 0 !important;
	box-shadow: none !important;
	transition: transform .4s ease;
}

.vd-article-card:hover .vd-article-card__img img {
	transform: scale(1.05);
}

.vd-article-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 20px 22px 24px;
}

.vd-article-card__body h2 {
	margin: 0 0 10px !important;
	font-size: 1.6rem !important;
}

.vd-article-card__body h2 a {
	color: var(--vd-navy);
}

.vd-article-card__body p {
	margin: 0 0 18px;
	color: var(--vd-muted);
	font-size: 16px;
}

.vd-article-card__body .more {
	margin-top: auto;
	align-self: flex-start;
}

/* ------------------------------------------------- o nas: casova osa */

.vd-timeline {
	position: relative;
	list-style: none;
	margin: 12px 0 0;
	padding: 0 0 0 44px;
	max-width: none !important;
}

/* reka: silna zluta cara s navy okrajem */
.vd-timeline::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 12px;
	width: 12px;
	border: var(--vd-border);
	background: var(--vd-yellow);
}

.vd-tl-item {
	position: relative;
	margin: 0 0 30px;
	max-width: none !important;
}

.vd-tl-item::before {
	content: "";
	position: absolute;
	top: 10px;
	left: -42px;
	width: 26px;
	height: 26px;
	border: var(--vd-border);
	border-radius: 50%;
	background: #fff;
	box-shadow: 3px 3px 0 var(--vd-navy);
}

.vd-tl-item:last-child::before {
	background: var(--vd-red);
}

.vd-tl-year {
	display: inline-block;
	margin: 0 0 12px;
	padding: 6px 16px;
	border: var(--vd-border);
	background: var(--vd-navy);
	color: var(--vd-yellow);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(22px, 1.2rem + 1vw, 30px);
	line-height: 1;
	letter-spacing: -.01em;
	transform: rotate(-2deg);
	box-shadow: 4px 4px 0 var(--vd-yellow);
}

.vd-tl-item:nth-child(even) .vd-tl-year {
	transform: rotate(2deg);
}

.vd-tl-item:last-child .vd-tl-year {
	background: var(--vd-red);
	color: #fff;
	box-shadow: 4px 4px 0 var(--vd-navy);
}

.vd-tl-body {
	padding: 18px 20px;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard);
}

.vd-tl-body p {
	margin: 0 0 .7em !important;
	max-width: none !important;
	font-size: 17px !important;
}

.vd-tl-body p:last-child {
	margin-bottom: 0 !important;
}

.vd-tl-body p::first-letter {
	text-transform: uppercase;
}

@media only screen and (min-width: 900px) {
	.vd-timeline {
		padding: 0;
	}

	.vd-timeline::before {
		left: 50%;
		transform: translateX(-50%);
	}

	.vd-tl-item {
		width: calc(50% - 70px);
		margin-bottom: -18px;
	}

	.vd-tl-item:nth-child(odd) {
		margin-right: auto;
		text-align: right;
	}

	.vd-tl-item:nth-child(even) {
		margin-left: auto;
	}

	.vd-tl-item::before {
		left: auto;
		right: -62px;
	}

	.vd-tl-item:nth-child(even)::before {
		right: auto;
		left: -62px;
	}

	.vd-tl-item:nth-child(odd) .vd-tl-body {
		text-align: left;
	}

	.vd-tl-item:last-child {
		margin-bottom: 0;
	}
}

/* reka misto rovne cary (sklada modern.js) */
.vd-river-wrap {
	position: relative;
	margin: 12px 0 0;
	max-width: none !important;
	padding: 10px 0 40px;
}

.vd-river {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.vd-river > svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.vd-river__bank,
.vd-river__water,
.vd-river__flow {
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.vd-river__bank {
	stroke: var(--vd-navy);
}

.vd-river__water {
	stroke: var(--vd-blue);
}

/* proud: bile carky tekouci dolu */
.vd-river__flow {
	stroke: #fff;
	stroke-width: 2.5;
	stroke-dasharray: 3 18;
	opacity: .75;
	animation: vd-flow 1.4s linear infinite;
}

@keyframes vd-flow {
	to {
		stroke-dashoffset: -21;
	}
}

.vd-river__buoys circle {
	fill: #fff;
	stroke: var(--vd-navy);
	stroke-width: 3;
}

.vd-river__buoys circle.is-last {
	fill: var(--vd-yellow);
}

.vd-river__boat {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 30px;
	height: 66px;
	transform-origin: 15px 33px;
	filter: drop-shadow(3px 3px 0 rgba(13, 62, 95, .35));
	will-change: transform;
}

.vd-river__boat svg {
	display: block;
	width: 100%;
	height: 100%;
}

.vd-timeline.has-river {
	position: relative;
	z-index: 1;
	margin: 0;
}

.vd-timeline.has-river::before,
.vd-timeline.has-river .vd-tl-item::before {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.vd-river__flow {
		animation: none;
	}
}

/* objeveni pri rolovani (trida vd-reveal se pridava jen kdyz bezi JS) */
.vd-reveal .vd-tl-item {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .5s ease, transform .5s ease;
}

.vd-reveal .vd-tl-item.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.vd-reveal .vd-tl-item {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* -------------------------------------------------------- poptavka */

main.page-poptavka > section > .content,
main.page-rychla-poptavka > section > .content {
	max-width: 1200px;
}

/* kroky poptavky */
.krokpoptavky,
.krokpoptavky:nth-child(n) {
	display: flex;
	align-items: center;
	gap: 18px;
	float: none;
	width: auto;
	height: auto;
	margin: 40px 0 22px;
	padding: 0;
	border-radius: 0;
	opacity: 1;
	cursor: default;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(24px, 1.2rem + 1.4vw, 36px);
	line-height: 1;
	text-transform: uppercase;
}

.krokpoptavky span {
	padding: 0;
	display: inline;
}

.krokpoptavky .circle {
	float: none;
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	margin: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: var(--vd-border);
	border-radius: 0;
	background: var(--vd-yellow);
	color: var(--vd-navy);
	opacity: 1;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 32px;
	transform: rotate(-4deg);
	box-shadow: var(--vd-hard-sm);
}

/* mrizka karet lodi a prislusenstvi */
.showstep.step1 {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 28px;
	padding-top: 0;
}

.showstep.step1 > .contenth3 {
	grid-column: 1 / -1;
	justify-self: start;
	margin: 18px 0 0;
}

.showstep.step1 > .clr {
	display: none;
}

.product-item,
.product-item:nth-child(n) {
	position: relative;
	float: none;
	width: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: var(--vd-border);
	border-radius: 0;
	box-shadow: var(--vd-hard);
	transition: box-shadow .12s ease, transform .12s ease;
}

.product-item:hover {
	transform: translate(-3px, -3px);
	box-shadow: var(--vd-hard-lg);
}

.product-item.prislusenstvi {
	min-height: 0 !important;
	padding: 0 !important;
}

.product-content,
.product-item .product-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	padding: 0 18px 16px;
}

/* obrazek nahore pres celou sirku karty */
.rect-img-container {
	order: -1;
	float: none;
	width: auto;
	height: 170px;
	margin: 0 -18px 16px;
	border: 0;
	border-bottom: var(--vd-border);
	background: #fff;
	overflow: hidden;
}

.rect-img-container a {
	display: block;
	width: 100%;
	height: 100%;
	cursor: zoom-in;
}

.rect-img-container img,
.rect-img-container .rect-img {
	position: static;
	transform: none;
	width: 100%;
	height: 100%;
	padding: 12px;
	object-fit: contain;
	transition: transform .3s ease;
}

.product-item:hover .rect-img-container img {
	transform: scale(1.04);
}

.product-content h4 {
	margin: 0 0 8px;
	padding: 0;
	border: 0;
	text-align: left;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 25px;
	line-height: 1;
	color: var(--vd-navy);
	text-transform: uppercase;
}

.product-content p.product-desc {
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.5;
	color: var(--vd-muted);
}

/* ikony vybavy jako stitky */
.product-contenticon,
.product-item.prislusenstvi .product-contenticon {
	height: auto !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-top: auto;
}

.product-contenticon > .clr {
	display: none;
}

.accessoriesicon {
	position: relative;
	float: none;
	width: auto;
	height: 30px;
	min-width: 30px;
	margin: 0;
	padding: 0 30px 0 10px;
	display: inline-flex;
	align-items: center;
	border: 2px solid var(--vd-navy);
	/* ikony jsou bile PNG, proto zustava modry podklad */
	background-color: var(--vd-blue);
	background-size: 17px;
	background-position: right 7px center;
	color: #fff;
	font-weight: 700;
	font-size: 15px;
}

.accessoriesicon.pojisteni {
	padding: 0;
	width: 30px;
	background-position: center;
}

.accessoriesicon .product-contenticon-title {
	display: none;
}

.accessoriesicon:hover .product-contenticon-title {
	display: block;
	position: absolute;
	bottom: calc(100% + 8px);
	left: 50%;
	transform: translateX(-50%);
	margin: 0;
	padding: 6px 10px;
	border: 2px solid var(--vd-navy);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	box-shadow: 3px 3px 0 var(--vd-navy);
	z-index: 5;
}

/* cena */
.cena,
.product-item .cena {
	flex-basis: 100%;
	margin-top: 12px;
	padding: 0;
	text-align: left;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--vd-muted);
}

.cena span {
	float: none;
	display: block;
	padding: 0;
}

.cena strong {
	padding: 0 2px 0 6px;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 34px;
	line-height: 1;
	letter-spacing: -.02em;
	color: var(--vd-red);
}

/* akce: cervena nalepka */
.akcni {
	background: #fff !important;
}

.akce {
	position: absolute;
	top: -14px;
	right: -14px;
	left: auto;
	z-index: 3;
	width: 64px;
	height: 64px;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: var(--vd-border);
	border-radius: 50%;
	transform: rotate(14deg);
	opacity: 1;
	background: var(--vd-red);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 16px;
	box-shadow: 3px 3px 0 var(--vd-navy);
}

/* ovladani mnozstvi: (i) ... [-] [n] [+] */
.product-action {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 2px dashed var(--vd-line);
}

.product-action > .clr {
	display: none;
}

.product-action .product-button {
	float: none;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: var(--vd-border);
	border-radius: 0;
	font-size: 16px;
	line-height: 1;
	color: var(--vd-navy);
	background: var(--vd-yellow);
	box-shadow: 3px 3px 0 var(--vd-navy);
	transition: transform .1s ease, box-shadow .1s ease;
}

.product-action .product-button:hover {
	background: var(--vd-yellow-300);
	transform: translate(-1px, -1px);
	box-shadow: 4px 4px 0 var(--vd-navy);
}

.product-action .product-button:active {
	transform: translate(3px, 3px);
	box-shadow: 0 0 0 var(--vd-navy);
}

.product-action .button-add[data-action="minus"] {
	order: 1;
	background: #fff;
}

.product-action .button-add[data-action="minus"]:hover {
	background: var(--vd-blue-50);
}

.product-action .mnozstvi {
	order: 2;
}

.product-action .button-add[data-action="plus"] {
	order: 3;
}

.product-action .product-button-detail {
	order: 0;
	margin-right: auto;
	width: 44px !important;
	height: 44px;
	border: 0 !important;
	border-radius: 50%;
	background: transparent !important;
	color: var(--vd-blue) !important;
	font-size: 26px !important;
	box-shadow: none !important;
}

.product-action .product-button-detail:hover {
	color: var(--vd-navy) !important;
	transform: rotate(-8deg);
}

.mnozstvi {
	float: none;
	width: 52px;
	height: 44px;
	padding: 0;
	border: var(--vd-border);
	border-radius: 0;
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 20px;
	text-align: center;
}

/* popis lodi a zvetseny obrazek jako prekryv karty */
.product-content-info {
	position: absolute;
	inset: 0;
	z-index: 10;
	width: auto;
	margin: 0;
	padding: 20px;
	border: 0;
	background: var(--vd-yellow-50);
	color: var(--vd-text);
	font-size: 15px;
	overflow-y: auto;
	box-sizing: border-box;
}

.product-button-close {
	position: sticky;
	top: 0;
	float: right;
	width: 40px;
	height: 40px;
	border: var(--vd-border);
	border-radius: 0;
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-size: 18px;
	box-shadow: 3px 3px 0 var(--vd-navy);
}

.zoomimg {
	position: absolute;
	inset: 0;
	z-index: 10;
	width: auto;
	height: auto;
	margin: 0;
	background: #fff;
	cursor: zoom-out;
}

.zoomimg img {
	position: static;
	transform: none;
	padding: 12px;
	object-fit: contain;
}

/* -------------------------------------------------------- formulare */

/* cela poptavka na jednom bilem listu (lode i formular na stejnem pozadi) */
main.page-poptavka > section > .content,
main.page-rychla-poptavka > section > .content {
	background: #fff;
	border: var(--vd-border);
	box-shadow: var(--vd-hard-lg);
	padding: clamp(20px, 4vw, 52px);
}

main.page-rychla-poptavka > section > .content {
	max-width: 820px;
}

.vd-order-intro {
	max-width: 62ch;
	margin: -.3em 0 1.6em;
	font-size: 19px;
	line-height: 1.5;
	color: var(--vd-text);
}

.vd-step-hint,
.vd-field-hint {
	margin: -8px 0 22px;
	font-size: 16px;
	color: var(--vd-muted);
}

.vd-field-hint {
	margin: -10px 0 22px;
	font-size: 15px;
}

.vd-field-note {
	font-size: 15px;
	color: var(--vd-muted);
}

.vd-req {
	color: var(--vd-red);
	font-weight: 900;
}

/* bloky formulare: bez vlastniho ramecku, jen sirka pro citelnost */
.showstep.step2 {
	max-width: 860px;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

/* dve pole vedle sebe na sirsich obrazovkach */
.vd-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 24px;
}

@media only screen and (min-width: 700px) {
	.vd-row {
		grid-template-columns: 1fr 1fr;
	}
}

/* lista "Vybrano": plovouci tmavy panel nad kartami, vzdy jeden radek */
.vd-basket {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 20000;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 14px;
	width: auto;
	max-width: none;
	margin: 0;
	/* obsah zarovnany na sirku stranky (1200 px), pruh pres celou obrazovku */
	padding: 12px max(16px, calc((100% - 1200px) / 2 + 32px));
	padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	border: 0;
	border-top: 5px solid var(--vd-yellow);
	background: var(--vd-navy);
	color: #fff;
	box-shadow: 0 -8px 28px rgba(13, 62, 95, .3);
}

/* pruh nesmi zakryvat konec stranky ani sipku nahoru */
body:has(.vd-basket) footer {
	padding-bottom: 96px;
}

body:has(.vd-basket) #totop {
	bottom: 104px;
}

/* plovouci tlacitka by se s pruhem prekryvala (Otava je na poptavce zobrazuje) */
body:has(.vd-basket) #poptatfloatMobile,
body:has(.vd-basket) #poptatqfloatMobile {
	display: none;
}

.vd-basket::before {
	content: "Vybráno:";
	flex: 0 0 auto;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 16px;
	text-transform: uppercase;
	color: var(--vd-yellow);
}

/* stitky: pri vetsim poctu se zalomi do dalsiho radku, vse zustava videt */
.vd-basket__list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	flex: 1 1 auto;
	min-width: 0;
}

.vd-basket__item {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: stretch;
	background: #fff;
	color: var(--vd-navy);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	transition: opacity .2s ease;
}

.vd-basket__qty {
	display: inline-flex;
	align-items: center;
	padding: 5px 7px;
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-weight: 900;
}

.vd-basket__name {
	display: inline-flex;
	align-items: center;
	padding: 5px 8px;
}

.vd-basket__item.is-removing {
	opacity: .4;
}

.vd-basket__remove {
	flex: 0 0 30px;
	width: 30px;
	padding: 0;
	border: 0;
	border-left: 1px solid var(--vd-line);
	background: #fff;
	color: var(--vd-red);
	font-size: 13px;
	font-weight: 900;
	line-height: 1;
	cursor: pointer;
	transition: background-color .1s ease, color .1s ease;
}

.vd-basket__remove:hover,
.vd-basket__remove:focus-visible {
	background: var(--vd-red);
	color: #fff;
	outline: none;
}
.vd-basket .vd-basket__next {
	flex: 0 0 auto;
	padding: 10px 16px;
	border-color: var(--vd-yellow);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-size: 15px;
	white-space: nowrap;
	box-shadow: none;
}

.vd-basket .vd-basket__next:hover {
	background: var(--vd-yellow-300);
	color: var(--vd-navy);
	transform: none;
	box-shadow: none;
}

.vd-basket__empty {
	color: rgba(255, 255, 255, .85);
	font-size: 15px;
	white-space: nowrap;
}

.vd-basket.is-empty .vd-basket__next {
	display: none;
}

.vd-basket.is-empty .vd-basket__list {
	-webkit-mask-image: none;
	mask-image: none;
}

/* mobil: pres sirku obrazovky, tlacitko jen sipka */
@media only screen and (max-width: 699px) {
	.vd-basket {
		gap: 10px;
		padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) 12px;
	}

	body:has(.vd-basket) footer {
		padding-bottom: 80px;
	}

	body:has(.vd-basket) #totop {
		bottom: 84px;
	}

	.vd-basket::before {
		font-size: 14px;
	}

	.vd-basket__item {
		font-size: 13px;
	}

	.vd-basket__qty,
	.vd-basket__name {
		padding: 4px 6px;
	}

	.vd-basket__remove {
		flex-basis: 34px;
		width: 34px;
	}

	.vd-basket__empty {
		font-size: 14px;
		white-space: normal;
	}

	.vd-basket .vd-basket__next {
		padding: 8px 12px;
		font-size: 0;
		gap: 0;
	}

	.vd-basket .vd-basket__next::after {
		font-size: 22px;
	}
}
/* vybrana lod je zvyraznena */
.product-item.is-selected {
	border-color: var(--vd-red);
	box-shadow: 6px 6px 0 var(--vd-red);
}

/* nativni rozbalovaci seznamy (nahrazuji modre vlastni) */
.formline select.vd-select,
p.formline select.vd-select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 48px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='3' stroke-linecap='square'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 20px;
	cursor: pointer;
}

.formline select.vd-select:invalid,
.formline select.vd-select option[value=""] {
	color: #8ea2b3;
}

.formline select.vd-select option {
	color: var(--vd-navy);
}

.formline .is-invalid {
	border-color: var(--vd-red) !important;
	box-shadow: 4px 4px 0 var(--vd-red);
}

/* souhlas */
.vd-consent .title-form a {
	color: var(--vd-blue-600);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.vd-consent.is-invalid {
	border-color: var(--vd-red) !important;
	background: #fdecec !important;
}

/* souhrn chyb nad tlacitkem */
.vd-form-errors {
	margin: 0 0 18px;
	padding: 16px 18px;
	border: var(--vd-bw) solid var(--vd-red);
	background: #fdecec;
	color: var(--vd-red-700);
	box-shadow: 4px 4px 0 var(--vd-red);
}

.vd-form-errors strong {
	display: block;
	margin-bottom: 6px;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 18px;
	text-transform: uppercase;
}

.vd-form-errors .errinput {
	margin: 2px 0;
	padding: 0;
	background: none;
	color: var(--vd-red-700);
	font-size: 16px;
}

.vd-form-errors .errinput::before {
	content: "\2192  ";
}

.formline-submit .vd-field-hint {
	margin: 20px 0 0;
}

.formline-submit .g-recaptcha {
	display: block !important;
}

.formline-submit .g-recaptcha:empty {
	display: none !important;
}

.formline,
p.formline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin: 0 0 22px;
	font-size: 16px;
}

.title-form {
	display: block;
	flex: 0 0 100%;
	width: auto;
	padding: 0;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 15px;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--vd-navy);
}

.title-form:empty {
	display: none;
}

.formline .input,
p.formline .input,
p.formline .inputbig,
p.formline .inputsmall,
p.formline .selectsmall,
p.formline select,
.formline textarea {
	flex: 1 1 100%;
	width: 100% !important;
	min-width: 0;
	min-height: 50px;
	padding: 12px 14px;
	border: var(--vd-border);
	border-radius: 0;
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-body);
	font-size: 17px;
	transition: box-shadow .12s ease, transform .12s ease;
}

.formline .input::placeholder {
	color: #8ea2b3;
}

.formline .input:focus,
.formline select:focus,
.formline textarea:focus {
	outline: none;
	box-shadow: 5px 5px 0 var(--vd-yellow);
	transform: translate(-2px, -2px);
}

/* datum + priblizny cas vedle sebe */
p.formline #datumod,
p.formline #datumdo {
	flex: 1 1 180px;
	width: auto !important;
	cursor: pointer;
}

p.formline .selectsmall {
	flex: 0 1 190px;
	width: auto !important;
}

p.formline .inputtextarea,
.inputtextarea {
	width: 100% !important;
	height: auto;
	min-height: 130px;
	display: block;
	resize: vertical;
}

.errinput {
	flex: 0 0 100%;
	margin: 0;
	padding: 4px 10px;
	background: var(--vd-red);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

.infopoptavkaico {
	padding-left: 6px;
	font-size: 18px;
	color: var(--vd-blue);
	cursor: pointer;
	vertical-align: -1px;
}

/* rozbalovaci vybery (generuje voddog_final.js) */
.custom-select-wrapper {
	display: block;
	flex: 1 1 100%;
	width: 100%;
}

.custom-select,
.custom-select2,
.custom-select-wrapper .custom-select,
.custom-select-wrapper .custom-select2 {
	display: block;
	width: 100%;
	margin: 0;
}

.custom-select-trigger {
	width: 100%;
	padding: 0 52px 0 16px;
	border: var(--vd-border);
	background: var(--vd-navy);
	color: #fff;
	font-family: var(--vd-font-display);
	font-weight: 700;
	font-size: 17px;
	line-height: 46px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	box-shadow: var(--vd-hard-sm);
	transition: background-color .12s ease;
}

.custom-select-trigger:hover {
	background: var(--vd-blue-dark);
}

.custom-select-trigger:after {
	right: 20px;
	width: 12px;
	height: 12px;
	border-bottom: 3px solid var(--vd-yellow);
	border-right: 3px solid var(--vd-yellow);
}

.custom-options {
	margin-top: 6px;
	max-height: 320px;
	overflow-y: auto;
	border: var(--vd-border);
	border-radius: 0;
	box-shadow: var(--vd-hard);
}

.custom-option {
	padding: 0 16px;
	font-size: 17px;
	line-height: 44px;
	color: var(--vd-navy);
	border-bottom: 1px solid var(--vd-blue-100);
}

.custom-option:hover {
	background: var(--vd-yellow-50);
}

.custom-option.selection {
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-weight: 700;
}

/* souhlas: zaskrtavaci pole vlevo, text vpravo */
.formline .checkboxinput,
.checkboxinput {
	order: -1;
	flex: 0 0 30px;
	width: 30px;
	height: 30px;
	margin: 0;
	-webkit-appearance: none;
	appearance: none;
	border: var(--vd-border);
	border-radius: 0;
	background: #fff center / 22px no-repeat;
	box-shadow: 3px 3px 0 var(--vd-navy);
	cursor: pointer;
	transition: background-color .1s ease;
}

.checkboxinput:focus-visible {
	outline: 3px solid var(--vd-yellow);
	outline-offset: 3px;
}

.checkboxinput:checked {
	background-color: var(--vd-yellow);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='3.6' stroke-linecap='square'%3E%3Cpath d='M4.5 12.5l5 5L19.5 6.5'/%3E%3C/svg%3E");
}

.vd-consent,
.formline:has(.checkboxinput) {
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 16px;
	padding: 18px;
	border: 2px dashed var(--vd-navy);
	background: var(--vd-yellow-50);
}

.vd-consent .title-form,
.formline:has(.checkboxinput) .title-form {
	flex: 1 1 auto;
	font-family: var(--vd-font-body);
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1.5;
	color: var(--vd-text);
}

/* odeslani – JS nastavuje barvu inline, proto !important */
button.odeslatpooptavku,
button.odeslatpooptavkuq {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	max-width: 460px;
	margin-top: 10px;
	padding: 18px 28px;
	border: var(--vd-border);
	border-radius: 0;
	background: var(--vd-red) !important;
	color: #fff !important;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 21px;
	letter-spacing: .02em;
	text-transform: uppercase;
	box-shadow: var(--vd-hard);
	transition: transform .12s ease, box-shadow .12s ease;
}

button.odeslatpooptavku:hover:not(:disabled),
button.odeslatpooptavkuq:hover:not(:disabled) {
	background: var(--vd-red-700) !important;
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard-lg);
}

button.odeslatpooptavku:active:not(:disabled),
button.odeslatpooptavkuq:active:not(:disabled) {
	transform: translate(4px, 4px);
	box-shadow: 2px 2px 0 var(--vd-navy);
}

button.odeslatpooptavku:disabled,
button.odeslatpooptavkuq:disabled {
	background: #d5dee6 !important;
	color: #7d90a0 !important;
	border-color: #9fb1c0;
	cursor: not-allowed;
	box-shadow: 4px 4px 0 #9fb1c0;
}

.formline-submit {
	display: block;
	margin-top: 8px;
}

.g-recaptcha {
	margin: 4px 0 8px;
}

/* kalendar (jQuery UI) */
.ui-datepicker,
.ui-widget.ui-datepicker {
	z-index: 30000 !important;
	width: 312px;
	max-width: calc(100vw - 24px);
	margin-top: 6px;
	padding: 0 10px 10px;
	border: var(--vd-border) !important;
	border-radius: 0 !important;
	background: #fff !important;
	color: var(--vd-navy);
	box-shadow: var(--vd-hard);
	font-family: var(--vd-font-body);
	font-size: 16px;
}

.ui-datepicker .ui-datepicker-header {
	margin: 0 -10px 8px;
	padding: 10px 48px;
	border: 0;
	border-bottom: var(--vd-border);
	border-radius: 0;
	background: var(--vd-yellow);
	color: var(--vd-navy);
}

.ui-datepicker .ui-datepicker-title {
	margin: 0;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 20px;
	line-height: 32px;
	text-transform: uppercase;
}

.ui-datepicker .ui-datepicker-title select {
	width: auto;
	margin: 0 4px;
	padding: 2px 6px;
	border: 2px solid var(--vd-navy);
	border-radius: 0;
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 17px;
	text-transform: uppercase;
	cursor: pointer;
}

/* sipky misto tmavych ikon ze sprite */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	top: 10px !important;
	width: 32px;
	height: 32px;
	border: 2px solid var(--vd-navy) !important;
	border-radius: 0;
	background: #fff !important;
	cursor: pointer;
	box-shadow: 2px 2px 0 var(--vd-navy);
}

.ui-datepicker .ui-datepicker-prev { left: 10px !important; }
.ui-datepicker .ui-datepicker-next { right: 10px !important; }

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: none !important;
}

.ui-datepicker .ui-datepicker-prev::after,
.ui-datepicker .ui-datepicker-next::after {
	content: "\2039";
	display: block;
	color: var(--vd-navy);
	font-size: 28px;
	font-weight: 900;
	line-height: 26px;
	text-align: center;
}

.ui-datepicker .ui-datepicker-next::after {
	content: "\203A";
}

.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover {
	background: var(--vd-yellow-300) !important;
}

.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled {
	opacity: .3;
}

.ui-datepicker table {
	margin: 0;
	font-size: 16px;
	border-collapse: separate;
	border-spacing: 3px;
}

.ui-datepicker th {
	padding: 4px 0;
	color: var(--vd-muted);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
}

.ui-datepicker td {
	padding: 0;
}

.ui-datepicker td a.ui-state-default,
.ui-datepicker td span.ui-state-default {
	padding: 7px 0;
	border: 2px solid var(--vd-blue-100) !important;
	border-radius: 0;
	background: #fff !important;
	color: var(--vd-navy) !important;
	font-weight: 700;
	text-align: center;
}

.ui-datepicker td a.ui-state-default:hover {
	border-color: var(--vd-navy) !important;
	background: var(--vd-yellow) !important;
}

.ui-datepicker td a.ui-state-highlight {
	border-color: var(--vd-yellow) !important;
	background: var(--vd-yellow-50) !important;
}

.ui-datepicker td a.ui-state-active {
	border-color: var(--vd-navy) !important;
	background: var(--vd-navy) !important;
	color: #fff !important;
}

.ui-datepicker td.ui-state-disabled span.ui-state-default {
	border-color: transparent !important;
	color: #a9b8c5 !important;
	font-weight: 400;
}

/* datum a cas: vedle sebe i na mobilu, s ikonou */
p.formline #datumod,
p.formline #datumdo {
	padding-left: 46px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='2.4' stroke-linecap='square'%3E%3Crect x='3.5' y='5' width='17' height='15.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E") no-repeat 14px center / 20px;
	font-weight: 700;
}

p.formline select.selectsmall.vd-select {
	flex: 0 0 124px;
	padding-left: 40px;
	padding-right: 30px;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='2.4' stroke-linecap='square'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E") no-repeat 12px center / 19px,
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='3' stroke-linecap='square'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center / 16px,
		#fff;
	font-weight: 700;
}

/* vyber casu (sklada modern.js nad puvodnim selectem) */
p.formline:has(#datumod),
p.formline:has(#datumdo) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 118px;
	gap: 8px 10px;
}

p.formline:has(#datumod) > .title-form,
p.formline:has(#datumdo) > .title-form,
p.formline:has(#datumod) > .errinput,
p.formline:has(#datumdo) > .errinput {
	grid-column: 1 / -1;
}

.vd-time {
	position: relative;
	display: block;
	min-width: 0;
}

.vd-time .vd-time__native,
.vd-pick .vd-time__native,
.formline select.vd-select.vd-time__native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-height: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	opacity: 0;
	pointer-events: none;
}

.vd-time__btn {
	width: 100%;
	min-height: 50px;
	padding: 0 10px 0 40px;
	border: var(--vd-border);
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='2.4' stroke-linecap='square'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E") no-repeat 12px center / 20px;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 18px;
	text-align: left;
	cursor: pointer;
	transition: box-shadow .12s ease, transform .12s ease;
}

.vd-time__btn.is-empty {
	color: #8ea2b3;
	font-weight: 700;
}

.vd-time__btn:hover,
.vd-time__btn[aria-expanded="true"] {
	box-shadow: 5px 5px 0 var(--vd-yellow);
	transform: translate(-2px, -2px);
}

.vd-times {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 30000;
	width: 300px;
	padding: 0 14px 14px;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard);
}

.vd-times[hidden] {
	display: none;
}

.vd-times__title {
	margin: 0 -14px 10px;
	padding: 10px 14px;
	border-bottom: var(--vd-border);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 18px;
	text-transform: uppercase;
}

.vd-times__label {
	margin: 8px 0 6px;
	color: var(--vd-muted);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.vd-times__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 6px;
}

.vd-times button {
	padding: 8px 0;
	border: 2px solid var(--vd-blue-100);
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 16px;
	cursor: pointer;
	transition: background-color .1s ease, border-color .1s ease;
}

.vd-times button:hover,
.vd-times button:focus-visible {
	border-color: var(--vd-navy);
	background: var(--vd-yellow);
	outline: none;
}

.vd-times button.is-active {
	border-color: var(--vd-navy);
	background: var(--vd-navy);
	color: #fff;
}

.vd-times .vd-times__none {
	width: 100%;
	margin-top: 12px;
	border-color: var(--vd-navy);
	box-shadow: 2px 2px 0 var(--vd-navy);
}

/* ostatni vybery (mista, pocet osob) a prepinac (pojisteni) */
.vd-pick {
	position: relative;
	display: block;
	flex: 1 1 100%;
	min-width: 0;
}

.vd-pick__btn {
	width: 100%;
	min-height: 50px;
	padding: 0 46px 0 14px;
	border: var(--vd-border);
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='3' stroke-linecap='square'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 20px;
	color: var(--vd-navy);
	font-family: var(--vd-font-body);
	font-weight: 700;
	font-size: 17px;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: pointer;
	transition: box-shadow .12s ease, transform .12s ease;
}

.vd-pick__btn.is-empty {
	color: #8ea2b3;
	font-weight: 400;
}

.vd-pick__btn:hover,
.vd-pick__btn[aria-expanded="true"] {
	box-shadow: 5px 5px 0 var(--vd-yellow);
	transform: translate(-2px, -2px);
}

.vd-pick__panel {
	left: 0;
	right: auto;
	width: max(100%, 300px);
	max-height: 380px;
	overflow-y: auto;
}

.vd-times__list {
	display: grid;
	gap: 6px;
}

.vd-times .vd-times__list button {
	padding: 10px 12px;
	font-family: var(--vd-font-body);
	font-weight: 700;
	font-size: 16px;
	text-align: left;
}

.vd-times__grid--num {
	grid-template-columns: repeat(5, 1fr);
	margin-top: 8px;
}

.vd-seg {
	display: grid;
	grid-auto-columns: 1fr;
	grid-auto-flow: column;
	border: var(--vd-border);
	box-shadow: var(--vd-hard-sm);
}

.vd-seg button {
	min-height: 46px;
	padding: 6px 10px;
	border: 0;
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 16px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .1s ease;
}

.vd-seg button + button {
	border-left: var(--vd-border);
}

.vd-seg button:hover {
	background: var(--vd-yellow-50);
}

.vd-seg button.is-active {
	background: var(--vd-navy);
	color: #fff;
}

@media only screen and (max-width: 480px) {
	.vd-pick__panel {
		width: auto;
	}

	.vd-times {
		position: fixed;
		top: auto;
		left: 12px;
		right: 12px;
		bottom: 12px;
		width: auto;
		max-height: calc(100vh - 24px);
		overflow-y: auto;
	}
}
/* rozbalovaci mesic v kalendari: vlastni sipka, aby nezasahovala do textu */
.ui-datepicker .ui-datepicker-title select.ui-datepicker-month {
	-webkit-appearance: none;
	appearance: none;
	width: auto;
	min-width: 0;
	padding: 2px 26px 2px 8px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='3.4' stroke-linecap='square'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 6px center / 13px;
}

p.formline:has(#datumod),
p.formline:has(#datumdo) {
	flex-wrap: wrap;
}

p.formline:has(#datumod) .title-form,
p.formline:has(#datumdo) .title-form {
	flex-basis: 100%;
}

p.formline #datumod,
p.formline #datumdo {
	flex: 1 1 140px;
	min-width: 0;
}

.swal2-popup {
	border: var(--vd-border) !important;
	border-radius: 0 !important;
	box-shadow: var(--vd-hard-lg) !important;
	font-family: var(--vd-font-body) !important;
}

/* ------------------------------------------- plovouci tlacitka a nahoru */

#poptatfloatMobile,
#poptatqfloatMobile {
	position: fixed;
	z-index: 20000;
	display: inline-flex;
	flex-direction: row-reverse;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: auto;
	height: auto;
	padding: 12px 18px;
	border: var(--vd-border);
	border-radius: 0;
	opacity: 1;
	color: #fff;
	font-family: var(--vd-font-display);
	font-weight: 900;
	box-shadow: var(--vd-hard);
	transition: transform .12s ease, box-shadow .12s ease;
}

#poptatfloatMobile:hover,
#poptatqfloatMobile:hover {
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard-lg);
}

#poptatfloatMobile,
#poptatfloatMobile:hover { background: var(--vd-green); color: #fff; }
#poptatqfloatMobile,
#poptatqfloatMobile:hover { background: var(--vd-yellow); color: var(--vd-navy); }

#poptatfloatMobile br,
#poptatqfloatMobile br {
	display: none;
}

#poptatfloatMobile span,
#poptatqfloatMobile span,
#poptatfloatMobile span:first-child,
#poptatqfloatMobile span:first-child {
	padding: 0;
	font-size: 17px;
	line-height: 1;
	text-transform: uppercase;
}

#poptatfloatMobile.poptatfloathidden,
#poptatqfloatMobile.poptatfloathidden {
	display: none;
}

#totop {
	left: auto;
	right: 24px;
	bottom: 24px;
	width: 50px;
	height: 50px;
	margin: 0;
	border: var(--vd-border);
	border-radius: 0;
	background: #fff;
	opacity: 1;
	text-align: center;
	line-height: 44px;
	box-shadow: var(--vd-hard-sm);
}

#totop span {
	position: static;
	margin: 0;
	color: var(--vd-navy);
	font-size: 26px;
	line-height: 44px;
}

/* desktop: dve tlacitka vpravo dole nad sebou, sipka nahoru vlevo */
@media only screen and (min-width: 800px) {
	#poptatfloatMobile {
		left: auto;
		right: 28px;
		bottom: 96px;
		min-width: 190px;
		transform: rotate(-2deg);
	}

	#poptatqfloatMobile {
		right: 28px;
		bottom: 28px;
		min-width: 190px;
		transform: rotate(1deg);
	}

	#totop {
		right: auto;
		left: 24px;
	}
}

/* mobil: spodni lista se dvema tlacitky */
@media only screen and (max-width: 799px) {
	#poptatfloatMobile,
	#poptatqfloatMobile {
		bottom: 12px;
		bottom: calc(12px + env(safe-area-inset-bottom, 0px));
		height: 54px;
		padding: 0 10px;
		box-shadow: var(--vd-hard-sm);
	}

	#poptatfloatMobile {
		left: 12px;
		right: calc(50% + 6px);
	}

	#poptatqfloatMobile {
		left: calc(50% + 6px);
		right: 16px;
	}

	#totop {
		right: 16px;
		bottom: 82px;
		width: 44px;
		height: 44px;
		line-height: 38px;
	}

	#totop span {
		line-height: 38px;
		font-size: 22px;
	}

	footer {
		padding-bottom: 82px;
	}
}

/* ------------------------------------------------------------- kontakty */

section.white > .content {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 48px;
	align-items: start;
}

section.white > .content > a[name] {
	position: absolute;
}

section.white > .content > .contenth2 {
	grid-column: 1 / -1;
}

/* mapa */
section.white > .content > p:has(iframe) {
	margin: 0;
}

@media only screen and (min-width: 900px) {
	section.white > .content {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	}

	section.white > .content > #kontakt-top-info {
		grid-column: 1;
		grid-row: 2;
	}

	section.white > .content > p:has(iframe) {
		grid-column: 2;
		grid-row: 2 / span 2;
		height: 100%;
	}

	section.white > .content > p:has(iframe) iframe {
		height: 100% !important;
		min-height: 420px;
	}

	section.white > .content > .vd-contact-cta {
		grid-column: 1;
		grid-row: 3;
	}
}

/* mapa pres celou sirku (presouva ji modern.js) */
section.white.vd-has-map > .content {
	grid-template-columns: 1fr;
}

section.white.vd-has-map > .content > * {
	grid-column: 1 !important;
	grid-row: auto !important;
}

.vd-contact-map {
	margin: 32px -16px -140px;
	padding: 0;
	line-height: 0;
}

.vd-contact-map iframe,
#noborder.vd-contact-map,
.vd-contact-map #noborder {
	display: block;
	width: 100% !important;
	height: 360px !important;
	border: 0 !important;
	border-top: var(--vd-border) !important;
	box-shadow: none !important;
}

@media only screen and (min-width: 900px) {
	section.white.vd-has-map {
		min-height: 720px;
		padding-top: 90px;
		padding-bottom: 150px;
	}

	section.white.vd-has-map > .content {
		max-width: 600px;
		margin-left: max(16px, calc((100% - 1200px) / 2));
		margin-right: auto;
	}

	.vd-contact-map {
		position: absolute;
		inset: 0;
		z-index: 0;
		margin: 0;
		overflow: hidden;
	}

	/* sirsi mapa posune stred (spendlik) doprava, mimo kartu */
	.vd-contact-map iframe,
	.vd-contact-map #noborder {
		width: 150% !important;
		height: 100% !important;
		border-top: 0 !important;
	}
}

#kontakt-top-info.vd-contact {
	margin: 0 0 24px;
}

#kontakt-top-info.vd-contact h2 {
	margin-bottom: 18px;
}

.vd-contact__tiles {
	display: grid;
	gap: 14px;
	margin-bottom: 22px;
}

#kontakt-top-info .vd-contact__tile {
	margin: 0;
	padding: 0;
}

.vd-contact__tile a {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px;
	border: var(--vd-border);
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(22px, 1.2rem + 1vw, 30px);
	line-height: 1.1;
	box-shadow: var(--vd-hard);
	transition: transform .12s ease, box-shadow .12s ease;
}

.vd-contact__tile--phone a {
	background: var(--vd-yellow);
}

.vd-contact__tile a:hover {
	color: var(--vd-navy);
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard-lg);
}

.vd-contact__tile .kontakt-icon-effekt {
	flex: 0 0 44px;
	width: 44px !important;
	height: 44px;
	padding: 0 !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--vd-navy);
	background: #fff;
	color: var(--vd-navy) !important;
	font-size: 20px !important;
}

.vd-contact__tile--phone .kontakt-icon-effekt {
	background: var(--vd-navy);
	color: var(--vd-yellow) !important;
}

.vd-contact__details {
	display: grid;
	gap: 2px;
	padding: 16px 18px;
	border-left: 6px solid var(--vd-yellow);
	background: var(--vd-yellow-50);
}

#kontakt-top-info .vd-contact__details p {
	margin: 0;
	padding: 2px 0;
	font-size: 16px;
	color: var(--vd-text);
}

#kontakt-top-info .vd-contact__details p strong {
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 19px;
	text-transform: uppercase;
	color: var(--vd-navy);
}

#kontakt-top-info .vd-contact__note {
	padding-left: 35px !important;
	color: var(--vd-muted) !important;
	font-size: 14px !important;
	font-style: italic;
}

.vd-contact-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin: 6px 0 30px;
}

.bluemore.vd-btn-light {
	background: #fff;
}

.bluemore.vd-btn-light:hover {
	background: var(--vd-blue-50);
}

/* ------------------------------------------------------------- paticka */

footer {
	margin-top: -50px;
	padding: 0;
	min-height: 0;
	border: 0;
	background: var(--vd-navy);
	color: rgba(255, 255, 255, .85);
}

/* zluty pruh s vyzvou */
.vd-footer-cta {
	position: relative;
	padding: 34px 0 30px;
	border-top: var(--vd-border);
	border-bottom: var(--vd-border);
	background: var(--vd-yellow);
}

.vd-footer-cta > .content {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px 32px;
}

.vd-footer-cta__title {
	margin: 0;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(30px, 1.2rem + 3vw, 56px);
	line-height: .95;
	letter-spacing: -.02em;
	text-transform: uppercase;
	color: var(--vd-navy);
}

.vd-footer-cta__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
}

.vd-footer-cta .bluemore {
	background: var(--vd-red);
	color: #fff;
	font-size: 18px;
	padding: 14px 22px;
}

.vd-footer-cta .bluemore:hover {
	background: var(--vd-red-700);
	color: #fff;
}

.vd-footer-phone {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 18px;
	border: var(--vd-border);
	background: #fff;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 24px;
	line-height: 1;
	white-space: nowrap;
	box-shadow: var(--vd-hard-sm);
	transition: transform .12s ease, box-shadow .12s ease;
}

.vd-footer-phone:hover {
	color: var(--vd-navy);
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard);
}

.vd-footer-phone .fas {
	font-size: 18px;
	color: var(--vd-red);
}

/* sloupce */
footer > .vd-footer-cols {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px 40px;
	padding-top: 48px;
	padding-bottom: 40px;
}

footer .sloupce-footer,
footer .sloupec-1,
footer .sloupec-2,
footer .sloupec-3 {
	display: block !important;
	float: none;
	width: auto !important;
	padding: 0;
}

.vd-footer-logo {
	display: inline-block;
	margin-bottom: 14px;
	transition: transform .2s ease;
}

.vd-footer-logo:hover {
	transform: rotate(-6deg);
}

.vd-footer-logo img {
	display: block;
	width: 110px;
	height: 110px;
	filter: drop-shadow(4px 4px 0 rgba(0, 0, 0, .35));
}

.vd-footer-brand p {
	max-width: 32ch;
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .8);
}

.sloupce-footer h2 {
	display: inline-block;
	margin: 0 0 16px;
	padding: 3px 10px;
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 17px;
	line-height: 1.3;
	letter-spacing: .02em;
	text-transform: uppercase;
	transform: rotate(-2deg);
}

.sloupce-footer a,
.sloupec-1 a,
.sloupec-2 a {
	display: block;
	width: fit-content;
	padding: 5px 0;
	font-weight: 400;
	font-size: 16px;
	color: rgba(255, 255, 255, .82);
	text-transform: none;
	transition: color .12s ease, transform .12s ease;
}

.sloupce-footer a:hover {
	color: var(--vd-yellow);
	transform: translateX(4px);
}

.sloupec-1 a.active {
	color: var(--vd-yellow);
}

.vd-footer-brand a.vd-footer-logo:hover {
	transform: rotate(-6deg);
}

.sloupec-3 p {
	margin: 0 0 10px;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .6);
}

/* "© VOD-DOG.cz | info@vod-dog.cz" na jednom radku, e-mail beze zmeny velikosti pisma */
.sloupec-3 p:first-child {
	margin-bottom: 12px;
	color: #fff;
	font-family: var(--vd-font-body);
	font-weight: 700;
	font-size: 17px;
	text-transform: none;
	white-space: nowrap;
}

@media only screen and (min-width: 700px) {
	footer > .vd-footer-cols {
		grid-template-columns: 1fr 1fr;
	}
}

@media only screen and (min-width: 1280px) {
	footer > .vd-footer-cols {
		grid-template-columns: 1.2fr .8fr 1.2fr 1.4fr;
	}
}

@media only screen and (max-width: 799px) {
	footer {
		padding-bottom: 82px;
	}
}

/* ============================================ mobil: uvodni stranka a tabulky */

.vd-more__btn {
	display: none;
}

@media only screen and (max-width: 699px) {
	/* karty sluzeb: vodorovne posuvny pas, vykukuje dalsi karta */
	section.blue #cathegorycontent-title {
		display: flex;
		gap: 16px;
		margin: 0 calc(-1 * var(--vd-gutter));
		padding: 6px var(--vd-gutter) 22px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 var(--vd-gutter);
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	section.blue #cathegorycontent-title::-webkit-scrollbar {
		display: none;
	}

	section.blue div.col-1,
	section.blue div.col-1:nth-child(n) {
		flex: 0 0 82%;
		scroll-snap-align: start;
		transform: none;
		padding: 20px 18px;
		box-shadow: 6px 6px 0 var(--vd-navy);
	}

	section.blue div.col-1:hover {
		transform: none;
		box-shadow: 6px 6px 0 var(--vd-navy);
	}

	section.blue div.col-1 h2 {
		font-size: 22px;
	}

	section.blue div.col-1 h2 span {
		flex-basis: 44px;
		width: 44px;
		height: 44px;
		font-size: 18px;
	}

	section.blue div.col-1 p,
	section.blue div.col-1:nth-child(n) p {
		font-size: 16px;
		margin-bottom: 16px;
	}

	section.blue {
		padding-bottom: 30px;
	}

	#fb, #en, #de {
		top: -62px;
		width: 44px !important;
		height: 44px !important;
	}

	#en { right: calc(var(--vd-gutter) + 54px); }
	#fb { right: calc(var(--vd-gutter) + 108px); }

	/* o nas na uvodni strance: zkraceny text s tlacitkem */
	section.lode {
		padding-left: 12px;
		padding-right: 18px;
	}

	section.lode > .content.vd-more:not(.is-open) {
		position: relative;
		max-height: 820px;
		overflow: hidden;
	}

	section.lode > .content.vd-more:not(.is-open)::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: 160px;
		background: linear-gradient(rgba(255, 255, 255, 0), #fff 85%);
		pointer-events: none;
	}

	.vd-more__btn {
		display: flex;
		position: relative;
		z-index: 10400;
		margin: -26px auto 0;
		width: fit-content;
	}

	section.lode .content p,
	section.lode .content li {
		font-size: 16px;
		line-height: 1.6;
	}

	section.lode > .content,
	section.white > .content {
		box-shadow: 6px 6px 0 var(--vd-navy);
	}

	/* tabulky jako karticky: nazev nahore, ceny pod nim s popiskem sloupce */
	.content table.vd-table-stack {
		display: block;
		overflow: visible;
		white-space: normal;
		border: 0;
		box-shadow: none;
		background: transparent;
	}

	.content table.vd-table-stack thead {
		display: none;
	}

	.content table.vd-table-stack tbody {
		display: grid;
		gap: 12px;
	}

	.content table.vd-table-stack tr,
	.content table.vd-table-stack tbody tr:nth-child(n) {
		display: block;
		border: var(--vd-border);
		background: #fff;
		box-shadow: 4px 4px 0 var(--vd-navy);
	}

	.content table.vd-table-stack td {
		display: flex;
		justify-content: space-between;
		gap: 12px;
		padding: 7px 12px;
		border-top: 1px solid var(--vd-blue-100);
		background: transparent !important;
		font-size: 15px;
	}

	.content table.vd-table-stack td::before {
		content: attr(data-label);
		color: var(--vd-muted);
		font-size: 13px;
		font-weight: 700;
		text-transform: uppercase;
	}

	.content table.vd-table-stack td:first-child {
		display: block;
		padding: 10px 12px;
		border-top: 0;
		background: var(--vd-navy) !important;
		color: #fff;
		font-family: var(--vd-font-display);
		font-weight: 900;
		font-size: 17px;
		text-transform: uppercase;
	}

	.content table.vd-table-stack td:first-child::before {
		content: none;
	}

	/* kontakty: mensi dlazdice */
	.vd-contact__tile a {
		padding: 12px 14px;
		gap: 12px;
		font-size: 21px;
		box-shadow: 4px 4px 0 var(--vd-navy);
	}

	.vd-contact__tile .kontakt-icon-effekt {
		flex-basis: 36px;
		width: 36px !important;
		height: 36px;
		font-size: 17px !important;
	}

	.vd-contact-cta .bluemore {
		flex: 1 1 auto;
		justify-content: center;
	}

	/* paticka: navigace a informace vedle sebe */
	footer > .vd-footer-cols {
		grid-template-columns: 1fr 1fr;
		gap: 26px 20px;
		padding-top: 36px;
	}

	footer .vd-footer-brand,
	footer .sloupec-3 {
		grid-column: 1 / -1;
	}

	footer .vd-footer-brand {
		display: flex !important;
		align-items: center;
		gap: 16px;
	}

	.vd-footer-logo {
		flex: 0 0 auto;
		margin: 0;
	}

	.vd-footer-logo img {
		width: 80px;
		height: 80px;
	}

	.vd-footer-cta {
		padding: 26px 0 24px;
	}

	.vd-footer-cta__actions {
		width: 100%;
	}

	.vd-footer-cta__actions > a {
		flex: 1 1 auto;
		justify-content: center;
	}

	.sloupce-footer a,
	.sloupec-1 a,
	.sloupec-2 a {
		font-size: 15px;
	}
}
/* ============================================ mobil: poptavka */
@media only screen and (max-width: 699px) {
	/* poptavka pres celou sirku obrazovky */
	main.page-poptavka,
	main.page-rychla-poptavka {
		padding-left: 0;
		padding-right: 0;
	}

	main.page-poptavka > section > .content,
	main.page-rychla-poptavka > section > .content {
		border-left: 0;
		border-right: 0;
		box-shadow: none;
		padding: 26px 16px 30px;
	}

	.vd-order-intro {
		font-size: 17px;
	}

	.krokpoptavky,
	.krokpoptavky:nth-child(n) {
		gap: 14px;
		margin: 30px 0 14px;
		font-size: 24px;
	}

	.krokpoptavky .circle {
		flex-basis: 48px;
		width: 48px;
		height: 48px;
		font-size: 24px;
	}

	.showstep.step1 {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	/* kompaktni karta: obrazek vlevo, nazev/popis/cena vpravo, ovladani dole */
	.product-item,
	.product-item:nth-child(n) {
		box-shadow: 4px 4px 0 var(--vd-navy);
	}

	.product-item.is-selected {
		box-shadow: 4px 4px 0 var(--vd-red);
	}

	.product-item:hover {
		transform: none;
		box-shadow: 4px 4px 0 var(--vd-navy);
	}

	.product-item .product-content {
		display: grid;
		grid-template-columns: 104px minmax(0, 1fr);
		grid-template-areas:
			"img title"
			"img desc"
			"img meta"
			"act act";
		column-gap: 12px;
		align-content: start;
		padding: 0 12px 10px 0;
	}

	.rect-img-container {
		grid-area: img;
		order: 0;
		width: auto;
		height: auto;
		min-height: 112px;
		margin: 0;
		border-bottom: 0;
		border-right: var(--vd-border);
		align-self: stretch;
	}

	.rect-img-container img,
	.rect-img-container .rect-img {
		padding: 6px;
	}

	.product-item:hover .rect-img-container img {
		transform: none;
	}

	.product-content h4 {
		grid-area: title;
		margin: 10px 0 4px;
		font-size: 19px;
	}

	.product-content p.product-desc {
		grid-area: desc;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		margin: 0 0 6px;
		font-size: 13px;
		line-height: 1.4;
	}

	.product-contenticon,
	.product-item.prislusenstvi .product-contenticon {
		grid-area: meta;
		margin-top: 0;
		gap: 4px;
		align-self: end;
	}

	.accessoriesicon {
		height: 24px;
		min-width: 24px;
		padding: 0 21px 0 6px;
		border-width: 1.5px;
		background-size: 13px;
		background-position: right 5px center;
		font-size: 12px;
	}

	.accessoriesicon.pojisteni {
		width: 24px;
	}

	.cena,
	.product-item .cena {
		margin-top: 6px;
		font-size: 12px;
	}

	.cena strong {
		font-size: 25px;
	}

	.product-action {
		grid-area: act;
		margin: 10px 0 0 12px;
		padding-top: 10px;
	}

	.product-action .product-button,
	.mnozstvi {
		height: 40px;
	}

	.product-action .product-button {
		width: 40px;
	}

	.product-action .product-button-detail {
		width: 40px !important;
		height: 40px;
	}

	.akce {
		top: -10px;
		right: -8px;
		width: 50px;
		height: 50px;
		font-size: 13px;
	}

	.showstep.step1 > .contenth3 {
		margin-top: 8px;
		font-size: 22px;
	}

	/* formular */
	.vd-seg button {
		font-size: 15px;
	}

	.vd-consent,
	.formline:has(.checkboxinput) {
		padding: 14px;
	}

	button.odeslatpooptavku,
	button.odeslatpooptavkuq {
		max-width: none;
		font-size: 19px;
	}
}
/* ============================================ detaily */

/* text jen pro ctecky obrazovky */
.vd-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* doporucene trasy: delka a cas jako stitky */
.vd-route__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 8px;
}

.vd-route__meta span {
	padding: 3px 10px;
	border: 2px solid var(--vd-navy);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 15px;
	text-transform: uppercase;
}

.vd-route__meta span + span {
	background: #fff;
}

/* po odeslani poptavky */
.vd-thanks .contenth2::before {
	content: "\2713";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin-bottom: 18px;
	border: var(--vd-border);
	border-radius: 50%;
	background: var(--vd-green);
	color: #fff;
	font-size: 40px;
	box-shadow: var(--vd-hard-sm);
	transform: rotate(-6deg);
}

.vd-thanks p {
	font-size: 19px !important;
}

.vd-thanks__next {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 28px;
	max-width: none !important;
}
/* ============================================ EN / DE uvodni stranka */
section.white.vd-lang-main > .content {
	display: block;
}

.vd-lang-intro {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px 40px;
	margin-bottom: 10px;
}

.vd-lang-intro p {
	margin: 0 0 1em;
	font-size: 18px;
	line-height: 1.7;
}

.vd-lang-services {
	margin: 0 0 1em;
	padding: 18px 20px 18px 40px;
	border: var(--vd-border);
	background: var(--vd-yellow-50);
	box-shadow: var(--vd-hard-sm);
}

.vd-lang-services li {
	margin: 6px 0;
	font-size: 17px;
	font-weight: 500;
	color: var(--vd-navy);
}

.vd-lang-services li::marker {
	content: "\2713  ";
	color: var(--vd-green);
	font-weight: 900;
}

.vd-lang-note {
	margin-top: -14px;
	color: var(--vd-muted);
	font-size: 15px;
}

.vd-lang-contact {
	margin-top: 30px;
}

.vd-lang-contact > p {
	max-width: 62ch;
	font-size: 18px;
}

.vd-lang-contact .vd-contact__tiles {
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	max-width: 900px;
}

@media only screen and (min-width: 900px) {
	.vd-lang-intro {
		grid-template-columns: 1.4fr 1fr;
		align-items: start;
	}
}
/* ============================================ ceník */
.vd-lead {
	margin: -6px 0 22px;
	font-size: 18px;
	color: var(--vd-muted);
}

main.page-cenik .contenth4,
.vd-lang-main .contenth4 {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 30px 0 12px;
	font-size: 24px;
	color: var(--vd-navy);
}

main.page-cenik .contenth4::after,
.vd-lang-main .contenth4::after {
	content: "";
	flex: 1;
	height: 3px;
	background: var(--vd-blue-100);
}

.content table td.vd-num {
	font-weight: 700;
	color: var(--vd-navy);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.content table td.vd-muted {
	color: #8ea2b3;
	font-size: 14px;
}

@media only screen and (min-width: 700px) {
	main.page-cenik .content table th:not(:first-child),
	main.page-cenik .content table td.vd-num,
	main.page-cenik .content table td.vd-muted,
	.vd-lang-main table th:not(:first-child),
	.vd-lang-main table td.vd-num {
		text-align: right;
	}
}

main.page-cenik .content table td:first-child {
	min-width: 220px;
}

main.page-cenik a.bluemore {
	margin: 4px 0 10px;
}
/* ============================================ časté otázky jako rozbalovací bloky */
.vd-faq {
	margin: 0 0 14px;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard-sm);
	max-width: none !important;
}

.vd-faq > summary {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	cursor: pointer;
	list-style: none;
}

.vd-faq > summary::-webkit-details-marker {
	display: none;
}

.vd-faq > summary::after {
	content: "+";
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	margin-left: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--vd-navy);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 24px;
	line-height: 1;
}

.vd-faq[open] > summary::after {
	content: "\2212";
	background: var(--vd-navy);
	color: #fff;
}

.vd-faq > summary:hover {
	background: var(--vd-yellow-50);
}

main.page-caste-otazky .vd-faq > summary h2 {
	margin: 0;
	padding: 0 0 0 46px;
	border: 0;
	background: none;
	font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem);
}

main.page-caste-otazky .vd-faq > summary h2::before {
	top: 50%;
	transform: translateY(-50%) rotate(-6deg);
}

.vd-faq__body {
	padding: 4px 18px 16px;
	border-top: 2px solid var(--vd-blue-100);
}

.vd-faq__body > :first-child {
	margin-top: 12px;
}

/* úvod: dlouhý text "o nás" zkrácený i na desktopu */
@media only screen and (min-width: 700px) {
	section.lode > .content.vd-more:not(.is-open) {
		position: relative;
		max-height: 1000px;
		overflow: hidden;
	}

	section.lode > .content.vd-more:not(.is-open)::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: 180px;
		background: linear-gradient(rgba(255, 255, 255, 0), #fff 85%);
		pointer-events: none;
	}

	.vd-more__btn {
		display: flex;
		position: relative;
		z-index: 10400;
		margin: -28px auto 0;
		width: fit-content;
	}
}
/* ============================================ partneri: decentni pruh s logy */
section.partneri {
	min-height: 0;
	padding: 56px 16px 96px;
	background: #fff;
}

section.partneri:before {
	background: #fff;
}

section.partneri > .content {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px 40px;
}

section.partneri .contenth2,
section.partneri h2.contenth2 {
	flex: 0 0 auto;
	margin: 0;
	padding: 0 22px 0 0;
	border-right: 3px solid var(--vd-blue-100);
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: .12em;
	color: var(--vd-muted);
}

section.partneri .contenth2::after {
	display: none;
}

section.partneri p {
	margin: 0;
	line-height: 0;
}

section.partneri a {
	display: inline-block;
}

section.partneri img {
	width: auto;
	height: 72px;
	border: 0;
	box-shadow: none;
	filter: grayscale(.85) contrast(.95);
	opacity: .8;
	transition: filter .2s ease, opacity .2s ease, transform .2s ease;
}

section.partneri a:hover img,
section.partneri a:focus-visible img {
	filter: none;
	opacity: 1;
	transform: translateY(-2px);
	box-shadow: none;
}

@media only screen and (max-width: 699px) {
	section.partneri {
		padding: 40px 16px 80px;
	}

	section.partneri > .content {
		gap: 14px 24px;
	}

	section.partneri .contenth2,
	section.partneri h2.contenth2 {
		flex-basis: 100%;
		padding: 0;
		border: 0;
	}

	section.partneri img {
		height: 56px;
	}
}
/* kontaktni dlazdice: telefon a e-mail nikdy nezalamovat */
.vd-contact__value {
	white-space: nowrap;
}

.vd-lang-contact .vd-contact__tiles {
	grid-template-columns: repeat(auto-fit, minmax(300px, max-content));
	max-width: none;
}

.vd-lang-contact .vd-contact__tile a {
	font-size: clamp(20px, 1rem + 1vw, 26px);
}

@media only screen and (max-width: 420px) {
	.vd-lang-contact .vd-contact__tiles {
		grid-template-columns: 1fr;
	}

	.vd-contact__tile a {
		font-size: 19px;
	}
}
/* EN/DE: cesky nadpis partneru z CMS nahrazuje vlastni */
.vd-lang section.partneri .contenth2:not(.vd-own) {
	display: none;
}

/* ============================================ kontaktni udaje: popisek – hodnota */
.vd-contact__dl {
	display: grid;
	grid-template-columns: 82px minmax(0, 1fr);
	gap: 8px 14px;
	margin: 0;
	padding: 18px 20px;
	border: 2px solid var(--vd-blue-100);
	background: var(--vd-blue-50);
}

.vd-contact__dl dt {
	padding-top: 3px;
	color: var(--vd-muted);
	font-family: var(--vd-font-display);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.vd-contact__dl dd {
	margin: 0;
	color: var(--vd-text);
	font-size: 16px;
	line-height: 1.5;
}

.vd-contact__dl dd.is-name {
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 19px;
	text-transform: uppercase;
}

.vd-contact__dl .vd-contact__note {
	display: block;
	color: var(--vd-muted);
	font-size: 14px;
	font-style: italic;
}

/* ============================================ prechody mezi sekcemi: jednotny sikmy okraj */
:root {
	--vd-cut: 56px;
}

/* puvodni sikme pruhy (main.css) uz nejsou potreba */
#jssor_1:after,
section.lode:before,
section.white:before,
section.partneri:before,
main.grey:before {
	content: none !important;
	display: none !important;
}

section.blue,
section.lode,
section.white,
section.partneri,
main.grey,
footer {
	position: relative;
	margin-top: calc(-1 * var(--vd-cut));
	clip-path: polygon(0 var(--vd-cut), 100% 0, 100% 100%, 0 100%);
}

/* kazda dalsi sekce lezi nad predchozi */
section.blue { z-index: 10100; padding-top: calc(var(--vd-cut) + 74px); }
section.lode { z-index: 10110; padding-top: calc(var(--vd-cut) + 56px); padding-bottom: calc(var(--vd-cut) + 64px); }
section.white { z-index: 10120; padding-top: calc(var(--vd-cut) + 56px); padding-bottom: calc(var(--vd-cut) + 64px); }
main.grey { z-index: 10110; padding-top: calc(var(--vd-cut) + 30px); padding-bottom: calc(var(--vd-cut) + 64px); }
section.partneri { z-index: 10130; padding-top: calc(var(--vd-cut) + 30px); padding-bottom: calc(var(--vd-cut) + 40px); }
footer { z-index: 10140; padding-top: 0; }

/* zluty pruh paticky zacina sikmym okrajem paticky */
.vd-footer-cta {
	border-top: 0;
	padding-top: calc(var(--vd-cut) + 24px);
}

/* mapa v kontaktech: sikmy okraj sekce plati i pro ni */
section.white.vd-has-map {
	padding-top: calc(var(--vd-cut) + 70px);
}

@media only screen and (max-width: 699px) {
	:root {
		--vd-cut: 30px;
	}

	section.blue { padding-top: calc(var(--vd-cut) + 70px); }
	section.lode,
	section.white { padding-top: calc(var(--vd-cut) + 30px); padding-bottom: calc(var(--vd-cut) + 40px); }
	main.grey { padding-top: calc(var(--vd-cut) + 20px); }
}
/* ============================================ kontakty: tmava plakatova sekce bez mapy */
section.white.vd-contacts {
	background: var(--vd-navy);
	color: #fff;
}

section.white.vd-contacts > .content {
	display: block;
	max-width: 1200px;
	padding: 0 var(--vd-gutter);
	border: 0;
	background: transparent;
	box-shadow: none;
}

section.white.vd-contacts .contenth2 {
	color: #fff;
}

section.white.vd-contacts .contenth2 .h2ico {
	color: var(--vd-yellow);
}

section.white.vd-contacts .contenth2::after {
	box-shadow: 4px 4px 0 rgba(0, 0, 0, .35);
}

section.white.vd-contacts #kontakt-top-info {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px 40px;
	margin: 0 0 28px;
}

/* "Kontaktni osoba" uz je v seznamu udaju */
section.white.vd-contacts #kontakt-top-info > h2 {
	display: none;
}

section.white.vd-contacts .vd-contact__tiles {
	margin: 0;
	align-content: start;
}

section.white.vd-contacts .vd-contact__tile a {
	border-color: #000;
	box-shadow: 6px 6px 0 rgba(0, 0, 0, .4);
}

section.white.vd-contacts .vd-contact__tile a:hover {
	box-shadow: 9px 9px 0 rgba(0, 0, 0, .4);
}

.vd-contact__aside {
	display: grid;
	gap: 14px;
	align-content: start;
}

section.white.vd-contacts .vd-contact__dl {
	border: 2px solid rgba(255, 255, 255, .18);
	background: rgba(255, 255, 255, .06);
}

section.white.vd-contacts .vd-contact__dl dt {
	color: rgba(255, 255, 255, .6);
}

section.white.vd-contacts .vd-contact__dl dd,
section.white.vd-contacts .vd-contact__dl dd.is-name {
	color: #fff;
}

section.white.vd-contacts .vd-contact__dl .vd-contact__note {
	color: rgba(255, 255, 255, .6);
}

.vd-contact__places {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 14px 18px 14px 56px;
	border: 2px solid var(--vd-yellow);
	background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23eabb38' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E") no-repeat 16px center / 26px;
	color: #fff;
	transition: background-color .15s ease;
}

.vd-contact__places strong {
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 19px;
	text-transform: uppercase;
	color: var(--vd-yellow);
}

.vd-contact__places span {
	font-size: 15px;
	color: rgba(255, 255, 255, .8);
}

.vd-contact__places:hover {
	background-color: rgba(234, 187, 56, .12);
	color: #fff;
}

section.white.vd-contacts .vd-contact-cta {
	margin: 0;
}

section.white.vd-contacts .vd-contact-cta .bluemore {
	border-color: #000;
	box-shadow: 4px 4px 0 rgba(0, 0, 0, .4);
}

@media only screen and (min-width: 900px) {
	section.white.vd-contacts #kontakt-top-info {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}
/* karta s textem na uvodu: vic mista nad nadpisem */
section.lode > .content {
	padding-top: clamp(34px, 5vw, 72px);
}
/* ============================================ mapa reky a planovac plavby */
main.vd-prose.page-mapa-reky > section > .content {
	max-width: 1200px;
}

main.page-mapa-reky > section > .content > * {
	max-width: none !important;
}

.vd-planner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	margin: 10px 0 40px;
}

.vd-planner__form {
	align-self: start;
	padding: 20px;
	border: var(--vd-border);
	background: var(--vd-yellow-50);
	box-shadow: var(--vd-hard-sm);
}

.vd-planner__select {
	width: 100%;
	min-height: 50px;
	padding: 10px 44px 10px 12px;
	border: var(--vd-border);
	border-radius: 0;
	-webkit-appearance: none;
	appearance: none;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='3' stroke-linecap='square'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 18px;
	color: var(--vd-navy);
	font-family: var(--vd-font-body);
	font-weight: 700;
	font-size: 16px;
	cursor: pointer;
}

.vd-planner__map {
	min-height: 380px;
	border: var(--vd-border);
	box-shadow: var(--vd-hard);
	background: var(--vd-blue-50);
	z-index: 0;
}

.vd-planner__stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin: 4px 0 14px;
}

.vd-planner__stats div {
	padding: 10px 8px;
	border: 2px solid var(--vd-navy);
	background: #fff;
	text-align: center;
}

.vd-planner__stats dt {
	color: var(--vd-muted);
	font-family: var(--vd-font-display);
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
}

.vd-planner__stats dd {
	margin: 2px 0 0;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 22px;
	line-height: 1.1;
}

.vd-planner__price {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin: 0;
	padding: 8px 0;
	border-bottom: 1px solid var(--vd-line);
	font-size: 15px !important;
}

.vd-planner__price strong {
	color: var(--vd-navy);
	white-space: nowrap;
}

.vd-planner__weirs {
	margin: 10px 0 0;
}

.vd-planner__weirs summary {
	cursor: pointer;
	color: var(--vd-blue-600);
	font-weight: 700;
}

.vd-planner__weirs ul {
	margin: 8px 0 0;
	padding-left: 1.1em;
	font-size: 15px;
}

.vd-planner__cta {
	margin-top: 16px;
}

.vd-planner__note,
.vd-planner__warn {
	margin: 12px 0 0 !important;
	font-size: 13px !important;
	color: var(--vd-muted) !important;
}

.vd-planner__warn {
	color: var(--vd-red-700) !important;
	font-weight: 700;
}

/* znacky startu a cile */
.vd-pin span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 3px solid var(--vd-navy);
	border-radius: 50% 50% 50% 0;
	transform: rotate(-45deg);
	background: var(--vd-green);
	color: #fff;
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 15px;
	box-shadow: 2px 2px 0 rgba(0, 0, 0, .35);
}

.vd-pin--cil span {
	background: var(--vd-red);
}

.vd-planner__popup {
	display: grid;
	gap: 6px;
	min-width: 160px;
	font-family: var(--vd-font-body);
}

.vd-planner__popup strong {
	color: var(--vd-navy);
	font-size: 15px;
}

.vd-planner__popup span {
	color: var(--vd-red);
	font-weight: 700;
}

.vd-planner__popup button {
	padding: 6px 8px;
	border: 2px solid var(--vd-navy);
	background: var(--vd-yellow);
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	text-transform: uppercase;
	cursor: pointer;
}

.vd-planner__popup button + button {
	background: #fff;
}

@media only screen and (min-width: 900px) {
	.vd-planner {
		grid-template-columns: 340px minmax(0, 1fr);
	}

	.vd-planner__map {
		min-height: 560px;
	}
}

/* schematicka mapa (vlozene SVG) */
.vd-schema-wrap {
	margin: 10px 0 14px;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard-sm);
	overflow-x: auto;
}

.vd-schema {
	display: block;
	width: 100%;
	min-width: 760px;
	height: auto;
}

.vd-schema text {
	font-family: var(--vd-font-display);
}

.vd-schema__name {
	font-weight: 900;
	font-size: 15px;
	fill: var(--vd-navy);
	text-transform: uppercase;
}

.vd-schema__km {
	font-weight: 700;
	font-size: 14px;
	fill: var(--vd-red);
}

.vd-schema__title {
	font-weight: 900;
	font-size: 34px;
	fill: var(--vd-navy);
}

.vd-schema__legend text {
	font-size: 14px;
	font-weight: 700;
	fill: var(--vd-navy);
}

.vd-schema__legend .vd-schema__note {
	font-weight: 400;
	fill: var(--vd-muted);
}

.vd-schema__flow {
	animation: vd-flow 1.6s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
	.vd-schema__flow {
		animation: none;
	}
}

.vd-schema-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin: 0 0 30px;
}
.vd-schema-wrap,
.vd-schema-cta {
	max-width: none !important;
}

/* Leaflet: obecne styly obrazku z clanku nesmi zasahovat do mapy */
.leaflet-container img,
main.vd-prose .leaflet-container img {
	max-width: none !important;
	max-height: none !important;
	border: 0 !important;
	box-shadow: none !important;
}

.leaflet-container {
	font-family: var(--vd-font-body);
}
/* ============================================ poptavka: vyber mist na mape (okno) */
.vd-map-open {
	margin: -6px 0 18px;
}

.vd-open-map {
	padding-left: 46px;
	background: var(--vd-yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d3e5f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4 3 6v14l6-2 6 2 6-2V4l-6 2-6-2z'/%3E%3Cpath d='M9 4v14M15 6v14'/%3E%3C/svg%3E") no-repeat 14px center / 22px;
}

html.vd-modal-open,
html.vd-modal-open body {
	overflow: hidden;
}

.vd-modal {
	position: fixed;
	inset: 0;
	z-index: 40000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(13, 62, 95, .72);
}

.vd-modal[hidden] {
	display: none;
}

.vd-modal__box {
	display: flex;
	flex-direction: column;
	width: min(1180px, 100%);
	max-height: calc(100vh - 40px);
	overflow: auto;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard-lg);
}

.vd-modal__head {
	position: sticky;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 12px 16px 12px 20px;
	border-bottom: var(--vd-border);
	background: var(--vd-yellow);
}

.vd-modal__head h2 {
	margin: 0;
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: clamp(19px, 1rem + 1vw, 26px);
	text-transform: uppercase;
}

.vd-modal__close {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	border: var(--vd-border);
	background: #fff;
	color: var(--vd-navy);
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 3px 3px 0 var(--vd-navy);
}

.vd-modal__close:hover {
	background: var(--vd-yellow-50);
}

.vd-modal__hint {
	margin: 14px 20px 0;
	color: var(--vd-text);
	font-size: 15px;
}

.vd-planner--modal {
	margin: 14px 20px 20px;
}

.vd-planner--modal .vd-planner__map {
	min-height: 360px;
}

@media only screen and (min-width: 900px) {
	.vd-planner--modal .vd-planner__map {
		min-height: 520px;
	}
}

/* mobil: okno pres celou obrazovku, mapa nahore */
@media only screen and (max-width: 699px) {
	.vd-modal {
		padding: 0;
	}

	.vd-modal__box {
		width: 100%;
		height: 100%;
		max-height: none;
		border: 0;
		box-shadow: none;
	}

	.vd-planner--modal {
		margin: 12px;
	}

	.vd-planner--modal .vd-planner__map {
		order: -1;
		min-height: 300px;
	}

	.vd-modal__hint {
		margin: 10px 12px 0;
		font-size: 14px;
	}
}
/* ============================================ plovouci tlacitko "Mapa reky" */
#vdMapFloat {
	position: fixed;
	z-index: 20000;
	display: inline-flex;
	flex-direction: row-reverse;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 18px;
	border: var(--vd-border);
	background: var(--vd-blue);
	color: #fff;
	font-family: var(--vd-font-display);
	font-weight: 900;
	box-shadow: var(--vd-hard);
	transition: transform .12s ease, box-shadow .12s ease;
}

#vdMapFloat:hover {
	color: #fff;
	transform: translate(-2px, -2px);
	box-shadow: var(--vd-hard-lg);
}

#vdMapFloat span:first-child {
	font-size: 17px;
	line-height: 1;
	text-transform: uppercase;
}

.vd-float-map {
	width: 20px;
	height: 20px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4 3 6v14l6-2 6 2 6-2V4l-6 2-6-2z'/%3E%3Cpath d='M9 4v14M15 6v14'/%3E%3C/svg%3E") no-repeat center / contain;
}

#vdMapFloat.poptatfloathidden,
body:has(main.page-mapa-reky) #vdMapFloat,
body:has(.vd-basket) #vdMapFloat {
	display: none;
}

@media only screen and (min-width: 800px) {
	#vdMapFloat {
		right: 28px;
		bottom: 164px;
		min-width: 190px;
		transform: rotate(1.5deg);
	}
}

/* mobil: tri tlacitka vedle sebe ve spodni liste */
@media only screen and (max-width: 799px) {
	#vdMapFloat {
		bottom: calc(12px + env(safe-area-inset-bottom, 0px));
		height: 54px;
		padding: 0 6px;
		gap: 6px;
		box-shadow: var(--vd-hard-sm);
	}

	#vdMapFloat span:first-child {
		font-size: 14px;
	}

	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatfloatMobile {
		left: 8px;
		right: calc(66.66% + 4px);
	}

	body:has(#vdMapFloat:not(.poptatfloathidden)) #vdMapFloat {
		left: calc(33.33% + 4px);
		right: calc(33.33% + 4px);
	}

	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatqfloatMobile {
		left: calc(66.66% + 4px);
		right: 10px;
	}

	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatfloatMobile span,
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatqfloatMobile span {
		font-size: 14px;
	}

	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatfloatMobile,
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatqfloatMobile {
		padding: 0 6px;
		gap: 6px;
	}
}
/* ---------------- planovac: vlastni vyber mista (seznam jako zastavky na rece) */
.vd-rpick__btn {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 54px;
}

.vd-rpick__btn .vd-rpick__name {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.vd-rpick__btn .vd-rpick__km {
	flex: 0 0 auto;
	padding: 3px 7px;
	background: var(--vd-blue-50);
	color: var(--vd-blue-600);
	font-family: var(--vd-font-display);
	font-weight: 700;
	font-size: 13px;
	line-height: 1.2;
}

.vd-rpick__panel {
	width: 100%;
	max-height: min(420px, 60vh);
	padding-bottom: 8px;
}

.vd-rpick__panel .vd-times__title {
	position: sticky;
	top: 0;
	z-index: 1;
}

.vd-rpick__list {
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}

/* tok reky vlevo, mista jako zastavky */
.vd-rpick__list::before {
	content: "";
	position: absolute;
	top: 18px;
	bottom: 18px;
	left: 13px;
	width: 4px;
	background: var(--vd-blue);
}

.vd-rpick__list li {
	margin: 0 !important;
	padding: 0 !important;
}

.vd-rpick__list li::before {
	content: none !important;
}

.vd-times .vd-rpick__list button {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	min-height: 44px;
	padding: 6px 10px 6px 34px;
	border: 2px solid transparent;
	background: transparent;
	font-family: var(--vd-font-body);
	font-weight: 700;
	font-size: 16px;
	text-align: left;
}

.vd-times .vd-rpick__list button::before {
	content: "";
	position: absolute;
	left: 7px;
	top: 50%;
	width: 12px;
	height: 12px;
	margin-top: -8px;
	border: 2px solid var(--vd-navy);
	border-radius: 50%;
	background: #fff;
}

.vd-rpick__list .vd-rpick__name {
	flex: 1 1 auto;
	min-width: 0;
}

.vd-rpick__list small {
	display: block;
	margin-top: 1px;
	color: var(--vd-muted);
	font-weight: 400;
	font-size: 13px;
}

.vd-rpick__list .vd-rpick__km {
	flex: 0 0 auto;
	color: var(--vd-muted);
	font-family: var(--vd-font-display);
	font-size: 14px;
}

.vd-times .vd-rpick__list button:hover,
.vd-times .vd-rpick__list button:focus-visible {
	border-color: var(--vd-navy);
	background: var(--vd-yellow-50);
}

.vd-times .vd-rpick__list button.is-active {
	border-color: var(--vd-navy);
	background: var(--vd-navy);
	color: #fff;
}

.vd-times .vd-rpick__list button.is-active::before {
	border-color: #fff;
	background: var(--vd-yellow);
}

.vd-times .vd-rpick__list button.is-active small,
.vd-times .vd-rpick__list button.is-active .vd-rpick__km {
	color: rgba(255, 255, 255, .8);
}

.vd-times .vd-rpick__list button[disabled] {
	color: #9aabb9;
	cursor: not-allowed;
}

.vd-times .vd-rpick__list button[disabled]::before {
	border-color: #b7c5d1;
}

.vd-times .vd-rpick__list button[disabled]:hover {
	border-color: transparent;
	background: transparent;
}

/* ---------------- planovac: souhrn trasy (delka a jezy vedle sebe, cas pres celou sirku) */
.vd-planner__stats {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 6px 0 16px;
}

.vd-planner__stats div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
	padding: 12px 14px;
	text-align: left;
}

.vd-planner__stats dd {
	margin: 0;
	font-size: 26px;
	white-space: nowrap;
}

.vd-planner__stats .vd-planner__time {
	grid-column: 1 / -1;
	background: var(--vd-navy);
	border-color: var(--vd-navy);
}

.vd-planner__stats .vd-planner__time dt {
	color: var(--vd-yellow);
}

.vd-planner__stats .vd-planner__time dd {
	color: #fff;
}

.vd-planner__stats dd small {
	display: block;
	margin-top: 4px;
	color: rgba(255, 255, 255, .78);
	font-family: var(--vd-font-body);
	font-weight: 400;
	font-size: 14px;
	white-space: normal;
}

/* ---------------- mapa: znacky mist, kempu a jezu + legenda */
.vd-mk {
	background: none;
	border: 0;
}

.vd-mk > span {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	background-position: center;
	background-repeat: no-repeat;
}

/* misto VodDogu: zluty ctverec s lodi */
.vd-mk--voddog > span {
	border: 3px solid var(--vd-navy);
	background-color: var(--vd-yellow);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 12h20c-2 4-5.5 6-10 6S4 16 2 12z' fill='%230d3e5f'/%3E%3Cpath d='M15 4l-5 11' stroke='%230d3e5f' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
	background-size: 16px;
	box-shadow: 2px 2px 0 var(--vd-navy);
}

/* kemp / taboriste: zeleny stan */
.vd-mk--kemp > span {
	border: 2px solid var(--vd-navy);
	border-radius: 50%;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4 3 20h18L12 4z' fill='%232e8b4f'/%3E%3Cpath d='M12 11l-3.2 9h6.4L12 11z' fill='%23fff'/%3E%3C/svg%3E");
	background-size: 14px;
}

/* jez: cerveny kosoctverec s prickou */
.vd-mk--jez > span {
	border: 2px solid #fff;
	background-color: var(--vd-red-700, #b3261e);
	background-image: linear-gradient(#fff, #fff);
	background-size: 70% 3px;
	transform: rotate(45deg) scale(.8);
	box-shadow: 0 0 0 1px var(--vd-navy);
}

.vd-legend {
	display: grid;
	gap: 2px;
	padding: 6px;
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard-sm);
	font-family: var(--vd-font-body);
}

.vd-legend__item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 5px 8px;
	border: 0;
	background: none;
	color: var(--vd-navy);
	font-weight: 700;
	font-size: 14px;
	line-height: 1.2;
	text-align: left;
	cursor: pointer;
}

.vd-legend__item:hover {
	background: var(--vd-yellow-50);
}

.vd-legend__item small {
	display: block;
	color: var(--vd-muted);
	font-weight: 400;
	font-size: 12px;
}

.vd-legend__item .vd-mk {
	flex: 0 0 auto;
	display: block;
	width: 20px;
	height: 20px;
}

.vd-legend__item .vd-mk--jez {
	width: 16px;
	height: 16px;
	margin: 0 2px;
}

.vd-legend__item:not(.is-on) {
	opacity: .45;
}

.vd-legend__item:not(.is-on) > span:last-child {
	text-decoration: line-through;
}

.leaflet-tooltip small {
	color: var(--vd-muted);
}

@media only screen and (max-width: 599px) {
	.vd-legend {
		grid-auto-flow: column;
		gap: 0;
		padding: 3px;
	}

	.vd-legend__item {
		gap: 6px;
		padding: 4px 6px;
		font-size: 12px;
	}

	.vd-legend__item small {
		display: none;
	}
}

.vd-rpick__btn {
	min-height: 54px;
	padding-top: 8px;
	padding-bottom: 8px;
	white-space: normal;
	line-height: 1.2;
}

.vd-rpick__btn .vd-rpick__name {
	overflow: visible;
	text-overflow: clip;
}

@media only screen and (max-width: 480px) {
	.vd-rpick__panel {
		width: auto;
		max-height: 70vh;
	}
}

/* mobil: tri plovouci tlacitka stejne vysoka, text na jeden radek */
@media only screen and (max-width: 799px) {
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatfloatMobile,
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatqfloatMobile,
	#vdMapFloat {
		height: 54px;
		min-height: 0;
		padding: 0 4px;
		gap: 6px;
		white-space: nowrap;
	}

	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatfloatMobile span:first-child,
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatqfloatMobile span:first-child,
	#vdMapFloat span:first-child {
		font-size: 14px;
		letter-spacing: 0;
	}
}

@media only screen and (max-width: 400px) {
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatfloatMobile span:last-child,
	body:has(#vdMapFloat:not(.poptatfloathidden)) #poptatqfloatMobile span:last-child,
	#vdMapFloat .vd-float-map {
		display: none;
	}
}

/* vetsi znacky; misto VodDogu = logo */
.vd-mk--voddog > span {
	border: 3px solid var(--vd-navy);
	border-radius: 50%;
	background-color: #fff;
	background-image: url("../img/logo-vod-dog.png.webp");
	background-size: 112%;
	box-shadow: 2px 2px 0 var(--vd-navy);
}

.vd-mk--kemp > span {
	border-width: 3px;
	background-size: 19px;
	box-shadow: 2px 2px 0 rgba(13, 62, 95, .35);
}

.vd-mk--jez > span {
	border-width: 3px;
	background-size: 70% 4px;
}

.leaflet-marker-icon.vd-mk--voddog:hover {
	z-index: 1000 !important;
}

.vd-legend__item .vd-mk {
	width: 26px;
	height: 26px;
}

.vd-legend__item .vd-mk--kemp {
	width: 22px;
	height: 22px;
	margin: 0 2px;
}

.vd-legend__item .vd-mk--jez {
	width: 18px;
	height: 18px;
	margin: 0 4px;
}

/* poptavka: volby mimo reku (vlastni doprava) nad seznamem mist */
.vd-rpick__extra {
	margin-bottom: 8px;
}

.vd-times .vd-rpick__list button.is-up {
	color: #8ea2b3;
}

.vd-times .vd-rpick__list button.is-up::before {
	border-color: #b7c5d1;
}

.vd-rpick__hint {
	margin: 8px 0 0 !important;
	color: var(--vd-muted);
	font-size: 12px !important;
}

/* ---------------- mapa: popis trasy pod planovacem */
.vd-itin {
	margin: 0 0 40px;
	padding: clamp(16px, 3vw, 28px);
	border: var(--vd-border);
	background: #fff;
	box-shadow: var(--vd-hard);
}

.vd-itin:empty {
	display: none;
}

.vd-itin__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 14px 24px;
	margin-bottom: 18px;
	padding-bottom: 16px;
	border-bottom: var(--vd-border);
}

.vd-itin__head h2 {
	margin: 0 0 4px !important;
}

.vd-itin__brand {
	display: none;
}

.vd-itin__route {
	margin: 0 !important;
	color: var(--vd-navy);
	font-size: 18px !important;
}

.vd-itin__sum {
	margin: 4px 0 0 !important;
	color: var(--vd-muted);
	font-size: 15px !important;
}

.vd-itin__print {
	margin: 0;
}

.vd-itin__list {
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}

/* reka: svisla cara pod ikonami */
.vd-itin__list::before {
	content: "";
	position: absolute;
	top: 22px;
	bottom: 22px;
	left: calc(78px + 17px - 3px);
	width: 6px;
	background: var(--vd-blue);
}

.vd-itin__row {
	position: relative;
	display: grid;
	grid-template-columns: 78px 34px minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	margin: 0 !important;
	padding: 8px 10px 8px 0 !important;
	border-bottom: 1px solid var(--vd-line);
	break-inside: avoid;
}

.vd-itin__row::before {
	content: none !important;
}

.vd-itin__row:last-child {
	border-bottom: 0;
}

.vd-itin__from {
	color: var(--vd-navy);
	font-family: var(--vd-font-display);
	font-weight: 900;
	font-size: 17px;
	text-align: right;
}

.vd-itin__ico {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.vd-itin__ico .vd-mk {
	display: block;
	width: 30px;
	height: 30px;
}

.vd-itin__ico .vd-mk--kemp {
	width: 26px;
	height: 26px;
}

.vd-itin__ico .vd-mk--jez {
	width: 22px;
	height: 22px;
}

.vd-itin__txt b {
	display: block;
	color: var(--vd-navy);
	font-size: 16px;
}

.vd-itin__txt small {
	display: block;
	color: var(--vd-muted);
	font-size: 14px;
	line-height: 1.35;
}

.vd-itin__rkm {
	color: var(--vd-muted);
	font-family: var(--vd-font-display);
	font-size: 14px;
	white-space: nowrap;
}

.vd-itin__row--start,
.vd-itin__row--cil {
	background: var(--vd-yellow-50);
}

.vd-itin__row--start .vd-itin__txt b,
.vd-itin__row--cil .vd-itin__txt b {
	font-size: 18px;
}

.vd-itin__row--jez .vd-itin__txt b {
	color: var(--vd-red-700);
}

.vd-itin__foot {
	margin: 14px 0 0 !important;
	color: var(--vd-muted);
	font-size: 13px !important;
}

@media only screen and (max-width: 599px) {
	.vd-itin__list::before {
		left: calc(56px + 8px + 15px - 3px);
	}

	.vd-itin__row {
		grid-template-columns: 56px 30px minmax(0, 1fr);
		gap: 8px;
	}

	.vd-itin__from {
		font-size: 15px;
	}

	.vd-itin__rkm {
		grid-column: 3;
		margin-top: -4px;
		font-size: 12px;
	}

	.vd-itin__print {
		width: 100%;
	}
}

/* ---------------- tisk mapy a popisu trasy (A4) */
body.vd-print-route .vd-planner__map {
	width: 180mm !important;
	height: 120mm !important;
	min-height: 0 !important;
}

@media print {
	@page {
		size: A4;
		margin: 12mm;
	}

	html,
	body {
		background: #fff !important;
	}

	* {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	body:has(.vd-planner) header,
	body:has(.vd-planner) footer,
	body:has(.vd-planner) .partneri,
	body:has(.vd-planner) #vdMapFloat,
	body:has(.vd-planner) #poptatfloatMobile,
	body:has(.vd-planner) #poptatqfloatMobile,
	body:has(.vd-planner) #totop,
	.vd-planner .formline,
	.vd-planner__cta,
	.vd-planner__note,
	.vd-planner__weirs,
	.vd-planner__price,
	.vd-itin__print,
	.page-mapa-reky .vd-lead,
	.page-mapa-reky .vd-lang-note,
	.leaflet-control-zoom,
	.leaflet-control-attribution a {
		display: none !important;
	}

	main.page-mapa-reky,
	main.page-mapa-reky > section,
	main.page-mapa-reky > section > .content {
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		box-shadow: none !important;
		background: #fff !important;
		clip-path: none !important;
		max-width: none !important;
	}

	main.page-mapa-reky h1 {
		margin: 0 0 4mm !important;
		font-size: 22pt !important;
	}

	.vd-planner {
		display: block !important;
		margin: 0 !important;
	}

	.vd-planner__form {
		padding: 0 !important;
		border: 0 !important;
		background: none !important;
		box-shadow: none !important;
	}

	.vd-planner__stats {
		grid-template-columns: repeat(3, 1fr) !important;
		margin: 0 0 4mm !important;
	}

	.vd-planner__stats .vd-planner__time {
		grid-column: auto !important;
	}

	.vd-planner__map {
		width: 180mm !important;
		height: 120mm !important;
		min-height: 0 !important;
		box-shadow: none !important;
		break-inside: avoid;
	}

	.vd-itin {
		margin: 6mm 0 0 !important;
		padding: 0 !important;
		border: 0 !important;
		box-shadow: none !important;
	}

	.vd-itin__head {
		margin-bottom: 3mm !important;
		padding-bottom: 3mm !important;
	}

	.vd-itin__brand {
		display: block;
		margin: 0 0 1mm !important;
		color: var(--vd-muted);
		font-size: 9pt !important;
	}

	.vd-itin__row {
		padding: 1.5mm 0 !important;
	}
}

/* tlacitko Mapa reky o neco vetsi */
@media only screen and (min-width: 800px) {
	#vdMapFloat {
		bottom: 168px;
		min-width: 236px;
		padding: 15px 22px;
	}

	#vdMapFloat span:first-child {
		font-size: 20px;
	}

	#vdMapFloat .vd-float-map {
		width: 26px;
		height: 26px;
	}
}

@media only screen and (max-width: 799px) {
	#vdMapFloat {
		height: 60px;
		bottom: calc(9px + env(safe-area-inset-bottom, 0px));
		z-index: 20001;
	}

	#vdMapFloat span:first-child {
		font-size: 15px;
	}

	#vdMapFloat .vd-float-map {
		width: 22px;
		height: 22px;
	}
}
