/* Urban Park design tokens ---------------------- */
:root {
	--c-dark: #074352;		/* brand dark green (minimanual RGB 7/67/82) */
	--c-darker: #052E3A;	/* deepest backgrounds */
	--c-light: #EAEFF2;		/* light surfaces, light text on dark */
	--c-accent: #3DA96C;	/* brand light green (minimanual RGB 61/169/108) */
	--c-mid: #A9C3CE;		/* mid petrol tint - gradients, scrollbars */
	--c-muted: #7E93A0;		/* muted gray-blue - sold/disabled states */
	--c-border: #D5DEE3;	/* light borders */
}

/* general css ----------------------------------- */
html {
	scroll-behavior:smooth;
	overflow-x: hidden;
}
body {
	overflow: hidden;
	font-size: 12pt;
	font-weight: 400;
	font-family: "Inter Tight", sans-serif;
	font-optical-sizing: auto;
	background: #fff;
	color: #000;
}
body::-webkit-scrollbar {width: 6px;}
body::-webkit-scrollbar-track {background: #fff;}
body::-webkit-scrollbar-thumb {
   background-color: var(--c-darker);
   border: 1px solid var(--c-darker);
}
div {
	scrollbar-width: thin;
	scrollbar-color: var(--c-light) var(--c-dark);
}
header div {
	scrollbar-width: thin;
	scrollbar-color: var(--c-light) var(--c-dark);
}
div::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}
div::-webkit-scrollbar-track {background-color: #fff;}
div::-webkit-scrollbar-thumb {background-color: var(--c-mid);}
div::-webkit-scrollbar-track, div::-webkit-scrollbar-thumb {border-radius: 12px;}
img {max-width:100%;}
a, button, img, header, footer, span, strong, ::before, ::after {
	transition: all 0.3s ease-in-out;
	outline: none;
}
section, .container {position: relative;}
h1 {
	font-size: 60pt;
	font-weight: 400;
	margin: 80px 0 10px 0;
	line-height: 120%;
}
h2 {
	font-size: 30pt;
	font-weight: 400;
	margin: 0;
	line-height: 120%;
}
h3 {
	font-size: 28pt;
	font-weight: 400;
	margin: 0 0 20px 0;
	line-height: 120%;
}
h4 {
	font-size: 30pt;
	font-weight: 400;
	margin: 0 0 30px 0;
}
h5 {
	font-size: 18pt;
	font-weight: 400;
	margin: 30px 0 20px 0;
}
h6 {
	font-size: 60pt;
	font-weight: 400;
	margin: 0 0 40px 0;
	color: var(--c-accent);
}
.lenis.lenis-smooth {scroll-behavior: auto;}
.lenis.lenis-smooth [data-lenis-prevent] {overscroll-behavior: contain;}
.lenis.lenis-stopped {overflow: hidden;}
.lenis.lenis-scrolling iframe {pointer-events: none;}
.landscape, .mobile {display: none !important;}
.container {max-width: 1440px;}
.blur-active {
	filter: blur(5px); 
	transition: filter 0.3s ease;
	pointer-events: none;
}
.sitebar {
	position: fixed;
	top: 0;
	left: 0;
	background: var(--c-accent);
	height: 2px;
	z-index: 30;
}
.parallax-img, .sitebar {
  will-change: transform;
  transform: translate3d(0,0,0);
  backface-visibility: hidden;
}

	@keyframes hovermenu { 
		0% {width: 0;}
		100% {width: 100%;}
	}

/* buttons --------------------------- */
.btn01, .btn02 {
	color: #fff;
	border: solid 1px var(--c-light);
	font-size: 13.5pt;
	font-weight: 700;
	text-decoration: none;
	padding: 12px 60px;
	display: inline-block;
}
.btn01:hover {
	color: var(--c-dark);
	background: var(--c-light);
}
.btn02 {
	color: var(--c-dark);
	border: solid 1px var(--c-dark);
}
.btn02:hover {
	color: #fff;
	background: var(--c-dark);
}
.btn03 {
	background: url("../images/ico06.svg") no-repeat center left 10px;
	background-size: 18px auto;
	display: inline-block;
	text-decoration: none;
	font-weight: 700;
	font-size: 13.5pt;
	padding: 12px 0 12px 40px;
	color: var(--c-dark);
}
.btn03 span {font-weight: 400;}
.btn03:hover {
	background: url("../images/ico06.svg") no-repeat center left 6px;
	background-size: 24px auto;
}
.btn04 {
	color: var(--c-dark);
	border: solid 1px var(--c-dark);
	font-size: 13.5pt;
	font-weight: 700;
	text-decoration: none;
	padding: 12px 60px;
	background: none;
	margin-top: 40px;
	display: inline-block;
}
.btn04:hover {
	color: #fff;
	background: var(--c-dark);
}



.btn05 {
	display: flex;
	flex-wrap: wrap;
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	font-size: 13pt;
}
.btn05 span {font-weight: 300;}
.btn05 i {
	display: inline-block;
	width: 30px;
	height: 32px;
	background-color: #fff;
	-webkit-mask: url("i../images/ico06.svg") no-repeat center / contain;
	mask: url("../images/ico06.svg") no-repeat center / contain;
	transition: background-color .3s;
	margin: -2px 8px 0 0;
}
.btn05:hover  {color: var(--c-darker);}
.btn05:hover i  {background-color: var(--c-darker);}






/* forms --------------------------- */
.form-control {
	background: none;
	border: none;
	border-bottom: solid 1px var(--c-light);
	font-size: 19pt;
	font-weight: 400;
	color: #000;
	border-radius: 0;
	height: 50px;
	margin-bottom: 40px;
	padding-left: 0;
}
.form-control::placeholder {
	color: var(--c-light);
	font-size: 12pt;
	font-weight: 400;
}
.form-control:focus {
    background: none;
    border-color: #000;
    box-shadow: 0 0 0 .25rem rgba(255, 255, 255, .15);
	color: #000;
}
textarea.form-control {
	height: auto;
	min-height: 100px;
}
form p {font-size: 10pt;}
form p a {
	color: #000;
	font-weight: 700;
}
form p a:hover {text-decoration: none;}

/* Contact Form 7 --------------------- */
.wpcf7-not-valid-tip {
	display: block;
	color: #b32d2e;
	font-size: 10pt;
	font-weight: 400;
	line-height: 1.3;
	margin: 0 0 4px 0;
}
.wpcf7-not-valid {
	border-bottom-color: #b32d2e !important;
}
.wpcf7 form .wpcf7-response-output {
	border: none !important;
	margin: 20px 0 0 0 !important;
	padding: 14px 18px !important;
	font-size: 11pt;
	font-weight: 400;
	background: var(--c-light);
	color: var(--c-dark);
	border-radius: 0;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
	background: #f3dada;
	color: #b32d2e;
}
.wpcf7 form.sent .wpcf7-response-output {
	background: var(--c-dark);
	color: #fff;
}
.wpcf7-spinner {
	margin: 0 0 0 16px;
	vertical-align: middle;
	background-color: var(--c-dark);
}

/* navigace ----------------------------------- */
header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 500;
	padding: 20px 0;
	min-height: 100px;
}
.logo {
	position: absolute;
	width: 240px;
	left: 0;
	top: 50%;
	z-index: 2;
	transform: translate(0,-50%);
}
header .navbar-toggler, header .navbar-toggler:focus {
	border: none;
	box-shadow: none;
}
header .navbar-nav .nav-item {
	padding: 3px 20px;
	position: relative;
}
header .navbar-nav .nav-link {
	font-weight: 700;
	font-size: 11.25pt;
	color: var(--c-dark);
	padding-right: 0 !important;
	padding-left: 0 !important;
	position: relative;
}
header .navbar-nav .nav-link:hover::before {
	background: var(--c-accent);
	width: 100%;
	height: 1px;
	bottom: 5px;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}
header .navbar-nav .header-developer-item {
	display: flex;
	align-items: center;
	padding: 0 10px;
}
.header-developer-logo {
	display: block;
	width: 78px;
	padding: 6px 8px;
	background: #fff;
	border: 1px solid rgba(7,67,82,.12);
	line-height: 0;
	transition: transform .2s ease, box-shadow .2s ease;
}
.header-developer-logo:hover {
	transform: translateY(-2px);
	box-shadow: 0 5px 12px rgba(0,0,0,.12);
}
.header-developer-logo img {
	display: block;
	width: 100%;
	height: auto;
}
/* portál klienta UDI vedle loga – jen ikonka s popiskem po najetí
   (s textem by se menu přiblížilo k „II. etapa“ vedle loga na 18 px) */
header .navbar-nav .header-portal-item {
	display: flex;
	align-items: center;
	padding: 0 10px 0 0;
}
.header-portal {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--c-dark);
	font-size: 11.25pt;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.header-portal:hover {color: var(--c-accent);}
@media (max-width: 1299px) {
	.header-portal-item {display: none !important;}
}
/* na 992–1299 px se menu nevešlo vedle loga a překrývalo ho – menší mezery mezi položkami */
@media (min-width: 992px) and (max-width: 1299px) {
	header .navbar-nav .nav-item {padding-left: 10px; padding-right: 10px;}
}
@media (min-width: 992px) and (max-width: 1099px) {
	header .navbar-nav .nav-item {padding-left: 6px; padding-right: 6px;}
	header .navbar-nav .nav-link {font-size: 10.5pt;}
}
.hamburger {
	width: 30px;
	height: 30px;
	position: absolute;
	transition: .5s ease-in-out;
	cursor: pointer;
	right: 10px;
	top: 14px;
	z-index: 2;
}
.nav-item:last-child {min-width: 100px;}
.nav-item:last-child .navbar-toggler {display: block;}
.nav-item .hamburger {
	right: 0;
	top: 14px;
}
.hamburger span {
   display: block;
   position: absolute;
   height: 2px;
   width: 100%;
   border-radius: 9px;
   opacity: 1;
   left: 0;
   transform: rotate(0deg);
   transition: .25s ease-in-out;
}
.hamburger span {background: var(--c-dark);}
.hamburger span:nth-child(1) {top: 0px;}
.hamburger span:nth-child(2), .hamburger span:nth-child(3) {top: 7px;}
.hamburger span:nth-child(4) {top: 14px;}
.hamburger.open span {height: 2px !important;}
.hamburger.open span:nth-child(1) {
   top: 11px;
   width: 0%;
   left: 50%;
}
.hamburger.open span:nth-child(2) {transform: rotate(45deg);}
.hamburger.open span:nth-child(3) {transform: rotate(-45deg);}
.hamburger.open span:nth-child(4) {
   top: 11px;
   width: 0%;
   left: 50%;
}
.hamburger span:nth-child(4) {
	width: 50%;
	right: 0;
	left: auto;
}
.hamburger:hover span:nth-child(4) {width: 100%;}
.hamburger.open span:nth-child(4), .hamburger.open:hover span:nth-child(4) {width: 0;}
header .offcanvas.offcanvas.offcanvas-end {
    width: auto;
	min-width: 30%;
	background: var(--c-dark);
	padding: 20px 100px;
} 
header .offcanvas-header {
	position: relative;
	padding: 20px 0 0 0;
}
header .offcanvas-header .btn-close {
    margin: 0;
	padding: 0;
	position: absolute;
	background: none;
	right: -40px;
	top: 10px;
	width: 30px;
	height: 30px;
}
header .offcanvas-header .btn-close::after, header .offcanvas-header .btn-close::before {
	content: "";
	position: absolute;
	background: var(--c-light);
	left: 50%;
	top: 50%;
	width: 100%;
	height: 2px;
	transform: translate(-50%,-50%) rotate(45deg);
}
header .offcanvas-header .btn-close::before {transform: translate(-50%,-50%) rotate(-45deg);}
header .offcanvas-header .btn-close:hover {transform: rotate(90deg);}
header .offcanvas.offcanvas.offcanvas-end img {
    width: 240px;
	margin: 16px 0 10px 0;
} 
header .offcanvas .navbar-nav .nav-item {padding: 1px 0;}
header .offcanvas .navbar-nav .nav-link {
	font-weight: 700;
	font-size: 16.5pt;
	color: var(--c-light);
	padding: 5px 0;
	position: relative;
	display: inline-block;
}
header .offcanvas-body {padding: var(--bs-offcanvas-padding-y) 0;}
header .offcanvas-contact {
	padding: 28px 0 5px 0;
	color: var(--c-light);
}
header .offcanvas-contact > span {font-size: 11.25pt;}
header .offcanvas-contact a {
	font-weight: 700;
	color: var(--c-light);
}
header .offcanvas a:hover::before {
	background: var(--c-light) !important;
	width: 100%;
	height: 1px;
	bottom: 5px;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}
header .offcanvas-contact p {
	font-size: 17.25pt;
	margin: 14px 0;
}
header .offcanvas-contact p a {
	text-decoration: none;
	position: relative;
}
header .offcanvas p a:hover::before {
	height: 2px;
	bottom: 0;
}
header .offcanvas-contact > div {font-size: 11.25pt;}
header .offcanvas-contact > div a {
	position: relative;
	display: inline-block;
	text-decoration: none;
}
header .offcanvas div a:hover::before {bottom: 0;}
header .offcanvas div a:first-child {margin-right: 80px;}
.offcanvas-developer {
	padding: 18px 0 5px 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}
/* odkaz na portál klienta UDI vedle loga */
header .offcanvas .offcanvas-portal {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 9px 16px;
	border: solid 1px var(--c-light);
	color: #fff;
	font-size: 11pt;
	font-weight: 700;
	text-decoration: none;
	line-height: 1.2;
}
header .offcanvas .offcanvas-portal:hover {background: #fff; color: var(--c-dark);}
header .offcanvas .offcanvas-portal:hover::before {display: none;}
header .offcanvas .offcanvas-developer-logo {
	display: inline-block;
	padding: 8px 12px;
	background: #fff;
	line-height: 0;
}
header .offcanvas.offcanvas.offcanvas-end .offcanvas-developer-logo img {
	width: 92px;
	margin: 0;
}
header .offcanvas .offcanvas-developer .offcanvas-developer-logo:first-child {margin-right: 0;}
header .offcanvas .offcanvas-developer-logo:hover::before {display: none;}
.offcanvas-rights {
	font-size: 8.25pt;
	color: var(--c-light);
}
.offcanvas-rights span {
	display: inline-block;
	margin-right: 60px;
}
header .offcanvas-rights a {
	text-decoration: none;
	position: relative;
	color: var(--c-light);
}
.site-header.header-hidden {transform: translateY(-101%);}
body.scrolled .site-header {
	box-shadow:0 5px 15px rgba(0,0,0,0.15);
	background:#fff;
	min-height: 80px;
	padding: 10px 0;
}
body.scrolled .site-header .logo {width: 180px;}
.subpage header {background: #fff;}
.subpage header .navbar-nav .nav-item.active::before {
	content: "";
	position: absolute;
    border-bottom: solid 4px var(--c-dark);
	width: 100%;
	left: 0;
	bottom: -28px;
}
.subpage.scrolled header .navbar-nav .nav-item.active::before {bottom: -18px;}
.subpage header .navbar-nav .nav-item.active .nav-link:hover::before {display: none;}

/* content01 ------------------------- */
.content01 {
	height: 100vh;
	overflow: hidden;
	color: #fff;
}
.content01 .hero-headline {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
.content01 .hero-logo {
	margin: 0;
	line-height: 0;
	width: clamp(240px, 35vw, 530px);
	aspect-ratio: 10 / 1;
	overflow: hidden;
}
.content01 .hero-logo img {
	display: block;
	width: 100%;
	height: auto;
	transform: translateY(-33.78%);
}
.content01 h2 {
	max-width: 900px;
	padding: 0;
	text-shadow: 0 2px 12px rgba(0, 0, 0, .45);
}
.content01 > img, .content01 > video {
	object-fit: cover;
	display: block;
	height: auto;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.content01 .container, .content01 .row {height: 100%;}
/* hero: prolínání fotek s pomalým zoomem (JS v custom.js) */
.hero-prolinani {
	position: absolute;
	inset: 0;
	overflow: hidden;
	background: var(--c-light);
}
.hero-prolinani .hero-snimek {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	opacity: 0;
	transition: opacity 1.5s ease-in-out;
}
.hero-prolinani .hero-snimek.is-active {opacity: 1;}
/* zoom běží i během mizení, jinak by fotka při prolínání cukla zpátky */
.hero-prolinani .hero-snimek.is-active,
.hero-prolinani .hero-snimek.is-leaving {animation: hero-zoom 8s linear forwards;}
@keyframes hero-zoom {
	from {transform: scale(1);}
	to   {transform: scale(1.08);}
}
@media (prefers-reduced-motion: reduce) {
	.hero-prolinani .hero-snimek.is-active,
	.hero-prolinani .hero-snimek.is-leaving {animation: none;}
}
.offer {
	position: absolute;
	display: inline-block;
	background: var(--c-accent);
	color: #fff;
	font-size: 11.25pt;
	text-decoration: none;
	bottom: 0;
	right: 0;
	z-index: 3;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	padding: 30px 8px;
}
.offer:hover {
	color: var(--c-dark);
	background: var(--c-light);
}

/* content02 ------------------------- */
.content02 {
	padding: 200px 0;
	background: var(--c-darker);
}
.content02::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 40%;
	background: linear-gradient(var(--c-mid), var(--c-light));
}
.content02::after {
	content: "";
	position: absolute;
	left: 0;
	top: 46%;
	width: 100%;
	height: 54%;
	background: url("../images/bg01.svg") no-repeat top center;
	background-size: 113% auto;
	z-index: 0;
}
.content02 .container {z-index: 1;}
.content02 .col-md-6.offset-md-4 {
	position: relative;
	z-index: 3;
}
.content02 .col-md-6.offset-md-4 p {
	font-size: 18pt;
	margin-bottom: 200px;
}
.image-overflow-end-wrapper {
	display: flex;
	justify-content: flex-end; 
	width: 100%;
	transform: translate(calc(var(--bs-gutter-x) * .5),-47%);
	position: relative;
}
.overflow-end-img {
	flex-shrink: 0; 
	max-width: 135%; 
}
.image-overflow-end-wrapper span {
	position: absolute;
	bottom: 0;
	right: 0;
	color: var(--c-accent);
	font-size: 280pt;
	font-weight: 200;
	font-family: "Inter Tight", sans-serif;
	line-height: 175pt;
}
.image-overflow-start-wrapper {
	display: flex;
	justify-content: flex-start; 
	width: 100%;
	transform: translate(calc(var(--bs-gutter-x) * -.5),0);
}
.overflow-start-img {
	flex-shrink: 0; 
	max-width: 145%; 
}
.content02 .slider-wrapper {
	margin: 80px calc(-50vw + 50%) 100px 0;
	position: relative;
}
.slider-benefits .swiper-slide {width: 520px; }
.benefit {
	position: relative;
	padding: 40px 40px 40px 140px;
	color: #fff;
	font-size: 13.5pt;
}
.benefit::before {
	position: absolute;
	content: "";
	top:0;
	left:0;
	width:50%;
	aspect-ratio:1/1;
	background:var(--c-dark);
	z-index:-1;
}
.benefit img {
	position: absolute;
	width: 66px;
	left: 40px;
	top: 44px;
}
.benefit h4 {color: inherit;}
.decorative-plant {
	position: absolute;
	display: block;
	pointer-events: none;
	user-select: none;
	will-change: transform;
}
.decorative-plant-home {
	z-index: 0;
	bottom: -160px;
	right: 2%;
	width: 400px;
}
.decorative-plant-intro {
	z-index: 0;
	top: 340px;
	right: -150px;
	width: 554px;
}
/* content03 ------------------------- */
.content03 {
	overflow: hidden;
	height: 100vh;
	color: #fff;
	background: rgba(0,0,0,.3);
	font-size: 16pt;
	padding: 60px 0;
	z-index: 3;
}
.content03 .container {
	text-shadow: #000 0 0 10px;
}
.content03 img.parallax-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 110%; 
	object-fit: cover; 
	z-index: -1;
	transform: translateY(0px);
	transition: transform 0.1s linear;
}
.content03 > span {
	position: absolute;
	bottom: 0;
	left: -35px;
	color: var(--c-light);
	font-size: 270pt;
	font-weight: 200;
	font-family: "Inter Tight", sans-serif;
	line-height: 170pt;
	letter-spacing: -3pt;
}
.content03 .container , .content03 .container  .row {height: 100%;}

/* content04 ------------------------- */
.content04 {
	background: linear-gradient(var(--c-light),var(--c-mid));
	padding: 140px 0 400px 0;
}
.slider-note {overflow: visible !important;}
.note {
	width: 20%; 
	height: 500px; 
	display: flex;
	align-items: flex-end; 
	transition: width 0.6s ease;
}
.note-content {
	width: 100%;
	height: 400px; 
	transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
}
.note .img-box {
	aspect-ratio: 9 / 12;
	object-fit: cover;
	display: block;
	height: auto;
	width: 100%;
	background: var(--c-darker);
	overflow: hidden;
	transition: all 0.3s ease-in-out;
}
.note.swiper-slide-active {width: 45% !important; }
.note.swiper-slide-active .note-content {height: 540px; }
.note.swiper-slide-active .img-box {
	height: 108%;
	aspect-ratio: 9 / 8;
}
.note .img-box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.swiper-button-next, .swiper-button-prev {
	background: url("../images/ico05.svg") no-repeat center;
	background-size: 100% auto;
	width: 36px;
	height: 14px;
	position: absolute;
	right: 0 !important;
	top: 15% !important;
	opacity: .5;
	transition: all 0.3s ease-in-out;
}
.swiper-button-prev {
	left: auto !important;
	right: 60px !important;
	top: 15% !important;
	transform: rotate(180deg);
}
.swiper-button-next svg, .swiper-button-prev svg {display: none;}
.swiper-button-next:hover, .swiper-button-prev:hover {opacity: 1;}
.content02 .swiper-button-next, .content02 .swiper-button-prev {
	background: #fff;
	-webkit-mask: url("../images/ico05.svg") no-repeat center / contain;
	mask: url("../images/ico05.svg") no-repeat center / contain;
	right: 60px !important;
	top: -20px !important;
}
.content02 .swiper-button-prev {
	left: auto !important;
	right: 120px !important;
}

/* content05 ------------------------- */
.content05 {
	background: var(--c-darker);
	padding: 60px 0;
	font-size: 24pt;
	font-weight: 200;
	font-weight: 300;
	font-family: "Inter Tight", sans-serif;
	color: var(--c-light);
}
.content05 ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.content05 ul li {
	display: inline-block;
	position: relative;
	padding: 5px 24px;
}
.content05 ul li::before {
	content: "";
	position: absolute;
	border-radius: 100%;
	background: var(--c-light);
	width: 12px;
	height: 12px;
	right: -8px;
	top: calc(50% - 6px);
}
.content05 ul li:last-child:before {display: none;}

/* content06 ------------------------- */
.content06 {padding: 100px 0;}
.content06 .slider-wrapper {margin: 80px calc(-50vw + 50%) 100px 0;}
.slider-milestone .swiper-slide {width: 360px; }
.milestone {
	position: relative;
	text-align: center;
	font-size: 13pt;
}
.milestone span {
	display: inline-block;
	width: 90px;
	height: 90px;
	font-size: 30pt;
	line-height: 90px;
	color: #fff;
	background: var(--c-accent);
	position: relative;
}
.milestone span::before {
	content: "";
	position: absolute;
	background: var(--c-light);
	width: 300px;
	height: 1px;
	top: 45px;
	left: 80px;
	z-index: -1;
}
.swiper-slide-prev .milestone span::before {display: none;}
.milestone strong {
	display: block;
	font-size: 30pt;
	font-weight: 400;
	padding: 10px 0;
}
.slider-milestone .swiper-slide-active .milestone {color: var(--c-dark);}
.slider-milestone .swiper-slide-active .milestone span {background: var(--c-dark);}
.content06 .col-md-12.text-center a {margin: 5px 30px;}

/* content07 ------------------------- */
.content07 {
	background: var(--c-light);
	padding: 100px 0;
}
.content07 p {
	line-height: 160%;
	padding-bottom: 50px;
	font-size: 16pt;
}
.content07 #map { 
	position: absolute;
    height: 100%; 
    width: 58.35%; 
    background-color: #f5f5f5; 
	right: 0;
	top: 0;
	z-index: 1;
}
.leaflet-tile-container img {filter: grayscale(100%) invert(5%) contrast(1.1) brightness(0.9);}
.leaflet-marker-icon {filter: none !important;}
.content07.contact {
	background: var(--c-dark);
	color: var(--c-light);
}
.content07.contact p {
    line-height: 130%;
    padding-bottom: 20px;
    font-size: 13pt;
}
.content07.contact h3 {
	position: relative;
	padding-top: 50px;
}
.content07.contact h3::before {
	content: "";
	position: absolute;
	top: -15px;
	left: 0;
	background: var(--c-light);
	-webkit-mask: url("../images/logo-kancelar.svg") no-repeat center / contain;
	mask: url("../images/logo-kancelar.svg") no-repeat center / contain;
	width: 130px;
	height: 60px;
}
.content0701 {
    line-height: 130%;
    padding-bottom: 40px;
    font-size: 16pt;
}
.content0701 a {
    text-decoration: none;
	color: var(--c-light);
	position: relative;
}
.content0701 a:hover::before {
	background: var(--c-light);
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}

/* content08 ------------------------- */
.content08 .col-md-5 a, .content08 .col-sm-6 a, .content08 .col-sm-12 a  {
	display: block;
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.content08 .col-md-5 a img, .content08 .col-sm-6 a img, .content08 .col-sm-12 a img {
	object-fit: cover;
	display: block;
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.content08 .col-md-7 .row {height: 100%;}
.content08 .col-sm-6, .content08 .col-sm-12 {height: 50%;}
.content08 .col-md-5 a:hover::after, .content08 .col-sm-6 a:hover::after, .content08 .col-sm-12 a:hover::after  {
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	content: "";
	background: rgba(0,0,0,.7) url("../images/ico07.svg") no-repeat center;
	background-size: 60px auto;
}

/* content09 ------------------------- */
.content09 {padding: 100px 0;}
.form-img {
	background: var(--c-light);
	position: relative;
	display: inline-block;
	overflow: hidden;
	width: 70%;
	margin: 10px 0 50px 0;
}
.form-img::after {
	content: "";
	display: block;
	padding-bottom: 100%;
}
.form-img img {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
}
.content09 .col-md-5 > strong {
	display: block;
	font-size: 30pt;
	font-weight: 400;
	margin-bottom: 20px;
}
.content09 .col-md-5 > span {
	display: block;
	font-size: 13pt;
	font-weight: 400;
	margin-bottom: 20px;
}
.content09 .col-md-5 > p a {
	display: inline-block;
	font-size: 19pt;
	color: var(--c-dark);
	text-decoration: none;
	position: relative;
}
.content09 .col-md-5 > p a:hover::before {
	background: var(--c-dark);
	width: 100%;
	height: 1px;
	bottom: 4px;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}
/* makléři vedle formuláře */
.paticka-makleri-nadpis {
	display: block;
	font-size: 13pt;
	color: var(--c-muted);
	margin-bottom: 20px;
}
.paticka-makler {
	display: flex;
	align-items: center;
	gap: 24px;
	margin-bottom: 36px;
}
.paticka-makler:last-child {margin-bottom: 0;}
.paticka-makler-foto {
	flex: 0 0 120px;
	height: 120px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--c-light);
}
.paticka-makler-foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}
.paticka-makler-text {min-width: 0;}
.paticka-makler-text strong {
	display: block;
	font-size: 20pt;
	font-weight: 400;
	line-height: 1.2;
	color: var(--c-dark);
}
.paticka-makler-text span {
	display: block;
	font-size: 11pt;
	color: var(--c-muted);
	margin: 2px 0 10px 0;
}
.paticka-makler-text a {
	display: block;
	width: fit-content;
	font-size: 13pt;
	color: var(--c-dark);
	text-decoration: none;
	overflow-wrap: anywhere;
}
.paticka-makler-text a:hover {color: var(--c-accent);}
.content09 .col-md-7 b {
	display: block;
	font-size: 19pt;
	font-weight: 400;
	margin-bottom: 40px;
}

/* footer ----------------------------------- */
footer {
    background: var(--c-light);
	color: var(--c-dark);
	font-size: 11pt;
	padding: 150px 0 20px 0;
}
footer .col-lg-12 img {
    width: 240px;
	margin-bottom: 80px;
}
footer ul {
	list-style-type: none;
	margin: 0;
	padding: 0 0 20px 0;
}
footer ul li {padding: 0 0 10px 0;}
footer a {
	color: var(--c-dark);
	text-decoration: none;
	position: relative;
	font-weight: 700;
}
footer a:hover::before {
	background: var(--c-accent);
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	animation: hovermenu 0.4s 1;
	content: "";
	position: absolute;
}
footer .offcanvas-rights {
	color: var(--c-dark);
	padding-top: 60px;
}
footer .offcanvas-contact p a {font-size: 17pt;}
footer .offcanvas-contact div a:first-child {
	display: inline-block;
	margin-right: 30px;
}
.para-footer {
    position: absolute;
    top: -500px; 
    left: 12%; 
    z-index: 10;
    pointer-events: none; 
	width: 270px;
    animation: floatKeys 4s ease-in-out infinite;
    will-change: transform;
}
	@keyframes floatKeys {
		0%, 100% {transform: translateY(0) rotate(0deg);}
		50% {transform: translateY(-15px) rotate(2deg); }
	}
.firma {
	position: relative;
	padding-top: 50px;
}
.firma::before {
	content: "";
	position: absolute;
	top: -15px;
	left: 0;
	background: var(--c-dark);
	-webkit-mask: url("../images/logo-kancelar.svg") no-repeat center / contain;
	mask: url("../images/logo-kancelar.svg") no-repeat center / contain;
	width: 130px;
	height: 60px;
}

/* sub pages ----------------------------------- */
.content10 {
	height: calc(100vh - 100px);
	overflow: hidden;
	color: #fff;
	margin-top: 100px;
}
.content10 > img, .content10 > video {
	object-fit: cover;
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}




.content10 > svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 20;
}
.content10 > svg a {
	fill: rgba(255,255,255,0);
	stroke: #fff;
    stroke-miterlimit: 10;
    stroke-width: 1.99px;
}
.content10 > svg a:hover {
	fill: #fff;
    opacity: .7;
}



.content10 .container, .content10 .row {height: 100%;}
.content10 .container {padding-bottom: 5%;}
.content10::before {
	position: absolute;
	content: "";
	z-index: 1;
	height: 30vh;
	bottom: 0;
	left: 0;
	width: 100%;
	background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.6));
}
.content10 .container {z-index: 2;}
.content10.contact {
	background: var(--c-darker) url("../images/bg01.svg") no-repeat top center;
	background-size: 100% auto;
	height: 40vh;
}
.content10.contact .col-md-11.text-center.align-self-end {align-self: center !important;}
.content10.contact .col-md-11.text-center.align-self-end h1 {margin-top: 20px;}
.content10.contact::before {display: none;}
.content10.contact .container {padding-bottom: 0;}

.content404 {padding: 80px 0 120px;}
.content404 p {font-size: 13.5pt; margin-bottom: 30px;}
.content404-odkazy {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
}

.content11 {padding: 100px 0;}
.content11 table {
	width: 80%;
	border-top: solid 1px var(--c-light);
	border-bottom: solid 1px var(--c-light);
	margin: 40px 0;
	font-size: 12pt;
}
.content11 table td {padding: 15px;}
.content11 table tr:first-child td {padding-top: 30px;}
.content11 table tr:nth-last-child(2) td {
	padding-bottom: 30px;
	border-bottom: solid 1px var(--c-light);
}
.content11 table tr:last-child td {
	padding-bottom: 20px;
	padding-top: 20px;
}
.content11 table tr:last-child td:last-child {
	font-size: 30pt;
	font-weight: 300;
}
.content11 table tr:first-child td:last-child {color: var(--c-accent);}
.content11 table tr:first-child td.sold {color: var(--c-muted);}
.content11 table tr td:first-child {padding-left: 50px;}
.content11 table tr td:last-child {font-weight: 700;}
.content1101 {padding: 0 0 60px 30px;}
.content1101 .btn04 {margin: 0 0 30px 0;}
.content11 .col-md-3 {padding: calc(var(--bs-gutter-x) * .5);}
.content11 .col-md-3 [data-fancybox] {
	aspect-ratio: 4 / 3;
	display: block;
	position: relative;
	overflow: hidden;
}
.content11 .col-md-3 [data-fancybox] img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.content11 .col-md-3 [data-fancybox]:hover img {
	transform: scale(1.05);
	filter: contrast(1.3);
}
.content11 .col-md-12.text-center > a {
	font-size: 13pt;
	font-weight: 700;
	color: #000;
	display: inline-block;
	margin-top: 30px;
}
.content11 .col-md-12.text-center > a:hover {text-decoration: none;}
.content12 #map { 
    height: 70vh; 
    width: 100%; 
    background-color: #f5f5f5; 
}
.content13 {
	padding: 100px 0;
	background: linear-gradient(rgba(169,195,206,1), rgba(234,239,242,1));
}
.content13a {
	padding-bottom: 0;
	z-index: 3;
}
.content13 small {
	display: block;
	position: relative;
	z-index: 2;
}
.content1301 {
	color: #fff;
	font-family: "Inter Tight", sans-serif;
	font-weight: 200;
	font-size: 285pt;
	letter-spacing: -10px;
	line-height: 340pt;
}
.content13a .col-md-5.offset-md-1:first-child {position: relative; z-index: 0;}
.content1302 {
	color: rgba(255,255,255,.55);	/* průhlednost přes barvu – opacity přebíjí AOS */
	pointer-events: none;
	position: relative;
	z-index: -1;
	font-family: "Inter Tight", sans-serif;
	font-weight: 200;
	font-size: 235pt;
	letter-spacing: -10px;
	line-height: 147pt;
	display: block;
	margin: -20px 0 0 -10px;
}
.content13 .col-md-5.offset-md-1 > div {
	position: relative;
	height: 100%;
}
.content13 .col-md-5.offset-md-1 img {
	max-width: none;
	position: absolute;
	max-height: calc(100% + 100px);
}
.content14 {
	background: var(--c-darker);
	color: var(--c-light);
	padding-bottom: 80px;
}
.content14 .col-12 img {
	margin-top: -210px;
	aspect-ratio: 16 / 7;
	object-fit: cover;
	width: 100%;
	height: auto;
}
.content14 .col-12 h3 {margin: 100px 0;}
.content14 .col-sm-3 {padding: calc(var(--bs-gutter-x) * .5);}
.content14 .col-sm-3 > div {
	border: solid 1px var(--c-accent);
	padding: 30px 50px;
	height: 100%;
}
.content14 .col-sm-3 > div img {
	width: 80px;
	margin-left: -10px;
}
.content14 .col-sm-3 > div  h5 {
    font-size: 18pt;
    font-weight: 400;
    margin: 10px 0 20px 0;
}
.content15 {
	background: var(--c-darker);
	color: var(--c-light);
	height: 70vh;
	overflow: hidden;
}
.content15 .container, .content15 .container .row {height: 100%;}
.content1501 {
	position: absolute;
	overflow: hidden;
	height: 100%;
	width: 56%;
}
.content1501 img {
	position: absolute;
	max-width: none;
	bottom: -5%;
	left: -60%;
	width: 235%;
}
.content15 .offset-md-4 > div {
	background: rgba(7,67,82,.7);
	padding: 30px 50px;
	font-size: 18pt;
}
.content16 {padding: 150px 0;}
.content1601 {
	background: var(--c-darker);
	position: absolute;
	right: 0;
	top: 150px;
	bottom: 150px;
	width: 44%;
	overflow: hidden;
}
.content16 .offset-md-1 {
	padding-top: 13%;
	padding-bottom: 13%;
}
.content1601 img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.content17 {
    height: 100vh;
	color: var(--c-light);
	font-size: 13pt;
	padding: 100px 0;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.content17::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 35%;
	height: 100%;
    background: rgba(7,67,82,.7);
}
.content17 .container, .content17 .container .row {height: 100%;}
.content17 p {margin-bottom: 60px;}
.content18 {padding: 200px 0 100px 0;}
.content18 h6 {margin: 0 0 80px 0;}
.content18 ol {
	list-style: none;
	counter-reset: my-counter;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	padding: 0 0 60px 0;
}
.content18 ol li {
	counter-increment: my-counter;
	position: relative;
	padding: 30px 40px 20px 130px;
	background: #fff;
	overflow: hidden; 
	z-index: 1;
	border: solid 1px var(--c-border);
	color: var(--c-dark);
	transition: all 0.3s ease-in-out;
}
.content18 ol li::before {
	content: counter(my-counter);
	position: absolute;
	top: 50%;
	left: -23px;
	font-size: 170pt;
	font-weight: 300;
	color: var(--c-dark);
	z-index: -1;
	line-height: 1;
	opacity: .2;
	transform: translate(0,-50%);
}
.content18 ol li h4 {
	font-size: 19pt;
	margin-bottom: 15px;
}
.content18 ol li:hover {
	background: var(--c-dark);
	border: solid 1px var(--c-dark);
	color: #fff;
}
.content18 ol li:hover::before {color: #fff;}
.content19 {
	background: var(--c-darker);
	color: var(--c-light);
	padding: 100px 0;
	overflow: hidden;
}
.content19 .container {z-index: 1;}
.content1901 {
	position: absolute;
	left: -30px;
	bottom: 0;
	font-family: "Inter Tight", sans-serif;
	font-weight: 200;
	font-size: 235pt;
	letter-spacing: -10px;
	line-height: 147pt;
	color: var(--c-dark);
	z-index: 0;
}
.content1902 {
	position: relative;
	justify-content: center;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 60px;
}
.content1902::before {
	position: absolute;
	content: "";
	left: 0;
	right: 0;
	bottom: 0;
	top: 24%;
	background: var(--c-dark);
}
.content1902 > span {
	position: relative;
	background: var(--c-darker);
	display: inline-block;
	width: 70%;
}
.content1902 > span::after {
	content: "";
	padding-bottom: 100%;
	display: block;
}
.content1902 > span img {
	position: absolute;
	left: 10px;
	top: 10px;
	object-fit: cover;
	width: calc(100% - 20px);
	height: calc(100% - 20px);
}
.content1902 a {
	position: relative;
	margin: 30px auto;
}
.content20 {padding: 100px 0;}
.content20 ul {
	padding: 30px 0;
	margin: 0;
	font-size: 30pt;
	list-style-type: none;
}
.content20 ul li {
	display: inline-block;
	margin: 0 20px;
}
.content20 ul li span {text-decoration: underline;}
.content20 ul li a {
	text-decoration: none;
	color: rgba(0,0,0,.5);
}
.content20 ul li a:hover {
	text-decoration: underline;
	color: rgba(0,0,0,.7);
}
.custom-2600 {
    max-width: 1600px;
    margin: 0 auto;
    transition: all 0.3s ease;
}
.side-img {
    object-fit: cover;
    min-height: 200px;
}
/* galerie: fotky ve sloupcích v původním poměru stran (vizualizace jsou na šířku, čtvercové i na výšku) */
.galerie-mrizka {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}
.galerie-sloupec {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.custom-2600 .galerie-mrizka a img {height: auto;}
.main-img { aspect-ratio: 16 / 10; object-fit: cover; }
.sub-img { aspect-ratio: 4 / 3; object-fit: cover; }
.bottom-img { aspect-ratio: 3 / 2; object-fit: cover; }
.custom-2600 a  {
	display: block;
	position: relative;
	overflow: hidden;
}
.custom-2600 a img {
	object-fit: cover;
	display: block;
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.custom-2600 a:hover::after  {
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	content: "";
	background: rgba(0,0,0,.7) url("../images/ico07.svg") no-repeat center;
	background-size: 60px auto;
}
.content21 {padding: 100px 0;}
.content21 table {
	width: 100%;
	margin: 20px 0;
	white-space: nowrap;
}
.content21 th {
	padding: 14px;
	font-weight: 300;
	text-align: left;
	border-bottom: solid 1px var(--c-light);
}
.content21 td {
	padding: 14px;
	font-weight: 700;
	text-align: left;
	border-bottom: solid 1px var(--c-light);
	transition: all 0.3s ease-in-out;
}
.content21 td > strong {font-weight: 300;}
.content21 tr:hover td {background: var(--c-light);}
.content21 td:last-child {
	width: 140px;
	text-align: right;
}
.content21 td:last-child a {
	padding: 10px 15px;
	color: var(--c-dark);
	text-decoration: none;
	display: inline-block;
	border: solid 1px var(--c-dark);
	font-size: 11pt;
}
.content21 td:last-child a:hover {
	color: #fff;
	background: var(--c-dark);
}
.content21 td:nth-last-child(2) {width: 98px;}
.content21 td:nth-last-child(2) span {
	padding: 10px 15px;
	color: var(--c-dark);
	background: var(--c-accent);
	display: inline-block;
	border: solid 1px var(--c-accent);
	font-size: 11pt;
	min-width: 93px;
	text-align: center;
}
.content21 td:nth-last-child(2) span.sold {
	color: var(--c-muted);
	background: var(--c-light);
	border: solid 1px var(--c-light);
}
.table-buttons {
	text-align: center;
	padding-bottom: 30px;
}
.table-buttons .radiobox input {
	position: absolute;
	opacity: 0;
	height: 0;
	width: 0;
}
.table-buttons .radiobox {
	display: inline-block;
	padding: 4px;
}
.table-buttons .radiolabel {
	padding: 10px 30px;
	background: #fff;
	border: solid 1px var(--c-dark);
	color: var(--c-dark);
	cursor: pointer;
	font-size: 13pt;
	font-weight: 700;
	display: inline-block;
}
.table-buttons .radiobox input:checked ~ .radiolabel {
	background: var(--c-light);
	border: solid 1px var(--c-light);
}
/* tom 2026 ---------------------------- */
.houses-page header {background: #fff;}
.content10.houses {margin-top: 0;}
.content10.houses::before {display: none;}
.content21 .houses-heading h1 {margin-top: 0;}
.content21 .houses-heading h2 {margin-bottom: 40px;}
.table-buttons a.radiolabel {
	text-decoration: none;
	margin: 4px;
}
.table-buttons a.radiolabel.active {
	background: var(--c-light);
	border-color: var(--c-light);
}
/* stránka patra – půdorys v hlavičce ---------------------------- */
.patro-hero {
	position: relative;
	margin-top: 100px;
	padding: 30px 0 110px 0;	/* místo pro plovoucí lištu pater */
	background: #fff;
}
.patro-hero-title {
	font-size: 36pt;
	margin: 0 0 20px 0;
}
.patro-hero-map {
	position: relative;
	max-width: 1000px;
	margin: 0 auto;
	line-height: 0;
}
.patro-hero-map svg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.patro-hero-plan img {
	display: block;
	margin: 0 auto;
	max-width: 1000px;
	width: 100%;
	height: auto;
}
.patro-hero-empty {
	text-align: center;
	color: var(--c-muted);
	padding: 80px 0;
}
/* lišta pater: plovoucí u spodního okraje okna, skryje se po odrolování hlavičky (JS v _page-patro.php) */
.patro-hero .patro-controls {
	position: fixed;
	bottom: 30px;
	max-width: calc(100% - 40px);
	flex-wrap: wrap;
	justify-content: center;
	padding: 6px;
	z-index: 400;
	transition: opacity .25s, transform .25s;
}
.patro-hero .patro-controls.is-docked {
	position: absolute;	/* zaparkovaná u spodního okraje hlavičky */
}
.patro-controls a {
	display: inline-block;
	height: 44px;
	line-height: 44px;
	padding: 0 18px;
	border-radius: 22px;
	font-size: 11.25pt;
	font-weight: 700;
	color: var(--c-dark);
	text-decoration: none;
	white-space: nowrap;
	transition: background .2s, color .2s;
}
.patro-controls a:hover {background: var(--c-light);}
.patro-controls a.active {
	background: var(--c-dark);
	color: #fff;
}
.patro-controls a.patro-controls-3d {
	background: var(--c-accent);
	color: #fff;
	margin-right: 6px;
}
.patro-controls a.patro-controls-3d:hover {background: var(--c-dark);}
.content21.patro {padding-top: 60px;}
.patro-table-title {
	font-size: 22pt;
	margin-bottom: 10px;
}
.content21 tr.patro-empty td {text-align: center; padding: 40px 14px; color: var(--c-muted);}
.content21 tr.patro-empty:hover td {background: none;}

/* rotator – přepínač pohledů A/B ---------------------------- */
.rotator > canvas {
	object-fit: cover;
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.rotator-map {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 20;
}
.rotator-map:empty {display: none;}
.rotator-map svg {
	display: block;
	width: 100%;
	height: 100%;
}
.rotator-controls {
	position: absolute;
	left: 50%;
	bottom: 30px;
	transform: translateX(-50%);
	z-index: 30;
	display: flex;
	gap: 4px;
	padding: 4px;
	background: rgba(255,255,255,.92);
	border-radius: 40px;
	box-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.rotator-controls button {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: none;
	background: transparent;
	font-family: inherit;
	font-size: 13pt;
	font-weight: 700;
	color: var(--c-dark);
	cursor: pointer;
	transition: background .2s, color .2s;
}
.rotator-controls button:hover {background: var(--c-light);}
.rotator-controls button.active {
	background: var(--c-dark);
	color: #fff;
}
.rotator.is-animating .rotator-controls button {pointer-events: none;}
.rotator-progress {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 3px;
	width: var(--rotator-progress, 0%);
	background: var(--c-accent);
	z-index: 31;
	transition: width .2s linear;
	opacity: 0;
}
.rotator.is-loading .rotator-progress {opacity: 1;}
.rotator-disabled .rotator-controls,
.rotator-disabled .rotator-progress {display: none;}

/* klikací mapa pater ---------------------------- */
.mapa-pater a {
	text-decoration: none;
	fill: rgba(255,255,255,0);
	stroke: rgba(255,255,255,0);	/* obrys se ukáže až při najetí */
	stroke-width: 2px;
	stroke-linejoin: round;
	cursor: pointer;
	transition: fill .2s, stroke .2s;
}
.mapa-pater a:hover,
.mapa-pater a:focus {
	fill: rgba(61,169,108,.45);	/* --c-accent s průhledností */
	stroke: #fff;
	outline: none;
}
.mapa-pater a text {
	fill: #fff;
	stroke: none;
	font-family: "Inter Tight", sans-serif;
	font-size: 34px;
	font-weight: 700;
	letter-spacing: .02em;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s;
	paint-order: stroke;
	stroke: rgba(7,67,82,.85);
	stroke-width: 6px;
	stroke-linejoin: round;
}
.mapa-pater a:hover text,
.mapa-pater a:focus text {opacity: 1;}
.patra-links {display: none; margin-bottom: 30px;}
.patra-links-label {
	display: block;
	margin-bottom: 8px;
	font-weight: 700;
}

/* klikací mapa bytů v půdorysu ---------------------------- */
.mapa-bytu a {
	text-decoration: none;
	fill: rgba(61,169,108,0);
	stroke: rgba(61,169,108,0);
	stroke-width: 6px;
	stroke-linejoin: round;
	cursor: pointer;
	transition: fill .2s, stroke .2s;
}
.mapa-bytu a:hover,
.mapa-bytu a:focus,
.mapa-bytu a.is-hover {
	fill: rgba(61,169,108,.35);
	stroke: var(--c-accent);
	outline: none;
}
/* rezervované a prodané byty jsou vidět i bez najetí myší */
.mapa-bytu a.stav-rezervovany {fill: rgba(7,67,82,.18);}
.mapa-bytu a.stav-prodany {fill: rgba(126,147,160,.5);}
.mapa-bytu a.stav-rezervovany:hover, .mapa-bytu a.stav-rezervovany.is-hover,
.mapa-bytu a.stav-prodany:hover, .mapa-bytu a.stav-prodany.is-hover {stroke: var(--c-dark);}
.mapa-bytu g.stav-nedostupny {fill: rgba(126,147,160,.3);}
/* detail bytu: aktuální byt trvale zvýrazněný */
.mapa-bytu .is-current,
.mapa-bytu a.is-current:hover {
	fill: rgba(61,169,108,.55);
	stroke: var(--c-accent);
}
/* štítek s údaji bytu u kurzoru (JS v custom.js) */
.mapa-bytu-stitek {
	position: absolute;
	z-index: 30;
	transform: translate(-50%, calc(-100% - 16px));
	pointer-events: none;
	background: #fff;
	box-shadow: 0 6px 24px rgba(5,46,58,.18);
	padding: 10px 16px;
	line-height: 1.45;
	font-size: 11pt;
	white-space: nowrap;
	text-align: center;
}
.mapa-bytu-stitek strong, .mapa-bytu-stitek span, .mapa-bytu-stitek em {display: block;}
.mapa-bytu-stitek strong {font-size: 13pt; color: var(--c-dark);}
.mapa-bytu-stitek em {font-style: normal; font-weight: 700; color: var(--c-accent);}

/* tabulka bytů – filtry, stavy, další řádky ---------------------------- */
.tabulka-bytu-dalsi-filtry {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 14px 30px;
	margin: -14px 0 20px 0;
	font-weight: 700;
	color: var(--c-dark);
}
.tabulka-bytu-dalsi-filtry label {display: inline-flex; align-items: center; gap: 10px; cursor: pointer; margin: 0;}
.tabulka-bytu-dalsi-filtry select {
	-webkit-appearance: none;
	appearance: none;	/* vlastní šipka, aby šla odsadit od okraje */
	border: solid 1px var(--c-dark);
	border-radius: 0;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23074352' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center / 12px 8px;
	color: var(--c-dark);
	font-weight: 700;
	padding: 8px 40px 8px 12px;
	cursor: pointer;
}
.tabulka-bytu-dalsi-filtry input[type="checkbox"] {width: 18px; height: 18px; accent-color: var(--c-dark); cursor: pointer;}
.content21 tr.is-hover td {background: var(--c-light);}
.content21 td:nth-last-child(2) span.stav-rezervovany {
	background: var(--c-mid);
	border-color: var(--c-mid);
}
.tabulka-bytu-vice {margin-top: 30px;}
.tabulka-bytu-vice .btn02 {background: #fff; cursor: pointer;}
.tabulka-bytu-vice .btn02:hover {background: var(--c-dark);}

/* detail bytu ---------------------------- */
.content11.byt-detail {margin-top: 100px; padding-top: 40px;}
.byt-detail-zpet {margin-bottom: 30px;}
.byt-detail-zpet a {color: var(--c-dark); font-weight: 700; text-decoration: none;}
.byt-detail-zpet a:hover {color: var(--c-accent);}
.byt-detail h1 {font-size: 36pt; margin: 0;}
.byt-detail-podtitul {font-size: 14pt; color: var(--c-muted); margin: 6px 0 0 0;}
.content11.byt-detail table {width: 100%;}
.content11.byt-detail table tr td:first-child {padding-left: 0;}	/* zarovnat s nadpisy Byt a Místnosti */
.content11 table td.stav-rezervovany {color: var(--c-dark);}
.byt-detail del {font-size: 14pt; font-weight: 400; color: var(--c-muted);}
.byt-mistnosti {margin: 0 0 40px 0;}
.byt-mistnosti h3 {font-size: 16pt; font-weight: 700; margin: 0 0 12px 0; color: var(--c-dark);}
.byt-mistnosti ol {list-style: none; margin: 0; padding: 0;}
.byt-mistnosti li {
	display: flex;
	gap: 14px;
	padding: 8px 0;
	border-bottom: solid 1px var(--c-light);
}
.byt-mistnosti-cislo {color: var(--c-accent); font-weight: 700; min-width: 24px;}
.byt-mistnosti-nazev {flex: 1;}
.byt-mistnosti-plocha {white-space: nowrap;}
/* tlačítka pod parametry: Karta bytu | Mám zájem */
.byt-detail-akce {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 60px;
}
.byt-detail-akce .btn04 {
	flex: 1 1 200px;
	margin: 0;
	padding: 12px 20px;
	text-align: center;
}
.byt-detail-akce .btn04 span {font-weight: 400;}
.byt-detail-akce .btn-zajem {
	flex-basis: 100%;	/* Karta bytu a Virtuální prohlídka vedle sebe, Mám zájem pod nimi přes celou šířku */
	background: var(--c-accent);
	border-color: var(--c-accent);
	color: #fff;
}
.byt-detail-akce .btn-zajem:hover {
	background: var(--c-dark);
	border-color: var(--c-dark);
}
.byt-detail-akce .btn-zajem.is-disabled,
.byt-detail-akce .btn-zajem.is-disabled:hover {
	background: var(--c-light);
	border-color: var(--c-light);
	color: var(--c-muted);
	cursor: not-allowed;
}
.byt-detail-standardy {margin: -40px 0 60px 0;}
.byt-detail-pudorys {padding-top: 10px;}
.byt-detail-pudorys .patro-hero-map img {display: block; width: 100%; height: auto;}
.byt-detail-popisek {font-size: 11pt; color: var(--c-muted); text-align: center; margin-top: 12px;}
/* půdorys bytu nad půdorysem patra */
.byt-detail-pudorys-bytu {display: block; cursor: zoom-in;}
.byt-detail-pudorys-bytu img {display: block; width: 100%; height: auto;}
.byt-detail-pudorys-bytu + .byt-detail-popisek {margin-bottom: 40px;}
.byt-detail-pudorys + .col-md-3,
.byt-detail-pudorys + .col-md-3 ~ .col-md-3 {margin-top: 40px;}

/* lokalita – podtext pod body občanské vybavenosti ---------------------------- */
.content14 .content1401 {margin-top: 40px; text-align: center;}
.content14 .content1401 h5 {font-size: 18pt; font-weight: 400; line-height: 150%;}
.content14 .content1401 h5 a {color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; transition: opacity .2s;}
.content14 .content1401 h5 a:hover {opacity: .75;}

/* kontakty – makléři ---------------------------- */
.content22 {
	padding: 100px 0 60px 0;
	background: #fff;
}
.makler {
	text-align: center;
	margin-bottom: 40px;
}
.makler-foto {
	aspect-ratio: 4 / 5;
	overflow: hidden;
	margin-bottom: 25px;
}
.makler-foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.makler h3 {
	font-size: 22pt;
	margin: 0 0 4px 0;
}
.makler-pozice {
	display: block;
	color: var(--c-muted);
	margin-bottom: 15px;
}
.makler .content0701 {
	font-size: 14pt;
	padding-bottom: 25px;
}
.makler .content0701 a {color: var(--c-dark);}
.makler .content0701 a:hover::before {background: var(--c-dark);}
.makler .btn02 {padding: 10px 40px;}

/* plovoucí odkaz na web první etapy ---------------------------- */
/* textová stránka (Zpracování osobních údajů) */
.text-stranka {padding: 70px 0 100px 0; line-height: 1.65;}
.text-stranka h3 {font-size: 17pt; font-weight: 700; color: var(--c-dark); margin: 40px 0 14px 0;}
.text-stranka ul {padding-left: 1.2em; margin-bottom: 1.2em;}
.text-stranka li {margin-bottom: 6px;}
.text-stranka li::marker {color: var(--c-accent);}
.text-stranka a {color: var(--c-dark); font-weight: 700;}
.text-stranka a:hover {color: var(--c-accent);}

/* plovoucí štítek „1. etapa“ vpravo nahoře; po odrolování se zmenší na nadpis */
.phase-link {
	position: fixed;
	top: 140px;
	right: 0;
	z-index: 400;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 190px;
	padding: 20px 18px 22px 18px;
	background: var(--c-dark);
	color: #fff;
	text-align: center;
	text-decoration: none;
	box-shadow: 0 4px 18px rgba(0,0,0,.25);
	transition: background .2s, padding .25s, width .25s;
}
.phase-link strong {
	font-size: 26pt;
	font-weight: 700;
	line-height: 1.1;
	white-space: nowrap;
	transition: font-size .25s;
}
.phase-link span {
	font-size: 13pt;
	line-height: 1.3;
	margin-top: 6px;
}
.phase-link:hover {
	background: var(--c-accent);
	color: #fff;
}
body.scrolled .phase-link {top: 100px; width: 150px; padding: 12px 14px;}
body.scrolled .phase-link strong {font-size: 17pt;}
body.scrolled .phase-link span {display: none;}

/* „II. etapa“ vedle loga v hlavičce a nad logem na úvodní stránce */
.logo-etapa {
	position: absolute;
	left: 258px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	font-size: 15pt;
	font-weight: 700;
	color: var(--c-dark);
	text-decoration: none;
	white-space: nowrap;
	transition: left .3s;
}
.logo-etapa:hover {color: var(--c-accent);}
body.scrolled .site-header .logo-etapa {left: 196px; font-size: 13pt;}
.content01 .hero-etapa {
	margin: 0 0 -4px 0;
	font-size: clamp(16px, 2vw, 30px);
	font-weight: 700;
	color: var(--c-dark);
	line-height: 1.2;
}
header .offcanvas .navbar-nav .nav-link.nav-link-etapa {color: var(--c-accent);}

/* patra vypnutá v Nabídce na webu (plugin Realpad) – neklikací; světlý závoj
   a název patra se ukážou až při najetí */
.mapa-pater g.patro-vypnute {
	fill: rgba(234,239,242,0);
	stroke: rgba(255,255,255,0);
	stroke-width: 2px;
	stroke-linejoin: round;
	cursor: default;	/* běžná šipka, ne ručička – nedá se kliknout */
	transition: fill .2s, stroke .2s;
}
.mapa-pater g.patro-vypnute:hover {
	fill: rgba(234,239,242,.45);
	stroke: rgba(255,255,255,.9);
}
.mapa-pater g.patro-vypnute text {
	fill: #fff;
	font-family: "Inter Tight", sans-serif;
	font-size: 34px;
	font-weight: 700;
	letter-spacing: .02em;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s;
	paint-order: stroke;
	stroke: rgba(7,67,82,.85);
	stroke-width: 6px;
	stroke-linejoin: round;
}
.mapa-pater g.patro-vypnute:hover text {opacity: 1;}
.patro-controls span.is-disabled {
	display: inline-block;
	height: 44px;
	line-height: 44px;
	padding: 0 18px;
	font-size: 11.25pt;
	font-weight: 700;
	color: var(--c-border);
	white-space: nowrap;
	cursor: default;
}
.table-buttons .radiolabel.is-disabled {
	margin: 4px;
	color: var(--c-muted);
	border-color: var(--c-border);
	background: var(--c-light);
	cursor: default;
}