/*
 * Päta webu (šablóna Elementora 17) – blok pata (Ellipse_Footer_Blocks), triedy ft-*.
 * Načítava sa na každej stránke a nezávisí od ostatných štýlov pluginu: premenné --ep-* (rovnaké hodnoty ako
 * assets/package-page.css) si definuje sama. Písmo Neue Plak načítava web.
 * Kontrast textu na hnedom pozadí: biela 100 %, 72 % a 62 % (najmenej 6 : 1).
 */

.ft-root {
	--ep-brown: #332B21;
	--ep-brown-dark: #241E17;
	--ep-brown-hover: #4A3F31;
	--ep-bg: #F8F7F4;
	--ep-white: #FFFFFF;
	--ep-font: "Neue Plak", "Helvetica Neue", Arial, sans-serif;
	--ep-pad: clamp(16px, 4vw, 48px);
	--ep-max: 1280px;
	--ft-muted: rgba(255, 255, 255, .72);
	--ft-soft: rgba(255, 255, 255, .62);
	--ft-line: rgba(255, 255, 255, .12);
	--ft-chip: rgba(255, 255, 255, .08);

	/* Tmavšia než pruh recenzií nad pätou (var(--ep-brown)), aby sa od neho zreteľne oddelila; bez zaoblených rohov (Tomáš 11. 10. 2026). */
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: #17120D;
	color: var(--ep-white);
	font-family: var(--ep-font);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
/* Veľmi slabo viditeľná čiernobiela fotka penziónu v pozadí, smerom dole sa stráca do tmy. */
.ft-root::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background: url("https://usysla.sk/wp-content/uploads/2025/09/sysel-budova-01.jpg") center 40% / cover no-repeat;
	filter: grayscale(1) contrast(1.05);
	opacity: .24;
	pointer-events: none;
}
.ft-root::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(23, 18, 13, .55) 0%, rgba(23, 18, 13, .82) 45%, rgba(23, 18, 13, .97) 100%);
	pointer-events: none;
}
.ft-root *,
.ft-root *::before,
.ft-root *::after { box-sizing: border-box; }
.ft-root ul,
.ft-root dl,
.ft-root p,
.ft-root h2 { margin: 0; padding: 0; }
.ft-root ul { list-style: none; }
.ft-root img { display: block; max-width: 100%; height: auto; }
.ft-root a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.ft-root a:focus-visible,
.ft-root summary:focus-visible { outline: 2px solid var(--ep-white); outline-offset: 3px; border-radius: 8px; }
.ft-root .eb-icon { display: block; flex: 0 0 auto; }
.ft-root .ft-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ft-root .ft-wrap {
	max-width: var(--ep-max);
	margin: 0 auto;
	padding: clamp(40px, 5vw, 64px) var(--ep-pad) 28px;
}

/* ---------------- Horný pruh: logo, veta, tlačidlá ---------------- */

.ft-root .ft-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px 40px;
	padding-bottom: clamp(32px, 4vw, 48px);
	border-bottom: 1px solid var(--ft-line);
}
.ft-root .ft-brand { display: flex; align-items: center; gap: 24px; max-width: 620px; }
.ft-root .ft-logo { flex: 0 0 auto; display: block; width: 92px; border-radius: 50%; }
.ft-root .ft-logo img { width: 100%; }
.ft-root .ft-claim { color: var(--ft-muted); font-size: 17px; line-height: 1.5; }
.ft-root .ft-cta { display: flex; flex-wrap: wrap; gap: 12px; flex: 0 0 auto; }

/* Tlačidlá v štýle webu (ep-btn): biele s hnedým krúžkom a obrysové s priehľadným krúžkom. */
.ft-root .ft-btn {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	min-height: 58px;
	padding: 8px 8px 8px 26px;
	border-radius: 999px;
	font-family: var(--ep-font);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .12s ease;
}
.ft-root .ft-btn:active { transform: scale(.98); }
.ft-root .ft-btn__circle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	transition: transform .18s ease;
}
.ft-root .ft-btn:hover .ft-btn__circle { transform: translateX(2px); }
.ft-root .ft-btn--accent,
.ft-root .ft-btn--accent:visited { background: var(--ep-white); color: var(--ep-brown); }
.ft-root .ft-btn--accent:hover { background: var(--ep-bg); color: var(--ep-brown-dark); }
.ft-root .ft-btn--accent .ft-btn__circle { background: var(--ep-brown); color: var(--ep-white); }
.ft-root .ft-btn--outline,
.ft-root .ft-btn--outline:visited { color: var(--ep-white); border: 1px solid rgba(255, 255, 255, .5); font-weight: 600; }
.ft-root .ft-btn--outline:hover { background: rgba(255, 255, 255, .08); border-color: var(--ep-white); color: var(--ep-white); }
.ft-root .ft-btn--outline .ft-btn__circle { background: rgba(255, 255, 255, .12); }

/* ---------------- Stĺpce ---------------- */

.ft-root .ft-grid {
	display: grid;
	grid-template-columns: 1.3fr .95fr 1.2fr 1.15fr;
	gap: 32px clamp(28px, 3.5vw, 56px);
	padding: clamp(36px, 4vw, 52px) 0;
}
.ft-root .ft-h {
	font-family: var(--ep-font);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ft-soft);
	margin-bottom: 18px;
}

/* Rozbaľovacie sekcie: na počítači a tablete nadpis ako obyčajný nadpis stĺpca. */
.ft-root .ft-acc__sum { display: block; list-style: none; cursor: default; }
.ft-root .ft-acc__sum::-webkit-details-marker { display: none; }
.ft-root .ft-acc__sum::marker { content: ""; }
.ft-root .ft-acc__icon { display: none; }

/* Kontakt: riadky s ikonou v krúžku. */
.ft-root .ft-rows { display: grid; gap: 4px; }
.ft-root .ft-row {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 52px;
	padding: 4px 0;
	border-radius: 12px;
}
.ft-root .ft-row__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--ft-chip);
	color: var(--ep-white);
	transition: background-color .18s ease;
}
.ft-root .ft-row__body { display: flex; flex-direction: column; min-width: 0; }
.ft-root .ft-row__label { font-size: 13px; color: var(--ft-soft); line-height: 1.3; }
.ft-root .ft-row__value { font-size: 16px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.ft-root .ft-row__note { font-size: 12px; color: var(--ft-soft); line-height: 1.4; margin-top: 2px; }
.ft-root .ft-row__go {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: auto;
	padding: 6px 12px;
	border: 1px solid rgba(255, 255, 255, .3);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	transition: background-color .18s ease, border-color .18s ease;
}
.ft-root .ft-row:hover .ft-row__icon { background: rgba(255, 255, 255, .18); }
.ft-root .ft-row:hover .ft-row__value { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.ft-root .ft-row:hover .ft-row__go { background: rgba(255, 255, 255, .08); border-color: var(--ep-white); }
.ft-root .ft-row--place { align-items: flex-start; flex-wrap: wrap; padding-top: 6px; }
.ft-root .ft-row--place .ft-row__body { flex: 1 1 calc(100% - 54px); }
.ft-root .ft-row--place .ft-row__go { margin: 6px 0 0 54px; }

/* Otváracie hodiny */
.ft-root .ft-sub { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.ft-root .ft-hours { display: grid; gap: 6px; }
.ft-root .ft-hours + .ft-sub { margin-top: 20px; }
.ft-root .ft-hours div { display: flex; flex-direction: column; }
.ft-root .ft-hours dt { color: var(--ft-muted); font-size: 14px; }
.ft-root .ft-hours dd { margin: 0; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }

/* Navigácia v dvoch stĺpcoch */
.ft-root .ft-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 20px; }
.ft-root .ft-nav a {
	display: flex;
	white-space: nowrap;
	align-items: center;
	min-height: 40px;
	color: var(--ft-muted);
	font-size: 15px;
	transition: color .18s ease;
}
.ft-root .ft-nav a:hover { color: var(--ep-white); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* Fakturačné údaje */
.ft-root .ft-company__name { font-size: 15px; font-weight: 700; }
.ft-root .ft-company__text { color: var(--ft-muted); font-size: 14px; }
.ft-root .ft-ids { display: grid; gap: 2px; margin: 12px 0; font-size: 14px; }
.ft-root .ft-ids div { display: flex; gap: 8px; }
.ft-root .ft-ids dt { color: var(--ft-soft); min-width: 58px; }
.ft-root .ft-ids dd { margin: 0; font-variant-numeric: tabular-nums; }
.ft-root .ft-company__note { color: var(--ft-soft); font-size: 13px; line-height: 1.5; }
.ft-root .ft-company__note + .ft-company__note { margin-top: 6px; }

/* ---------------- Spodná časť ---------------- */

.ft-root .ft-bottom { border-top: 1px solid var(--ft-line); }
.ft-root .ft-bottom__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px 40px;
	padding: 28px 0;
}
.ft-root .ft-social { display: flex; gap: 10px; }
.ft-root .ft-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--ft-chip);
	color: var(--ep-white);
	transition: background-color .18s ease, transform .18s ease;
}
.ft-root .ft-social a:hover { background: rgba(255, 255, 255, .18); transform: translateY(-2px); }

.ft-root .ft-partners { display: flex; align-items: center; gap: 24px; }
.ft-root .ft-partners__title { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ft-soft); white-space: nowrap; }
.ft-root .ft-partners__list { display: flex; align-items: center; gap: 28px; }
.ft-root .ft-partner { display: flex; align-items: center; justify-content: center; opacity: .62; transition: opacity .18s ease; }
.ft-root .ft-partner:hover,
.ft-root .ft-partner:focus-visible { opacity: 1; }
.ft-root .ft-partner--round img { width: auto; height: 52px; }
.ft-root .ft-partner--wide img { width: auto; height: 30px; }

.ft-root .ft-legal {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 32px;
	padding-top: 20px;
	border-top: 1px solid var(--ft-line);
	font-size: 13px;
	color: var(--ft-soft);
}
.ft-root .ft-legal__links { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.ft-root .ft-legal__links a { display: inline-flex; align-items: center; min-height: 32px; color: var(--ft-muted); }
.ft-root .ft-legal__links a:hover { color: var(--ep-white); text-decoration: underline; text-underline-offset: 3px; }

/* ---------------- Tablet ---------------- */

@media (max-width: 1100px) {
	.ft-root .ft-top { flex-direction: column; align-items: flex-start; }
	.ft-root .ft-grid { grid-template-columns: 1fr 1fr; gap: 40px 48px; }
	.ft-root .ft-bottom__row { flex-direction: column; align-items: flex-start; }
}

/* ---------------- Telefón: kontakty ako riadky, ostatné rozbaľovacie ---------------- */

@media (max-width: 767px) {
	.ft-root .ft-wrap { padding-top: 32px; padding-bottom: 24px; }
	.ft-root .ft-top { gap: 20px; padding-bottom: 28px; align-items: stretch; }
	.ft-root .ft-brand { gap: 16px; }
	.ft-root .ft-logo { width: 68px; }
	.ft-root .ft-claim { font-size: 15px; }
	.ft-root .ft-cta { flex-direction: column; gap: 10px; width: 100%; }
	.ft-root .ft-btn { width: 100%; min-height: 56px; }

	.ft-root .ft-grid { display: block; padding: 8px 0 12px; }
	.ft-root .ft-col--contact { padding: 20px 0 16px; }
	.ft-root .ft-col--contact .ft-h { margin-bottom: 8px; }
	.ft-root .ft-row { min-height: 56px; }

	.ft-root .ft-acc { border-top: 1px solid var(--ft-line); }
	.ft-root .ft-acc:last-child { border-bottom: 1px solid var(--ft-line); }
	.ft-root .ft-acc__sum {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		min-height: 56px;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}
	.ft-root .ft-acc__sum .ft-h { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ep-white); }
	.ft-root .ft-acc__icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: var(--ft-chip);
		transition: transform .2s ease;
	}
	.ft-root .ft-acc[open] .ft-acc__icon { transform: rotate(180deg); }
	.ft-root .ft-acc__body { padding: 0 0 20px; }
	.ft-root .ft-hours div { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 12px; }
	.ft-root .ft-row--place { flex-wrap: nowrap; }
	.ft-root .ft-row--place .ft-row__body { flex: 1 1 auto; }
	.ft-root .ft-row--place .ft-row__go { margin: 0 0 0 auto; align-self: center; }
	.ft-root .ft-hours dd { text-align: right; white-space: nowrap; }
	.ft-root .ft-nav a { min-height: 44px; font-size: 16px; }

	.ft-root .ft-bottom { border-top: 0; }
	.ft-root .ft-bottom__row { gap: 24px; padding: 24px 0; align-items: stretch; }
	.ft-root .ft-social { justify-content: center; gap: 12px; }
	.ft-root .ft-social a { width: 48px; height: 48px; }
	.ft-root .ft-partners { flex-direction: column; align-items: stretch; gap: 14px; }
	.ft-root .ft-partners__title { text-align: center; }
	.ft-root .ft-partners__list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
	.ft-root .ft-partner { min-height: 72px; border-radius: 16px; background: rgba(255, 255, 255, .04); opacity: .72; }
	.ft-root .ft-partner--round img { height: 48px; }
	.ft-root .ft-partner--wide img { height: 26px; }
	.ft-root .ft-legal { flex-direction: column; align-items: center; text-align: center; gap: 6px; }
	.ft-root .ft-legal__links { justify-content: center; gap: 0 18px; }
	.ft-root .ft-legal__links a { min-height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
	.ft-root *,
	.ft-root *::before,
	.ft-root *::after { transition: none !important; }
}