/* Fastorm — produktový web (fastorm.sk). Svetlá téma, jedna. */

@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("fonts/InterVariable.woff2") format("woff2");
}

:root {
	--fm-blue-50:  #f2f7fd;
	--fm-blue-100: #e4eefa;
	--fm-blue-200: #c8dcf3;
	--fm-blue-300: #97bce7;
	--fm-blue-400: #5590d5;
	--fm-blue-500: #2b6cb8;   /* primary */
	--fm-blue-600: #1f5596;
	--fm-blue-700: #17427a;
	--fm-blue-900: #0f2b50;

	--fm-green: #146b3d;
	--fm-green-bg: #e8f6ee;
	--fm-amber: #855400;
	--fm-amber-bg: #fdf3e0;
	--fm-red: #b3372f;

	--fm-ink: #16202b;
	--fm-muted: #59687a;
	--fm-line: #dfe7f1;
	--fm-card: #ffffff;
}

[data-bs-theme="light"] {
	--bs-primary: var(--fm-blue-500);
	--bs-primary-rgb: 43, 108, 184;
	--bs-body-bg: #f6f9fc;
	--bs-body-color: var(--fm-ink);
	--bs-secondary-color: var(--fm-muted);
	--bs-secondary-rgb: 89, 104, 122;
	--bs-link-color: var(--fm-blue-600);
	--bs-link-hover-color: var(--fm-blue-700);
	/* BS 5.3 farbí <a> cez *-rgb premenné — bez nich by ostala default #0d6efd (kontrast 3,7:1) */
	--bs-link-color-rgb: 31, 85, 150;
	--bs-link-hover-color-rgb: 23, 66, 122;
	--bs-border-color: var(--fm-line);
	--bs-emphasis-color: var(--fm-blue-900);
}

body {
	font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	background: var(--bs-body-bg);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .fm-display {
	letter-spacing: -.02em;
	color: var(--fm-blue-900);
	font-weight: 800;
}

.fm-lead { font-size: 1.125rem; line-height: 1.65; color: var(--fm-muted); }

/* ---------- skip link ---------- */
.fm-skip {
	position: absolute; left: -9999px; top: 0; z-index: 2000;
	background: var(--fm-blue-700); color: #fff; padding: .75rem 1.25rem;
	border-radius: 0 0 .5rem 0; font-weight: 600;
}
.fm-skip:focus { left: 0; color: #fff; }

/* ---------- navbar ---------- */
.fm-navbar {
	background: rgba(255, 255, 255, .93);
	backdrop-filter: saturate(180%) blur(8px);
	border-bottom: 1px solid var(--fm-line);
}
.fm-brand {
	font-weight: 800; font-size: 1.45rem; letter-spacing: -.03em;
	color: var(--fm-blue-900) !important; display: inline-flex; align-items: center; gap: .55rem;
}
.fm-brand-mark {
	width: 30px; height: 30px; border-radius: 8px; flex: none;
	background: linear-gradient(135deg, var(--fm-blue-500), var(--fm-blue-700));
	color: #fff; font-size: .95rem; display: inline-flex; align-items: center; justify-content: center;
}
.fm-navbar .nav-link { color: var(--fm-ink); font-weight: 500; padding-inline: 0; }
/* Vodorovné menu potrebuje vzdušné rozostupy, ale na užšom desktope sa musí zmestiť
   vedľa značky a CTA — preto rastú s šírkou okna. */
/* Osem položiek + CTA potrebuje pri 32px medzerách 1071 px; kontajner medzi 992 a 1199 px
   má len 960, preto sa menu rozbaľuje až od xl (nižšie ostáva hamburger). */
@media (min-width: 1200px) {
	.fm-navbar .navbar-nav { column-gap: 2rem; }
}
@media (min-width: 1400px) {
	.fm-navbar .navbar-nav { column-gap: 2.75rem; }
}
.fm-navbar .nav-link:hover, .fm-navbar .nav-link:focus-visible { color: var(--fm-blue-600); }
.fm-navbar .nav-link[aria-current="page"] { color: var(--fm-blue-600); font-weight: 600; }

/* ---------- hero ---------- */
.fm-hero {
	background:
		radial-gradient(1100px 480px at 78% -18%, var(--fm-blue-100) 0%, rgba(228, 238, 250, 0) 62%),
		linear-gradient(180deg, #fbfdff 0%, #f2f7fd 100%);
	border-bottom: 1px solid var(--fm-line);
	padding: clamp(3rem, 7vw, 5.5rem) 0 clamp(2.5rem, 5vw, 4rem);
}
.fm-hero h1 { font-size: clamp(2.05rem, 4.4vw, 3.35rem); line-height: 1.12; }
.fm-eyebrow {
	display: inline-flex; align-items: center; gap: .45rem;
	background: #fff; border: 1px solid var(--fm-blue-200); color: var(--fm-blue-700);
	font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
	padding: .4rem .85rem; border-radius: 999px;
}

.fm-slogan {
	font-size: clamp(1.05rem, 1.7vw, 1.3rem); font-weight: 700; color: var(--fm-blue-600);
	letter-spacing: -.01em; margin: 0;
}

/* ---------- cenník ---------- */
.fm-price { font-size: 2.4rem; font-weight: 800; color: var(--fm-blue-900); line-height: 1.1; }
.fm-price-unit { font-size: 1rem; font-weight: 600; color: var(--fm-muted); }
.fm-plan-top { border-color: var(--fm-blue-300); box-shadow: 0 10px 34px rgba(15, 43, 80, .12); position: relative; }
.fm-plan-badge {
	position: absolute; top: -.75rem; right: 1.25rem;
	background: var(--fm-blue-600); color: #fff; font-size: .74rem; font-weight: 700;
	padding: .25rem .7rem; border-radius: 999px; letter-spacing: .02em;
}

/* ---------- tlačidlá ---------- */
.btn-primary {
	--bs-btn-bg: var(--fm-blue-600); --bs-btn-border-color: var(--fm-blue-600);
	--bs-btn-hover-bg: var(--fm-blue-700); --bs-btn-hover-border-color: var(--fm-blue-700);
	--bs-btn-active-bg: var(--fm-blue-900); --bs-btn-active-border-color: var(--fm-blue-900);
	--bs-btn-disabled-bg: var(--fm-blue-400); --bs-btn-disabled-border-color: var(--fm-blue-400);
	font-weight: 600;
}
.btn-outline-primary {
	--bs-btn-color: var(--fm-blue-700); --bs-btn-border-color: var(--fm-blue-300);
	--bs-btn-hover-bg: var(--fm-blue-600); --bs-btn-hover-border-color: var(--fm-blue-600);
	--bs-btn-active-bg: var(--fm-blue-700); --bs-btn-active-border-color: var(--fm-blue-700);
	font-weight: 600; background: #fff;
}
.btn-lg { padding: .8rem 1.6rem; font-size: 1.02rem; border-radius: .6rem; }

/* ---------- sekcie a karty ---------- */
.fm-section { padding: clamp(3rem, 6vw, 4.75rem) 0; }
.fm-section-alt { background: #fff; border-block: 1px solid var(--fm-line); }
.fm-section-head { max-width: 46rem; }

.fm-card { position: relative;
	background: var(--fm-card); border: 1px solid var(--fm-line); border-radius: 14px;
	padding: 1.6rem; height: 100%;
	box-shadow: 0 1px 2px rgba(15, 43, 80, .04);
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.fm-card-hover:hover { box-shadow: 0 10px 30px rgba(15, 43, 80, .09); transform: translateY(-2px); border-color: var(--fm-blue-200); }
.fm-card h3 { font-size: 1.12rem; margin-bottom: .5rem; }
.fm-card p { color: var(--fm-muted); margin-bottom: 0; line-height: 1.6; }

.fm-icon {
	width: 44px; height: 44px; border-radius: 11px; margin-bottom: 1rem;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--fm-blue-100); color: var(--fm-blue-600); font-size: 1.3rem;
}
.fm-icon-green { background: var(--fm-green-bg); color: var(--fm-green); }
.fm-icon-amber { background: var(--fm-amber-bg); color: var(--fm-amber); }

/* ---------- kroky ---------- */
.fm-step { display: flex; gap: 1.1rem; align-items: flex-start; }
.fm-step-num {
	flex: none; width: 42px; height: 42px; border-radius: 50%;
	background: var(--fm-blue-600); color: #fff; font-weight: 800; font-size: 1.05rem;
	display: inline-flex; align-items: center; justify-content: center;
}
.fm-step h3 { font-size: 1.08rem; margin-bottom: .35rem; }
.fm-step p { color: var(--fm-muted); margin-bottom: 0; line-height: 1.6; }

/* ---------- ukážka „chýba doklad" ---------- */
.fm-demo {
	background: #fff; border: 1px solid var(--fm-line); border-radius: 14px; overflow: hidden;
	box-shadow: 0 12px 38px rgba(15, 43, 80, .10);
}
.fm-demo-head {
	background: var(--fm-blue-900); color: #fff; padding: .8rem 1.15rem;
	font-size: .88rem; font-weight: 600; display: flex; align-items: center; gap: .5rem;
}
.fm-demo-row {
	display: flex; align-items: center; gap: .9rem; padding: .85rem 1.15rem;
	border-top: 1px solid var(--fm-line); font-size: .92rem;
}
.fm-demo-row:first-of-type { border-top: 0; }
.fm-demo-date { color: var(--fm-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.fm-demo-amount { margin-left: auto; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fm-demo-who { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fm-tag {
	font-size: .74rem; font-weight: 700; padding: .2rem .55rem; border-radius: 999px;
	white-space: nowrap; letter-spacing: .01em;
}
.fm-tag-ok { background: var(--fm-green-bg); color: var(--fm-green); }
.fm-tag-miss { background: var(--fm-amber-bg); color: var(--fm-amber); }
.fm-demo-row-miss { background: #fffaf1; }

/* ---------- zoznamy s odškrtnutím ---------- */
.fm-checks { list-style: none; padding: 0; margin: 0; }
.fm-checks li { position: relative; padding-left: 1.9rem; margin-bottom: .7rem; line-height: 1.6; }
.fm-checks li::before {
	content: "\F26E"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: -.1rem;
	color: var(--fm-green); font-size: 1.15rem;
}

/* ---------- FAQ ---------- */
.accordion { --bs-accordion-border-color: var(--fm-line); --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem rgba(43, 108, 184, .2); }
.accordion-button { font-weight: 600; color: var(--fm-blue-900); }
.accordion-button:not(.collapsed) { background: var(--fm-blue-50); color: var(--fm-blue-700); box-shadow: none; }
.accordion-body { color: var(--fm-muted); line-height: 1.65; }

/* ---------- CTA pruh ---------- */
.fm-cta {
	background: linear-gradient(135deg, var(--fm-blue-700), var(--fm-blue-900));
	color: #fff; border-radius: 18px; padding: clamp(2rem, 4vw, 3rem);
}
.fm-cta h2 { color: #fff; }
.fm-cta p { color: #c9dcf2; margin-bottom: 0; }
.fm-cta .btn-light { --bs-btn-color: var(--fm-blue-700); font-weight: 700; }

/* ---------- formulár ---------- */
.fm-form .form-label { font-weight: 600; font-size: .93rem; color: var(--fm-ink); }
.fm-form .form-control { border-color: var(--fm-line); padding: .65rem .85rem; }
.fm-form .form-control:focus { border-color: var(--fm-blue-400); box-shadow: 0 0 0 .22rem rgba(43, 108, 184, .16); }
.fm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- footer ---------- */
.fm-footer {
	background: var(--fm-blue-900); color: #b9cde6; padding: 3rem 0 1.75rem; margin-top: 0;
}
.fm-footer h2, .fm-footer h3 { color: #fff; font-size: 1rem; margin-bottom: .9rem; }
.fm-footer a { color: #b9cde6; text-decoration: none; }
.fm-footer a:hover, .fm-footer a:focus-visible { color: #fff; text-decoration: underline; }
.fm-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .13); margin-top: 2rem; padding-top: 1.25rem; font-size: .875rem; }

/* ---------- cookie lišta ---------- */
.fm-cookie {
	position: fixed; inset: auto 1rem 1rem 1rem; z-index: 1080; max-width: 34rem; margin-inline: auto;
	background: #fff; border: 1px solid var(--fm-line); border-radius: 14px; padding: 1.15rem 1.25rem;
	box-shadow: 0 18px 48px rgba(15, 43, 80, .22);
}
.fm-cookie p { font-size: .9rem; color: var(--fm-muted); margin-bottom: .9rem; line-height: 1.55; }

/* ---------- obsahové stránky ---------- */
.fm-prose h2 { font-size: 1.3rem; margin: 2.2rem 0 .8rem; }
.fm-prose h3 { font-size: 1.08rem; margin: 1.5rem 0 .6rem; }
.fm-prose p, .fm-prose li { color: #364354; line-height: 1.7; }
/* default BS kód je ružový #d63384 = 4,0:1 na bielej */
code { color: var(--fm-blue-700); background: var(--fm-blue-50); padding: .1rem .35rem; border-radius: .25rem; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ---------- „V skratke" (answer-first blok) ---------- */
.fm-section-brief { padding: clamp(1.75rem, 3vw, 2.5rem) 0 0; }
.fm-brief {
	background: var(--fm-blue-50); border: 1px solid var(--fm-blue-200); border-left: 4px solid var(--fm-blue-500);
	border-radius: 12px; padding: 1.35rem 1.5rem;
}
.fm-brief p { color: #33435a; line-height: 1.7; margin: 0; }

/* ---------- blog ---------- */
.fm-post-date { color: var(--fm-muted); font-size: .88rem; margin: 0; }
.fm-card h2 a { color: var(--fm-blue-900); }
.fm-card h2 a:hover, .fm-card h2 a:focus-visible { color: var(--fm-blue-600); }
.fm-article h2 { font-size: 1.4rem; margin: 2.4rem 0 .85rem; }
.fm-article h3 { font-size: 1.12rem; margin: 1.8rem 0 .6rem; }
.fm-article p { margin-bottom: 1.1rem; font-size: 1.03rem; }
.fm-article ul { margin-bottom: 1.1rem; padding-left: 1.25rem; }
.fm-article li { margin-bottom: .5rem; }
.fm-article em { color: #2c3a4d; }

.fm-author {
	display: flex; gap: 1rem; align-items: flex-start;
	background: #fff; border: 1px solid var(--fm-line); border-radius: 14px; padding: 1.4rem;
}
.fm-author-mark {
	flex: none; width: 48px; height: 48px; border-radius: 50%;
	background: linear-gradient(135deg, var(--fm-blue-500), var(--fm-blue-700));
	color: #fff; font-weight: 800; font-size: .95rem;
	display: inline-flex; align-items: center; justify-content: center;
}

/* ---------- potvrdenie po odoslaní formulára ---------- */
.fm-flash {
	border-width: 0 0 0 4px; border-radius: 10px; font-weight: 500;
	align-items: flex-start;
}
.fm-flash:focus { outline: 3px solid var(--fm-blue-400); outline-offset: 2px; }
.fm-flash.alert-success { background: var(--fm-green-bg); border-left-color: var(--fm-green); color: #10502e; }
.fm-flash .bi { font-size: 1.15rem; }