/*
 * Veřejná stránka (Front:Home). Staví na admin.css: Bootstrap 5, paleta (--ismo-*, --bs-*), písmo Figtree a akcenty modulů
 * (.accent-news, .accent-booking, .accent-survey, .accent-alert). Tady je jen rozvržení stránky; píše se ručně (v repu není build Sass).
 */

html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body.front {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
	background: var(--ismo-canvas);
	color: var(--bs-body-color);
	line-height: 1.6;
}

/* obsah vyplní výšku okna, patička zůstane dole i na krátkých stránkách */
body.front > main { flex: 1 0 auto; }
body.front > header,
body.front > footer { flex: none; }

body.front [id] { scroll-margin-top: 4.5rem; }

body.front h1,
body.front h2,
body.front h3 { color: var(--ismo-green-900); letter-spacing: -.01em; }

.front-skip {
	position: absolute;
	z-index: 2000;
	top: .5rem;
	left: .5rem;
	padding: .5rem .75rem;
	border-radius: .5rem;
	background: var(--ismo-green-700);
	color: #fff;
}

/* ---------------------------------------------------------------- menu */
.front-nav {
	position: sticky;
	top: 0;
	z-index: 1030;
	background: rgba(248, 246, 239, .94);
	border-bottom: 1px solid var(--ismo-line);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* .navbar nuluje boční odsazení kontejneru */
.front-nav .navbar { padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); }
.front-nav .navbar-brand img { display: block; height: 2rem; width: auto; }
.front-nav .nav-link { color: var(--ismo-green-900); font-weight: 600; text-decoration: none; }
.front-nav .nav-link:hover,
.front-nav .nav-link.active { color: var(--ismo-green-700); text-decoration: underline; text-underline-offset: .35rem; text-decoration-thickness: 2px; }
.front-nav .navbar-toggler { border: 1px solid var(--bs-border-color); color: var(--ismo-green-900); }
.front-nav .btn { text-decoration: none; }

/* ---------------------------------------------------------------- úvod */
.front-hero {
	padding: 4rem 0 5rem;
	background: var(--ismo-green-700);
	color: #fff;
}

.front-pill {
	display: inline-block;
	margin-bottom: 1.25rem;
	padding: .35rem .85rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	color: var(--ismo-green-on-dark-2);
	font-size: .875rem;
	font-weight: 600;
}

body.front .front-hero__title {
	max-width: 17em;
	margin-bottom: 1.25rem;
	color: #fff;
	font-size: clamp(2rem, 4.4vw, 3.25rem);
	font-weight: 800;
	line-height: 1.1;
}

.front-hero__lead {
	max-width: 36rem;
	margin-bottom: 1.75rem;
	color: var(--ismo-green-on-dark-2);
	font-size: 1.15rem;
}

.front-hero .btn { text-decoration: none; }

.front-hero__facts {
	display: grid;
	gap: .5rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
	color: #fff;
}

.front-hero__facts i { margin-right: .6rem; color: var(--ismo-green-on-dark); }

/* náhled aplikace */
.phone {
	max-width: 21rem;
	margin: 0 auto;
	padding: .6rem;
	border-radius: 2.2rem;
	background: var(--ismo-green-900);
	box-shadow: 0 24px 60px rgba(0, 0, 0, .35), inset 0 0 0 2px rgba(255, 255, 255, .08);
}

.phone__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.1rem 1.25rem .85rem;
	border-radius: 1.7rem 1.7rem 0 0;
	background: var(--ismo-canvas);
	border-bottom: 1px solid var(--ismo-line);
	color: var(--ismo-green-900);
	font-weight: 800;
}

.phone__body {
	display: grid;
	gap: .65rem;
	padding: .9rem;
	border-radius: 0 0 1.7rem 1.7rem;
	background: var(--ismo-surround);
}

.phone__card {
	display: flex;
	gap: .75rem;
	align-items: flex-start;
	padding: .8rem .9rem;
	border: 1px solid var(--ismo-line);
	border-radius: .9rem;
	background: var(--ismo-canvas);
	color: var(--bs-body-color);
	font-size: .9rem;
	line-height: 1.35;
}

.phone__card > i {
	flex: none;
	display: grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	border-radius: .6rem;
	background: var(--accent-bg);
	color: var(--accent-ink);
}

.phone__card strong { display: block; color: var(--ismo-green-900); }
.phone__card span { color: var(--bs-secondary-color); }
.phone__card--alert { border-color: var(--ismo-red-line); }

/* ---------------------------------------------------------------- sekce */
.front-section { padding: 5rem 0; }
.front-section--tint { background: var(--ismo-surround); }
.front-section--dark { background: var(--ismo-green-900); color: var(--ismo-green-on-dark-2); }

.front-head {
	max-width: 42rem;
	margin: 0 auto 3rem;
	text-align: center;
}

.front-head--left { margin: 0 0 1.75rem; text-align: left; }

.front-head h2 {
	margin-bottom: .75rem;
	font-size: clamp(1.6rem, 3vw, 2.25rem);
	font-weight: 800;
	line-height: 1.2;
}

.front-head p { margin: 0; color: var(--bs-secondary-color); font-size: 1.075rem; }

.front-eyebrow {
	display: block;
	margin-bottom: .6rem;
	color: var(--ismo-green-500);
	font-size: .85rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.front-section--dark .front-eyebrow { color: var(--ismo-green-on-dark); }
body.front .front-head--light h2 { color: #fff; }
.front-head--light p { color: var(--ismo-green-on-dark-2); }

/* dlaždice funkcí */
.feature {
	height: 100%;
	padding: 1.5rem;
	border: 1px solid var(--ismo-line);
	border-radius: 1rem;
	background: var(--ismo-canvas);
	box-shadow: var(--ismo-shadow-card);
}

.feature__icon {
	display: inline-grid;
	place-items: center;
	width: 2.9rem;
	height: 2.9rem;
	margin-bottom: 1rem;
	border-radius: .8rem;
	background: var(--accent-bg);
	color: var(--accent-ink);
	font-size: 1.25rem;
}

.feature h3 { margin-bottom: .4rem; font-size: 1.2rem; font-weight: 700; }
.feature p { margin: 0; color: var(--bs-secondary-color); }

.front-note {
	max-width: 42rem;
	margin: 2.5rem auto 0;
	padding: .8rem 1rem;
	border: 1px solid var(--ismo-line);
	border-radius: .75rem;
	background: var(--ismo-canvas);
	color: var(--bs-secondary-color);
	font-size: .95rem;
	text-align: center;
}

.front-note i { margin-right: .4rem; color: var(--ismo-green-700); }

/* seznam pro úřad */
.front-list {
	display: grid;
	gap: .85rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.front-list li { display: flex; gap: .75rem; }

.front-list i {
	flex: none;
	display: grid;
	place-items: center;
	width: 1.6rem;
	height: 1.6rem;
	margin-top: .1rem;
	border-radius: 50%;
	background: var(--ismo-green-100);
	color: var(--ismo-green-700);
	font-size: .75rem;
}

/* náhled přehledu administrace */
.panel {
	max-width: 30rem;
	margin: 0 auto;
	padding: 1.25rem;
	border: 1px solid var(--ismo-line);
	border-radius: 1.1rem;
	background: var(--ismo-canvas);
	box-shadow: var(--ismo-shadow-panel);
}

.panel__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: .5rem;
	color: var(--ismo-green-900);
	font-size: 1.1rem;
}

.panel__row {
	display: flex;
	gap: .8rem;
	align-items: center;
	padding: .75rem 0;
	border-top: 1px solid var(--ismo-line);
}

.panel__row strong { display: block; color: var(--ismo-green-900); }
.panel__row span:not(.panel__dot) { color: var(--bs-secondary-color); font-size: .9rem; }

.panel__dot {
	flex: none;
	display: grid;
	place-items: center;
	width: 2.2rem;
	height: 2.2rem;
	border-radius: .65rem;
	background: var(--accent-bg);
	color: var(--accent-ink);
}

.panel__tiles {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: .6rem;
	margin-top: .5rem;
	padding-top: 1rem;
	border-top: 1px solid var(--ismo-line);
}

.panel__tile {
	padding: .7rem .75rem;
	border-radius: .8rem;
	background: var(--accent-bg);
	color: var(--accent-text);
	line-height: 1.2;
}

.panel__tile b { display: block; font-size: 1.5rem; font-weight: 800; }
.panel__tile span { color: var(--accent-muted); font-size: .8rem; }

/* kroky zavedení */
.steps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.steps__item {
	position: relative;
	padding: 1.5rem;
	border: 1px solid var(--ismo-line);
	border-radius: 1rem;
	background: var(--ismo-canvas);
}

.steps__no {
	display: inline-grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	margin-bottom: .9rem;
	border-radius: 50%;
	background: var(--ismo-green-700);
	color: #fff;
	font-weight: 800;
}

.steps__item h3 { margin-bottom: .35rem; font-size: 1.15rem; font-weight: 700; }
.steps__item p { margin: 0; color: var(--bs-secondary-color); }

/* bezpečnost */
.secure {
	height: 100%;
	padding: 1.5rem;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 1rem;
	background: rgba(255, 255, 255, .05);
}

.secure > i { margin-bottom: .9rem; color: var(--ismo-green-on-dark); font-size: 1.6rem; }
body.front .secure h3 { margin-bottom: .4rem; color: #fff; font-size: 1.15rem; font-weight: 700; }
.secure p { margin: 0; color: var(--ismo-green-on-dark-2); }

/* otázky */
.front-faq .accordion-item {
	margin-bottom: .75rem;
	border: 1px solid var(--ismo-line);
	border-radius: .9rem !important;
	background: var(--ismo-canvas);
	overflow: hidden;
}

.front-faq .accordion-button {
	background: var(--ismo-canvas);
	color: var(--ismo-green-900);
	font-size: 1.05rem;
	font-weight: 700;
	box-shadow: none;
}

.front-faq .accordion-button:not(.collapsed) { background: var(--ismo-green-100); color: var(--ismo-green-900); }
.front-faq .accordion-body { color: var(--bs-body-color); }

/* kontakt */
.front-cta {
	padding: 4rem 0;
	background: var(--ismo-green-700);
	color: #fff;
}

body.front .front-cta h2 { margin-bottom: .6rem; color: #fff; font-size: clamp(1.6rem, 3vw, 2.25rem); font-weight: 800; }
.front-cta p { margin: 0; color: var(--ismo-green-on-dark-2); font-size: 1.1rem; }

.front-contact {
	display: grid;
	gap: .8rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.front-contact li { display: flex; gap: .8rem; align-items: center; }
.front-contact i { width: 1.5rem; color: var(--ismo-green-on-dark); text-align: center; }
.front-contact a { color: #fff; font-weight: 700; }

/* patička */
.front-foot {
	padding: 1.75rem 0;
	background: var(--ismo-green-900);
	color: var(--ismo-green-on-dark-2);
	font-size: .9rem;
}

.front-foot img { display: block; height: 1.8rem; width: auto; }
.front-foot a { color: var(--ismo-green-on-dark-2); }
.front-foot a:hover { color: #fff; }
.front-foot__links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0; padding: 0; list-style: none; }

/* právní texty (zásady ochrany osobních údajů) */
.legal__body { max-width: 50rem; margin: 0 auto; line-height: 1.65; }
.legal h1 { margin: .4rem 0 .25rem; color: var(--ismo-green-900); font-size: clamp(1.9rem, 4vw, 2.6rem); font-weight: 800; }
.legal h2 { margin: 2.75rem 0 .9rem; color: var(--ismo-green-900); font-size: 1.4rem; font-weight: 800; scroll-margin-top: 1.5rem; }
.legal h3 { margin: 1.5rem 0 .6rem; font-size: 1.1rem; font-weight: 700; }
.legal__meta { margin-bottom: 1.5rem; color: var(--bs-secondary-color); }
.legal__lead { font-size: 1.1rem; }
.legal ul { padding-left: 1.25rem; }
.legal li { margin-bottom: .45rem; }
.legal li ul { margin-top: .45rem; }
.legal__toc { margin: 2rem 0; padding: 1.25rem 1.5rem; border-radius: .75rem; background: var(--ismo-surround); }
.legal__toc ol { columns: 2 16rem; margin: 0; padding-left: 1.25rem; }
.legal__toc li { margin-bottom: .3rem; break-inside: avoid; }
.legal__table { margin-bottom: 1rem; font-size: .95rem; }
.legal__table th[scope=row] { white-space: nowrap; color: var(--ismo-green-900); }
.legal__table thead th { color: var(--bs-secondary-color); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }

@media (max-width: 991.98px) {
	.front-hero { padding: 2.5rem 0 3.5rem; }
	.front-section { padding: 3.5rem 0; }
	.front-nav .navbar-collapse { padding-bottom: .75rem; }
}
